a@charset "UTF-8";
/* @import must be at top of file, otherwise CSS will not work */
@import url("//hello.myfonts.net/count/329064");
@font-face { font-family: 'FuturaPT-Heavy'; src: url("../fonts/329064_0_0.eot"); src: url("../fonts/329064_0_0.eot?#iefix") format("embedded-opentype"), url("../fonts/329064_0_0.woff2") format("woff2"), url("../fonts/329064_0_0.woff") format("woff"), url("../fonts/329064_0_0.ttf") format("truetype"); }
/* http://meyerweb.com/eric/tools/css/reset/  v2.0 | 20110126 License: none (public domain)
*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; }

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }

body { line-height: 1; }

ol, ul { list-style: none; }

blockquote, q { quotes: none; }

blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }

table { border-collapse: collapse; border-spacing: 0; }

*, *:before, *:after { box-sizing: inherit; }

html { box-sizing: border-box; font-size: 16px; font-family: "Open Sans", Arial, sans-serif; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; overflow-x: hidden; background: #fff; }

body { font-size: 100%; line-height: 150%; color: #323232; }

p { font-size: 1em; margin: 0 0 1.4em 0; }

h1 { font-size: 2.5714em; /* 36px */ }

h2, .h2 { font-size: 1.875em; }

h3 { font-size: 1.2500em; /* 20px */ }

h4 { font-size: 1.1250em; /* 18px */ }

h5 { font-size: 1.0000em; /* 16px */ }

h1, h2, h3, h4, h5, h6 { font-family: "FuturaPT-Heavy", Arial, sans-serif; font-weight: 600; margin-bottom: 0.6em; letter-spacing: 0.1em; line-height: 110%; }

@media all and (min-width: 768px) { h1, h2, h3, h4, h5, h6 { margin-bottom: 0.8em; } }
a { transition: color 0.2s ease; text-decoration: none; }

strong { font-weight: 600; }


a:hover {
    text-decoration: none;
}

/*------------------------------------*\ $CSSWIZARDRY-GRIDS
\*------------------------------------*/
/** CONTENTS INTRODUCTION.........How the grid system works. VARIABLES............Your settings. MIXINS...............Library mixins. GRID SETUP...........Build the grid structure. WIDTHS...............Build our responsive widths around our breakpoints. PUSH.................Push classes. PULL.................Pull classes. */
/*------------------------------------*\ $INTRODUCTION
\*------------------------------------*/
/** csswizardry grids provides you with widths to suit a number of breakpoints designed around devices of a size you specify. Out of the box, csswizardry grids caters to the following types of device:  palm     --  palm-based devices, like phones and small tablets lap      --  lap-based devices, like iPads or laptops portable --  all of the above desk     --  stationary devices, like desktop computers regular  --  any/all types of device  These namespaces are then used in the library to give you the ability to manipulate your layouts based around them, for example:  <div class="grid__item  one-whole  lap--one-half  desk--one-third">  This would give you a grid item which is 100% width unless it is on a lap device, at which point it become 50% wide, or it is on a desktop device, at which point it becomes 33.333% width.  csswizardry grids also has push and pull classes which allow you to nudge grid items left and right by a defined amount. These follow the same naming convention as above, but are prepended by either `push--` or `pull--`, for example:  `class="grid__item  one-half  push--one-half"`  This would give you a grid item which is 50% width and pushed over to the right by 50%.  All classes in csswizardry grids follow this patten, so you should fairly quickly be able to piece together any combinations you can imagine, for example:  `class="grid__item  one-whole  lap--one-half  desk--one-third  push--desk--one-third"`  `class="grid__item  one-quarter  palm--one-half  push--palm--one-half"`  `class="grid__item  palm--one-third  desk--five-twelfths"` */
/*------------------------------------*\ $VARIABLES
\*------------------------------------*/
/** If you are building a non-responsive site but would still like to use csswizardry-grids, set this to ‘false’: */
/** Is this build mobile first? Setting to ‘true’ means that all grids will be 100% width if you do not apply a more specific class to them. */
/** Set the spacing between your grid items. */
/** Would you like Sass’ silent classes, or regular CSS classes? */
/** Would you like push and pull classes enabled? */
/** Using `inline-block` means that the grid items need their whitespace removing in order for them to work correctly. Set the following to true if you are going to achieve this by manually removing/commenting out any whitespace in your HTML yourself.  Setting this to false invokes a hack which cannot always be guaranteed, please see the following for more detail:  github.com/csswizardry/csswizardry-grids/commit/744d4b23c9d2b77d605b5991e54a397df72e0688 github.com/csswizardry/inuit.css/issues/170#issuecomment-14859371 */
/** Define your breakpoints. The first value is the prefix that shall be used for your classes (e.g. `.palm--one-half`), the second value is the media query that the breakpoint fires at. */
/** Define which namespaced breakpoints you would like to generate for each of widths, push and pull. This is handy if you only need pull on, say, desk, or you only need a new width breakpoint at mobile sizes. It allows you to only compile as much CSS as you need. All are turned on by default, but you can add and remove breakpoints at will.  Push and pull shall only be used if `$push` and/or `$pull` and `$responsive` have been set to ‘true’. */
/** You do not need to edit anything from this line onward; csswizardry-grids is good to go. Happy griddin’! */
/*------------------------------------*\ $MIXINS
\*------------------------------------*/
/** These mixins are for the library to use only, you should not need to modify them at all.  Enclose a block of code with a media query as named in `$breakpoints`. */
/** Drop relative positioning into silent classes which can’t take advantage of the `[class*="push--"]` and `[class*="pull--"]` selectors. */
/*------------------------------------*\ $GRID SETUP
\*------------------------------------*/
/** 1. Allow the grid system to be used on lists. 2. Remove any margins and paddings that might affect the grid system. 3. Apply a negative `margin-left` to negate the columns’ gutters. */
.grid { list-style: none; /* [1] */ margin: 0; /* [2] */ padding: 0; /* [2] */ margin-left: -30px; /* [3] */ }

/** 1. Cause columns to stack side-by-side. 2. Space columns apart. 3. Align columns to the tops of each other. 4. Full-width unless told to behave otherwise. 5. Required to combine fluid widths and fixed gutters. */
.grid__item { display: inline-block; /* [1] */ padding-left: 30px; /* [2] */ vertical-align: top; /* [3] */ width: 100%; /* [4] */ -webkit-box-sizing: border-box; /* [5] */ -moz-box-sizing: border-box; /* [5] */ box-sizing: border-box; /* [5] */ }

/** Reversed grids allow you to structure your source in the opposite order to how your rendered layout will appear. Extends `.grid`. */
.grid--rev { direction: rtl; text-align: left; }
.grid--rev > .grid__item { direction: ltr; text-align: left; }

/** Gutterless grids have all the properties of regular grids, minus any spacing. Extends `.grid`. */
.grid--full { margin-left: 0; }
.grid--full > .grid__item { padding-left: 0; }

/** Align the entire grid to the right. Extends `.grid`. */
.grid--right { text-align: right; }
.grid--right > .grid__item { text-align: left; }

/** Centered grids align grid items centrally without needing to use push or pull classes. Extends `.grid`. */
.grid--center { text-align: center; }
.grid--center > .grid__item { text-align: left; }

/** Align grid cells vertically (`.grid--middle` or `.grid--bottom`). Extends `.grid`. */
.grid--middle > .grid__item { vertical-align: middle; }

.grid--bottom > .grid__item { vertical-align: bottom; }

/** Create grids with narrower gutters. Extends `.grid`. */
.grid--narrow { margin-left: -15px; }
.grid--narrow > .grid__item { padding-left: 15px; }

/** Create grids with wider gutters. Extends `.grid`. */
.grid--wide { margin-left: -60px; }
.grid--wide > .grid__item { padding-left: 60px; }

/*------------------------------------*\ $WIDTHS
\*------------------------------------*/
/** Create our width classes, prefixed by the specified namespace. */
/** Our regular, non-responsive width classes. */
/** Whole */
.one-whole { width: 100%; }

/** Halves */
.one-half, .two-quarters, .three-sixths, .four-eighths, .five-tenths, .six-twelfths { width: 50%; }

/** Thirds */
.one-third, .two-sixths, .four-twelfths { width: 33.333%; }

.two-thirds, .four-sixths, .eight-twelfths { width: 66.666%; }

/** Quarters */
.one-quarter, .two-eighths, .three-twelfths { width: 25%; }

.three-quarters, .six-eighths, .nine-twelfths { width: 75%; }

/** Fifths */
.one-fifth, .two-tenths { width: 20%; }

.two-fifths, .four-tenths { width: 40%; }

.three-fifths, .six-tenths { width: 60%; }

.four-fifths, .eight-tenths { width: 80%; }

/** Sixths */
.one-sixth, .two-twelfths { width: 16.666%; }

.five-sixths, .ten-twelfths { width: 83.333%; }

/** Eighths */
.one-eighth { width: 12.5%; }

.three-eighths { width: 37.5%; }

.five-eighths { width: 62.5%; }

.seven-eighths { width: 87.5%; }

/** Tenths */
.one-tenth { width: 10%; }

.three-tenths { width: 30%; }

.seven-tenths { width: 70%; }

.nine-tenths { width: 90%; }

/** Twelfths */
.one-twelfth { width: 8.333%; }

.five-twelfths { width: 41.666%; }

.seven-twelfths { width: 58.333%; }

.eleven-twelfths { width: 91.666%; }

/** Our responsive classes, if we have enabled them. */
@media only screen and (max-width: 659px) { /** Whole */
  .palm--one-whole { width: 100%; }
  /** Halves */
  .palm--one-half, .palm--two-quarters, .palm--three-sixths, .palm--four-eighths, .palm--five-tenths, .palm--six-twelfths { width: 50%; }
  /** Thirds */
  .palm--one-third, .palm--two-sixths, .palm--four-twelfths { width: 33.333%; }
  .palm--two-thirds, .palm--four-sixths, .palm--eight-twelfths { width: 66.666%; }
  /** Quarters */
  .palm--one-quarter, .palm--two-eighths, .palm--three-twelfths { width: 25%; }
  .palm--three-quarters, .palm--six-eighths, .palm--nine-twelfths { width: 75%; }
  /** Fifths */
  .palm--one-fifth, .palm--two-tenths { width: 20%; }
  .palm--two-fifths, .palm--four-tenths { width: 40%; }
  .palm--three-fifths, .palm--six-tenths { width: 60%; }
  .palm--four-fifths, .palm--eight-tenths { width: 80%; }
  /** Sixths */
  .palm--one-sixth, .palm--two-twelfths { width: 16.666%; }
  .palm--five-sixths, .palm--ten-twelfths { width: 83.333%; }
  /** Eighths */
  .palm--one-eighth { width: 12.5%; }
  .palm--three-eighths { width: 37.5%; }
  .palm--five-eighths { width: 62.5%; }
  .palm--seven-eighths { width: 87.5%; }
  /** Tenths */
  .palm--one-tenth { width: 10%; }
  .palm--three-tenths { width: 30%; }
  .palm--seven-tenths { width: 70%; }
  .palm--nine-tenths { width: 90%; }
  /** Twelfths */
  .palm--one-twelfth { width: 8.333%; }
  .palm--five-twelfths { width: 41.666%; }
  .palm--seven-twelfths { width: 58.333%; }
  .palm--eleven-twelfths { width: 91.666%; } }
@media only screen and (min-width: 660px) and (max-width: 1023px) { /** Whole */
  .lap--one-whole { width: 100%; }
  /** Halves */
  .lap--one-half, .lap--two-quarters, .lap--three-sixths, .lap--four-eighths, .lap--five-tenths, .lap--six-twelfths { width: 50%; }
  /** Thirds */
  .lap--one-third, .lap--two-sixths, .lap--four-twelfths { width: 33.333%; }
  .lap--two-thirds, .lap--four-sixths, .lap--eight-twelfths { width: 66.666%; }
  /** Quarters */
  .lap--one-quarter, .lap--two-eighths, .lap--three-twelfths { width: 25%; }
  .lap--three-quarters, .lap--six-eighths, .lap--nine-twelfths { width: 75%; }
  /** Fifths */
  .lap--one-fifth, .lap--two-tenths { width: 20%; }
  .lap--two-fifths, .lap--four-tenths { width: 40%; }
  .lap--three-fifths, .lap--six-tenths { width: 60%; }
  .lap--four-fifths, .lap--eight-tenths { width: 80%; }
  /** Sixths */
  .lap--one-sixth, .lap--two-twelfths { width: 16.666%; }
  .lap--five-sixths, .lap--ten-twelfths { width: 83.333%; }
  /** Eighths */
  .lap--one-eighth { width: 12.5%; }
  .lap--three-eighths { width: 37.5%; }
  .lap--five-eighths { width: 62.5%; }
  .lap--seven-eighths { width: 87.5%; }
  /** Tenths */
  .lap--one-tenth { width: 10%; }
  .lap--three-tenths { width: 30%; }
  .lap--seven-tenths { width: 70%; }
  .lap--nine-tenths { width: 90%; }
  /** Twelfths */
  .lap--one-twelfth { width: 8.333%; }
  .lap--five-twelfths { width: 41.666%; }
  .lap--seven-twelfths { width: 58.333%; }
  .lap--eleven-twelfths { width: 91.666%; } }
@media only screen and (max-width: 1023px) { /** Whole */
  .portable--one-whole { width: 100%; }
  /** Halves */
  .portable--one-half, .portable--two-quarters, .portable--three-sixths, .portable--four-eighths, .portable--five-tenths, .portable--six-twelfths { width: 50%; }
  /** Thirds */
  .portable--one-third, .portable--two-sixths, .portable--four-twelfths { width: 33.333%; }
  .portable--two-thirds, .portable--four-sixths, .portable--eight-twelfths { width: 66.666%; }
  /** Quarters */
  .portable--one-quarter, .portable--two-eighths, .portable--three-twelfths { width: 25%; }
  .portable--three-quarters, .portable--six-eighths, .portable--nine-twelfths { width: 75%; }
  /** Fifths */
  .portable--one-fifth, .portable--two-tenths { width: 20%; }
  .portable--two-fifths, .portable--four-tenths { width: 40%; }
  .portable--three-fifths, .portable--six-tenths { width: 60%; }
  .portable--four-fifths, .portable--eight-tenths { width: 80%; }
  /** Sixths */
  .portable--one-sixth, .portable--two-twelfths { width: 16.666%; }
  .portable--five-sixths, .portable--ten-twelfths { width: 83.333%; }
  /** Eighths */
  .portable--one-eighth { width: 12.5%; }
  .portable--three-eighths { width: 37.5%; }
  .portable--five-eighths { width: 62.5%; }
  .portable--seven-eighths { width: 87.5%; }
  /** Tenths */
  .portable--one-tenth { width: 10%; }
  .portable--three-tenths { width: 30%; }
  .portable--seven-tenths { width: 70%; }
  .portable--nine-tenths { width: 90%; }
  /** Twelfths */
  .portable--one-twelfth { width: 8.333%; }
  .portable--five-twelfths { width: 41.666%; }
  .portable--seven-twelfths { width: 58.333%; }
  .portable--eleven-twelfths { width: 91.666%; } }
@media only screen and (min-width: 1024px) { /** Whole */
  .desk--one-whole { width: 100%; }
  /** Halves */
  .desk--one-half, .desk--two-quarters, .desk--three-sixths, .desk--four-eighths, .desk--five-tenths, .desk--six-twelfths { width: 50%; }
  /** Thirds */
  .desk--one-third, .desk--two-sixths, .desk--four-twelfths { width: 33.333%; }
  .desk--two-thirds, .desk--four-sixths, .desk--eight-twelfths { width: 66.666%; }
  /** Quarters */
  .desk--one-quarter, .desk--two-eighths, .desk--three-twelfths { width: 25%; }
  .desk--three-quarters, .desk--six-eighths, .desk--nine-twelfths { width: 75%; }
  /** Fifths */
  .desk--one-fifth, .desk--two-tenths { width: 20%; }
  .desk--two-fifths, .desk--four-tenths { width: 40%; }
  .desk--three-fifths, .desk--six-tenths { width: 60%; }
  .desk--four-fifths, .desk--eight-tenths { width: 80%; }
  /** Sixths */
  .desk--one-sixth, .desk--two-twelfths { width: 16.666%; }
  .desk--five-sixths, .desk--ten-twelfths { width: 83.333%; }
  /** Eighths */
  .desk--one-eighth { width: 12.5%; }
  .desk--three-eighths { width: 37.5%; }
  .desk--five-eighths { width: 62.5%; }
  .desk--seven-eighths { width: 87.5%; }
  /** Tenths */
  .desk--one-tenth { width: 10%; }
  .desk--three-tenths { width: 30%; }
  .desk--seven-tenths { width: 70%; }
  .desk--nine-tenths { width: 90%; }
  /** Twelfths */
  .desk--one-twelfth { width: 8.333%; }
  .desk--five-twelfths { width: 41.666%; }
  .desk--seven-twelfths { width: 58.333%; }
  .desk--eleven-twelfths { width: 91.666%; } }
/*------------------------------------*\ $PUSH
\*------------------------------------*/
/** Push classes, to move grid items over to the right by certain amounts. */
/*------------------------------------*\ $PULL
\*------------------------------------*/
/** Pull classes, to move grid items back to the left by certain amounts. */
table td, table th { border: 1px solid #ccc; padding: 10px; }
table th { font-weight: 600; }

/* Slider */
.slick-slider { position: relative; display: block; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent; }

.slick-list { position: relative; overflow: hidden; display: block; margin: 0; padding: 0; }
.slick-list:focus { outline: none; }
.slick-list.dragging { cursor: pointer; cursor: hand; }

.slick-slider .slick-track, .slick-slider .slick-list { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }

.slick-track { position: relative; left: 0; top: 0; display: block; }
.slick-track:before, .slick-track:after { content: ""; display: table; }
.slick-track:after { clear: both; }
.slick-loading .slick-track { visibility: hidden; }

.slick-slide { float: left; height: 100%; min-height: 1px; display: none; }
[dir="rtl"] .slick-slide { float: right; }
.slick-slide img { display: block; }
.slick-slide.slick-loading img { display: none; }
.slick-slide.dragging img { pointer-events: none; }
.slick-initialized .slick-slide { display: block; }
.slick-loading .slick-slide { visibility: hidden; }
.slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; }

.slick-arrow.slick-hidden { display: none; }

/* Slider */
/* Icons */
@font-face { font-family: "slick"; src: url("../fonts/slick.eot"); src: url("../fonts/slick.eot?#iefix") format("embedded-opentype"), url("../fonts/slick.woff") format("woff"), url("../fonts/slick.ttf") format("truetype"), url("../fonts/slick.svg#slick") format("svg"); font-weight: normal; font-style: normal; }
/* Arrows */
.slick-prev, .slick-next { position: absolute; display: block; height: 20px; width: 20px; line-height: 0px; font-size: 0px; cursor: pointer; background: transparent; color: transparent; top: 50%; margin-top: -10px\9; /*lte IE 8*/ -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); padding: 0; border: none; outline: none; }
.slick-prev:hover, .slick-prev:focus, .slick-next:hover, .slick-next:focus { outline: none; background: transparent; color: transparent; }
.slick-prev:hover:before, .slick-prev:focus:before, .slick-next:hover:before, .slick-next:focus:before { opacity: 1; }
.slick-prev.slick-disabled:before, .slick-next.slick-disabled:before { opacity: 1; }

.slick-prev:before, .slick-next:before { font-family: "slick"; font-size: 20px; line-height: 1; color: white; opacity: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

.slick-prev { left: -25px; }
[dir="rtl"] .slick-prev { left: auto; right: -25px; }
.slick-prev:before { content: "←"; }
[dir="rtl"] .slick-prev:before { content: "→"; }

.slick-next { right: -25px; }
[dir="rtl"] .slick-next { left: -25px; right: auto; }
.slick-next:before { content: "→"; }
[dir="rtl"] .slick-next:before { content: "←"; }

/* Dots */
.slick-slider { margin-bottom: 30px; }

.slick-dots { position: absolute; bottom: 30px; list-style: none; display: block; text-align: center; padding: 0; width: 100%; }
.slick-dots li { position: relative; display: inline-block; height: 20px; width: 20px; margin: 0 5px; padding: 0; cursor: pointer; }
.slick-dots li button { border: 0; background: transparent; display: block; height: 20px; width: 20px; outline: none; line-height: 0px; font-size: 0px; color: transparent; padding: 5px; cursor: pointer; }
.slick-dots li button:hover, .slick-dots li button:focus { outline: none; }
.slick-dots li button:hover:before, .slick-dots li button:focus:before { opacity: 1; }
.slick-dots li button:before { position: absolute; top: 0; left: 0; content: "•"; width: 20px; height: 20px; font-family: "slick"; font-size: 10px; line-height: 20px; text-align: center; color: white; opacity: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
.slick-dots li.slick-active button:before { color: #00563f; opacity: 1; }

.btn, .btn--citrus, .btn--recipes, .gform_button, .page-id-5453 input[type="submit"], .btn--products, .nav-links a { display: inline-block; background: #00563f; border-radius: 4px; color: #ffffff !important; font-family: "FuturaPT-Heavy", Arial, sans-serif; padding: 20px 30px; transition: background 0.3s ease; border: 0; text-decoration: none; }

.btn:hover, .btn--citrus:hover, .btn--recipes:hover, .gform_button:hover, .page-id-5453 input[type="submit"]:hover, .btn--products:hover, .nav-links a:hover { background-color: #034d37; }

.btn--citrus { background-color: #eb7200; }

.btn--citrus:hover { background-color: #dc6b00; }

.btn--recipes { background-color: #bb2253; }

.btn--recipes:hover { background-color: #af1d4c; }

.gform_button, .page-id-5453 input[type="submit"] { background: #00833f; }

.mainpage .btn, .mainpage .btn--citrus, .mainpage .btn--recipes, .mainpage .gform_button, .mainpage .page-id-5453 input[type="submit"], .page-id-5453 .mainpage input[type="submit"], .mainpage .btn--products, .mainpage .nav-links a, .nav-links .mainpage a { text-decoration: none; }

.btn--products { background-color: #ff3a1e; }

.btn--products:hover { background-color: #e33117; }

.nav-toggled, .nav-toggled body { overflow: hidden; }

.mainnav { overflow: visible; position: fixed; z-index: 10; background-color: #00563f; text-transform: uppercase; font-family: "FuturaPT-Heavy", Arial, sans-serif; width: 100%; left: 0; top: 0; bottom: 0; text-align: center; padding-top: 6px; font-size: 1.0625em; transform: translateX(-100%); transition: transform 0.4s ease; letter-spacing: 0.05em; }
.mainnav a { display: block; color: #ffffff; padding: 16px 0; transition: color 0.2s ease; font-weight: 600;}
.mainnav a:hover { text-decoration: none; }
.mainnav .current_page_item a, .mainnav .current-menu-item a, .mainnav .current-page-ancestor a { color: #feb600; }
.mainnav .mainnav__logo { background-image: url("../img/sprite.png"); background-position: -140px 0px; background-repeat: no-repeat; width: 120px; height: 69px; margin-left: auto; margin-right: auto; margin-bottom: 40px; }
@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (-o-min-device-pixel-ratio: 3 / 2), only screen and (min-device-pixel-ratio: 1.5), only screen and (min-resolution: 192dpi) { .mainnav .mainnav__logo { background-size: 260px 175px; background-image: url("../img/sprite@2x.png"); } }

.nav-toggled, .nav-toggled body { overflow: hidden; }
.nav-toggled .mainnav, .nav-toggled body .mainnav { transform: translateX(0); }

@media all and (min-width: 768px) { .mainnav { position: inherit; background-color: transparent; padding-top: 0; width: auto; display: inline-block; padding-top: 64px; font-size: 0.8125em; width: 100%; padding-left: 120px; z-index: 1; text-align: center; transform: translateX(0); transition: transform 0s ease; }
  .mainnav li { display: inline-block; padding: 0 8px; position: relative;}
  .mainnav a { color: #00563f; padding: 0; line-height: 100%; font-size: 12px;}
  .mainnav a:hover { color: #d99b00; }
  .mainnav li:last-child { padding-right: 0; }
  .mainnav .current_page_item a, .mainnav .current-menu-item a, .mainnav .current-page-ancestor a { color: #00563f; border-bottom: 2px solid #00563f; }
  .mainnav__logo { display: none; } }
@media all and (min-width: 768px) and (max-width: 1100px) { .mainnav { text-align: right; padding-top: 28px; padding-left: 200px; }
  .mainnav li { padding: 0 0px 0px 40px; margin-bottom: 10px; } }


@media screen and (min-width: 991px) and (max-width: 1200px) {
    .mainnav a {
        font-size: 12px;
    }
}

.mainnavOpen {
    transform: translateX(0);
}

.hamburger-open {
    background-color: #ffffff !important;
}
@media screen and (max-width: 768px) {
    .mainnav a i {
        display: none;
    }
}


/** submenu **/

.mainnav li .sub-menu {
    display: none;
    position: absolute;
    top: 100%;
    width: 175px;
    left: 50%;
    transform: translateX(-50%);
    padding-top: 10px;
}
.mainnav li .sub-menu li {
    width: 100%;
    text-align: left;
    padding: 0;
}
.mainnav li .sub-menu li a {
    background: #00563f;
    color: #fff;
    padding: 10px;
}
.mainnav li .sub-menu li a:hover {
    background: #F8AF17;
}
.mainnav li:hover .sub-menu {
    display: block;
}

.hamburger { z-index: 400; border: none; padding: 15px 15px; display: inline-block; cursor: pointer; outline: none; transition-property: opacity; transition-duration: 0.15s; transition-timing-function: linear; font: inherit; color: inherit; text-transform: none; background-color: transparent; margin: 0; overflow: visible; -webkit-tap-highlight-color: rgba(255, 255, 255, 0); }
@media all and (min-width: 768px) { .hamburger { padding: 25px 25px; } }
.hamburger:hover { opacity: 0.7; }

.hamburger-box { width: 25px; height: 17px; display: inline-block; position: relative; }
@media all and (min-width: 768px) { .hamburger-box { width: 50px; } }

.hamburger-inner { display: block; top: 50%; margin-top: -1.5px; }
.hamburger-inner, .hamburger-inner::before, .hamburger-inner::after { width: 25px; height: 3px; background-color: #00563f; border-radius: 0px; position: absolute; transition-property: transform; transition-duration: 0.15s; transition-timing-function: ease; }
@media all and (min-width: 768px) { .hamburger-inner, .hamburger-inner::before, .hamburger-inner::after { width: 50px; } }
.hamburger-inner::before, .hamburger-inner::after { content: ""; display: block; }
.hamburger-inner::before { top: -7px; }
.hamburger-inner::after { bottom: -7px; }

.hamburger--spin .hamburger-inner { transition-duration: 0.3s; transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
.hamburger--spin .hamburger-inner::before { transition: top 0.1s 0.34s ease-in, opacity 0.1s ease-in; }
.hamburger--spin .hamburger-inner::after { transition: bottom 0.1s 0.34s ease-in, transform 0.3s cubic-bezier(0.55, 0.055, 0.675, 0.19); }
.hamburger--spin.is-active .hamburger-inner { transform: rotate(45deg); transition-delay: 0.14s; transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
.hamburger--spin.is-active .hamburger-inner::before { top: 0; opacity: 0; transition: top 0.1s ease-out, opacity 0.1s 0.14s ease-out; background-color: #ffffff; }
.hamburger--spin.is-active .hamburger-inner::after { bottom: 0; transform: rotate(-90deg); transition: bottom 0.1s ease-out, transform 0.3s 0.14s cubic-bezier(0.215, 0.61, 0.355, 1); }
.hamburger--spin.is-active .hamburger-inner, .hamburger--spin.is-active .hamburger-inner::before, .hamburger--spin.is-active .hamburger-inner::after { background-color: #ffffff; }

.togglenav { position: fixed; top: 20px; right: 15px; }

@media all and (min-width: 768px) { .togglenav { display: none; } }
.icon, .icon--twitter, .icon--facebook { text-indent: -9999px; display: inline-block; transition: opacity 0.3s ease; }

.icon:hover, .icon--twitter:hover, .icon--facebook:hover { opacity: 0.8; filter: alpha(opacity=80); }

.icon--twitter { background-image: url("../img/sprite.png"); background-position: -52px -149px; background-repeat: no-repeat; width: 25px; height: 25px; margin-right: 20px; }
@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (-o-min-device-pixel-ratio: 3 / 2), only screen and (min-device-pixel-ratio: 1.5), only screen and (min-resolution: 192dpi) { .icon--twitter { background-size: 260px 175px; background-image: url("../img/sprite@2x.png"); } }

.icon--facebook { background-image: url("../img/sprite.png"); background-position: -77px -149px; background-repeat: no-repeat; width: 25px; height: 25px; }
@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (-o-min-device-pixel-ratio: 3 / 2), only screen and (min-device-pixel-ratio: 1.5), only screen and (min-resolution: 192dpi) { .icon--facebook { background-size: 260px 175px; background-image: url("../img/sprite@2x.png"); } }

.pageheader { height: 200px; text-align: center; position: relative; color: #ffffff; text-transform: uppercase; display: table; width: 100%; padding: 20px; }
.pageheader h1 {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    margin: 0;
    background: #f8af16;
    display: inline;
    padding: 15px 15px;
    box-shadow: 15px 0 0 #f8af16, -15px 0 0 #f8af16;
}

.pageheader__bg { position: absolute; top: 0; bottom: 0; width: 100%; left: 0; background-size: cover; background-position: center center; }

.pageheader__overlay { position: absolute; top: 0; bottom: 0; width: 100%; left: 0; background: rgba(0, 0, 0, 0.1); }

@media all and (min-width: 768px) { .pageheader { height: 400px; } }
@media all and (max-width: 767px) { .pageheader h1 { font-size: 2em; } }
.socialsharing { margin-top: 30px; }
.socialsharing h4 { letter-spacing: 0; }
.socialsharing a { float: left; margin-right: 20px; }
.socialsharing a:hover { opacity: 0.8; filter: alpha(opacity=80); }

@media all and (min-width: 768px) { .socialsharing { margin-top: 60px; }
  .socialsharing a { margin-right: 15px; } }
.sharebtns__facebook { background-image: url("../img/sprite.png"); background-position: -99px -76px; background-repeat: no-repeat; width: 22px; height: 24px; display: block; }
@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (-o-min-device-pixel-ratio: 3 / 2), only screen and (min-device-pixel-ratio: 1.5), only screen and (min-resolution: 192dpi) { .sharebtns__facebook { background-size: 260px 175px; background-image: url("../img/sprite@2x.png"); } }

.sharebtns__twitter { background-image: url("../img/sprite.png"); background-position: -203px -95px; background-repeat: no-repeat; width: 22px; height: 24px; display: block; }
@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (-o-min-device-pixel-ratio: 3 / 2), only screen and (min-device-pixel-ratio: 1.5), only screen and (min-resolution: 192dpi) { .sharebtns__twitter { background-size: 260px 175px; background-image: url("../img/sprite@2x.png"); } }

.sharebtns__pinterest { background-image: url("../img/sprite.png"); background-position: -160px -95px; background-repeat: no-repeat; width: 22px; height: 24px; display: block; }
@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (-o-min-device-pixel-ratio: 3 / 2), only screen and (min-device-pixel-ratio: 1.5), only screen and (min-resolution: 192dpi) { .sharebtns__pinterest { background-size: 260px 175px; background-image: url("../img/sprite@2x.png"); } }

.sharebtns_print { background-image: url("../img/sprite.png"); background-position: -181px -95px; background-repeat: no-repeat; width: 22px; height: 24px; display: block; }
@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (-o-min-device-pixel-ratio: 3 / 2), only screen and (min-device-pixel-ratio: 1.5), only screen and (min-resolution: 192dpi) { .sharebtns_print { background-size: 260px 175px; background-image: url("../img/sprite@2x.png"); } }

.wpptopdfenh { background-image: url("../img/sprite.png"); background-position: -205px -49px; background-repeat: no-repeat; width: 16px; height: 24px; display: block; }
@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (-o-min-device-pixel-ratio: 3 / 2), only screen and (min-device-pixel-ratio: 1.5), only screen and (min-resolution: 192dpi) { .wpptopdfenh { background-size: 260px 175px; background-image: url("../img/sprite@2x.png"); } }

.h1--timeline { margin-top: 2em; }

/* --------------------------------

Modules - reusable parts of our design

-------------------------------- */
.timeline { background: #f0f0f0; padding-bottom: 60px; }

.cd-container { /* this class is used to give a max-width to the element it is applied to, and center it horizontally when it reaches that max-width */ }

.cd-container::after { /* clearfix */ content: ''; display: table; clear: both; }

/* --------------------------------

Main components

-------------------------------- */
#cd-timeline { position: relative; padding: 3em 0; }

#cd-timeline::before { /* this is the vertical line */ content: ''; position: absolute; top: 0; left: 18px; height: 100%; width: 4px; background: #ff8300; }

@media only screen and (min-width: 768px) { #cd-timeline::before { left: 50%; margin-left: -2px; } }
.cd-timeline-block { position: relative; margin: 2em 0; }

.cd-timeline-block:after { content: ""; display: table; clear: both; }

.cd-timeline-block:first-child { margin-top: 0; }

.cd-timeline-block:last-child { margin-bottom: 0; }

@media only screen and (min-width: 768px) { .cd-timeline-block { margin: 4em 0; }
  .cd-timeline-block:first-child { margin-top: 0; }
  .cd-timeline-block:last-child { margin-bottom: 0; } }
.cd-timeline-img { position: absolute; top: 0; left: 0; text-align: center; background: #06563e; color: #fff; font-family: "FuturaPT-Heavy", Arial, sans-serif; padding: 8px; font-size: 15px; font-weight: 600; }

@media only screen and (min-width: 768px) { .cd-timeline-img { left: 50%; top: 14px; font-size: 25px; margin-left: -40px; /* Force Hardware Acceleration in WebKit */ -webkit-transform: translateZ(0); -webkit-backface-visibility: hidden; }
  .cssanimations .cd-timeline-img.is-hidden { visibility: hidden; }
  .cssanimations .cd-timeline-img.bounce-in { visibility: visible; -webkit-animation: cd-bounce-1 0.6s; -moz-animation: cd-bounce-1 0.6s; animation: cd-bounce-1 0.6s; } }
@-webkit-keyframes cd-bounce-1 { 0% { opacity: 0; -webkit-transform: scale(0.5); }
  60% { opacity: 1; -webkit-transform: scale(1.2); }
  100% { -webkit-transform: scale(1); } }
@-moz-keyframes cd-bounce-1 { 0% { opacity: 0; -moz-transform: scale(0.5); }
  60% { opacity: 1; -moz-transform: scale(1.2); }
  100% { -moz-transform: scale(1); } }
@keyframes cd-bounce-1 { 0% { opacity: 0; -webkit-transform: scale(0.5); -moz-transform: scale(0.5); -ms-transform: scale(0.5); -o-transform: scale(0.5); transform: scale(0.5); }
  60% { opacity: 1; -webkit-transform: scale(1.2); -moz-transform: scale(1.2); -ms-transform: scale(1.2); -o-transform: scale(1.2); transform: scale(1.2); }
  100% { -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); } }
.cd-timeline-content { position: relative; margin-left: 60px; background-color: #ff8300; color: #fff; padding: 1.25em; }
.cd-timeline-content p { padding: 0; }

.cd-timeline-content:after { content: ""; display: table; clear: both; }

.cd-timeline-content .cd-read-more, .cd-timeline-content .cd-date { display: inline-block; }

.cd-timeline-content p { margin: 0; line-height: 1.6; }

.cd-timeline-content .cd-read-more { float: right; padding: .8em 1em; background: #acb7c0; color: white; border-radius: 0.25em; }

.no-touch .cd-timeline-content .cd-read-more:hover { background-color: #bac4cb; }

.cd-timeline-content .cd-date { float: left; padding: .8em 0; opacity: .7; }

.cd-timeline-content::before { content: ''; position: absolute; top: 16px; right: 100%; height: 0; width: 0; border: 7px solid transparent; border-right: 7px solid #ff8300; }

@media only screen and (min-width: 768px) { .cd-timeline-content h2 { font-size: 20px; font-size: 1.25em; }
  .cd-timeline-content p { font-size: 16px; font-size: 1em; }
  .cd-timeline-content .cd-read-more, .cd-timeline-content .cd-date { font-size: 14px; font-size: 0.875em; } }
@media only screen and (min-width: 768px) { .cd-timeline-content { margin-left: -1em; width: 45%; text-align: right; }
  .cd-timeline-content::before { top: 24px; left: 100%; border-color: transparent; border-left-color: #ff8300; }
  .cd-timeline-content .cd-read-more { float: left; }
  .cd-timeline-content .cd-date { position: absolute; width: 100%; left: 122%; top: 6px; font-size: 16px; font-size: 1em; }
  .cd-timeline-block:nth-child(even) .cd-timeline-content { float: right; text-align: left; }
  .cd-timeline-block:nth-child(even) .cd-timeline-content::before { top: 24px; left: auto; right: 100%; border-color: transparent; border-right-color: #ff8300; }
  .cd-timeline-block:nth-child(even) .cd-timeline-content .cd-read-more { float: right; }
  .cd-timeline-block:nth-child(even) .cd-timeline-content .cd-date { left: auto; right: 122%; text-align: right; }
  .cssanimations .cd-timeline-content.is-hidden { visibility: hidden; }
  .cssanimations .cd-timeline-content.bounce-in { visibility: visible; -webkit-animation: cd-bounce-2 0.6s; -moz-animation: cd-bounce-2 0.6s; animation: cd-bounce-2 0.6s; } }
@media only screen and (min-width: 768px) { /* inverse bounce effect on even content blocks */
  .cssanimations .cd-timeline-block:nth-child(even) .cd-timeline-content.bounce-in { -webkit-animation: cd-bounce-2-inverse 0.6s; -moz-animation: cd-bounce-2-inverse 0.6s; animation: cd-bounce-2-inverse 0.6s; } }
@-webkit-keyframes cd-bounce-2 { 0% { opacity: 0; -webkit-transform: translateX(-100px); }
  60% { opacity: 1; -webkit-transform: translateX(20px); }
  100% { -webkit-transform: translateX(0); } }
@-moz-keyframes cd-bounce-2 { 0% { opacity: 0; -moz-transform: translateX(-100px); }
  60% { opacity: 1; -moz-transform: translateX(20px); }
  100% { -moz-transform: translateX(0); } }
@keyframes cd-bounce-2 { 0% { opacity: 0; -webkit-transform: translateX(-100px); -moz-transform: translateX(-100px); -ms-transform: translateX(-100px); -o-transform: translateX(-100px); transform: translateX(-100px); }
  60% { opacity: 1; -webkit-transform: translateX(20px); -moz-transform: translateX(20px); -ms-transform: translateX(20px); -o-transform: translateX(20px); transform: translateX(20px); }
  100% { -webkit-transform: translateX(0); -moz-transform: translateX(0); -ms-transform: translateX(0); -o-transform: translateX(0); transform: translateX(0); } }
@-webkit-keyframes cd-bounce-2-inverse { 0% { opacity: 0; -webkit-transform: translateX(100px); }
  60% { opacity: 1; -webkit-transform: translateX(-20px); }
  100% { -webkit-transform: translateX(0); } }
@-moz-keyframes cd-bounce-2-inverse { 0% { opacity: 0; -moz-transform: translateX(100px); }
  60% { opacity: 1; -moz-transform: translateX(-20px); }
  100% { -moz-transform: translateX(0); } }
@keyframes cd-bounce-2-inverse { 0% { opacity: 0; -webkit-transform: translateX(100px); -moz-transform: translateX(100px); -ms-transform: translateX(100px); -o-transform: translateX(100px); transform: translateX(100px); }
  60% { opacity: 1; -webkit-transform: translateX(-20px); -moz-transform: translateX(-20px); -ms-transform: translateX(-20px); -o-transform: translateX(-20px); transform: translateX(-20px); }
  100% { -webkit-transform: translateX(0); -moz-transform: translateX(0); -ms-transform: translateX(0); -o-transform: translateX(0); transform: translateX(0); } }
body { transition: opacity 0.4s ease; }

html.is-loading body { opacity: 0; filter: alpha(opacity=0); }

.mainheader { height: 85px; position: fixed; left: 0; top: 0; width: 100%; background-color: #ffffff; padding: 6px; z-index: 10; }
.mainheader .container, .mainheader .container--narrow { position: relative; }

.container, .container--narrow { max-width: 1140px; margin-left: auto; margin-right: auto; padding: 0 20px; }

.container--narrow { max-width: 730px; }

.logo { font-size: 0; margin: 0; }

.logo a { display: block; margin-left: auto; margin-right: auto; }
.logo a img { width: 130px; padding: 7px 0 0; display: block; }
@media screen and (max-width: 768px) { .logo a img { width: 100px; padding: 7px 0 0; display: block; } }

.mainnav { padding-top: 38px; }

.mobLogo { display: block; margin: 0 auto; width: 150px; }

@media all and (min-width: 768px) { .mainheader { height: 118px; padding-top: 10px; }
  .logo a { margin-left: inherit; margin-right: inherit; float: left; top: 0; left: 20px; position: absolute; z-index: 2; } }
.maincontent { margin-top: 85px; }

.sectioncontent, .sectioncontent--grey, .sectioncontent--greydark, .sectioncontent--greylight { padding: 30px 0; }

.sectioncontent--grey { background-color: #f6f6f6; }

.sectioncontent--greydark { background-color: #efefef; }

.sectioncontent--greylight { background-color: #fafafa; }

@media all and (min-width: 768px) { .maincontent { margin-top: 118px; }
  .sectioncontent, .sectioncontent--grey, .sectioncontent--greydark, .sectioncontent--greylight { padding: 60px 0; } }
.homeslider { height: 400px; text-align: center; color: #ffffff; font-size: 1.125em; }
.homeslider .slider { height: 400px; }
.homeslider .bgimg, .homeslider .slide__overlay { position: absolute; z-index: 2; top: 0; bottom: 0; width: 100%; }
.homeslider .slide { position: relative; height: 400px; background: #feb600; }
.homeslider .slide__overlay { z-index: 3; background: rgba(0, 0, 0, 0.1); }
.homeslider .slide__content { position: relative; padding: 0 20px; z-index: 4; max-width: 1000px; margin-left: auto; margin-right: auto; display: table; height: 100%; text-align: left; }
.homeslider .vc { display: table-cell; height: 100%; width: 100%; vertical-align: middle; }
.homeslider .slide__title { font-size: 2em; text-transform: uppercase; letter-spacing: 0.1em; line-height: 115%; margin-bottom: 0.3em; background: #f8af16; display: inline; padding: 15px 0; box-shadow: 15px 0 0 #f8af16, -15px 0 0 #f8af16; }

@media all and (min-width: 768px) { .homeslider { height: 650px; }
  .homeslider .slide, .homeslider .slider { height: 650px; }
  .homeslider .slide__title { font-size: 50px; line-height: 70px; }
  .homeslider .btn, .homeslider .btn--citrus, .homeslider .btn--recipes, .homeslider .gform_button, .homeslider .page-id-5453 input[type="submit"], .page-id-5453 .homeslider input[type="submit"], .homeslider .btn--products, .homeslider .nav-links a, .nav-links .homeslider a { margin-top: 30px; } }
@media all and (max-width: 1200px) { .homeslider .slide__title { font-size: 34px; line-height: 54px; } }
@media all and (max-width: 768px) { .homeslider .slide__title { font-size: 24px; line-height: 44px; } }
#banner { padding: 50px 0; overflow: hidden; position: relative; }
#banner .container, #banner .container--narrow { width: 1000px; margin: 0 auto; }
#banner .overlay { background: rgba(0, 0, 0, 0.1); position: absolute; top: 0; bottom: 0; width: 100%; }
#banner h2 { font-size: 2em; text-transform: uppercase; letter-spacing: 0.1em; line-height: 115%; margin-bottom: 0.3em; background: #f8af16; display: inline; padding: 15px 0; box-shadow: 15px 0 0 #f8af16, -15px 0 0 #f8af16; color: #fff; }

@media all and (min-width: 768px) { #banner { padding: 150px 0; }
  #banner h2 { font-size: 50px; line-height: 70px; } }
@media all and (max-width: 1200px) { #banner .container, #banner .container--narrow { width: 100%; }
  #banner h2 { font-size: 34px; line-height: 54px; } }
@media all and (max-width: 768px) { #banner h2 { font-size: 24px; line-height: 44px; } }
.bgimg { background-size: cover; background-position: center center; transition: opacity 0.3s ease; opacity: 0; filter: alpha(opacity=100); }

.bgimg.is-loaded { opacity: 1; filter: alpha(opacity=100); }

.contentsection { padding: 20px 0; }

@media all and (min-width: 768px) { .contentsection { padding: 30px 0; } }
.introtext, .introtext--wide { max-width: 600px; padding: 20px 0; margin-left: auto; margin-right: auto; text-align: center; }

.introtext--wide { max-width: 900px; }

@media all and (min-width: 768px) { .introtext, .introtext--wide { padding: 40px 0; } }
.mainfooter { padding: 25px 0; font-size: 0.825em; text-align: center; }
.mainfooter li { padding-bottom: 5px; }
.mainfooter a { color: #323232; text-decoration: underline; transition: color 0.3s ease; }
.mainfooter a:hover { color: #999; }
.mainfooter p { margin-top: 4em; }
.mainfooter a.icon--facebook, .mainfooter a.icon--twitter { transition: opacity 0.3s ease; }
.mainfooter .footerIcon { font-size: 22px; margin-right: 5px; color: #00563f; }
.mainfooter .footerIcon:hover { color: #f8af16; }

@media all and (min-width: 768px) { .mainfooter { padding: 50px 0; text-align: left; font-size: 1em; }
  .mainfooter li { padding-bottom: 10px; }
  .mainfooter p { margin-top: 0; } }
.ratioblock { width: 100%; /* whatever width you want */ display: inline-block; position: relative; margin-bottom: 20px; text-align: center; font-family: "FuturaPT-Heavy", Arial, sans-serif; font-size: 1.5625em; text-transform: uppercase; letter-spacing: .1em; overflow: hidden; }
.ratioblock .vwrap { position: relative; z-index: 4; }

.ratioblock:hover .ratioblock__bg { transform: scale(1.03); }

.ratioblock:after { padding-top: 70%; display: block; content: ''; }

.ratioblock__inner { position: absolute; top: 0; bottom: 0; right: 0; left: 0; /* fill parent */ background-color: deepskyblue; /* let's see it! */ color: white; }

.ratioblock__bg { position: absolute; top: 0; bottom: 0; left: 0; right: 0; background-size: cover; background-position: center center; transition: transform 1s ease; }

.ratioblock__overlay { position: absolute; top: 0; bottom: 0; left: 0; right: 0; background: rgba(0, 0, 0, 0.1); }

@media all and (min-width: 768px) { .ratioblock { margin-bottom: 0px; }
  .ratioblock--2 { margin-bottom: 30px; }
  .ratioblock:after { padding-top: 50%; }
  .ratioblock--double { padding-top: calc(51.4% + 30px); } }
.vwrap { display: table; height: 100%; width: 100%; }

.vc { display: table-cell; height: 100%; width: 100%; vertical-align: middle; }

.sunrise { /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ff8300+0,ffb700+100 */ background: #ff8300; /* Old browsers */ background: -moz-linear-gradient(top, #ff8300 0%, #ffb700 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, #ff8300 0%, #ffb700 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, #ff8300 0%, #ffb700 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff8300', endColorstr='#ffb700',GradientType=0 ); /* IE6-9 */ color: #ffffff; }

@media all and (min-width: 768px) { .sunrise { padding: 60px 0 30px; } }
.newsitem { background: #ffffff; color: #323232; margin-top: 20px; }
.newsitem img { margin: 0 auto; max-width: 100%; height: auto; display: block; }

.newsitem__content { padding: 30px; }

.newsitem__link { color: #eb7200; text-decoration: underline; }
.newsitem__link:hover { color: #dc6b00; }

.mainpage .newsitem__link { color: #eb7200; }

.postimageheader { display: block; margin-bottom: 15px; }

@media all and (min-width: 768px) { .postimageheader { margin-bottom: 30px; }
  .newsitem { margin-top: 30px; } }
.buttonpad { margin-top: 20px; }

@media all and (min-width: 768px) { .buttonpad { margin-top: 30px; } }
.productblock { text-align: center; margin-bottom: 30px; }
.productblock h2 { margin-top: 1em; font-size: 1.125em; }
.productblock a { color: #323232; }
.productblock img { width: 60%; max-width: 300px; margin-left: auto; margin-right: auto; display: block; height: auto; transition: opacity 0.2s ease; -webkit-backface-visibility: hidden; }
.productblock a:hover img { opacity: 0.8; filter: alpha(opacity=80); }

.mainpage .productblock a { text-decoration: none; }

@media all and (min-width: 768px) { .productblock { margin-bottom: 90px; }
  .productblock .productblock__img { display: table-cell; width: 100%; vertical-align: bottom; }
  .productblock img { width: 100%; max-width: 100%; } }
.productinfo h3 { margin-top: 3em; margin-bottom: 1em; }

.product_image { margin-bottom: 30px; width: 70%; margin-left: auto; margin-right: auto; height: auto; display: block; }

@media all and (min-width: 768px) { .product_image { width: 80%; } }
.nutritional_table td, .nutritional_table th { padding: 10px 60px 10px 0; }
.nutritional_table td { border: none; }
.nutritional_table th { border: none; text-align: left; font-weight: 400; }
.nutritional_table tr.first th { border-bottom: 1px solid #cdcdcd; font-weight: 600; }

.blockwithtitle { background: #ffffff; text-align: center; margin-bottom: 20px; }
.blockwithtitle img { width: 100%; height: auto; display: block; transition: opacity 0.2s ease; -webkit-backface-visibility: hidden; }
.blockwithtitle h3 { padding: 20px; margin-bottom: 0; }
.blockwithtitle h3 a { color: #323232; text-decoration: none; }
.blockwithtitle a:hover img { opacity: 0.8; filter: alpha(opacity=80); }

@media all and (min-width: 768px) { .blockwithtitle { margin-bottom: 30px; } }
.pagetitle { text-transform: uppercase; text-align: center; }

.subtitle, .subtitle--recipes, .subtitle--products { text-align: center; margin-bottom: 1.8em; }

.subtitle--recipes { color: #bb2253; }

.subtitle--products { color: #ff3a1e; }

.mainpage ul, .mainpage ol { list-style: disc; padding-left: 1.5em; margin-bottom: 2em; }
.mainpage ul li, .mainpage ol li { margin-bottom: .5em; }
.mainpage ol { list-style: decimal; }
.mainpage img { max-width: 100%; height: auto; }
.mainpage a { text-decoration: underline; color: #323232; }

@media all and (max-width: 767px) { .mainpage h1 { font-size: 1.8em; } }
.introduction { padding: 100px 0; overflow: hidden; }
@media screen and (max-width: 768px) { .introduction { padding: 50px 0; } }
.introduction h2 { font-size: 24px; line-height: 34px; margin: 0; }
.introduction p { font-size: 18px; line-height: 28px; margin: 20px 0 0; }

.btn {font-weight: 600;}
.artistArch { padding: 0 0 70px; overflow: hidden; }
.artistArch .artistItem { overflow: hidden; display: inline-block; width: 33.33333333%; float: left; margin: 0 0 30px; padding: 0 15px; }
@media screen and (max-width: 991px) { .artistArch .artistItem { width: 50%; } }
@media screen and (max-width: 600px) { .artistArch .artistItem { width: 100%; border-top: solid 1px; padding-top: 30px; }
  .artistArch .artistItem:first-child { border: none; padding-top: 0; } }
.artistArch .artistItem:hover { opacity: 0.8; }
.artistArch .artistItem img { max-width: 100%; height: auto; display: block; }
.artistArch .artistItem h4 { font-size: 24px; color: #000; margin: 30px 0 0; }
.artistArch .artistItem .BTN { font-size: 18px; color: #00563f; margin: 15px 0 0; }

#featArtist { overflow: hidden; padding: 150px 0; position: relative; }
#featArtist .imgFloat { position: absolute; width: 35%; height: 100px; }
@media screen and (max-width: 768px) { #featArtist .imgFloat { width: 100%; } }
#featArtist .imgFloat1 { top: 0; left: 0; }
#featArtist .imgFloat2 { bottom: 0; right: 0; }
#featArtist h2 { text-align: center; margin: 0; font-size: 56px; }
@media screen and (max-width: 1200px) { #featArtist h2 { font-size: 64px; } }
@media screen and (max-width: 768px) { #featArtist h2 { font-size: 34px; } }
#featArtist .container, #featArtist .container--narrow { width: 1200px; }
@media screen and (max-width: 1415px) { #featArtist .container, #featArtist .container--narrow { width: 1000px; } }
@media screen and (max-width: 1200px) { #featArtist .container, #featArtist .container--narrow { width: 900px; } }
@media screen and (max-width: 991px) { #featArtist .container, #featArtist .container--narrow { width: 100%; overflow: hidden; } }
#featArtist .thumb { display: inline-block; float: left; width: 40%; margin: 50px 0 0; padding-right: 15px; }
@media screen and (max-width: 768px) { #featArtist .thumb { width: 100%; padding-right: 0; } }
#featArtist .thumb img { display: block; width: 100%; height: auto; }
#featArtist .holder { display: inline-block; float: right; width: 60%; padding-left: 15px; position: relative; margin: 50px 0 0; min-height: 425px; }
@media screen and (max-width: 1200px) { #featArtist .holder { min-height: 329px; } }
@media screen and (max-width: 768px) { #featArtist .holder { width: 100%; padding-left: 0; min-height: 0; } }
#featArtist .holder .inner { width: 100%; overflow: hidden; position: absolute; top: 50%; transform: translateY(-50%); }
@media screen and (max-width: 768px) { #featArtist .holder .inner { position: static; transform: none; } }
#featArtist .holder h3 { font-size: 34px; text-transform: uppercase; margin: 0; letter-spacing: 2px; max-width: 250px; border-left: solid 15px #00563f; padding-left: 25px; }
@media screen and (max-width: 768px) { #featArtist .holder h3 { max-width: 100%; font-size: 28px; } }
#featArtist .holder p { margin: 30px 0 0; font-weight: bold; font-size: 24px; line-height: 34px; }
@media screen and (max-width: 1200px) { #featArtist .holder p { font-size: 24px; line-height: 36px; } }
@media screen and (max-width: 768px) { #featArtist .holder p { font-size: 18px; line-height: 28px; } }
#featArtist .holder .artBTN { color: #00563f; font-size: 24px; font-weight: bold; text-transform: uppercase; margin: 30px 0 0; display: inline-block; text-decoration: underline; }
@media screen and (max-width: 768px) { #featArtist .holder .artBTN { font-size: 20px; } }
#featArtist .holder .artBTN:hover { color: #f8af16; }
#featArtist .holder .artBTN i { margin-left: 5px; }

.artistMain { overflow: hidden; padding: 0 0 30px; position: relative; }
.artistMain h1 { text-align: center; margin: 150px 0 0; font-size: 80px; }
@media screen and (max-width: 1200px) { .artistMain h1 { text-align: center; margin: 120px 0 0; font-size: 64px; } }
@media screen and (max-width: 768px) { .artistMain h1 { margin: 50px 0 0; font-size: 42px; } }
.artistMain .container, .artistMain .container--narrow { width: 1200px; }
@media screen and (max-width: 1415px) { .artistMain .container, .artistMain .container--narrow { width: 1000px; } }
@media screen and (max-width: 1200px) { .artistMain .container, .artistMain .container--narrow { width: 900px; } }
@media screen and (max-width: 991px) { .artistMain .container, .artistMain .container--narrow { width: 100%; overflow: hidden; } }
.artistMain .imgWrap { display: inline-block; float: left; width: 35%; padding-right: 15px; }
@media screen and (max-width: 991px) { .artistMain .imgWrap { width: 100%; padding-right: 0; } }
.artistMain .imgWrap img { display: block; max-width: 100%; margin: 50px 0 0; }
@media screen and (max-width: 991px) { .artistMain .imgWrap img { width: 650px; margin: 50px auto 0; } }
@media screen and (max-width: 768px) { .artistMain .imgWrap img { width: 350px; margin: 50px auto 0; } }
@media screen and (max-width: 415px) { .artistMain .imgWrap img { width: 100%; margin: 50px auto 0; } }
.artistMain .txtWrap { display: inline-block; float: right; width: 65%; padding-left: 15px; }
@media screen and (max-width: 991px) { .artistMain .txtWrap { width: 100%; padding-left: 0; } }
.artistMain .txtWrap p { font-size: 26px; line-height: 36px; margin: 30px 0 0; }
@media screen and (max-width: 1200px) { .artistMain .txtWrap p { font-size: 24px; line-height: 36px; } }
.artistMain ul { list-style: none; margin: 0; padding: 0; text-align: center; overflow: hidden; width: 100%; }
.artistMain ul li { display: inline-block; width: 450px; padding: 0 15px; }
@media screen and (max-width: 991px) { .artistMain ul li { width: 50%; float: left; } }
@media screen and (max-width: 450px) { .artistMain ul li { width: 100%; } }
.artistMain ul li .product_image_1 { width: 100%; margin: 50px 0 0; }
.artistMain ul li .product_image_2 { width: 100%; margin: 50px 0 0; }
.artistMain .pattern_cut-out_1 { position: absolute; top: 0; left: 0; max-width: 600px; }
@media screen and (max-width: 1415px) { .artistMain .pattern_cut-out_1 { max-width: 350px; } }
@media screen and (max-width: 1024px) { .artistMain .pattern_cut-out_1 { max-width: 250px; } }
@media screen and (max-width: 768px) { .artistMain .pattern_cut-out_1 { display: none; } }

.lowerBanner { overflow: hidden; width: 100%; height: 350px; margin: 50px 0 0; }
@media screen and (max-width: 450px) { .lowerBanner { height: 200px; } }

.post-type-archive-product .mainpage a:hover, .tax-product-family .mainpage a:hover, .single-product .mainpage a:hover { color: #ff3a1e; }
.post-type-archive-product .mainpage .pagetitle, .post-type-archive-product .mainpage h1, .tax-product-family .mainpage .pagetitle, .tax-product-family .mainpage h1, .single-product .mainpage .pagetitle, .single-product .mainpage h1 { color: #ff3a1e; }

.single-recipe .mainpage .pagetitle, .single-recipe .mainpage h1, .single-recipe .mainpage h2, .tax-recipe-type .mainpage .pagetitle, .tax-recipe-type .mainpage h1, .tax-recipe-type .mainpage h2 { color: #bb2253; }
.single-recipe .mainpage a:hover, .tax-recipe-type .mainpage a:hover { color: #bb2253; }

.single-post .mainpage .pagetitle, .single-post .mainpage h1, .single-post .mainpage h2, .blog .mainpage .pagetitle, .blog .mainpage h1, .blog .mainpage h2 { color: #eb7200; }
.single-post .mainpage a:hover, .blog .mainpage a:hover { color: #eb7200; }
.single-post .mainpage .nav-links a, .blog .mainpage .nav-links a { background-color: #eb7200; }
.single-post .mainpage .nav-links a:hover, .blog .mainpage .nav-links a:hover { background-color: #dc6b00; }

.single-inspiration .mainpage .pagetitle, .single-inspiration .mainpage h1, .single-inspiration .mainpage h2, .post-type-archive-inspiration .mainpage .pagetitle, .post-type-archive-inspiration .mainpage h1, .post-type-archive-inspiration .mainpage h2, .tax-inspiration-type .mainpage .pagetitle, .tax-inspiration-type .mainpage h1, .tax-inspiration-type .mainpage h2 { color: #00563f; }
.single-inspiration .mainpage a:hover, .post-type-archive-inspiration .mainpage a:hover, .tax-inspiration-type .mainpage a:hover { color: #00563f; }
.single-inspiration .mainpage .recipeblock:hover h3, .single-inspiration .mainpage .recipeblock--gallery:hover h3, .post-type-archive-inspiration .mainpage .recipeblock:hover h3, .post-type-archive-inspiration .mainpage .recipeblock--gallery:hover h3, .tax-inspiration-type .mainpage .recipeblock:hover h3, .tax-inspiration-type .mainpage .recipeblock--gallery:hover h3 { color: #ffffff; }

.page-template-template-footerpage .mainpage h1, .page-template-template-footerpage .mainpage h2 { color: #00563f; }
.page-template-template-footerpage .mainpage a { font-weight: 600; color: #323232; text-decoration: underline; }
.page-template-template-footerpage .mainpage h2 { border-bottom: 1px solid #d6d6d6; font-size: 1.25em; letter-spacing: 0; color: #323232; padding-bottom: 10px; margin-bottom: 2em; display: block; width: auto; }
.page-template-template-footerpage .mainpage table { margin: 1em 0; }

.addressblock { font-family: "FuturaPT-Heavy", Arial, sans-serif; font-size: 1.25em; line-height: 150%; }

.mainpage .contactlist { list-style: none; padding-left: 0; margin: 1em 0 5em; display: inline-block; padding-bottom: 2em; }
.mainpage .contactlist strong { font-family: "FuturaPT-Heavy", Arial, sans-serif; font-weight: 400; font-size: 1.125em; }
.mainpage .contactlist a { font-weight: 400; }

.mainpage .director { margin-top: 30px; }
.mainpage .director h4 { margin-bottom: 0; letter-spacing: 0; }
.mainpage .director img { float: left; margin-right: 30px; display: none; width: auto; }
.mainpage .director a { font-weight: 400; }
.mainpage .director .director__text { display: inline; }

@media all and (min-width: 500px) { .mainpage .director img { display: block; } }
.page-id-5453 label { display: block; width: 100%; font-weight: 600; }
.page-id-5453 input[type="password"] { border: 1px solid #ccc; border-radius: 4px; padding: 10px; width: 100%; margin: 2em 0; }
.page-id-5453 input[type="submit"] { display: block; font-size: 1em; }

@media all and (min-width: 600px) { .page-id-5453 form { width: 50%; } }
.gform_wrapper.gf_browser_chrome .gform_body { width: 100%; }
.gform_wrapper.gf_browser_chrome .gform_body label { display: none; }

.gform_wrapper input[type="text"], .gform_wrapper input[type="number"], .gform_wrapper textarea { border: 1px solid #ccc; border-radius: 4px; width: 100%; padding: 10px !important; }
.gform_wrapper textarea { height: 200px !important; }

.recipeblock, .recipeblock--gallery { position: relative; text-align: center; margin-bottom: 20px; overflow: hidden; }
.recipeblock img, .recipeblock--gallery img { max-width: 100%; height: auto; display: block; -webkit-backface-visibility: hidden; transition: transform 1s ease; }
.recipeblock .recipeblock__inner, .recipeblock--gallery .recipeblock__inner { position: absolute; top: 0; bottom: 0; left: 0; right: 0; }
.recipeblock .vwrap, .recipeblock--gallery .vwrap { position: relative; z-index: 2; height: 100%; width: 100%; display: table; }
.recipeblock .vc, .recipeblock--gallery .vc { display: table-cell; height: 100%; vertical-align: middle; padding: 20px; }
.recipeblock a, .recipeblock--gallery a { color: #ffffff; }
.recipeblock a:hover img, .recipeblock--gallery a:hover img { transform: scale(1.03); }
.recipeblock h3, .recipeblock--gallery h3 { font-size: 1.6em; }

.recipeblock__overlay { position: absolute; top: 0; bottom: 0; width: 100%; background: rgba(0, 0, 0, 0.1); z-index: 1; }

@media all and (min-width: 768px) { .recipeblock, .recipeblock--gallery { margin-bottom: 30px; } }
.recipeblock--gallery { color: #ffffff; }
.recipeblock--gallery .recipeblock__overlay { background: rgba(0, 0, 0, 0.5); }
.recipeblock--gallery .recipeblock__inner { transition: opacity .4s ease; opacity: 0; filter: alpha(opacity=0); }

.recipeblock--gallery:hover .recipeblock__inner { opacity: 1; filter: alpha(opacity=100); }

.recipeinfo h3, .recipeinfo h4 { letter-spacing: 0.05em; }
.recipeinfo h3 { margin-top: 2em; }
.recipeinfo h4 { font-size: 1em; border-bottom: 1px solid #cdcdcd; padding-bottom: 10px; margin-top: 2em; margin-bottom: 20px; width: 70%; }

.screen-reader-text { display: none; }

.nav-links { padding: 40px 0; text-align: center; }
.nav-links a { display: block; margin-bottom: 20px; }

@media all and (min-width: 768px) { .nav-links a { display: inline-block; }
  .nav-links .nav-previous { float: left; }
  .nav-links .nav-next { float: right; } }
.instagramheader { background-color: #00833f; color: #ffffff; font-family: "FuturaPT-Heavy", Arial, sans-serif; text-transform: uppercase; font-size: 2em; padding: 30px 20px; }
.instagramheader a { color: #ffffff; transition: opacity 0.2s ease; }
.instagramheader a:hover { opacity: 0.8; filter: alpha(opacity=80); }

.singlebanner, .singlebanner--recipe, .singlebanner--inspiration { padding: 40px 0; color: #ffffff; font-family: "FuturaPT-Heavy", Arial, sans-serif; letter-spacing: 0.05em; text-align: center; }
.singlebanner p, .singlebanner--recipe p, .singlebanner--inspiration p { font-size: 1.8em; line-height: 130%; font-weight: 600; margin-bottom: 0; }
.singlebanner .btn, .singlebanner--recipe .btn, .singlebanner--inspiration .btn, .singlebanner .btn--citrus, .singlebanner--recipe .btn--citrus, .singlebanner--inspiration .btn--citrus, .singlebanner .btn--recipes, .singlebanner--recipe .btn--recipes, .singlebanner--inspiration .btn--recipes, .singlebanner .gform_button, .singlebanner--recipe .gform_button, .singlebanner--inspiration .gform_button, .singlebanner .page-id-5453 input[type="submit"], .page-id-5453 .singlebanner input[type="submit"], .singlebanner--recipe .page-id-5453 input[type="submit"], .page-id-5453 .singlebanner--recipe input[type="submit"], .singlebanner--inspiration .page-id-5453 input[type="submit"], .page-id-5453 .singlebanner--inspiration input[type="submit"], .singlebanner .btn--products, .singlebanner--recipe .btn--products, .singlebanner--inspiration .btn--products, .singlebanner .nav-links a, .nav-links .singlebanner a, .singlebanner--recipe .nav-links a, .nav-links .singlebanner--recipe a, .singlebanner--inspiration .nav-links a, .nav-links .singlebanner--inspiration a { background: #ffffff; }

.singlebanner--recipe, .singlebanner--inspiration { background-color: #bb2253; margin-top: 40px; }
.singlebanner--recipe .btn, .singlebanner--inspiration .btn, .singlebanner--recipe .btn--citrus, .singlebanner--inspiration .btn--citrus, .singlebanner--recipe .btn--recipes, .singlebanner--inspiration .btn--recipes, .singlebanner--recipe .gform_button, .singlebanner--inspiration .gform_button, .singlebanner--recipe .page-id-5453 input[type="submit"], .page-id-5453 .singlebanner--recipe input[type="submit"], .singlebanner--inspiration .page-id-5453 input[type="submit"], .page-id-5453 .singlebanner--inspiration input[type="submit"], .singlebanner--recipe .btn--products, .singlebanner--inspiration .btn--products, .singlebanner--recipe .nav-links a, .nav-links .singlebanner--recipe a, .singlebanner--inspiration .nav-links a, .nav-links .singlebanner--inspiration a { color: #bb2253 !important; }
.singlebanner--recipe img, .singlebanner--inspiration img { display: none; }

.singlebanner--inspiration { background-color: #00563f; }
.singlebanner--inspiration .btn, .singlebanner--inspiration .btn--citrus, .singlebanner--inspiration .btn--recipes, .singlebanner--inspiration .gform_button, .singlebanner--inspiration .page-id-5453 input[type="submit"], .page-id-5453 .singlebanner--inspiration input[type="submit"], .singlebanner--inspiration .btn--products, .singlebanner--inspiration .nav-links a, .nav-links .singlebanner--inspiration a { color: #00563f !important; }

@media all and (min-width: 768px) { .singlebanner, .singlebanner--recipe, .singlebanner--inspiration { padding: 60px 0; text-align: left; }
  .singlebanner--recipe, .singlebanner--inspiration { margin-top: 120px; }
  .singlebanner--recipe img, .singlebanner--inspiration img { display: block; margin-top: -110px; margin-bottom: -80px; max-width: 100%; height: auto; }
  .singlebanner--inspiration img { margin-bottom: -120px; }
  .inspirationrelated { padding-top: 120px; } }
.pageheader--video { background-color: #323232; height: auto; }
.pageheader--video iframe { display: block; }

.colornature { color: #00563f; }

.familytree-svg { position: relative; z-index: 3; margin-top: 0; width: 100%; }

@media all and (min-width: 768px) { .familytree-svg { margin-top: 0; width: 100%; } }
.center { text-align: center; }

.alr { text-align: right; }

.group:after, .socialsharing:after, .mainpage .director:after, .nav-links:after { content: ""; display: table; clear: both; }

.ir { text-indent: 100%; white-space: nowrap; overflow: hidden; }

.nmb { margin-bottom: 0; }

.nmt { margin-top: 0 !important; }

@media all and (max-width: 768px) { .hide-sml { display: none; } }
@media all and (min-width: 768px) and (max-width: 1024px) { .hide-med { display: none; } }
@media all and (max-width: 1024px) { .hide-sml-med { display: none; } }
@media all and (min-width: 1024px) { .hide-lrg { display: none; } }
@media all and (max-width: 768px) { .center-sml { text-align: center; } }
.sml { font-size: 0.875em; }

.prominent { font-size: 1.125em; }

.nopad { padding: 0; }

.nopadt { padding-top: 0 !important; }

.nopadbt { padding-bottom: 0 !important; }

.mw { width: 100%; height: auto; max-width: 100%; margin-left: auto; margin-right: auto; }

.grid__item {
	position: relative;
}


.recipe_grid {
	width: 768px;
	margin: 0 auto;
	display: block;
}
.recipe_image {
	width: 100%;
}
@media screen and (max-width: 780px) {
	.recipe_grid {
		width: 100%;
	}
}

.comng-soon {
	position: absolute;
    top: 0;
    right: 0;
    background: #00563f;
    border-radius: 50%;
    width: 90px;
    height: 90px;
	display: none;
}
.comng-soon .inner-cs {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    padding: 10px;
    font-size: 14px;
    line-height: 16px;
    text-align: center;
    color: #fff;
    font-weight: 600;
}
.showCS {
	display: block;
}


.buyNow {

}
.buyNow a {
    color: #00563f;
	font-weight: 600;
}




/** Shirt page **/

.imageGallery-wrap {
	overflow: hidden;
}
.imageGallery-wrap .open-lightbox img {
	width: 33.33333333333333%;
	float: left;
}

.lightbox-opened {
    background-color: rgba(0,0,0,0.65);
    cursor: pointer;
    height: 100%;
    left: 0;
    overflow-y: scroll;
    padding: 24px;
    position: fixed;
    text-align: center;
    top: 0;
    width: 100%;
    z-index: 999;
}
.lightbox-opened::before {
    background-color: #333;
    background-color: rgba(#333, 0.9);
    color: #eee;
    content: "x";
    font-family: sans-serif;
    padding: 6px 12px;
    position: absolute;
    text-transform: uppercase;
    right: 15px;
    top: 15px;
}

.lightbox-opened img {
    box-shadow: 0 0 6px 3px #333;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    max-width: 95%;
}

.no-scroll {
  overflow: hidden;
}

.mainpage .nav-tabs {
    list-style: none;
    padding: 0;
    margin: 30px 0 15px;
    border: none;
}

.tab-content {
    background: #e9e9e9;
    padding: 30px 30px 15px;
}

.nav-tabs .nav-item {
    margin: 0 15px 0 0;
}

.nav-tabs .nav-link {
    color: #00563f;
    border: none;
    background: #e9e9e9;
    border-radius: 0;
	text-decoration: none;
}

.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
	background-color: #00563f;
    color: #fff;
}

.tab-content form {}
.tab-content form input {
    width: 100%;
    font-size: 16px;
    padding: 5px;
}
.tab-content form input[type="submit"] {
    background-color: #00563f;
    color: #fff;
    font-size: 16px;
    text-transform: uppercase !important;
    font-weight: 600;
    width: 150px;
    float: right;
	border: none;
}
.tab-content form input[type="submit"]:hover {
	background-color: #003325;
}

@media screen and (max-width: 660px) {
	.imageGallery-wrap {
		margin-bottom: 30px;
	}
}


/** Foundation Page **/

.formWrap form {
    background: #e9e9e9;
    padding: 30px 30px 15px;
}
.formWrap form input, .formWrap form textarea {
    width: 100%;
    font-size: 16px;
    padding: 5px;
    border: none;
}
.formWrap form textarea {
    height: 100px;
}
.formWrap form input[type="submit"] {
    background-color: #00563f;
    color: #fff;
    font-size: 16px;
    text-transform: uppercase !important;
    font-weight: 600;
    width: 150px;
    float: right;
	border: none;
}
.formWrapt form input[type="submit"]:hover {
	background-color: #003325;
}



/** Landing Page **/

.landingBanner {
    width: 100%;
}
#landingSection ol {
    margin: 0;
}
#landingSection ol li {
    margin: 10px 0 0;
    line-height: 20px;
}
#landingSection h3 {
    margin-top: 30px;
}
#availAt {
    padding: 0;
    list-style: none;
    overflow: hidden;
    margin: 0 -15px 30px;
}
#availAt li {
    margin: 10px 0 0;
    display: inline-block;
    width: 50%;
    float: left;
    padding: 0 15px;
}
#availAt li a {
    display: block;
    text-align: center;
    background: #444;
    padding: 10px;
    color: #fff;
    text-decoration: none;
    font-weight: 600;
    font-size: 18px;
}
#availAt li .btn-Sainsburys {background: #f06c00;}
#availAt li .btn-Morrisons {background: #004e37;}
#availAt li .btn-Ocado {background: #b8c11c;}
#availAt li .btn-Co-Op {background: #33B1E7; cursor: initial;}
#availAt li .btn-Tesco {background: #00539f; cursor: initial;}
#availAt li .btn-Sainsburys:hover, #availAt li .btn-Morrisons:hover, #availAt li .btn-Ocado:hover {opacity: 0.8;}

#socialSection .fts-powered-by-text, #socialSection .fts-jal-fb-header {
    display: none !important;
}

.orange-background {
	background-color: #f39200;
	padding: 80px 0px;
	margin-top: -10px;
}

.top-secret-form h3 { font-size: 28px!important; max-width: 75%!important;}

.top-secret-form input {
	    border: 1px solid #ccc;
    border-radius: 4px;
    width: 100%;
    padding: 10px !important
}

.top-secret-form .gform_wrapper ul li.gfield {
    margin-top: 0px;
    padding-top: 0;
}
.top-secret-form .gform_button {
	background-color:#bb1732;
	border: none;
	padding:10px 20px!important;
}
.top-secret-form .gfield_label {
	display: none!important;
}

@media screen and (max-width: 991px) {
    #landingSection .landingThumb {
        margin: -30px 0 30px;
    }
    .landingBanner {
        display: none;
    }
    #landingSection #gallery-1 .gallery-item {
        width: 50%;
        margin-top: 0;
    }
}

@media screen and (max-width: 500px) {
    #availAt li {
        width: 100%;
    }
}



/** Alternating Landing Page **/

.alternating_sections {
    overflow: hidden;
    margin: 30px 0 0;
}
.alternating_sections:first-child {
    margin: 0;
}
.alternating-wrap .alternating_sections:nth-child(even) .alt_grid {
   float: right;
}
.alternating_sections img {

}

.grey_pullout {
    position: relative;
    background: #eeeeee;
    overflow: hidden;
    padding: 30px;
    margin: 30px 0 0;
}
.grey_pullout p:last-child {
    margin: 0;
}
.grey_pullout img {
    position: absolute;
    bottom: 30px;
    right: 30px;
}


@media screen and (max-width: 991px) {
    .alternating-wrap .alternating_sections:nth-child(even) .alt_grid {
       float: none;
    }
    .alternating-wrap .alternating_sections .grid__item {
        width: 100%;
        padding: 0;
    }
    .alternating_sections img {
        width: 100%;
        margin: 0 0 30px;
    }
    .grey_pullout img {
        position: static;
    }
}
@media screen and (max-width: 550px) {
    .pageheader h1 {
        font-size: 20px;
        width: 85%;
    }
}