/* Utilities (variables & mixins)
----------------------------------------*/
/* This section is for any SASS variables or 3rd party mixins you add. */
/*====================================
  VARIABLES & MIXINS
====================================*/
/* Prefixes
============================================*/
/* Colors
============================================*/
/* Fonts */
/* Media Queries
============================================*/
/*Placeholders
============================================*/
.nav-toggle, .nav-toggle__label {
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
}

/* Mixins
============================================*/
/* Base styles and general defaults
----------------------------------------*/
/* Base styles include setting heading sizes, default link styles, default font styles, and body backgrounds. They also include simple extensions of base elements with classes that don't belong in their own module e.g. adding striped to tables, or making a form display inline. */
/*! normalize.css v2.1.3 | MIT License | git.io/normalize */
/* ==========================================================================
   HTML5 display definitions
   ========================================================================== */
/**
 * Correct `block` display not defined in IE 8/9.
 */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section,
summary {
  display: block;
}

/**
 * Correct `inline-block` display not defined in IE 8/9.
 */
audio,
canvas,
video {
  display: inline-block;
}

/**
 * Prevent modern browsers from displaying `audio` without controls.
 * Remove excess height in iOS 5 devices.
 */
audio:not([controls]) {
  display: none;
  height: 0;
}

/**
 * Address `[hidden]` styling not present in IE 8/9.
 * Hide the `template` element in IE, Safari, and Firefox < 22.
 */
[hidden],
template {
  display: none;
}

/* ==========================================================================
   Base
   ========================================================================== */
/**
 * 1. Set default font family to sans-serif.
 * 2. Prevent iOS text size adjust after orientation change, without disabling
 *    user zoom.
 */
html {
  font-family: sans-serif;
  /* 1 */
  -ms-text-size-adjust: 100%;
  /* 2 */
  -webkit-text-size-adjust: 100%;
  /* 2 */
}

/**
 * Remove default margin.
 */
body {
  margin: 0;
}

/* ==========================================================================
   Links
   ========================================================================== */
/**
 * Remove the gray background color from active links in IE 10.
 */
a {
  background: transparent;
}

/**
 * Address `outline` inconsistency between Chrome and other browsers.
 */
a:focus {
  outline: thin dotted;
}

/**
 * Improve readability when focused and also mouse hovered in all browsers.
 */
a:active,
a:hover {
  outline: 0;
}

/* ==========================================================================
   Typography
   ========================================================================== */
/**
 * Address variable `h1` font-size and margin within `section` and `article`
 * contexts in Firefox 4+, Safari 5, and Chrome.
 */
h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

/**
 * Address styling not present in IE 8/9, Safari 5, and Chrome.
 */
abbr[title] {
  border-bottom: 1px dotted;
}

/**
 * Address style set to `bolder` in Firefox 4+, Safari 5, and Chrome.
 */
b,
strong {
  font-weight: bold;
}

/**
 * Address styling not present in Safari 5 and Chrome.
 */
dfn {
  font-style: italic;
}

/**
 * Address differences between Firefox and other browsers.
 */
hr {
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  height: 0;
}

/**
 * Address styling not present in IE 8/9.
 */
mark {
  background: #ff0;
  color: #000;
}

/**
 * Correct font family set oddly in Safari 5 and Chrome.
 */
code,
kbd,
pre,
samp {
  font-family: monospace, serif;
  font-size: 1em;
}

/**
 * Improve readability of pre-formatted text in all browsers.
 */
pre {
  white-space: pre-wrap;
}

/**
 * Set consistent quote types.
 */
q {
  quotes: "\201C" "\201D" "\2018" "\2019";
}

/**
 * Address inconsistent and variable font size in all browsers.
 */
small {
  font-size: 80%;
}

/**
 * Prevent `sub` and `sup` affecting `line-height` in all browsers.
 */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sup {
  top: -0.5em;
}

sub {
  bottom: -0.25em;
}

/* ==========================================================================
   Embedded content
   ========================================================================== */
/**
 * Remove border when inside `a` element in IE 8/9.
 */
img {
  border: 0;
}

/**
 * Correct overflow displayed oddly in IE 9.
 */
svg:not(:root) {
  overflow: hidden;
}

/* ==========================================================================
   Figures
   ========================================================================== */
/**
 * Address margin not present in IE 8/9 and Safari 5.
 */
figure {
  margin: 0;
}

/* ==========================================================================
   Forms
   ========================================================================== */
/**
 * Define consistent border, margin, and padding.
 */
fieldset {
  border: none;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em;
}

/**
 * 1. Correct `color` not being inherited in IE 8/9.
 * 2. Remove padding so people aren't caught out if they zero out fieldsets.
 */
legend {
  border: 0;
  /* 1 */
  padding: 0;
  /* 2 */
}

/**
 * 1. Correct font family not being inherited in all browsers.
 * 2. Correct font size not being inherited in all browsers.
 * 3. Address margins set differently in Firefox 4+, Safari 5, and Chrome.
 */
button,
input,
select,
textarea {
  font-family: inherit;
  /* 1 */
  font-size: 100%;
  /* 2 */
  margin: 0;
  /* 3 */
}

/**
 * Address Firefox 4+ setting `line-height` on `input` using `!important` in
 * the UA stylesheet.
 */
button,
input {
  line-height: normal;
}

/**
 * Address inconsistent `text-transform` inheritance for `button` and `select`.
 * All other form control elements do not inherit `text-transform` values.
 * Correct `button` style inheritance in Chrome, Safari 5+, and IE 8+.
 * Correct `select` style inheritance in Firefox 4+ and Opera.
 */
button,
select {
  text-transform: none;
}

/**
 * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
 *    and `video` controls.
 * 2. Correct inability to style clickable `input` types in iOS.
 * 3. Improve usability and consistency of cursor style between image-type
 *    `input` and others.
 */
button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
  -webkit-appearance: button;
  /* 2 */
  cursor: pointer;
  /* 3 */
}

/**
 * Re-set default cursor for disabled elements.
 */
button[disabled],
html input[disabled] {
  cursor: default;
}

/**
 * 1. Address box sizing set to `content-box` in IE 8/9/10.
 * 2. Remove excess padding in IE 8/9/10.
 */
input[type="checkbox"],
input[type="radio"] {
  box-sizing: border-box;
  /* 1 */
  padding: 0;
  /* 2 */
}

/**
 * 1. Address `appearance` set to `searchfield` in Safari 5 and Chrome.
 * 2. Address `box-sizing` set to `border-box` in Safari 5 and Chrome
 *    (include `-moz` to future-proof).
 */
input[type="search"] {
  -webkit-appearance: textfield;
  /* 1 */
  -moz-box-sizing: content-box;
  -webkit-box-sizing: content-box;
  /* 2 */
  box-sizing: content-box;
}

/**
 * Remove inner padding and search cancel button in Safari 5 and Chrome
 * on OS X.
 */
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * Remove inner padding and border in Firefox 4+.
 */
button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0;
}

/**
 * 1. Remove default vertical scrollbar in IE 8/9.
 * 2. Improve readability and alignment in all browsers.
 */
textarea {
  overflow: auto;
  /* 1 */
  vertical-align: top;
  /* 2 */
}

/* ==========================================================================
   Tables
   ========================================================================== */
/**
 * Remove most spacing between table cells.
 */
table {
  border-collapse: collapse;
  border-spacing: 0;
}

/*==========================================================================
  GENERAL
  ==========
  Sensible defaults for html & body elements
==========================================================================*/
*, *:before, *:after {
  box-sizing: border-box;
}

/* the follwing needs to happen asap in the load > render process
----------------------------------------*/
.js #regionSelectionButton {
  display: none;
}

#content {
  clear: both;
}

/* Base
-----------------------------------------*/
html,
button,
input,
select,
textarea {
  color: #222;
}

.carousel-slides {
  background: transparent url(data:image/gif;base64,R0lGODlhEAAQAPIAAP///39/f+Dg4KCgoH9/f7CwsMDAwMjIyCH+GkNyZWF0ZWQgd2l0aCBhamF4bG9hZC5pbmZvACH5BAAKAAAAIf8LTkVUU0NBUEUyLjADAQAAACwAAAAAEAAQAAADMwi63P4wyklrE2MIOggZnAdOmGYJRbExwroUmcG2LmDEwnHQLVsYOd2mBzkYDAdKa+dIAAAh+QQACgABACwAAAAAEAAQAAADNAi63P5OjCEgG4QMu7DmikRxQlFUYDEZIGBMRVsaqHwctXXf7WEYB4Ag1xjihkMZsiUkKhIAIfkEAAoAAgAsAAAAABAAEAAAAzYIujIjK8pByJDMlFYvBoVjHA70GU7xSUJhmKtwHPAKzLO9HMaoKwJZ7Rf8AYPDDzKpZBqfvwQAIfkEAAoAAwAsAAAAABAAEAAAAzMIumIlK8oyhpHsnFZfhYumCYUhDAQxRIdhHBGqRoKw0R8DYlJd8z0fMDgsGo/IpHI5TAAAIfkEAAoABAAsAAAAABAAEAAAAzIIunInK0rnZBTwGPNMgQwmdsNgXGJUlIWEuR5oWUIpz8pAEAMe6TwfwyYsGo/IpFKSAAAh+QQACgAFACwAAAAAEAAQAAADMwi6IMKQORfjdOe82p4wGccc4CEuQradylesojEMBgsUc2G7sDX3lQGBMLAJibufbSlKAAAh+QQACgAGACwAAAAAEAAQAAADMgi63P7wCRHZnFVdmgHu2nFwlWCI3WGc3TSWhUFGxTAUkGCbtgENBMJAEJsxgMLWzpEAACH5BAAKAAcALAAAAAAQABAAAAMyCLrc/jDKSatlQtScKdceCAjDII7HcQ4EMTCpyrCuUBjCYRgHVtqlAiB1YhiCnlsRkAAAOwAAAAAAAAAAAA==) 460px 140px no-repeat;
}

body {
  text-align: center;
  background-color: #f6e9df;
}

@media screen and (min-width: 1024px) {
  body {
    background-repeat: no-repeat;
    background-position: top left;
    background-attachment: fixed;
    background-size: cover;
    background-image: url("/health/assets/images/bg-summer-sml.jpg");
  }
}

@media screen and (min-width: 1280px) {
  body {
    background-image: url("/health/assets/images/bg-summer-med.jpg");
  }
}

@media screen and (min-width: 1920px) {
  body {
    background-image: url("/health/assets/images/bg-summer-big.jpg");
  }
}

a {
  color: #000;
  text-decoration: none;
}

a:hover, a :focus, a :active {
  text-decoration: underline;
}

/* Selection
----------------------------------------*/
::-moz-selection {
  background: #EC0928;
  text-shadow: none;
}

::selection {
  background: #EC0928;
  text-shadow: none;
}

/* Header
----------------------------------------*/
.logo {
  display: none;
  position: relative;
  background: url("/health/assets-public/images/ui-elements/slimming-world.gif");
  background-image: url("/health/assets-public/images/logo-2015.svg"), none;
  background-size: contain;
  background-repeat: no-repeat;
  overflow: hidden;
  text-indent: 200%;
  white-space: nowrap;
  margin: 0.5em 0 0 0.75em;
  width: 180px;
  height: 112px;
  float: left;
  transition: all 125ms ease-out;
}

/*.logo:after {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  content: 'touching hearts, changing lives';
  display: block;
  min-width: 100%;
  display: block;
  height: 2em;
  background-image: url("/health/assets-public/images/tagline-2015.svg"), none;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}*/

@media (max-width: 640px) {
  .logo {
    width: 140px;
    height: 80px;
    margin: 2em auto 0.25em auto;
    float: none;
  }
  .logo:after {
    display: none;
  }
}

.logo:hover, .logo :active, .logo :focus {
  transform: scale(1.05);
}

@media screen and (min-width: 1024px) {
  .logo {
    display: block;
  }
}

.logo-mobile {
  position: absolute;
  background-image: url("/health/assets-public/images/logo-2015.svg");
  background-repeat: no-repeat;
  height: 70px;
  width: 140px;
  display: block;
  z-index: 1;
  margin: 0px;
}

@media screen and (min-width: 1024px) {
  .logo-mobile {
    display: none;
  }
}

/* Footer
---------------------------------------------------------*/
footer {
  color: #000;
  margin: auto;
}

@media only screen and (min-width: 960px) {
  footer {
    width: 678px;
  }
}

footer a {
  color: #000;
}

footer li {
  display: inline;
  border-right: solid 1px #000;
}

footer a {
  margin: 0px 6px 0px 4px;
}

@media only screen and (min-width: 960px) {
  footer li:nth-child(8) {
    border-right: none;
  }
}

footer li:last-child {
  border-right: none;
}

.skip {
  position: absolute;
  left: -100%;
}

.panel, .side-nav ul a {
  background-color: #f0f0f0;
  margin-bottom: 0.65em;
  padding: 0 6px;
  padding-bottom: 0.65em;
}

.panel p:first-of-type, .side-nav ul a p:first-of-type {
  margin-top: 15px;
}

.panel img:first-of-type, .side-nav ul a img:first-of-type {
  margin-top: 15px;
}

.body-panel {
  border: 1px solid #e5e0e0;
  background: #e5e3e2;
  background-image: -o-linear-gradient(#e9e8e8 0, #e5e3e2 50%, #dfdede 100%);
  background-image: -ms-linear-gradient(#e9e8e8 0, #e5e3e2 50%, #dfdede 100%);
  background-image: -moz-linear-gradient(#e9e8e8 0, #e5e3e2 50%, #dfdede 100%);
  background-image: -webkit-linear-gradient(#e9e8e8 0, #e5e3e2 50%, #dfdede 100%);
  background-image: linear-gradient(#e9e8e8 0, #e5e3e2 50%, #dfdede 100%);
  margin-bottom: 0.65em;
  padding: 15px;
}

.body-panel p {
  margin: 0px;
}

.no-top-margin {
  margin-top: 0;
}

#get-in-group sup {
  font-size: 11px;
}

h2.venue.result-title + p {
  margin-bottom: 0;
}

/* Footer ul: this CSS removes the 40px left padding on the footer links, inherited from all UL's in the site.
---------------------------------------------------------*/
footer ul {
  -webkit-padding-start: 0px;
}

.mobile-scroll-hint.mobile-scroll-hint-sw {
  display: none;
}

@media screen and (max-width: 414px) {
  .mobile-scroll-hint.mobile-scroll-hint-sw {
    background-color: #E8E8E8;
    display: block;
    position: fixed;
    width: 100%;
    left: 0;
    bottom: 0;
    opacity: 0.8;
    height: 3em;
    z-index: 99999;
  }
  .mobile-scroll-hint.mobile-scroll-hint-sw .button {
    width: 2em;
    height: 2em;
    margin: 0 auto;
    position: relative;
    color: #ffffff;
    text-align: center;
    z-index: 99;
  }
  .mobile-scroll-hint.mobile-scroll-hint-sw .button img {
    padding-top: 0.5em;
  }
}

/* Sidebar
----------------------------------------*/
#additional a:hover {
  text-decoration: none;
}

.floated-thumb {
  float: left;
  clear: none;
  display: inline;
  margin-right: 6px;
  padding: 3px;
  border: 1px solid #ccc;
  background-color: #fff;
}

.smallDetail {
  font-size: 11px;
  margin-bottom: 5px;
  color: #333;
}

/* login form */
.register-option li {
  width: 45%;
  float: left;
}

.register-link {
  clear: both;
  display: block;
  float: left;
}

.login-group-search {
  margin-top: 1.5em;
  margin-bottom: 1.5em;
  position: relative;
  display: block;
  clear: both;
  float: left;
}

.login-group-search p {
  display: block;
}

#swo-register {
  display: block;
  clear: both;
  margin-top: 1em;
  margin-bottom: 1.5em;
}

#content {
  margin: 0;
  padding: 0;
  position: relative;
  top: 0;
}

.hide, .no-js noscript iframe {
  display: none;
}

.page-header {
  border-bottom-left-radius: 8px;
  border-bottom-right-radius: 8px;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
  margin-bottom: 10px;
}

.body-image {
  position: relative;
  padding: 3px;
  border: 1px solid #ccc;
  background-color: #fff;
  margin: 10px;
}

@media screen and (max-width: 640px) {
  .body-image {
    width: 100%;
    margin: 0 auto;
  }
  .body-image img {
    width: 100%;
  }
}

.body-image i {
  color: #AA0E0E;
  font: 13px Georgia,Times,"Times New Roman",serif;
}

.body-image:before, .bodyimage:after {
  z-index: -1;
  position: absolute;
  content: "";
  bottom: 15px;
  left: 10px;
  width: 50%;
  top: 80%;
  max-width: 300px;
  background: #777;
  box-shadow: 0 15px 10px #777;
  transform: rotate(-3deg);
}

.body-image:after {
  transform: rotate(3deg);
  right: 10px;
  left: auto;
}

#collapsible a {
  border-radius: 3px;
  color: #FFFFFF;
  cursor: pointer;
  display: block;
  font: bold 0.85em Arial,sans-serif;
  margin: 10px 0;
  padding: 10px 47px 10px 10px;
  text-decoration: none;
}

#collapsible span {
  display: block;
  cursor: pointer;
  font-size: 14px;
  font: 0.81818em "Helvetica Neue", Helvetica, Arial, sans-serif;
  padding-bottom: 20px;
}

#collapsible a.up {
  background: url("../images/features/question-and-answer/all/arrow-down.png") no-repeat right #a5b779;
}

#collapsible a.down {
  background: url("../images/features/question-and-answer/all/arrow-up.png") no-repeat right #a5b779;
}

#main ul.benefits li {
  background: url("http://www.slimmingworld.co.uk/assets/images/hp/autumn14/xb-heart.png.pagespeed.ic.fwGKnZQt6d.png") no-repeat scroll left top transparent;
  left: -15px;
  padding-left: 36px;
  top: -10px;
  margin-bottom: 15px;
}

#main ul.benefits li strong {
  font: italic 13px georgia,serif;
  font-size: 1.4em;
}

.first-col {
  width: 299px;
  margin: 0px 6px 0px 0px;
  float: left;
}

.second-col {
  width: 299px;
  margin: 0px 6px 0px 0px;
  float: left;
}

address ul li {
  list-style-type: none;
  line-height: .8em;
}

#wrapper a.normalise {
  border-radius: 0px;
  color: #000;
  cursor: pointer;
  display: inline;
  font: bold 0.85em Arial,sans-serif;
  margin: 0px 0;
  padding: 0px;
  text-decoration: underline;
}

#wrapper a.normalise:hover {
  background-color: #fff;
  color: red;
}

/* Press release page */
.press-release-listing h3,
.press-release-listing hr {
  clear: both;
}

.press-release-listing .release-image {
  width: 80px;
  height: 80px;
  float: left;
  margin: 5px 10px 10px 0px;
  border: 1px solid #ccc;
}

/* geo location notifications */
#geo-notification {
  color: #fff;
  position: fixed;
  top: 50%;
  left: 0px;
  z-index: 999999;
  width: 100%;
  background-color: #c00;
  padding: 10px;
  opacity: .9;
  display: none;
}

#geo-notification img:before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  transition: all .3s linear;
  background: rgba(0, 0, 255, 0.5);
  display: none;
}

#geo-notification.geo-loading {
  background: url("/health/assets-public/images/ui-elements/loading.png") no-repeat center top;
  display: block;
  position: initial;
  top: initial;
  left: initial;
  min-height: 30px;
  width: 30px;
  -webkit-animation-name: spinnerRotate;
  -webkit-animation-duration: 3s;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
  -moz-animation-name: spinnerRotate;
  -moz-animation-duration: 3s;
  -moz-animation-iteration-count: infinite;
  -moz-animation-timing-function: linear;
  -ms-animation-name: spinnerRotate;
  -ms-animation-duration: 3s;
  -ms-animation-iteration-count: infinite;
  -ms-animation-timing-function: linear;
}

#geo-notification.geo-loading + #js-getlocation {
  display: none;
}

@-webkit-keyframes spinnerRotate {
  from {
    -webkit-transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(360deg);
  }
}

@-moz-keyframes spinnerRotate {
  from {
    -moz-transform: rotate(0deg);
  }
  to {
    -moz-transform: rotate(360deg);
  }
}

@-ms-keyframes spinnerRotate {
  from {
    -ms-transform: rotate(0deg);
  }
  to {
    -ms-transform: rotate(360deg);
  }
}

/* .find-a-group is home page */
.find-a-group #geo-notification.geo-loading {
  -webkit-filter: invert(100%);
  filter: invert(100%);
  margin: 50px auto 0 auto;
}

/* .form-search is nearest-group.aspx */
.form-search #geo-notification.geo-loading {
  width: inherit;
  margin-top: 10px;
}

/* page speed test */
.hp-section .social a {
  float: left;
}

/* awards landing */
#main .award {
  width: 100%;
}

/*==========================================================================
  Links
  ===========
  Sensible defaults for anchor links
==========================================================================*/
/*==========================================================================
  TYPOGRAPHY
  ==========
  Sensible defaults for html elements and some enhancements with classes
==========================================================================*/
h1, h2, h3, h4, h5, h6 {
  font: 1.75em/1.5 Sorts Mill Goudy, Georgia, Times, Times New Roman, serif;
  margin-bottom: 0.65em;
  margin-top: 0.325em;
  color: #921515;
  display: block;
}

h4 {
  font-size: 1.3em;
  line-height: 1.2em;
}

h4.clear {
  clear: both;
}

#main h1, #main h2, #main h3, #main h4, #main h5, #main h6 {
  margin: 0;
  margin-bottom: 0.65em;
}

#main h2, #main h3, #main h4, #main h5, #main h6, #main p, #main li {
  margin-left: .5rem;
  margin-right: .5rem;
}

li, dl {
  font: 0.875em Arial, sans-serif;
  margin-bottom: 0.65em;
  line-height: 1.6;
}

p {
  font: 0.875em Arial, sans-serif;
  margin: 0.1em 0 1em;
  line-height: 1.75;
}

li p, li li {
  font-size: 100%;
}

#main a {
  text-decoration: underline;
}

#main a:hover, #main a :focus, #main a :active {
  text-decoration: none;
}

.pp_pic_holder a {
  text-decoration: underline;
}

.pp_pic_holder a:hover, .pp_pic_holder a :focus, .pp_pic_holder a :active {
  text-decoration: none;
}

#main a.btn, #main a.btn-small {
  text-decoration: none;
}

#additional ul {
  margin: 0 0.5em;
  padding: 0;
}

#additional li {
  font: 0.79545em Arial, sans-serif;
  margin-bottom: 1.5em;
}

#additional .side-nav li {
  margin-bottom: 3px;
}

#additional .side-nav li a {
  text-decoration: none;
}

#additional li ul {
  margin-top: 0.65em;
}

#additional li ul li {
  font-size: 100%;
}

.panel h3, .side-nav ul a h3 {
  margin: 0.5em 0 0.5em 0.3em !important;
}

.panel h4, .side-nav ul a h4 {
  font-size: 1.1em;
  line-height: 1.2;
  font-family: 'Source Sans Pro', sans-serif;
  padding: 0;
  margin: 1em 0.5em;
}

.panel h4 br, .side-nav ul a h4 br {
  display: none;
}

.panel a h5, .side-nav ul a a h5 {
  font-size: 1.05em;
  text-decoration: none;
  border-bottom: none;
}

#additional .panel img, #additional .side-nav ul a img, .side-nav ul #additional a img {
  width: 100%;
}

.note {
  float: right;
  font-size: 75%;
  font-weight: bold;
  margin-bottom: 0;
  margin-right: 0;
  margin-top: 18px;
  text-align: center;
  width: 226px;
}

/* Quotes
----------------------------------------*/
blockquote {
  color: #921515;
  padding: 0 0 0 3.3em;
  font-style: italic;
  line-height: 1.5;
  background: transparent url(/health/assets/images/quote-l.png) top left no-repeat;
  display: table;
  margin: 0px;
}

blockquote p {
  font: 1.09375em/1.4 "Sorts Mill Goudy", Georgia, Times, "Times New Roman", serif;
  padding-right: 3.3em;
  font-style: italic;
  min-height: 40px;
  display: inline-block;
}

blockquote p:last-of-type {
  background: transparent url(/health/assets/images/quote-r.png) right 0px bottom 18px no-repeat;
}

cite {
  color: #333;
  font-size: 80%;
  font-weight: bold;
}

/* Lists
----------------------------------------*/
.list-unstyled, .side-nav ul {
  padding-left: 0px;
}

.list-unstyled > li, .side-nav ul > li {
  list-style-type: none;
  list-style-position: outside;
}

.list-inline > li {
  display: inline;
}

.tick-list li {
  padding-left: 22px;
  background: transparent url(/health/assets/images/ui-elements/tick-green.png) left center no-repeat;
  list-style-type: none;
}

li.tick-list-top {
  padding-left: 22px;
  background: transparent url(/health/assets/images/ui-elements/tick-green.png) left top no-repeat;
  list-style-type: none;
}

#main .tick-list {
  margin-left: 0;
}

#main ul {
  margin-left: 18px;
  list-style-position: outside;
  padding: 0;
}

/* Alignment
----------------------------------------*/
.text-l {
  text-align: left;
}

.text-r {
  text-align: right;
}

.text-c {
  text-align: center;
}

/* Emphasis
----------------------------------------*/
.lead {
  font-size: 1.4em;
}

.feature-intro {
  font-size: 1em;
  line-height: 1.4em;
}

.formerror {
  color: red;
  font-size: 0.8em;
  margin-bottom: 10px;
}

.intro {
  font-size: 0.95em;
}

.hidden-text {
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
  height: 0;
  margin: 0;
  padding: 0;
}

ol.emphasized {
  margin-top: 0px;
}

ol.emphasized a {
  text-decoration: underline;
}

ol.emphasized a:hover {
  color: #921515;
}

ol.emphasized li {
  left: -21px;
  position: relative;
}

ol.emphasized em {
  font-size: 1.2em;
  display: block;
}

li.correct {
  color: #34a747;
}

span.more-info {
  color: #2e6094;
  font-style: italic;
}

.drop-cap {
  float: left;
  font-size: 2.8em;
  font-weight: bold;
  line-height: 1em;
  margin-right: 10px;
}

/* Glyphs
----------------------------------------*/
/*==========================================================================
  FORMS
  ===========
  Sensible defaults for form elements and some enhancements with classes
==========================================================================*/
/* General
----------------------------------------*/
legend {
  font-weight: bold;
  margin: 0.65em;
}

.radio input {
  margin-right: 12px;
}

header .group-search {
  width: 198px;
  float: right;
  clear: none;
  padding: 0;
  margin-top: 36px;
}

header .group-search .note {
  margin: 0px;
}

.lt-ie8 header .group-search {
  zoom: 1;
  display: block;
  clear: none;
  width: 210px;
}

.lt-ie8 header .group-search .btn-small {
  margin: 0;
}

.group-search__input {
  width: 132px;
  font-family: Arial, sans-serif;
  font-size: 0.8em;
}

.group-search label {
  font-family: "Sorts Mill Goudy", Georgia, Times, "Times New Roman", serif;
}

#additional .search {
  margin-left: 18px;
  width: 192px;
}

.recipe-search {
  margin-left: 26px;
  margin-top: 12px;
}

input {
  border: 1px solid #999;
  padding: 3px;
}

input.competition {
  width: 310px;
  display: block;
}

label.competition {
  width: 180px;
  display: block;
  float: left;
}

.stay-in-touch {
  font-size: 0.875em;
}

.stay-in-touch .error {
  position: relative;
  top: -3px;
}

.stay-in-touch ul {
  padding: 0;
  margin: 0;
  font-size: 1.2em;
  list-style-position: outside;
  list-style: none;
}

.stay-in-touch fieldset {
  padding: 0;
  margin: 0 0 0.65em 0;
}

.stay-in-touch legend {
  margin: 0  0 0.65em 0;
}

.stay-in-touch label {
  display: block;
  margin: 0  0 0.65em 0;
}

.stay-in-touch .radio {
  display: inline;
  vertical-align: middle;
}

.stay-in-touch .radio label, .stay-in-touch .radio li {
  display: inline;
}

.stay-in-touch .radio input {
  display: inline;
  margin-right: 0;
  width: 24px;
}

.login-form {
  width: 100%;
  margin-bottom: 0.65em;
  display: block;
}

.login-form input {
  display: block;
  width: 266px;
}

.login-form label {
  font-weight: bold;
  margin-left: 12px;
}

.login-form__remember input {
  width: 22px;
  display: inline;
}

.sidebar-search .sw-input {
  width: 230px;
}

.sidebar-recipe-search {
  height: 110px;
}

.success textarea {
  display: block;
  width: 500px;
  margin-left: -40px;
}

.search-input__advanced {
  display: block;
}

/*==========================================================================
  Tables
  ===========
  Sensible defaults for tables and some enhancements with classes
==========================================================================*/
/*========================================
  GENERAL DEFAULTS
========================================*/
table.tableGeneral {
  border-bottom: 2px solid #ccc;
  margin: 20px 0px;
  font-size: 0.825em;
  width: 100%;
  margin: 20px;
  margin-left: 0px;
}

.tableGeneral thead {
  color: #ffffff;
  background: #454545;
  background: #575757;
  background-image: -o-linear-gradient(#6d6d6d 0, #575757 50%, #454545 100%);
  background-image: -ms-linear-gradient(#6d6d6d 0, #575757 50%, #454545 100%);
  background-image: -moz-linear-gradient(#6d6d6d 0, #575757 50%, #454545 100%);
  background-image: -webkit-linear-gradient(#6d6d6d 0, #575757 50%, #454545 100%);
  background-image: linear-gradient(#6d6d6d 0, #575757 50%, #454545 100%);
  margin: 10px;
}

.tableGeneral td, th {
  padding: 8px 5px;
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
}

.tableGeneral tr:nth-child(even) td {
  background-color: #efefef;
}

thead {
  border-radius: 8px 8px 0 0;
}

caption {
  text-align: left;
  font-weight: bold;
  font-size: 1.3em;
  color: #666;
}

/*========================================
  ENHANCEMENTS
========================================*/
/* 
  Table stripes on odd rows
----------------------------------------*/
/* 
  Row, cell highlights
----------------------------------------*/
/*========================================
  PUBLIC SITE - Tabels
========================================*/
.membership-comparison {
  text-align: center;
}

.membership-comparison td.feature {
  width: 180px;
  text-align: left;
}

.membership-comparison td.online {
  width: 200px;
  border-right: none;
}

.membership-comparison tbody td {
  border-right: 1px dotted #7d7d7d;
}

/*========================================
  MEMBER SITE - Tables
========================================*/
table.messages {
  width: 935px;
}

.col-1eighth {
  width: 12.5%;
}

.col-1qtr {
  width: 25%;
}

.col-2qtr {
  width: 50%;
}

.col-3qtr {
  width: 75%;
}

/*==========================================================================
  Media
  ===========
  Sensible defaults for images, canvas, video etc
==========================================================================*/
/*Created Left and Right floats for images*/
img.left {
  float: left;
  padding: 10px 10px 10px 0;
}

img.right {
  float: right;
  padding: 10px 0 10px 10px;
}

/* ====== media ====== */
.media {
  margin: 10px;
}

.media, .bd {
  overflow: hidden;
  _overflow: visible;
  zoom: 1;
}

.media img {
  float: left;
  margin-right: 10px;
  display: block;
}

.media .img img {
  display: block;
}

.media .imgExt {
  float: right;
  margin-left: 10px;
}

.media.callout {
  background-color: #e7e7e7;
  padding-top: 10px;
  border: 1px solid #ccc;
  border-radius: 3px;
  padding-right: 10px;
}

.video-container {
  position: relative;
  padding-bottom: 56.25%;
  padding-top: 30px;
  height: 0;
  overflow: hidden;
}

.video-container iframe, .video-container object, .video-container embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/* Grids & layout --
----------------------------------------*/
.wrapper {
  display: inline-block;
  /* Necessary to trigger "hasLayout" in IE */
  display: block;
  max-width: 948px;
  margin: 4px;
  padding: 6px;
  text-align: left;
  background-color: #fff;
}

.wrapper.fade-bg {
  background-color: rgba(255, 255, 255, 0.75);
}

header {
  position: relative;
  min-height: 35px;
}

@media screen and (min-width: 1024px) {
  header {
    min-height: 122px;
  }
}

.panel, .side-nav ul a {
  overflow: hidden;
}

.nav-toggle:checked + label + nav + ul + #main {
  opacity: 0.45;
  transform: translateZ(0);
}

#main, #additional {
  padding: 0;
  margin: 0;
  margin-top: 8px;
}

.img-header {
  width: 100%;
}

@media screen and (min-width: 640px) {
  #main {
    float: left;
    width: 65%;
    padding-right: 8px;
  }
  #additional {
    width: 35%;
    float: right;
    position: relative;
  }
}

@media screen and (max-width: 640px) {
  ul.utilities-login {
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    background-color: transparent;
  }
}

.wrapper {
  margin-top: 0;
  box-shadow: none;
}

@media screen and (min-width: 1024px) {
  .wrapper {
    box-shadow: 0px 0px 12px 8px rgba(0, 0, 0, 0.25);
    margin: 8px auto;
  }
}

@media screen and (min-width: 960px) {
  .col-left {
    float: left;
    margin-right: 3%;
    padding: 3px;
    width: 45%;
    margin-left: 1%;
  }
  .col-right {
    float: left;
    margin-right: 3%;
    padding: 3px;
    width: 46%;
  }
}

/* Modules
----------------------------------------*/
/* Module is a more discrete component of the page. It is your navigation bars and your carousels and your dialogs and your widgets and so on. This is the meat of the page. This should mostly consist of classes with as little specifying of elements as possible. */
/*==========================================================================
  NAVIGATION
  ==========
  All modules relating to navigation
==========================================================================*/
/* Utility navigation
// things like login etc
----------------------------------------*/
.utilities-sitewide {
  display: block;
  max-width: 960px;
  margin: 0;
  font-size: 0.8em;
  text-align: right;
  padding: 2px;
  background-color: white;
  line-height: 30px;
}

.utilities-sitewide li {
  display: inline;
  margin: 0px;
}

@media screen and (min-width: 1024px) {
  .utilities-sitewide {
    background-color: transparent;
    margin: 6px auto;
    line-height: inherit;
  }
}

.utilities-sitewide__link, .utilities-sitewide__link:visited,
a.utilities-sitewide__link, a.utilities-sitewide__link:visited {
  color: #000;
  text-decoration: none;
  border-right: 1px solid gray;
  padding: 0px 7px 0px 6px;
  text-align: center;
  line-height: 1;
}

a.nav-register-link {
  padding-right: 24px;
}

.utilities select {
  max-width: 48px;
  margin-right: 4px;
  padding: 3px;
}

a.utilities-sitewide__link:hover,
a.utilities-sitewide__link:active,
a.utilities-sitewide__link:focus {
  color: #999;
}

.utilities-login {
  background-color: #f8f8f8;
  padding: 0;
  margin: 0;
  float: right;
  clear: none;
  display: inline-block;
  text-align: right;
}

.utilities-login li {
  display: inline;
}

.utilities-login em {
  color: #DA0000;
  padding-right: 8px;
  padding-bottom: 5px;
  background: transparent url(/health/assets/images/ui-elements/swoosh.gif) bottom left no-repeat;
}

.utilities-login a {
  display: inline-block;
  padding: 2px 3px;
}

/* Main site navigation
----------------------------------------*/
@media screen and (min-width: 960px) {
  .navigation.inner-pages {
    width: 948px;
    left: -6px;
  }
  .navigation.one-layer {
    width: 948px;
    left: 0px;
  }
}

@media screen and (max-width: 700px) {
  .nav-wrapper {
    padding: 5px;
  }
}

.navigation {
  background: #1f1e1e;
  background-image: linear-gradient(top, #333, #111);
  text-shadow: 1px 1px 2px #000;
  position: relative;
  margin: 0;
  padding: 0;
  font-size: 0.875em;
  float: left;
  width: 100%;
}

.navigation ul {
  padding: 0;
  margin: 0;
}

.navigation li {
  list-style: none;
  margin: 0;
  padding: 0;
  float: left;
  text-align: center;
  line-height: 1.35;
  border-left: 1px solid #333;
}

.navigation li.current a {
  background-color: rgba(0, 0, 0, 0.3);
}

@media screen and (min-width: 640px) {
  .navigation li.single a {
    padding-top: 15px;
    padding-bottom: 15px;
  }
}

@media screen and (min-width: 640px) and (max-width: 830px) {
  .navigation li a {
    padding-left: 13px;
    padding-right: 13px;
  }
  .navigation li#home {
    display: none;
  }
}

.navigation a {
  float: left;
  color: #fff;
  text-decoration: none;
  padding: 6px 20px 8px 20px;
}

.navigation a:hover, .navigation a :focus, .navigation a :active, .navigation a .current {
  background-color: rgba(0, 0, 0, 0.3);
  color: #ccc;
}

/* ####################################

Tweener nav styles.
Not small enough for slide in nav, not big enough for the full width defaults

#################################### */
/* ####################################
.expanded and .contracted get set by responsive nav js
#################################### */
.subnav-container {
  overflow: hidden;
  transition: all 215ms ease-in-out;
  max-height: 1000px;
  opacity: 1;
}

.contracted .subnav-container {
  max-height: 0;
  opacity: 0;
}

#subNav {
  width: 100%;
  float: left;
  clear: both;
  list-style: none;
  background: #E8E7E7;
  background-image: -o-linear-gradient(#d2d2d5 0, #E8E7E7 50%, #E8E7E7 100%);
  background-image: -ms-linear-gradient(#d2d2d5 0, #E8E7E7 50%, #E8E7E7 100%);
  background-image: -moz-linear-gradient(#d2d2d5 0, #E8E7E7 50%, #E8E7E7 100%);
  background-image: -webkit-linear-gradient(#d2d2d5 0, #E8E7E7 50%, #E8E7E7 100%);
  background-image: linear-gradient(#d2d2d5 0, #E8E7E7 50%, #E8E7E7 100%);
  text-shadow: none;
}

#subNav li {
  float: left;
  background-image: none;
  margin-left: 8px;
  border: none;
}

#subNav li a {
  color: #333;
  text-decoration: none;
  padding: 8px 6px;
  background-color: transparent;
}

#subNav li a:hover, #subNav li a :focus, #subNav li a :active {
  background-color: transparent;
  text-decoration: underline;
}

/*#############################################

Small screen navigation

#############################################*/
.nav-toggle, .nav-toggle__label {
  display: none;
}

.small-screen--additional-nav {
  display: none;
}

@media screen and (max-width: 640px) {
  .nav-toggle__label {
    -webkit-tap-highlight-color: #000;
    touch-action: manipulation;
    display: block;
    left: 0;
    top: 0;
    width: 100%;
    height: 52px;
    background: #1E1E1E url("data:image/gif;base64,R0lGODlhIABIAJECAJGRkf///////wAAACH5BAEAAAIALAAAAAAgAEgAAAJrlI+py+0Po5y0RoCz3vzxD1riSJYLiGpempruCzds68xojOf6zvf+DwwKh8Si8YhMKpfMpvMJjUqnxEAAYqVYr41txbsAf7MJscVsFoHToy2b5MbFYW6yaW1v598SNv/B98cgKKiQN8glVAAAOw==") 8px 14px no-repeat;
    cursor: pointer;
    padding: 4px;
    z-index: 9999999;
    color: #a7a7a7;
  }
}

@media screen and (max-width: 640px) and (min-width: 400px) {
  .nav-toggle__label {
    text-indent: 0;
    padding-left: 40px;
    font-size: 10px;
    line-height: 4.25;
  }
}

@media screen and (max-width: 640px) {
  .nav-toggle__label:hover, .nav-toggle__label:focus, .nav-toggle__label:active {
    background-color: #000;
    color: #fff;
  }
  .nav-toggle:checked + label {
    background-position: 8px -37px;
    top: 0;
    left: 0;
    z-index: 99999999;
    position: fixed;
    display: block;
    transform: translateX(300px);
  }
}

@media screen and (max-width: 640px) and (max-width: 352px) {
  .nav-toggle:checked + label {
    margin-left: -52px;
    box-shadow: none;
  }
}

@media screen and (max-width: 640px) {
  .nav-toggle:checked + label ~ .navigation,
  .nav-toggle:checked + label + .navigation {
    display: block;
    position: fixed;
    transform: translateX(300px);
    box-shadow: 2px 12px 0 0 rgba(51, 51, 51, 0.45);
  }
  .navigation {
    position: fixed;
    top: 0px;
    left: -300px;
    transform: translate3d(0, 0, 0);
    -webkit-transform: translate3d(0, 0, 0);
    display: block;
    min-height: 100%;
    height: 100%;
    width: 100%;
    max-width: 300px;
    z-index: 9999999;
    overflow-y: auto;
    -webkit-perspective: 1000;
    -webkit-backface-visibility: hidden;
    padding-bottom: 6em;
  }
  .navigation li {
    display: block;
    float: none;
    clear: both;
    width: 100%;
    border-right: none;
    border-bottom: 1px solid #282828;
  }
  .navigation li br {
    display: none;
  }
  .navigation a {
    display: block;
    float: none;
    padding: 18px 0 18px 22px;
    text-align: left;
  }
  .navigation a:before {
    content: '';
    display: inline-block;
    width: 12px;
    height: 12px;
    margin: 0 4px -2px 0;
    background: transparent url(data:image/gif;base64,R0lGODlhBgALAIABAP///0lAQCH5BAEAAAEALAAAAAAGAAsAAAIPRH5gqBu9oJH0taSYe+gUADs=) center center no-repeat;
    opacity: 0.1;
    transition: all 125ms ease;
  }
  .navigation a:hover, .navigation a:focus, .navigation a:active {
    background-color: #900;
    color: #fff;
  }
  .navigation a:hover:before, .navigation a:focus:before, .navigation a:active:before {
    opacity: 0.75;
  }
  .navigation #subNav {
    background-image: none;
    box-shadow: inset 0 1px 2px 0px rgba(51, 51, 51, 0.25);
    background-color: #E8E7E7;
  }
  .navigation #subNav li {
    margin: 0;
    float: none;
  }
  .navigation #subNav a {
    padding: 12px 0 12px 40px;
    border-bottom: 1px solid #ddd;
    border-top: 1px solid #eee;
  }
  .navigation #subNav a:before {
    display: none;
  }
  .navigation #subNav a:hover {
    background-color: rgba(0, 0, 0, 0.1);
    border-color: #ccc;
  }
  .navigation #subNav a:focus, .navigation #subNav a:active {
    background-color: #900;
    color: #fff;
  }
  .small-screen--additional-nav {
    display: block;
    z-index: 999999999999;
    list-style: none;
    padding: 0;
    float: right;
    margin: -52px 0 0 44px;
  }
  .small-screen--additional-nav li {
    display: inline-block;
    float: left;
    padding: 0;
  }
  .small-screen--additional-nav a {
    display: block;
    color: #fff;
    padding: 15px 9px;
    font-size: 90%;
    border-right: 1px solid #555;
    background-color: #363636;
  }
  .small-screen--additional-nav a:hover, .small-screen--additional-nav a :active, .small-screen--additional-nav a :focus {
    background-color: #474747;
    text-decoration: none;
  }
  .nav-toggle:checked + label + .navigation + .small-screen--additional-nav {
    margin-top: 0;
    opacity: 0.25;
  }
  .fixed-header {
    padding-top: 61px;
  }
  .fixed-header .small-screen--additional-nav, .fixed-header .nav-toggle__label, .fixed-header .nav-toggle:checked + label {
    position: fixed;
    top: 0;
    right: 0;
    transform: translateX(0);
    margin-top: 0;
  }
  .fixed-header .nav-toggle:checked + label {
    transform: translateX(300px);
  }
  .fixed-header .nav-toggle:checked + label + .navigation + .small-screen--additional-nav {
    display: none;
  }
  .fixed-header .nav-toggle__label {
    box-shadow: 0 0 3px 2px rgba(0, 0, 0, 0.5);
  }
  .navigation li.single a:before {
    visibility: hidden;
  }
  .navigation li.current a:before,
  .navigation li.expanded a:before {
    transform: rotate(90deg);
    opacity: 0.75;
  }
  .navigation li.current.contracted a:before {
    transform: rotate(0deg);
  }
}

/*############################################

Special case naviagtion

############################################*/
.loading-nav {
  min-height: 28px;
  background: #fff url(data:image/gif;base64,R0lGODlhEAAQAPIAAP///39/f+Dg4KCgoH9/f7CwsMDAwMjIyCH+GkNyZWF0ZWQgd2l0aCBhamF4bG9hZC5pbmZvACH5BAAKAAAAIf8LTkVUU0NBUEUyLjADAQAAACwAAAAAEAAQAAADMwi63P4wyklrE2MIOggZnAdOmGYJRbExwroUmcG2LmDEwnHQLVsYOd2mBzkYDAdKa+dIAAAh+QQACgABACwAAAAAEAAQAAADNAi63P5OjCEgG4QMu7DmikRxQlFUYDEZIGBMRVsaqHwctXXf7WEYB4Ag1xjihkMZsiUkKhIAIfkEAAoAAgAsAAAAABAAEAAAAzYIujIjK8pByJDMlFYvBoVjHA70GU7xSUJhmKtwHPAKzLO9HMaoKwJZ7Rf8AYPDDzKpZBqfvwQAIfkEAAoAAwAsAAAAABAAEAAAAzMIumIlK8oyhpHsnFZfhYumCYUhDAQxRIdhHBGqRoKw0R8DYlJd8z0fMDgsGo/IpHI5TAAAIfkEAAoABAAsAAAAABAAEAAAAzIIunInK0rnZBTwGPNMgQwmdsNgXGJUlIWEuR5oWUIpz8pAEAMe6TwfwyYsGo/IpFKSAAAh+QQACgAFACwAAAAAEAAQAAADMwi6IMKQORfjdOe82p4wGccc4CEuQradylesojEMBgsUc2G7sDX3lQGBMLAJibufbSlKAAAh+QQACgAGACwAAAAAEAAQAAADMgi63P7wCRHZnFVdmgHu2nFwlWCI3WGc3TSWhUFGxTAUkGCbtgENBMJAEJsxgMLWzpEAACH5BAAKAAcALAAAAAAQABAAAAMyCLrc/jDKSatlQtScKdceCAjDII7HcQ4EMTCpyrCuUBjCYRgHVtqlAiB1YhiCnlsRkAAAOwAAAAAAAAAAAA==) center center no-repeat;
}

.navigation #joining-a-group, .navigation #joining-online {
  float: right;
  margin-right: 0;
  background-color: #312e2e;
}

@media screen and (max-width: 480px) {
  .navigation #joining-a-group, .navigation #joining-online {
    float: none;
  }
  .navigation #joining-a-group:hover, .navigation #joining-online:hover {
    background-color: #171717;
  }
}

@media screen and (max-width: 378px) {
  li.add-nav__recipe {
    display: none;
  }
}

/*Typically used for lists consiting of a title and content, optional image
  *[note: .media-bd is required if using image]
 /*e.g  <ul class="media-obj">
  *       <li>
  *         <a href="#" class="media-obj__fig">...</a>
  *         <div class="media-obj__bd">...</div>
  *       </li>
  */
.media-obj {
  clear: both;
  margin-left: 0;
  margin-bottom: .65em;
  overflow: hidden;
}

.media-obj:last-child {
  border-bottom: 0;
  margin-bottom: 0;
  padding-bottom: 0;
}

.media-obj__title, #main .media-obj__title {
  margin: 0 0 .25em;
}

.media-obj__fig {
  float: left;
  display: block;
  margin: 0 .75em .75em 0;
}

.media-obj__fig img {
  display: block;
}

.media-obj__bd {
  overflow: hidden;
  _overflow: visible;
  zoom: 1;
}

.media-obj__bd p {
  margin-top: 0;
}

/*==========================================================================
  ARTICLE STYLES
  ==========
  Groups styles relating to articles (which can include features, success stories etc)
==========================================================================*/
/*Blockquotes*/
.blockquote-primary,
.success blockquote {
  color: #921515;
  line-height: 1.5;
  font-style: italic;
  margin: 0 0 0.65em 0.5em;
  padding: 0 0 0 3.3em;
}

.blockquote-primary p,
.success blockquote p {
  font-style: italic;
}

/*Images*/
.img-primary {
  background-color: #FFFFFF;
  border: 1px solid #DDDDDD;
  border-radius: .25em;
  padding: 0.25em;
}

.main table.tableGeneral {
  border-bottom-width: 0px;
}

#main #PDI_container7938087 .pds-box {
  width: 610px;
  margin-bottom: 20px;
}

#main #PDI_container7938087 .pds-input-label {
  width: 500px;
}

#PDI_container7989862 .pds-links A {
  visibility: hidden;
}

#main #PDI_container7989862 .pds-box {
  width: 600px;
}

#main #PDI_container7989862 .pds-answer-group {
  float: left;
}

#main #PDI_container7989862 .pds-answer {
  float: left;
  margin-bottom: 10px;
}

#PDI_container7989862 .pds-links-back .pds-pd-link {
  display: none;
}

ul.original-bullet {
  background-position: 0 -15px;
  background-image: url("../health/assets/images/ui-elements/syn-icons.gif");
  display: inline;
}

/*==========================================================================
  CAROUSELS
==========================================================================*/
.carousel {
  width: 100%;
  border-radius: 8px 8px 0px 0px !important;
  margin-top: -3px;
  clear: both;
}

.carousel-slides {
  height: auto;
  margin: 0 0  0px 0;
  padding: 0;
  width: 100%;
}

.carousel-slides li {
  display: none;
  position: relative;
  margin: 0;
  padding: 0;
  -webkit-backface-visibility: hidden;
  font-size: 0.875em;
}

.carousel-slides li img {
  display: block;
  width: 100%;
  vertical-align: middle;
}

.carousel-controls ol {
  float: left;
  margin-left: -4px;
  margin-bottom: 0.65em;
}

.no-js .carousel-controls {
  display: none;
}

.flex-control-thumbs {
  margin: 0;
  padding: 0;
  width: 634px;
}

.flex-control-thumbs li {
  background: transparent;
  cursor: pointer;
  display: block;
  opacity: 0.75;
  position: relative;
  list-style-type: none;
  list-style-position: outside;
  float: left;
  margin: 4px 6px 0 0;
  transition: opacity .25s ease-in-out;
  -moz-transition: opacity .25s ease-in-out;
  -webkit-transition: opacity .25s ease-in-out;
}

.flex-control-thumbs li:after, .flex-control-thumbs li:before, .flex-control-thumbs li .inner:before, .flex-control-thumbs li .inner:after {
  content: "";
  background: #ffffff;
  position: absolute;
  opacity: 0;
  transition: opacity .25s ease-in-out;
  -moz-transition: opacity .25s ease-in-out;
  -webkit-transition: opacity .25s ease-in-out;
}

.lt-ie9 .flex-control-thumbs li:after, .lt-ie9 .flex-control-thumbs li:before, .lt-ie9 .flex-control-thumbs li .inner:before, .lt-ie9 .flex-control-thumbs li .inner:after {
  display: none;
}

.flex-control-thumbs li:before {
  top: 0;
  left: 0;
  height: 5px;
  width: 100%;
}

.flex-control-thumbs li:after {
  bottom: 0;
  left: 0;
  height: 5px;
  width: 100%;
}

.flex-control-thumbs li .inner:before {
  top: 5px;
  left: 0;
  bottom: 5px;
  width: 5px;
}

.flex-control-thumbs li .inner:after {
  top: 5px;
  right: 0;
  bottom: 5px;
  width: 5px;
}

.flex-control-thumbs li:hover {
  opacity: 1;
}

.flex-control-thumbs li:hover:after, .flex-control-thumbs li:hover:before, .flex-control-thumbs li:hover .inner:before, .flex-control-thumbs li:hover .inner:after {
  opacity: 0.5;
}

.lt-ie9 .flex-control-thumbs li:hover:after, .lt-ie9 .flex-control-thumbs li:hover:before, .lt-ie9 .flex-control-thumbs li:hover .inner:before, .lt-ie9 .flex-control-thumbs li:hover .inner:after {
  display: block;
}

.flex-control-thumbs li img {
  display: block;
  width: 100%;
  vertical-align: middle;
}

.slider-content {
  background: #000;
  background: rgba(0, 0, 0, 0.7);
  /*background-image:url(/health/assets/images/ui-elements/arrow-white.png);*/
  background-position: bottom right;
  background-repeat: no-repeat;
  bottom: 0;
  color: #fff;
  max-height: 5.4em;
  overflow: hidden;
  position: absolute;
  top: 60%;
  width: 278px;
  padding: 0 16px;
  -moz-transition: 0.5s;
  -ms-transition: 0.5s;
  -o-transition: 0.5s;
  -webkit-transition: 0.5s;
  transition: 0.5s;
}

.slider-content.title-r {
  right: 0;
}

.flex-active-slide .slider-content, .no-js .slider-content {
  max-height: 100%;
  top: 0;
  bottom: 0;
}

.slider-content-title {
  color: #fff;
  font-size: 1.5em;
  line-height: 0.9;
  font-style: italic;
  margin-top: 1em;
  margin-bottom: 0.25em;
}

.slider-content-title b {
  color: #e2cfa4;
  font-size: 1.3em;
  font-style: normal;
  font-weight: normal;
}

@media screen and (min-width: 960px) {
  .slider-content-title {
    font-size: 1.7em;
  }
  .slider-content-title b {
    font-size: 1.5em;
    display: block;
  }
}

.loading {
  background: url("/health/assets-public/css/img/loader.gif") no-repeat center center;
  height: 40px;
  position: relative;
}

.no-js .carousel-slides > li:first-child {
  display: block;
}

.time {
  color: #cdcdcd;
  padding-left: 18px;
  margin-top: 0;
  margin-bottom: 0;
  font-weight: normal;
  background: transparent url(/health/assets/images/clock.png) left center no-repeat;
}

/*==========================================================================
  FIND A GROUP CTA
==========================================================================*/
/*Styling variations*/
.ctasignup-ukstyle {
  background: url("/health/assets-public/images/bg-ctasignup-ukstyle.jpg") no-repeat scroll -92px -115px #0F0F0F;
  color: #EEEEEE;
  margin-top: 58px;
}

.ctasignup-ukstyle .ctasignup-title,
#main .ctasignup-ukstyle .ctasignup-title {
  background: url("/health/assets-public/images/ir-findnearestgroup.png");
  text-indent: -999em;
  margin-top: 33px;
  height: 130px;
  width: 236px;
}

.ctasignup-ukstyle .ctasignup-search {
  font-size: .9em;
  color: #a88a23;
  font-weight: bold;
}

.ctasignup-ukstyle a {
  color: #a88a23;
}

.ctasignup-ukstyle strong {
  color: #fff;
}

/*Styling variations*/
.ctasignup-onlinestyle {
  background: url("/health/assets-public/images/bg-ctasignup-ukstyle.jpg") no-repeat scroll -92px -115px #0F0F0F;
  color: #EEEEEE;
}

.ctasignup-onlinestyle .ctasignup-title,
#main .ctasignup-onlinestyle .ctasignup-title {
  background: url("/health/assets-public/images/ir-joinonline.png");
  text-indent: -999em;
  height: 130px;
  width: 236px;
}

.ctasignup-onlinestyle a {
  color: #ffffff;
}

.ctasignup-onlinestyle strong {
  color: #fff;
}

.ctasignup-img {
  display: none;
}

.ctasignup-img {
  clear: left;
  opacity: 0.10;
}

.ctasignup-search label {
  display: block;
  margin-bottom: 5px;
}

.ctasignup-search input[type=text] {
  margin-bottom: 5px;
  padding: 5px;
}

@media screen and (min-width: 320px) {
  .ctasignup {
    clear: both;
    border-radius: 0 4px 4px 0;
    margin-left: 0;
    margin-bottom: 0.65em;
  }
  .ctasignup-bd {
    margin-left: 4%;
    padding-top: 11em;
    width: 95%;
    display: block;
    float: none;
    color: #ffffff;
  }
  h2.ctasignup-title {
    margin-left: 2%;
  }
  .ctasignup-onlinestyle .ctasignup-title {
    margin-top: 20px !important;
  }
  .ctasignup-onlinestyle .ctasignup-bd {
    padding-top: 9em;
  }
  .ctasignup-img {
    display: block;
    margin-left: -16px;
    margin-top: -8px;
  }
  .ctasignup-img,
  .ctasignup-title,
  #main .ctasignup-title,
  .ctasignup-bd {
    float: left;
    margin-right: -100%;
  }
}

@media screen and (min-width: 640px) {
  .ctasignup-bd {
    float: left;
    margin-left: 58%;
    padding-top: 0.65em;
    width: 40%;
  }
  .ctasignup-bd p {
    margin: 0 0 0.65em 0;
  }
  .ctasignup-onlinestyle .ctasignup-bd {
    padding-top: 0.65em;
  }
}

@media screen and (min-width: 800px) {
  .ctasignup-img {
    opacity: 1;
  }
  h2.ctasignup-title {
    margin-left: 12% !important;
  }
}

@media screen and (min-width: 960px) {
  .ctasignup {
    clear: both;
    border-radius: 0 4px 4px 0;
    margin-left: -6px;
    margin-bottom: 0.65em;
  }
  h2.ctasignup-title {
    margin-left: 18% !important;
  }
}

/*==========================================================================
  NEAREST GROUP
==========================================================================*/
/* results page */
#main .pager {
  text-align: right;
  background-color: #E8E7E7;
  margin: 0;
  margin-bottom: 0;
  padding-right: 15px;
  margin-top: 10px;
}

.nearest-group-result {
  padding: 0.5em 0;
  border-bottom: 1px solid #ccc;
  /* will change this once the .cs file has been broken up a bit.*/
}

.nearest-group-result .detail {
  background: url("/health/assets/images/ui-elements/clock-icon.png") no-repeat scroll -4px 4px #f0f0f0;
  color: #333;
  display: inline-block;
  font-weight: bold;
  margin: 0 0 0.65em;
  padding: 0em 1.8em 0em 1.8em;
  border-bottom: 1px solid #ccc;
}

/* details page*/
@media screen and (max-width: 480px) {
  #main .adr .map-holder a.btn-small {
    width: 100%;
  }
  #main .join-options + p > a {
    width: 100%;
    display: block;
  }
}

#main .adr {
  margin-left: .5rem;
  margin-right: .5rem;
}

#main .adr > h2 {
  margin: 0;
}

#main .adr .groupdetails {
  float: left;
  padding-right: 10px;
}

#main .adr .groupdetails:nth-child(1) {
  width: 33%;
}

#main .adr .groupdetails:nth-child(2) {
  width: 43%;
}

#main .adr .groupdetails:nth-child(3) {
  width: 24%;
}

@media screen and (max-width: 480px) {
  #main .adr .groupdetails:nth-child(1), #main .adr .groupdetails:nth-child(2), #main .adr .groupdetails:nth-child(3) {
    width: 100%;
  }
}

#main .adr .groupdetails dt {
  color: #444;
  font-weight: bold;
  font-size: .9em;
}

#main .adr .groupdetails dd {
  color: #666;
  border-radius: 5px;
  width: 100%;
  padding: 0.3em 0.25em 0.3em 1.6em;
  font: .9em Arial, sans-serif;
  font-weight: bold;
  border: none;
}

#main .adr .map-holder {
  position: relative;
  top: 2em;
  display: block;
  position: relative;
  z-index: 888888;
  float: right;
  width: 100%;
  clear: none;
  margin-top: -8px;
}

#main .adr .map-holder a {
  margin-top: 4px;
  display: block;
  width: 30%;
}

#main .adr .nearest-group-result {
  border-bottom: none;
  margin-bottom: 0;
  margin-top: 0;
  padding-bottom: 0;
}

#main .adr .nearest-group-result .details,
#main .adr .nearest-group-result .email {
  padding: 0.25em 0.25em 0.25em 0.1em;
}

#main .adr .nearest-group-result .details {
  font-weight: normal;
  display: inline-block;
  margin: 0 0 0.65em;
  line-height: 1.46;
}

#main .adr .nearest-group-result .detail {
  background-color: #f0f0f0;
}

#main .adr .nearest-group-result .email {
  display: inline-block;
  margin: 0 0 0.65em;
}

#main .adr .nearest-group-result .email a {
  color: #921515;
}

#main .adr #map {
  height: 100%;
}

#main .adr .ui-dialog {
  z-index: 999999;
}

#main .adr .consultant-pic {
  width: 87px;
  height: 114px;
  float: right;
  background-image: url("/health/images/features/nearest-group-details/consultant-pic.jpg");
  background-color: #930;
  margin: 0px 5px 5px 5px;
  padding: 18px 0px 0px 18px;
}

#main .adr .member-offer {
  float: left;
}

#main .adr #content #get-in-group ul, #main .adr #content #get-online ul {
  margin-bottom: 10px;
}

#main .adr #content.joining-a-group #main h3, #main .adr h2.browsegroups {
  font-size: 26px;
}

#main .adr .joining-a-group .emphasis {
  font-size: 19px;
}

#main .adr .consultant-tel {
  background-color: #DFFFBF;
  border-radius: 8px;
  clear: both;
  margin: 0px 18px 24px 0px;
  padding: 8px 12px 8px 12px;
  text-align: center;
}

#main .adr .join-options {
  margin-left: 0px;
}

#main .adr .join-options img {
  margin-right: 10px;
}

#main .adr .join-options h3 {
  display: block;
  clear: both;
}

#main .adr .mapbut {
  margin-top: 10px;
}

.media-block img {
  margin-right: 10px;
}

/*==========================================================================
  Search boxes
==========================================================================*/
.form-search {
  background-color: #E8E7E7;
  padding: 0.65em;
  margin-bottom: 0.65em;
}

.form-search .val {
  top: 3px;
}

#main .form-search {
  padding: 1.65em;
}

@media screen and (max-width: 480px) {
  #main .form-search {
    padding: 0.65em 0;
  }
}

.nearest-group-search > div,
.advanced-group-search > div {
  margin-left: 10px;
  margin-right: 10px;
}

.nearest-group-search > div {
  margin-left: 10px;
  margin-right: 10px;
}

.nearest-group-search > div > label {
  font-weight: bold;
  font-size: 14px;
}

.nearest-group-search > div > input[type=submit] {
  padding-top: 4px;
  padding-bottom: 4px;
  top: 1px;
  position: relative;
}

@media screen and (max-width: 480px) {
  .nearest-group-search > div > input[type=submit] {
    display: block;
    width: 100%;
  }
}

.nearest-group-search > div > input[type=text] {
  min-width: 110px;
}

@media screen and (max-width: 480px) {
  .nearest-group-search > div > input[type=text] {
    min-width: 49%;
  }
}

.advanced-group-search > div {
  margin-bottom: 20px;
}

.advanced-group-search > div fieldset:first-child {
  width: 100%;
}

.advanced-group-search .sw-input {
  width: 307px;
}

@media screen and (max-width: 480px) {
  .advanced-group-search .sw-input {
    width: 100%;
  }
}

@media screen and (max-width: 480px) {
  .advanced-group-search .sw-input {
    min-width: 100%;
  }
}

.advanced-group-search .sw-input,
.advanced-group-search select {
  padding: 6px;
}

@media screen and (max-width: 480px) {
  .advanced-group-search select {
    width: 100%;
  }
}

.advanced-group-search fieldset {
  float: left;
  padding: 0.35em 0px;
}

@media screen and (max-width: 480px) {
  .advanced-group-search fieldset {
    min-width: 48.7%;
  }
}

@media screen and (max-width: 320px) {
  .advanced-group-search fieldset {
    min-width: 48.45%;
  }
}

.advanced-group-search label {
  font-weight: bold;
  font-size: 14px;
  min-width: 44px;
  display: block;
  padding-bottom: 5px;
}

.advanced-group-search fieldset + input[type=submit] {
  position: relative;
  top: 27px;
  left: 3px;
  padding-bottom: 7px;
  padding-top: 5px;
  margin-bottom: 26px;
}

@media screen and (max-width: 480px) {
  .advanced-group-search fieldset + input[type=submit] {
    display: block;
    width: 100%;
  }
}

.form-search__title {
  margin: 0 0 0.35em 0;
  padding: 0;
}

.form-search__bd {
  display: block;
  padding-right: 84px;
}

.form-search__label {
  display: block;
  font-size: 0.9em;
  font-weight: bold;
  margin-bottom: 0.65em;
  margin-right: -96px;
}

.form-search__input {
  background: url("/health/assets-public/images/icon-search.png") no-repeat scroll 5px center #FFFFFF;
  padding: 6px 6px 6px 25px;
  margin-bottom: 0px;
  margin-right: 2px;
  width: 100%;
  float: left;
}

.btn-small.form-search__submit {
  padding: 6px 0;
  margin-bottom: 0px;
  width: 82px;
  clear: none;
  margin-right: -84px;
  margin-top: .1em;
  display: inline-block;
}

.form-help {
  color: #7c7c7c;
  display: block;
  font-size: 0.9em;
  margin: 5px 0 0 0;
  padding: 0;
}

#main .pagination {
  display: block;
  width: 100%;
  float: left;
  padding: 0;
}

#main .pagination li {
  float: left;
  margin: 0;
  margin-right: 3px;
}

#main .pagination .current a {
  font-weight: bold;
  border: 1px solid #AE8C1C;
}

#main .pagination a {
  border-radius: 2px;
  padding: 4px 8px;
  text-align: center;
  margin-bottom: 2em;
  border: 1px solid #ccc;
  -o-transition: all 500ms ease-out;
  -ms-transition: all 500ms ease-out;
  -moz-transition: all 500ms ease-out;
  -webkit-transition: all 500ms ease-out;
  transition: all 500ms ease-out;
  text-decoration: none;
}

#main .pagination a:hover, #main .pagination a :active, #main .pagination a :focus, #main .pagination a .current a {
  border: 1px solid #AE8C1C;
  text-decoration: none;
  background-color: #f8efd1;
}

#main .pagination .aspNetDisabled {
  color: #C2C1C1;
  border-color: #C2C1C1;
}

#main .pagination .aspNetDisabled:hover {
  background: none;
  border-color: #C2C1C1;
}

.results-summary-title {
  color: #333;
}

.results-summary-title em {
  color: #666666;
}

.search-results {
  padding: 0;
  margin-left: 0;
}

.search-results .recipe-thumb, .search-results .search-thumb, .search-results .feature-thumb_video {
  float: left;
  clear: none;
  margin: 0 1em 0.65em 0;
  padding: 2px;
  border: 1px solid #ccc;
  border-radius: 3px;
}

.search-results .date {
  color: #6A6868;
  display: block;
  margin: 0.35em 0;
}

.search-results img {
  display: block;
}

.search-results li {
  clear: both;
  margin-bottom: 1em;
  margin-left: 0;
  border-bottom: 1px solid #ccc;
  overflow: hidden;
}

.search-results li li {
  border: none;
}

.recipe-thumb {
  float: right;
  clear: none;
}

.recipe-thumb img {
  padding: 2px;
  display: block;
  border-radius: 3px;
}

.a-video-featured {
  background-color: #FFF8CE;
  padding: 5px;
  -webkit-box-shadow: -6px 6px 17px -1px #c7c7c7;
  -moz-box-shadow: -6px 6px 17px -1px #c7c7c7;
  box-shadow: -6px 6px 17px -1px #c7c7c7;
}

.a-video-featured .featured-text {
  display: none;
}

.a-video-featured .panel, .a-video-featured .side-nav ul a, .side-nav ul .a-video-featured a {
  background-color: #FFF8CE;
}

/*==========================================================================
  ICONS
  =====================
  All styles relating to displaying icons
==========================================================================*/
.expand-icon:after {
  content: "../image/ui-elements/expand-icon.png";
  position: relative;
  right: 10%;
  bottom: 10%;
}

.video-bullet {
  background: transparent url(/health/assets/images/ui-elements/video-sml.png) left top no-repeat;
  padding-left: 62px;
  height: 45px;
}

.video-bullet:hover {
  background-position: 0px -46px;
}

/*==========================================================================
  ALERT, ERROR MESSAGES
  =====================
  All modules relating to expressing alert messages
==========================================================================*/
.alert {
  display: block;
}

.alert__info {
  background-color: #f9e0a4;
  border: 1px solid #7f5e11;
  /*color:  #7f5e11;*/
  padding: 0.65em;
  margin-bottom: 0.65em;
  margin-top: 1.65em;
}

.alert__success {
  background-color: #dbffad;
  border: 1px solid #8db25c;
  padding: 0.65em;
  margin-bottom: 0.65em;
}

.val {
  display: block;
}

.val--inline {
  display: inline;
}

.val--info {
  color: #6D6D6D;
  font-size: 0.9em;
  font-style: italic;
}

.val__error {
  color: #fd5b5b;
  position: relative;
  top: -3px;
  font-weight: bold;
}

/*==========================================================================
  BUTTONS
  =====================
  All modules relating to button styles
==========================================================================*/
/*
.slide .btn {
    @include button($width:204px);
    display:inline-block;
}
*/
.btn {
  background: #83ba5b;
  background-image: -o-linear-gradient(#94c069 0, #83ba5b 50%, #78b44b 100%);
  background-image: -ms-linear-gradient(#94c069 0, #83ba5b 50%, #78b44b 100%);
  background-image: -moz-linear-gradient(#94c069 0, #83ba5b 50%, #78b44b 100%);
  background-image: -webkit-linear-gradient(#94c069 0, #83ba5b 50%, #78b44b 100%);
  background-image: linear-gradient(#94c069 0, #83ba5b 50%, #78b44b 100%);
  border-radius: 2px;
  border: 1px solid rgba(0, 0, 0, 0.5);
  color: #fff;
  padding: 6px 22px;
  font-family: 'Source Sans Pro', arial, sans-serif;
  font-size: 1em;
  background-clip: padding-box;
  /* Firefox 4, Safari 5, Opera 10, IE 9 */
  text-shadow: 2px 1px 1px rgba(0, 0, 0, 0.3);
  text-align: center;
  width: auto;
}

.btn:hover, .btn :active, .btn :focus {
  background: #94c069;
  background-image: -o-linear-gradient(#94c069 0, #94c069 50%, #94c069 100%);
  background-image: -ms-linear-gradient(#94c069 0, #94c069 50%, #94c069 100%);
  background-image: -moz-linear-gradient(#94c069 0, #94c069 50%, #94c069 100%);
  background-image: -webkit-linear-gradient(#94c069 0, #94c069 50%, #94c069 100%);
  background-image: linear-gradient(#94c069 0, #94c069 50%, #94c069 100%);
  background-clip: padding-box;
  text-decoration: none;
}

#additional .btn, #additional .btn-small {
  text-decoration: none !important;
}

.btn-hp-cta__group, .btn-hp-cta__online {
  background: #83ba5b;
  background-image: -o-linear-gradient(#94c069 0, #83ba5b 50%, #78b44b 100%);
  background-image: -ms-linear-gradient(#94c069 0, #83ba5b 50%, #78b44b 100%);
  background-image: -moz-linear-gradient(#94c069 0, #83ba5b 50%, #78b44b 100%);
  background-image: -webkit-linear-gradient(#94c069 0, #83ba5b 50%, #78b44b 100%);
  background-image: linear-gradient(#94c069 0, #83ba5b 50%, #78b44b 100%);
  border-radius: 2px;
  border: 1px solid rgba(0, 0, 0, 0.5);
  color: #fff;
  padding: 6px 22px;
  font-family: 'Source Sans Pro', arial, sans-serif;
  font-size: 1em;
  background-clip: padding-box;
  /* Firefox 4, Safari 5, Opera 10, IE 9 */
  text-shadow: 2px 1px 1px rgba(0, 0, 0, 0.3);
  text-align: center;
  width: 160px;
  display: inline-block;
}

.btn-hp-cta__group:hover, .btn-hp-cta__group :active, .btn-hp-cta__group :focus, .btn-hp-cta__online:hover, .btn-hp-cta__online :active, .btn-hp-cta__online :focus {
  background: #94c069;
  background-image: -o-linear-gradient(#94c069 0, #94c069 50%, #94c069 100%);
  background-image: -ms-linear-gradient(#94c069 0, #94c069 50%, #94c069 100%);
  background-image: -moz-linear-gradient(#94c069 0, #94c069 50%, #94c069 100%);
  background-image: -webkit-linear-gradient(#94c069 0, #94c069 50%, #94c069 100%);
  background-image: linear-gradient(#94c069 0, #94c069 50%, #94c069 100%);
  background-clip: padding-box;
  text-decoration: none;
}

.btn-small {
  background: #e41e35;
  background-image: -o-linear-gradient(#ed1932 0, #e41e35 50%, #d92238 100%);
  background-image: -ms-linear-gradient(#ed1932 0, #e41e35 50%, #d92238 100%);
  background-image: -moz-linear-gradient(#ed1932 0, #e41e35 50%, #d92238 100%);
  background-image: -webkit-linear-gradient(#ed1932 0, #e41e35 50%, #d92238 100%);
  background-image: linear-gradient(#ed1932 0, #e41e35 50%, #d92238 100%);
  border-radius: 2px;
  border: 1px solid rgba(0, 0, 0, 0.5);
  color: #fff;
  padding: 3px 6px 4px 6px;
  font-family: 'Source Sans Pro', arial, sans-serif;
  font-size: 1em;
  background-clip: padding-box;
  /* Firefox 4, Safari 5, Opera 10, IE 9 */
  text-shadow: 2px 1px 1px rgba(0, 0, 0, 0.3);
  text-align: center;
  width: auto;
  border-width: 1px;
  position: relative;
  top: -1px;
  font-weight: normal;
  border: 1px solid #ad1b2d;
  font-size: 90%;
  margin-bottom: 10px;
  padding: 5px;
}

.btn-small:hover, .btn-small :active, .btn-small :focus {
  background: #ed1932;
  background-image: -o-linear-gradient(#ed1932 0, #ed1932 50%, #ed1932 100%);
  background-image: -ms-linear-gradient(#ed1932 0, #ed1932 50%, #ed1932 100%);
  background-image: -moz-linear-gradient(#ed1932 0, #ed1932 50%, #ed1932 100%);
  background-image: -webkit-linear-gradient(#ed1932 0, #ed1932 50%, #ed1932 100%);
  background-image: linear-gradient(#ed1932 0, #ed1932 50%, #ed1932 100%);
  background-clip: padding-box;
  text-decoration: none;
}

.full-width {
  display: block;
}

.btn-centred {
  width: auto;
  margin-left: auto;
  margin-right: auto;
}

.side-nav ul li {
  padding: 0;
  margin: 0;
  text-align: center;
}

.side-nav ul a {
  display: block;
  margin: 4px 0;
  padding: 4px;
  border: 1px solid #DFDEDE;
  border-radius: 4px;
}

.side-nav ul a:hover {
  background: #DFDEDE;
  border-color: #ccc;
  text-decoration: none;
}

.side-nav ul .current a {
  background: #DFDEDE;
}

.right-btn {
  float: right;
  margin-right: 10px;
}

/* .form-search is nearest-group.aspx */
.form-search #js-getlocation {
  color: #000;
  margin: 10px auto 0px auto;
  display: block;
  text-align: center;
  width: 210px;
  padding-top: 5px;
}

/* .find-a-group is home page */
.find-a-group #js-getlocation {
  color: #fff;
  display: block;
  padding: 10px 0;
  clear: both;
}

.form-search #js-getlocation:before {
  content: "";
  background-image: url("/health/images/ui-elements/nav.png");
  height: 26px;
  width: 26px;
  display: block;
  position: absolute;
  margin-top: -4px;
}

@media (min-width: 640px) {
  .form-search #js-getlocation,
  .find-a-group #js-getlocation {
    display: none;
  }
}

@media (max-width: 640px) {
  .ctasignup-search {
    margin: -16px 0 0 0;
  }
  .form-search .ctasignup-search {
    margin: auto 10px;
  }
}

/*==========================================================================
  HELPERS
  ==========
  CSS styles for helpful classes that don't belong anywhere else
==========================================================================*/
/* Clearfix
----------------------------------------*/
.cf:before,
.cf:after {
  content: " ";
  display: table;
}

.cf:after {
  clear: both;
}

.cf {
  *zoom: 1;
}

/* Global floats
----------------------------------------*/
.align-l {
  float: left;
}

img.align-l {
  margin: 0 0.65em 0.65em 0;
}

.align-r {
  float: none;
}

@media screen and (min-width: 480px) {
  .align-r {
    float: right;
  }
}

img.align-r {
  margin: 0 0 0.65em 0.65em;
}

/* Showing and hiding content
----------------------------------------*/
.hidden {
  display: none !important;
  visibility: hidden;
}

.visuallyhidden {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
  clip: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  position: static;
  width: auto;
}

.invisible {
  visibility: hidden;
}

/* Mobile desktop chooser
----------------------------------------*/
#overlay {
  position: absolute;
  top: 0;
  display: none;
  background-color: rgba(0, 0, 0, 0.75);
  width: 100%;
  height: 100%;
  z-index: 99999999999999;
}

#overlay #prompt {
  width: 50%;
  margin: 12px auto;
  padding: 1em;
  background-color: #fff;
  border: 1px solid #ccc;
  border-radius: 12px;
  font-size: 16px;
  text-align: center;
}

#overlay #prompt .note {
  font-size: 65%;
  float: none;
  width: 100%;
}

#overlay #prompt #go-mobile,
#overlay #prompt #no-mobile {
  display: block;
  margin: 1em;
  padding: 10px;
  text-align: center;
  border: 1px solid #ccc;
  border-radius: 12px;
  color: #fff;
  background-color: #cb0000;
  text-decoration: none;
}

#overlay #prompt #no-mobile {
  background: transparent;
  border: none;
  color: #009;
  font-size: 12px;
  text-decoration: underline;
  padding: 0px;
}

#overlay #prompt p {
  line-height: 1.4;
}

#overlay #prompt #asklater {
  text-align: center;
  display: block;
  padding: 48px;
  text-decoration: underline;
  font-weight: bold;
}

/* 1.25 dpr */
@media (-webkit-min-device-pixel-ratio: 1.25), (min-resolution: 120dpi) {
  #overlay #prompt {
    width: 50%;
    margin: 12px auto;
    zoom: 3;
  }
}

/* 1.3 dpr */
@media (-webkit-min-device-pixel-ratio: 1.3), (min-resolution: 124.8dpi) {
  #overlay #prompt {
    width: 50%;
    margin: 12px auto;
    zoom: 3;
  }
}

/* 1.5 dpr */
@media (-webkit-min-device-pixel-ratio: 1.5), (min-resolution: 144dpi) {
  #overlay #prompt {
    width: 80%;
    margin: 12px auto;
    zoom: 3;
  }
}

@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2 / 1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
  #overlay #prompt {
    width: 80%;
    margin: 12px auto;
    zoom: 1.3;
  }
}

/* Browser happy */
.browse-happy {
  background: #ed1941;
  width: 960px;
  margin: 0 auto;
  font-size: 24px;
  color: #fff;
}

.browse-happy a {
  color: #fff;
  font-weight: bold;
  text-decoration: underline;
}

.browse-happy p {
  padding: 10px 10px 10px 10px;
}

.amazing-support img {
  cursor: pointer;
}

#featured-recipes a {
  text-decoration: none;
}

#featured-recipes div {
  display: block;
  position: absolute;
}

.recipe-entry {
  position: relative;
  display: inline-block;
  overflow: hidden;
}

.recipe-entry a {
  text-decoration: none;
}

.recipe-entry div {
  overflow: hidden;
  position: absolute;
  background-color: rgba(0, 0, 0, 0.75);
  width: 300px;
  bottom: 0px;
  margin-bottom: 1px;
  border-bottom-right-radius: 12px;
  height: 20px;
  transition: height 0.2s ease-in-out;
  color: white;
  padding: 2px;
}

.recipe-entry div a {
  font-size: 16px;
  font-style: italic;
  color: white;
  text-decoration: none !important;
}

.recipe-entry div p {
  font-size: 12px;
  padding: 2px;
}

.recipe-entry:hover div {
  height: 60px;
}

/* accordion for features */
#accordion div {
  padding: 0px 12px;
}

#accordion a {
  background-color: #e7dbdb;
  border-radius: 3px;
  color: #975d63;
  cursor: pointer;
  display: block;
  font: 0.850em Arial, sans-serif;
  margin: 10px 0;
  padding: 10px 47px 10px 10px;
  text-decoration: none;
  background-repeat: no-repeat;
  background-position: right;
  line-height: 20px;
  outline: none;
}

#accordion a.up:before,
#accordion a.down:before {
  background-image: url(/health/images/features/question-and-answer/all/arrow-upndown-feature.png);
  content: "";
  width: 14px;
  height: 17px;
  background-repeat: no-repeat;
  position: absolute;
  right: 0px;
  margin-right: 15px;
}

#accordion a.up:before {
  background-position: 0px 8px;
}

#accordion a.down:before {
  background-position: -16px 8px;
}

#accordion a:hover {
  opacity: 0.9;
}

.embed-container {
  height: 0;
  margin-bottom: 1em;
  overflow-x: hidden;
  overflow-y: hidden;
  padding-bottom: 56.25%;
  padding-top: 30px;
  position: relative;
  width: 100%;
}

/*==========================================================================
  NOTEPAD
  ==========
==========================================================================*/
#main .note-pad {
  padding: 80px 50px;
  background: url("//images.slimmingworld.co.uk/ui-elements/note-pad/note-pad-header-ie.jpg") center top no-repeat;
  background: url("/health/images/ui-elements/note-pad/note-pad-header.jpg") center top no-repeat, url("/health/images/ui-elements/note-pad/note-pad-footer.jpg") center bottom no-repeat, url("/health/images/ui-elements/note-pad/note-pad-repeat.jpg") top left repeat-y;
  display: table;
}

#main .note-pad .column {
  margin: 20px;
  width: 40%;
  float: left;
}

#main .table-row {
  display: table-row;
}

#main .note-pad .table-row p, #main .note-pad .table-row h3 {
  display: table-cell;
  padding: 10px;
  width: 240px;
}

.table-row {
  display: table-row;
}

.frylight-footer p {
  display: block;
  float: left;
  margin: 25px;
  width: 225px;
  font-size: 15px;
  font-weight: bold;
}

.frylight-footer img {
  float: left;
  position: relative;
  bottom: 0px;
}

/*==========================================================================
  CAMPAIGNS
  ==========
==========================================================================*/
/* XMAS */
#my-xmas-gift {
  backface-visibility: hidden;
  background: url(/health/assets-public/images/xmas-gift.png) no-repeat;
  min-height: 240px;
  position: absolute;
  top: 156px;
  width: 355px;
  right: -35px;
  -ms-transform: rotate(4deg);
  -webkit-transform: rotate(4deg);
  transform: rotate(4deg);
  z-index: 1;
}

#my-xmas-gift .btn-small {
  margin: 180px 0 0 0;
  float: right;
  position: absolute;
  right: 74px;
}

#my-xmas-gift p {
  max-height: 50px;
  position: absolute;
  top: 135px;
  left: 30px;
  width: 240px;
  font-size: 14px;
  padding-top: 5px;
}

#my-xmas-gift p + a {
  position: absolute;
  top: 190px;
  right: 40px;
  color: #C20F0F;
  text-decoration: underline;
}

#my-xmas-gift p + a:hover {
  text-decoration: none;
}

#my-xmas-gift label {
  max-height: 50px;
  position: absolute;
  top: 149px;
  left: 30px;
  width: 240px;
  overflow: visible;
  font: 24px Journal, "Times New Roman", Times, serif;
}

#my-xmas-gift label + p {
  top: 167px;
  font-size: 10px;
}

#my-xmas-gift p {
  overflow: hidden;
}

#my-xmas-gift input[type=text] {
  font-family: Arial;
  font-size: 12px;
  display: block;
  padding: 5px;
  width: 100%;
}

#my-xmas-gift + .welcome + #main + #additional,
#my-xmas-gift + #content #main + #additional {
  margin-top: 160px;
}

body .mobile-detection {
  background: #fff;
  position: fixed;
  left: 0;
  right: 0;
  z-index: 1;
  top: 35px;
  font-size: 1em;
  border-radius: 14px;
  border: 1px solid #ccc;
  padding: 10px;
  z-index: 9999999;
}

body .mobile-detection p {
  margin: 0px;
  padding: 0px;
}

body .mobile-detection p a {
  color: #921515;
  text-decoration: underline;
}

body .mobile-detection a.btn-small {
  float: none;
  position: initial;
  margin: 0 auto;
  padding: 0;
}

/* Plugins
----------------------------------------*/
/* Any 3rd party JS plugins stylesheets you want to add. Only add into the main style sheet if they are commonly used. */
.social-share {
  height: 32px;
  position: relative;
  width: 100%;
  padding-top: 3px;
  float: right;
}

.social-share span.social {
  float: left;
  clear: none;
  text-align: center;
  height: 32px;
  padding: 0;
  text-align: center;
}

.st_fblike_hcount span {
  position: relative;
  top: -1px;
}

.st_plusone_hcount {
  position: relative;
  left: 5px;
  top: 1px;
  right: -3px;
  text-align: center;
}

.stButton .stButton_gradient, .stButton .stMainServices {
  height: 22px !important;
}

/* Shame
----------------------------------------*/
/* Any quick hacks that you need to do can go here */
/* Print styles
----------------------------------------*/
@media print {
  body {
    background: #fff !important;
  }
  nav,
  .weigh-in,
  .utilities,
  .group-search label,
  .group-search input,
  .group-search p,
  #additional, footer,
  .ctasignup,
  .pagination,
  .carousel,
  .recipe-format_links,
  .recipe-intro
.small-image,
  #video,
  .videorecipe,
  .seven-day-nav,
  .carousel-controls,
  .menuKey,
  .social-share,
  #adminpanel,
  #feature-comments,
  #related-links,
  .no-print,
  .print-icon,
  iframe,
  .offer {
    display: none !important;
  }
  /* multi day menus */
  #content #main div.day {
    border: 1px solid #ddd   !important;
    padding: 8px             !important;
    border-radius: 4px       !important;
    margin-bottom: 8px       !important;
    page-break-before: auto;
    page-break-after: auto;
    page-break-inside: avoid;
  }
  #content #main div.meal {
    background-color: #eee      !important;
    padding: 6px          !important;
    border-radius: 4px     !important;
  }
  #content #main div.meal h3 {
    background: red !important;
  }
  img {
    page-break-before: auto;
    page-break-after: auto;
    page-break-inside: avoid;
  }
  #navigation {
    border: 3px solid red;
  }
  .recipe-cta {
    display: block;
  }
  #main h1 {
    color: #000;
    /*text-indent:-999% !important;*/
    display: block;
  }
  header {
    display: none;
  }
  body, .main, .wrapper {
    width: 100%;
    margin: 0;
    padding: 0;
    background-image: none;
    background-color: #fff;
    border: none;
    font-size: 12px;
  }
  .printCTA {
    display: block !important;
    margin-top-top: 20px !important;
    border: solid 1px #eeeeee !important;
    padding: 20px !important;
  }
  .current-offer {
    right: 0;
  }
  .wrapper {
    box-shadow: none;
  }
  @page {
    margin: 2cm;
  }
  #showArrows {
    display: none !important;
  }
  .otherPlans {
    -webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
    box-shadow: none !important;
    display: none !important;
  }
  .otherPlans > span {
    display: none !important;
  }
  div.offer {
    margin-bottom: 12px;
  }
  #main .recipe-header {
    height: 42px !important;
    text-indent: 0px !important;
    background: none !important;
  }
}

/* Fonts
----------------------------------------*/
/* Fonts
============================================*/
@font-face {
  font-family: 'Slimbats-Regular';
  src: url("/health/assets/fonts/slimbats-regular.eot") format("embedded-opentype"), url("/health/assets/fonts/slimbats-regular.otf") format("opentype"), url("/health/assets/fonts/slimbats-regular.woff") format("woff"), url("/health/assets/fonts/slimbats-regular.ttf") format("truetype"), url("/health/assets/fonts/slimbats-regular.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}

abbr[title].sw--icon {
  border-bottom: none;
}

.sw--icon {
  padding: 3px;
  font-size: 20px;
  font-family: 'Slimbats-Regular','Arial Black', 'Arial Bold';
  line-height: 0px;
  text-transform: lowercase;
  border-bottom: none !important;
  color: #94224b;
}

.sw--icon__v {
  color: #a5d86e !important;
}

.sw-icon__search {
  position: absolute;
  margin-top: 13px;
}

.sw--icon__he {
  letter-spacing: -1px;
  padding: 3px 0px;
  margin: 0 -3px;
}

.sw--icon__sp,
.sw--icon__spneg,
.sw--icon__trim,
.sw--icon__knifefork {
  font-size: 0px;
}

.sw--icon__sp:before,
.sw--icon__spneg:before,
.sw--icon__trim:before,
.sw--icon__knifefork:before {
  visibility: visible;
  font-size: 20px;
}

.sw--icon__sp:before {
  content: "\E007";
}

.sw--icon__spneg:before {
  content: "\E006";
}

.sw--icon__trim:before {
  content: "\E008";
}

.sw--icon__knifefork:before {
  content: "\E009";
}

/* Sectional
----------------------------------------*/
.syns .syns-value {
  /*cursor: pointer;*/
}

#main .recipe-header {
  margin-bottom: 6px;
}

@media screen and (max-width: 450px) {
  #main .recipe-header {
    line-height: 1.25;
    border-top: 1px solid #eee;
    padding-top: .5em;
  }
  #main .recipe-header:after {
    height: 0;
    margin-top: 0.25em;
    content: '';
    display: block;
    width: 100%;
    padding-bottom: 50%;
    background-size: cover;
    overflow: hidden;
  }
}

@media screen and (min-width: 451px) {
  #main .recipe-header {
    height: 0;
    background-size: cover;
    overflow: hidden;
    text-indent: 200%;
    white-space: nowrap;
    padding-bottom: 40%;
    width: 100%;
  }
}

.recipe-meta {
  position: relative;
}

.recipe-meta__list {
  margin: 0;
}

.recipe-video__link {
  position: absolute;
  right: 0px;
  width: 265px;
  color: #ffffff;
  text-align: right;
  padding: 5px;
  border-radius: 4px;
  background: #e43931 url(/health/assets/images/youtube-tiny.png) 7px 5px no-repeat;
}

.syns-explain {
  display: none;
}

.printCTA {
  display: none;
}

.recipe-instructions {
  margin-left: -16px;
}

.search-results .a-favourite {
  position: relative;
}

.search-results .a-favourite dl:after {
  position: absolute;
  top: 2px;
  right: 3px;
  content: "favourite";
  font-style: italic;
  padding: 3px 2px 3px 18px;
  background: transparent url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAARCAYAAADQWvz5AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAxRJREFUeNp0VF1IFFEU/u7szM7uiq5lomZlaCKoFaxQKETaQ4ElEoU+1EPYgwQV/ZDZUy+CENlTEfQk9JJQQi/hQ2H+RfQnFWSygj9Z6+6aP7vu7N/s3M7M6OwqNHBm7p1zzne/8517L0sONUKMTgKuYqDqGsA56AXjYQJ4IrwDNinJ7Fmrpk//bwPUNeDbfSAZhibvhWA5IvOAfwSQ3YAom6aP/wy3wT/eBE2kZM00fTw/CMRXjMX0x3wbIzs5BwjwN2DLoQAH/ZQIaKwVvrfNQJSIEgshCSyOAr7XFGe30kVrpCNrCcDbC5S3UQKVFVvajZD3AOTcnRCcLrjyFCTCBP6G/Hoqs2RIM9pgFZ4Ggu+A7BJg+Wcj1JQI5W8hD4zXGwxn+omcnzDEzanQVJPNhklZRHsICM0CgfEz1qK+kdPwky4BKkvMSsfrAYQhsuxdJXzuwznY5BiJrhrwGik63u3E6kydxTn46SRXZq8YpTHFhNeSsu7iRZ4XjCuDgjb98ir7+vgeEnHJUo2vS8Ay5jxjTprD5Q6h5volXlDXx/jaALjoBFa85fjc8xTBicO6FP99dDDizYsPvWKeGxdZVuGCFldgAoH2hkDZ3Cby7w+72FT/bWvlrSCClEDlhTuoOP8APAlGndZSnAoxqqWIVIxoyyo7eLmTgmOY6LsLcQtQisxzs52Vt/Ty+BLl0XYRzPpFcIk+9gwdXOARf/UmFsjQK/ilGu4yMDVqziUHGJMJiOqzMvR2KovbKLgBNlMLON2L1EUJiYjbSFz+cYo2Zofe241zyaCXpsylqdtk8IX3xxENbddxeUHVKGo6WqDGc/Gx6zlbnqtEaL6ChwO1LN8zhlQ8Y0PmlMKy3HJa0XtW155XtXaxIz1HmTPfx9xlE6zhUQ3fd+KJ0faZgWas/aJTMGMZiW1PXw2RYDGPzFWy+u5jrKh20LgqtNR6t8QYq+lsR75nkE8+u8XUJgcd2tjG1cJ4aHidG+m+OrUHNtqt7lIvVMWQAVwzbwGmkag0lehqWfy+n8OxAEde0PQD/wQYAA05Q1KhmFUVAAAAAElFTkSuQmCC) 0 3px no-repeat;
}

.add-to-favourites {
  background: #ccc url(/health/assets/images/ui-elements/add.png) 4px 3px no-repeat !important;
}

.already-in-favourites {
  background: transparent url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAARCAYAAADQWvz5AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAxRJREFUeNp0VF1IFFEU/u7szM7uiq5lomZlaCKoFaxQKETaQ4ElEoU+1EPYgwQV/ZDZUy+CENlTEfQk9JJQQi/hQ2H+RfQnFWSygj9Z6+6aP7vu7N/s3M7M6OwqNHBm7p1zzne/8517L0sONUKMTgKuYqDqGsA56AXjYQJ4IrwDNinJ7Fmrpk//bwPUNeDbfSAZhibvhWA5IvOAfwSQ3YAom6aP/wy3wT/eBE2kZM00fTw/CMRXjMX0x3wbIzs5BwjwN2DLoQAH/ZQIaKwVvrfNQJSIEgshCSyOAr7XFGe30kVrpCNrCcDbC5S3UQKVFVvajZD3AOTcnRCcLrjyFCTCBP6G/Hoqs2RIM9pgFZ4Ggu+A7BJg+Wcj1JQI5W8hD4zXGwxn+omcnzDEzanQVJPNhklZRHsICM0CgfEz1qK+kdPwky4BKkvMSsfrAYQhsuxdJXzuwznY5BiJrhrwGik63u3E6kydxTn46SRXZq8YpTHFhNeSsu7iRZ4XjCuDgjb98ir7+vgeEnHJUo2vS8Ay5jxjTprD5Q6h5volXlDXx/jaALjoBFa85fjc8xTBicO6FP99dDDizYsPvWKeGxdZVuGCFldgAoH2hkDZ3Cby7w+72FT/bWvlrSCClEDlhTuoOP8APAlGndZSnAoxqqWIVIxoyyo7eLmTgmOY6LsLcQtQisxzs52Vt/Ty+BLl0XYRzPpFcIk+9gwdXOARf/UmFsjQK/ilGu4yMDVqziUHGJMJiOqzMvR2KovbKLgBNlMLON2L1EUJiYjbSFz+cYo2Zofe241zyaCXpsylqdtk8IX3xxENbddxeUHVKGo6WqDGc/Gx6zlbnqtEaL6ChwO1LN8zhlQ8Y0PmlMKy3HJa0XtW155XtXaxIz1HmTPfx9xlE6zhUQ3fd+KJ0faZgWas/aJTMGMZiW1PXw2RYDGPzFWy+u5jrKh20LgqtNR6t8QYq+lsR75nkE8+u8XUJgcd2tjG1cJ4aHidG+m+OrUHNtqt7lIvVMWQAVwzbwGmkag0lehqWfy+n8OxAEde0PQD/wQYAA05Q1KhmFUVAAAAAElFTkSuQmCC) 6px 3px no-repeat !important;
}

.search-results .recipe-meta {
  clear: both;
  padding: 0.4em 0.1em;
  font-size: 90%;
  margin: 0;
  overflow: hidden;
  color: #333;
}

.search-results .recipe-meta dt, .search-results .recipe-meta dd, .search-results .recipe-meta ul, .search-results .recipe-meta li {
  display: inline;
  font-style: italic;
  margin: 0;
}

.search-results .recipe-meta dt {
  margin-left: 6px;
  padding-left: 2em;
  background: transparent url(/health/assets/images/ui-elements/recipe-icons.png) 2px 1px no-repeat;
}

.search-results .recipe-meta dd, .search-results .recipe-meta li {
  /*font-weight:bold;*/
  font-style: normal;
}

.search-results dt.serves-title {
  background-position: 5px -48px;
  padding-left: 2.5em;
  margin-left: 0;
}

.search-results dt.syns-title {
  background-position: 2px -104px;
}

.search-results .serves-title, .search-results .ready-title {
  border-left: 1px solid #ccc;
}

dd.syns-value {
  margin-left: -15px !important;
}

.meta-syns {
  /*background:transparent url(/health/assets/images/ui-elements/syn-icons.gif) 0px 3px no-repeat;
padding:0 12px;*/
}

.syns-original {
  background-position: 0 -17px;
}

.syns-extra-easy {
  background-position: 0 -38px;
}

li.syns .syns-title {
  float: left;
  margin-right: 2px;
}

ul.syns-value {
  margin-left: 3px !important;
  display: inline;
}

.recipe-header__vegetarian em {
  background: transparent url(/health/assets/images/ui-elements/recipe-icons.png) center -152px no-repeat;
  display: block;
  display: inline-block;
  text-indent: -1000px;
  overflow: hidden;
  width: 22px;
  height: 26px;
}

.small-image, .meta-thumb {
  float: right;
  margin-left: 1.3em;
  padding: 3px;
  border: 1px solid #cdcdcd;
  background-color: #fff;
}

@media screen and (max-width: 560px) {
  .small-image {
    display: block;
    float: none;
    margin: auto 0 1em 0;
    width: 100%;
  }
}

.recipe-meta img.meta-thumb {
  float: left;
  border-radius: 0;
  margin: 0.65em 8px 0.65em 0;
  background: #fff;
  padding: 3px;
  border: 1px solid #ccc;
}

@media screen and (max-width: 440px) {
  .recipe-meta img.meta-thumb {
    display: none;
  }
}

.recipe-full-meta {
  display: block;
  position: relative;
  padding-bottom: 0;
  color: #666;
  clear: both;
}

.recipe-full-meta strong, .recipe-full-meta span, .recipe-full-meta p {
  color: #444;
}

.recipe-full-meta p {
  margin-bottom: 0;
}

.recipe-full-meta .syns-title {
  color: #666;
  font-style: italic !important;
}

#main .recipe-meta-list {
  padding-left: 0;
  margin-left: 0;
  overflow: hidden;
  font-size: 0.9em;
  max-width: 345px;
}

#main .recipe-meta-list .serves-title,
#main .recipe-meta-list .time-title,
#main .recipe-meta-list .recipe-vegetarian__title,
#main .recipe-meta-list .syns-title {
  padding-left: 32px;
}

#main .recipe-meta-list .freezer-friendly {
  padding-left: 4px;
}

#main .recipe-meta-list li {
  padding-top: 1px;
  margin: 0;
  font-style: italic;
}

#main .recipe-meta-list li strong {
  font-style: normal;
}

#main .recipe-meta-list li .sw--icon {
  font-style: normal;
  color: inherit;
  margin-right: -1px;
}

#main .recipe-meta-list li .sw--icon.sw--icon__spneg {
  margin-left: 0px;
}

#main .recipe-meta-list li .sw--icon.sw--icon__i {
  padding-right: 7px;
}

#main .recipe-meta-list li.syns li {
  clear: none;
  margin-right: 12px;
}

#main .recipe-meta-list li.syns li .ExtraEasy {
  background-position: 0 -200px;
  display: inline;
}

#main .recipe-meta-list li.syns li .planCompare {
  background-position: 0 -200px;
  display: none;
  font-weight: normal !important;
  text-decoration: underline;
}

#main .recipe-meta-list li.syns span {
  font-style: normal;
}

#main .recipe-meta-list li.syns span.Original, #main .recipe-meta-list li.syns span.ExtraEasyShown, #main .recipe-meta-list li.syns span.Green {
  background-image: url(/health/assets/images/ui-elements/syn-icons.gif);
  background-position: 0px 5px;
  background-repeat: no-repeat;
  padding-left: 16px;
  float: left;
  margin: 2px 6px 0 6px;
}

#main .recipe-meta-list li.syns span.Original {
  background-position: 0 -15px;
}

#main .recipe-meta-list li.syns span.ExtraEasyShown {
  background-position: 0 -37px;
}

#main .recipe-meta-list li.syns span.Green {
  background-position: 0 3px;
}

#main .recipe-meta-list li.syns span .clickToCompare {
  float: left;
  width: 80%;
  margin: 6px 6px 0 26px;
  font-weight: normal !important;
  text-decoration: underline;
  color: #666;
}

#main .recipe-meta-list li.syns span .recipeTip p {
  float: left;
  width: 100%;
  margin: 6px 6px 0 6px;
  font-weight: normal !important;
  color: #666;
}

#main .recipe-meta-list li.syns div {
  width: 100%;
}

.noBackground {
  background: #DFDEDE !important;
  padding-left: 0 !important;
  -webkit-box-shadow: none !important;
  -moz-box-shadow: none !important;
  box-shadow: none !important;
}

.otherPlans {
  position: absolute;
  right: 217px;
  top: 90px;
  width: 200px;
  background: #efeaea;
  display: none;
  width: 150px !important;
  border-radius: 4px;
  -webkit-box-shadow: 2px 0px 3px -1px rgba(0, 0, 0, 0.35);
  -moz-box-shadow: 2px 0px 3px -1px rgba(0, 0, 0, 0.35);
  box-shadow: 2px 0px 3px -1px rgba(0, 0, 0, 0.35);
  padding-bottom: 3px;
  z-index: 999;
  opacity: 1;
  margin-left: 3px;
}

.otherPlansExpanded {
  width: 360px !important;
}

.time-title {
  padding-left: 26px;
  background-position: 0px 0px;
  background: transparent url(/health/assets/images/ui-elements/recipe-icons.png) 3px 3px no-repeat;
}

li.serves-title, li.time-title, span.syns-title, li.recipe-vegetarian__title {
  padding-left: 26px;
  background: transparent url(/health/assets/images/ui-elements/recipe-icons.png) 3px 3px no-repeat;
}

li.serves-title {
  background-position: 3 -47px;
}

span.syns-title {
  padding-left: 26px;
  background-position: 3px -103px;
}

li.recipe-vegetarian__title {
  background-position: 3px -161px;
}

.print-icon, .video-icon a, .favourite-icon > a, .favourite-icon > span {
  cursor: hand;
  cursor: pointer;
  text-decoration: none !important;
  color: #333;
  display: block;
  padding: 4px 12px 4px 26px;
  font-size: 11px;
  background: #ccc url(//www.slimmingworldusa.com/images/ui-elements/printer.png) 6px 3px no-repeat;
}

.video-icon a {
  background: #ccc url(/health/assets/images/ui-elements/video-tiny.png) 4px 3px no-repeat;
}

.favourite-icon > span {
  cursor: default;
}

@media screen and (max-width: 640px) {
  .print-icon {
    display: none;
  }
}

p.print-icon, p.video-icon, ul.recipe-format_links {
  border: 1px solid #bbb;
  background-color: #ccc;
  border-right: 0;
  border-top: 0;
  border-radius: 0px 0px 0px 6px;
  color: #333;
  position: absolute;
  top: 0px;
  right: 0px;
  margin: 0 !important;
}

p.print-icon li, p.video-icon li, ul.recipe-format_links li {
  margin: 0 !important;
}

.search-results li {
  position: relative;
}

.remove-container {
  position: absolute;
}

.delete-info {
  margin-left: 610px !important;
  margin-top: 70px !important;
}

.remove-from-favourites {
  background: url(/health/images/ui-elements/delete.png);
  width: 16px;
  height: 16px;
  bottom: 6px;
  right: 6px;
  z-index: 9999;
  position: absolute;
}

.print-icon:hover, .print-icon:focus, .print-icon:active {
  color: #000;
}

li.print-icon {
  border-bottom: 1px solid #bbb;
}

li.favourite-icon {
  border-bottom: 1px solid #bbb;
}

p.video-icon {
  z-index: 999;
  width: 100px;
  height: 26px;
}

span.info-icon {
  height: 16px;
  width: 16px;
  text-decoration: none !important;
  color: #333;
  display: inline-block;
  background: url(/health/assets/images/ui-elements/information.png);
  margin: 0;
  padding: 0;
  position: relative;
  top: 3px;
  -webkit-transition: 2s;
}

#food-preferences-info, .info-box {
  display: block;
  position: absolute;
  width: 160px;
  background: rgba(0, 0, 0, 0.85);
  margin-top: -95px;
  margin-left: 225px;
  z-index: 9999;
  border-radius: 4px;
}

#food-preferences-info span.arrow, .info-box span.arrow {
  border-bottom-color: transparent !important;
  border-left-color: transparent !important;
  border-right-color: transparent !important;
}

#food-preferences-info p, .info-box p {
  color: #F2F2F2;
  margin: 10px 10px 10px 10px;
  font-size: 14px;
  line-height: 18px;
}

.recipe-intro {
  display: block;
  clear: both;
  position: relative;
  margin-top: 2em;
}

.recipe-intro-small {
  float: right;
  margin: 0;
  margin-bottom: 10px;
}

.recipe-thumb {
  position: relative;
}

.recipe-thumb_video {
  border: 4px solid #000;
}

.recipe-thumb_video:after {
  content: " ";
  height: 100%;
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  pointer-events: none;
  z-index: 999;
  background: transparent url(/health/assets/images/ui-elements/video-play.png) 36px 36px no-repeat;
  opacity: 0.7;
  transition: all 300ms ease;
}

.recipe-thumb_video:hover:after {
  opacity: 1;
}

#additional a {
  position: relative;
  /*top: 5px;*/
}

#additional .recipe--conversion {
  text-align: center;
  font: 0.825em Arial, sans-serif;
}

#additional .recipe--conversion h4 {
  text-align: left;
}

#additional .recipe--conversion fieldset {
  border: none;
  margin: 0 -12px;
  padding: 0;
}

#additional .recipe--conversion fieldset .recipe--conversion__value,
#additional .recipe--conversion fieldset .recipe--conversion__unit {
  font-size: 14px;
  margin: 12px 0;
}

#additional .recipe--conversion fieldset .recipe--conversion__value {
  text-align: right;
  -moz-appearance: textfield;
  padding-right: 5%;
  width: 39%;
}

#additional .recipe--conversion fieldset .recipe--conversion__value::-webkit-inner-spin-button, #additional .recipe--conversion fieldset .recipe--conversion__value::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

#additional .recipe--conversion fieldset .recipe--conversion__unit {
  width: 44%;
  padding: 5px;
  clear: right;
}

#additional .recipe--conversion script + p {
  padding: 0;
  line-height: 0;
}

#additional .recipe--conversion .recipe--conversion--answer {
  border-top-left-radius: 1em;
  border-bottom-right-radius: 1em;
  color: #666;
  /*background-color: #975d63;*/
  margin-bottom: 0;
  margin-top: 0;
}

#additional .recipe--conversion .recipe--conversion--answer #answer-value {
  font-size: 350%;
}

/*==========================================================================
  Videos that appear in features and not in the main body
==========================================================================*/
.videorecipe {
  width: 215px;
  float: right;
}

.videorecipe .watch-img {
  padding: 10px 0 10px 0;
}

#main .videorecipe .video-img {
  float: left;
  margin-right: 10px;
  border: 1px solid #ccc;
  border-radius: 6px;
  padding: 3px;
  margin-top: 0px;
}

.video-wrapper {
  position: relative;
}

.video-cover {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 51;
  background-position: 50% 0px;
  cursor: pointer;
}

.video-cover_play {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 50;
  margin-left: -22px;
  margin-top: -22px;
  cursor: pointer;
}

.categorys {
  margin-left: 0px;
}

.categorys li {
  width: 110px;
  float: left;
  display: inline;
  margin-right: 45px;
  text-align: center;
  margin-bottom: 25px;
  height: 127px;
}

.categorys a {
  padding-top: 112px;
  display: block;
  height: 15px;
}

.categorys-breakfast {
  background: url(/health/images/features/recipes/all/breakfast.jpg) top center no-repeat;
}

.categorys-lunch {
  background: url(/health/images/features/recipes/all/lunch.jpg) top center no-repeat;
}

.categorys-dinner {
  background: url(/health/images/features/recipes/all/dinner.jpg) top center no-repeat;
}

.categorys-dessert {
  background: url(/health/images/features/recipes/all/dessert.jpg) top center no-repeat;
}

.categorys-snacks {
  background: url(/health/images/features/recipes/all/snacks.jpg) top center no-repeat;
}

.categorys-starters {
  background: url(/health/images/features/recipes/all/starters.jpg) top center no-repeat;
}

.recipe-gallery-list {
  padding: 0;
  margin: 0;
}

.recipe-gallery-list li {
  position: relative;
  min-height: 98px;
  padding: 0;
  padding-left: 68px;
  margin: 0px;
}

.recipe-gallery-list img {
  position: absolute;
  left: 0;
  background-color: #fff;
  border: 1px solid #ccc;
  padding: 2px;
  border-radius: 2px;
}

.results-summary-title {
  margin: 1em 0 0 0;
}

.results-count {
  border-bottom: 2px dotted #ccc;
  padding: 0;
  margin-bottom: 0;
}

#advanced-recipe-bd {
  display: none;
  width: 100%;
}

.no-js #advanced-recipe-toggle {
  display: none;
}

.no-js #advanced-recipe-bd {
  display: block;
}

.no-js #advanced-recipe-bd fieldset {
  padding: 0;
  margin: 0;
}

#advanced-recipe-bd input {
  margin: 0 0 0.65em 1em;
}

.recipe-search__filters {
  width: 50%;
  float: left;
  clear: none;
}

.search-input__advanced-label {
  font-weight: bold;
  display: block;
  margin-bottom: 0.65em;
}

.recipe-search__time {
  display: block;
  clear: both;
  border-top: 1px solid #ccc;
  margin: 0.65em;
  padding: 0.65em;
  text-align: center;
}

.advanced-search {
  padding-left: 10px;
  background: transparent url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAAHCAYAAAFYYtxGAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAE1JREFUeNpiaAACgABiABEAAcTw//9/BmZGRsYGgABiBHOBgIkBAhoAAogBJg8SaWhsbIRLQURADIAAg+sCCdTX1zOwMCAAWA+KAIgAAF2ZF5ahmLrsAAAAAElFTkSuQmCC) left center no-repeat;
}

.advanced-search.active {
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAECAYAAAE1wRXrAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAD1JREFUeNpiaAACgABiABEAAcQIZgEBQAAxQmkwUV9f3wAQQHAZEGCCyYBogABDUYoGGlhgDCS6AWgemAMAkwwShaSU+7cAAAAASUVORK5CYII=);
}

#additional .form-search__input {
  width: 152px;
}

#additional .advanced-search__recipes {
  display: none;
}

.no-js #advanced-recipe-toggle {
  display: none;
}

.top-tips {
  padding: 20px;
  background: #ffe6c2;
}

/*==========================================================================
  RECIPES - FIND A RECIPE PAGE
==========================================================================*/
.browse-thumbs {
  width: 100%;
  overflow: hidden;
}

#main .recipe-browse {
  width: 48%;
  margin: 10px 10px 0 0;
  padding: 0;
  float: left;
  overflow: hidden;
  position: relative;
  text-align: center;
}

#main .recipe-browse a {
  text-decoration: none;
}

#main .recipe-browse a img {
  width: 100%;
}

#main .recipe-browse:nth-child(even) {
  margin-right: 0px;
}

@media screen and (max-width: 480px) {
  #main .recipe-browse {
    width: 100%;
    float: none;
    clear: both;
    display: block;
  }
}

#main .recipe-browse .caption {
  position: relative;
  text-align: left;
  display: block;
  padding: 8px;
  width: 100%;
  background: #1d1d1d;
  color: #fff;
  margin-top: -11px;
}

#main .recipe-browse .caption p {
  font-size: 75%;
  line-height: 1.35;
  min-height: 80px;
}

#main .recipe-browse .caption h3 {
  font-size: 95%;
  color: #fff;
  margin-bottom: 0;
}

@media screen and (min-width: 960px) {
  #main .recipe-browse {
    margin-bottom: 0.5em;
    max-height: 138px;
    border-radius: 0 0 10px 4px;
    width: 49%;
    margin: 0 12px 10px 0;
  }
  #main .recipe-browse:hover .caption {
    height: 98px;
    margin: -101px 4px 4px 0px;
    background: rgba(0, 0, 0, 0.75);
  }
  #main .recipe-browse .caption {
    position: absolute;
    color: #fff;
    background: rgba(0, 0, 0, 0.65);
    transition: all .25s ease-in-out;
    margin-top: -30px;
  }
}

.recipe-browse span {
  font-size: 16px;
}

.lt-ie9 .recipe-browse .caption {
  background-color: #000000;
  background: #000000;
}

.lt-ie8 .recipe-browse .caption {
  position: relative;
}

.caption span, .caption p a {
  color: #fff;
}

.recipe-popup {
  text-decoration: none !important;
}

.syns-arrow-down, .syns-arrow-up {
  width: 0 !important;
  height: 0;
  margin: 6px;
  float: right;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-top: 8px solid #acacac;
  cursor: pointer;
}

.syns-arrow-up {
  border-top: 0;
  border-bottom: 8px solid #acacac;
}

.syns-arrow-right {
  width: 0 !important;
  height: 0;
  margin: 2px;
  margin-right: 16px;
  border-style: solid;
  border-width: 8px 0 8px 10px;
  border-color: transparent transparent transparent #acacac;
  float: right;
}

#showArrows {
  display: none;
}

.js-video iframe {
  width: 100%;
}

/* import getting-sarted2 so it renders to main */
/*
Shared between mobile and desktop sites.
*/
/*#additional {
    display:none;
}

#main {
    float:none;
    margin:auto;
    }*/
/*#########################################################

                FLEXSLIDER OVERRIDES

#########################################################*/
.article-fig {
  display: none !important;
}

ul#js-slider {
  list-style: none;
  position: absolute;
  top: 0;
  left: 0;
  width: 99%;
  height: 100%;
  z-index: 10;
  padding-left: 0;
  margin-left: 0;
}

ul#js-slider li {
  width: 100%;
  height: 100%;
}

.js-slides-bg {
  width: 100%;
}

.flexslider {
  width: 100%;
  height: 0;
  padding-top: 62%;
  amrgin: 0;
  border: none;
}

.flexslider img {
  border-radius: 0;
  border: 1px solid #ccc;
}

/*.slide-content {
	background: #000;
}*/
.slide-content_br {
  /*  background-image:none; //overwrite gradient
    padding:3px;
    border-radius:1px;
    outline:6px solid rgba(255,255,255,0.35);
    width:100%;
    max-width:400px;
    padding:8px;
    margin:auto 6px;
    right:4px;
    color:#fff;
	background-color:#000;*/
}

@media screen and (max-width: 460px) {
  .slide-content_br {
    bottom: 3px;
    margin: 0;
    left: 0;
    right: 0;
    padding: 4px 8px;
  }
}

.slide-content_br .bg {
  background: #000;
}

.slide-caption {
  margin-top: 0;
  font-size: 13px;
}

.flex-control-nav {
  /*display: none;*/
}

.flexslider:hover .flex-prev {
  margin-left: -10px;
}

.flexslider:hover .flex-next {
  margin-right: -10px;
}

.flexslider .flex-direction-nav {
  position: absolute;
  top: 12%;
  left: 0;
  right: 0;
  z-index: 100;
  padding: 0;
  margin: 0 16px 0 10px;
  background-image: none;
}

@media screen and (min-width: 640px) {
  .flexslider .flex-direction-nav {
    top: 40%;
  }
}

.flexslider .flex-direction-nav li {
  list-style: none;
  margin: 0;
  padding: 0;
}

.flexslider .flex-direction-nav a {
  width: 30px;
  height: 30px;
  position: absolute;
  top: 0;
  text-indent: 200%;
  overflow: hidden;
  border-radius: 20px;
  color: transparent;
  opacity: 0.7;
  margin: -10px 0 0;
}

.flexslider .flex-direction-nav a.flex-prev {
  left: 0px;
  background: #fff url("http://mobile.slimmingworld.co.uk/assets/css/img/sprite.png") -313px -284px no-repeat !important;
}

.flexslider .flex-direction-nav a.flex-next {
  right: 0px;
  background: #fff url("http://mobile.slimmingworld.co.uk/assets/css/img/sprite.png") -168px -136px no-repeat !important;
}

/*#########################################################

                END FLEXSLIDER OVERRIDES

#########################################################*/
/* GETTING STARTED DOWNLOAD BOXES AND SYNS TOOLS INFO */
#weight-in {
  float: none;
  width: inherit;
}

@media (max-width: 514px) {
  .full-width {
    display: block;
    width: 100%;
    margin-top: 0;
    float: right;
    max-width: 540px;
  }
}

@media (min-width: 515px) {
  .full-width {
    display: block;
    width: 100%;
    margin-top: 2em;
    float: right;
    max-width: 540px;
  }
}

@media (max-width: 514px) {
  .full-width-synstools {
    width: 100%;
    margin-top: 0;
    max-width: 400px;
    margin-bottom: 0;
    float: none;
  }
}

@media (min-width: 515px) {
  .full-width-synstools {
    width: 100%;
    margin-top: 0.1em;
    max-width: 400px;
    margin-bottom: 0;
    float: none;
  }
}

@media (max-width: 514px) {
  .viewfeature .article-content .download-image {
    width: 200px;
    padding-right: 1.4;
    float: left;
    border-radius: 0px;
    margin-top: 2em;
  }
}

@media (min-width: 515px) {
  .viewfeature .article-content .download-image {
    width: 200px;
    padding-right: 1.4;
    float: left;
    border-radius: 0px;
  }
}

.getting-started-bullets {
  list-style-position: outside;
  list-style-type: disc;
  display: block;
}

h3 .hex-a-b-title {
  font-style: italic;
  font-size: 40px;
}

h2 .hex-a-b-title {
  font-style: italic;
  font-size: 40px;
}

p .hex-a-b-para {
  font-style: italic;
  font-size: 30px;
  font-family: times new roman;
  font-weight: bold;
  line-height: 0.7;
}

/* download-box wass used before we added background images. 
Could be used in future if we decide not to have background images any more */
.download-box {
  background-color: #E8E7E7;
  border: 1px solid #CFCACA;
  border-radius: 0.25em;
  padding: 0.65em;
  margin-bottom: 0.65em;
  display: block;
  overflow: hidden;
}

.download-box--superfree {
  background-image: url("/health/images/features/superfree-and-free-food/all/superfree-download.jpg");
  background-position: left bottom;
  background-repeat: no-repeat;
  background-size: cover;
  background-color: #E8E7E7;
  border: 1px solid #CFCACA;
  border-radius: 0.25em;
  padding: 0.65em;
  margin-bottom: 0.65em;
  display: block;
  overflow: hidden;
}

.download-box--hex {
  background-image: url("/health/images/features/what-are-healthy-extras/all/hex-download.jpg");
  background-position: left bottom;
  background-repeat: no-repeat;
  background-size: cover;
  background-color: #E8E7E7;
  border: 1px solid #CFCACA;
  border-radius: 0.25em;
  padding: 0.65em;
  margin-bottom: 0.65em;
  display: block;
  overflow: hidden;
}

.download-box--syns {
  background-image: url("/health/images/features/what-are-syns/all/syns-download.jpg");
  background-position: left bottom;
  background-repeat: no-repeat;
  background-size: cover;
  background-color: #E8E7E7;
  border: 1px solid #CFCACA;
  border-radius: 0.25em;
  padding: 0.65em;
  margin-bottom: 0.65em;
  display: block;
  overflow: hidden;
}

/* This download-info is needed for the Syns tools on 'what-are-syns.aspx' */
@media (max-width: 514px) {
  .download-info {
    margin-left: 0;
  }
}

@media (min-width: 515px) {
  .download-info {
    margin-left: 13.4em;
    margin-bottom: 2em;
  }
}

/* the download title, description and buttons need 
to float right when the page is viewed at a wider size.
The Syns version needs extra margin on the right, as the
text is quite short. */
@media (min-width: 650px) {
  .download-box--download-info {
    float: right;
  }
}

@media (min-width: 650px) {
  .download-box--download-info-syns {
    float: right;
    margin-right: 4em;
  }
}

.download-box h4 {
  padding-bottom: 4px;
}

.download-box .btn:hover {
  background: url("/health/assets-public/css/img/download.png") no-repeat left center;
}

#main .download-box h1 {
  margin-bottom: 0;
}

.viewfeature .article-content .syns-image {
  width: 110px;
  margin-right: 1em;
  float: left;
}

@media (min-width: 515px) {
  a.btn-download {
    padding: 0.5em 0.5em 0.5em 3em;
    background: url("/health/assets-public/css/img/download.png") no-repeat left center;
    text-align: left;
    background-color: #fff;
    display: block;
  }
}

@media (max-width: 514px) {
  a.btn-download {
    padding: 0.5em 0.5em 0.5em 3em;
    background: url("/health/assets-public/css/img/download.png") no-repeat left center;
    text-align: left;
    background-color: #fff;
    display: block;
  }
}

/* where there's a 2nd download button on a mobile, the button 
needs this extra margin at the bottom so that the background 
image can been seen underneath it  */
@media (min-width: 650px) {
  a.btn-download--last {
    padding: 0.5em 0.5em 0.5em 3em;
    background: url("/health/assets-public/css/img/download.png") no-repeat left center;
    text-align: left;
    background-color: #fff;
    margin-bottom: 2em;
    display: block;
  }
}

@media (max-width: 649px) {
  a.btn-download--last {
    padding: 0.5em 0.5em 0.5em 3em;
    background: url("/health/assets-public/css/img/download.png") no-repeat left center;
    text-align: left;
    background-color: #fff;
    margin-bottom: 10em;
    display: block;
  }
}

/* the two styles below, make sure the desktop red download buttons "display:block"*/
.btn-block {
  display: block;
}

.btn-block--last {
  display: block;
  margin-bottom: 2em;
}

a.btn-download-desktop {
  padding: 0.5em 0.5em 0.5em 3em;
  background: url("/health/assets-public/css/img/download.png") no-repeat left center;
  text-align: left;
  background-color: #fff;
  color: #000;
  text-shadow: none;
  width: 317px;
}

a.btn-synstools-desktop {
  padding: 0.5em 0.5em 0.5em 3em;
  text-align: left;
  background-color: #fff;
  color: #000;
  text-shadow: none;
  width: 317px;
}

a.btn-synstools {
  text-align: left;
  background-color: #fff;
  margin-bottom: -1em;
}

.synsinfo {
  margin-left: 9em;
  float: right;
}

.synstools-box {
  overflow: hidden;
  margin-top: 0.65em;
  margin-bottom: 1.65em;
}

.synstools-para {
  margin-top: -1em;
  margin-bottom: 2em;
}

.section p:last-child {
  margin-top: 0em;
  margin-bottom: 1em;
}

.download-image {
  float: left;
}

.download-image-syns-desktop {
  width: 210px;
  margin-right: 15px;
}

/*MEMBERS HOMEPAGE GETTING STARTED STYLING */
#cphContent_cphContent_gettingStarted {
  width: 590px;
  overflow: auto;
  border: 1px solid #e5e0e0;
  margin-bottom: 0.65em;
  padding: 8px 12px 0 12px;
  border-radius: 0 0 4px 4px;
  padding-bottom: 0.65em;
}

#cphContent_cphContent_gettingStarted h1 {
  margin-bottom: 0.35em;
}

#main .col2 h4 {
  text-decoration: underline;
  margin-bottom: 0;
}

.pad-btm {
  padding-bottom: 10px;
}

.getting-started-thumb {
  float: left;
  margin-right: 14px;
}

.getting-started-sponsored {
  float: none;
  margin-right: 0;
}

.getting-started-info-sponsored {
  width: 274px;
}

.col2 .underline-none {
  text-decoration: none;
  margin-top: 0;
}

.getting-started-btn {
  padding: 6px 30px 6px 30px;
  float: left;
  width: 110px;
  margin-left: 16px;
}

.getting-started-para {
  font-size: 16px;
  line-height: 22px;
  font-weight: bold;
}

.getting-started-steps {
  font-size: 13px;
  line-height: 20px;
  margin-bottom: 0;
  text-align: center;
  margin-top: -10px;
  margin-left: 17px;
}

#main .getting-started-h1 {
  margin-bottom: 0;
  clear: both;
}

#main .h1-margin {
  margin-top: 19px;
}

#main .getting-started-h3 {
  padding-bottom: 2px;
  margin-bottom: 0;
}

#main #home-additional-wrapper {
  border-top: none;
  border-bottom: none;
}

.sponsored-1 .home-additional {
  margin-right: 17px;
}

.wider {
  margin-right: 17px;
}

.steps-column {
  width: 32%;
  float: left;
  padding-right: 7px;
  height: 200px;
}

.get-started-img {
  width: 99%;
}

.width-96 {
  width: 96% !important;
}

.pat-success {
  border-top: 2px dotted #ccc;
  width: 580px;
  float: left;
  /* contain floated children*/
  padding-bottom: 1em;
}

.pat-success img {
  float: right;
  margin-left: 0.65em;
  padding: 3px;
  border-radius: 3px;
  border: 1px solid #ccc;
}

.details-edit {
  border-top: 2px dotted #ccc;
  margin-bottom: 0.65em;
  padding-top: 15px;
  padding-left: 125px;
  position: relative;
  display: block;
  float: left;
  /*contain floated kiddies*/
  border-top: 1px dotted #ccc;
  width: 485px;
  height: 130px;
}

.details-edit img {
  position: absolute;
  top: 20px;
  left: 0;
  border: 1px solid #ccc;
  padding: 3px;
  border-radius: 3px;
}

.details-edit-alt {
  height: auto;
}

#main .details-edit-alt .btn-small {
  position: relative;
  top: auto;
}

#content .details-edit p {
  margin-top: 3px;
  margin-bottom: 5px;
}

#content .details-edit h3 {
  margin-top: 0;
  margin-bottom: 0;
}

.details-edit .btn-small {
  width: 200px;
  font-weight: bold;
  display: block;
  position: absolute;
  top: 109px;
}

.details-edit.last {
  margin-bottom: 4em;
}

.smallprint {
  font-size: 11px;
}

/* Forms */
/*finding a section labelled forms in this stylesheet fills me with dread. Cover me, im going in .*/
#content dl.update-form {
  line-height: 18px;
  margin-left: 10px;
}

#content dl.update-form dt label {
  display: block;
  font-weight: bold;
  padding-right: 20px;
  text-align: right;
}

#content dl.update-form dd {
  display: inline;
  float: left;
  margin-bottom: 10px;
  width: 240px;
}

#content dl.update-form dt {
  display: inline;
  float: left;
  margin-bottom: 10px;
  width: 186px;
}

#content .smalltext {
  font-size: 10px;
  font-weight: normal;
  line-height: 12px;
}

#content dl.update-form dd input {
  width: 180px;
  border: 1px solid #CCCCCC;
}

#content dl.update-form dd .radio-label input {
  width: auto;
  border: none;
}

#content .update-form dd.multiple-fields {
  margin-left: 205px;
}

.important {
  color: red;
}

.error {
  color: red;
  display: block;
}

/* PASSWORD CHECK BLOCK */
.password-check-result {
  font-size: 1em !important;
  display: block;
  margin: 0.25em 0;
  color: black;
  padding: 0.15em;
  border: solid 1px #666;
}

.shortPass {
  background-color: #FF8B8B;
}

.badPass {
  background-color: #FFD08B;
}

.goodPass {
  background-color: #FCFF8B;
}

.strongPass {
  background-color: #A2FF8B;
}

.main table.tableGeneral {
  border-bottom-width: 0px;
}

#main #PDI_container7938087 .pds-box {
  width: 610px;
  margin-bottom: 20px;
}

#main #PDI_container7938087 .pds-input-label {
  width: 500px;
}

#PDI_container7989862 .pds-links A {
  visibility: hidden;
}

.conversion-tool {
  position: relative;
}

.conversion-tool input {
  margin: 5px 5px;
  width: 100px;
}

.conversion-tool input[type="button"] {
  width: auto;
  position: absolute;
  right: 0;
}

*, *:before, *:after {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

@font-face {
  font-family: 'goudy italic';
  src: url("/health/assets-public/fonts/sorts-mill/sortsmillgoudy-italic.ttf") format("truetype");
}

@font-face { 
  font-family: 'x4Rfaw';
  src: url("/health/assets-public/fonts/x4rfawa-regular.woff2") format('woff2'),
    url("/health/assets-public/fonts/x4rfawa-regular.woff") format('woff');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'x4Rfaw';
  src: url("/health/assets-public/fonts/x4rfawb-regular.woff2") format('woff2'),
    url("/health/assets-public/fonts/x4rfawb-regular.woff") format('woff');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'journal';
  src: url("/health/assets-public/fonts/journal/journal-webfont.eot");
  /* IE9 Compat Modes */
  src: url("/health/assets-public/fonts/journal/journal-webfont.eot?#iefix") format("embedded-opentype"), url("/health/assets-public/fonts/journal/journal-webfont.woff") format("woff"), url("/health/assets-public/fonts/journal/journal-webfont.ttf") format("truetype"), url("../fonts/journal/journal-webfont") format("svg");
  /* Legacy iOS */
}

.btn {
  background: #3b3a39;
  text-decoration: none;
  border: none;
  position: relative;
  vertical-align: top;
  height: 40px;
  padding: 0;
  color: white;
  text-align: center;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
  border: 0;
  border-bottom: 2px solid #212120;
  cursor: pointer;
  -webkit-box-shadow: inset 0 -2px #212120;
  box-shadow: inset 0 -2px #212120;
  transition: all 0.5s ease;
  min-width: 4em;
}

.btn:hover {
  background: #555452;
}

.btn--primary {
  background: #E40033;
  text-decoration: none;
  border: none;
  position: relative;
  vertical-align: top;
  height: 40px;
  padding: 0;
  color: white;
  text-align: center;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
  border: 0;
  border-bottom: 2px solid #b10028;
  cursor: pointer;
  -webkit-box-shadow: inset 0 -2px #b10028;
  box-shadow: inset 0 -2px #b10028;
  transition: all 0.5s ease;
  min-width: 4em;
}

.btn--primary:hover {
  background: #ff184c;
}

a {
  text-decoration: underline;
}

.img-thumbnail-placeholder, .img-thumbnail, blockquote p.quote img, #additional .panel img, #additional .side-nav ul a img, .side-nav ul #additional a img, #main img {
  display: inline-block;
  max-width: 100%;
  height: auto;
  padding: 4px;
  line-height: 1.42857143;
  background-color: #fff;
  border: 1px solid #ddd;
  border-radius: 4px;
  -webkit-transition: all .2s ease-in-out;
  -o-transition: all .2s ease-in-out;
  transition: all .2s ease-in-out;
}

.hr, .content article hr, aside article hr, #main hr {
  border: 0;
  height: 0;
  border-top: 1px solid rgba(0, 0, 0, 0.1);
  border-bottom: 1px solid rgba(255, 255, 255, 0.3);
  width: 80%;
}

img:before {
  content: '';
  float: left;
  padding-bottom: 56.25%;
}

img:after {
  content: '';
  display: table;
  clear: both;
}

.nav-toggle__label {
  width: 18%;
  position: fixed;
  box-shadow: 0 0 3px 2px rgba(0, 0, 0, 0.5);
  background-position: 10px 14px;
}

.fixed-header {
  padding-top: 0;
}

.posted.err {
  display: block;
  padding-bottom: 20px;
}

header p {
  font-family: 'goudy italic ', serif;
  text-align: center;
  line-height: 2em;
  margin: 0 0 1em;
  font-size: 1em
}

header p span {
  font-family: 'x4Rfaw', sans-serif;
  color: #E40033;
  font-size: 2.4em;
  position: relative;
  top: 2px;
  left: 1px;
}

.container {
  max-width: 948px;
  margin-left: auto;
  margin-right: auto;
  background: #fff;
}

.container:after {
  content: " ";
  display: block;
  clear: both;
}

.container:after {
  content: " ";
  display: block;
  clear: both;
}

.hero article {
  width: 100%;
  float: right;
  margin-bottom: 2em;
}

.hero article p {
  margin: 0 auto;
  padding-bottom: 15px;
  max-width: 475px;
}

.hero article p span.black {
  color: #000000;
  font-weight: bold;
}

.hero article p span.primary {
  color: #E40033;
  font-weight: bold;
}

.hero article a.btn {
  text-decoration: none;
  padding: 10px;
}

.hero article img {
  max-width: 100%;
  margin-top: 20px;
}

.hero article .cover {
  background: #f1f1f1;
  max-width: 475px;
  width: 100%;
  margin: 0 auto;
}

.hero article .cover img {
  width: 100%;
}

.hero article .cover img:first-child {
  width: 90%;
}

.hero article .cover img .col-sm {
  display: block;
}

blockquote {
  background: none;
  padding: 0 3.3em 0.6em 3.3em;
  line-height: 1.2;
}

blockquote cite, blockquote p:last-child {
  color: rgba(0, 0, 0, 0.8);
  font-size: 80% !important;
}

blockquote p:last-of-type {
  background: none;
  padding-right: 0;
}

blockquote p.quote {
  display: block;
  padding: 15px 20px 15px 25px;
  margin: 0 0 20px;
  position: relative;
  /*Font*/
  font-size: 20px;
  line-height: 1.2;
  color: #666;
  text-align: justify;
}

blockquote p.quote img {
  float: left;
  margin-right: 15px;
  margin-bottom: 10px !important;
}

blockquote p.quote:before {
  content: "\201C";
  /*Unicode for Left Double Quote*/
  /*Font*/
  font-family: Georgia, serif;
  font-size: 7em;
  font-weight: bold;
  color: #E40033;
  /*Positioning*/
  position: absolute;
  left: -53px;
  top: -15px;
}

blockquote p.quote:after {
  content: "\201D";
  /*Font*/
  font-family: Georgia, serif;
  font-size: 7em;
  font-weight: bold;
  color: #E40033;
  /*Positioning*/
  position: absolute;
  right: -35px;
  bottom: -80px;
}

.content {
  width: 100%;
  float: right;
  padding: 0;
  background: #f1f1f1;
}

.content blockquote {
  background: #fff;
}

.content a.subscribe {
  display: block;
  text-decoration: none;
  width: 100%;
  background: #3b3a39;
  color: #fff;
  padding: 10px;
  font-size: 1.5em;
}

.content a.subscribe span {
  border-bottom: 1px solid #fff;
  padding-bottom: 5px;
}

.content a.subscribe img {
  width: 39px;
  height: auto;
  vertical-align: middle;
}

.content article {
  margin-bottom: 5%;
}

.content article:last-child {
  margin-bottom: 0;
}

.content article p {
  margin: 2.5%;
  text-align: left;
}

.content article p a {
  color: #E40033;
}

.content article h2 {
  color: #000;
  font-size: 1em;
  font-weight: bold;
  text-align: left;
}

.content article h2 a {
  font-weight: normal;
  color: #E40033;
  text-decoration: none;
}

.content article nav {
  margin-left: 10px;
  text-align: left;
}

.content img {
  max-width: 100%;
}

.content nav ul {
  padding: 0;
}

.content .news {
  width: 100%;
  float: left;
  padding-right: 0.83333%;
  padding-left: 0.83333%;
  text-align: left;
  width: 95%;
  margin: 2.5%;
}

.content .news h4 {
  text-align: left;
  color: #000;
}

aside {
  width: 100%;
  float: left;
  padding-right: 0.83333%;
  padding-left: 0.83333%;
  background: #fff;
  padding: 0;
}

aside article {
  margin-left: 3.33333%;
  margin-right: 3.33333%;
  text-align: left;
}

aside article nav ul {
  padding: 0;
}

aside article nav ul a {
  color: #000;
}

aside article p {
  text-align: left;
}

aside article h2 {
  margin-top: 5%;
  font-size: 1.3em;
  text-align: left;
  color: #000;
}

aside article h2 a {
  text-decoration: none;
}

aside article h2 span {
  color: #000;
}

aside article a {
  color: #E40033;
}

aside .newsletter {
  background: #3b3a39;
  color: #fff;
}

aside .newsletter .news-success-panel {
  text-align: left;
  margin: 0 2.5%;
  padding-bottom: 10px;
}

aside .newsletter .form {
  margin: 0 2.5%;
}

aside .newsletter .form img {
  float: right;
  margin: 1.5em 1em 0 0;
}

aside .newsletter .form .validation {
  margin: 2.5% 0;
  text-align: left;
}

aside .newsletter .form .validation span {
  color: #E40033;
}

aside .newsletter h3 {
  color: #fff;
  font-size: 1.25em;
  padding-top: 5%;
  margin-left: 2.5%;
  text-align: left;
}

aside .newsletter p {
  text-align: left;
  margin-left: 2%;
}

aside .newsletter fieldset {
  padding: 0 0 1.5em 0;
}

aside .newsletter fieldset input, aside .newsletter fieldset select, aside .newsletter fieldset a {
    width: 100%;
    margin-top: 1.5em;
    height: 3em;
    display: block;
    line-height: 1.42857143;
    padding: 6px 12px;
    color: #555;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    -webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
}

aside .newsletter fieldset input:focus, aside .newsletter fieldset select:focus {
  border-color: #E40033;
  outline: 0;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(228, 0, 51, 0.6);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(228, 0, 51, 0.6);
}

aside .newsletter fieldset .submit {
  background: #E40033;
  text-decoration: none;
  border: none;
  position: relative;
  vertical-align: top;
  height: 40px;
  padding: 10;
  color: white;
  text-align: center;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
  border: 0;
  border-bottom: 2px solid #b10028;
  cursor: pointer;
  -webkit-box-shadow: inset 0 -2px #b10028;
  box-shadow: inset 0 -2px #b10028;
  transition: all 0.5s ease;
  min-width: 4em;
  font-size: 22px;
  line-height: normal;
}

aside .newsletter fieldset .submit:hover {
  background: #ff184c;
}

.small {
  font-size: 12px;
  font-style: italic;
}

.well, #related, #additional .panel, #additional .side-nav ul a, .side-nav ul #additional a {
  min-height: 20px;
  padding: 19px;
  margin-bottom: 20px;
  background-color: #f5f5f5;
  border: 1px solid #e3e3e3;
  border-radius: 4px;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
}

.well blockquote, #related blockquote, #additional .panel blockquote, #additional .side-nav ul a blockquote, .side-nav ul #additional a blockquote {
  border-color: #ddd;
  border-color: rgba(0, 0, 0, 0.15);
}

#related {
  margin-left: 1.66667%;
  margin-right: 1.66667%;
}

#additional {
  width: 100%;
  float: left;
  padding-right: 0.83333%;
  padding-left: 0.83333%;
}

#additional .panel, #additional .side-nav ul a, .side-nav ul #additional a {
  margin-left: 1.66667%;
  margin-right: 1.66667%;
  text-align: left;
}

#additional .panel ul, #additional .side-nav ul a ul, .side-nav ul #additional a ul {
  list-style: disc;
  margin-left: 5%;
}

#additional .panel p, #additional .side-nav ul a p, .side-nav ul #additional a p {
  text-align: left;
}

#additional .panel img, #additional .side-nav ul a img, .side-nav ul #additional a img {
  width: auto;
  float: left;
  margin-top: 0.3em;
  margin-right: 15px;
}

#additional .panel img:before, #additional .side-nav ul a img:before, .side-nav ul #additional a img:before {
  content: '';
  float: left;
  padding-bottom: 56.25%;
}

#additional .panel img:after, #additional .side-nav ul a img:after, .side-nav ul #additional a img:after {
  content: '';
  display: table;
  clear: both;
}

#additional .side-nav ul a img, #additional .side-nav ul #additional a img {
  width: auto;
}

#additional .side-nav ul a img:before, #additional .side-nav ul #additional a img:before {
  content: '';
  float: left;
  padding-bottom: 56.25%;
}

#additional .side-nav ul a img:after, #additional .side-nav ul #additional a img:after {
  content: '';
  display: table;
  clear: both;
}

#main {
  word-wrap: break-word;
  width: 100%;
  float: left;
  padding-right: 0.83333%;
  padding-left: 0.83333%;
  text-align: left;
}

#main h3, #main h5 {
  text-align: center;
}

#main h1 img:first-of-type {
  width: 95%;
  border: none;
  margin-left: 1.66667%;
}

#main img {
  height: auto;
}

#main img:before {
  content: '';
  float: left;
  padding-bottom: 56.25%;
}

#main img:after {
  content: '';
  display: table;
  clear: both;
}

#main img.right {
  margin-right: 2.5%;
  margin-bottom: 2.5%;
  /*width: 95%;*/
}

#main img.right.auto {
  width: auto;
  margin-left: 2.5%;
}

#main ul {
  list-style: disc;
}

#main .info-box {
  display: inline-block;
  position: inherit;
  width: 95%;
  margin: 0 2.5% 2.5%;
  padding: 10px;
  z-index: 0;
}

#main .info-box a, #main .info-box h4 {
  color: #E40033;
}

#main .downloads a {
  width: 100%;
  float: left;
  padding-right: 0.83333%;
  padding-left: 0.83333%;
  margin-bottom: 2em;
  text-align: center;
}

/*@media screen and (min-width: 490px) and (max-width: 639px) {
  article {
    .img-thumb {
      // img-thumbnail class, as we can't @extend here
      display: inline-block;
      max-width: 100%;
      height: auto;
      padding: 4px;
      line-height: 1.42857143;
      background-color: #fff;
      border: 1px solid #ddd;
      border-radius: 4px;
      -webkit-transition: all .2s ease-in-out;
      -o-transition: all .2s ease-in-out;
      transition: all .2s ease-in-out;
    }

    .img-thumb-container {
      display: inline-block;
      max-width: 485px;
      height: auto;
      padding: 4px;
      line-height: 1.42857143;
      border: 1px solid #ddd;
      border-radius: 4px;
      -webkit-transition: all .2s ease-in-out;
      -o-transition: all .2s ease-in-out;
      transition: all .2s ease-in-out;
    }
  }
}*/
@media (min-width: 640px) {
  .lt-ie9 .hero article.nth-child-2, .lt-ie9 .hero article.nth-child-3 {
    width: 50%;
    float: right;
    padding-right: 5%;
    padding-left: 5%;
    padding: 0;
    background: #fff;
  }
  .lt-ie9 .hero article.nth-child-2 .text, .lt-ie9 .hero article.nth-child-3 .text {
    height: 80px;
  }
  .lt-ie9 .hero article.nth-child-2 {
    float: left;
  }
  .lt-ie9 .hero article.nth-child-3 {
    float: right;
  }
  header .logo {
    float: left;
    width: 180px;
    height: 112px;
    margin: 0.5em 0 0 0.75em;
    display: block;
  }
  header p {
    margin: 1.6em 1.8em 0 0;
    font-size: 1.5em;
    float: right;
    line-height: 2em;
  }
  
  header p span {
    font-size: 3.3em;
  }
  .hero article {
    margin-bottom: 0;
  }
  .hero article:first-child {
    background: #ffffff url("/health/images/Hoome-page-2.jpg") left bottom no-repeat;
    height: 516px;
    width: 100%;
    position: relative;
    margin: 0;
  }
  .hero article:first-child .cover {
    background: none;
    max-width: none;
  }
  .hero article:first-child .cover img {
    width: 50%;
    float: right;
    margin: 4em 2em 0 0;
  }
  .hero article:first-child .cover .col-sm {
    display: none;
  }
  .hero article:first-child .text {
    position: absolute;
    max-width: 260px;
    margin-right: 5%;
    bottom: 5em;
    right: 0.5em;
  }
  .hero article:first-child .text a {
    font-size: 0.9em;
  }
  .hero article:first-child .border {
    width: 100%;
    height: 10px;
    background: rgba(0, 0, 0, 0.1);
    position: absolute;
    bottom: 0;
  }
  .hero article:nth-child(2), .hero article:nth-child(3) {
    width: 50%;
    float: right;
    padding-right: 5%;
    padding-left: 5%;
    padding: 0;
  }
  .hero article:nth-child(2) .text, .hero article:nth-child(3) .text {
    margin: 2.5%;
  }
  .hero article:nth-child(2) .text p, .hero article:nth-child(3) .text p {
    width: 66.66667%;
    float: right;
    padding-right: 1.66667%;
    padding-left: 1.66667%;
    float: left;
    padding-left: 0;
  }
  .hero article:nth-child(2) .text a, .hero article:nth-child(3) .text a {
    width: 33.33333%;
    float: right;
    padding-right: 1.66667%;
    padding-left: 1.66667%;
    height: 40px;
  }
  .hero article:nth-child(2) {
    float: left;
  }
  .hero article img {
    margin: 0;
  }
  .content a.subscribe {
    display: none;
  }
  .content .news h4 {
    text-align: center;
  }
  .content article h2, .content article p {
    text-align: center;
  }
  .content article nav {
    margin: 2.5%;
  }
  .content article .img-thumb {
    display: inline-block;
    max-width: 100%;
    height: auto;
    padding: 4px;
    line-height: 1.42857143;
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 4px;
    -webkit-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
  }
  .content blockquote {
    margin-top: 1em;
  }
  aside article {
    width: 50%;
    float: right;
    padding-right: 5%;
    padding-left: 5%;
    float: left;
    margin: 5% 0 0;
  }
  aside .newsletter {
    width: 50%;
    float: left;
    padding-right: 5%;
    padding-left: 5%;
  }
  #additional {
    width: 100%;
    float: left;
    margin-left: 0;
    padding: 2.04082%;
  }
  #additional .panel, #additional .side-nav ul a, .side-nav ul #additional a {
    width: 32.20339%;
    float: right;
    margin-left: 1.69492%;
    margin-right: 0;
    min-height: 350px;
  }
  #additional .panel:last-of-type, #additional .side-nav ul a:last-of-type, .side-nav ul #additional a:last-of-type {
    width: 32.20339%;
    float: left;
    margin-left: 0;
  }
}

@media (min-width: 960px) {
  .navigation.inner-pages {
    left: 0;
  }
  .lt-ie9 body {
    filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/assets/images/bg-autumn-med.jpg', sizingMethod='scale');
    -ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/assets/images/bg-autumn-med.jpg', sizingMethod='scale')";
    background-image: none;
  }
  .lt-ie9 .border {
    /* IE 8 */
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=10)";
    background: #000;
  }
  .container aside, .container aside article, .container aside .newsletter {
    /* IE8+ - doesn't work as required though */
    /*-ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=-1, M12=0, M21=0, M22=-1, SizingMethod='auto expand')";*/
    -ms-transform: scale(-1);
    transform: scaleY(-1);
  }
  .container.home {
    background: #f1f1f1;
  }
  .container .hero article .cover img:first-child {
    width: 65%;
    margin-top: 2em;
  }
  .container .hero article:nth-child(2), .container .hero article:nth-child(3) {
    background-color: #fff;
  }
  .container .hero article:nth-child(2) .text, .container .hero article:nth-child(3) .text {
    height: 50px;
  }
  .container .hero .border {
    background: rgba(0, 0, 0, 0.1);
    width: 100%;
    float: left;
    height: 10px;
  }
  .container .content {
    width: 66.66667%;
    float: left;
    padding-right: 0.83333%;
    padding-left: 0.83333%;
  }
  .container .content .news {
    width: 100%;
    margin: 0;
  }
  .container .content .news h4 {
    font-size: 2em;
    text-align: left;
    margin-left: 0.5em;
  }
  .container .content .news article {
    width: 33.33333%;
    float: right;
    padding-right: 1.11111%;
    padding-left: 1.11111%;
    float: left;
  }
  .container .content .news article:first-of-type {
    width: 33.33333%;
    float: left;
    padding-right: 1.11111%;
    padding-left: 1.11111%;
  }
  .container .content .news article:last-of-type {
    width: 33.33333%;
    float: right;
    padding-right: 1.11111%;
    padding-left: 1.11111%;
  }
  .container .content .news article hr {
    display: none;
  }
  .container .content blockquote {
    background: #f1f1f1;
  }
  .container aside {
    width: 33.33333%;
    float: right;
    padding-right: 0.83333%;
    padding-left: 0.83333%;
    padding-right: 0;
    padding-bottom: 25px;
    padding-left: 0;
    background: #f1f1f1;
  }
  .container aside article, .container aside .newsletter {
    width: 100%;
    float: left;
    padding-right: 0.83333%;
    padding-left: 0.83333%;
  }
  .container aside article {
    background: #fff;
    margin-bottom: 2.5em;
    padding: 1.5em;
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
  }
  .container aside .newsletter {
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
  }
}

.logo {
  display: block;
}

.container .hero article .cover img:first-child {
  width: 90%;
  margin: 2em auto;
}

@media screen and (min-width: 640px) {
  .container .hero article .cover img:first-child {
    width: 50%;
    margin: 3em 2em 0 0;
  }
}

@media screen and (min-width: 768x) {
  .container .hero article .cover img:first-child {
    width: 50%;
    margin: 3em 6em 0 0;
  }
}

@media screen and (min-width: 640px) {
  .hero article:first-child .text {
    max-width: 263px;
    margin-right: 11%;
  }
}

@media screen and (min-width: 880px) {
  .hero article:first-child .text {
    max-width: 333px;
    margin-right: 11%;
  }
}

#main img {
  border: none;
}

#main h3 {
  text-align: left;
}

#main .article-list li h3 {
  text-align: left;
}

.section-label:after {
  content: " ";
  display: block;
  clear: both;
}

.aboutSW {
  padding: 20px;
  text-align: left;
}

.aboutSW ul {
  list-style-type: initial;
}

.centre {
  margin: 0 auto;
  display: block;
  width: 100%;
}

.team__member:after {
  content: " ";
  display: block;
  clear: both;
}

.team__member img {
  margin-left: 1em;
}

.article-list li {
  list-style-type: none;
}
