/* bourbon - for mixins */ /* normalize.css v2.1.1 | 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 styling not present in IE 8/9. */ [hidden] { display: none; } /* ========================================================================== Base ========================================================================== */ /** 1. Prevent system color scheme's background color being used in Firefox, IE, and Opera. 2. Prevent system color scheme's text color being used in Firefox, IE, and Opera. 3. Set default font family to sans-serif. 4. Prevent iOS text size adjust after orientation change, without disabling user zoom. */ html { background: #fff; /* 1 */ color: #000; /* 2 */ font-family: sans-serif; /* 3 */ -ms-text-size-adjust: 100%; /* 4 */ -webkit-text-size-adjust: 100%; /* 4 */ } /** Remove default margin. */ body { margin: 0; } /* ========================================================================== Links ========================================================================== */ /** 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: 1px solid #c0c0c0; 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. 2. Remove excess padding in IE 8/9. */ 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; } /* normalize - css reset */ @font-face { font-family: "Kievit Black"; src: url("../fonts/KievitWeb-Black.eot?#iefix"); src: url("../fonts/KievitWeb-Black.eot?#iefix") format("eot"), url("/fonts/KievitWeb-Black.woff") format("woff"), url("/fonts/KievitComp-Black.ttf") format("truetype"); } @font-face { font-family: "Kievit Bold"; src: url("../fonts/KievitWeb-Bold.eot?#iefix"); src: url("../fonts/KievitWeb-Bold.eot?#iefix") format("eot"), url("/fonts/KievitWeb-Bold.woff") format("woff"), url("/fonts/KievitComp-Bold.ttf") format("truetype"); } @font-face { font-family: "Kievit Book"; src: url("/fonts/KievitWeb-Book.eot?#iefix"); src: url("/fonts/KievitWeb-Book.eot?#iefix") format("eot"), url("/fonts/KievitWeb-Book.woff") format("woff"), url("/fonts/KievitComp-Book.ttf") format("truetype"); } @font-face { font-family: "Kievit ExtraLight"; src: url("/fonts/KievitWeb-Exlig.eot?#iefix"); src: url("/fonts/KievitWeb-Exlig.eot?#iefix") format("eot"), url("/fonts/KievitWeb-Exlig.woff") format("woff"), url("/fonts/KievitComp-Exlig.ttf") format("truetype"); } @font-face { font-family: "Kievit Light"; src: url("/fonts/KievitWeb-Light.eot?#iefix"); src: url("/fonts/KievitWeb-Light.eot?#iefix") format("eot"), url("/fonts/KievitWeb-Light.woff") format("woff"), url("/fonts/KievitComp-Light.ttf") format("truetype"); } @font-face { font-family: "Kievit Medium"; src: url("../fonts/KievitWeb-Medi.eot?#iefix"); src: url("../fonts/KievitWeb-Medi.eot?#iefix") format("eot"), url("/fonts/KievitWeb-Medi.woff") format("woff"), url("/fonts/KievitComp-Medi.ttf") format("truetype"); } @font-face { font-family: "Kievit Regular"; src: url("../fonts/KievitWeb.eot?#iefix"); src: url("../fonts/KievitWeb.eot?#iefix") format("eot"), url("/fonts/KievitWeb.woff") format("woff"), url("/fonts/KievitComp.ttf") format("truetype"); } /* font stuff */ /* custom mixins */ *, *:before, *:after { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; } html, body { font-size: 100%; } body { background: white; color: #222222; padding: 0; margin: 0; font-family: "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif; font-weight: normal; font-style: normal; line-height: 1; position: relative; } a:focus { outline: none; } img, object, embed { max-width: 100%; height: auto; } object, embed { height: 100%; } img { -ms-interpolation-mode: bicubic; } #map_canvas img, #map_canvas embed, #map_canvas object, .map_canvas img, .map_canvas embed, .map_canvas object { max-width: none !important; } .left { float: left !important; } .right { float: right !important; } .text-left { text-align: left !important; } .text-right { text-align: right !important; } .text-center { text-align: center !important; } .text-justify { text-align: justify !important; } .hide { display: none; } .antialiased { -webkit-font-smoothing: antialiased; } img { display: inline-block; vertical-align: middle; } textarea { height: auto; min-height: 50px; } select { width: 100%; } /* Grid HTML Classes */ .row { width: 100%; margin-left: auto; margin-right: auto; margin-top: 0; margin-bottom: 0; max-width: 90em; *zoom: 1; } .row:before, .row:after { content: " "; display: table; } .row:after { clear: both; } .row.collapse .column, .row.collapse .columns { position: relative; padding-left: 0; padding-right: 0; float: left; } .row .row { width: auto; margin-left: -0.9375em; margin-right: -0.9375em; margin-top: 0; margin-bottom: 0; max-width: none; *zoom: 1; padding: 0; } .row .row:before, .row .row:after { content: " "; display: table; } .row .row:after { clear: both; } .row .row.collapse { width: auto; margin: 0; max-width: none; *zoom: 1; } .row .row.collapse:before, .row .row.collapse:after { content: " "; display: table; } .row .row.collapse:after { clear: both; } .column, .columns { position: relative; padding-left: 0.9375em; padding-right: 0.9375em; width: 100%; float: left; } @media only screen { .column, .columns { position: relative; padding-left: 0.9375em; padding-right: 0.9375em; float: left; } .small-1 { position: relative; width: 8.33333%; } .small-2 { position: relative; width: 16.66667%; } .small-3 { position: relative; width: 25%; } .small-4 { position: relative; width: 33.33333%; } .small-5 { position: relative; width: 41.66667%; } .small-6 { position: relative; width: 50%; } .small-7 { position: relative; width: 58.33333%; } .small-8 { position: relative; width: 66.66667%; } .small-9 { position: relative; width: 75%; } .small-10 { position: relative; width: 83.33333%; } .small-11 { position: relative; width: 91.66667%; } .small-12 { position: relative; width: 100%; } .small-offset-1 { position: relative; margin-left: 8.33333%; } .small-offset-2 { position: relative; margin-left: 16.66667%; } .small-offset-3 { position: relative; margin-left: 25%; } .small-offset-4 { position: relative; margin-left: 33.33333%; } .small-offset-5 { position: relative; margin-left: 41.66667%; } .small-offset-6 { position: relative; margin-left: 50%; } .small-offset-7 { position: relative; margin-left: 58.33333%; } .small-offset-8 { position: relative; margin-left: 66.66667%; } .small-offset-9 { position: relative; margin-left: 75%; } .small-offset-10 { position: relative; margin-left: 83.33333%; } [class*="column"] + [class*="column"]:last-child { float: right; } [class*="column"] + [class*="column"].end { float: left; } .column.small-centered, .columns.small-centered { position: relative; margin-left: auto; margin-right: auto; float: none !important; } } /* Styles for tablet/desktop screens */ @media only screen and (min-width: 40.0625em) { .large-1 { position: relative; width: 8.33333%; } .large-2 { position: relative; width: 16.66667%; } .large-3 { position: relative; width: 25%; } .large-4 { position: relative; width: 33.33333%; } .large-5 { position: relative; width: 41.66667%; } .large-6 { position: relative; width: 50%; } .large-7 { position: relative; width: 58.33333%; } .large-8 { position: relative; width: 66.66667%; } .large-9 { position: relative; width: 75%; } .large-10 { position: relative; width: 83.33333%; } .large-11 { position: relative; width: 91.66667%; } .large-12 { position: relative; width: 100%; } .row .large-offset-1 { position: relative; margin-left: 8.33333%; } .row .large-offset-2 { position: relative; margin-left: 16.66667%; } .row .large-offset-3 { position: relative; margin-left: 25%; } .row .large-offset-4 { position: relative; margin-left: 33.33333%; } .row .large-offset-5 { position: relative; margin-left: 41.66667%; } .row .large-offset-6 { position: relative; margin-left: 50%; } .row .large-offset-7 { position: relative; margin-left: 58.33333%; } .row .large-offset-8 { position: relative; margin-left: 66.66667%; } .row .large-offset-9 { position: relative; margin-left: 75%; } .row .large-offset-10 { position: relative; margin-left: 83.33333%; } .row .large-offset-11 { position: relative; margin-left: 91.66667%; } .push-1 { position: relative; left: 8.33333%; right: auto; } .pull-1 { position: relative; right: 8.33333%; left: auto; } .push-2 { position: relative; left: 16.66667%; right: auto; } .pull-2 { position: relative; right: 16.66667%; left: auto; } .push-3 { position: relative; left: 25%; right: auto; } .pull-3 { position: relative; right: 25%; left: auto; } .push-4 { position: relative; left: 33.33333%; right: auto; } .pull-4 { position: relative; right: 33.33333%; left: auto; } .push-5 { position: relative; left: 41.66667%; right: auto; } .pull-5 { position: relative; right: 41.66667%; left: auto; } .push-6 { position: relative; left: 50%; right: auto; } .pull-6 { position: relative; right: 50%; left: auto; } .push-7 { position: relative; left: 58.33333%; right: auto; } .pull-7 { position: relative; right: 58.33333%; left: auto; } .push-8 { position: relative; left: 66.66667%; right: auto; } .pull-8 { position: relative; right: 66.66667%; left: auto; } .push-9 { position: relative; left: 75%; right: auto; } .pull-9 { position: relative; right: 75%; left: auto; } .push-10 { position: relative; left: 83.33333%; right: auto; } .pull-10 { position: relative; right: 83.33333%; left: auto; } .push-11 { position: relative; left: 91.66667%; right: auto; } .pull-11 { position: relative; right: 91.66667%; left: auto; } .column.large-centered, .columns.large-centered { position: relative; margin-left: auto; margin-right: auto; float: none !important; } .column.large-uncentered, .columns.large-uncentered { margin-left: 0; margin-right: 0; float: left !important; } .column.large-uncentered.opposite, .columns.large-uncentered.opposite { float: right !important; } } /* Foundation Visibility HTML Classes */ .show-for-small, .show-for-medium-down, .show-for-large-down { display: inherit !important; } .show-for-medium, .show-for-medium-up, .show-for-large, .show-for-large-up, .show-for-xlarge { display: none !important; } .hide-for-medium, .hide-for-medium-up, .hide-for-large, .hide-for-large-up, .hide-for-xlarge { display: inherit !important; } .hide-for-small, .hide-for-medium-down, .hide-for-large-down { display: none !important; } /* Specific visilbity for tables */ table.show-for-small, table.show-for-medium-down, table.show-for-large-down, table.hide-for-medium, table.hide-for-medium-up, table.hide-for-large, table.hide-for-large-up, table.hide-for-xlarge { display: table; } thead.show-for-small, thead.show-for-medium-down, thead.show-for-large-down, thead.hide-for-medium, thead.hide-for-medium-up, thead.hide-for-large, thead.hide-for-large-up, thead.hide-for-xlarge { display: table-header-group !important; } tbody.show-for-small, tbody.show-for-medium-down, tbody.show-for-large-down, tbody.hide-for-medium, tbody.hide-for-medium-up, tbody.hide-for-large, tbody.hide-for-large-up, tbody.hide-for-xlarge { display: table-row-group !important; } tr.show-for-small, tr.show-for-medium-down, tr.show-for-large-down, tr.hide-for-medium, tr.hide-for-medium-up, tr.hide-for-large, tr.hide-for-large-up, tr.hide-for-xlarge { display: table-row !important; } td.show-for-small, td.show-for-medium-down, td.show-for-large-down, td.hide-for-medium, td.hide-for-medium-up, td.hide-for-large, td.hide-for-large-up, td.hide-for-xlarge, th.show-for-small, th.show-for-medium-down, th.show-for-large-down, th.hide-for-medium, th.hide-for-medium-up, th.hide-for-large, th.hide-for-large-up, th.hide-for-xlarge { display: table-cell !important; } /* Medium Displays: 768px - 1279px */ @media only screen and (min-width: 40.0625em) { .show-for-medium, .show-for-medium-up { display: inherit !important; } .show-for-small { display: none !important; } .hide-for-small { display: inherit !important; } .hide-for-medium, .hide-for-medium-up { display: none !important; } /* Specific visilbity for tables */ table.show-for-medium, table.show-for-medium-up, table.hide-for-small { display: table; } thead.show-for-medium, thead.show-for-medium-up, thead.hide-for-small { display: table-header-group !important; } tbody.show-for-medium, tbody.show-for-medium-up, tbody.hide-for-small { display: table-row-group !important; } tr.show-for-medium, tr.show-for-medium-up, tr.hide-for-small { display: table-row !important; } td.show-for-medium, td.show-for-medium-up, td.hide-for-small, th.show-for-medium, th.show-for-medium-up, th.hide-for-small { display: table-cell !important; } } /* Large Displays: 1280px - 1440px */ @media only screen and (min-width: 50.0625em) { .show-for-large, .show-for-large-up { display: inherit !important; } .show-for-medium, .show-for-medium-down { display: none !important; } .hide-for-medium, .hide-for-medium-down { display: inherit !important; } .hide-for-large, .hide-for-large-up { display: none !important; } /* Specific visilbity for tables */ table.show-for-large, table.show-for-large-up, table.hide-for-medium, table.hide-for-medium-down { display: table; } thead.show-for-large, thead.show-for-large-up, thead.hide-for-medium, thead.hide-for-medium-down { display: table-header-group !important; } tbody.show-for-large, tbody.show-for-large-up, tbody.hide-for-medium, tbody.hide-for-medium-down { display: table-row-group !important; } tr.show-for-large, tr.show-for-large-up, tr.hide-for-medium, tr.hide-for-medium-down { display: table-row !important; } td.show-for-large, td.show-for-large-up, td.hide-for-medium, td.hide-for-medium-down, th.show-for-large, th.show-for-large-up, th.hide-for-medium, th.hide-for-medium-down { display: table-cell !important; } } /* X-Large Displays: 1400px and up */ @media only screen and (min-width: 90.0625em) { .show-for-xlarge { display: inherit !important; } .show-for-large, .show-for-large-down { display: none !important; } .hide-for-large, .hide-for-large-down { display: inherit !important; } .hide-for-xlarge { display: none !important; } /* Specific visilbity for tables */ table.show-for-xlarge, table.hide-for-large, table.hide-for-large-down { display: table; } thead.show-for-xlarge, thead.hide-for-large, thead.hide-for-large-down { display: table-header-group !important; } tbody.show-for-xlarge, tbody.hide-for-large, tbody.hide-for-large-down { display: table-row-group !important; } tr.show-for-xlarge, tr.hide-for-large, tr.hide-for-large-down { display: table-row !important; } td.show-for-xlarge, td.hide-for-large, td.hide-for-large-down, th.show-for-xlarge, th.hide-for-large, th.hide-for-large-down { display: table-cell !important; } } /* Orientation targeting */ .show-for-landscape, .hide-for-portrait { display: inherit !important; } .hide-for-landscape, .show-for-portrait { display: none !important; } /* Specific visilbity for tables */ table.hide-for-landscape, table.show-for-portrait { display: table; } thead.hide-for-landscape, thead.show-for-portrait { display: table-header-group !important; } tbody.hide-for-landscape, tbody.show-for-portrait { display: table-row-group !important; } tr.hide-for-landscape, tr.show-for-portrait { display: table-row !important; } td.hide-for-landscape, td.show-for-portrait, th.hide-for-landscape, th.show-for-portrait { display: table-cell !important; } @media only screen and (orientation: landscape) { .show-for-landscape, .hide-for-portrait { display: inherit !important; } .hide-for-landscape, .show-for-portrait { display: none !important; } /* Specific visilbity for tables */ table.show-for-landscape, table.hide-for-portrait { display: table; } thead.show-for-landscape, thead.hide-for-portrait { display: table-header-group !important; } tbody.show-for-landscape, tbody.hide-for-portrait { display: table-row-group !important; } tr.show-for-landscape, tr.hide-for-portrait { display: table-row !important; } td.show-for-landscape, td.hide-for-portrait, th.show-for-landscape, th.hide-for-portrait { display: table-cell !important; } } @media only screen and (orientation: portrait) { .show-for-portrait, .hide-for-landscape { display: inherit !important; } .hide-for-portrait, .show-for-landscape { display: none !important; } /* Specific visilbity for tables */ table.show-for-portrait, table.hide-for-landscape { display: table; } thead.show-for-portrait, thead.hide-for-landscape { display: table-header-group !important; } tbody.show-for-portrait, tbody.hide-for-landscape { display: table-row-group !important; } tr.show-for-portrait, tr.hide-for-landscape { display: table-row !important; } td.show-for-portrait, td.hide-for-landscape, th.show-for-portrait, th.hide-for-landscape { display: table-cell !important; } } /* Touch-enabled device targeting */ .show-for-touch { display: none !important; } .hide-for-touch { display: inherit !important; } .touch .show-for-touch { display: inherit !important; } .touch .hide-for-touch { display: none !important; } /* Specific visilbity for tables */ table.hide-for-touch { display: table; } .touch table.show-for-touch { display: table; } thead.hide-for-touch { display: table-header-group !important; } .touch thead.show-for-touch { display: table-header-group !important; } tbody.hide-for-touch { display: table-row-group !important; } .touch tbody.show-for-touch { display: table-row-group !important; } tr.hide-for-touch { display: table-row !important; } .touch tr.show-for-touch { display: table-row !important; } td.hide-for-touch { display: table-cell !important; } .touch td.show-for-touch { display: table-cell !important; } th.hide-for-touch { display: table-cell !important; } .touch th.show-for-touch { display: table-cell !important; } .reveal-modal-bg { position: fixed; height: 100%; width: 100%; background: black; background: rgba(0, 0, 0, 0.45); z-index: 98; display: none; top: 0; left: 0; } .reveal-modal { visibility: hidden; display: none; position: absolute; left: 50%; z-index: 99; height: auto; margin-left: -40%; width: 80%; background-color: white; padding: 1.25em; border: solid 1px #666666; -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.4); -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.4); box-shadow: 0 0 10px rgba(0, 0, 0, 0.4); top: 50px; } .reveal-modal .column, .reveal-modal .columns { min-width: 0; } .reveal-modal > :first-child { margin-top: 0; } .reveal-modal > :last-child { margin-bottom: 0; } .reveal-modal .close-reveal-modal { font-size: 1.375em; line-height: 1; position: absolute; top: 0.5em; right: 0.6875em; color: #aaaaaa; font-weight: bold; cursor: pointer; } @media only screen and (min-width: 40.0625em) { .reveal-modal { padding: 1.875em; top: 6.25em; } .reveal-modal.tiny { margin-left: -15%; width: 30%; } .reveal-modal.small { margin-left: -20%; width: 40%; } .reveal-modal.medium { margin-left: -30%; width: 60%; } .reveal-modal.large { margin-left: -35%; width: 70%; } .reveal-modal.xlarge { margin-left: -47.5%; width: 95%; } } @media print { .reveal-modal { background: #fff !important; } } /* jQuery FlexSlider v2.0 http://www.woothemes.com/flexslider/ Copyright 2012 WooThemes Free to use under the GPLv2 license. http://www.gnu.org/licenses/gpl-2.0.html Contributing author: Tyler Smith (@mbmufffin) */ /* Browser Resets */ .flex-container a:active, .flexslider a:active, .flex-container a:focus, .flexslider a:focus { outline: none; } .slides, .flex-control-nav, .flex-direction-nav { margin: 0; padding: 0; list-style: none; } /* FlexSlider Necessary Styles *********************************/ .flexslider { margin: 0; padding: 0; } .flexslider .slides > li { display: none; -webkit-backface-visibility: hidden; background: none; } /* Hide the slides before the JS is loaded. Avoids image jumping */ .flexslider .slides img { width: 100%; display: block; } .flex-pauseplay span { text-transform: capitalize; } /* Clearfix for the .slides element */ .slides:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; } html[xmlns] .slides { display: block; } * html .slides { height: 1%; } /* No JavaScript Fallback */ /* If you are not using another script, such as Modernizr, make sure you include js that eliminates this class on page load */ .no-js .slides > li:first-child { display: block; } /* FlexSlider Default Theme *********************************/ .flexslider { margin: 0 0 60px; background: #fff; position: relative; zoom: 1; } .flex-viewport { max-height: 2000px; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; transition: all 1s ease; } .loading .flex-viewport { max-height: 300px; } .flexslider .slides { zoom: 1; } .carousel li { margin-right: 5px; background: none; } /* Direction Nav */ .flex-direction-nav { *height: 0; } .flex-direction-nav a { width: 30px; height: 30px; margin: -20px 0 0; display: block; position: absolute; top: 50%; z-index: 10; cursor: pointer; text-indent: -9999px; opacity: 1; /*-webkit-transition: all .3s ease;*/ } .flex-direction-nav .flex-next { background-position: 100% 0; right: -36px; } .flex-direction-nav .flex-prev { left: -36px; } /*.flexslider:hover .flex-next {opacity: 0.8; right: 5px;} .flexslider:hover .flex-prev {opacity: 0.8; left: 5px;} .flexslider:hover .flex-next:hover, .flexslider:hover .flex-prev:hover {opacity: 1;}*/ .flex-direction-nav .flex-disabled { opacity: 0.3 !important; filter: alpha(opacity=30); cursor: default; } /* Control Nav */ .flex-control-nav { width: 100%; position: absolute; bottom: -40px; text-align: center; } .flex-control-nav li { margin: 0 6px; display: inline-block; zoom: 1; *display: inline; background: none; } .flex-control-nav li:before { display: none; } .flex-control-paging li a { width: 11px; height: 11px; display: block; background: #666; background: rgba(0, 0, 0, 0.5); cursor: pointer; text-indent: -9999px; -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; border-radius: 20px; box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.3); } .flex-control-paging li a:hover { background: #333; background: rgba(0, 0, 0, 0.7); } .flex-control-paging li a.flex-active { background: #000; background: rgba(0, 0, 0, 0.9); cursor: default; } .flex-control-thumbs { margin: 5px 0 0; position: static; overflow: hidden; } .flex-control-thumbs li { width: 25%; float: left; margin: 0; background: none; } .flex-control-thumbs img { width: 100%; display: block; opacity: .7; cursor: pointer; } .flex-control-thumbs img:hover { opacity: 1; } .flex-control-thumbs .flex-active { opacity: 1; cursor: default; } /*--- adjustments ---*/ .flex-control-paging li a { background: #e5e5e5; width: 22px; height: 22px; -webkit-box-shadow: 2px 2px 2px rgba(169, 169, 169, 0.7); -moz-box-shadow: 2px 2px 2px rgba(169, 169, 169, 0.7); box-shadow: 2px 2px 2px rgba(169, 169, 169, 0.7); } .flex-control-paging li a:hover { background: #1463a6; } .flex-control-paging li a.flex-active { background: #0097dc; } .simple-carousel h3 { text-align: center; margin: 1.7em 0 0 0; } .simple-carousel .flexslider { background: transparent; margin: 0 0 80px; } .simple-carousel .flexslider .flex-control-nav { bottom: -50px; } .simple-carousel .flexslider table { background: transparent; box-shadow: none; -webkit-box-shadow: none; -moz-box-shadow: none; margin: 0; } .simple-carousel .flexslider table tr td { text-transform: none; line-height: 1em; font-family: "Kievit Book"; vertical-align: top; width: 25%; } @media screen and (min-width: 1281px) { .simple-carousel .flexslider table tr td { font-size: 1.25em; } } @media screen and (max-width: 1280px) { .simple-carousel .flexslider table tr td { font-size: 1.1875em; } } @media screen and (max-width: 1120px) { .simple-carousel .flexslider table tr td { font-size: 1.125em; } } @media screen and (max-width: 960px) { .simple-carousel .flexslider table tr td { font-size: 1.0625em; } } @media screen and (max-width: 800px) { .simple-carousel .flexslider table tr td { font-size: 1em; } } @media screen and (max-width: 640px) { .simple-carousel .flexslider table tr td { font-size: 1.25em; } } @media screen and (max-width: 480px) { .simple-carousel .flexslider table tr td { font-size: 1em; } } @media screen and (max-width: 640px) { .simple-carousel .flexslider table tr td { display: block; width: 100%; border-left: 0; border-top: rgba(9, 69, 125, 0.2) solid 1px; } .simple-carousel .flexslider table tr td:first-child { border-top: none; } } .simple-carousel .flexslider .flex-text-paging { display: none; } /* flexslider - for carousels */ /* shared styles */ h2 { color: #0962a7; line-height: 1.0285em; font-family: "Kievit black"; text-transform: uppercase; text-shadow: 1px 1px 2px #969696; margin: 0.74285em 0 0.0857em 0; } @media screen and (min-width: 1281px) { h2 { font-size: 2.1875em; } } @media screen and (max-width: 1280px) { h2 { font-size: 2.07813em; } } @media screen and (max-width: 1120px) { h2 { font-size: 1.96875em; } } @media screen and (max-width: 960px) { h2 { font-size: 1.85938em; } } @media screen and (max-width: 800px) { h2 { font-size: 1.75em; } } @media screen and (max-width: 640px) { h2 { font-size: 2.1875em; } } @media screen and (max-width: 480px) { h2 { font-size: 1.75em; } } h3 { color: #0962a7; line-height: 1.1428em; font-family: "Kievit black"; text-transform: uppercase; margin: 1.238em 0 0 0; } @media screen and (min-width: 1281px) { h3 { font-size: 1.3125em; } } @media screen and (max-width: 1280px) { h3 { font-size: 1.24688em; } } @media screen and (max-width: 1120px) { h3 { font-size: 1.18125em; } } @media screen and (max-width: 960px) { h3 { font-size: 1.11562em; } } @media screen and (max-width: 800px) { h3 { font-size: 1.05em; } } @media screen and (max-width: 640px) { h3 { font-size: 1.3125em; } } @media screen and (max-width: 480px) { h3 { font-size: 1.05em; } } h4 { color: #0962a7; line-height: 1.5em; font-family: "Kievit black"; text-transform: uppercase; margin: 1em 0 0 0; } @media screen and (min-width: 1281px) { h4 { font-size: 1em; } } @media screen and (max-width: 1280px) { h4 { font-size: 0.95em; } } @media screen and (max-width: 1120px) { h4 { font-size: 0.9em; } } @media screen and (max-width: 960px) { h4 { font-size: 0.85em; } } @media screen and (max-width: 800px) { h4 { font-size: 0.8em; } } @media screen and (max-width: 640px) { h4 { font-size: 1em; } } @media screen and (max-width: 480px) { h4 { font-size: 0.8em; } } h5 { color: #0962a7; line-height: 1.5em; font-family: "Kievit black"; margin: 1em 0 0 0; } @media screen and (min-width: 1281px) { h5 { font-size: 1em; } } @media screen and (max-width: 1280px) { h5 { font-size: 0.95em; } } @media screen and (max-width: 1120px) { h5 { font-size: 0.9em; } } @media screen and (max-width: 960px) { h5 { font-size: 0.85em; } } @media screen and (max-width: 800px) { h5 { font-size: 0.8em; } } @media screen and (max-width: 640px) { h5 { font-size: 1em; } } @media screen and (max-width: 480px) { h5 { font-size: 0.8em; } } /* headings styles */ a { color: #0097dc; text-decoration: none; } a:hover { color: #005176; text-decoration: underline; } a.lightblue { color: #0097dc; text-decoration: none; } a.lightblue:hover { text-decoration: underline; } a.lightblue:active { color: #6e6e6e; } a.in-text { color: #0097dc; } a.in-text:hover { text-decoration: underline; } a.in-text:active { color: #09457d; } a.primary { color: #0097dc !important; } a.primary:hover { text-decoration: underline; } a.primary:active { color: #09457d !important; } a.carrot { color: #09457d; font-family: "Kievit Medium"; line-height: 1em; text-decoration: none; text-transform: uppercase; } a.carrot:after { background: url(images/icons/arrow.general.png) right 54% no-repeat; content: ""; padding-right: 10px; } a.carrot:hover { text-decoration: underline; } a.carrot:active { color: #6e6e6e; } a.carrot:active:after { background: url(images/icons/arrow.active.png) right 54% no-repeat; } @media screen and (min-width: 1281px) { a.carrot { font-size: 1.1875em; } } @media screen and (max-width: 1280px) { a.carrot { font-size: 1.12813em; } } @media screen and (max-width: 1120px) { a.carrot { font-size: 1.06875em; } } @media screen and (max-width: 960px) { a.carrot { font-size: 1.00937em; } } @media screen and (max-width: 800px) { a.carrot { font-size: 0.95em; } } @media screen and (max-width: 640px) { a.carrot { font-size: 1.1875em; } } @media screen and (max-width: 480px) { a.carrot { font-size: 0.95em; } } a.button { color: #fff; display: inline-block; background-color: #347ab4; background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #347ab4), color-stop(100%, #145ca0)); background-image: -webkit-linear-gradient(top, #347ab4, #145ca0); background-image: -moz-linear-gradient(top, #347ab4, #145ca0); background-image: -ms-linear-gradient(top, #347ab4, #145ca0); background-image: -o-linear-gradient(top, #347ab4, #145ca0); background-image: linear-gradient(top, #347ab4, #145ca0); -webkit-box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.33); -moz-box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.33); box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.33); font-family: "Kievit black"; line-height: 1em; min-width: 112px; padding: 16px 15px 13px 15px; text-align: center; text-decoration: none; text-transform: uppercase; } @media screen and (min-width: 1281px) { a.button { font-size: 0.7813em; } } @media screen and (max-width: 1280px) { a.button { font-size: 0.74224em; } } @media screen and (max-width: 1120px) { a.button { font-size: 0.70317em; } } @media screen and (max-width: 960px) { a.button { font-size: 0.66411em; } } @media screen and (max-width: 800px) { a.button { font-size: 0.62504em; } } @media screen and (max-width: 640px) { a.button { font-size: 0.7813em; } } @media screen and (max-width: 480px) { a.button { font-size: 0.62504em; } } a.button:hover { background-color: #309dcd; background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #309dcd), color-stop(100%, #1481bc)); background-image: -webkit-linear-gradient(top, #309dcd, #1481bc); background-image: -moz-linear-gradient(top, #309dcd, #1481bc); background-image: -ms-linear-gradient(top, #309dcd, #1481bc); background-image: -o-linear-gradient(top, #309dcd, #1481bc); background-image: linear-gradient(top, #309dcd, #1481bc); } a.button:active { color: #09457d; background-color: #dedede; background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #dedede), color-stop(50%, #e1e1e1), color-stop(100%, #dedede)); background-image: -webkit-linear-gradient(top, #dedede 0%, #e1e1e1 50%, #dedede 100%); background-image: -moz-linear-gradient(top, #dedede 0%, #e1e1e1 50%, #dedede 100%); background-image: -ms-linear-gradient(top, #dedede 0%, #e1e1e1 50%, #dedede 100%); background-image: -o-linear-gradient(top, #dedede 0%, #e1e1e1 50%, #dedede 100%); background-image: linear-gradient(top, #dedede 0%, #e1e1e1 50%, #dedede 100%); } a.button.disabled { color: #09457d; cursor: default; background-color: #dedede; background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #dedede), color-stop(50%, #e1e1e1), color-stop(100%, #dedede)); background-image: -webkit-linear-gradient(top, #dedede 0%, #e1e1e1 50%, #dedede 100%); background-image: -moz-linear-gradient(top, #dedede 0%, #e1e1e1 50%, #dedede 100%); background-image: -ms-linear-gradient(top, #dedede 0%, #e1e1e1 50%, #dedede 100%); background-image: -o-linear-gradient(top, #dedede 0%, #e1e1e1 50%, #dedede 100%); background-image: linear-gradient(top, #dedede 0%, #e1e1e1 50%, #dedede 100%); } a.button.alternate { background: #e9d33d; color: #09457d; line-height: 1em; padding-top: 15px; padding-bottom: 12px; background-color: #e9d33d; background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #e9d33d), color-stop(50%, #efe455), color-stop(100%, #efe459)); background-image: -webkit-linear-gradient(top, #e9d33d 0%, #efe455 50%, #efe459 100%); background-image: -moz-linear-gradient(top, #e9d33d 0%, #efe455 50%, #efe459 100%); background-image: -ms-linear-gradient(top, #e9d33d 0%, #efe455 50%, #efe459 100%); background-image: -o-linear-gradient(top, #e9d33d 0%, #efe455 50%, #efe459 100%); background-image: linear-gradient(top, #e9d33d 0%, #efe455 50%, #efe459 100%); } @media screen and (min-width: 1281px) { a.button.alternate { font-size: 0.9375em; } } @media screen and (max-width: 1280px) { a.button.alternate { font-size: 0.89063em; } } @media screen and (max-width: 1120px) { a.button.alternate { font-size: 0.84375em; } } @media screen and (max-width: 960px) { a.button.alternate { font-size: 0.79688em; } } @media screen and (max-width: 800px) { a.button.alternate { font-size: 0.75em; } } @media screen and (max-width: 640px) { a.button.alternate { font-size: 0.9375em; } } @media screen and (max-width: 480px) { a.button.alternate { font-size: 0.75em; } } a.button.alternate:hover { background: #f5f463; background-color: #f5f463; background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f5f463), color-stop(50%, #f6f561), color-stop(100%, #f3ec4b)); background-image: -webkit-linear-gradient(top, #f5f463 0%, #f6f561 50%, #f3ec4b 100%); background-image: -moz-linear-gradient(top, #f5f463 0%, #f6f561 50%, #f3ec4b 100%); background-image: -ms-linear-gradient(top, #f5f463 0%, #f6f561 50%, #f3ec4b 100%); background-image: -o-linear-gradient(top, #f5f463 0%, #f6f561 50%, #f3ec4b 100%); background-image: linear-gradient(top, #f5f463 0%, #f6f561 50%, #f3ec4b 100%); } a.button.alternate:active { background: #dedede; background-color: #dedede; background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #dedede), color-stop(50%, #e1e1e1), color-stop(100%, #dedede)); background-image: -webkit-linear-gradient(top, #dedede 0%, #e1e1e1 50%, #dedede 100%); background-image: -moz-linear-gradient(top, #dedede 0%, #e1e1e1 50%, #dedede 100%); background-image: -ms-linear-gradient(top, #dedede 0%, #e1e1e1 50%, #dedede 100%); background-image: -o-linear-gradient(top, #dedede 0%, #e1e1e1 50%, #dedede 100%); background-image: linear-gradient(top, #dedede 0%, #e1e1e1 50%, #dedede 100%); } a.button.gray { color: #085daa; background: #e0e0e0; } a.button.yellow { background: #efe458; /* Old browsers */ background: -moz-linear-gradient(top, #efe458 0%, #f0e657 17%, #eee355 20%, #eee350 43%, #ebdf4a 50%, #eee24c 53%, #ebe046 63%, #ede247 67%, #ece043 77%, #ede044 83%, #ebde41 87%, #edde43 90%, #ecdc41 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #efe458), color-stop(17%, #f0e657), color-stop(20%, #eee355), color-stop(43%, #eee350), color-stop(50%, #ebdf4a), color-stop(53%, #eee24c), color-stop(63%, #ebe046), color-stop(67%, #ede247), color-stop(77%, #ece043), color-stop(83%, #ede044), color-stop(87%, #ebde41), color-stop(90%, #edde43), color-stop(100%, #ecdc41)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #efe458 0%, #f0e657 17%, #eee355 20%, #eee350 43%, #ebdf4a 50%, #eee24c 53%, #ebe046 63%, #ede247 67%, #ece043 77%, #ede044 83%, #ebde41 87%, #edde43 90%, #ecdc41 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #efe458 0%, #f0e657 17%, #eee355 20%, #eee350 43%, #ebdf4a 50%, #eee24c 53%, #ebe046 63%, #ede247 67%, #ece043 77%, #ede044 83%, #ebde41 87%, #edde43 90%, #ecdc41 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #efe458 0%, #f0e657 17%, #eee355 20%, #eee350 43%, #ebdf4a 50%, #eee24c 53%, #ebe046 63%, #ede247 67%, #ece043 77%, #ede044 83%, #ebde41 87%, #edde43 90%, #ecdc41 100%); /* IE10+ */ background: linear, to bottom, #efe458 0%, #f0e657 17%, #eee355 20%, #eee350 43%, #ebdf4a 50%, #eee24c 53%, #ebe046 63%, #ede247 67%, #ece043 77%, #ede044 83%, #ebde41 87%, #edde43 90%, #ecdc41 100%; /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#efe458', endColorstr='#ecdc41',GradientType=0 ); /* IE6-9 */ color: #09457d; } a.button + label { display: inline-block; float: none; } /* link styles */ .progress { height: 16px; position: relative; margin: 29px 0 0 0; } .progress .blue-bar { height: inherit; background: #085daa; width: inherit; position: absolute; top: 0; left: 0; z-index: 1; border-radius: 3px; -webkit-box-shadow: 0px 2px 2px rgba(50, 50, 50, 0.75); -moz-box-shadow: 0px 2px 2px rgba(50, 50, 50, 0.75); box-shadow: 0px 2px 2px rgba(50, 50, 50, 0.75); } .progress .yellow-bar { background: #faec2d; /* Old browsers */ background: -moz-linear-gradient(top, #faec2d 0%, #fbf05c 20%, #fcf376 33%, #fcf484 47%, #fcf483 53%, #fcf37b 60%, #fbf26e 67%, #f9ea18 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #faec2d), color-stop(20%, #fbf05c), color-stop(33%, #fcf376), color-stop(47%, #fcf484), color-stop(53%, #fcf483), color-stop(60%, #fcf37b), color-stop(67%, #fbf26e), color-stop(100%, #f9ea18)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #faec2d 0%, #fbf05c 20%, #fcf376 33%, #fcf484 47%, #fcf483 53%, #fcf37b 60%, #fbf26e 67%, #f9ea18 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #faec2d 0%, #fbf05c 20%, #fcf376 33%, #fcf484 47%, #fcf483 53%, #fcf37b 60%, #fbf26e 67%, #f9ea18 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #faec2d 0%, #fbf05c 20%, #fcf376 33%, #fcf484 47%, #fcf483 53%, #fcf37b 60%, #fbf26e 67%, #f9ea18 100%); /* IE10+ */ background: linear, to bottom, #faec2d 0%, #fbf05c 20%, #fcf376 33%, #fcf484 47%, #fcf483 53%, #fcf37b 60%, #fbf26e 67%, #f9ea18 100%; /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#faec2d', endColorstr='#f9ea18',GradientType=0 ); /* IE6-9 */ height: inherit; width: 65%; position: absolute; top: 0; left: 0; z-index: 2; border-radius: 3px; } /* custom buttons */ .form { margin-top: 90px; } @media screen and (max-width: 768px) { .form { margin-top: 40px; } } @media screen and (max-width: 640px) { .form { margin-top: 10%; } } .form .legend { color: #0097dc; font-size: 16px !important; font-family: "Kievit Bold"; } .form section { background: url("images/backgrounds/blue-divider.png") left top repeat-x; padding-top: 2.125em !important; padding-bottom: 2.375em !important; margin-top: 0.75em !important; } form h2 { margin: 0 0 0.1428em 0; line-height: 1em; font-family: "Kievit black"; text-shadow: 1px 1px 2px #969696; color: #09457d; text-transform: uppercase; } @media screen and (min-width: 1281px) { form h2 { font-size: 2.1875em; } } @media screen and (max-width: 1280px) { form h2 { font-size: 2.07813em; } } @media screen and (max-width: 1120px) { form h2 { font-size: 1.96875em; } } @media screen and (max-width: 960px) { form h2 { font-size: 1.85938em; } } @media screen and (max-width: 800px) { form h2 { font-size: 1.75em; } } @media screen and (max-width: 640px) { form h2 { font-size: 2.1875em; } } @media screen and (max-width: 480px) { form h2 { font-size: 1.75em; } } form p { display: block; color: #09457d; line-height: 1em; font-family: "Kievit Book"; margin: 1.5em 0 0 0; } @media screen and (min-width: 1281px) { form p { font-size: 1em; } } @media screen and (max-width: 1280px) { form p { font-size: 0.95em; } } @media screen and (max-width: 1120px) { form p { font-size: 0.9em; } } @media screen and (max-width: 960px) { form p { font-size: 0.85em; } } @media screen and (max-width: 800px) { form p { font-size: 0.8em; } } @media screen and (max-width: 640px) { form p { font-size: 1em; } } @media screen and (max-width: 480px) { form p { font-size: 0.8em; } } form label { display: block; color: #09457d; font-family: "Kievit Book"; margin: 1.5em 0 0 0; float: left; font-size: 16px !important; position: relative; /* @include respond-to(640) { max-width: 80px; }*/ } form label.required { color: #0097dc; font-family: "Kievit Bold"; } form label.required span { font-family: "Kievit Bold"; } form label.required span.asterisk { color: #0097dc; font-family: "Kievit Bold"; } form label.error { color: #d60000 !important; } form label.faux_validate.error { color: #09457d !important; } form label.faux_validate.error.required { color: #d60000 !important; } form label.required.error span, form .error label.required span { color: #d60000 !important; } form label.standalone { float: none; } form input[type=text], form input[type=password], form input[type="date"], form input[type="email"] { width: 100%; height: 32px; border: 1px solid rgba(0, 151, 220, 0.25); -webkit-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.2); -moz-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.2); box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.2); clear: both; margin: 0.4375em 0 0 0; -webkit-appearance: none; border-radius: 0; padding-left: 0.75em; font-size: 14px; } form input.error { border-color: #d60000; } form input[type="date"] { width: 50%; margin-bottom: 1em; float: left; } form input[type="submit"], form button { border: none; color: #fff; display: inline-block; background-color: #347ab4; background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #347ab4), color-stop(100%, #145ca0)); background-image: -webkit-linear-gradient(top, #347ab4, #145ca0); background-image: -moz-linear-gradient(top, #347ab4, #145ca0); background-image: -ms-linear-gradient(top, #347ab4, #145ca0); background-image: -o-linear-gradient(top, #347ab4, #145ca0); background-image: linear-gradient(top, #347ab4, #145ca0); -webkit-box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.33); -moz-box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.33); box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.33); font-family: "Kievit black"; line-height: 1em; min-width: 112px; padding: 16px 15px 13px 15px; text-align: center; text-decoration: none; text-transform: uppercase; /*&:hover { @include linear-gradient(#309dcd, #1481bc); } &:active { color: $linkColor; @include linear-gradient(#dedede 0%, #e1e1e1 50%, #dedede 100%); }*/ } @media screen and (min-width: 1281px) { form input[type="submit"], form button { font-size: 0.7813em; } } @media screen and (max-width: 1280px) { form input[type="submit"], form button { font-size: 0.74224em; } } @media screen and (max-width: 1120px) { form input[type="submit"], form button { font-size: 0.70317em; } } @media screen and (max-width: 960px) { form input[type="submit"], form button { font-size: 0.66411em; } } @media screen and (max-width: 800px) { form input[type="submit"], form button { font-size: 0.62504em; } } @media screen and (max-width: 640px) { form input[type="submit"], form button { font-size: 0.7813em; } } @media screen and (max-width: 480px) { form input[type="submit"], form button { font-size: 0.62504em; } } form input[type="submit"], form button.disabled { background-color: #5a83a5; background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #5a83a5), color-stop(100%, #355b7e)); background-image: -webkit-linear-gradient(top, #5a83a5, #355b7e); background-image: -moz-linear-gradient(top, #5a83a5, #355b7e); background-image: -ms-linear-gradient(top, #5a83a5, #355b7e); background-image: -o-linear-gradient(top, #5a83a5, #355b7e); background-image: linear-gradient(top, #5a83a5, #355b7e); } form .error + input[type=text], form .error + input[type=password], form .error + input[type=email], form .error + textarea, form .error + select + .custom.dropdown .outside, form .error + span input[type=text] { border: 1px solid #d60000; } form .error.faux_validate + input[type=text], form .error.faux_validate + input[type=password], form .error.faux_validate + input[type=email], form .error.faux_validate + textarea, form .error.faux_validate + select + .custom.dropdown .outside, form .error.faux_validate + span select + .custom.dropdown .outside, form .error.faux_validate + span input[type=text] { border: 1px solid rgba(0, 151, 220, 0.25); } form .error.faux_validate.required + input[type=text], form .error.faux_validate.required + input[type=password], form .error.faux_validate.required + input[type=email], form .error.faux_validate.required + textarea, form .error.faux_validate.required + select + .custom.dropdown .outside, form .error.faux_validate + span select + .custom.dropdown .outside, form .error.faux_validate.required + span input[type=text] { border: 1px solid #d60000; } form .form_group_fields.error label { color: #d60000 !important; } form .form_group_fields.error label.faux_validate { color: #09457d !important; } form .form_group_fields.error label.faux_validate.required { color: #d60000 !important; } form .form_group_fields.error input[type=text], form .form_group_fields.error input[type=password], form .form_group_fields.error input[type=email], form .form_group_fields.error textarea, form .form_group_fields.error .custom.dropdown .outside, form .form_group_fields.error label.faux_validate.required + .row span input[type=text], form .form_group_fields.error label.faux_validate.required + .row input[type=password], form .form_group_fields.error label.faux_validate.required + .row input[type=email], form .form_group_fields.error label.faux_validate.required + .row textarea, form .form_group_fields.error .custom.dropdown.required .outside { border: 1px solid #d60000; } form .form_group_fields.error label.faux_validate + .row input[type=text], form .form_group_fields.error label.faux_validate + .row input[type=password], form .form_group_fields.error label.faux_validate + .row input[type=email], form .form_group_fields.error label.faux_validate + .row textarea, form .form_group_fields.error .custom.dropdown .outside { border: 1px solid rgba(0, 151, 220, 0.25); } form textarea { width: 100%; min-height: 160px; border: 1px solid rgba(0, 151, 220, 0.25); -webkit-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.2); -moz-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.2); box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.2); clear: both; margin: 0.4375em 0 0 0; } form .button { margin: 1.375em 0 0 0; } form .button-input input { float: left; width: 80%; clear: none; margin: 0; } form .button-input .button { float: left; width: 20%; margin: 0; min-width: 0; clear: none; padding: 10px 5px 8px 5px; font-size: 14px; font-family: "Kievit Book"; } form .hidden-field { display: none; } form .file-list { padding: 7px 0 0 0; margin: 0; list-style: none; clear: both; } form .file-list li { margin: 0; padding: 0; color: #0097dc; font-family: "Kievit Book"; } form .file-list li .filename { float: left; background: url("images/sprites/form.png") 0 -50px no-repeat; padding: 2px 0 0 20px; height: 20px; } form .file-list li .remove { float: right; padding: 4px 0 0 24px; min-height: 20px; background: url("images/sprites/form.png") 0 -70px no-repeat; cursor: pointer; } form .custom.file { clear: both; margin: 0.6em 0 1em 0; float: left; cursor: pointer; width: 100%; position: relative; } form .custom.file .outside .input-area { background: #fff; border-top: 1px solid rgba(0, 151, 220, 0.25); border-bottom: 1px solid rgba(0, 151, 220, 0.25); border-left: 1px solid rgba(0, 151, 220, 0.25); height: 35px; float: left; text-decoration: none; color: #404040; width: 70%; } form .custom.file .outside .browse { -webkit-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.2); -moz-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.2); box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.2); background-color: #347ab4; background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #347ab4), color-stop(100%, #145ca0)); background-image: -webkit-linear-gradient(top, #347ab4, #145ca0); background-image: -moz-linear-gradient(top, #347ab4, #145ca0); background-image: -ms-linear-gradient(top, #347ab4, #145ca0); background-image: -o-linear-gradient(top, #347ab4, #145ca0); background-image: linear-gradient(top, #347ab4, #145ca0); float: left; width: 30%; padding: 10px 0; text-align: center; color: #fff; font-size: 14px !important; font-family: "Kievit Book"; text-transform: uppercase; } form .custom.file input { position: absolute; width: 100%; height: 35px; opacity: 0; filter: alpha(opacity=0); } form .checkbox { width: 22px; height: 22px; background: url("images/sprites/form.png") 0 -25px no-repeat; cursor: pointer; display: block; float: left; margin: 1.1em 0.375em 1em 0; } form .checkbox.checked { background-position: -22px -25px; } form .checkbox + label, form .radio + label { line-height: 1em; font-size: 14px !important; width: 70%; } @media screen and (min-width: 1281px) { form .checkbox + label, form .radio + label { font-size: 0.875em; } } @media screen and (max-width: 1280px) { form .checkbox + label, form .radio + label { font-size: 0.83125em; } } @media screen and (max-width: 1120px) { form .checkbox + label, form .radio + label { font-size: 0.7875em; } } @media screen and (max-width: 960px) { form .checkbox + label, form .radio + label { font-size: 0.74375em; } } @media screen and (max-width: 800px) { form .checkbox + label, form .radio + label { font-size: 0.7em; } } @media screen and (max-width: 640px) { form .checkbox + label, form .radio + label { font-size: 0.875em; } } @media screen and (max-width: 480px) { form .checkbox + label, form .radio + label { font-size: 0.7em; } } @media screen and (max-width: 640px) { form .checkbox + label, form .radio + label { width: auto; } } form .checkbox.checked + label, form .radio.checked + label { font-family: "Kievit Medium"; } form .radio { width: 23px; height: 25px; background: url("images/sprites/form.png") 0 0 no-repeat; cursor: pointer; display: block; float: left; margin: 0.9em 0.375em 1em 0; } form .radio.checked { background-position: -23px 0; } form .button { float: left; clear: left; margin-right: 15px; } form .button + a[class~=in-text], form .button + a[class~=carrot], form .button + a[class~=primary] { font-family: "Kievit Book"; line-height: 1em; display: block; float: left; margin: 1.375em 0 0 0; padding: 16px 15px 13px 0; } @media screen and (min-width: 1281px) { form .button + a[class~=in-text], form .button + a[class~=carrot], form .button + a[class~=primary] { font-size: 0.7813em; } } @media screen and (max-width: 1280px) { form .button + a[class~=in-text], form .button + a[class~=carrot], form .button + a[class~=primary] { font-size: 0.74224em; } } @media screen and (max-width: 1120px) { form .button + a[class~=in-text], form .button + a[class~=carrot], form .button + a[class~=primary] { font-size: 0.70317em; } } @media screen and (max-width: 960px) { form .button + a[class~=in-text], form .button + a[class~=carrot], form .button + a[class~=primary] { font-size: 0.66411em; } } @media screen and (max-width: 800px) { form .button + a[class~=in-text], form .button + a[class~=carrot], form .button + a[class~=primary] { font-size: 0.62504em; } } @media screen and (max-width: 640px) { form .button + a[class~=in-text], form .button + a[class~=carrot], form .button + a[class~=primary] { font-size: 0.7813em; } } @media screen and (max-width: 480px) { form .button + a[class~=in-text], form .button + a[class~=carrot], form .button + a[class~=primary] { font-size: 0.62504em; } } form p { clear: both; padding: 1.5em 0 0 0; margin: 0; } form .faux_validate + .invisible input, form .faux_validate + .row .invisible input { color: #fff; } .custom.dropdown, .fake.dropdown { position: relative; clear: both; margin: 0.4375em 0 0 0; float: left; cursor: pointer; width: 100%; font-size: 14px !important; font-family: "Kievit Book"; background-color: #347ab4; background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #347ab4), color-stop(100%, #145ca0)); background-image: -webkit-linear-gradient(top, #347ab4, #145ca0); background-image: -moz-linear-gradient(top, #347ab4, #145ca0); background-image: -ms-linear-gradient(top, #347ab4, #145ca0); background-image: -o-linear-gradient(top, #347ab4, #145ca0); background-image: linear-gradient(top, #347ab4, #145ca0); } .custom.dropdown .outside, .fake.dropdown .outside { -webkit-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.2); -moz-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.2); box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.2); background: url("images/icons/arrow.select-down.png") right center no-repeat; padding-right: 36px; float: left; width: 100%; overflow: hidden; } .custom.dropdown .outside .current, .fake.dropdown .outside .current { background: #fff; border-top: 1px solid rgba(0, 151, 220, 0.25); border-bottom: 1px solid rgba(0, 151, 220, 0.25); border-left: 1px solid rgba(0, 151, 220, 0.25); padding: 9px 11px 7px 11px; float: left; text-decoration: none; color: #404040; width: 100%; display: block; } .custom.dropdown ul, .fake.dropdown ul { display: none; } .custom.dropdown.open, .fake.dropdown.open { background-color: #145ca0; background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #145ca0), color-stop(100%, #347ab4)); background-image: -webkit-linear-gradient(top, #145ca0, #347ab4); background-image: -moz-linear-gradient(top, #145ca0, #347ab4); background-image: -ms-linear-gradient(top, #145ca0, #347ab4); background-image: -o-linear-gradient(top, #145ca0, #347ab4); background-image: linear-gradient(top, #145ca0, #347ab4); } .custom.dropdown.open .outside, .fake.dropdown.open .outside { background: url("images/icons/arrow.select-up.png") right center no-repeat; } .custom.dropdown.open ul, .fake.dropdown.open ul { display: block; background: #e0e0e0; color: #09457d; position: absolute; clear: both; left: 0; top: 100%; padding: 0; width: 100%; z-index: 10; max-height: 300px; overflow-y: scroll; overflow-x: hidden; -webkit-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.2); -moz-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.2); box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.2); } .custom.dropdown.open ul li, .fake.dropdown.open ul li { list-style: none; border-top: 1px solid #a7bed0; border-bottom: 1px solid #fff; background: none; margin: 0; padding: 0; } .custom.dropdown.open ul li a, .fake.dropdown.open ul li a { padding: 9px 11px 7px 11px; display: block; } .custom.dropdown.open ul li a:hover, .fake.dropdown.open ul li a:hover { text-decoration: none; color: #0097dc; } .custom.dropdown.open ul li:last-child, .fake.dropdown.open ul li:last-child { border-bottom: none; } .custom.dropdown.open ul li:hover, .custom.dropdown.open ul li.selected, .fake.dropdown.open ul li:hover, .fake.dropdown.open ul li.selected { background: #f7f7f7; cursor: pointer; } .custom.dropdown.bold ul li, .fake.dropdown.bold ul li { color: #09457d; text-transform: uppercase; line-height: 1em; font-family: "Kievit black"; padding: 15px 11px 11px 11px; } @media screen and (min-width: 1281px) { .custom.dropdown.bold ul li, .fake.dropdown.bold ul li { font-size: 0.9375em; } } @media screen and (max-width: 1280px) { .custom.dropdown.bold ul li, .fake.dropdown.bold ul li { font-size: 0.89063em; } } @media screen and (max-width: 1120px) { .custom.dropdown.bold ul li, .fake.dropdown.bold ul li { font-size: 0.84375em; } } @media screen and (max-width: 960px) { .custom.dropdown.bold ul li, .fake.dropdown.bold ul li { font-size: 0.79688em; } } @media screen and (max-width: 800px) { .custom.dropdown.bold ul li, .fake.dropdown.bold ul li { font-size: 0.75em; } } @media screen and (max-width: 640px) { .custom.dropdown.bold ul li, .fake.dropdown.bold ul li { font-size: 0.9375em; } } @media screen and (max-width: 480px) { .custom.dropdown.bold ul li, .fake.dropdown.bold ul li { font-size: 0.75em; } } .custom.dropdown.open ul li { padding: 9px 11px 7px 11px; } .custom.dropdown.blue, .fake.dropdown.blue { position: relative; font-size: 14px !important; font-family: "Kievit black"; text-transform: uppercase; text-align: center; -webkit-box-shadow: 1px 2px 3px rgba(0, 0, 0, 0.33); -moz-box-shadow: 1px 2px 3px rgba(0, 0, 0, 0.33); box-shadow: 1px 2px 3px rgba(0, 0, 0, 0.33); } .custom.dropdown.blue .outside, .fake.dropdown.blue .outside { padding: 0 34px 0 20px; cursor: pointer; } .custom.dropdown.blue .outside .current, .fake.dropdown.blue .outside .current { color: #fff; text-decoration: none; padding: 15px 15px 11px 0; margin: 0 auto; border: none; display: block; background: transparent; position: relative; float: left; border-right: 1px solid #769ec9; } .custom.dropdown.blue .outside .selector, .fake.dropdown.blue .outside .selector { display: none; } .custom.dropdown.blue ul, .fake.dropdown.blue ul { display: none; } .custom.dropdown.blue.open .outside, .fake.dropdown.blue.open .outside { background-color: #30618d; background: url("images/icons/arrow.select-up.png"), -webkit-linear-gradient(#30618d, #174b7e); background: url("images/icons/arrow.select-up.png"), -moz-linear-gradient(#30618d, #174b7e); background: url("images/icons/arrow.select-up.png"), -ms-linear-gradient(#30618d, #174b7e); background: url("images/icons/arrow.select-up.png"), -o-linear-gradient(#30618d, #174b7e); background: url("images/icons/arrow.select-up.png"), linear-gradient(#30618d, #174b7e); background-repeat: no-repeat; background-position: right center; } .custom.dropdown.blue.open ul, .fake.dropdown.blue.open ul { display: block; background: #e0e0e0; color: #09457d; position: absolute; clear: both; left: 0; padding: 0; width: 100%; } .custom.dropdown.blue.open ul li, .fake.dropdown.blue.open ul li { list-style: none; border-top: 1px solid #a7bed0; border-bottom: 1px solid #fff; background: none; margin: 0; padding: 0; } .custom.dropdown.blue.open ul li a, .fake.dropdown.blue.open ul li a { padding: 13px 26px; display: block; } .custom.dropdown.blue.open ul li a:hover, .fake.dropdown.blue.open ul li a:hover { text-decoration: none; color: #0097dc; } .custom.dropdown.blue.open ul li:hover, .fake.dropdown.blue.open ul li:hover { background: #f7f7f7; cursor: pointer; } .custom.dropdown.blue.open ul li { padding: 13px 26px; } .fake-select { position: relative; font-family: "Kievit Bold"; } .fake-select > a { display: block; color: #fff; text-transform: uppercase; font-size: 18px; width: 100%; padding: 1em 76px 1em 23px; background: url("images/backgrounds/available.png") right center no-repeat; } @media screen and (max-width: 1250px) { .fake-select > a { font-size: 14px; padding-top: 18px; } } @media screen and (max-width: 1050px) { .fake-select > a { font-size: 12px; padding-top: 19px; } } @media screen and (max-width: 950px) { .fake-select > a { padding-top: 13px; } } @media screen and (max-width: 640px) { .fake-select > a { padding-top: 21px; } } .fake-select ul { background-color: #d8d8d8; background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #d8d8d8), color-stop(100%, #e9e9e9)); background-image: -webkit-linear-gradient(top, #d8d8d8, #e9e9e9); background-image: -moz-linear-gradient(top, #d8d8d8, #e9e9e9); background-image: -ms-linear-gradient(top, #d8d8d8, #e9e9e9); background-image: -o-linear-gradient(top, #d8d8d8, #e9e9e9); background-image: linear-gradient(top, #d8d8d8, #e9e9e9); -webkit-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.19); -moz-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.19); box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.19); padding: 7px 0 18px 0; margin: 0; display: none; position: absolute; width: 100%; z-index: 10; } .fake-select ul li { padding: 12px 18px 0 18px !important; border: none !important; margin: 0; background: none; } .fake-select ul li a { color: #0097dc; line-height: 1em; } @media screen and (min-width: 1281px) { .fake-select ul li a { font-size: 0.9375em; } } @media screen and (max-width: 1280px) { .fake-select ul li a { font-size: 0.89063em; } } @media screen and (max-width: 1120px) { .fake-select ul li a { font-size: 0.84375em; } } @media screen and (max-width: 960px) { .fake-select ul li a { font-size: 0.79688em; } } @media screen and (max-width: 800px) { .fake-select ul li a { font-size: 0.75em; } } @media screen and (max-width: 640px) { .fake-select ul li a { font-size: 0.9375em; } } @media screen and (max-width: 480px) { .fake-select ul li a { font-size: 0.75em; } } @media screen and (max-width: 1150px) { .fake-select ul li a { font-size: 14px; } } .fake-select ul li a:hover { text-decoration: underline; } .fake-select.open ul { display: block; } .tooltip { background: url("images/icons/tooltip.png") no-repeat; width: 17px; height: 17px; cursor: pointer; position: absolute; vertical-align: -1px; top: -5px; right: -20px; } .lt-ie9 form .custom.file .outside .input-area, .no-multiplebgs form .custom.file .outside .input-area { border-top: 1px solid #0097dc; border-bottom: 1px solid #0097dc; border-left: 1px solid #0097dc; height: 34px; } .lt-ie9 form .custom.dropdown .outside, .no-multiplebgs form .custom.dropdown .outside { background: #145ca0 url("images/icons/arrow.select-down.png") right center no-repeat; } .lt-ie9 form .custom.dropdown .outside .current, .no-multiplebgs form .custom.dropdown .outside .current { border-top: 1px solid #0097dc; border-bottom: 1px solid #0097dc; border-left: 1px solid #0097dc; } .lt-ie9 form .custom.dropdown.blue .outside .current, .no-multiplebgs form .custom.dropdown.blue .outside .current { border: none; } .lt-ie9 form input[type=text], .lt-ie9 form input[type=password], .lt-ie9 form input[type=email], .no-multiplebgs form input[type=text], .no-multiplebgs form input[type=password], .no-multiplebgs form input[type=email] { padding-top: 6px; } #phone-wrapper { width: 100%; height: 32px; border: 1px solid rgba(0, 151, 220, 0.25); -webkit-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.2); -moz-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.2); box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.2); clear: both; margin: 0.4375em 0 0 0; -webkit-appearance: none; border-radius: 0; padding-left: 0.75em; font-size: 14px; background: url("../images/contact-us/phone.png") no-repeat white; } #phone-wrapper.phone-error { border: 1px solid #d60000; } #phone-wrapper input { width: 31px; float: left; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; clear: none; margin: 0 0 0 12px; padding: 0; border: none; height: 30px; background: none; } #phone-wrapper input:last-child { width: 40px; margin: 0 0 0 12px; } #phone-wrapper input:focus { outline: 0; } .suggestion-wrapper input[type='text'] { font-size: 18px !important; } /* custom form elements */ p { color: #404040; line-height: 1.3125em; font-family: "Kievit Medium"; margin: 1em 0 0 0; } @media screen and (min-width: 1281px) { p { font-size: 1em; } } @media screen and (max-width: 1280px) { p { font-size: 0.95em; } } @media screen and (max-width: 1120px) { p { font-size: 0.9em; } } @media screen and (max-width: 960px) { p { font-size: 0.85em; } } @media screen and (max-width: 800px) { p { font-size: 0.8em; } } @media screen and (max-width: 640px) { p { font-size: 1em; } } @media screen and (max-width: 480px) { p { font-size: 0.8em; } } p.lead { font-family: "Kievit Book"; line-height: 1.4em; } @media screen and (min-width: 1281px) { p.lead { font-size: 1.25em; } } @media screen and (max-width: 1280px) { p.lead { font-size: 1.1875em; } } @media screen and (max-width: 1120px) { p.lead { font-size: 1.125em; } } @media screen and (max-width: 960px) { p.lead { font-size: 1.0625em; } } @media screen and (max-width: 800px) { p.lead { font-size: 1em; } } @media screen and (max-width: 640px) { p.lead { font-size: 1.25em; } } @media screen and (max-width: 480px) { p.lead { font-size: 1em; } } sup { top: -0.4em; font-size: 66%; } ul { margin: 0; padding: 0; list-style: none; } ul li { background: url("images/icons/bullet.png") 0 4px no-repeat; margin: 14px 0 0 0; padding: 0 0 0 17px; color: #636363; font-family: "Kievit Book"; line-height: 1.1875em; } @media screen and (min-width: 1281px) { ul li { font-size: 1em; } } @media screen and (max-width: 1280px) { ul li { font-size: 0.95em; } } @media screen and (max-width: 1120px) { ul li { font-size: 0.9em; } } @media screen and (max-width: 960px) { ul li { font-size: 0.85em; } } @media screen and (max-width: 800px) { ul li { font-size: 0.8em; } } @media screen and (max-width: 640px) { ul li { font-size: 1em; } } @media screen and (max-width: 480px) { ul li { font-size: 0.8em; } } ol { list-style-type: none; margin-left: 0; padding: 0; } ol > li { counter-increment: customlistcounter; margin: 14px 0 0 0; color: #636363; font-family: "Kievit Book"; line-height: 1.0625em; clear: right; } @media screen and (min-width: 1281px) { ol > li { font-size: 1em; } } @media screen and (max-width: 1280px) { ol > li { font-size: 0.95em; } } @media screen and (max-width: 1120px) { ol > li { font-size: 0.9em; } } @media screen and (max-width: 960px) { ol > li { font-size: 0.85em; } } @media screen and (max-width: 800px) { ol > li { font-size: 0.8em; } } @media screen and (max-width: 640px) { ol > li { font-size: 1em; } } @media screen and (max-width: 480px) { ol > li { font-size: 0.8em; } } ol > li:before { content: counter(customlistcounter) ". "; font-family: "Kievit Bold"; line-height: 1.0625em; width: 20px; color: #363636; float: left; } @media screen and (min-width: 1281px) { ol > li:before { font-size: 1em; } } @media screen and (max-width: 1280px) { ol > li:before { font-size: 0.95em; } } @media screen and (max-width: 1120px) { ol > li:before { font-size: 0.9em; } } @media screen and (max-width: 960px) { ol > li:before { font-size: 0.85em; } } @media screen and (max-width: 800px) { ol > li:before { font-size: 0.8em; } } @media screen and (max-width: 640px) { ol > li:before { font-size: 1em; } } @media screen and (max-width: 480px) { ol > li:before { font-size: 0.8em; } } ol:first-child { counter-reset: customlistcounter; } table { margin: 3.125em 0 0 0; -webkit-box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.33); -moz-box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.33); box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.33); background: #fff; } table thead tr td, table thead tr th { background: #0097dc; color: #fff; font-family: "Kievit Bold"; line-height: 1.05em; text-transform: uppercase; padding: 19px 21px; border-left: rgba(9, 69, 125, 0.2) solid 1px; } @media screen and (min-width: 1281px) { table thead tr td, table thead tr th { font-size: 1.125em; } } @media screen and (max-width: 1280px) { table thead tr td, table thead tr th { font-size: 1.06875em; } } @media screen and (max-width: 1120px) { table thead tr td, table thead tr th { font-size: 1.0125em; } } @media screen and (max-width: 960px) { table thead tr td, table thead tr th { font-size: 0.95625em; } } @media screen and (max-width: 800px) { table thead tr td, table thead tr th { font-size: 0.9em; } } @media screen and (max-width: 640px) { table thead tr td, table thead tr th { font-size: 1.125em; } } @media screen and (max-width: 480px) { table thead tr td, table thead tr th { font-size: 0.9em; } } table thead tr td:first-child, table thead tr th:first-child { border-left-color: gray; } table tbody tr td { color: #636363; font-family: "Kievit Medium"; font-weight: normal; line-height: 1em; text-transform: uppercase; padding: 16px 21px; border-left: rgba(9, 69, 125, 0.2) solid 1px; } @media screen and (min-width: 1281px) { table tbody tr td { font-size: 0.875em; } } @media screen and (max-width: 1280px) { table tbody tr td { font-size: 0.83125em; } } @media screen and (max-width: 1120px) { table tbody tr td { font-size: 0.7875em; } } @media screen and (max-width: 960px) { table tbody tr td { font-size: 0.74375em; } } @media screen and (max-width: 800px) { table tbody tr td { font-size: 0.7em; } } @media screen and (max-width: 640px) { table tbody tr td { font-size: 0.875em; } } @media screen and (max-width: 480px) { table tbody tr td { font-size: 0.7em; } } table tbody tr td:first-child { border-left-color: gray; } table tbody tr:nth-child(even) { background: rgba(230, 236, 239, 0.7); } .dropdown-table { display: inline-block; width: 100%; min-width: 274px; margin: 1.75em 0 0.25em 0; -webkit-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.5); -moz-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.5); box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.5); border: 1px solid #c2c2c2; } @media screen and (max-width: 640px) { .dropdown-table { margin: 18px 0 0 0; } } .dropdown-table.closed .title { background: #0097dc url("images/icons/arrow.nutritionfacts.down.png") right center no-repeat; } .dropdown-table .title { color: #fff; line-height: 1.05556em; font-family: "Kievit black"; padding: 20px 62px 16px 23px; background: #0097dc url("images/icons/arrow.nutritionfacts.up.png") right center no-repeat; text-transform: uppercase; border-right: 23px solid #0097dc; cursor: pointer; } @media screen and (min-width: 1281px) { .dropdown-table .title { font-size: 1.125em; } } @media screen and (max-width: 1280px) { .dropdown-table .title { font-size: 1.06875em; } } @media screen and (max-width: 1120px) { .dropdown-table .title { font-size: 1.0125em; } } @media screen and (max-width: 960px) { .dropdown-table .title { font-size: 0.95625em; } } @media screen and (max-width: 800px) { .dropdown-table .title { font-size: 0.9em; } } @media screen and (max-width: 640px) { .dropdown-table .title { font-size: 1.125em; } } @media screen and (max-width: 480px) { .dropdown-table .title { font-size: 0.9em; } } .dropdown-table.closed table { display: none; } .dropdown-table table { width: 100% !important; margin: 0; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; } .dropdown-table table tr.highlight { border: solid 3px #0097dc; position: relative; } .dropdown-table table tr.highlight span { position: absolute; display: block; width: 100%; text-align: center; color: #0097dc; left: 0; z-index: 10; line-height: 1em; font-family: "Kievit Medium"; } @media screen and (min-width: 1281px) { .dropdown-table table tr.highlight span { font-size: 1em; } } @media screen and (max-width: 1280px) { .dropdown-table table tr.highlight span { font-size: 0.95em; } } @media screen and (max-width: 1120px) { .dropdown-table table tr.highlight span { font-size: 0.9em; } } @media screen and (max-width: 960px) { .dropdown-table table tr.highlight span { font-size: 0.85em; } } @media screen and (max-width: 800px) { .dropdown-table table tr.highlight span { font-size: 0.8em; } } @media screen and (max-width: 640px) { .dropdown-table table tr.highlight span { font-size: 1em; } } @media screen and (max-width: 480px) { .dropdown-table table tr.highlight span { font-size: 0.8em; } } .dropdown-table table tr td:first-child { border-bottom: 1px solid gray !important; } .dropdown-table table tr:last-child td:first-child { border-bottom: none !important; } .dropdown-table table tr td strong { font-family: "Kievit Medium"; line-height: 1em; text-transform: uppercase; } @media screen and (min-width: 1281px) { .dropdown-table table tr td strong { font-size: 1.125em; } } @media screen and (max-width: 1280px) { .dropdown-table table tr td strong { font-size: 1.06875em; } } @media screen and (max-width: 1120px) { .dropdown-table table tr td strong { font-size: 1.0125em; } } @media screen and (max-width: 960px) { .dropdown-table table tr td strong { font-size: 0.95625em; } } @media screen and (max-width: 800px) { .dropdown-table table tr td strong { font-size: 0.9em; } } @media screen and (max-width: 640px) { .dropdown-table table tr td strong { font-size: 1.125em; } } @media screen and (max-width: 480px) { .dropdown-table table tr td strong { font-size: 0.9em; } } .dropdown-table table.four td { width: 25%; } .dropdown-table table.two td { width: 50%; } .dropdown-table table tr td { text-align: center; text-transform: none; } .lt-ie9 .dropdown-table td { border-left: 1px solid #e1e1e1; } .lt-ie9 .dropdown-table td:first-child { border: none; } .lt-ie9 .dropdown-table tr { border-top: 1px solid #e1e1e1; } .lt-ie9 .dropdown-table tr:first-child { border: none; } .overlay_background { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 11; background: rgba(0, 0, 0, 0.6); } .overlay { position: absolute; z-index: 12; background: #fff; padding: 40px; -moz-border-radius: 15px; border-radius: 15px; -webkit-box-shadow: 3px 3px 0px rgba(0, 0, 0, 0.17); -moz-box-shadow: 3px 3px 0px rgba(0, 0, 0, 0.17); box-shadow: 3px 3px 0px rgba(0, 0, 0, 0.17); } header { position: absolute; left: 0; top: 0; z-index: 10; width: 100%; } @media screen and (max-width: 640px) { header { position: static; left: auto; top: auto; } } /* header gradient */ header .header-background { background: url(images/backgrounds/header.png) 0 48px repeat-x; min-height: 198px; } header .header-background .row { position: relative; } header .header-background .row .columns { margin-left: 0; margin-right: 0; padding-left: 0; padding-right: 0; } @media screen and (max-width: 640px) { header .header-background { background: none; position: static; min-height: 0; } header .header-background > .row:last-child { padding: 0; } } header .header-utility-bar { background: #09457d; height: 48px; } @media screen and (max-width: 640px) { header .header-utility-bar { height: 83px; } header .header-utility-bar .row { padding: 0 5%; } } @media screen and (max-width: 480px) { header .header-utility-bar { height: 77px; } } header .header-utility-bar ul { line-height: 3em; padding-top: 0; } @media screen and (max-width: 940px) { header .header-utility-bar ul { line-height: 0.75em; padding-top: 0.375em; } } header .header-utility-bar ul li { font-size: 1em; padding-right: 1em; background: none; } @media screen and (max-width: 940px) { header .header-utility-bar ul li { padding-right: 1.8em; } header .header-utility-bar ul li:nth-child(2) { padding-right: 10em; } } @media screen and (max-width: 780px) { header .header-utility-bar ul li:nth-child(2) { padding-right: 7em; } } @media screen and (max-width: 700px) { header .header-utility-bar ul li { padding-right: 1em; } header .header-utility-bar ul li:nth-child(2) { padding-right: 5em; } } header .header-utility-bar ul li:last-child { padding-right: 0 !important; } header .header-utility-bar ul li a { color: white; font-family: "Kievit Medium"; line-height: 1em; text-decoration: none; text-transform: uppercase; white-space: nowrap; } @media screen and (min-width: 1281px) { header .header-utility-bar ul li a { font-size: 0.8125em; } } @media screen and (max-width: 1280px) { header .header-utility-bar ul li a { font-size: 0.77188em; } } @media screen and (max-width: 1120px) { header .header-utility-bar ul li a { font-size: 0.73125em; } } @media screen and (max-width: 960px) { header .header-utility-bar ul li a { font-size: 0.69063em; } } @media screen and (max-width: 800px) { header .header-utility-bar ul li a { font-size: 0.65em; } } @media screen and (max-width: 640px) { header .header-utility-bar ul li a { font-size: 0.8125em; } } @media screen and (max-width: 480px) { header .header-utility-bar ul li a { font-size: 0.65em; } } header .header-utility-bar ul li a:hover { text-decoration: underline; } header .header-utility-bar ul li a:active { color: #9b9b9b; } header .header-utility-bar nav { text-align: left; } header .header-utility-bar #butterball-it-search-logo { position: absolute; right: 145px; top: -3px; width: 140px; display: block; } header .header-utility-bar #butterball-it-search-logo-mobile { display: none; position: absolute; left: -6%; top: 0px; } @media screen and (max-width: 480px) { header .header-utility-bar #butterball-it-search-logo-mobile { width: 210px; top: -1px; } } @media screen and (max-width: 400px) { header .header-utility-bar #butterball-it-search-logo-mobile { width: 185px; top: 3px; } } header .header-utility-bar.mobileStateActive #butterball-it-search-logo, header .header-utility-bar.mobileStateActive #desktop-search-button, header .header-utility-bar #mobile-search-button { display: none; } header .header-utility-bar.mobileStateActive #butterball-it-search-logo-mobile, header .header-utility-bar #desktop-search-button, header .header-utility-bar.mobileStateActive #desktop-search-button { display: block; } header .header-utility-bar #search-and-profile { line-height: 3em; text-align: right; } header .header-utility-bar #search-and-profile form { float: right; margin-top: -2px; } header .header-utility-bar #search-and-profile form input[type="image"] { display: none; } header .header-utility-bar #search-and-profile form input[type="text"] { border: none; color: #0962a7; font-family: "Kievit Light"; font-weight: bold; line-height: 1em; padding: 9px 0.5em 7px; text-transform: uppercase; width: 144px; } @media screen and (min-width: 1281px) { header .header-utility-bar #search-and-profile form input[type="text"] { font-size: 0.6875em; } } @media screen and (max-width: 1280px) { header .header-utility-bar #search-and-profile form input[type="text"] { font-size: 0.65312em; } } @media screen and (max-width: 1120px) { header .header-utility-bar #search-and-profile form input[type="text"] { font-size: 0.61875em; } } @media screen and (max-width: 960px) { header .header-utility-bar #search-and-profile form input[type="text"] { font-size: 0.58438em; } } @media screen and (max-width: 800px) { header .header-utility-bar #search-and-profile form input[type="text"] { font-size: 0.55em; } } @media screen and (max-width: 640px) { header .header-utility-bar #search-and-profile form input[type="text"] { font-size: 0.6875em; } } @media screen and (max-width: 480px) { header .header-utility-bar #search-and-profile form input[type="text"] { font-size: 0.55em; } } header .header-utility-bar #search-and-profile span { float: right; padding-right: 1.25em; } @media screen and (max-width: 900px) { header .header-utility-bar #search-and-profile span { margin-left: -3em; } } @media screen and (max-width: 720px) { header .header-utility-bar #search-and-profile span { position: relative; top: -10px; } } header .header-utility-bar #search-and-profile span a { color: white; font-family: "Kievit Medium"; line-height: 1em; text-decoration: none; text-transform: uppercase; } @media screen and (min-width: 1281px) { header .header-utility-bar #search-and-profile span a { font-size: 0.8125em; } } @media screen and (max-width: 1280px) { header .header-utility-bar #search-and-profile span a { font-size: 0.77188em; } } @media screen and (max-width: 1120px) { header .header-utility-bar #search-and-profile span a { font-size: 0.73125em; } } @media screen and (max-width: 960px) { header .header-utility-bar #search-and-profile span a { font-size: 0.69063em; } } @media screen and (max-width: 800px) { header .header-utility-bar #search-and-profile span a { font-size: 0.65em; } } @media screen and (max-width: 640px) { header .header-utility-bar #search-and-profile span a { font-size: 0.8125em; } } @media screen and (max-width: 480px) { header .header-utility-bar #search-and-profile span a { font-size: 0.65em; } } header .header-utility-bar #search-and-profile span a:hover { text-decoration: underline; } header .header-utility-bar #search-and-profile span a:active { color: #9b9b9b; } header .header-utility-bar #search-and-profile span a + a { display: inline-block; margin-left: 1em; } @media screen and (max-width: 720px) { header .header-utility-bar #search-and-profile span a + a { display: block; position: relative; top: -8px; } } header .header-utility-bar #header-mobile-nav ul { float: right; } header .header-utility-bar #header-mobile-nav li { float: left; padding-left: 8px; padding-right: 0; padding-top: 11px; margin: 0; width: 64px; background: none; } @media screen and (max-width: 480px) { header .header-utility-bar #header-mobile-nav li { padding-left: 0; width: 56px; } } header .header-utility-bar #header-mobile-nav li a { font-family: "Kievit Bold"; line-height: 1em; text-decoration: none !important; } @media screen and (min-width: 1281px) { header .header-utility-bar #header-mobile-nav li a { font-size: 0.9375em; } } @media screen and (max-width: 1280px) { header .header-utility-bar #header-mobile-nav li a { font-size: 0.89063em; } } @media screen and (max-width: 1120px) { header .header-utility-bar #header-mobile-nav li a { font-size: 0.84375em; } } @media screen and (max-width: 960px) { header .header-utility-bar #header-mobile-nav li a { font-size: 0.79688em; } } @media screen and (max-width: 800px) { header .header-utility-bar #header-mobile-nav li a { font-size: 0.75em; } } @media screen and (max-width: 640px) { header .header-utility-bar #header-mobile-nav li a { font-size: 0.9375em; } } @media screen and (max-width: 480px) { header .header-utility-bar #header-mobile-nav li a { font-size: 0.75em; } } header .header-utility-bar #header-mobile-nav li a img { display: block; margin: 0 auto; } header .header-utility-bar #header-mobile-nav li a img:first-child { width: 50%; } header .header-utility-bar #header-mobile-nav li a span { color: #fff; display: block; font-size: 1em; line-height: 2em; text-align: center; text-transform: uppercase; } header ul { list-style: none; margin: 0; padding: 0; } header ul li { display: inline; padding-left: 0; background: none; } header #site-nav { text-align: left; position: relative; padding-top: 1.25em; width: 80%; } header #site-nav > ul li { font-size: 1em; padding-right: 1.25em; background: none; } /*header #site-nav > ul li a { color: white; font-family: "Kievit black"; line-height: 1em; text-transform: uppercase; text-decoration: none; }*/ header #site-nav > ul li a { color: white; font-family: "Kievit black"; line-height: 1em; text-transform: uppercase; text-decoration: none; text-shadow: -1px -1px 0 #222, 1px -1px 0 #222, -1px 1px 0 #222, 2px 2px 0 #222; } @media screen and (max-width: 640px) { header #site-nav > ul li a { text-shadow: none; } } @media screen and (min-width: 1281px) { header #site-nav > ul li a { font-size: 1.25em; } } @media screen and (max-width: 1280px) { header #site-nav > ul li a { font-size: 1.1875em; } } @media screen and (max-width: 1120px) { header #site-nav > ul li a { font-size: 1.125em; } } @media screen and (max-width: 960px) { header #site-nav > ul li a { font-size: 1.0625em; } } @media screen and (max-width: 800px) { header #site-nav > ul li a { font-size: 1em; } } @media screen and (max-width: 640px) { header #site-nav > ul li a { font-size: 1.25em; } } @media screen and (max-width: 480px) { header #site-nav > ul li a { font-size: 1em; } } header #site-nav > ul li a:hover { text-decoration: underline; } header #site-nav > ul li a:active { color: #9b9b9b; } @media screen and (max-width: 640px) { header #site-nav > ul li a { color: #09457d; float: left; width: 50%; padding: 1em; text-align: center; text-decoration: none !important; } } @media screen and (max-width: 640px) { header #site-nav { display: none; width: 100%; float: none; padding: 0 !important; position: static; } header #site-nav > ul { background: url(images/backgrounds/mobile.sitenav.png) center center no-repeat; background-size: 100% 100%; position: relative; *zoom: 1; -webkit-box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.25); -moz-box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.25); box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.25); } header #site-nav > ul:before, header #site-nav > ul:after { content: " "; display: table; } header #site-nav > ul:after { clear: both; } header #site-nav > ul li { padding-right: 0; } } header #mobile-utility-nav { background: #f5f5f5; *zoom: 1; } header #mobile-utility-nav:before, header #mobile-utility-nav:after { content: " "; display: table; } header #mobile-utility-nav:after { clear: both; } header #mobile-utility-nav ul { padding: 1em 0; text-align: center; -webkit-box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.25); -moz-box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.25); box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.25); } header #mobile-utility-nav li { display: inline-block; margin: 0; padding: 0; text-align: center; vertical-align: top; background: none; width: 22%; } header #mobile-utility-nav li.show-for-small { display: inline-block !important; } header #mobile-utility-nav li a { color: #09457d; font-family: "Kievit Book"; line-height: 1em; text-decoration: none !important; text-transform: uppercase; } @media screen and (min-width: 1281px) { header #mobile-utility-nav li a { font-size: 1em; } } @media screen and (max-width: 1280px) { header #mobile-utility-nav li a { font-size: 0.95em; } } @media screen and (max-width: 1120px) { header #mobile-utility-nav li a { font-size: 0.9em; } } @media screen and (max-width: 960px) { header #mobile-utility-nav li a { font-size: 0.85em; } } @media screen and (max-width: 800px) { header #mobile-utility-nav li a { font-size: 0.8em; } } @media screen and (max-width: 640px) { header #mobile-utility-nav li a { font-size: 1em; } } @media screen and (max-width: 480px) { header #mobile-utility-nav li a { font-size: 0.8em; } } header #mobile-utility-nav li a + a { display: block; margin-top: 0.75em; } @media screen and (max-width: 480px) { header #mobile-utility-nav li { width: 100%; padding: 0.25em 0; font-size: 1em !important; } header #mobile-utility-nav li + a { width: 100%; } } header #mobile-search { background: #e1e1e1; display: none; *zoom: 1; padding: 1em 6%; width: 100%; -webkit-box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.25); -moz-box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.25); box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.25); } header #mobile-search:before, header #mobile-search:after { content: " "; display: table; } header #mobile-search:after { clear: both; } header #mobile-search form { background: url("images/butterball-it-mobile-search-background.png") center top no-repeat; background-size: 225px; position: relative; width: 225px; height: 31px; margin: 0 auto; } header #mobile-search form input[type="image"] { position: absolute; left: 3px; top: 3px; width: 28px; } header #mobile-search form input[type="text"] { border: none; color: #888888; font-family: "Kievit Light"; font-weight: bold; height: auto; margin-top: 0; padding-left: 50px; padding-top: 10px; padding-bottom: 5px; text-transform: uppercase; width: 100%; background: none; box-shadow: none; } header #logo { margin: 0 auto; max-width: 264px; position: absolute; right: 8%; top: 1.5em; z-index: 1; } @media screen and (max-width: 1280px) { header #logo { width: 238px; } } @media screen and (max-width: 1120px) { header #logo { width: 212px; } } @media screen and (max-width: 960px) { header #logo { width: 185px; } } @media screen and (max-width: 800px) { header #logo { width: 160px; } } header #logo img { position: relative; float: right; margin-right: 0; } header #breadcrumbs { margin-top: 1em; width: 75%; } header #breadcrumbs ul { margin-top: 4em; } header #breadcrumbs ul li { color: #fff; display: inline-block; background: none; font-family: "Kievit Book"; line-height: 1em; margin-top: 0; text-transform: uppercase; } @media screen and (min-width: 1281px) { header #breadcrumbs ul li { font-size: 0.9375em; } } @media screen and (max-width: 1280px) { header #breadcrumbs ul li { font-size: 0.89063em; } } @media screen and (max-width: 1120px) { header #breadcrumbs ul li { font-size: 0.84375em; } } @media screen and (max-width: 960px) { header #breadcrumbs ul li { font-size: 0.79688em; } } @media screen and (max-width: 800px) { header #breadcrumbs ul li { font-size: 0.75em; } } @media screen and (max-width: 640px) { header #breadcrumbs ul li { font-size: 0.9375em; } } @media screen and (max-width: 480px) { header #breadcrumbs ul li { font-size: 0.75em; } } header #breadcrumbs ul li a { color: #fff; font-family: "Kievit black"; text-decoration: none; } header #breadcrumbs ul li a:hover { text-decoration: underline; } header #breadcrumbs ul li a:active { color: #6e6e6e; } header #breadcrumbs ul li a:after { content: ""; background: url(images/icons/arrow.breadcrumb.png) right 54% no-repeat; margin-right: 0.25em; padding-right: 1em; } header.site-nav-off .header-background { background: none; } header.site-nav-off #site-nav { display: none; } /* header styles */ html, body { position: relative; } .row { padding: 0 8%; } @media screen and (min-width: 1441px) { .row { padding: 0 115px; } } @media screen and (max-width: 640px) { .row { padding: 0; } } .clearfix:after { content: " "; /* Older browser do not support empty content */ visibility: hidden; display: block; height: 0; clear: both; } html { background: #09457d url(images/backgrounds/hd.png) center 0 repeat-y; } body { min-width: 320px; margin: 0 auto; max-width: 1920px; } .clear { clear: both; } #main { position: relative; width: 100%; } #main #mobile-logo { background: url(images/backgrounds/header.png) 0 0 repeat-x; min-height: 150px; position: absolute; left: 0; top: 0; padding: 10px 0.9375em 0; z-index: 1; } #main #mobile-logo img { width: 35%; float: right; } article { margin: 0 auto; overflow: hidden; position: relative; } article #sticky-bar { background: #0961ab; background: rgba(9, 97, 171, 0.6); display: block; min-height: 41px; padding-left: 0 !important; padding-right: 0 !important; position: relative; z-index: 12; } article #sticky-bar .row { padding-top: 0; padding-bottom: 0; } article #sticky-bar .columns { padding-left: 0 !important; padding-right: 0 !important; cursor: pointer; } article #sticky-bar a { border-left: 1px solid #5391c4; color: #fff; display: block; font-family: "Kievit Bold"; line-height: 1em; padding: 0.8em 0 0.6em 0; text-align: center; text-decoration: none; text-transform: uppercase; width: 100%; -webkit-transition: color 1s ease-in; -moz-transition: color 1s ease-in; -o-transition: color 1s ease-in; transition: color 1s ease-in; } @media screen and (min-width: 1281px) { article #sticky-bar a { font-size: 1.125em; } } @media screen and (max-width: 1280px) { article #sticky-bar a { font-size: 1.06875em; } } @media screen and (max-width: 1120px) { article #sticky-bar a { font-size: 1.0125em; } } @media screen and (max-width: 960px) { article #sticky-bar a { font-size: 0.95625em; } } @media screen and (max-width: 800px) { article #sticky-bar a { font-size: 0.9em; } } @media screen and (max-width: 640px) { article #sticky-bar a { font-size: 1.125em; } } @media screen and (max-width: 480px) { article #sticky-bar a { font-size: 0.9em; } } article #sticky-bar a.activePanel { color: #f9e90d; text-shadow: 1px 0px 15px rgba(255, 255, 255, 0.75); } article #sticky-bar a:hover { text-decoration: underline; } article #sticky-bar a.activePanel:hover { text-decoration: none; } @media screen and (max-width: 960px) { article #sticky-bar a { line-height: 1.25em; } } @media screen and (max-width: 640px) { article #sticky-bar a { padding: 1.5em 0; line-height: 1em; } } @media screen and (max-width: 640px) and (min-width: 1281px) { article #sticky-bar a { font-size: 0.875em; } } @media screen and (max-width: 640px) and (max-width: 1280px) { article #sticky-bar a { font-size: 0.83125em; } } @media screen and (max-width: 640px) and (max-width: 1120px) { article #sticky-bar a { font-size: 0.7875em; } } @media screen and (max-width: 640px) and (max-width: 960px) { article #sticky-bar a { font-size: 0.74375em; } } @media screen and (max-width: 640px) and (max-width: 800px) { article #sticky-bar a { font-size: 0.7em; } } @media screen and (max-width: 640px) and (max-width: 640px) { article #sticky-bar a { font-size: 0.875em; } } @media screen and (max-width: 640px) and (max-width: 480px) { article #sticky-bar a { font-size: 0.7em; } } article #sticky-bar .row div:first-child a { border-left: none; } article #sticky-bar .columns:first-child a { text-align: left; } article #sticky-bar .columns:last-child a { text-align: right; } article #sticky-bar .product-information-tab.columns:last-child a, article #sticky-bar .recipe-information-tab.columns:last-child a { text-align: center; } @media screen and (max-width: 640px) { article #sticky-bar { padding: 0 !important; margin-top: 0; } article #sticky-bar .columns a { height: 56px; padding: 1em 12.5% 0.5em 12.5%; text-align: center !important; } } @media screen and (max-width: 480px) { article #sticky-bar .columns a { padding-top: 1.5em; padding-bottom: 1.5em; } } article .stuck { background: #0961ab !important; margin-top: 0 !important; position: fixed !important; top: 0; left: 0; z-index: 1000; width: 100%; } .contact-us article { overflow: visible; } .center { float: right; right: 50%; position: relative; } .center .inner-center { float: right; right: -50%; position: relative; } .lt-ie9 #sticky-bar .columns.last a { text-align: right; } .background-dot-gradient { background-image: url("images/backgrounds/dot-print.png"), -webkit-linear-gradient(top, #a1c4d5 0%, #aacfe1 6px, #b0d7ea 13px, #bad9e9 110px, #cde1eb 253px, #f1f6f8 512px, white 648px); background-image: url("images/backgrounds/dot-print.png"), -moz-linear-gradient(top, #a1c4d5 0%, #aacfe1 6px, #b0d7ea 13px, #bad9e9 110px, #cde1eb 253px, #f1f6f8 512px, white 648px); background-image: url("images/backgrounds/dot-print.png"), -ms-linear-gradient(top, #a1c4d5 0%, #aacfe1 6px, #b0d7ea 13px, #bad9e9 110px, #cde1eb 253px, #f1f6f8 512px, white 648px); background-image: url("images/backgrounds/dot-print.png"), -o-linear-gradient(top, #a1c4d5 0%, #aacfe1 6px, #b0d7ea 13px, #bad9e9 110px, #cde1eb 253px, #f1f6f8 512px, white 648px); background-image: url("images/backgrounds/dot-print.png"), linear-gradient(top, #a1c4d5 0%, #aacfe1 6px, #b0d7ea 13px, #bad9e9 110px, #cde1eb 253px, #f1f6f8 512px, white 648px); background-repeat: repeat; } .background-dot { background: url("images/backgrounds/dot-print.png") repeat; } .content { padding-bottom: 60px; background: url(images/backgrounds/related-products.gif) 0 0 repeat; -webkit-box-shadow: inset 0 8px 8px -8px #333333, inset 0 -8px 8px -8px #333333; -moz-box-shadow: inset 0 8px 8px -8px #333333, inset 0 -8px 8px -8px #333333; box-shadow: inset 0 8px 8px -8px #333333, inset 0 -8px 8px -8px #333333; } #hero.simple { padding: 260px 0 0 0; } #hero.simple h1 { color: #09457d; font-family: "Kievit black"; line-height: 0.947em; margin: 0; text-shadow: 1px 1px 2px #969696; text-transform: uppercase; } @media screen and (min-width: 1281px) { #hero.simple h1 { font-size: 3.5625em; } } @media screen and (max-width: 1280px) { #hero.simple h1 { font-size: 3.38438em; } } @media screen and (max-width: 1120px) { #hero.simple h1 { font-size: 3.20625em; } } @media screen and (max-width: 960px) { #hero.simple h1 { font-size: 3.02813em; } } @media screen and (max-width: 800px) { #hero.simple h1 { font-size: 2.85em; } } @media screen and (max-width: 640px) { #hero.simple h1 { font-size: 3.5625em; } } @media screen and (max-width: 480px) { #hero.simple h1 { font-size: 2.85em; } } #hero.simple p { color: #404040; font-family: "Kievit Book"; line-height: 1.375em; margin: 1.25em 0 0 0; } @media screen and (min-width: 1281px) { #hero.simple p { font-size: 1.2em; } } @media screen and (max-width: 1280px) { #hero.simple p { font-size: 1.14em; } } @media screen and (max-width: 1120px) { #hero.simple p { font-size: 1.08em; } } @media screen and (max-width: 960px) { #hero.simple p { font-size: 1.02em; } } @media screen and (max-width: 800px) { #hero.simple p { font-size: 0.96em; } } @media screen and (max-width: 640px) { #hero.simple p { font-size: 1.2em; } } @media screen and (max-width: 480px) { #hero.simple p { font-size: 0.96em; } } @media screen and (max-width: 640px) { #hero.simple { padding: 30px 0 0 0; } } .social { margin: 1em 0 0 0; clear: both; } .social ul { padding-left: 0; margin: 0; *zoom: 1; } .social ul:before, .social ul:after { content: " "; display: table; } .social ul:after { clear: both; } .social ul li { display: inline; float: left; margin: 0 0 10px 0; padding: 0; list-style: none; background: none; padding-right: 10px; } .social ul li.pinterest { padding-right: 50px !important; } @media screen and (max-width: 640px) { .social ul li { display: block; float: left; height: 40px; padding: 10px 0 !important; width: 50%; } } .social ul li.googleplus { padding-right: 0 !important; } @media screen and (max-width: 640px) { .social { padding: 0 12.5%; } } [id^=___plusone] { width: 68px !important; } #lpButDivID-1308349364 { position: absolute !important; left: -100000000em !important; top: -1000000000em !important; } .feed-status { display: none; } .ajax-loader { position: relative; background: transparent url(images/backgrounds/ajax-loader-bg.png) no-repeat center 0; display: block; width: 100%; height: 82px; text-align: center; } .ajax-loader span { background: transparent url(images/icons/ajax-loader.gif) no-repeat 0 0; display: block; width: 82px; height: 82px; position: absolute; top: 6px; left: 50%; margin-left: -32px; } .filter-no-results { color: #09457d; font-family: "Kievit Bold"; line-height: 1em; } @media screen and (min-width: 1281px) { .filter-no-results { font-size: 1.5625em; } } @media screen and (max-width: 1280px) { .filter-no-results { font-size: 1.48438em; } } @media screen and (max-width: 1120px) { .filter-no-results { font-size: 1.40625em; } } @media screen and (max-width: 960px) { .filter-no-results { font-size: 1.32813em; } } @media screen and (max-width: 800px) { .filter-no-results { font-size: 1.25em; } } @media screen and (max-width: 640px) { .filter-no-results { font-size: 1.5625em; } } @media screen and (max-width: 480px) { .filter-no-results { font-size: 1.25em; } } .form-error { color: #d60000; margin: 0.5em 0; clear: both; font-size: 0.75em; } .form-error p, .form-error ul, .form-error li { color: #d60000 !important; } .email-unavailable { display: none; } .fb_iframe_widget { z-index: 90; } /* content styles */ footer { background: #0962a7; } footer #mainFooterLinks { background: url(images/backgrounds/footer.gif) repeat; -webkit-box-shadow: inset 0 8px 8px -8px #333333, inset 0 -8px 8px -8px #333333; -moz-box-shadow: inset 0 8px 8px -8px #333333, inset 0 -8px 8px -8px #333333; box-shadow: inset 0 8px 8px -8px #333333, inset 0 -8px 8px -8px #333333; padding: 1em 0; } footer #mainFooterLinks .row .columns { padding: 0; } @media screen and (max-width: 800px) { footer #mainFooterLinks .row { padding: 0 5%; } } footer .super-footer-block { width: 20%; padding-right: 3%; float: right; } footer .super-footer-block dl + dl { margin-top: 30px; } @media screen and (max-width: 800px) { footer .super-footer-block dl + dl { margin-top: 0; } } footer .super-footer-block dt { color: #fff; font-family: "Kievit black"; line-height: 1.3333em; padding-bottom: 8px; text-transform: uppercase; } @media screen and (min-width: 1281px) { footer .super-footer-block dt { font-size: 1.125em; } } @media screen and (max-width: 1280px) { footer .super-footer-block dt { font-size: 1.06875em; } } @media screen and (max-width: 1120px) { footer .super-footer-block dt { font-size: 1.0125em; } } @media screen and (max-width: 960px) { footer .super-footer-block dt { font-size: 0.95625em; } } @media screen and (max-width: 800px) { footer .super-footer-block dt { font-size: 0.9em; } } @media screen and (max-width: 640px) { footer .super-footer-block dt { font-size: 1.125em; } } @media screen and (max-width: 480px) { footer .super-footer-block dt { font-size: 0.9em; } } footer .super-footer-block dt a { color: #fff; text-decoration: none; } footer .super-footer-block dt a:hover { text-decoration: underline; } footer .super-footer-block dt a:active { color: #9b9b9b; } @media screen and (max-width: 800px) { footer .super-footer-block dt a { font-family: "Kievit Bold"; font-size: 1.125em !important; } } footer .super-footer-block dd { color: #8fdcff; line-height: 1em; padding: 0.25em 0; margin-left: 0; } @media screen and (min-width: 1281px) { footer .super-footer-block dd { font-size: 1em; } } @media screen and (max-width: 1280px) { footer .super-footer-block dd { font-size: 0.95em; } } @media screen and (max-width: 1120px) { footer .super-footer-block dd { font-size: 0.9em; } } @media screen and (max-width: 960px) { footer .super-footer-block dd { font-size: 0.85em; } } @media screen and (max-width: 800px) { footer .super-footer-block dd { font-size: 0.8em; } } @media screen and (max-width: 640px) { footer .super-footer-block dd { font-size: 1em; } } @media screen and (max-width: 480px) { footer .super-footer-block dd { font-size: 0.8em; } } footer .super-footer-block dd a { color: #8fdcff; font-family: "Kievit Regular"; line-height: 1em; text-decoration: none; } footer .super-footer-block dd a:hover { text-decoration: underline; } footer .super-footer-block dd a:active { color: #09457d; } footer .super-footer-block dd.split { width: 42%; padding-right: 5%; float: left; } footer .super-footer-block dd dl { clear: both; margin-top: 0; margin-bottom: 2em; } footer .super-footer-block dd dt { color: #c4d9e5; font-family: "Kievit Bold"; padding-bottom: 0.25em; text-transform: none; } footer .super-footer-block dd dd { font-size: 1em !important; width: 50%; float: left; } @media screen and (max-width: 800px) { footer .super-footer-block dd { display: none; } } @media screen and (max-width: 800px) { footer .super-footer-block { width: 25% !important; text-align: center; padding: 0 !important; } footer .super-footer-block.full-on-mobile { width: 100% !important; position: relative; } } @media screen and (max-width: 480px) { footer .super-footer-block { width: 50% !important; } } @media screen and (max-width: 800px) { footer .follow-us dt { font-family: "Kievit Light"; line-height: 1em; } } @media screen and (max-width: 800px) and (min-width: 1281px) { footer .follow-us dt { font-size: 1.5em; } } @media screen and (max-width: 800px) and (max-width: 1280px) { footer .follow-us dt { font-size: 1.425em; } } @media screen and (max-width: 800px) and (max-width: 1120px) { footer .follow-us dt { font-size: 1.35em; } } @media screen and (max-width: 800px) and (max-width: 960px) { footer .follow-us dt { font-size: 1.275em; } } @media screen and (max-width: 800px) and (max-width: 800px) { footer .follow-us dt { font-size: 1.2em; } } @media screen and (max-width: 800px) and (max-width: 640px) { footer .follow-us dt { font-size: 1.5em; } } @media screen and (max-width: 800px) and (max-width: 480px) { footer .follow-us dt { font-size: 1.2em; } } footer .follow-us dd { padding: 0.25em 0; } footer .follow-us div { background: #0097dc; display: inline-block; width: 33px; height: 33px; margin-right: 10px; -webkit-border-radius: 16.5px; -moz-border-radius: 16.5px; border-radius: 16.5px; -webkit-box-shadow: 2px 3px 4px rgba(0, 0, 0, 0.5); -moz-box-shadow: 2px 3px 4px rgba(0, 0, 0, 0.5); box-shadow: 2px 3px 4px rgba(0, 0, 0, 0.5); } @media screen and (max-width: 800px) { footer .follow-us div { margin-right: 0; } } footer .follow-us span { line-height: 33px; } @media screen and (max-width: 800px) { footer .follow-us { float: none; padding: 0; position: absolute; bottom: 0; text-align: center; width: 100%; } footer .follow-us dt a { font-family: "Kievit Light"; } footer .follow-us dd { display: inline-block !important; height: 33px; margin: 0 1em; padding: 0; } footer .follow-us dd a { float: left; } footer .follow-us dd span { display: none !important; } } footer #footer-utility-links { padding: 1em 0; text-align: center; } footer #footer-utility-links ul { margin: 0; padding: 0; list-style: none; } footer #footer-utility-links li { color: #fff; display: inline-block; font-family: "Kievit Regular"; line-height: 1.3077em; margin-left: 0; margin-top: 0; padding: 0.5em 0.875em; background: none; } @media screen and (min-width: 1281px) { footer #footer-utility-links li { font-size: 0.8125em; } } @media screen and (max-width: 1280px) { footer #footer-utility-links li { font-size: 0.77188em; } } @media screen and (max-width: 1120px) { footer #footer-utility-links li { font-size: 0.73125em; } } @media screen and (max-width: 960px) { footer #footer-utility-links li { font-size: 0.69063em; } } @media screen and (max-width: 800px) { footer #footer-utility-links li { font-size: 0.65em; } } @media screen and (max-width: 640px) { footer #footer-utility-links li { font-size: 0.8125em; } } @media screen and (max-width: 480px) { footer #footer-utility-links li { font-size: 0.65em; } } footer #footer-utility-links li a { color: white; font-family: "Kievit Regular"; text-decoration: none; } footer #footer-utility-links li a:hover { text-decoration: underline; } footer #footer-utility-links li a:active { color: #9b9b9b; } @media screen and (max-width: 800px) { footer #footer-utility-links li { line-height: 1.3077em; } } @media screen and (max-width: 800px) and (min-width: 1281px) { footer #footer-utility-links li { font-size: 1em; } } @media screen and (max-width: 800px) and (max-width: 1280px) { footer #footer-utility-links li { font-size: 0.95em; } } @media screen and (max-width: 800px) and (max-width: 1120px) { footer #footer-utility-links li { font-size: 0.9em; } } @media screen and (max-width: 800px) and (max-width: 960px) { footer #footer-utility-links li { font-size: 0.85em; } } @media screen and (max-width: 800px) and (max-width: 800px) { footer #footer-utility-links li { font-size: 0.8em; } } @media screen and (max-width: 800px) and (max-width: 640px) { footer #footer-utility-links li { font-size: 1em; } } @media screen and (max-width: 800px) and (max-width: 480px) { footer #footer-utility-links li { font-size: 0.8em; } } @media screen and (max-width: 800px) { footer #footer-utility-links .row { padding: 0 5%; } footer #footer-utility-links .row .columns { padding-left: 0; padding-right: 0; } footer #footer-utility-links ul + ul { margin-top: 20px; } } footer #footer-search { background: #fff; height: 42px; position: relative; float: left; margin: 0 8%; width: 84%; } footer #footer-search input[type="text"] { border: none; color: #0962a7; font-family: "Kievit Light"; font-weight: bold; height: auto; margin: 0; padding: 15px 0 11px 50px; text-align: left; text-transform: uppercase; width: 100%; } footer #footer-search input[type="image"] { position: absolute; left: 3px; top: 3px; } footer .call-us { border-bottom: 1px solid #046fad; padding-bottom: 10px; position: absolute; right: 0; top: 60px; width: 20%; } footer .call-us dt { color: #fff; font-family: "Kievit black"; line-height: 1.3333em; padding-bottom: 8px; text-transform: uppercase; } @media screen and (min-width: 1281px) { footer .call-us dt { font-size: 1.125em; } } @media screen and (max-width: 1280px) { footer .call-us dt { font-size: 1.06875em; } } @media screen and (max-width: 1120px) { footer .call-us dt { font-size: 1.0125em; } } @media screen and (max-width: 960px) { footer .call-us dt { font-size: 0.95625em; } } @media screen and (max-width: 800px) { footer .call-us dt { font-size: 0.9em; } } @media screen and (max-width: 640px) { footer .call-us dt { font-size: 1.125em; } } @media screen and (max-width: 480px) { footer .call-us dt { font-size: 0.9em; } } footer .call-us dt a { text-decoration: none; } footer .call-us dt a:hover { text-decoration: underline; } footer .call-us dt a:active { color: #9b9b9b; } @media screen and (max-width: 800px) { footer .call-us dt a { font-family: "Kievit Bold"; font-size: 1.125em !important; } } footer .call-us dd { color: #8fdcff; font-family: "Kievit Regular"; line-height: 1em; padding: 0.25em 0; margin-left: 0; } @media screen and (min-width: 1281px) { footer .call-us dd { font-size: 1em; } } @media screen and (max-width: 1280px) { footer .call-us dd { font-size: 0.95em; } } @media screen and (max-width: 1120px) { footer .call-us dd { font-size: 0.9em; } } @media screen and (max-width: 960px) { footer .call-us dd { font-size: 0.85em; } } @media screen and (max-width: 800px) { footer .call-us dd { font-size: 0.8em; } } @media screen and (max-width: 640px) { footer .call-us dd { font-size: 1em; } } @media screen and (max-width: 480px) { footer .call-us dd { font-size: 0.8em; } } footer .call-us dd a { color: #8fdcff; font-family: "Kievit Regular"; line-height: 1em; text-decoration: none; } footer .call-us dd a:hover { text-decoration: underline; } footer .call-us dd a:active { color: #09457d; } @media screen and (max-width: 800px) { footer .call-us { border: none; float: left; text-align: center; position: static; width: 100%; padding-bottom: 96px; } footer .call-us dt { line-height: 1em; padding-bottom: 0; font-family: "Kievit Light"; } footer .call-us dd { display: block !important; text-transform: uppercase; line-height: 1.1818em; } } @media screen and (max-width: 800px) and (min-width: 1281px) { footer .call-us dt { font-size: 1.5em; } } @media screen and (max-width: 800px) and (max-width: 1280px) { footer .call-us dt { font-size: 1.425em; } } @media screen and (max-width: 800px) and (max-width: 1120px) { footer .call-us dt { font-size: 1.35em; } } @media screen and (max-width: 800px) and (max-width: 960px) { footer .call-us dt { font-size: 1.275em; } } @media screen and (max-width: 800px) and (max-width: 800px) { footer .call-us dt { font-size: 1.2em; } } @media screen and (max-width: 800px) and (max-width: 640px) { footer .call-us dt { font-size: 1.5em; } } @media screen and (max-width: 800px) and (max-width: 480px) { footer .call-us dt { font-size: 1.2em; } } @media screen and (max-width: 800px) and (min-width: 1281px) { footer .call-us dd { font-size: 1.375em; } } @media screen and (max-width: 800px) and (max-width: 1280px) { footer .call-us dd { font-size: 1.30625em; } } @media screen and (max-width: 800px) and (max-width: 1120px) { footer .call-us dd { font-size: 1.2375em; } } @media screen and (max-width: 800px) and (max-width: 960px) { footer .call-us dd { font-size: 1.16875em; } } @media screen and (max-width: 800px) and (max-width: 800px) { footer .call-us dd { font-size: 1.1em; } } @media screen and (max-width: 800px) and (max-width: 640px) { footer .call-us dd { font-size: 1.375em; } } @media screen and (max-width: 800px) and (max-width: 480px) { footer .call-us dd { font-size: 1.1em; } } @media screen and (max-width: 800px) and (max-width: 800px) { footer .call-us dd.hide-for-medium-down { display: none !important; } } footer .other { position: absolute; right: 0; top: 160px; width: 20%; } footer .other dd { line-height: 1em; padding: 0.25em 0; margin-left: 0; } @media screen and (min-width: 1281px) { footer .other dd { font-size: 1em; } } @media screen and (max-width: 1280px) { footer .other dd { font-size: 0.95em; } } @media screen and (max-width: 1120px) { footer .other dd { font-size: 0.9em; } } @media screen and (max-width: 960px) { footer .other dd { font-size: 0.85em; } } @media screen and (max-width: 800px) { footer .other dd { font-size: 0.8em; } } @media screen and (max-width: 640px) { footer .other dd { font-size: 1em; } } @media screen and (max-width: 480px) { footer .other dd { font-size: 0.8em; } } footer .other dd a { color: #8fdcff; font-family: "Kievit Book"; text-decoration: none; } footer .other dd a:hover { text-decoration: underline; } footer .other dd a:active { color: #09457d; } @media screen and (max-width: 800px) { footer .other dd a { text-transform: uppercase; } } @media screen and (max-width: 800px) { footer .other dd { display: inline-block; margin: 0 !important; width: 22%; text-align: center; vertical-align: top; position: static; } footer .other dd.show-for-small { display: inline-block !important; } } @media screen and (max-width: 480px) { footer .other dd { width: 100%; font-size: 0.9em !important; } } @media screen and (min-width: 640px) { footer .other dd.faq-footer-link { padding-top: 10px; } } @media screen and (max-width: 800px) { footer .other { border-bottom: 2px solid #3173a5; float: left; margin: 20px 0 !important; padding-bottom: 15px; position: static; text-align: center; width: 100%; } } footer a.phone:hover { cursor: default; text-decoration: none !important; } /* footer styles */ .reveal-modal { margin-left: -25%; width: 50%; top: 100px; padding: 0 !important; } @media screen and (max-width: 1120px) { .reveal-modal { width: 60%; margin-left: -30%; } } @media screen and (max-width: 960px) { .reveal-modal { width: 70%; margin-left: -35%; } } @media screen and (max-width: 800px) { .reveal-modal { width: 80%; margin-left: -40%; } } @media screen and (max-width: 640px) { .reveal-modal { width: 90%; margin-left: -45%; } } .reveal-modal h2 { background: #09457d; color: #fff; display: block; font-family: "Kievit black"; line-height: 2.0572em; -webkit-box-shadow: 0 5px 5px rgba(0, 0, 0, 0.25); -moz-box-shadow: 0 5px 5px rgba(0, 0, 0, 0.25); box-shadow: 0 5px 5px rgba(0, 0, 0, 0.25); height: 72px; line-height: 72px !important; margin: 0; padding: 0 5%; text-shadow: 2px 2px #000; text-transform: uppercase; width: 100%; } @media screen and (min-width: 1281px) { .reveal-modal h2 { font-size: 2.1875em; } } @media screen and (max-width: 1280px) { .reveal-modal h2 { font-size: 2.07813em; } } @media screen and (max-width: 1120px) { .reveal-modal h2 { font-size: 1.96875em; } } @media screen and (max-width: 960px) { .reveal-modal h2 { font-size: 1.85938em; } } @media screen and (max-width: 800px) { .reveal-modal h2 { font-size: 1.75em; } } @media screen and (max-width: 640px) { .reveal-modal h2 { font-size: 2.1875em; } } @media screen and (max-width: 480px) { .reveal-modal h2 { font-size: 1.75em; } } @media screen and (max-width: 640px) { .reveal-modal h2 { height: 48px; font-size: 1.5em !important; line-height: 48px !important; } } @media screen and (max-width: 480px) { .reveal-modal h2 { font-size: 1em !important; } } .reveal-modal #modal-content { display: block; padding: 2em 5% 2em 5%; } .reveal-modal #modal-content p { color: #404040; font-family: "Kievit Book"; line-height: 1.2666em; margin: 1.5em 0; } @media screen and (min-width: 1281px) { .reveal-modal #modal-content p { font-size: 1em; } } @media screen and (max-width: 1280px) { .reveal-modal #modal-content p { font-size: 0.95em; } } @media screen and (max-width: 1120px) { .reveal-modal #modal-content p { font-size: 0.9em; } } @media screen and (max-width: 960px) { .reveal-modal #modal-content p { font-size: 0.85em; } } @media screen and (max-width: 800px) { .reveal-modal #modal-content p { font-size: 0.8em; } } @media screen and (max-width: 640px) { .reveal-modal #modal-content p { font-size: 1em; } } @media screen and (max-width: 480px) { .reveal-modal #modal-content p { font-size: 0.8em; } } .reveal-modal #modal-content p strong { display: block; font-family: "Kievit black"; } .reveal-modal #modal-content p .mobile-disclaimer { display: none; } .reveal-modal #modal-content .checkbox { margin-top: 0; } .reveal-modal #modal-content label { color: #404040; display: block; font-family: "Kievit Book"; line-height: 1.2666em; margin-top: 0.375em; margin-left: 0.25em; padding-bottom: 2em; } @media screen and (min-width: 1281px) { .reveal-modal #modal-content label { font-size: 1em; } } @media screen and (max-width: 1280px) { .reveal-modal #modal-content label { font-size: 0.95em; } } @media screen and (max-width: 1120px) { .reveal-modal #modal-content label { font-size: 0.9em; } } @media screen and (max-width: 960px) { .reveal-modal #modal-content label { font-size: 0.85em; } } @media screen and (max-width: 800px) { .reveal-modal #modal-content label { font-size: 0.8em; } } @media screen and (max-width: 640px) { .reveal-modal #modal-content label { font-size: 1em; } } @media screen and (max-width: 480px) { .reveal-modal #modal-content label { font-size: 0.8em; } } .reveal-modal #modal-content label + p { clear: both; overflow: hidden; margin: 0; } .reveal-modal #modal-content form .button { margin-top: 0; } .reveal-modal #modal-content figure img { border: 1px solid #99d5f1; display: block; margin-bottom: 0.5em; } .reveal-modal #modal-content figure a { color: #0097dc; display: inline-block; font-family: "Kievit Bold"; line-height: 1.2666em; text-decoration: none; } @media screen and (min-width: 1281px) { .reveal-modal #modal-content figure a { font-size: 1em; } } @media screen and (max-width: 1280px) { .reveal-modal #modal-content figure a { font-size: 0.95em; } } @media screen and (max-width: 1120px) { .reveal-modal #modal-content figure a { font-size: 0.9em; } } @media screen and (max-width: 960px) { .reveal-modal #modal-content figure a { font-size: 0.85em; } } @media screen and (max-width: 800px) { .reveal-modal #modal-content figure a { font-size: 0.8em; } } @media screen and (max-width: 640px) { .reveal-modal #modal-content figure a { font-size: 1em; } } @media screen and (max-width: 480px) { .reveal-modal #modal-content figure a { font-size: 0.8em; } } .reveal-modal #modal-content figure a:hover { text-decoration: underline; } .reveal-modal #modal-content figure a:active { color: #6e6e6e; } .reveal-modal #modal-content .button { clear: none; } .reveal-modal .close-reveal-modal { background: url(images/icons/close.modal.png) center no-repeat; background-size: 100% 100%; border-left: 1px solid #537da4; color: #fff; display: block; line-height: 72px; font-family: "Kievit Regular"; width: 72px !important; text-indent: -9999em; right: 0; top: 0; padding: 0; font-size: 0; text-indent: 100%; white-space: nowrap; overflow: hidden; } @media screen and (max-width: 640px) { .reveal-modal .close-reveal-modal { width: 48px !important; line-height: 48px !important; } } .reveal-modal#forgot-password-modal #modal-content label { padding-bottom: 0; } .reveal-modal#forgot-password-modal #modal-content .button { margin: 20px 0 0 0; } .touch #modal-content p .mobile-disclaimer { display: block; margin-bottom: 1em; margin-top: 1em; } /* overrides for reveal */ /* page level styles */ .home #breadcrumbs { display: none !important; } .home #page-texture { position: absolute; right: 0; top: 24%; z-index: 10; } @media screen and (max-width: 960px) { .home #page-texture { display: none; } } .home #hero .flexslider { margin: 0; } @media screen and (max-width: 640px) { .home #hero .flexslider .flex-viewport { padding-bottom: 60px; } } .home #hero .flexslider .flex-control-nav { bottom: 40px; z-index: 40; } @media screen and (max-width: 1120px) { .home #hero .flexslider .flex-control-nav { bottom: 30px; } } @media screen and (max-width: 960px) { .home #hero .flexslider .flex-control-nav { bottom: 20px; } } @media screen and (max-width: 640px) { .home #hero .flexslider .flex-control-nav { display: none; } } .home #hero .flexslider .flex-direction-nav { display: none; width: 100%; } @media screen and (max-width: 640px) { .home #hero .flexslider .flex-direction-nav { display: block; bottom: 0; position: absolute; } .home #hero .flexslider .flex-direction-nav a { background: url(images/sprites/arrow.carousel.mobile.png) no-repeat; background-size: 100% 200%; margin: 0; width: 57px; height: 60px; top: auto; bottom: 0; } .home #hero .flexslider .flex-direction-nav a.flex-prev { background-position: 0 0; left: 0; } .home #hero .flexslider .flex-direction-nav a.flex-next { background-position: 0 bottom; right: 0; } } .home #hero .flexslider .flex-text-paging { display: none; } @media screen and (max-width: 640px) { .home #hero .flexslider .flex-text-paging { display: block; position: absolute; bottom: 20px; text-align: center; width: 100%; } .home #hero .flexslider .flex-text-paging.one-slide { display: none; } } .home #hero .flexslider .slides li { font-size: 1em; margin: 0; padding: 0; } .home #hero .flexslider .slides li > div { position: relative; } .home #hero .flexslider .slides li > div .layers { display: block; position: relative; width: 100%; } .home #hero .flexslider .slides li > div .layers .backdrop { z-index: 0; min-height: 500px; } .home #hero .flexslider .slides li > div .layers .backdrop img { min-height: 500px; } @media screen and (max-width: 640px) { .home #hero .flexslider .slides li > div .layers .backdrop { min-height: 300px; } .home #hero .flexslider .slides li > div .layers .backdrop img { min-height: 300px; } } @media screen and (max-width: 480px) { .home #hero .flexslider .slides li > div .layers .backdrop { min-height: 200px; } .home #hero .flexslider .slides li > div .layers .backdrop img { min-height: 200px; } } .home #hero .flexslider .slides li > div .layers .object { position: absolute; left: 0; bottom: 0; z-index: 1; width: 100%; } .home #hero .flexslider .slides li > div .layers .product { position: absolute; left: 0; bottom: 0; z-index: 2; width: 100%; } .home #hero .flexslider .slides li > div .layers .featured-recipe { position: absolute; right: 0; bottom: 10%; margin-right: 8%; width: 40%; z-index: 1; } .home #hero .flexslider .slides li > div .layers .featured-recipe figure { position: relative; } .home #hero .flexslider .slides li > div .layers .featured-recipe figure img { max-height: 400px; } .home #hero .flexslider .slides li > div .layers .featured-recipe figure .labels { position: absolute; bottom: -1.5em; right: 0; width: 56%; } @media screen and (max-width: 1280px) { .home #hero .flexslider .slides li > div .layers .featured-recipe figure .labels { bottom: -1em; right: -2%; width: 58%; } } @media screen and (max-width: 1120px) { .home #hero .flexslider .slides li > div .layers .featured-recipe figure .labels { bottom: -0.5em; right: -4%; width: 60%; } } @media screen and (max-width: 960px) { .home #hero .flexslider .slides li > div .layers .featured-recipe figure .labels { bottom: -2em; right: -6%; width: 62%; } } @media screen and (max-width: 800px) { .home #hero .flexslider .slides li > div .layers .featured-recipe figure .labels { right: -8%; width: 64%; } } @media screen and (max-width: 640px) { .home #hero .flexslider .slides li > div .layers .featured-recipe figure .labels { bottom: -1.5em; right: 0; width: 62%; } } @media screen and (max-width: 560px) { .home #hero .flexslider .slides li > div .layers .featured-recipe figure .labels { bottom: -1em; right: -2%; width: 56%; } } @media screen and (max-width: 480px) { .home #hero .flexslider .slides li > div .layers .featured-recipe figure .labels { bottom: -0.5em; right: -4%; width: 50%; } } .home #hero .flexslider .slides li > div .layers .featured-recipe figure .labels li { background: none; float: right; list-style: none; margin: 0 0 0 -5%; padding: 0; width: 33%; } @media screen and (max-width: 640px) { .home #hero .flexslider .slides li > div .layers .featured-recipe figure .labels li { width: 28%; } } @media screen and (max-width: 560px) { .home #hero .flexslider .slides li > div .layers .featured-recipe figure .labels li { width: 30%; } } @media screen and (max-width: 480px) { .home #hero .flexslider .slides li > div .layers .featured-recipe figure .labels li { width: 33%; } } .home #hero .flexslider .slides li > div .layers .featured-recipe figure .labels li img { width: 100%; } /*.home #hero .flexslider .slides li > div .slide-info { position: absolute; z-index: 4; width: 40%; margin-top: 160px; } */ .home #hero .flexslider .slides li > div .slide-info { position: absolute; z-index: 4; width: 40%; margin-top: 160px; background-color: #09457d; background-color: rgba(9, 69, 125, 0.7); padding: 15px;} .home #hero .flexslider .slides li > div .slide-info a { color: #FFF; } @media screen and (max-width: 640px) { .home #hero .flexslider .slides li > div .slide-info { margin-top: 0; } } /*.home #hero .flexslider .slides li > div .slide-info h3 { color: #09457d; font-family: "Kievit black"; line-height: 0.9535em; margin: 0; text-transform: uppercase; text-shadow: 1px 1px 2px #969696; }*/ .home #hero .flexslider .slides li > div .slide-info h3 { color: #FFF; font-family: "Kievit black"; line-height: 0.9535em; margin: 0; text-transform: uppercase; text-shadow: 1px 1px 2px #969696; } @media screen and (min-width: 1281px) { .home #hero .flexslider .slides li > div .slide-info h3 { font-size: 2.6875em; } } @media screen and (max-width: 1280px) { .home #hero .flexslider .slides li > div .slide-info h3 { font-size: 2.55313em; } } @media screen and (max-width: 1120px) { .home #hero .flexslider .slides li > div .slide-info h3 { font-size: 2.41875em; } } @media screen and (max-width: 960px) { .home #hero .flexslider .slides li > div .slide-info h3 { font-size: 2.28437em; } } @media screen and (max-width: 800px) { .home #hero .flexslider .slides li > div .slide-info h3 { font-size: 2.15em; } } @media screen and (max-width: 640px) { .home #hero .flexslider .slides li > div .slide-info h3 { font-size: 2.6875em; } } @media screen and (max-width: 480px) { .home #hero .flexslider .slides li > div .slide-info h3 { font-size: 2.15em; } } .home #hero .flexslider .slides li > div .slide-info h3 strong { color: #085daa; line-height: 0.7857em; } @media screen and (min-width: 1281px) { .home #hero .flexslider .slides li > div .slide-info h3 strong { font-size: 1.9535em; } } @media screen and (max-width: 1280px) { .home #hero .flexslider .slides li > div .slide-info h3 strong { font-size: 1.85582em; } } @media screen and (max-width: 1120px) { .home #hero .flexslider .slides li > div .slide-info h3 strong { font-size: 1.75815em; } } @media screen and (max-width: 960px) { .home #hero .flexslider .slides li > div .slide-info h3 strong { font-size: 1.66048em; } } @media screen and (max-width: 800px) { .home #hero .flexslider .slides li > div .slide-info h3 strong { font-size: 1.5628em; } } @media screen and (max-width: 640px) { .home #hero .flexslider .slides li > div .slide-info h3 strong { font-size: 1.9535em; } } @media screen and (max-width: 480px) { .home #hero .flexslider .slides li > div .slide-info h3 strong { font-size: 1.5628em; } } .home #hero .flexslider .slides li > div .slide-info h3 br { display: none; } @media screen and (max-width: 640px) { .home #hero .flexslider .slides li > div .slide-info h3 { font-size: 1.75em !important; } .home #hero .flexslider .slides li > div .slide-info h3 strong { font-size: 1.25em !important; } } .home #hero .flexslider .slides li > div .slide-info p { color: #363636; font-family: "Kievit Book"; line-height: 1.2em; margin-top: 0.5em; position: relative; } @media screen and (min-width: 1281px) { .home #hero .flexslider .slides li > div .slide-info p { font-size: 1.25em; color: #FFF; } } @media screen and (max-width: 1280px) { .home #hero .flexslider .slides li > div .slide-info p { font-size: 1.1875em; color: #FFF; } } @media screen and (max-width: 1120px) { .home #hero .flexslider .slides li > div .slide-info p { font-size: 1.125em; color: #FFF; } } @media screen and (max-width: 960px) { .home #hero .flexslider .slides li > div .slide-info p { font-size: 1.0625em; color: #FFF; } } @media screen and (max-width: 800px) { .home #hero .flexslider .slides li > div .slide-info p { font-size: 1em; color: #FFF; } } @media screen and (max-width: 640px) { .home #hero .flexslider .slides li > div .slide-info p { font-size: 1.25em; } } @media screen and (max-width: 480px) { .home #hero .flexslider .slides li > div .slide-info p { font-size: 1em; } } .home #hero .flexslider .slides li > div .slide-info p img { width: 45%; margin-right: 10px; margin-bottom: 20px; } @media screen and (max-width: 800px) { .home #hero .flexslider .slides li > div .slide-info p img { display: none; } } @media screen and (max-width: 640px) { .home #hero .flexslider .slides li > div .slide-info { -webkit-box-shadow: 0 0 10px #333333; -moz-box-shadow: 0 0 10px #333333; box-shadow: 0 0 10px #333333; position: static; padding: 5%; width: 100% !important; height: 190px; background-color: #09457d; } } @media screen and (max-width: 480px) { .home #hero .flexslider .slides li > div .slide-info { height: 170px; } } .home #hero .flexslider .slides li > div.special-slide .slide-info { left: 8%; top: 30%; width: 40%; } @media screen and (max-width: 640px) { .home #hero .flexslider .slides li > div.special-slide .slide-info p { padding-left: 0; } } @media screen and (max-width: 850px) { .home #hero .flexslider .slides li > div.special2-slide .product { bottom: 60px; } } @media screen and (max-width: 640px) { .home #hero .flexslider .slides li > div.special2-slide .product { bottom: 0px; } } .home #hero .flexslider .slides li > div.special2-slide .slide-info { left: 8%; top: 36%; width: 29%; } .home #hero .flexslider .slides li > div.special2-slide .slide-info p { padding-left: 0; } @media screen and (max-width: 1100px) { .home #hero .flexslider .slides li > div.special2-slide .slide-info h3 { line-height: 1em; } } @media screen and (max-width: 1100px) and (min-width: 1281px) { .home #hero .flexslider .slides li > div.special2-slide .slide-info h3 { font-size: 2.125em; } } @media screen and (max-width: 1100px) and (max-width: 1280px) { .home #hero .flexslider .slides li > div.special2-slide .slide-info h3 { font-size: 2.01875em; } } @media screen and (max-width: 1100px) and (max-width: 1120px) { .home #hero .flexslider .slides li > div.special2-slide .slide-info h3 { font-size: 1.9125em; } } @media screen and (max-width: 1100px) and (max-width: 960px) { .home #hero .flexslider .slides li > div.special2-slide .slide-info h3 { font-size: 1.80625em; } } @media screen and (max-width: 1100px) and (max-width: 800px) { .home #hero .flexslider .slides li > div.special2-slide .slide-info h3 { font-size: 1.7em; } } @media screen and (max-width: 1100px) and (max-width: 640px) { .home #hero .flexslider .slides li > div.special2-slide .slide-info h3 { font-size: 2.125em; } } @media screen and (max-width: 1100px) and (max-width: 480px) { .home #hero .flexslider .slides li > div.special2-slide .slide-info h3 { font-size: 1.7em; } } @media screen and (max-width: 850px) { .home #hero .flexslider .slides li > div.special2-slide .slide-info h3 { line-height: 1em; } } @media screen and (max-width: 850px) and (min-width: 1281px) { .home #hero .flexslider .slides li > div.special2-slide .slide-info h3 { font-size: 1.75em; } } @media screen and (max-width: 850px) and (max-width: 1280px) { .home #hero .flexslider .slides li > div.special2-slide .slide-info h3 { font-size: 1.6625em; } } @media screen and (max-width: 850px) and (max-width: 1120px) { .home #hero .flexslider .slides li > div.special2-slide .slide-info h3 { font-size: 1.575em; } } @media screen and (max-width: 850px) and (max-width: 960px) { .home #hero .flexslider .slides li > div.special2-slide .slide-info h3 { font-size: 1.4875em; } } @media screen and (max-width: 850px) and (max-width: 800px) { .home #hero .flexslider .slides li > div.special2-slide .slide-info h3 { font-size: 1.4em; } } @media screen and (max-width: 850px) and (max-width: 640px) { .home #hero .flexslider .slides li > div.special2-slide .slide-info h3 { font-size: 1.75em; } } @media screen and (max-width: 850px) and (max-width: 480px) { .home #hero .flexslider .slides li > div.special2-slide .slide-info h3 { font-size: 1.4em; } } .home #hero .flexslider .slides li > div.product-slide .slide-info { left: 8%; top: 45%; width: 40%; } .home #hero .flexslider .slides li > div.product-slide .slide-info h3 strong { font-size: 1.25em; line-height: 1em; } .home #hero .flexslider .slides li > div.product-slide .slide-info p { padding-left: 0; } .home #hero .flexslider .slides li > div.recipe-slide .slide-info { left: 8%; top: 40%; width: 40%; } .home #hero .flexslider .slides li > div.recipe-slide .slide-info p { padding-left: 0; } @media screen and (max-width: 850px) { .home #hero .flexslider .slides li > div.howto-slide .product { bottom: 60px; } } @media screen and (max-width: 640px) { .home #hero .flexslider .slides li > div.howto-slide .product { bottom: 0px; } } .home #hero .flexslider .slides li > div.howto-slide .slide-info { right: 6%; top: 35%; width: 40%; } .home #hero .flexslider .slides li > div.howto-slide .slide-info h3 { line-height: 1.02em; color: #0962a7; } @media screen and (min-width: 1281px) { .home #hero .flexslider .slides li > div.howto-slide .slide-info h3 { font-size: 3.1875em; } } @media screen and (max-width: 1280px) { .home #hero .flexslider .slides li > div.howto-slide .slide-info h3 { font-size: 3.02813em; } } @media screen and (max-width: 1120px) { .home #hero .flexslider .slides li > div.howto-slide .slide-info h3 { font-size: 2.86875em; } } @media screen and (max-width: 960px) { .home #hero .flexslider .slides li > div.howto-slide .slide-info h3 { font-size: 2.70938em; } } @media screen and (max-width: 800px) { .home #hero .flexslider .slides li > div.howto-slide .slide-info h3 { font-size: 2.55em; } } @media screen and (max-width: 640px) { .home #hero .flexslider .slides li > div.howto-slide .slide-info h3 { font-size: 3.1875em; } } @media screen and (max-width: 480px) { .home #hero .flexslider .slides li > div.howto-slide .slide-info h3 { font-size: 2.55em; } } @media screen and (max-width: 1200px) { .home #hero .flexslider .slides li > div.howto-slide .slide-info h3 { line-height: 1em; } } @media screen and (max-width: 1200px) and (min-width: 1281px) { .home #hero .flexslider .slides li > div.howto-slide .slide-info h3 { font-size: 2.5em; } } @media screen and (max-width: 1200px) and (max-width: 1280px) { .home #hero .flexslider .slides li > div.howto-slide .slide-info h3 { font-size: 2.375em; } } @media screen and (max-width: 1200px) and (max-width: 1120px) { .home #hero .flexslider .slides li > div.howto-slide .slide-info h3 { font-size: 2.25em; } } @media screen and (max-width: 1200px) and (max-width: 960px) { .home #hero .flexslider .slides li > div.howto-slide .slide-info h3 { font-size: 2.125em; } } @media screen and (max-width: 1200px) and (max-width: 800px) { .home #hero .flexslider .slides li > div.howto-slide .slide-info h3 { font-size: 2em; } } @media screen and (max-width: 1200px) and (max-width: 640px) { .home #hero .flexslider .slides li > div.howto-slide .slide-info h3 { font-size: 2.5em; } } @media screen and (max-width: 1200px) and (max-width: 480px) { .home #hero .flexslider .slides li > div.howto-slide .slide-info h3 { font-size: 2em; } } @media screen and (max-width: 900px) { .home #hero .flexslider .slides li > div.howto-slide .slide-info h3 { line-height: 1em; } } @media screen and (max-width: 900px) and (min-width: 1281px) { .home #hero .flexslider .slides li > div.howto-slide .slide-info h3 { font-size: 1.75em; } } @media screen and (max-width: 900px) and (max-width: 1280px) { .home #hero .flexslider .slides li > div.howto-slide .slide-info h3 { font-size: 1.6625em; } } @media screen and (max-width: 900px) and (max-width: 1120px) { .home #hero .flexslider .slides li > div.howto-slide .slide-info h3 { font-size: 1.575em; } } @media screen and (max-width: 900px) and (max-width: 960px) { .home #hero .flexslider .slides li > div.howto-slide .slide-info h3 { font-size: 1.4875em; } } @media screen and (max-width: 900px) and (max-width: 800px) { .home #hero .flexslider .slides li > div.howto-slide .slide-info h3 { font-size: 1.4em; } } @media screen and (max-width: 900px) and (max-width: 640px) { .home #hero .flexslider .slides li > div.howto-slide .slide-info h3 { font-size: 1.75em; } } @media screen and (max-width: 900px) and (max-width: 480px) { .home #hero .flexslider .slides li > div.howto-slide .slide-info h3 { font-size: 1.4em; } } .home #hero .flexslider .slides li > div.howto-slide .slide-info p { padding-left: 0; max-width: 430px; } @media screen and (max-width: 640px) { .home #hero .flexslider .slides li > div.butterball-it-slide .backdrop { display: none; } } @media screen and (max-width: 640px) { .home #hero .flexslider .slides li > div.butterball-it-slide { background-color: #005aa2; } } @media screen and (max-width: 640px) { .home #hero .flexslider .slides li > div.butterball-it-slide .slide-info p { color: #FFF !important; } } /*.home #hero .flexslider .slides li > div.butterball-it-slide .slide-info { background: url("images/butterball-it-logo.png") center top no-repeat; left: 6%; top: 30%; width: 49%; padding-top: 11%; min-width: 329px; }*/ /*.home #hero .flexslider .slides li > div.butterball-it-slide .slide-info { background: url("images/butterball-it-logo.png") center top no-repeat; left: 25%; top: 30%; width: 49%; padding-top: 11%; min-width: 329px; text-align: center; }*/ .home #hero .flexslider .slides li > div.butterball-it-slide .slide-info { /*background: url("images/butterball-it-logo.png") center top no-repeat;*/ left: 25%; top: 0; width: 49%; padding-top: 11%; min-width: 329px; text-align: center; } .bbis-caption { bottom: 10px; color: #FFF !important; font-size: 10pt !important; position: absolute; right: 10px; text-align: right; width: 275px; } @media screen and (max-width: 1300px) { .home #hero .flexslider .slides li > div.butterball-it-slide .slide-info { padding-top: 13%; } } @media screen and (max-width: 1200px) { .home #hero .flexslider .slides li > div.butterball-it-slide .slide-info { padding-top: 14%; } } @media screen and (max-width: 1000px) { .home #hero .flexslider .slides li > div.butterball-it-slide .slide-info { padding-top: 18%; } } @media screen and (max-width: 800px) { .home #hero .flexslider .slides li > div.butterball-it-slide .slide-info { padding-top: 22%; } } @media screen and (max-width: 640px) { .home #hero .flexslider .slides li > div.butterball-it-slide .slide-info { padding-top: 28%; } .bbis-caption { display: none } } @media screen and (max-width: 530px) { .home #hero .flexslider .slides li > div.butterball-it-slide .slide-info { padding-top: 33%; background-size: 300px; min-width: 0px; padding-left: 0; padding-right: 0; } } @media screen and (max-width: 400px) { .home #hero .flexslider .slides li > div.butterball-it-slide .slide-info { padding-top: 38%; } } .home #hero .flexslider .slides li > div.butterball-it-slide .slide-info h3 { font-size: 25px; line-height: 27px; text-align: center; letter-spacing: -1px; color: #085daa; } @media screen and (max-width: 1200px) { .home #hero .flexslider .slides li > div.butterball-it-slide .slide-info h3 { font-size: 21px; line-height: 23px; } } @media screen and (max-width: 530px) { .home #hero .flexslider .slides li > div.butterball-it-slide .slide-info h3 { padding: 0 10px; } } .home #hero .flexslider .slides li > div.butterball-it-slide .slide-info h3 sup { left: -3px; } @media screen and (max-width: 640px) { .home #hero .flexslider .slides li > div.butterball-it-slide .slide-info p { padding-left: 0; } } .home #hero .flexslider .slides li > div.butterball-it-slide .slide-info form { width: 340px; height: 58px; background: url("../images/home/butterball-it-home-search-background-blue.png") no-repeat; padding: 8px 7px 20px 7px; margin: 24px auto 0 auto; } @media screen and (max-width: 1200px) { .home #hero .flexslider .slides li > div.butterball-it-slide .slide-info form { margin-top: 14px; } } @media screen and (max-width: 530px) { .home #hero .flexslider .slides li > div.butterball-it-slide .slide-info form { width: 320px; background-size: 100%; } } .home #hero .flexslider .slides li > div.butterball-it-slide .slide-info form #home-search-icon { float: left; width: 26px; height: 29px; margin-top: 2px; } @media screen and (max-width: 530px) { .home #hero .flexslider .slides li > div.butterball-it-slide .slide-info form #home-search-icon { height: 31px; } } .home #hero .flexslider .slides li > div.butterball-it-slide .slide-info form #homepage-search { float: left; width: 290px; height: 34px; background: none; border: none; clear: none; box-shadow: none; margin: 0; border-radius: 0; padding: 9px 11px 7px 11px; font-size: 16px; line-height: 18px; color: #888888; text-transform: uppercase; } @media screen and (max-width: 530px) { .home #hero .flexslider .slides li > div.butterball-it-slide .slide-info form #homepage-search { padding-top: 10px; height: 31px; width: 270px; } } .home #crisis { background: #f9e90d; padding: 21px 0; } @media screen and (min-width: 640px) { .home #crisis .columns:first-child { border-right: #99b14c solid 1px; } } .home #crisis h3 { margin: 9px 0; background: url("images/icons/crisis-icon.png") no-repeat; padding: 4px 0 0 90px; min-height: 55px; line-height: 1em; text-shadow: 1px 1px 2px #969696; } @media screen and (min-width: 1281px) { .home #crisis h3 { font-size: 1.75em; } } @media screen and (max-width: 1280px) { .home #crisis h3 { font-size: 1.6625em; } } @media screen and (max-width: 1120px) { .home #crisis h3 { font-size: 1.575em; } } @media screen and (max-width: 960px) { .home #crisis h3 { font-size: 1.4875em; } } @media screen and (max-width: 800px) { .home #crisis h3 { font-size: 1.4em; } } @media screen and (max-width: 640px) { .home #crisis h3 { font-size: 1.75em; } } @media screen and (max-width: 480px) { .home #crisis h3 { font-size: 1.4em; } } .home #crisis p { margin: 0; color: #09457d; font-family: "Kievit Book"; line-height: 1.2381em; } @media screen and (min-width: 1281px) { .home #crisis p { font-size: 1.3125em; } } @media screen and (max-width: 1280px) { .home #crisis p { font-size: 1.24688em; } } @media screen and (max-width: 1120px) { .home #crisis p { font-size: 1.18125em; } } @media screen and (max-width: 960px) { .home #crisis p { font-size: 1.11562em; } } @media screen and (max-width: 800px) { .home #crisis p { font-size: 1.05em; } } @media screen and (max-width: 640px) { .home #crisis p { font-size: 1.3125em; } } @media screen and (max-width: 480px) { .home #crisis p { font-size: 1.05em; } } .home #crisis p a.carrot { line-height: 1em; } @media screen and (min-width: 1281px) { .home #crisis p a.carrot { font-size: 1em; } } @media screen and (max-width: 1280px) { .home #crisis p a.carrot { font-size: 0.95em; } } @media screen and (max-width: 1120px) { .home #crisis p a.carrot { font-size: 0.9em; } } @media screen and (max-width: 960px) { .home #crisis p a.carrot { font-size: 0.85em; } } @media screen and (max-width: 800px) { .home #crisis p a.carrot { font-size: 0.8em; } } @media screen and (max-width: 640px) { .home #crisis p a.carrot { font-size: 1em; } } @media screen and (max-width: 480px) { .home #crisis p a.carrot { font-size: 0.8em; } } .home #callouts figure figcaption { padding-bottom: 1em; } .home #callouts figure figcaption p { height: auto; min-height: 5em; } .home #callouts #callout-mid { min-height: 600px; } @media screen and (max-width: 1120px) { .home #callouts #callout-mid { min-height: 544px; } } @media screen and (max-width: 960px) { .home #callouts #callout-mid { min-height: 512px; } } @media screen and (max-width: 800px) { .home #callouts #callout-mid { min-height: 468px; } } .turketarian #main { background: url("images/backgrounds/crosshatch.png") repeat-x; background-color: #71bade; background: url("images/backgrounds/crosshatch.png"), -webkit-linear-gradient(to bottom, #5ebbe9 0%, #5ebbe9 69px, #66b9e2 162px, #71bade 254px, #80bfdd 315px, #99c9e1 408px, #c4e2f1 562px, #e1f5ff 654px, #e1f5ff 100%), repeat-x #71bade; background: url("images/backgrounds/crosshatch.png"), -moz-linear-gradient(to bottom, #5ebbe9 0%, #5ebbe9 69px, #66b9e2 162px, #71bade 254px, #80bfdd 315px, #99c9e1 408px, #c4e2f1 562px, #e1f5ff 654px, #e1f5ff 100%), repeat-x #71bade; background: url("images/backgrounds/crosshatch.png"), -ms-linear-gradient(to bottom, #5ebbe9 0%, #5ebbe9 69px, #66b9e2 162px, #71bade 254px, #80bfdd 315px, #99c9e1 408px, #c4e2f1 562px, #e1f5ff 654px, #e1f5ff 100%), repeat-x #71bade; background: url("images/backgrounds/crosshatch.png"), -o-linear-gradient(to bottom, #5ebbe9 0%, #5ebbe9 69px, #66b9e2 162px, #71bade 254px, #80bfdd 315px, #99c9e1 408px, #c4e2f1 562px, #e1f5ff 654px, #e1f5ff 100%), repeat-x #71bade; background: url("images/backgrounds/crosshatch.png"), linear-gradient(to bottom, #5ebbe9 0%, #5ebbe9 69px, #66b9e2 162px, #71bade 254px, #80bfdd 315px, #99c9e1 408px, #c4e2f1 562px, #e1f5ff 654px, #e1f5ff 100%), repeat-x #71bade; background-repeat: repeat-x; } @media screen and (max-width: 640px) { .turketarian #main { background: #e1f5ff url("images/backgrounds/crosshatch-mobile.png") no-repeat; } } .turketarian article { position: relative; padding-bottom: 70px; } @media screen and (max-width: 768px) { .turketarian article { padding-bottom: 0; } } .turketarian article .hero-image { position: absolute; z-index: 0; top: 135px; right: -26%; height: 1017px; width: 1131px; } @media screen and (max-width: 1280px) { .turketarian article .hero-image { right: -30%; } } @media screen and (max-width: 1250px) { .turketarian article .hero-image { top: 150px; right: -400px; } } @media screen and (max-width: 1120px) { .turketarian article .hero-image { top: 180px; right: -450px; } } @media screen and (max-width: 1080px) { .turketarian article .hero-image { top: 180px; right: -500px; } } @media screen and (max-width: 960px) { .turketarian article .hero-image { top: 210px; right: -610px; } } @media screen and (max-width: 950px) { .turketarian article .hero-image { top: 120px; right: -610px; } } @media screen and (max-width: 800px) { .turketarian article .hero-image { top: 190px; right: -690px; } } @media screen and (max-width: 720px) { .turketarian article .hero-image { right: -680px; } } @media screen and (max-width: 664px) { .turketarian article .hero-image { display: none; } } @media screen and (max-width: 1120px) { .turketarian article .hero-image img { width: 1010px; } } @media screen and (max-width: 960px) { .turketarian article .hero-image img { width: 880px; } } @media screen and (max-width: 800px) { .turketarian article .hero-image img { width: 700px; } } .turketarian article .turketarian-hero { position: relative; z-index: 0; padding: 150px 0 0 0; position: relative; z-index: 2; top: 0; left: 0; } @media screen and (max-width: 950px) { .turketarian article .turketarian-hero { padding: 75px 0 0 0; } } .turketarian article .turketarian-hero.logged-in { padding: 150px 0 55px 0; } @media screen and (max-width: 640px) { .turketarian article .turketarian-hero.logged-in { padding-top: 50px; } } .turketarian article .turketarian-hero h5 { line-height: 1em; margin: 0; font-family: "Kievit Medium"; color: #404040; font-weight: normal; } @media screen and (min-width: 1281px) { .turketarian article .turketarian-hero h5 { font-size: 1em; } } @media screen and (max-width: 1280px) { .turketarian article .turketarian-hero h5 { font-size: 0.95em; } } @media screen and (max-width: 1120px) { .turketarian article .turketarian-hero h5 { font-size: 0.9em; } } @media screen and (max-width: 960px) { .turketarian article .turketarian-hero h5 { font-size: 0.85em; } } @media screen and (max-width: 800px) { .turketarian article .turketarian-hero h5 { font-size: 0.8em; } } @media screen and (max-width: 640px) { .turketarian article .turketarian-hero h5 { font-size: 1em; } } @media screen and (max-width: 480px) { .turketarian article .turketarian-hero h5 { font-size: 0.8em; } } @media screen and (max-width: 950px) { .turketarian article .turketarian-hero h5 { line-height: 1.3em; } } @media screen and (max-width: 950px) and (min-width: 1281px) { .turketarian article .turketarian-hero h5 { font-size: 1.1em; } } @media screen and (max-width: 950px) and (max-width: 1280px) { .turketarian article .turketarian-hero h5 { font-size: 1.045em; } } @media screen and (max-width: 950px) and (max-width: 1120px) { .turketarian article .turketarian-hero h5 { font-size: 0.99em; } } @media screen and (max-width: 950px) and (max-width: 960px) { .turketarian article .turketarian-hero h5 { font-size: 0.935em; } } @media screen and (max-width: 950px) and (max-width: 800px) { .turketarian article .turketarian-hero h5 { font-size: 0.88em; } } @media screen and (max-width: 950px) and (max-width: 640px) { .turketarian article .turketarian-hero h5 { font-size: 1.1em; } } @media screen and (max-width: 950px) and (max-width: 480px) { .turketarian article .turketarian-hero h5 { font-size: 0.88em; } } .turketarian article .turketarian-hero .headline { padding: 95px 0 10px 0; margin: 0 0 25px 0; border-bottom: solid 1px #085daa; float: left; } @media screen and (max-width: 640px) { .turketarian article .turketarian-hero .headline { padding-top: 0; } } .turketarian article .turketarian-hero .headline .badge { float: left; } .turketarian article .turketarian-hero .headline .headline-text { float: left; margin-top: 20px; } @media screen and (max-width: 950px) { .turketarian article .turketarian-hero .headline .headline-text { display: block; } } .turketarian article .turketarian-hero .headline .headline-text h3 { line-height: 1em; font-family: "Kievit black"; text-shadow: 1px 2px 0px #a2b1b8; color: #09457d; margin: 0; text-transform: uppercase; } @media screen and (min-width: 1281px) { .turketarian article .turketarian-hero .headline .headline-text h3 { font-size: 2.8em; } } @media screen and (max-width: 1280px) { .turketarian article .turketarian-hero .headline .headline-text h3 { font-size: 2.66em; } } @media screen and (max-width: 1120px) { .turketarian article .turketarian-hero .headline .headline-text h3 { font-size: 2.52em; } } @media screen and (max-width: 960px) { .turketarian article .turketarian-hero .headline .headline-text h3 { font-size: 2.38em; } } @media screen and (max-width: 800px) { .turketarian article .turketarian-hero .headline .headline-text h3 { font-size: 2.24em; } } @media screen and (max-width: 640px) { .turketarian article .turketarian-hero .headline .headline-text h3 { font-size: 2.8em; } } @media screen and (max-width: 480px) { .turketarian article .turketarian-hero .headline .headline-text h3 { font-size: 2.24em; } } .turketarian article .turketarian-hero .headline .headline-text h3 strong { line-height: 1em; color: #085daa; } @media screen and (min-width: 1281px) { .turketarian article .turketarian-hero .headline .headline-text h3 strong { font-size: 1.805em; } } @media screen and (max-width: 1280px) { .turketarian article .turketarian-hero .headline .headline-text h3 strong { font-size: 1.71475em; } } @media screen and (max-width: 1120px) { .turketarian article .turketarian-hero .headline .headline-text h3 strong { font-size: 1.6245em; } } @media screen and (max-width: 960px) { .turketarian article .turketarian-hero .headline .headline-text h3 strong { font-size: 1.53425em; } } @media screen and (max-width: 800px) { .turketarian article .turketarian-hero .headline .headline-text h3 strong { font-size: 1.444em; } } @media screen and (max-width: 640px) { .turketarian article .turketarian-hero .headline .headline-text h3 strong { font-size: 1.805em; } } @media screen and (max-width: 480px) { .turketarian article .turketarian-hero .headline .headline-text h3 strong { font-size: 1.444em; } } @media screen and (max-width: 950px) { .turketarian article .turketarian-hero .headline .headline-text h3 { font-size: 2em; font-family: "Kievit Bold"; } .turketarian article .turketarian-hero .headline .headline-text h3 strong { line-height: 1em; } } @media screen and (max-width: 950px) and (min-width: 1281px) { .turketarian article .turketarian-hero .headline .headline-text h3 strong { font-size: 1.75em; } } @media screen and (max-width: 950px) and (max-width: 1280px) { .turketarian article .turketarian-hero .headline .headline-text h3 strong { font-size: 1.6625em; } } @media screen and (max-width: 950px) and (max-width: 1120px) { .turketarian article .turketarian-hero .headline .headline-text h3 strong { font-size: 1.575em; } } @media screen and (max-width: 950px) and (max-width: 960px) { .turketarian article .turketarian-hero .headline .headline-text h3 strong { font-size: 1.4875em; } } @media screen and (max-width: 950px) and (max-width: 800px) { .turketarian article .turketarian-hero .headline .headline-text h3 strong { font-size: 1.4em; } } @media screen and (max-width: 950px) and (max-width: 640px) { .turketarian article .turketarian-hero .headline .headline-text h3 strong { font-size: 1.75em; } } @media screen and (max-width: 950px) and (max-width: 480px) { .turketarian article .turketarian-hero .headline .headline-text h3 strong { font-size: 1.4em; } } .turketarian article .turketarian-hero h4 { line-height: 1em; font-family: "Kievit Book"; color: #085daa; margin: 0 0 5px 0; width: 62%; clear: both; } @media screen and (min-width: 1281px) { .turketarian article .turketarian-hero h4 { font-size: 1.25em; } } @media screen and (max-width: 1280px) { .turketarian article .turketarian-hero h4 { font-size: 1.1875em; } } @media screen and (max-width: 1120px) { .turketarian article .turketarian-hero h4 { font-size: 1.125em; } } @media screen and (max-width: 960px) { .turketarian article .turketarian-hero h4 { font-size: 1.0625em; } } @media screen and (max-width: 800px) { .turketarian article .turketarian-hero h4 { font-size: 1em; } } @media screen and (max-width: 640px) { .turketarian article .turketarian-hero h4 { font-size: 1.25em; } } @media screen and (max-width: 480px) { .turketarian article .turketarian-hero h4 { font-size: 1em; } } @media screen and (max-width: 950px) { .turketarian article .turketarian-hero h4 { line-height: 1em; width: 100%; } } @media screen and (max-width: 950px) and (min-width: 1281px) { .turketarian article .turketarian-hero h4 { font-size: 1.5625em; } } @media screen and (max-width: 950px) and (max-width: 1280px) { .turketarian article .turketarian-hero h4 { font-size: 1.48438em; } } @media screen and (max-width: 950px) and (max-width: 1120px) { .turketarian article .turketarian-hero h4 { font-size: 1.40625em; } } @media screen and (max-width: 950px) and (max-width: 960px) { .turketarian article .turketarian-hero h4 { font-size: 1.32813em; } } @media screen and (max-width: 950px) and (max-width: 800px) { .turketarian article .turketarian-hero h4 { font-size: 1.25em; } } @media screen and (max-width: 950px) and (max-width: 640px) { .turketarian article .turketarian-hero h4 { font-size: 1.5625em; } } @media screen and (max-width: 950px) and (max-width: 480px) { .turketarian article .turketarian-hero h4 { font-size: 1.25em; } } .turketarian article .turketarian-hero p { line-height: 1.3em; font-family: "Kievit Book"; color: #363636; margin-top: 0; margin-bottom: 2em; width: 48%; } @media screen and (min-width: 1281px) { .turketarian article .turketarian-hero p { font-size: 1.25em; } } @media screen and (max-width: 1280px) { .turketarian article .turketarian-hero p { font-size: 1.1875em; } } @media screen and (max-width: 1120px) { .turketarian article .turketarian-hero p { font-size: 1.125em; } } @media screen and (max-width: 960px) { .turketarian article .turketarian-hero p { font-size: 1.0625em; } } @media screen and (max-width: 800px) { .turketarian article .turketarian-hero p { font-size: 1em; } } @media screen and (max-width: 640px) { .turketarian article .turketarian-hero p { font-size: 1.25em; } } @media screen and (max-width: 480px) { .turketarian article .turketarian-hero p { font-size: 1em; } } @media screen and (max-width: 640px) { .turketarian article .turketarian-hero p { line-height: 1.24em; width: 100%; } } @media screen and (max-width: 640px) and (min-width: 1281px) { .turketarian article .turketarian-hero p { font-size: 1.5625em; } } @media screen and (max-width: 640px) and (max-width: 1280px) { .turketarian article .turketarian-hero p { font-size: 1.48438em; } } @media screen and (max-width: 640px) and (max-width: 1120px) { .turketarian article .turketarian-hero p { font-size: 1.40625em; } } @media screen and (max-width: 640px) and (max-width: 960px) { .turketarian article .turketarian-hero p { font-size: 1.32813em; } } @media screen and (max-width: 640px) and (max-width: 800px) { .turketarian article .turketarian-hero p { font-size: 1.25em; } } @media screen and (max-width: 640px) and (max-width: 640px) { .turketarian article .turketarian-hero p { font-size: 1.5625em; } } @media screen and (max-width: 640px) and (max-width: 480px) { .turketarian article .turketarian-hero p { font-size: 1.25em; } } .turketarian article .turketarian-hero .buttons { padding: 0 0 4.375em 0; } .turketarian article .turketarian-hero .buttons a img { margin: 1.25em 1em 0 0; } @media screen and (max-width: 640px) { .turketarian #sticky-bar .columns { width: 33%; } .turketarian #sticky-bar .columns:first-child { width: 33%; } } @media screen and (max-width: 950px) { .turketarian .turketarian-hero.logged-in .large-2 { width: 35%; padding-top: 44px; } .turketarian .turketarian-hero.logged-in .small-6 { width: 50%; clear: both; } } @media screen and (max-width: 640px) { .turketarian .turketarian-hero.logged-in .large-2 { padding-top: 0; } .turketarian .turketarian-hero.logged-in .small-12 { width: 100%; } .turketarian .turketarian-hero.logged-in .small-6 { width: 50%; clear: none; } } .turketarian .turketarian-hero.logged-in .badge { padding: 95px 0 0 0; } @media screen and (max-width: 950px) { .turketarian .turketarian-hero.logged-in .badge { padding: 20px 0 0 0; } } .turketarian .turketarian-hero.logged-in .badge .email-badge .row { padding: 0; } @media screen and (max-width: 950px) { .turketarian .turketarian-hero.logged-in .badge .email-badge .row .small-6 { width: 100%; } } @media screen and (max-width: 640px) { .turketarian .turketarian-hero.logged-in .badge .email-badge .row .small-6 { width: 50%; } } .turketarian .turketarian-hero.logged-in .badge .email-badge .row p { width: 100%; color: #09457d; line-height: 1.26em; font-family: "Kievit Medium"; margin: 0 0 1em 0; } @media screen and (min-width: 1281px) { .turketarian .turketarian-hero.logged-in .badge .email-badge .row p { font-size: 0.9375em; } } @media screen and (max-width: 1280px) { .turketarian .turketarian-hero.logged-in .badge .email-badge .row p { font-size: 0.89063em; } } @media screen and (max-width: 1120px) { .turketarian .turketarian-hero.logged-in .badge .email-badge .row p { font-size: 0.84375em; } } @media screen and (max-width: 960px) { .turketarian .turketarian-hero.logged-in .badge .email-badge .row p { font-size: 0.79688em; } } @media screen and (max-width: 800px) { .turketarian .turketarian-hero.logged-in .badge .email-badge .row p { font-size: 0.75em; } } @media screen and (max-width: 640px) { .turketarian .turketarian-hero.logged-in .badge .email-badge .row p { font-size: 0.9375em; } } @media screen and (max-width: 480px) { .turketarian .turketarian-hero.logged-in .badge .email-badge .row p { font-size: 0.75em; } } @media screen and (max-width: 640px) { .turketarian .turketarian-hero.logged-in .badge .email-badge .row p { margin-top: 45px; } } .turketarian .turketarian-hero.logged-in .badge .email-badge .row .button { width: 134px; display: block; max-width: 100%; } @media screen and (max-width: 950px) { .turketarian .turketarian-hero.logged-in .badge .email-badge .row .button { margin-bottom: 40px; } } @media screen and (max-width: 640px) { .turketarian .turketarian-hero.logged-in .badge .email-badge .row .button { margin-bottom: 0; } } .turketarian .turketarian-hero.logged-in .headline { border: none; } @media screen and (max-width: 950px) { .turketarian .turketarian-hero.logged-in .headline { padding: 30px 0 25px 0; border: none; } } @media screen and (max-width: 640px) { .turketarian .turketarian-hero.logged-in .headline { padding: 0; } } .turketarian .turketarian-hero.logged-in .headline .headline-text { margin: 0; } .turketarian .turketarian-hero.logged-in .headline .headline-text p { font-size: 1.0625em; line-height: 1.47em; width: 95%; } @media screen and (max-width: 950px) { .turketarian .turketarian-hero.logged-in .headline .headline-text { display: block; margin: 34px 0 0 0; } } .turketarian .turketarian-hero.logged-in .aside { padding-top: 90px; } .turketarian .turketarian-hero.logged-in .aside > img { float: right; } .turketarian .turketarian-hero.logged-in .aside .profile-progress { float: right; width: 100%; } .turketarian .turketarian-hero.logged-in .aside .profile-progress .progress { width: 100%; } .turketarian .turketarian-hero.logged-in .aside .profile-progress .profile-cta { line-height: 0.9em; font-family: "Kievit Book"; color: #404040; text-transform: uppercase; margin: 15px 0 0 0; } @media screen and (min-width: 1281px) { .turketarian .turketarian-hero.logged-in .aside .profile-progress .profile-cta { font-size: 1.3125em; } } @media screen and (max-width: 1280px) { .turketarian .turketarian-hero.logged-in .aside .profile-progress .profile-cta { font-size: 1.24688em; } } @media screen and (max-width: 1120px) { .turketarian .turketarian-hero.logged-in .aside .profile-progress .profile-cta { font-size: 1.18125em; } } @media screen and (max-width: 960px) { .turketarian .turketarian-hero.logged-in .aside .profile-progress .profile-cta { font-size: 1.11562em; } } @media screen and (max-width: 800px) { .turketarian .turketarian-hero.logged-in .aside .profile-progress .profile-cta { font-size: 1.05em; } } @media screen and (max-width: 640px) { .turketarian .turketarian-hero.logged-in .aside .profile-progress .profile-cta { font-size: 1.3125em; } } @media screen and (max-width: 480px) { .turketarian .turketarian-hero.logged-in .aside .profile-progress .profile-cta { font-size: 1.05em; } } .turketarian .turketarian-hero.logged-in .aside .profile-progress .profile-cta strong { line-height: 0.9em; font-family: "Kievit Medium"; color: #09457d; display: block; } @media screen and (min-width: 1281px) { .turketarian .turketarian-hero.logged-in .aside .profile-progress .profile-cta strong { font-size: 1.037em; } } @media screen and (max-width: 1280px) { .turketarian .turketarian-hero.logged-in .aside .profile-progress .profile-cta strong { font-size: 0.98515em; } } @media screen and (max-width: 1120px) { .turketarian .turketarian-hero.logged-in .aside .profile-progress .profile-cta strong { font-size: 0.9333em; } } @media screen and (max-width: 960px) { .turketarian .turketarian-hero.logged-in .aside .profile-progress .profile-cta strong { font-size: 0.88145em; } } @media screen and (max-width: 800px) { .turketarian .turketarian-hero.logged-in .aside .profile-progress .profile-cta strong { font-size: 0.8296em; } } @media screen and (max-width: 640px) { .turketarian .turketarian-hero.logged-in .aside .profile-progress .profile-cta strong { font-size: 1.037em; } } @media screen and (max-width: 480px) { .turketarian .turketarian-hero.logged-in .aside .profile-progress .profile-cta strong { font-size: 0.8296em; } } .turketarian .turketarian-hero.logged-in .aside .profile-progress .carrot { line-height: 0.9em; font-family: "Kievit Bold"; color: #0097dc; margin: 10px 0 0 0; display: block; } @media screen and (min-width: 1281px) { .turketarian .turketarian-hero.logged-in .aside .profile-progress .carrot { font-size: 1em; } } @media screen and (max-width: 1280px) { .turketarian .turketarian-hero.logged-in .aside .profile-progress .carrot { font-size: 0.95em; } } @media screen and (max-width: 1120px) { .turketarian .turketarian-hero.logged-in .aside .profile-progress .carrot { font-size: 0.9em; } } @media screen and (max-width: 960px) { .turketarian .turketarian-hero.logged-in .aside .profile-progress .carrot { font-size: 0.85em; } } @media screen and (max-width: 800px) { .turketarian .turketarian-hero.logged-in .aside .profile-progress .carrot { font-size: 0.8em; } } @media screen and (max-width: 640px) { .turketarian .turketarian-hero.logged-in .aside .profile-progress .carrot { font-size: 1em; } } @media screen and (max-width: 480px) { .turketarian .turketarian-hero.logged-in .aside .profile-progress .carrot { font-size: 0.8em; } } @media screen and (max-width: 950px) { .turketarian .turketarian-hero.logged-in .aside { padding-bottom: 30px; padding-top: 0px; float: left; } .turketarian .turketarian-hero.logged-in .aside > img { float: none; } .turketarian .turketarian-hero.logged-in .aside .profile-progress { float: none; } } .turketarian .turketarian-hero.logged-in nav { z-index: 2; height: 42px; background: #3987c0; background-color: rgba(57, 135, 192, 0.6); width: 100%; } @media screen and (max-width: 640px) { .turketarian .turketarian-hero.logged-in nav { height: 75px; } .turketarian .turketarian-hero.logged-in nav a, .turketarian .turketarian-hero.logged-in nav a:visited, .turketarian .turketarian-hero.logged-in nav a:hover, .turketarian .turketarian-hero.logged-in nav a:focus, .turketarian .turketarian-hero.logged-in nav a:active { line-height: 1.111em; vertical-align: top; padding: 26px 0 0 0; height: auto; text-align: center; } } @media screen and (max-width: 640px) and (min-width: 1281px) { .turketarian .turketarian-hero.logged-in nav a, .turketarian .turketarian-hero.logged-in nav a:visited, .turketarian .turketarian-hero.logged-in nav a:hover, .turketarian .turketarian-hero.logged-in nav a:focus, .turketarian .turketarian-hero.logged-in nav a:active { font-size: 1.125em; } } @media screen and (max-width: 640px) and (max-width: 1280px) { .turketarian .turketarian-hero.logged-in nav a, .turketarian .turketarian-hero.logged-in nav a:visited, .turketarian .turketarian-hero.logged-in nav a:hover, .turketarian .turketarian-hero.logged-in nav a:focus, .turketarian .turketarian-hero.logged-in nav a:active { font-size: 1.06875em; } } @media screen and (max-width: 640px) and (max-width: 1120px) { .turketarian .turketarian-hero.logged-in nav a, .turketarian .turketarian-hero.logged-in nav a:visited, .turketarian .turketarian-hero.logged-in nav a:hover, .turketarian .turketarian-hero.logged-in nav a:focus, .turketarian .turketarian-hero.logged-in nav a:active { font-size: 1.0125em; } } @media screen and (max-width: 640px) and (max-width: 960px) { .turketarian .turketarian-hero.logged-in nav a, .turketarian .turketarian-hero.logged-in nav a:visited, .turketarian .turketarian-hero.logged-in nav a:hover, .turketarian .turketarian-hero.logged-in nav a:focus, .turketarian .turketarian-hero.logged-in nav a:active { font-size: 0.95625em; } } @media screen and (max-width: 640px) and (max-width: 800px) { .turketarian .turketarian-hero.logged-in nav a, .turketarian .turketarian-hero.logged-in nav a:visited, .turketarian .turketarian-hero.logged-in nav a:hover, .turketarian .turketarian-hero.logged-in nav a:focus, .turketarian .turketarian-hero.logged-in nav a:active { font-size: 0.9em; } } @media screen and (max-width: 640px) and (max-width: 640px) { .turketarian .turketarian-hero.logged-in nav a, .turketarian .turketarian-hero.logged-in nav a:visited, .turketarian .turketarian-hero.logged-in nav a:hover, .turketarian .turketarian-hero.logged-in nav a:focus, .turketarian .turketarian-hero.logged-in nav a:active { font-size: 1.125em; } } @media screen and (max-width: 640px) and (max-width: 480px) { .turketarian .turketarian-hero.logged-in nav a, .turketarian .turketarian-hero.logged-in nav a:visited, .turketarian .turketarian-hero.logged-in nav a:hover, .turketarian .turketarian-hero.logged-in nav a:focus, .turketarian .turketarian-hero.logged-in nav a:active { font-size: 0.9em; } } .turketarian .panel .button { margin: 0 12px 12px 0; float: left; line-height: 1em; min-width: 228px; } @media screen and (min-width: 1281px) { .turketarian .panel .button { font-size: 0.9375em; } } @media screen and (max-width: 1280px) { .turketarian .panel .button { font-size: 0.89063em; } } @media screen and (max-width: 1120px) { .turketarian .panel .button { font-size: 0.84375em; } } @media screen and (max-width: 960px) { .turketarian .panel .button { font-size: 0.79688em; } } @media screen and (max-width: 800px) { .turketarian .panel .button { font-size: 0.75em; } } @media screen and (max-width: 640px) { .turketarian .panel .button { font-size: 0.9375em; } } @media screen and (max-width: 480px) { .turketarian .panel .button { font-size: 0.75em; } } @media screen and (max-width: 900px) { .turketarian .panel .button { min-width: 0; } } @media screen and (max-width: 640px) { .turketarian .panel .button { width: 48%; float: right; margin-right: 0; padding-right: 9%; padding-left: 9%; height: 58px; } .turketarian .panel .button.gray { float: left; } } @media screen and (max-width: 480px) { .turketarian .panel .button { height: 52px; } } .turketarian .panel form { float: right; } @media screen and (max-width: 640px) { .turketarian .panel form { width: 100%; } } .turketarian .panel #filter, .turketarian .panel .custom.dropdown { float: right; width: 190px; z-index: 10; margin: 0 0 15px 0; } @media screen and (max-width: 900px) { .turketarian .panel #filter, .turketarian .panel .custom.dropdown { min-width: 0; } } @media screen and (max-width: 640px) { .turketarian .panel #filter, .turketarian .panel .custom.dropdown { float: left; width: 100%; margin: 0 12px 12px 0; } } @media screen and (max-width: 1080px) { .turketarian .grid #column1, .turketarian .grid #column2 { width: 100%; } } .turketarian .grid .small > span { width: 100% !Important; height: 100%; } .turketarian .grid .grid-item { width: 100%; margin: 0 0 25px 0; -webkit-box-shadow: 3px 3px 2px rgba(0, 0, 0, 0.33); -moz-box-shadow: 3px 3px 2px rgba(0, 0, 0, 0.33); box-shadow: 3px 3px 2px rgba(0, 0, 0, 0.33); overflow: hidden; } .turketarian .grid .grid-item .background { position: absolute; top: 0; left: 0; z-index: 1; width: 100%; } .turketarian .grid .grid-item .info-panel { position: absolute; bottom: 0; left: 0; z-index: 2; text-transform: uppercase; width: 100%; } .turketarian .grid .grid-item .info-panel a { text-decoration: none; } .turketarian .grid .grid-item .info-panel .info-footer { position: absolute; bottom: 15px; left: 27px; } .turketarian .grid .grid-item .info-panel .info-footer .stars { padding: 0 19px 0 0; display: inline-block; } @media screen and (max-width: 640px) { .turketarian .grid .grid-item .info-panel .info-footer .stars { display: block; padding: 0 19px 10px 0; } } .turketarian .grid .grid-item .info-panel .info-footer .stars a { display: inline-block; background: url("images/sprites/star.recommend.png") -20px 0 no-repeat; width: 20px; height: 19px; margin: 0 3px 0 0; } .turketarian .grid .grid-item .info-panel .info-footer .stars a.on { background-position: 0 0; } .turketarian .grid .grid-item .info-panel .info-footer a.fav, .turketarian .grid .grid-item .info-panel .info-footer a.comments { display: inline-block; color: #0097dc; line-height: 1em; font-family: "Kievit Bold"; line-height: 23px; vertical-align: top; } @media screen and (min-width: 1281px) { .turketarian .grid .grid-item .info-panel .info-footer a.fav, .turketarian .grid .grid-item .info-panel .info-footer a.comments { font-size: 0.9375em; } } @media screen and (max-width: 1280px) { .turketarian .grid .grid-item .info-panel .info-footer a.fav, .turketarian .grid .grid-item .info-panel .info-footer a.comments { font-size: 0.89063em; } } @media screen and (max-width: 1120px) { .turketarian .grid .grid-item .info-panel .info-footer a.fav, .turketarian .grid .grid-item .info-panel .info-footer a.comments { font-size: 0.84375em; } } @media screen and (max-width: 960px) { .turketarian .grid .grid-item .info-panel .info-footer a.fav, .turketarian .grid .grid-item .info-panel .info-footer a.comments { font-size: 0.79688em; } } @media screen and (max-width: 800px) { .turketarian .grid .grid-item .info-panel .info-footer a.fav, .turketarian .grid .grid-item .info-panel .info-footer a.comments { font-size: 0.75em; } } @media screen and (max-width: 640px) { .turketarian .grid .grid-item .info-panel .info-footer a.fav, .turketarian .grid .grid-item .info-panel .info-footer a.comments { font-size: 0.9375em; } } @media screen and (max-width: 480px) { .turketarian .grid .grid-item .info-panel .info-footer a.fav, .turketarian .grid .grid-item .info-panel .info-footer a.comments { font-size: 0.75em; } } .turketarian .grid .grid-item .info-panel .info-footer a.fav.delete { color: #09457d; } .turketarian .grid .grid-item .info-panel .info-footer a.comments { margin: 0 0 0 11px; padding: 0 0 0 13px; border-left: 1px solid rgba(9, 97, 171, 0.6); height: 23px; } .turketarian .grid .grid-item .info-panel .info-footer a.comments span { color: #09457d; } .turketarian .grid .grid-item > span { width: 100% !important; height: 100%; } .turketarian .grid .grid-item.large { height: 500px; position: relative; } @media screen and (max-width: 640px) { .turketarian .grid .grid-item.large { height: 490px; } } .turketarian .grid .grid-item.large .info-panel { background: #fff; background: rgba(255, 255, 255, 0.8); height: 173px; width: 100%; padding: 36px 27px 14px 27px; } @media screen and (max-width: 640px) { .turketarian .grid .grid-item.large .info-panel { padding-top: 14px; } } .turketarian .grid .grid-item.large .info-panel .title span { color: #404040; line-height: 1em; font-family: "Kievit Medium"; } @media screen and (min-width: 1281px) { .turketarian .grid .grid-item.large .info-panel .title span { font-size: 1em; } } @media screen and (max-width: 1280px) { .turketarian .grid .grid-item.large .info-panel .title span { font-size: 0.95em; } } @media screen and (max-width: 1120px) { .turketarian .grid .grid-item.large .info-panel .title span { font-size: 0.9em; } } @media screen and (max-width: 960px) { .turketarian .grid .grid-item.large .info-panel .title span { font-size: 0.85em; } } @media screen and (max-width: 800px) { .turketarian .grid .grid-item.large .info-panel .title span { font-size: 0.8em; } } @media screen and (max-width: 640px) { .turketarian .grid .grid-item.large .info-panel .title span { font-size: 1em; } } @media screen and (max-width: 480px) { .turketarian .grid .grid-item.large .info-panel .title span { font-size: 0.8em; } } .turketarian .grid .grid-item.large .info-panel .title span a { color: #0962a7; } .turketarian .grid .grid-item.large .info-panel .title > a { color: #09457d; line-height: 1em; font-family: "Kievit Bold"; width: 60%; display: block; margin: 10px 0 0 0; } @media screen and (min-width: 1281px) { .turketarian .grid .grid-item.large .info-panel .title > a { font-size: 1.4em; } } @media screen and (max-width: 1280px) { .turketarian .grid .grid-item.large .info-panel .title > a { font-size: 1.33em; } } @media screen and (max-width: 1120px) { .turketarian .grid .grid-item.large .info-panel .title > a { font-size: 1.26em; } } @media screen and (max-width: 960px) { .turketarian .grid .grid-item.large .info-panel .title > a { font-size: 1.19em; } } @media screen and (max-width: 800px) { .turketarian .grid .grid-item.large .info-panel .title > a { font-size: 1.12em; } } @media screen and (max-width: 640px) { .turketarian .grid .grid-item.large .info-panel .title > a { font-size: 1.4em; } } @media screen and (max-width: 480px) { .turketarian .grid .grid-item.large .info-panel .title > a { font-size: 1.12em; } } @media screen and (max-width: 640px) { .turketarian .grid .grid-item.large .info-panel .title > a { width: 100%; line-height: 1em; } } @media screen and (max-width: 640px) and (min-width: 1281px) { .turketarian .grid .grid-item.large .info-panel .title > a { font-size: 1.4em; } } @media screen and (max-width: 640px) and (max-width: 1280px) { .turketarian .grid .grid-item.large .info-panel .title > a { font-size: 1.33em; } } @media screen and (max-width: 640px) and (max-width: 1120px) { .turketarian .grid .grid-item.large .info-panel .title > a { font-size: 1.26em; } } @media screen and (max-width: 640px) and (max-width: 960px) { .turketarian .grid .grid-item.large .info-panel .title > a { font-size: 1.19em; } } @media screen and (max-width: 640px) and (max-width: 800px) { .turketarian .grid .grid-item.large .info-panel .title > a { font-size: 1.12em; } } @media screen and (max-width: 640px) and (max-width: 640px) { .turketarian .grid .grid-item.large .info-panel .title > a { font-size: 1.4em; } } @media screen and (max-width: 640px) and (max-width: 480px) { .turketarian .grid .grid-item.large .info-panel .title > a { font-size: 1.12em; } } .turketarian .grid .grid-item.small { height: 440px; position: relative; } @media screen and (max-width: 640px) { .turketarian .grid .grid-item.small { height: 430px; } } .turketarian .grid .grid-item.small .info-panel { height: 170px; margin-bottom: 0; padding: 0 16px; } @media screen and (max-width: 640px) { .turketarian .grid .grid-item.small .info-panel { padding: 0 27px; } } .turketarian .grid .grid-item.small .info-panel .title .user-icon img { margin: -18px 0 0 0; -webkit-box-shadow: 2px 3px 0px rgba(50, 50, 50, 0.5); -moz-box-shadow: 2px 3px 0px rgba(50, 50, 50, 0.5); box-shadow: 2px 3px 0px rgba(50, 50, 50, 0.5); display: inline-block; width: 42px; height: 42px; } .turketarian .grid .grid-item.small .info-panel .title .user-icon span { color: #404040; line-height: 1em; font-family: "Kievit Medium"; margin: 0 0 0 7px; display: inline-block; vertical-align: bottom; } @media screen and (min-width: 1281px) { .turketarian .grid .grid-item.small .info-panel .title .user-icon span { font-size: 0.75em; } } @media screen and (max-width: 1280px) { .turketarian .grid .grid-item.small .info-panel .title .user-icon span { font-size: 0.7125em; } } @media screen and (max-width: 1120px) { .turketarian .grid .grid-item.small .info-panel .title .user-icon span { font-size: 0.675em; } } @media screen and (max-width: 960px) { .turketarian .grid .grid-item.small .info-panel .title .user-icon span { font-size: 0.6375em; } } @media screen and (max-width: 800px) { .turketarian .grid .grid-item.small .info-panel .title .user-icon span { font-size: 0.6em; } } @media screen and (max-width: 640px) { .turketarian .grid .grid-item.small .info-panel .title .user-icon span { font-size: 0.75em; } } @media screen and (max-width: 480px) { .turketarian .grid .grid-item.small .info-panel .title .user-icon span { font-size: 0.6em; } } .turketarian .grid .grid-item.small .info-panel .title .user-icon span a { color: #0962a7; } .turketarian .grid .grid-item.small .info-panel .title > a { color: #0962a7; line-height: 1em; font-family: "Kievit Bold"; margin: 20px 0 0 0; width: 85%; display: block; } @media screen and (min-width: 1281px) { .turketarian .grid .grid-item.small .info-panel .title > a { font-size: 1.4em; } } @media screen and (max-width: 1280px) { .turketarian .grid .grid-item.small .info-panel .title > a { font-size: 1.33em; } } @media screen and (max-width: 1120px) { .turketarian .grid .grid-item.small .info-panel .title > a { font-size: 1.26em; } } @media screen and (max-width: 960px) { .turketarian .grid .grid-item.small .info-panel .title > a { font-size: 1.19em; } } @media screen and (max-width: 800px) { .turketarian .grid .grid-item.small .info-panel .title > a { font-size: 1.12em; } } @media screen and (max-width: 640px) { .turketarian .grid .grid-item.small .info-panel .title > a { font-size: 1.4em; } } @media screen and (max-width: 480px) { .turketarian .grid .grid-item.small .info-panel .title > a { font-size: 1.12em; } } @media screen and (max-width: 850px) { .turketarian .grid .grid-item.small .info-panel .title > a { line-height: 1em; } } @media screen and (max-width: 850px) and (min-width: 1281px) { .turketarian .grid .grid-item.small .info-panel .title > a { font-size: 1.3em; } } @media screen and (max-width: 850px) and (max-width: 1280px) { .turketarian .grid .grid-item.small .info-panel .title > a { font-size: 1.235em; } } @media screen and (max-width: 850px) and (max-width: 1120px) { .turketarian .grid .grid-item.small .info-panel .title > a { font-size: 1.17em; } } @media screen and (max-width: 850px) and (max-width: 960px) { .turketarian .grid .grid-item.small .info-panel .title > a { font-size: 1.105em; } } @media screen and (max-width: 850px) and (max-width: 800px) { .turketarian .grid .grid-item.small .info-panel .title > a { font-size: 1.04em; } } @media screen and (max-width: 850px) and (max-width: 640px) { .turketarian .grid .grid-item.small .info-panel .title > a { font-size: 1.3em; } } @media screen and (max-width: 850px) and (max-width: 480px) { .turketarian .grid .grid-item.small .info-panel .title > a { font-size: 1.04em; } } @media screen and (max-width: 640px) { .turketarian .grid .grid-item.small .info-panel .title > a { line-height: 1em; } } @media screen and (max-width: 640px) and (min-width: 1281px) { .turketarian .grid .grid-item.small .info-panel .title > a { font-size: 1.4em; } } @media screen and (max-width: 640px) and (max-width: 1280px) { .turketarian .grid .grid-item.small .info-panel .title > a { font-size: 1.33em; } } @media screen and (max-width: 640px) and (max-width: 1120px) { .turketarian .grid .grid-item.small .info-panel .title > a { font-size: 1.26em; } } @media screen and (max-width: 640px) and (max-width: 960px) { .turketarian .grid .grid-item.small .info-panel .title > a { font-size: 1.19em; } } @media screen and (max-width: 640px) and (max-width: 800px) { .turketarian .grid .grid-item.small .info-panel .title > a { font-size: 1.12em; } } @media screen and (max-width: 640px) and (max-width: 640px) { .turketarian .grid .grid-item.small .info-panel .title > a { font-size: 1.4em; } } @media screen and (max-width: 640px) and (max-width: 480px) { .turketarian .grid .grid-item.small .info-panel .title > a { font-size: 1.12em; } } .turketarian .grid .grid-item.small .info-panel .info-footer { left: 16px; } @media screen and (max-width: 640px) { .turketarian .grid .grid-item.small .info-panel .info-footer { left: 27px; } } .turketarian .grid .grid-item.small .info-panel .info-footer .stars { display: none; } .turketarian .grid .grid-item.small .info-panel .info-footer a.button { display: none; } @media screen and (max-width: 1000px) and (min-width: 900px) { .turketarian .grid .grid-item.small .info-panel .info-footer .fav { line-height: 1em; } .turketarian .grid .grid-item.small .info-panel .info-footer .comments { line-height: 1em; height: 10px; margin: 0 0 0 5px; padding: 0 0 0 6px; } } @media screen and (max-width: 1000px) and (min-width: 900px) and (min-width: 1281px) { .turketarian .grid .grid-item.small .info-panel .info-footer .fav { font-size: 0.7em; } } @media screen and (max-width: 1000px) and (min-width: 900px) and (max-width: 1280px) { .turketarian .grid .grid-item.small .info-panel .info-footer .fav { font-size: 0.665em; } } @media screen and (max-width: 1000px) and (min-width: 900px) and (max-width: 1120px) { .turketarian .grid .grid-item.small .info-panel .info-footer .fav { font-size: 0.63em; } } @media screen and (max-width: 1000px) and (min-width: 900px) and (max-width: 960px) { .turketarian .grid .grid-item.small .info-panel .info-footer .fav { font-size: 0.595em; } } @media screen and (max-width: 1000px) and (min-width: 900px) and (max-width: 800px) { .turketarian .grid .grid-item.small .info-panel .info-footer .fav { font-size: 0.56em; } } @media screen and (max-width: 1000px) and (min-width: 900px) and (max-width: 640px) { .turketarian .grid .grid-item.small .info-panel .info-footer .fav { font-size: 0.7em; } } @media screen and (max-width: 1000px) and (min-width: 900px) and (max-width: 480px) { .turketarian .grid .grid-item.small .info-panel .info-footer .fav { font-size: 0.56em; } } @media screen and (max-width: 1000px) and (min-width: 900px) and (min-width: 1281px) { .turketarian .grid .grid-item.small .info-panel .info-footer .comments { font-size: 0.7em; } } @media screen and (max-width: 1000px) and (min-width: 900px) and (max-width: 1280px) { .turketarian .grid .grid-item.small .info-panel .info-footer .comments { font-size: 0.665em; } } @media screen and (max-width: 1000px) and (min-width: 900px) and (max-width: 1120px) { .turketarian .grid .grid-item.small .info-panel .info-footer .comments { font-size: 0.63em; } } @media screen and (max-width: 1000px) and (min-width: 900px) and (max-width: 960px) { .turketarian .grid .grid-item.small .info-panel .info-footer .comments { font-size: 0.595em; } } @media screen and (max-width: 1000px) and (min-width: 900px) and (max-width: 800px) { .turketarian .grid .grid-item.small .info-panel .info-footer .comments { font-size: 0.56em; } } @media screen and (max-width: 1000px) and (min-width: 900px) and (max-width: 640px) { .turketarian .grid .grid-item.small .info-panel .info-footer .comments { font-size: 0.7em; } } @media screen and (max-width: 1000px) and (min-width: 900px) and (max-width: 480px) { .turketarian .grid .grid-item.small .info-panel .info-footer .comments { font-size: 0.56em; } } .turketarian .grid .grid-item.small .info-panel.recipe { background: #fff; background: rgba(255, 255, 255, 0.8); } .turketarian .grid .grid-item.small .info-panel.recommend { background: #e3d2ae; } .turketarian .grid .grid-item.small .info-panel.coupon { background: #c5c5c5; } .turketarian .grid .grid-item.small .info-panel.coupon .info-footer .fav, .turketarian .grid .grid-item.small .info-panel.coupon .info-footer .comments { display: none; } .turketarian .grid .grid-item.small .info-panel.coupon .info-footer a.button { display: block; } .turketarian .grid .grid-item.small .info-panel.howto { background: #ffffff; } .turketarian .grid .grid-item.small .info-panel.howto .title > a, .turketarian .grid .grid-item.small .info-panel.coupon .title > a { color: #404040; line-height: 1em; font-family: "Kievit Medium"; } @media screen and (min-width: 1281px) { .turketarian .grid .grid-item.small .info-panel.howto .title > a, .turketarian .grid .grid-item.small .info-panel.coupon .title > a { font-size: 0.9em; } } @media screen and (max-width: 1280px) { .turketarian .grid .grid-item.small .info-panel.howto .title > a, .turketarian .grid .grid-item.small .info-panel.coupon .title > a { font-size: 0.855em; } } @media screen and (max-width: 1120px) { .turketarian .grid .grid-item.small .info-panel.howto .title > a, .turketarian .grid .grid-item.small .info-panel.coupon .title > a { font-size: 0.81em; } } @media screen and (max-width: 960px) { .turketarian .grid .grid-item.small .info-panel.howto .title > a, .turketarian .grid .grid-item.small .info-panel.coupon .title > a { font-size: 0.765em; } } @media screen and (max-width: 800px) { .turketarian .grid .grid-item.small .info-panel.howto .title > a, .turketarian .grid .grid-item.small .info-panel.coupon .title > a { font-size: 0.72em; } } @media screen and (max-width: 640px) { .turketarian .grid .grid-item.small .info-panel.howto .title > a, .turketarian .grid .grid-item.small .info-panel.coupon .title > a { font-size: 0.9em; } } @media screen and (max-width: 480px) { .turketarian .grid .grid-item.small .info-panel.howto .title > a, .turketarian .grid .grid-item.small .info-panel.coupon .title > a { font-size: 0.72em; } } @media screen and (max-width: 640px) { .turketarian .grid .grid-item.small .info-panel.howto .title > a, .turketarian .grid .grid-item.small .info-panel.coupon .title > a { line-height: 1em; } } @media screen and (max-width: 640px) and (min-width: 1281px) { .turketarian .grid .grid-item.small .info-panel.howto .title > a, .turketarian .grid .grid-item.small .info-panel.coupon .title > a { font-size: 1.2em; } } @media screen and (max-width: 640px) and (max-width: 1280px) { .turketarian .grid .grid-item.small .info-panel.howto .title > a, .turketarian .grid .grid-item.small .info-panel.coupon .title > a { font-size: 1.14em; } } @media screen and (max-width: 640px) and (max-width: 1120px) { .turketarian .grid .grid-item.small .info-panel.howto .title > a, .turketarian .grid .grid-item.small .info-panel.coupon .title > a { font-size: 1.08em; } } @media screen and (max-width: 640px) and (max-width: 960px) { .turketarian .grid .grid-item.small .info-panel.howto .title > a, .turketarian .grid .grid-item.small .info-panel.coupon .title > a { font-size: 1.02em; } } @media screen and (max-width: 640px) and (max-width: 800px) { .turketarian .grid .grid-item.small .info-panel.howto .title > a, .turketarian .grid .grid-item.small .info-panel.coupon .title > a { font-size: 0.96em; } } @media screen and (max-width: 640px) and (max-width: 640px) { .turketarian .grid .grid-item.small .info-panel.howto .title > a, .turketarian .grid .grid-item.small .info-panel.coupon .title > a { font-size: 1.2em; } } @media screen and (max-width: 640px) and (max-width: 480px) { .turketarian .grid .grid-item.small .info-panel.howto .title > a, .turketarian .grid .grid-item.small .info-panel.coupon .title > a { font-size: 0.96em; } } .turketarian .grid .grid-item.small .info-panel.howto .title > a span, .turketarian .grid .grid-item.small .info-panel.coupon .title > a span { color: #09457d; line-height: 1em; display: block; } @media screen and (min-width: 1281px) { .turketarian .grid .grid-item.small .info-panel.howto .title > a span, .turketarian .grid .grid-item.small .info-panel.coupon .title > a span { font-size: 2em; } } @media screen and (max-width: 1280px) { .turketarian .grid .grid-item.small .info-panel.howto .title > a span, .turketarian .grid .grid-item.small .info-panel.coupon .title > a span { font-size: 1.9em; } } @media screen and (max-width: 1120px) { .turketarian .grid .grid-item.small .info-panel.howto .title > a span, .turketarian .grid .grid-item.small .info-panel.coupon .title > a span { font-size: 1.8em; } } @media screen and (max-width: 960px) { .turketarian .grid .grid-item.small .info-panel.howto .title > a span, .turketarian .grid .grid-item.small .info-panel.coupon .title > a span { font-size: 1.7em; } } @media screen and (max-width: 800px) { .turketarian .grid .grid-item.small .info-panel.howto .title > a span, .turketarian .grid .grid-item.small .info-panel.coupon .title > a span { font-size: 1.6em; } } @media screen and (max-width: 640px) { .turketarian .grid .grid-item.small .info-panel.howto .title > a span, .turketarian .grid .grid-item.small .info-panel.coupon .title > a span { font-size: 2em; } } @media screen and (max-width: 480px) { .turketarian .grid .grid-item.small .info-panel.howto .title > a span, .turketarian .grid .grid-item.small .info-panel.coupon .title > a span { font-size: 1.6em; } } .turketarian .grid .grid-item.product { background: transparent url(images/backgrounds/turketarian-product-background.jpg) center top no-repeat; background-size: 100% 100%; } .turketarian .grid .grid-item.product .background { margin-top: 20px; } .turketarian .grid .grid-item.how_tos { background: transparent url(images/backgrounds/turketarian-howto-background.gif) left top repeat; } .turketarian .grid .grid-item.how_tos .background { width: 200% !important; margin: 0 -50%; max-width: 200% !important; } .turketarian .load-more { float: right; } .turketarian .empty { height: 460px; max-width: 680px; text-align: center; padding: 62px 0 0 0; margin: 0 auto; } @media screen and (max-width: 640px) { .turketarian .empty { height: auto; padding-bottom: 3em; } } .turketarian .empty h4 { color: #0962a7; line-height: 1em; font-family: "Kievit black"; text-shadow: 1px 2px 0px #a2b1b8; text-transform: uppercase; margin: 0; } @media screen and (min-width: 1281px) { .turketarian .empty h4 { font-size: 3.1em; } } @media screen and (max-width: 1280px) { .turketarian .empty h4 { font-size: 2.945em; } } @media screen and (max-width: 1120px) { .turketarian .empty h4 { font-size: 2.79em; } } @media screen and (max-width: 960px) { .turketarian .empty h4 { font-size: 2.635em; } } @media screen and (max-width: 800px) { .turketarian .empty h4 { font-size: 2.48em; } } @media screen and (max-width: 640px) { .turketarian .empty h4 { font-size: 3.1em; } } @media screen and (max-width: 480px) { .turketarian .empty h4 { font-size: 2.48em; } } .turketarian .empty p { color: #404040; line-height: 1.333em; font-family: "Kievit Book"; margin: 20px 0 0 0; } @media screen and (min-width: 1281px) { .turketarian .empty p { font-size: 1.4em; } } @media screen and (max-width: 1280px) { .turketarian .empty p { font-size: 1.33em; } } @media screen and (max-width: 1120px) { .turketarian .empty p { font-size: 1.26em; } } @media screen and (max-width: 960px) { .turketarian .empty p { font-size: 1.19em; } } @media screen and (max-width: 800px) { .turketarian .empty p { font-size: 1.12em; } } @media screen and (max-width: 640px) { .turketarian .empty p { font-size: 1.4em; } } @media screen and (max-width: 480px) { .turketarian .empty p { font-size: 1.12em; } } .product-detail #page-texture { position: absolute; left: -2%; top: 16%; z-index: 15; } @media screen and (max-width: 1120px) { .product-detail #page-texture { display: none; } } .product-detail #hero { position: relative; } .product-detail #hero.shadow { -webkit-box-shadow: 0px 5px 7px rgba(50, 50, 50, 0.4); -moz-box-shadow: 0px 5px 7px rgba(50, 50, 50, 0.4); box-shadow: 0px 5px 7px rgba(50, 50, 50, 0.4); } .product-detail #hero #crisis { display: none; } .product-detail #hero.active-crisis #crisis { display: block; position: absolute; top: 200px; z-index: 1000; height: auto; } @media screen and (max-width: 640px) { .product-detail #hero.active-crisis #crisis { top: 31%; } } @media screen and (max-width: 480px) { .product-detail #hero.active-crisis #crisis { top: 28%; } } @media screen and (min-width: 320px) { .product-detail #hero.active-crisis #crisis { top: 26%; } } .product-detail #hero.active-crisis #crisis .columns { padding: 0; } .product-detail #hero.active-crisis #crisis .module { float: right; -webkit-box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.33); -moz-box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.33); box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.33); background: #fff; opacity: 0.88; filter: alpha(opacity=88); padding: 3px; } @media screen and (max-width: 1225px) { .product-detail #hero.active-crisis #crisis .module { width: 50%; } } @media screen and (max-width: 1000px) { .product-detail #hero.active-crisis #crisis .module { width: 45%; } } @media screen and (max-width: 750px) { .product-detail #hero.active-crisis #crisis .module { width: 40%; } } @media screen and (max-width: 640px) { .product-detail #hero.active-crisis #crisis .module { float: left; width: 100%; } } .product-detail #hero.active-crisis #crisis .module h3 { margin: 4px 15px 7px 15px; background: url("images/icons/crisis.png") no-repeat; padding: 3px 0 0 36px; text-shadow: 1px 2px 1px #969696; } @media screen and (max-width: 1000px) { .product-detail #hero.active-crisis #crisis .module h3 { font-size: 16px; } } @media screen and (max-width: 850px) { .product-detail #hero.active-crisis #crisis .module h3 { line-height: 17px; } } @media screen and (max-width: 750px) { .product-detail #hero.active-crisis #crisis .module h3 { font-size: 15px; } } @media screen and (max-width: 640px) { .product-detail #hero.active-crisis #crisis .module h3 { font-size: 12px; } } @media screen and (max-width: 480px) { .product-detail #hero.active-crisis #crisis .module h3 { font-family: "Kievit Bold"; margin: 4px 5px 7px 5px; padding-left: 33px; } } .product-detail #hero.active-crisis #crisis .module .message { clear: both; background: #f9e90d; padding: 12px 22px 10px 22px; } .product-detail #hero.active-crisis #crisis .module .message p { color: #09457d; font-family: "Kievit Book"; line-height: 1em; margin: 0 0 10px 0; } @media screen and (min-width: 1281px) { .product-detail #hero.active-crisis #crisis .module .message p { font-size: 1.125em; } } @media screen and (max-width: 1280px) { .product-detail #hero.active-crisis #crisis .module .message p { font-size: 1.06875em; } } @media screen and (max-width: 1120px) { .product-detail #hero.active-crisis #crisis .module .message p { font-size: 1.0125em; } } @media screen and (max-width: 960px) { .product-detail #hero.active-crisis #crisis .module .message p { font-size: 0.95625em; } } @media screen and (max-width: 800px) { .product-detail #hero.active-crisis #crisis .module .message p { font-size: 0.9em; } } @media screen and (max-width: 640px) { .product-detail #hero.active-crisis #crisis .module .message p { font-size: 1.125em; } } @media screen and (max-width: 480px) { .product-detail #hero.active-crisis #crisis .module .message p { font-size: 0.9em; } } @media screen and (max-width: 640px) { .product-detail #hero.active-crisis .info { padding: 120px 5% 5% 5%; position: static; width: 100%; } } .product-detail #hero .layers { width: 100%; position: relative; } .product-detail #hero .layers .backdrop { min-height: 640px; max-height: 762px; } .product-detail #hero .layers .backdrop img { display: block; margin: 0 auto; min-height: 640px; max-height: 762px; width: 100%; } @media screen and (max-width: 640px) { .product-detail #hero .layers .backdrop { min-height: 300px; } .product-detail #hero .layers .backdrop img { min-height: 300px; } } @media screen and (max-width: 560px) { .product-detail #hero .layers .backdrop { min-height: 250px; } .product-detail #hero .layers .backdrop img { min-height: 250px; } } @media screen and (max-width: 480px) { .product-detail #hero .layers .backdrop { min-height: 200px; } .product-detail #hero .layers .backdrop img { min-height: 200px; } } @media screen and (max-width: 400px) { .product-detail #hero .layers .backdrop { min-height: 150px; } .product-detail #hero .layers .backdrop img { min-height: 150px; } } .product-detail #hero .layers .object { position: absolute; bottom: 0; right: 0; max-width: 90em; width: 100%; } @media screen and (min-width: 1440px) { .product-detail #hero .layers .object { width: auto; /* This is for IE8. Sigh. */ } } .product-detail #hero .layers .object img { display: block; margin: 0 auto; } .product-detail #hero .layers .product { position: absolute; bottom: 0; right: 0; max-width: 90em; width: 100%; } @media screen and (min-width: 1440px) { .product-detail #hero .layers .product { width: auto; /* This is for IE8. Sigh. */ } } .product-detail #hero .layers .product img { display: block; margin: 0 auto; } .product-detail #hero .layers .product.full { max-width: 100%; } .product-detail #hero .layers .labels { position: absolute; right: 9%; bottom: 9%; width: 100%; } @media screen and (max-width: 960px) { .product-detail #hero .layers .labels { right: 7.5%; bottom: 7.5%; } } @media screen and (max-width: 800px) { .product-detail #hero .layers .labels { right: 6%; bottom: 6%; } } @media screen and (max-width: 640px) { .product-detail #hero .layers .labels { display: none; } } .product-detail #hero .layers .labels li { float: right; list-style: none; margin-left: -2%; width: 9%; background: none; } .product-detail #hero .layers .labels li img { width: 100%; } .product-detail #hero .row { position: absolute; top: 32%; left: 0; right: 0; height: 59%; } .product-detail #hero .row .columns { padding: 0; } .product-detail #hero .row .info { position: static; max-width: 510px; } @media screen and (max-width: 768px) { .product-detail #hero .row { top: 22%; } } @media screen and (max-width: 640px) { .product-detail #hero .row { position: static; } .product-detail #hero .row .info { width: 100%; } } .product-detail #hero .info { position: absolute; top: 28%; left: 8%; z-index: 20; } @media screen and (max-width: 640px) { .product-detail #hero .info { padding: 0 5% 5% 5%; position: static; width: 100%; } } .product-detail #hero .info h1 { color: #09457d; font-family: "Kievit black"; line-height: 1em; margin-bottom: 0.25em; text-transform: uppercase; text-shadow: 1px 1px 2px #969696; } @media screen and (min-width: 1281px) { .product-detail #hero .info h1 { font-size: 2.5em; } } @media screen and (max-width: 1280px) { .product-detail #hero .info h1 { font-size: 2.375em; } } @media screen and (max-width: 1120px) { .product-detail #hero .info h1 { font-size: 2.25em; } } @media screen and (max-width: 960px) { .product-detail #hero .info h1 { font-size: 2.125em; } } @media screen and (max-width: 800px) { .product-detail #hero .info h1 { font-size: 2em; } } @media screen and (max-width: 640px) { .product-detail #hero .info h1 { font-size: 2.5em; } } @media screen and (max-width: 480px) { .product-detail #hero .info h1 { font-size: 2em; } } @media screen and (max-width: 640px) { .product-detail #hero .info h1 { font-size: 2em !important; } } .product-detail #hero .info span { font-family: "Kievit Book"; line-height: 1.5em; text-transform: uppercase; } @media screen and (min-width: 1281px) { .product-detail #hero .info span { font-size: 1em; } } @media screen and (max-width: 1280px) { .product-detail #hero .info span { font-size: 0.95em; } } @media screen and (max-width: 1120px) { .product-detail #hero .info span { font-size: 0.9em; } } @media screen and (max-width: 960px) { .product-detail #hero .info span { font-size: 0.85em; } } @media screen and (max-width: 800px) { .product-detail #hero .info span { font-size: 0.8em; } } @media screen and (max-width: 640px) { .product-detail #hero .info span { font-size: 1em; } } @media screen and (max-width: 480px) { .product-detail #hero .info span { font-size: 0.8em; } } .product-detail #hero .info p { font-family: "Kievit Book"; line-height: 1.375em; margin: 0.25em 0 0.75em 0; } @media screen and (min-width: 1281px) { .product-detail #hero .info p { font-size: 1.125em; } } @media screen and (max-width: 1280px) { .product-detail #hero .info p { font-size: 1.06875em; } } @media screen and (max-width: 1120px) { .product-detail #hero .info p { font-size: 1.0125em; } } @media screen and (max-width: 960px) { .product-detail #hero .info p { font-size: 0.95625em; } } @media screen and (max-width: 800px) { .product-detail #hero .info p { font-size: 0.9em; } } @media screen and (max-width: 640px) { .product-detail #hero .info p { font-size: 1.125em; } } @media screen and (max-width: 480px) { .product-detail #hero .info p { font-size: 0.9em; } } @media screen and (max-width: 1080px) { .product-detail #hero .info p { line-height: 1.375em; } } @media screen and (max-width: 1080px) and (min-width: 1281px) { .product-detail #hero .info p { font-size: 1em; } } @media screen and (max-width: 1080px) and (max-width: 1280px) { .product-detail #hero .info p { font-size: 0.95em; } } @media screen and (max-width: 1080px) and (max-width: 1120px) { .product-detail #hero .info p { font-size: 0.9em; } } @media screen and (max-width: 1080px) and (max-width: 960px) { .product-detail #hero .info p { font-size: 0.85em; } } @media screen and (max-width: 1080px) and (max-width: 800px) { .product-detail #hero .info p { font-size: 0.8em; } } @media screen and (max-width: 1080px) and (max-width: 640px) { .product-detail #hero .info p { font-size: 1em; } } @media screen and (max-width: 1080px) and (max-width: 480px) { .product-detail #hero .info p { font-size: 0.8em; } } .product-detail #hero .info form div { float: left; margin: 0.5em 0; } .product-detail #hero .info form div.get-coupon { margin-right: 1em; } .product-detail #hero .info form div.find-product-fieldset { clear: both; margin-top: 1.5em; } .product-detail #hero .info form div.find-product-fieldset div { display: inline-block; float: none; -webkit-box-shadow: rgba(0, 0, 0, 0.5) 0 1px 2px 1px; -moz-box-shadow: rgba(0, 0, 0, 0.5) 0 1px 2px 1px; box-shadow: rgba(0, 0, 0, 0.5) 0 1px 2px 1px; } @media screen and (max-width: 640px) { .product-detail #hero .info form div.find-product-fieldset div { width: 100%; position: relative; } } .product-detail #hero .info form a.button { margin-top: 0; } .product-detail #hero .info form a.button + label { font-family: "Kievit Book"; line-height: 1.2666em; float: none; margin-top: .75em; margin-left: 10px; } @media screen and (min-width: 1281px) { .product-detail #hero .info form a.button + label { font-size: 0.9375em; } } @media screen and (max-width: 1280px) { .product-detail #hero .info form a.button + label { font-size: 0.89063em; } } @media screen and (max-width: 1120px) { .product-detail #hero .info form a.button + label { font-size: 0.84375em; } } @media screen and (max-width: 960px) { .product-detail #hero .info form a.button + label { font-size: 0.79688em; } } @media screen and (max-width: 800px) { .product-detail #hero .info form a.button + label { font-size: 0.75em; } } @media screen and (max-width: 640px) { .product-detail #hero .info form a.button + label { font-size: 0.9375em; } } @media screen and (max-width: 480px) { .product-detail #hero .info form a.button + label { font-size: 0.75em; } } @media screen and (max-width: 960px) { .product-detail #hero .info form a.button + label { font-size: 0.85em !important; } } @media screen and (max-width: 800px) { .product-detail #hero .info form a.button + label { width: 40%; vertical-align: middle; margin-top: .3em; } } @media screen and (max-width: 640px) { .product-detail #hero .info form a.button + label { width: auto; margin-top: 1em; } } @media screen and (max-width: 480px) { .product-detail #hero .info form a.button + label { width: 50%; margin-top: .3em; } } .product-detail #hero .info form input[type="text"] { border: none; color: #363636; float: left; height: 2.125em; font-family: "Kievit Book"; line-height: 1em; margin-top: 0; padding-left: 10px; padding-top: 8px; padding-bottom: 8px; width: 20em; } @media screen and (min-width: 1281px) { .product-detail #hero .info form input[type="text"] { font-size: 0.9375em; } } @media screen and (max-width: 1280px) { .product-detail #hero .info form input[type="text"] { font-size: 0.89063em; } } @media screen and (max-width: 1120px) { .product-detail #hero .info form input[type="text"] { font-size: 0.84375em; } } @media screen and (max-width: 960px) { .product-detail #hero .info form input[type="text"] { font-size: 0.79688em; } } @media screen and (max-width: 800px) { .product-detail #hero .info form input[type="text"] { font-size: 0.75em; } } @media screen and (max-width: 640px) { .product-detail #hero .info form input[type="text"] { font-size: 0.9375em; } } @media screen and (max-width: 480px) { .product-detail #hero .info form input[type="text"] { font-size: 0.75em; } } @media screen and (max-width: 960px) { .product-detail #hero .info form input[type="text"] { width: 17em; } } @media screen and (max-width: 800px) { .product-detail #hero .info form input[type="text"] { width: 15em; } } @media screen and (max-width: 640px) { .product-detail #hero .info form input[type="text"] { margin-top: 1em; margin-bottom: 1em; padding-left: 10px; padding-right: 7em; width: 100%; } } .lt-ie9 .product-detail #hero .info form input[type="text"] { border: 1px solid #6e6e6e; height: 2.1875em; } .product-detail #hero .info form button { background-color: #085daa; border: none; color: #fff; float: left; height: 2.5em; font-family: "Kievit Bold"; line-height: 0.9444em; padding-top: 3px; -moz-padding-top: 0; text-transform: uppercase; width: 7em; } @media screen and (min-width: 1281px) { .product-detail #hero .info form button { font-size: 0.8125em; } } @media screen and (max-width: 1280px) { .product-detail #hero .info form button { font-size: 0.77188em; } } @media screen and (max-width: 1120px) { .product-detail #hero .info form button { font-size: 0.73125em; } } @media screen and (max-width: 960px) { .product-detail #hero .info form button { font-size: 0.69063em; } } @media screen and (max-width: 800px) { .product-detail #hero .info form button { font-size: 0.65em; } } @media screen and (max-width: 640px) { .product-detail #hero .info form button { font-size: 0.8125em; } } @media screen and (max-width: 480px) { .product-detail #hero .info form button { font-size: 0.65em; } } @media screen and (max-width: 640px) { .product-detail #hero .info form button { float: right; margin-top: -47px; } } @media screen and (max-width: 480px) { .product-detail #hero .info form button { float: right; margin-top: -37px; } } .product-detail #hero .info .social { clear: both; padding-top: 1em; } .product-detail #hero .info .social ul { padding-left: 0; margin: 0; *zoom: 1; } .product-detail #hero .info .social ul:before, .product-detail #hero .info .social ul:after { content: " "; display: table; } .product-detail #hero .info .social ul:after { clear: both; } .product-detail #hero .info .social ul li { display: inline; float: left; margin: 0; padding: 0; list-style: none; background: none; padding-right: 8px; } .product-detail #hero .info .social ul li.pinterest { padding-right: 50px !important; } @media screen and (max-width: 640px) { .product-detail #hero .info .social ul li { display: block; float: left; height: 40px; padding: 10px 0 !important; width: 50%; } } @media screen and (max-width: 640px) { .product-detail #hero .info .social { padding: 0 12.5%; } } .product-detail #hero .product-type { position: absolute; bottom: -8%; z-index: 3; right: 9.5%; } @media screen and (min-width: 1441px) { .product-detail #hero .product-type { right: 140px; } } @media screen and (max-width: 640px) { .product-detail #hero .product-type { right: 0; } } .product-detail #hero .product-type .custom.dropdown { width: 250px; } @media screen and (max-width: 640px) { .product-detail #hero .product-type .custom.dropdown { margin-bottom: 11%; } } @media screen and (max-width: 640px) { .product-detail #hero .product-type { position: static; padding: 0 8% 80px 8%; } } @media screen and (max-width: 640px) { .product-detail #hero .product-type .fake.dropdown { margin: 0 -4% 2em -4%; width: 108%; } } .product-detail #hero.product-category .layers .backdrop { min-height: 350px; max-height: 513px; } .product-detail #hero.product-category .layers .backdrop img { min-height: 350px; max-height: 513px; } @media screen and (max-width: 640px) { .product-detail #hero.product-category .layers .backdrop { min-height: 0; } .product-detail #hero.product-category .layers .backdrop img { min-height: 0; } } .product-detail #product-information { position: relative; } .product-detail #product-information .row .columns { padding-left: 0; padding-right: 0; } .product-detail #product-information #instructions { padding-top: 3em; padding-right: 6em; } @media screen and (max-width: 960px) { .product-detail #product-information #instructions.with_tt_spacing { padding-bottom: 160px; } } @media screen and (max-width: 640px) { .product-detail #product-information #instructions.with_tt_spacing { padding-bottom: 150px; } } @media screen and (max-width: 960px) { .product-detail #product-information #instructions { padding-right: 1em; } } @media screen and (max-width: 640px) { .product-detail #product-information #instructions { margin: 0 5%; padding-right: 0; padding-top: 2em; } } .product-detail #product-information #instructions h4 { color: #085daa; font-family: "Kievit Bold"; line-height: 1.1429em; margin: 0; text-transform: uppercase; } @media screen and (min-width: 1281px) { .product-detail #product-information #instructions h4 { font-size: 1.3125em; } } @media screen and (max-width: 1280px) { .product-detail #product-information #instructions h4 { font-size: 1.24688em; } } @media screen and (max-width: 1120px) { .product-detail #product-information #instructions h4 { font-size: 1.18125em; } } @media screen and (max-width: 960px) { .product-detail #product-information #instructions h4 { font-size: 1.11562em; } } @media screen and (max-width: 800px) { .product-detail #product-information #instructions h4 { font-size: 1.05em; } } @media screen and (max-width: 640px) { .product-detail #product-information #instructions h4 { font-size: 1.3125em; } } @media screen and (max-width: 480px) { .product-detail #product-information #instructions h4 { font-size: 1.05em; } } .product-detail #product-information #instructions p { color: #636363; margin-top: 0; margin-bottom: 1em; font-family: "Kievit Book"; line-height: 1.4em; } @media screen and (min-width: 1281px) { .product-detail #product-information #instructions p { font-size: 1.25em; } } @media screen and (max-width: 1280px) { .product-detail #product-information #instructions p { font-size: 1.1875em; } } @media screen and (max-width: 1120px) { .product-detail #product-information #instructions p { font-size: 1.125em; } } @media screen and (max-width: 960px) { .product-detail #product-information #instructions p { font-size: 1.0625em; } } @media screen and (max-width: 800px) { .product-detail #product-information #instructions p { font-size: 1em; } } @media screen and (max-width: 640px) { .product-detail #product-information #instructions p { font-size: 1.25em; } } @media screen and (max-width: 480px) { .product-detail #product-information #instructions p { font-size: 1em; } } .product-detail #product-information #instructions ul { margin: 0 0 2em 0; padding: 0; } .product-detail #product-information #instructions ul li { color: #636363; margin: 0; padding: 0; list-style: none; background: none; font-family: "Kievit Book"; line-height: 1.5em; } @media screen and (min-width: 1281px) { .product-detail #product-information #instructions ul li { font-size: 1em; } } @media screen and (max-width: 1280px) { .product-detail #product-information #instructions ul li { font-size: 0.95em; } } @media screen and (max-width: 1120px) { .product-detail #product-information #instructions ul li { font-size: 0.9em; } } @media screen and (max-width: 960px) { .product-detail #product-information #instructions ul li { font-size: 0.85em; } } @media screen and (max-width: 800px) { .product-detail #product-information #instructions ul li { font-size: 0.8em; } } @media screen and (max-width: 640px) { .product-detail #product-information #instructions ul li { font-size: 1em; } } @media screen and (max-width: 480px) { .product-detail #product-information #instructions ul li { font-size: 0.8em; } } .product-detail #product-information #instructions ul li img { vertical-align: baseline; } .product-detail #product-information #instructions ul li strong { color: #363636; font-family: "Kievit Bold"; font-weight: normal; text-transform: uppercase; } #related-products { background: url(images/backgrounds/related-products.gif) 0 0 repeat; -webkit-box-shadow: inset 0 8px 8px -8px #333333, inset 0 -8px 8px -8px #333333; -moz-box-shadow: inset 0 8px 8px -8px #333333, inset 0 -8px 8px -8px #333333; box-shadow: inset 0 8px 8px -8px #333333, inset 0 -8px 8px -8px #333333; } @media screen and (max-width: 640px) { #related-products { margin-bottom: 60px; } } #related-products .row { padding-top: 1em; padding-bottom: 1em; } @media screen and (max-width: 640px) { #related-products .row { padding: 2em 5% 0 5%; } } #related-products h4 { color: #09457d; font-family: "Kievit Bold"; line-height: 2.28em; margin: 0 0 0.5em 0; text-transform: uppercase; } @media screen and (min-width: 1281px) { #related-products h4 { font-size: 1.5625em; } } @media screen and (max-width: 1280px) { #related-products h4 { font-size: 1.48438em; } } @media screen and (max-width: 1120px) { #related-products h4 { font-size: 1.40625em; } } @media screen and (max-width: 960px) { #related-products h4 { font-size: 1.32813em; } } @media screen and (max-width: 800px) { #related-products h4 { font-size: 1.25em; } } @media screen and (max-width: 640px) { #related-products h4 { font-size: 1.5625em; } } @media screen and (max-width: 480px) { #related-products h4 { font-size: 1.25em; } } @media screen and (max-width: 640px) { #related-products h4 { line-height: 1.25em; } } #related-products .flexslider { background: transparent; } #related-products .flexslider .slides li { margin: 0; padding: 0; font-size: 1em !important; } @media screen and (max-width: 800px) { #related-products .flexslider .slides li:nth-child(even) > div { margin-left: 15px; margin-right: 0; } #related-products .flexslider .slides li:nth-child(odd) > div { margin-right: 15px; margin-left: 0; } } @media screen and (max-width: 640px) { #related-products .flexslider { margin-bottom: 0; } #related-products .flexslider .slides li > div { margin: 0 !important; } } #related-products .flexslider .flex-direction-nav { display: none; width: 100%; } @media screen and (max-width: 640px) { #related-products .flexslider .flex-direction-nav { display: block; bottom: -60px; position: absolute; margin: 0 -5.5%; width: 111%; -webkit-box-shadow: 0px 3px 2px -2px #333; -moz-box-shadow: 0px 3px 2px -2px #333; box-shadow: 0px 3px 2px -2px #333; } #related-products .flexslider .flex-direction-nav a { background: url(images/sprites/arrow.carousel.mobile.png) no-repeat; margin: 0; width: 57px; height: 60px; top: auto; bottom: 0; } #related-products .flexslider .flex-direction-nav a.flex-prev { background-position: 0 0; left: 0; } #related-products .flexslider .flex-direction-nav a.flex-next { background-position: 0 bottom; right: 0; } } @media screen and (max-width: 640px) { #related-products .flexslider .flex-control-nav { display: none; } } #related-products .flexslider .flex-text-paging { display: none; } @media screen and (max-width: 640px) { #related-products .flexslider .flex-text-paging { display: block; position: absolute; bottom: -40px; text-align: center; width: 100%; } } @media screen and (max-width: 640px) { .product-list .row:first-child .columns:first-child .related-product { border: none !important; } } @media screen and (max-width: 640px) { .product-list .row { border: none !important; padding-top: 0 !important; padding-bottom: 0 !important; } .product-list .row:last-child .columns:last-child .related-product { border-bottom: none; } } .product-list .row .divider { background: #90b6d9; height: 1px; padding-top: 0; padding-bottom: 0; } @media screen and (max-width: 640px) { .product-list .row .divider { display: none; } } .product-list .row .related-product { margin: 0 5px; position: relative; } @media screen and (max-width: 640px) { .product-list .row .related-product { margin-top: 0; padding-bottom: 2em; border-top: 1px solid #90b6d9; padding-top: 2em; } } .product-list .row .related-product figure img { border-left: 8px solid #f0f0f0; border-right: 8px solid #f0f0f0; border-top: 8px solid #d6d6d6; border-bottom: 8px solid #d6d6d6; -webkit-box-shadow: 2px 3px 5px rgba(75, 75, 75, 0.75); -moz-box-shadow: 2px 3px 5px rgba(75, 75, 75, 0.75); box-shadow: 2px 3px 5px rgba(75, 75, 75, 0.75); } .product-list .row .related-product figure figcaption { margin: 1em 0; } .product-list .row .related-product figure figcaption a { display: inline-block; text-align: center; width: 100%; } .product-list .row .related-product .coupon { position: absolute; top: 0; left: 0; } .product-list .row .related-product .play { position: absolute; top: 0; left: 0; } .product-list .row .related-product h2 { font-family: "Kievit Bold"; line-height: 1.04em; color: #0a57a4; text-transform: uppercase; text-shadow: 1px 1px 0px #a2b1b8; margin: 18px 0 0 0; } @media screen and (min-width: 1281px) { .product-list .row .related-product h2 { font-size: 1.5625em; } } @media screen and (max-width: 1280px) { .product-list .row .related-product h2 { font-size: 1.48438em; } } @media screen and (max-width: 1120px) { .product-list .row .related-product h2 { font-size: 1.40625em; } } @media screen and (max-width: 960px) { .product-list .row .related-product h2 { font-size: 1.32813em; } } @media screen and (max-width: 800px) { .product-list .row .related-product h2 { font-size: 1.25em; } } @media screen and (max-width: 640px) { .product-list .row .related-product h2 { font-size: 1.5625em; } } @media screen and (max-width: 480px) { .product-list .row .related-product h2 { font-size: 1.25em; } } @media screen and (max-width: 950px) { .product-list .row .related-product h2 { line-height: 1.04em; } } @media screen and (max-width: 950px) and (min-width: 1281px) { .product-list .row .related-product h2 { font-size: 1.3625em; } } @media screen and (max-width: 950px) and (max-width: 1280px) { .product-list .row .related-product h2 { font-size: 1.29438em; } } @media screen and (max-width: 950px) and (max-width: 1120px) { .product-list .row .related-product h2 { font-size: 1.22625em; } } @media screen and (max-width: 950px) and (max-width: 960px) { .product-list .row .related-product h2 { font-size: 1.15813em; } } @media screen and (max-width: 950px) and (max-width: 800px) { .product-list .row .related-product h2 { font-size: 1.09em; } } @media screen and (max-width: 950px) and (max-width: 640px) { .product-list .row .related-product h2 { font-size: 1.3625em; } } @media screen and (max-width: 950px) and (max-width: 480px) { .product-list .row .related-product h2 { font-size: 1.09em; } } .product-list .row .related-product h2 sup { line-height: 1em; } @media screen and (min-width: 1281px) { .product-list .row .related-product h2 sup { font-size: 0.6em; } } @media screen and (max-width: 1280px) { .product-list .row .related-product h2 sup { font-size: 0.57em; } } @media screen and (max-width: 1120px) { .product-list .row .related-product h2 sup { font-size: 0.54em; } } @media screen and (max-width: 960px) { .product-list .row .related-product h2 sup { font-size: 0.51em; } } @media screen and (max-width: 800px) { .product-list .row .related-product h2 sup { font-size: 0.48em; } } @media screen and (max-width: 640px) { .product-list .row .related-product h2 sup { font-size: 0.6em; } } @media screen and (max-width: 480px) { .product-list .row .related-product h2 sup { font-size: 0.48em; } } .product-list .row .related-product p { color: #404040; font-family: "Kievit Book"; line-height: 1.5125em; margin: 12px 0 0 0; } @media screen and (min-width: 1281px) { .product-list .row .related-product p { font-size: 1.1em; } } @media screen and (max-width: 1280px) { .product-list .row .related-product p { font-size: 1.045em; } } @media screen and (max-width: 1120px) { .product-list .row .related-product p { font-size: 0.99em; } } @media screen and (max-width: 960px) { .product-list .row .related-product p { font-size: 0.935em; } } @media screen and (max-width: 800px) { .product-list .row .related-product p { font-size: 0.88em; } } @media screen and (max-width: 640px) { .product-list .row .related-product p { font-size: 1.1em; } } @media screen and (max-width: 480px) { .product-list .row .related-product p { font-size: 0.88em; } } .product-list .row .related-product ul { margin: 10px 0 0 0; padding: 0; } .product-list .row .related-product ul li { list-style: none; margin: 20px 0 0 0; background: none; } .product-list .row .related-product ul li a.carrot { color: #0962a7; } .recipe-detail #page-texture { position: absolute; left: 0; top: 768px; z-index: 15; } @media screen and (max-width: 1420px) { .recipe-detail #page-texture { top: 760px; } } @media screen and (max-width: 1400px) { .recipe-detail #page-texture { top: 755px; } } @media screen and (max-width: 1360px) { .recipe-detail #page-texture { top: 750px; } } @media screen and (max-width: 1330px) { .recipe-detail #page-texture { top: 745px; } } @media screen and (max-width: 1305px) { .recipe-detail #page-texture { top: 740px; } } @media screen and (max-width: 1280px) { .recipe-detail #page-texture { top: 735px; } } @media screen and (max-width: 1250px) { .recipe-detail #page-texture { top: 730px; } } @media screen and (max-width: 1220px) { .recipe-detail #page-texture { top: 725px; } } .recipe-detail #page-texture img { width: 90%; } @media screen and (max-width: 1420px) { .recipe-detail #page-texture img { width: 85%; } } @media screen and (max-width: 1400px) { .recipe-detail #page-texture img { width: 80%; } } @media screen and (max-width: 1360px) { .recipe-detail #page-texture img { width: 75%; } } @media screen and (max-width: 1330px) { .recipe-detail #page-texture img { width: 70%; } } @media screen and (max-width: 1305px) { .recipe-detail #page-texture img { width: 65%; } } @media screen and (max-width: 1280px) { .recipe-detail #page-texture img { width: 60%; } } @media screen and (max-width: 1250px) { .recipe-detail #page-texture img { width: 55%; } } @media screen and (max-width: 1220px) { .recipe-detail #page-texture img { width: 50%; } } @media screen and (max-width: 1120px) { .recipe-detail #page-texture { display: none; } } .recipe-detail #hero { position: relative; } .recipe-detail #hero .layers { position: relative; } .recipe-detail #hero .layers .backdrop { min-height: 800px; } @media screen and (max-width: 640px) { .recipe-detail #hero .layers .backdrop { min-height: 840px; } } @media screen and (max-width: 560px) { .recipe-detail #hero .layers .backdrop { min-height: 780px; } } @media screen and (max-width: 480px) { .recipe-detail #hero .layers .backdrop { min-height: 720px; } } @media screen and (max-width: 400px) { .recipe-detail #hero .layers .backdrop { min-height: 660px; } } @media screen and (max-width: 360px) { .recipe-detail #hero .layers .backdrop { min-height: 600px; } } .recipe-detail #hero .layers .backdrop img { width: 100%; min-height: 800px; } @media screen and (max-width: 640px) { .recipe-detail #hero .layers .backdrop img { min-height: 840px; } } @media screen and (max-width: 560px) { .recipe-detail #hero .layers .backdrop img { min-height: 780px; } } @media screen and (max-width: 480px) { .recipe-detail #hero .layers .backdrop img { min-height: 720px; } } @media screen and (max-width: 400px) { .recipe-detail #hero .layers .backdrop img { min-height: 660px; } } @media screen and (max-width: 360px) { .recipe-detail #hero .layers .backdrop img { min-height: 600px; } } .recipe-detail #hero .layers .slideshow { position: absolute; left: 50%; top: 25%; width: 40%; } @media screen and (max-width: 640px) { .recipe-detail #hero .layers .slideshow { top: auto; left: 5%; width: 90%; bottom: 0; } } .recipe-detail #hero .info { position: absolute; top: 25%; left: 8%; width: 40%; } @media screen and (max-width: 800px) { .recipe-detail #hero .info { top: 25%; } } @media screen and (max-width: 720px) { .recipe-detail #hero .info { top: 20%; } } @media screen and (max-width: 640px) { .recipe-detail #hero .info { padding: 2em 5%; position: static; width: 100%; } } @media screen and (max-width: 640px) { .recipe-detail #hero .info .recipe-title-ratings { position: absolute; top: 8em; width: 90%; } } @media screen and (max-width: 560px) { .recipe-detail #hero .info .recipe-title-ratings { top: 7em; } } @media screen and (max-width: 480px) { .recipe-detail #hero .info .recipe-title-ratings { top: 6em; } } @media screen and (max-width: 320px) { .recipe-detail #hero .info .recipe-title-ratings { top: 5em; } } .recipe-detail #hero .info .rating-form { display: none; } .recipe-detail #hero .info h1 { color: #09457d; font-family: "Kievit black"; line-height: 1em; margin-top: 0; margin-bottom: 0.25em; text-transform: uppercase; text-shadow: 1px 1px 2px #969696; } @media screen and (min-width: 1281px) { .recipe-detail #hero .info h1 { font-size: 2.5em; } } @media screen and (max-width: 1280px) { .recipe-detail #hero .info h1 { font-size: 2.375em; } } @media screen and (max-width: 1120px) { .recipe-detail #hero .info h1 { font-size: 2.25em; } } @media screen and (max-width: 960px) { .recipe-detail #hero .info h1 { font-size: 2.125em; } } @media screen and (max-width: 800px) { .recipe-detail #hero .info h1 { font-size: 2em; } } @media screen and (max-width: 640px) { .recipe-detail #hero .info h1 { font-size: 2.5em; } } @media screen and (max-width: 480px) { .recipe-detail #hero .info h1 { font-size: 2em; } } @media screen and (max-width: 640px) { .recipe-detail #hero .info h1 { font-size: 1.8em !important; } } .recipe-detail #hero .info .recipe-ratings { height: 29px; margin-bottom: 2em; position: relative; } @media screen and (max-width: 680px) and (min-width: 640px) { .recipe-detail #hero .info .recipe-ratings { margin-bottom: 1em; } } .recipe-detail #hero .info .recipe-ratings div > img { display: inline-block; width: auto; } .recipe-detail #hero .info .recipe-ratings div > span { position: absolute; left: 172px; top: 5px; font-family: "Kievit Book"; line-height: 1.6em; width: 200px; } @media screen and (min-width: 1281px) { .recipe-detail #hero .info .recipe-ratings div > span { font-size: 0.9375em; } } @media screen and (max-width: 1280px) { .recipe-detail #hero .info .recipe-ratings div > span { font-size: 0.89063em; } } @media screen and (max-width: 1120px) { .recipe-detail #hero .info .recipe-ratings div > span { font-size: 0.84375em; } } @media screen and (max-width: 960px) { .recipe-detail #hero .info .recipe-ratings div > span { font-size: 0.79688em; } } @media screen and (max-width: 800px) { .recipe-detail #hero .info .recipe-ratings div > span { font-size: 0.75em; } } @media screen and (max-width: 640px) { .recipe-detail #hero .info .recipe-ratings div > span { font-size: 0.9375em; } } @media screen and (max-width: 480px) { .recipe-detail #hero .info .recipe-ratings div > span { font-size: 0.75em; } } .recipe-detail #hero .info .recipe-ratings .overall-rating { display: inline-block; position: relative; } .recipe-detail #hero .info .recipe-ratings .my-rating { display: none; position: absolute; top: 0; left: 0; } .recipe-detail #hero .info .recipe-ratings .cover-text { position: absolute; height: 29px; top: 0; left: 164px; z-index: 1; width: 208px; } .recipe-detail #hero .info p { font-family: "Kievit Book"; line-height: 1.375em; margin: 0.25em 0 0.75em 0; width: 85%; } @media screen and (min-width: 1281px) { .recipe-detail #hero .info p { font-size: 1.125em; } } @media screen and (max-width: 1280px) { .recipe-detail #hero .info p { font-size: 1.06875em; } } @media screen and (max-width: 1120px) { .recipe-detail #hero .info p { font-size: 1.0125em; } } @media screen and (max-width: 960px) { .recipe-detail #hero .info p { font-size: 0.95625em; } } @media screen and (max-width: 800px) { .recipe-detail #hero .info p { font-size: 0.9em; } } @media screen and (max-width: 640px) { .recipe-detail #hero .info p { font-size: 1.125em; } } @media screen and (max-width: 480px) { .recipe-detail #hero .info p { font-size: 0.9em; } } @media screen and (max-width: 680px) and (min-width: 640px) { .recipe-detail #hero .info p { font-size: 1em; } } .recipe-detail #hero .info form { overflow: auto; } .recipe-detail #hero .info form > div { float: left; } .recipe-detail #hero .info form > div.print-button { clear: both; } .recipe-detail #hero .info form a.button { margin-top: 0; } .recipe-detail #hero .info form a.button + label { font-family: "Kievit Book"; line-height: 1.2666em; float: none; margin-top: .7em; margin-left: 10px; } @media screen and (min-width: 1281px) { .recipe-detail #hero .info form a.button + label { font-size: 0.9375em; } } @media screen and (max-width: 1280px) { .recipe-detail #hero .info form a.button + label { font-size: 0.89063em; } } @media screen and (max-width: 1120px) { .recipe-detail #hero .info form a.button + label { font-size: 0.84375em; } } @media screen and (max-width: 960px) { .recipe-detail #hero .info form a.button + label { font-size: 0.79688em; } } @media screen and (max-width: 800px) { .recipe-detail #hero .info form a.button + label { font-size: 0.75em; } } @media screen and (max-width: 640px) { .recipe-detail #hero .info form a.button + label { font-size: 0.9375em; } } @media screen and (max-width: 480px) { .recipe-detail #hero .info form a.button + label { font-size: 0.75em; } } @media screen and (max-width: 814px) { .recipe-detail #hero .info form a.button + label { width: 120px; margin-top: .1em; } } @media screen and (max-width: 640px) { .recipe-detail #hero .info form a.button + label { display: inline-block; float: left; margin-top: 0.75em; max-width: 320px; position: static; width: auto; } } @media screen and (max-width: 480px) { .recipe-detail #hero .info form a.button + label { margin-top: 0; margin-left: 0; max-width: 240px; width: 120px; } } .recipe-detail #hero .info form div { margin: 0.5em 0; } .recipe-detail #hero .info form div.find-product-fieldset div { display: inline-block; -webkit-box-shadow: #363636 0 1px 5px 1px; -moz-box-shadow: #363636 0 1px 5px 1px; box-shadow: #363636 0 1px 5px 1px; } .recipe-detail #hero .info form label { font-family: "Kievit Book"; line-height: 1.2666em; } @media screen and (min-width: 1281px) { .recipe-detail #hero .info form label { font-size: 0.9375em; } } @media screen and (max-width: 1280px) { .recipe-detail #hero .info form label { font-size: 0.89063em; } } @media screen and (max-width: 1120px) { .recipe-detail #hero .info form label { font-size: 0.84375em; } } @media screen and (max-width: 960px) { .recipe-detail #hero .info form label { font-size: 0.79688em; } } @media screen and (max-width: 800px) { .recipe-detail #hero .info form label { font-size: 0.75em; } } @media screen and (max-width: 640px) { .recipe-detail #hero .info form label { font-size: 0.9375em; } } @media screen and (max-width: 480px) { .recipe-detail #hero .info form label { font-size: 0.75em; } } .recipe-detail #hero .info form input[type="text"] { border: none; color: #363636; float: left; height: 2.125em; font-family: "Kievit Book"; line-height: 1em; padding-left: 0.5em; width: 20em; } @media screen and (min-width: 1281px) { .recipe-detail #hero .info form input[type="text"] { font-size: 0.9375em; } } @media screen and (max-width: 1280px) { .recipe-detail #hero .info form input[type="text"] { font-size: 0.89063em; } } @media screen and (max-width: 1120px) { .recipe-detail #hero .info form input[type="text"] { font-size: 0.84375em; } } @media screen and (max-width: 960px) { .recipe-detail #hero .info form input[type="text"] { font-size: 0.79688em; } } @media screen and (max-width: 800px) { .recipe-detail #hero .info form input[type="text"] { font-size: 0.75em; } } @media screen and (max-width: 640px) { .recipe-detail #hero .info form input[type="text"] { font-size: 0.9375em; } } @media screen and (max-width: 480px) { .recipe-detail #hero .info form input[type="text"] { font-size: 0.75em; } } .recipe-detail #hero .info form button { background-color: #085daa; border: none; color: #fff; float: left; height: 3em; margin-left: -0.25em; font-family: "Kievit Bold"; line-height: 0.9444em; text-transform: uppercase; width: 7em; } @media screen and (min-width: 1281px) { .recipe-detail #hero .info form button { font-size: 0.6875em; } } @media screen and (max-width: 1280px) { .recipe-detail #hero .info form button { font-size: 0.65312em; } } @media screen and (max-width: 1120px) { .recipe-detail #hero .info form button { font-size: 0.61875em; } } @media screen and (max-width: 960px) { .recipe-detail #hero .info form button { font-size: 0.58438em; } } @media screen and (max-width: 800px) { .recipe-detail #hero .info form button { font-size: 0.55em; } } @media screen and (max-width: 640px) { .recipe-detail #hero .info form button { font-size: 0.6875em; } } @media screen and (max-width: 480px) { .recipe-detail #hero .info form button { font-size: 0.55em; } } .recipe-detail #modal-content label { margin-left: 0; padding: 1em 0 0; clear: left; } .recipe-detail #modal-content label + input { width: 40%; float: left; } @media screen and (max-width: 960px) { .recipe-detail #modal-content label + input { width: 80%; } } .recipe-detail #modal-content label + input + a { margin-top: 1em; float: left; clear: both; } .recipe-detail #modal-content p { overflow: hidden; } .recipe-detail #modal-content p + p { margin: 0; padding: 0; } .recipe-detail #modal-content .checkbox + label { padding-top: 0; clear: none; } /*#upload-photo-modal input[type="file"]{ display: none; } */ #thanks-photo-modal #modal-content p:first-child { margin: 0 !important; padding: 0 0 1em 0 !important; } .recipe-category article #page-texture { position: absolute; right: 0; top: 400px; z-index: 1000; } .recipe-category article #page-texture img { float: left; } @media screen and (max-width: 1000px) { .recipe-category article #page-texture { width: 16%; } } @media screen and (max-width: 640px) { .recipe-category article #page-texture { display: none; } } .recipe-category article #hero { position: relative; } .recipe-category article #hero .layers { position: relative; display: block; } @media screen and (max-width: 640px) { .recipe-category article #hero .layers { display: none; } } .recipe-category article #hero .layers .backdrop { overflow: hidden; max-height: 513px; } .recipe-category article #hero .layers .backdrop img, .recipe-category article #hero .layers .backdrop figure { height: 100%; width: 100%; min-height: 513px; max-height: 513px; margin: 0 auto; } @media screen and (max-width: 640px) { .recipe-category article #hero .layers .backdrop img, .recipe-category article #hero .layers .backdrop figure { min-height: 0; } } .recipe-category article #hero .row { position: absolute; top: 50%; left: 0; right: 0; } @media screen and (max-width: 960px) { .recipe-category article #hero .row { top: 45%; } } @media screen and (max-width: 640px) { .recipe-category article #hero .row { position: static; } } .recipe-category article #hero .row .columns { padding: 0; } .recipe-category article #hero .row .columns .info h1 { color: #09457d; font-family: "Kievit black"; line-height: 1em; margin-top: 0; margin-bottom: 0.25em; text-transform: uppercase; text-shadow: 1px 1px 2px #969696; } @media screen and (min-width: 1281px) { .recipe-category article #hero .row .columns .info h1 { font-size: 3em; } } @media screen and (max-width: 1280px) { .recipe-category article #hero .row .columns .info h1 { font-size: 2.85em; } } @media screen and (max-width: 1120px) { .recipe-category article #hero .row .columns .info h1 { font-size: 2.7em; } } @media screen and (max-width: 960px) { .recipe-category article #hero .row .columns .info h1 { font-size: 2.55em; } } @media screen and (max-width: 800px) { .recipe-category article #hero .row .columns .info h1 { font-size: 2.4em; } } @media screen and (max-width: 640px) { .recipe-category article #hero .row .columns .info h1 { font-size: 3em; } } @media screen and (max-width: 480px) { .recipe-category article #hero .row .columns .info h1 { font-size: 2.4em; } } .recipe-category article #hero .row .columns .info p { font-family: "Kievit Book"; line-height: 1.375em; margin: 0.25em 0 0.75em 0; width: 78%; } @media screen and (min-width: 1281px) { .recipe-category article #hero .row .columns .info p { font-size: 1.25em; } } @media screen and (max-width: 1280px) { .recipe-category article #hero .row .columns .info p { font-size: 1.1875em; } } @media screen and (max-width: 1120px) { .recipe-category article #hero .row .columns .info p { font-size: 1.125em; } } @media screen and (max-width: 960px) { .recipe-category article #hero .row .columns .info p { font-size: 1.0625em; } } @media screen and (max-width: 800px) { .recipe-category article #hero .row .columns .info p { font-size: 1em; } } @media screen and (max-width: 640px) { .recipe-category article #hero .row .columns .info p { font-size: 1.25em; } } @media screen and (max-width: 480px) { .recipe-category article #hero .row .columns .info p { font-size: 1em; } } @media screen and (max-width: 768px) { .recipe-category article #hero .row .columns .info p { width: 90%; } } @media screen and (max-width: 640px) { .recipe-category article #hero .row .columns .info { padding: 6em 5% 0 5%; position: static; width: 100%; } } .recipe-category article #hero .row .columns figure { -webkit-box-shadow: 0 2px 8px rgba(0, 0, 0, 0.5); -moz-box-shadow: 0 2px 8px rgba(0, 0, 0, 0.5); box-shadow: 0 2px 8px rgba(0, 0, 0, 0.5); position: relative; top: -40px; z-index: 100; } @media screen and (max-width: 1280px) and (min-width: 1120px) { .recipe-category article #hero .row .columns figure { top: 0; } } @media screen and (max-width: 1280px) and (max-width: 1120px) { .recipe-category article #hero .row .columns figure { top: 10px; } } @media screen and (max-width: 1280px) and (max-width: 960px) { .recipe-category article #hero .row .columns figure { top: 0; } } @media screen and (max-width: 1280px) and (max-width: 640px) { .recipe-category article #hero .row .columns figure { top: 19px; } } @media screen and (max-width: 640px) { .recipe-category article #hero .row .columns figure { width: 90%; margin: 0 5%; } } .recipe-category article #hero .row .columns figure > img { width: 100%; } .recipe-category article #hero .row .columns figure figcaption { background: #fff; background: rgba(255, 255, 255, 0.8); position: absolute; width: 100%; bottom: 0; left: 0; padding: 0 8% 1em 8%; width: 100%; } .recipe-category article #hero .row .columns figure figcaption p a { color: #09457d; font-family: "Kievit Book"; line-height: 1em; text-transform: uppercase; } @media screen and (min-width: 1281px) { .recipe-category article #hero .row .columns figure figcaption p a { font-size: 1.5625em; } } @media screen and (max-width: 1280px) { .recipe-category article #hero .row .columns figure figcaption p a { font-size: 1.48438em; } } @media screen and (max-width: 1120px) { .recipe-category article #hero .row .columns figure figcaption p a { font-size: 1.40625em; } } @media screen and (max-width: 960px) { .recipe-category article #hero .row .columns figure figcaption p a { font-size: 1.32813em; } } @media screen and (max-width: 800px) { .recipe-category article #hero .row .columns figure figcaption p a { font-size: 1.25em; } } @media screen and (max-width: 640px) { .recipe-category article #hero .row .columns figure figcaption p a { font-size: 1.5625em; } } @media screen and (max-width: 480px) { .recipe-category article #hero .row .columns figure figcaption p a { font-size: 1.25em; } } .recipe-category article section { position: relative; } .recipe-category article section .shadow { background: url("images/backgrounds/recipe-category-shadow.png") repeat-x; height: 11px; top: 0; left: 0; width: 100%; } .recipe-category article .large-3 .recipe-type { margin: 12px 0 20px 0; } .recipe-category article .large-3 .dropdown { margin-bottom: 2em; } .recipe-category article .large-3 .dropdown .outside { background: none; padding: 0; } .recipe-category article .large-3 .dropdown .outside .current { padding: 15px 47px 11px 15px; background: url("images/sprites/filter-accordion.gif") 100% 0 no-repeat; } .recipe-category article .large-3 .dropdown.open .current { background-position: 100% 100%; } .recipe-category article .large-3 .filter-recipes { clear: both; } .recipe-category article .large-9 .recipe { border-top: 1px solid #82a8cb; padding-top: 30px; padding-bottom: 30px; } .recipe-category article .large-9 .recipe:first-child { border-top: 0; padding-top: 0; margin-top: 0; } @media screen and (max-width: 850px) and (min-width: 801px) { .recipe-category article .large-9 .recipe table tr td { padding: 1.3em .5em 1em 1.25em; } } @media screen and (max-width: 800px) { .recipe-category article .small-12 { width: 100%; } .recipe-category article .small-6 { width: 50%; } } .products-main #hero { position: relative; } .products-main #hero .layers { position: relative; height: 100%; } .products-main #hero .layers .backdrop { overflow: hidden; max-height: 513px; min-height: 450px; } @media screen and (max-width: 640px) { .products-main #hero .layers .backdrop { min-height: 410px; } } @media screen and (max-width: 550px) { .products-main #hero .layers .backdrop { min-height: 360px; } } @media screen and (max-width: 500px) { .products-main #hero .layers .backdrop { min-height: 340px; } } @media screen and (max-width: 450px) { .products-main #hero .layers .backdrop { min-height: 310px; } } @media screen and (max-width: 400px) { .products-main #hero .layers .backdrop { min-height: 280px; } } @media screen and (max-width: 350px) { .products-main #hero .layers .backdrop { min-height: 250px; } } .products-main #hero .layers .backdrop img { width: 100%; min-height: 450px; max-height: 513px; margin: 0 auto; } @media screen and (max-width: 640px) { .products-main #hero .layers .backdrop img { min-height: 0; } } .products-main #hero .layers .product { position: absolute; bottom: -60px; right: 0; width: 100%; } @media screen and (max-width: 768px) { .products-main #hero .layers .product { bottom: -40px; } } @media screen and (max-width: 640px) { .products-main #hero .layers .product { bottom: 0; top: 150px; } } @media screen and (max-width: 480px) { .products-main #hero .layers .product { bottom: 0; top: 105px; } } .products-main #hero .layers .product img { display: block; margin: 0 auto; } .products-main #hero .row { position: absolute; top: 50%; left: 0; right: 0; } @media screen and (max-width: 640px) { .products-main #hero .row { position: static; } } .products-main #hero .row .columns { padding: 0; } .products-main #hero .row .columns .info h1 { color: #09457d; font-family: "Kievit black"; line-height: 1em; margin-top: 0; margin-bottom: 0.25em; text-transform: uppercase; text-shadow: 1px 1px 2px #969696; } @media screen and (min-width: 1281px) { .products-main #hero .row .columns .info h1 { font-size: 3em; } } @media screen and (max-width: 1280px) { .products-main #hero .row .columns .info h1 { font-size: 2.85em; } } @media screen and (max-width: 1120px) { .products-main #hero .row .columns .info h1 { font-size: 2.7em; } } @media screen and (max-width: 960px) { .products-main #hero .row .columns .info h1 { font-size: 2.55em; } } @media screen and (max-width: 800px) { .products-main #hero .row .columns .info h1 { font-size: 2.4em; } } @media screen and (max-width: 640px) { .products-main #hero .row .columns .info h1 { font-size: 3em; } } @media screen and (max-width: 480px) { .products-main #hero .row .columns .info h1 { font-size: 2.4em; } } .products-main #hero .row .columns .info p { font-family: "Kievit Book"; line-height: 1.375em; margin: 0.25em 0 0.75em 0; width: 78%; } @media screen and (min-width: 1281px) { .products-main #hero .row .columns .info p { font-size: 1.25em; } } @media screen and (max-width: 1280px) { .products-main #hero .row .columns .info p { font-size: 1.1875em; } } @media screen and (max-width: 1120px) { .products-main #hero .row .columns .info p { font-size: 1.125em; } } @media screen and (max-width: 960px) { .products-main #hero .row .columns .info p { font-size: 1.0625em; } } @media screen and (max-width: 800px) { .products-main #hero .row .columns .info p { font-size: 1em; } } @media screen and (max-width: 640px) { .products-main #hero .row .columns .info p { font-size: 1.25em; } } @media screen and (max-width: 480px) { .products-main #hero .row .columns .info p { font-size: 1em; } } @media screen and (max-width: 768px) { .products-main #hero .row .columns .info p { width: 90%; } } @media screen and (max-width: 640px) { .products-main #hero .row .columns .info { padding: 0 5% 2em 5%; position: static; width: 100%; } } .products-main .product-search { background-color: #e4e4e4; -webkit-box-shadow: inset 0 8px 8px -8px #333333, inset 0 -8px 8px -8px #333333; -moz-box-shadow: inset 0 8px 8px -8px #333333, inset 0 -8px 8px -8px #333333; box-shadow: inset 0 8px 8px -8px #333333, inset 0 -8px 8px -8px #333333; } .products-main .product-search .columns.large-8 { padding-left: 0; } @media screen and (max-width: 640px) { .products-main .product-search .columns.large-8 { padding-left: 0.9375em; } } .products-main .product-search form { padding-top: 67px; padding-bottom: 42px; } @media screen and (max-width: 640px) { .products-main .product-search form { padding-top: 30px; padding-bottom: 30px; } } .products-main .product-search form #search { float: left; margin: 0 0 0 -1px; height: 41px; width: 75%; } @media screen and (max-width: 640px) { .products-main .product-search form #search { width: 70%; } } .products-main .product-search form .button { float: left; margin: 0 0 0 -2px; width: 25%; min-width: 0; font-size: 13px; clear: none; } @media screen and (max-width: 640px) { .products-main .product-search form .button { width: 30%; } } .products-main .product-search form .dropdown { max-width: 210px; clear: none; float: right; margin: 0; } @media screen and (max-width: 640px) { .products-main .product-search form .dropdown { margin: 30px 0 0 0; float: left; max-width: 640px; } .products-main .product-search form .dropdown ul li { font-size: 14px; } } .products-main .product-search .large-4 { padding-right: 0; } @media screen and (max-width: 640px) { .products-main .product-search .large-4 { padding-right: 0.9375em; } } .products-main .product-categories { padding: 0 0 35px 0; } .products-main .product-categories .row { padding: 35px 0 0 0; } @media screen and (max-width: 768px) { .products-main .product-categories .row { padding: 20px 0 0 0; } } @media screen and (max-width: 640px) { .products-main .product-categories .row { padding: 0; } } .products-main .product-categories .row .item { position: relative; width: 49.305%; margin: 0 0 0 1.389%; float: left; -webkit-box-shadow: 3px 3px 2px rgba(0, 0, 0, 0.33); -moz-box-shadow: 3px 3px 2px rgba(0, 0, 0, 0.33); box-shadow: 3px 3px 2px rgba(0, 0, 0, 0.33); } .products-main .product-categories .row .item:first-child { margin: 0; } .products-main .product-categories .row .item:hover { cursor: pointer; } @media screen and (max-width: 640px) { .products-main .product-categories .row .item { width: 100%; margin: 0; padding: 32px 0 0 0; } } .products-main .product-categories .row .item > figure img { width: 100%; } .products-main .product-categories .row .item .info-panel { position: absolute; bottom: 0; left: 0; z-index: 2; background: #fff; background: rgba(255, 255, 255, 0.8); padding: 16px 0 0 7.04%; height: 155px; } @media screen and (max-width: 768px) { .products-main .product-categories .row .item .info-panel { padding: 0 0 0 5.29%; height: 135px; } } @media screen and (max-width: 640px) { .products-main .product-categories .row .item .info-panel { padding: 0 0 0 0.9375em; height: 160px; } } .products-main .product-categories .row .item .info-panel p { color: #404040; font-family: "Kievit Book"; line-height: 1.3125em; margin: 0.275em 40px 0 0; clear: both; } @media screen and (min-width: 1281px) { .products-main .product-categories .row .item .info-panel p { font-size: 1em; } } @media screen and (max-width: 1280px) { .products-main .product-categories .row .item .info-panel p { font-size: 0.95em; } } @media screen and (max-width: 1120px) { .products-main .product-categories .row .item .info-panel p { font-size: 0.9em; } } @media screen and (max-width: 960px) { .products-main .product-categories .row .item .info-panel p { font-size: 0.85em; } } @media screen and (max-width: 800px) { .products-main .product-categories .row .item .info-panel p { font-size: 0.8em; } } @media screen and (max-width: 640px) { .products-main .product-categories .row .item .info-panel p { font-size: 1em; } } @media screen and (max-width: 480px) { .products-main .product-categories .row .item .info-panel p { font-size: 0.8em; } } @media screen and (max-width: 640px) { .products-main .product-categories .row .item .info-panel p { margin: 0.75em 40px 0 0; } } .products-main .product-categories .row .item .info-panel .product-name { position: relative; } .products-main .product-categories .row .item .info-panel .product-name h3 { line-height: 1em; font-family: "Kievit Bold"; margin: 0; float: left; padding: 0.533333em 0 0 0; max-width: 75%; } @media screen and (min-width: 1281px) { .products-main .product-categories .row .item .info-panel .product-name h3 { font-size: 1.8975em; } } @media screen and (max-width: 1280px) { .products-main .product-categories .row .item .info-panel .product-name h3 { font-size: 1.80263em; } } @media screen and (max-width: 1120px) { .products-main .product-categories .row .item .info-panel .product-name h3 { font-size: 1.70775em; } } @media screen and (max-width: 960px) { .products-main .product-categories .row .item .info-panel .product-name h3 { font-size: 1.61287em; } } @media screen and (max-width: 800px) { .products-main .product-categories .row .item .info-panel .product-name h3 { font-size: 1.518em; } } @media screen and (max-width: 640px) { .products-main .product-categories .row .item .info-panel .product-name h3 { font-size: 1.8975em; } } @media screen and (max-width: 480px) { .products-main .product-categories .row .item .info-panel .product-name h3 { font-size: 1.518em; } } .products-main .product-categories .row .item .info-panel .product-name h3 a { color: #233e80; } @media screen and (max-width: 768px) and (min-width: 640px) { .products-main .product-categories .row .item .info-panel .product-name h3 { line-height: 1em; padding: 0.833333em 0 0 0; } } @media screen and (max-width: 768px) and (min-width: 640px) and (min-width: 1281px) { .products-main .product-categories .row .item .info-panel .product-name h3 { font-size: 1.4em; } } @media screen and (max-width: 768px) and (min-width: 640px) and (max-width: 1280px) { .products-main .product-categories .row .item .info-panel .product-name h3 { font-size: 1.33em; } } @media screen and (max-width: 768px) and (min-width: 640px) and (max-width: 1120px) { .products-main .product-categories .row .item .info-panel .product-name h3 { font-size: 1.26em; } } @media screen and (max-width: 768px) and (min-width: 640px) and (max-width: 960px) { .products-main .product-categories .row .item .info-panel .product-name h3 { font-size: 1.19em; } } @media screen and (max-width: 768px) and (min-width: 640px) and (max-width: 800px) { .products-main .product-categories .row .item .info-panel .product-name h3 { font-size: 1.12em; } } @media screen and (max-width: 768px) and (min-width: 640px) and (max-width: 640px) { .products-main .product-categories .row .item .info-panel .product-name h3 { font-size: 1.4em; } } @media screen and (max-width: 768px) and (min-width: 640px) and (max-width: 480px) { .products-main .product-categories .row .item .info-panel .product-name h3 { font-size: 1.12em; } } @media screen and (max-width: 640px) { .products-main .product-categories .row .item .info-panel .product-name h3 { margin: 0 40px 0 0; max-width: 100%; } } .products-main .product-categories .row .item .info-panel .product-name h3:hover { text-decoration: underline; } @media screen and (max-width: 768px) { .products-main .product-categories .row .item .info-panel .product-name { padding: 0.625em 0 0 0; } } .recipes-main #hero { position: relative; } .recipes-main #hero .layers { position: relative; display: block; } @media screen and (max-width: 640px) { .recipes-main #hero .layers { display: none; } } .recipes-main #hero .layers .backdrop { overflow: hidden; } .recipes-main #hero .layers .backdrop img { width: 100%; min-height: 513px; margin: 0 auto; } @media screen and (max-width: 640px) { .recipes-main #hero .layers .backdrop img { min-height: 0; } } .recipes-main #hero .row { position: absolute; top: 45%; left: 0; right: 0; } @media screen and (max-width: 640px) { .recipes-main #hero .row { position: static; } } .recipes-main #hero .row .columns { padding: 0; } .recipes-main #hero .row .columns .info h1 { color: #09457d; font-family: "Kievit black"; line-height: 1em; margin-top: 0; margin-bottom: 0.25em; text-transform: uppercase; text-shadow: 1px 1px 2px #969696; } @media screen and (min-width: 1281px) { .recipes-main #hero .row .columns .info h1 { font-size: 3em; } } @media screen and (max-width: 1280px) { .recipes-main #hero .row .columns .info h1 { font-size: 2.85em; } } @media screen and (max-width: 1120px) { .recipes-main #hero .row .columns .info h1 { font-size: 2.7em; } } @media screen and (max-width: 960px) { .recipes-main #hero .row .columns .info h1 { font-size: 2.55em; } } @media screen and (max-width: 800px) { .recipes-main #hero .row .columns .info h1 { font-size: 2.4em; } } @media screen and (max-width: 640px) { .recipes-main #hero .row .columns .info h1 { font-size: 3em; } } @media screen and (max-width: 480px) { .recipes-main #hero .row .columns .info h1 { font-size: 2.4em; } } .recipes-main #hero .row .columns .info p { font-family: "Kievit Book"; line-height: 1.375em; margin: 0.25em 0 0.75em 0; width: 78%; } @media screen and (min-width: 1281px) { .recipes-main #hero .row .columns .info p { font-size: 1.25em; } } @media screen and (max-width: 1280px) { .recipes-main #hero .row .columns .info p { font-size: 1.1875em; } } @media screen and (max-width: 1120px) { .recipes-main #hero .row .columns .info p { font-size: 1.125em; } } @media screen and (max-width: 960px) { .recipes-main #hero .row .columns .info p { font-size: 1.0625em; } } @media screen and (max-width: 800px) { .recipes-main #hero .row .columns .info p { font-size: 1em; } } @media screen and (max-width: 640px) { .recipes-main #hero .row .columns .info p { font-size: 1.25em; } } @media screen and (max-width: 480px) { .recipes-main #hero .row .columns .info p { font-size: 1em; } } @media screen and (max-width: 768px) { .recipes-main #hero .row .columns .info p { width: 90%; } } @media screen and (max-width: 640px) { .recipes-main #hero .row .columns .info { padding: 6em 5% 2em 5%; position: static; width: 100%; } } .recipes-main #hero .row .columns figure { -webkit-box-shadow: 0 2px 8px rgba(0, 0, 0, 0.5); -moz-box-shadow: 0 2px 8px rgba(0, 0, 0, 0.5); box-shadow: 0 2px 8px rgba(0, 0, 0, 0.5); position: relative; top: -20px; } @media screen and (max-width: 640px) { .recipes-main #hero .row .columns figure { width: 90%; margin: 0 5%; } } .recipes-main #hero .row .columns figure > img { width: 100%; } .recipes-main #hero .row .columns figure figcaption { background: #fff; background: rgba(255, 255, 255, 0.8); position: absolute; width: 100%; bottom: 0; left: 0; padding: 0 8% 1em 8%; width: 100%; } .recipes-main #hero .row .columns figure figcaption p a { color: #09457d; font-family: "Kievit Book"; line-height: 1em; text-transform: uppercase; } @media screen and (min-width: 1281px) { .recipes-main #hero .row .columns figure figcaption p a { font-size: 1.5625em; } } @media screen and (max-width: 1280px) { .recipes-main #hero .row .columns figure figcaption p a { font-size: 1.48438em; } } @media screen and (max-width: 1120px) { .recipes-main #hero .row .columns figure figcaption p a { font-size: 1.40625em; } } @media screen and (max-width: 960px) { .recipes-main #hero .row .columns figure figcaption p a { font-size: 1.32813em; } } @media screen and (max-width: 800px) { .recipes-main #hero .row .columns figure figcaption p a { font-size: 1.25em; } } @media screen and (max-width: 640px) { .recipes-main #hero .row .columns figure figcaption p a { font-size: 1.5625em; } } @media screen and (max-width: 480px) { .recipes-main #hero .row .columns figure figcaption p a { font-size: 1.25em; } } .recipes-main .recipe-search { background-color: #e4e4e4; -webkit-box-shadow: inset 0 8px 8px -8px #666666, inset 0 -8px 8px -8px #666666; -moz-box-shadow: inset 0 8px 8px -8px #666666, inset 0 -8px 8px -8px #666666; box-shadow: inset 0 8px 8px -8px #666666, inset 0 -8px 8px -8px #666666; } @media screen and (max-width: 640px) { .recipes-main .recipe-search .row { padding-left: 5%; padding-right: 5%; } } .recipes-main .recipe-search .columns.large-8 { padding-left: 0; } @media screen and (max-width: 640px) { .recipes-main .recipe-search .columns.large-8 { padding-left: 0.9375em; } } .recipes-main .recipe-search form { padding-top: 60px; padding-bottom: 35px; } @media screen and (max-width: 1120px) { .recipes-main .recipe-search form { padding-top: 30px; padding-bottom: 30px; } } .recipes-main .recipe-search form input[type="text"] { color: #0097dc; font-family: "Kievit Book"; line-height: 1em; padding-left: 1em; } @media screen and (min-width: 1281px) { .recipes-main .recipe-search form input[type="text"] { font-size: 1.25em; } } @media screen and (max-width: 1280px) { .recipes-main .recipe-search form input[type="text"] { font-size: 1.1875em; } } @media screen and (max-width: 1120px) { .recipes-main .recipe-search form input[type="text"] { font-size: 1.125em; } } @media screen and (max-width: 960px) { .recipes-main .recipe-search form input[type="text"] { font-size: 1.0625em; } } @media screen and (max-width: 800px) { .recipes-main .recipe-search form input[type="text"] { font-size: 1em; } } @media screen and (max-width: 640px) { .recipes-main .recipe-search form input[type="text"] { font-size: 1.25em; } } @media screen and (max-width: 480px) { .recipes-main .recipe-search form input[type="text"] { font-size: 1em; } } .recipes-main .recipe-search form .columns { padding-left: 0; padding-right: 0; } .recipes-main .recipe-search form #search { float: left; margin: 0; height: 42px; width: 85%; } @media screen and (max-width: 640px) { .recipes-main .recipe-search form #search { width: 70%; } } .recipes-main .recipe-search form .button { float: left; clear: none; margin: 0; width: 15%; min-width: 0; font-size: 13px; } @media screen and (max-width: 640px) { .recipes-main .recipe-search form .button { width: 30%; } } .recipes-main .recipe-categories { padding: 1em 0; -webkit-box-shadow: black 0px 4px 4px -2px; -moz-box-shadow: black 0px 4px 4px -2px; box-shadow: black 0px 4px 4px -2px; } @media screen and (max-width: 640px) { .recipes-main .recipe-categories .row { padding: 0 5%; } } .recipes-main .recipe-categories .columns { margin: 1em 0; padding-left: 0 !important; padding-right: 0 !important; width: 32%; -webkit-box-shadow: 3px 3px 0 rgba(0, 0, 0, 0.25); -moz-box-shadow: 3px 3px 0 rgba(0, 0, 0, 0.25); box-shadow: 3px 3px 0 rgba(0, 0, 0, 0.25); } @media screen and (max-width: 640px) { .recipes-main .recipe-categories .columns { width: 100%; } } .recipes-main .recipe-categories .columns:nth-child(1) { margin-right: 1%; } .recipes-main .recipe-categories .columns:nth-child(2) { margin-left: 1%; margin-right: 1%; } .recipes-main .recipe-categories .columns:nth-child(3) { margin-left: 1%; } .recipes-main .recipe-categories .lt-ie9 .columns { width: 33.3333%; margin: 0 !important; } .recipes-main .recipe-categories figure { position: relative; } .recipes-main .recipe-categories figure img { width: 100%; } .recipes-main .recipe-categories figure figcaption { background: #fff; background: rgba(255, 255, 255, 0.75); position: absolute; bottom: 0; left: 0; min-height: 112px; width: 100%; } @media screen and (max-width: 640px) { .recipes-main .recipe-categories figure figcaption { min-height: 0em; padding-bottom: 1em; } } .recipes-main .recipe-categories figure figcaption p { color: #404040; font-family: "Kievit Medium"; line-height: 1.3125em; padding: 0 1em; } @media screen and (min-width: 1281px) { .recipes-main .recipe-categories figure figcaption p { font-size: 1em; } } @media screen and (max-width: 1280px) { .recipes-main .recipe-categories figure figcaption p { font-size: 0.95em; } } @media screen and (max-width: 1120px) { .recipes-main .recipe-categories figure figcaption p { font-size: 0.9em; } } @media screen and (max-width: 960px) { .recipes-main .recipe-categories figure figcaption p { font-size: 0.85em; } } @media screen and (max-width: 800px) { .recipes-main .recipe-categories figure figcaption p { font-size: 0.8em; } } @media screen and (max-width: 640px) { .recipes-main .recipe-categories figure figcaption p { font-size: 1em; } } @media screen and (max-width: 480px) { .recipes-main .recipe-categories figure figcaption p { font-size: 0.8em; } } .recipes-main .recipe-categories figure figcaption p a { color: #09457d; display: inline-block; font-family: "Kievit Bold"; line-height: 0.8333em; padding-bottom: 0.25em; text-transform: uppercase; } @media screen and (min-width: 1281px) { .recipes-main .recipe-categories figure figcaption p a { font-size: 1.875em; } } @media screen and (max-width: 1280px) { .recipes-main .recipe-categories figure figcaption p a { font-size: 1.78125em; } } @media screen and (max-width: 1120px) { .recipes-main .recipe-categories figure figcaption p a { font-size: 1.6875em; } } @media screen and (max-width: 960px) { .recipes-main .recipe-categories figure figcaption p a { font-size: 1.59375em; } } @media screen and (max-width: 800px) { .recipes-main .recipe-categories figure figcaption p a { font-size: 1.5em; } } @media screen and (max-width: 640px) { .recipes-main .recipe-categories figure figcaption p a { font-size: 1.875em; } } @media screen and (max-width: 480px) { .recipes-main .recipe-categories figure figcaption p a { font-size: 1.5em; } } .recipes-main .recipe-categories figure figcaption p a:hover { text-decoration: underline; } .recipes-main .recipe-categories figure figcaption p a:active { color: #6e6e6e; } .recipes-main #callouts .row figcaption p { margin-bottom: 2em; } @media screen and (max-width: 1120px) { .recipes-main #callouts .row { min-height: 524px; } .recipes-main #callouts .row figure figcaption p { height: auto; } } @media screen and (max-width: 800px) { .recipes-main #callouts .row { min-height: 472px; } } @media screen and (max-width: 640px) { .recipes-main #callouts .row { min-height: 0; } } .media-center { position: relative; } .media-center #page-texture { position: absolute; right: 0; top: 260px; z-index: 10; } .media-center #page-texture img { float: right; } @media screen and (max-width: 1440px) { .media-center #page-texture { width: 50%; } } @media screen and (max-width: 1000px) { .media-center #page-texture { width: 40%; } } @media screen and (max-width: 640px) { .media-center #page-texture { display: none; } } .media-center #hero > .row { min-height: 258px; } @media screen and (max-width: 640px) { .media-center #hero > .row { min-height: 215px; } } .media-center #hero .info { max-width: 525px; } @media screen and (max-width: 480px) { .media-center #hero .info p { margin-bottom: 2em; } } .media-center #callouts { position: relative; } .media-center #callouts .columns:first-child .row .columns h2 { color: #0962a7; } .media-center #callouts .columns:nth-child(2) .row .columns h2 { color: #0097db; } .media-center #callouts .columns:last-child .row .columns { padding-bottom: 0; } @media screen and (max-width: 640px) { .media-center #callouts .columns:last-child .row .columns { padding-bottom: 23px; } } .media-center #callouts .columns:last-child .row .columns h2 { color: #09457d; } .media-center #callouts .columns .row .columns { padding-top: 60px; padding-bottom: 46px; } @media screen and (max-width: 640px) { .media-center #callouts .columns .row .columns { padding-top: 30px; padding-bottom: 23px; } } .media-center #callouts h2 { line-height: 1.02857em; margin: 0; } @media screen and (min-width: 1281px) { .media-center #callouts h2 { font-size: 2.1875em; } } @media screen and (max-width: 1280px) { .media-center #callouts h2 { font-size: 2.07813em; } } @media screen and (max-width: 1120px) { .media-center #callouts h2 { font-size: 1.96875em; } } @media screen and (max-width: 960px) { .media-center #callouts h2 { font-size: 1.85938em; } } @media screen and (max-width: 800px) { .media-center #callouts h2 { font-size: 1.75em; } } @media screen and (max-width: 640px) { .media-center #callouts h2 { font-size: 2.1875em; } } @media screen and (max-width: 480px) { .media-center #callouts h2 { font-size: 1.75em; } } @media screen and (max-width: 768px) { .media-center #callouts h2 { font-size: 1.55em; } } .media-center #callouts p { line-height: 1.26667em; font-family: "Kievit Book"; margin: 22px 0 0 0; height: auto; max-width: 324px; } @media screen and (min-width: 1281px) { .media-center #callouts p { font-size: 0.9375em; } } @media screen and (max-width: 1280px) { .media-center #callouts p { font-size: 0.89063em; } } @media screen and (max-width: 1120px) { .media-center #callouts p { font-size: 0.84375em; } } @media screen and (max-width: 960px) { .media-center #callouts p { font-size: 0.79688em; } } @media screen and (max-width: 800px) { .media-center #callouts p { font-size: 0.75em; } } @media screen and (max-width: 640px) { .media-center #callouts p { font-size: 0.9375em; } } @media screen and (max-width: 480px) { .media-center #callouts p { font-size: 0.75em; } } .media-center #callouts p:first-child { margin: 16px 0 0 0; } .media-center #callouts .button-input { margin: 22px 0 6px 0; } @media screen and (max-width: 1100px) { .media-center #callouts .button-input input { width: 60%; } .media-center #callouts .button-input .button { width: 40%; } } .media-center #callouts ul.connect { margin: 44px 0 0 0; } .media-center #callouts ul.connect li { margin: 0 0 0 11px; padding: 0 0 0 20px; background: url("images/icons/large-dot.png") left center no-repeat; color: #09457d; line-height: 1.02857em; font-family: "Kievit Book"; text-transform: uppercase; float: left; } @media screen and (min-width: 1281px) { .media-center #callouts ul.connect li { font-size: 2em; } } @media screen and (max-width: 1280px) { .media-center #callouts ul.connect li { font-size: 1.9em; } } @media screen and (max-width: 1120px) { .media-center #callouts ul.connect li { font-size: 1.8em; } } @media screen and (max-width: 960px) { .media-center #callouts ul.connect li { font-size: 1.7em; } } @media screen and (max-width: 800px) { .media-center #callouts ul.connect li { font-size: 1.6em; } } @media screen and (max-width: 640px) { .media-center #callouts ul.connect li { font-size: 2em; } } @media screen and (max-width: 480px) { .media-center #callouts ul.connect li { font-size: 1.6em; } } .media-center #callouts ul.connect li:first-child { background: none; padding: 0; margin: 0; } @media screen and (max-width: 1400px) { .media-center #callouts ul.connect li a { line-height: 1em; } } @media screen and (max-width: 1400px) and (min-width: 1281px) { .media-center #callouts ul.connect li a { font-size: 1.4em; } } @media screen and (max-width: 1400px) and (max-width: 1280px) { .media-center #callouts ul.connect li a { font-size: 1.33em; } } @media screen and (max-width: 1400px) and (max-width: 1120px) { .media-center #callouts ul.connect li a { font-size: 1.26em; } } @media screen and (max-width: 1400px) and (max-width: 960px) { .media-center #callouts ul.connect li a { font-size: 1.19em; } } @media screen and (max-width: 1400px) and (max-width: 800px) { .media-center #callouts ul.connect li a { font-size: 1.12em; } } @media screen and (max-width: 1400px) and (max-width: 640px) { .media-center #callouts ul.connect li a { font-size: 1.4em; } } @media screen and (max-width: 1400px) and (max-width: 480px) { .media-center #callouts ul.connect li a { font-size: 1.12em; } } @media screen and (max-width: 900px) { .media-center #callouts ul.connect { display: none; } } .media-center #callouts .bottom-shadow { position: absolute; bottom: 0; left: 0; width: 100%; background: url("images/backgrounds/media-callout-bottom-shadow.png") repeat-x; height: 7px; } .media-center .media-content { background: #e6e6e6; } @media screen and (max-width: 640px) { .media-center .media-content .shadow { background: url("images/backgrounds/recipe-category-shadow.png") repeat-x; height: 11px; top: 0; left: 0; width: 100%; } } .media-center .media-content h2 { line-height: 1em; width: 100%; padding: 54px 0 36px 0; margin: 0 0 42px 0; border-bottom: 1px solid #82a8cb; } @media screen and (min-width: 1281px) { .media-center .media-content h2 { font-size: 3.5625em; } } @media screen and (max-width: 1280px) { .media-center .media-content h2 { font-size: 3.38438em; } } @media screen and (max-width: 1120px) { .media-center .media-content h2 { font-size: 3.20625em; } } @media screen and (max-width: 960px) { .media-center .media-content h2 { font-size: 3.02813em; } } @media screen and (max-width: 800px) { .media-center .media-content h2 { font-size: 2.85em; } } @media screen and (max-width: 640px) { .media-center .media-content h2 { font-size: 3.5625em; } } @media screen and (max-width: 480px) { .media-center .media-content h2 { font-size: 2.85em; } } @media screen and (max-width: 640px) { .media-center .media-content h2 { line-height: 1em; padding-bottom: 10px; margin-bottom: 12px; } } @media screen and (max-width: 640px) and (min-width: 1281px) { .media-center .media-content h2 { font-size: 3.75em; } } @media screen and (max-width: 640px) and (max-width: 1280px) { .media-center .media-content h2 { font-size: 3.5625em; } } @media screen and (max-width: 640px) and (max-width: 1120px) { .media-center .media-content h2 { font-size: 3.375em; } } @media screen and (max-width: 640px) and (max-width: 960px) { .media-center .media-content h2 { font-size: 3.1875em; } } @media screen and (max-width: 640px) and (max-width: 800px) { .media-center .media-content h2 { font-size: 3em; } } @media screen and (max-width: 640px) and (max-width: 640px) { .media-center .media-content h2 { font-size: 3.75em; } } @media screen and (max-width: 640px) and (max-width: 480px) { .media-center .media-content h2 { font-size: 3em; } } @media screen and (max-width: 480px) { .media-center .media-content h2 { font-size: 40px; } } .media-center .media-content .fake-select { position: relative; } .media-center .media-content .fake-select a { font-size: 18px !important; padding-top: 1em !important; } .media-center .media-content .fake-select ul { position: absolute; top: 100%; left: 0; z-index: 1000; width: 100%; } .media-center .media-content .media-sidebar { background: #fff; -webkit-box-shadow: 0px 2px 1px rgba(0, 0, 0, 0.4); -moz-box-shadow: 0px 2px 1px rgba(0, 0, 0, 0.4); box-shadow: 0px 2px 1px rgba(0, 0, 0, 0.4); margin: 0 0 28px 0; } @media screen and (min-width: 800px) { .media-center .media-content .media-sidebar { max-height: 1220px; } } .media-center .media-content .media-sidebar .fake-select > a { margin: 0; } .media-center .media-content .media-sidebar ul li { background: none; padding: 20px 20px 0 20px; margin: 0; cursor: pointer; } .media-center .media-content .media-sidebar ul li .inner-content { display: block; border-bottom: 1px solid #82a8cb; padding: 0 0 14px 0; } .media-center .media-content .media-sidebar ul li .inner-content:last-child { border: 0; } .media-center .media-content .media-sidebar ul li.active { margin: -1px 0 0 0; border: solid 3px #0097db; -webkit-box-shadow: inset 0px 0px 15px 3px rgba(0, 151, 219, 0.31); box-shadow: inset 0px 0px 15px 3px rgba(0, 151, 219, 0.31); } .media-center .media-content .media-sidebar ul li.active .inner-content { border-bottom: none; } @media screen and (max-width: 900px) { .media-center .media-content .large-9 { display: none; } } .media-center .media-content .large-9 h3 { line-height: 1.02857em; color: #09457d; max-width: 500px; margin-top: 10px; } @media screen and (min-width: 1281px) { .media-center .media-content .large-9 h3 { font-size: 2.1875em; } } @media screen and (max-width: 1280px) { .media-center .media-content .large-9 h3 { font-size: 2.07813em; } } @media screen and (max-width: 1120px) { .media-center .media-content .large-9 h3 { font-size: 1.96875em; } } @media screen and (max-width: 960px) { .media-center .media-content .large-9 h3 { font-size: 1.85938em; } } @media screen and (max-width: 800px) { .media-center .media-content .large-9 h3 { font-size: 1.75em; } } @media screen and (max-width: 640px) { .media-center .media-content .large-9 h3 { font-size: 2.1875em; } } @media screen and (max-width: 480px) { .media-center .media-content .large-9 h3 { font-size: 1.75em; } } @media screen and (max-width: 640px) { .media-center .media-content .large-9 h3 { line-height: 1em; margin: 10px 0 20px 0; } } @media screen and (max-width: 640px) and (min-width: 1281px) { .media-center .media-content .large-9 h3 { font-size: 1.7em; } } @media screen and (max-width: 640px) and (max-width: 1280px) { .media-center .media-content .large-9 h3 { font-size: 1.615em; } } @media screen and (max-width: 640px) and (max-width: 1120px) { .media-center .media-content .large-9 h3 { font-size: 1.53em; } } @media screen and (max-width: 640px) and (max-width: 960px) { .media-center .media-content .large-9 h3 { font-size: 1.445em; } } @media screen and (max-width: 640px) and (max-width: 800px) { .media-center .media-content .large-9 h3 { font-size: 1.36em; } } @media screen and (max-width: 640px) and (max-width: 640px) { .media-center .media-content .large-9 h3 { font-size: 1.7em; } } @media screen and (max-width: 640px) and (max-width: 480px) { .media-center .media-content .large-9 h3 { font-size: 1.36em; } } @media screen and (max-width: 480px) { .media-center .media-content .large-9 h3 { font-size: 26px; } } .media-center .media-content .large-9 img { margin: 22px 0 20px 0; border-left: 8px solid #f0f0f0; border-right: 8px solid #f0f0f0; border-top: 8px solid #d6d6d6; border-bottom: 8px solid #d6d6d6; -webkit-box-shadow: 2px 3px 5px rgba(75, 75, 75, 0.75); -moz-box-shadow: 2px 3px 5px rgba(75, 75, 75, 0.75); box-shadow: 2px 3px 5px rgba(75, 75, 75, 0.75); } .media-center .media-content .large-9 p { line-height: 1.33333em; font-family: "Kievit Book"; margin: 0 0 28px 0; } @media screen and (min-width: 1281px) { .media-center .media-content .large-9 p { font-size: 0.9375em; } } @media screen and (max-width: 1280px) { .media-center .media-content .large-9 p { font-size: 0.89063em; } } @media screen and (max-width: 1120px) { .media-center .media-content .large-9 p { font-size: 0.84375em; } } @media screen and (max-width: 960px) { .media-center .media-content .large-9 p { font-size: 0.79688em; } } @media screen and (max-width: 800px) { .media-center .media-content .large-9 p { font-size: 0.75em; } } @media screen and (max-width: 640px) { .media-center .media-content .large-9 p { font-size: 0.9375em; } } @media screen and (max-width: 480px) { .media-center .media-content .large-9 p { font-size: 0.75em; } } .media-center .media-content .large-9 p.lead { font-family: "Kievit Medium"; margin: 0 0 5px 0; } .media-center .media-content .carrot { margin-bottom: 22px; display: none; } @media screen and (max-width: 900px) { .media-center .media-content .carrot { display: block; } } @media screen and (max-width: 900px) { .media-center .media-content .large-3, .media-center .media-content .large-9 { width: 100%; float: none; line-height: 1em; } } @media screen and (max-width: 900px) and (min-width: 1281px) { .media-center .media-content .large-3, .media-center .media-content .large-9 { font-size: 1.5em; } } @media screen and (max-width: 900px) and (max-width: 1280px) { .media-center .media-content .large-3, .media-center .media-content .large-9 { font-size: 1.425em; } } @media screen and (max-width: 900px) and (max-width: 1120px) { .media-center .media-content .large-3, .media-center .media-content .large-9 { font-size: 1.35em; } } @media screen and (max-width: 900px) and (max-width: 960px) { .media-center .media-content .large-3, .media-center .media-content .large-9 { font-size: 1.275em; } } @media screen and (max-width: 900px) and (max-width: 800px) { .media-center .media-content .large-3, .media-center .media-content .large-9 { font-size: 1.2em; } } @media screen and (max-width: 900px) and (max-width: 640px) { .media-center .media-content .large-3, .media-center .media-content .large-9 { font-size: 1.5em; } } @media screen and (max-width: 900px) and (max-width: 480px) { .media-center .media-content .large-3, .media-center .media-content .large-9 { font-size: 1.2em; } } @media screen and (max-width: 480px) { .media-center .media-content { line-height: 1em; } } @media screen and (max-width: 480px) and (min-width: 1281px) { .media-center .media-content { font-size: 1.5em; } } @media screen and (max-width: 480px) and (max-width: 1280px) { .media-center .media-content { font-size: 1.425em; } } @media screen and (max-width: 480px) and (max-width: 1120px) { .media-center .media-content { font-size: 1.35em; } } @media screen and (max-width: 480px) and (max-width: 960px) { .media-center .media-content { font-size: 1.275em; } } @media screen and (max-width: 480px) and (max-width: 800px) { .media-center .media-content { font-size: 1.2em; } } @media screen and (max-width: 480px) and (max-width: 640px) { .media-center .media-content { font-size: 1.5em; } } @media screen and (max-width: 480px) and (max-width: 480px) { .media-center .media-content { font-size: 1.2em; } } @media screen and (max-width: 900px) { .media-center-article .large-3 { display: none; } } @media screen and (max-width: 900px) { .media-center-article .large-9 { display: block !important; } } .search-results #breadcrumbs { display: none !important; } .search-results article { position: relative; } .search-results article #page-texture { position: absolute; right: 0; top: 200px; z-index: 10; } @media screen and (max-width: 960px) { .search-results article #page-texture { display: none; } } .search-results article #page-texture img { float: right; width: 60%; } .search-results article #hero.simple > .row { min-height: 140px; } .search-results article #hero.simple p { padding-bottom: 1em; } .search-results article .search { background-color: #e4e4e4; -webkit-box-shadow: inset 0 8px 8px -8px #333333, inset 0 -8px 8px -8px #333333; -moz-box-shadow: inset 0 8px 8px -8px #333333, inset 0 -8px 8px -8px #333333; box-shadow: inset 0 8px 8px -8px #333333, inset 0 -8px 8px -8px #333333; padding: 20px 0; } .search-results article .search ::-webkit-input-placeholder { color: #0097dc; font-style: italic; } .search-results article .search :-moz-placeholder { color: #0097dc; font-style: italic; } .search-results article .search ::-moz-placeholder { color: #0097dc; font-style: italic; } .search-results article .search :-ms-input-placeholder { color: #0097dc; font-style: italic; } @media screen and (max-width: 640px) { .search-results article .search { padding: 20px 0; } } .search-results article .search input { height: 41px; line-height: 1em; } @media screen and (min-width: 1281px) { .search-results article .search input { font-size: 1.25em; } } @media screen and (max-width: 1280px) { .search-results article .search input { font-size: 1.1875em; } } @media screen and (max-width: 1120px) { .search-results article .search input { font-size: 1.125em; } } @media screen and (max-width: 960px) { .search-results article .search input { font-size: 1.0625em; } } @media screen and (max-width: 800px) { .search-results article .search input { font-size: 1em; } } @media screen and (max-width: 640px) { .search-results article .search input { font-size: 1.25em; } } @media screen and (max-width: 480px) { .search-results article .search input { font-size: 1em; } } .search-results article .search .button { padding: 15px 5px 12px 5px; } @media screen and (max-width: 640px) { .search-results article .search form .button-input input { width: 70%; } .search-results article .search form .button-input .button { width: 30%; } } .search-results article #search-results.all .large-3 .recipe-filter, .search-results article #search-results.all .large-3 .product-filter, .search-results article #search-results.howto .large-3 .recipe-filter, .search-results article #search-results.howto .large-3 .product-filter { display: none; } .search-results article #search-results.all .results .recipe-filter, .search-results article #search-results.all .results .product-filter, .search-results article #search-results.howto .results .recipe-filter, .search-results article #search-results.howto .results .product-filter { display: block; } .search-results article #search-results.recipe .large-3 .recipe-filter, .search-results article #search-results.recipe .results .recipe-filter { display: block; } .search-results article #search-results.recipe .large-3 .product-filter, .search-results article #search-results.recipe .results .product-filter { display: none; } .search-results article #search-results.product .large-3 .product-filter, .search-results article #search-results.product .results .product-filter { display: block; } .search-results article #search-results.product .large-3 .recipe-filter, .search-results article #search-results.product .results .recipe-filter { display: none; } .search-results article #search-results .large-3 { padding-top: 54px; padding-bottom: 54px; } @media screen and (max-width: 800px) { .search-results article #search-results .large-3 { padding-top: 25px; padding-bottom: 0px; } } .search-results article #search-results .large-3 .button { width: 100%; margin: 0 0 8px 0; } @media screen and (max-width: 800px) { .search-results article #search-results .large-3 .button { width: 100%; margin: 0 0 2% 0; float: left; } } .search-results article #search-results .large-3 .sort-by { margin-bottom: 20px; clear: both; } .search-results article #search-results .results.large-9 { padding-top: 54px; } @media screen and (max-width: 640px) { .search-results article #search-results .results.large-9 { padding-top: 30px; } } .search-results article #search-results .results.large-9 > .row, .search-results article #search-results .results.large-9 > .recipe { border-bottom: 1px solid #82a8cb; padding-bottom: 28px; margin-bottom: 32px; } .search-results article #search-results .results.large-9 > .row { margin-right: 0; margin-left: 0; } .search-results article #search-results .results.large-9 > .row .small-12:first-child { padding-left: 0; } .search-results article #search-results .results.large-9 > :first-child { padding-top: 0; } .search-results article #search-results .results.large-9 > :last-child { border-bottom: 0; } .search-results article #search-results .results.large-9 .large-5 figure img { border-left: 8px solid #f0f0f0; border-right: 8px solid #f0f0f0; border-top: 8px solid #d6d6d6; border-bottom: 8px solid #d6d6d6; -webkit-box-shadow: 2px 3px 5px rgba(75, 75, 75, 0.75); -moz-box-shadow: 2px 3px 5px rgba(75, 75, 75, 0.75); box-shadow: 2px 3px 5px rgba(75, 75, 75, 0.75); } @media screen and (max-width: 640px) { .search-results article #search-results .results.large-9 .large-5, .search-results article #search-results .results.large-9 .large-7 { padding-left: 0px; padding-right: 0px; } } .search-results article #search-results .results.large-9 h2 { margin: 0; } @media screen and (max-width: 640px) { .search-results article #search-results .results.large-9 h2 { margin: 0; } } .search-results article #search-results .results.large-9 h2 a { color: #0962a7; } .search-results article #search-results .results.large-9 h2 a:hover { color: #0097dc; text-decoration: none; } @media screen and (max-width: 800px) { .search-results article #search-results .results.large-9 .large-7 h2 { margin: 0.74285em 0 0 0; } } .search-results article #search-results > :last-child { margin-bottom: 15px; } @media screen and (max-width: 800px) { .search-results article .small-12 { width: 100%; } .search-results article .small-6 { width: 100%; } .search-results article .small-6 label { max-width: 85%; } } @media screen and (max-width: 800px) { .search-results article .recipe .small-6 { width: 50%; } .search-results article .recipe dd .small-6 { width: 100%; } } .coupons #page-texture { position: absolute; right: 0; top: 340px; z-index: 10; } .coupons #page-texture img { float: right; } @media screen and (max-width: 1440px) { .coupons #page-texture { width: 50%; } } @media screen and (max-width: 1000px) { .coupons #page-texture { width: 40%; } } @media screen and (max-width: 800px) { .coupons #page-texture { top: 8.5%; } } @media screen and (max-width: 700px) { .coupons #page-texture { top: 9%; } } @media screen and (max-width: 640px) { .coupons #page-texture { display: none; } } .coupons #hero .info { margin-left: -0.9375em; } @media screen and (max-width: 640px) { .coupons #hero .info { margin-left: 0; } } .coupons #hero .info p { line-height: 1.5em; } @media screen and (min-width: 1281px) { .coupons #hero .info p { font-size: 1.375em; } } @media screen and (max-width: 1280px) { .coupons #hero .info p { font-size: 1.30625em; } } @media screen and (max-width: 1120px) { .coupons #hero .info p { font-size: 1.2375em; } } @media screen and (max-width: 960px) { .coupons #hero .info p { font-size: 1.16875em; } } @media screen and (max-width: 800px) { .coupons #hero .info p { font-size: 1.1em; } } @media screen and (max-width: 640px) { .coupons #hero .info p { font-size: 1.375em; } } @media screen and (max-width: 480px) { .coupons #hero .info p { font-size: 1.1em; } } .coupons #hero .large-12 { padding-left: 0; padding-right: 0; } @media screen and (max-width: 640px) { .coupons #hero .large-12 { padding-left: 0.9375em; padding-right: 0.9375em; } } .coupons #hero .disclaimer { margin-top: 110px; margin-bottom: 1em; } @media screen and (max-width: 640px) { .coupons #hero .disclaimer { margin: 1em 0 0 0; } } .coupons #hero .iframe-container { border: 3px solid #0097dc; -webkit-box-shadow: 3px 3px 0px rgba(0, 0, 0, 0.17); -moz-box-shadow: 3px 3px 0px rgba(0, 0, 0, 0.17); box-shadow: 3px 3px 0px rgba(0, 0, 0, 0.17); position: relative; padding-bottom: 278px; height: 0; overflow: hidden; } @media screen and (max-width: 640px) { .coupons #hero .iframe-container { display: none; padding-bottom: 160px; overflow: scroll; } } .coupons #hero .iframe-container .coupon-frame { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .coupons #hero .coupon-frame { width: 100% !important; height: 278px; border: 3px solid #0097dc; -webkit-box-shadow: 3px 3px 0px rgba(0, 0, 0, 0.17); -moz-box-shadow: 3px 3px 0px rgba(0, 0, 0, 0.17); box-shadow: 3px 3px 0px rgba(0, 0, 0, 0.17); } @media screen and (max-width: 640px) { .coupons #hero .coupon-frame { height: 160px !important; } } .coupons #hero .coupon-button { display: none; } @media screen and (max-width: 640px) { .coupons #hero .coupon-button { display: block; margin: 46px 0 0 0; max-width: 70%; font-size: 1.03em; } } .coupons #hero form.coupon-search { margin: 50px 0 0 0; } .coupons #hero form.coupon-search input[type="text"] { width: 80%; float: left; margin: 0; } .coupons #hero form.coupon-search .button { width: 20%; float: left; min-width: 0; margin: 0 0 0 -1px; font-family: "Kievit Medium"; font-size: 12px; line-height: 12px; padding: 5px 11px 3px 11px; clear: none; } .coupons #hero .social { margin: 20px 0 0 0; } @media screen and (max-width: 640px) { .coupons #hero .social { margin-bottom: 0; } .coupons #hero .social li { width: 50%; } .coupons #hero .social .googleplus { clear: left; } } .coupons .alt-image-list { margin-top: 52px; } @media screen and (max-width: 640px) { .coupons .alt-image-list { margin-top: 1em; } } .coupons .alt-image-list section { background-position: left top; clear: both; padding-bottom: 15px; padding-top: 4em; } .coupons .alt-image-list section > div { margin: 0 -0.9375em; } @media screen and (max-width: 640px) { .coupons .alt-image-list section > div { margin: 0; } } @media screen and (max-width: 1280px) { .coupons .alt-image-list section { padding-top: 3em; } } @media screen and (max-width: 1120px) { .coupons .alt-image-list section { padding-top: 2em; } } @media screen and (max-width: 960px) { .coupons .alt-image-list section { padding-top: 1em; } } .coupons .alt-image-list section .text { padding-top: 0; padding-bottom: 0 !important; } .coupons .alt-image-list section .text p { line-height: 1.5em; max-width: 90% !important; } @media screen and (min-width: 1281px) { .coupons .alt-image-list section .text p { font-size: 1.375em; } } @media screen and (max-width: 1280px) { .coupons .alt-image-list section .text p { font-size: 1.30625em; } } @media screen and (max-width: 1120px) { .coupons .alt-image-list section .text p { font-size: 1.2375em; } } @media screen and (max-width: 960px) { .coupons .alt-image-list section .text p { font-size: 1.16875em; } } @media screen and (max-width: 800px) { .coupons .alt-image-list section .text p { font-size: 1.1em; } } @media screen and (max-width: 640px) { .coupons .alt-image-list section .text p { font-size: 1.375em; } } @media screen and (max-width: 480px) { .coupons .alt-image-list section .text p { font-size: 1.1em; } } .coupons .alt-image-list section .text p.disclaimer { font-family: "Kievit Book"; line-height: 1.6363em; margin-top: 3.5em; } @media screen and (min-width: 1281px) { .coupons .alt-image-list section .text p.disclaimer { font-size: 0.8125em; } } @media screen and (max-width: 1280px) { .coupons .alt-image-list section .text p.disclaimer { font-size: 0.77188em; } } @media screen and (max-width: 1120px) { .coupons .alt-image-list section .text p.disclaimer { font-size: 0.73125em; } } @media screen and (max-width: 960px) { .coupons .alt-image-list section .text p.disclaimer { font-size: 0.69063em; } } @media screen and (max-width: 800px) { .coupons .alt-image-list section .text p.disclaimer { font-size: 0.65em; } } @media screen and (max-width: 640px) { .coupons .alt-image-list section .text p.disclaimer { font-size: 0.8125em; } } @media screen and (max-width: 480px) { .coupons .alt-image-list section .text p.disclaimer { font-size: 0.65em; } } @media screen and (max-width: 960px) { .coupons .alt-image-list section .text p.disclaimer { line-height: 1.6363em; } } @media screen and (max-width: 960px) and (min-width: 1281px) { .coupons .alt-image-list section .text p.disclaimer { font-size: 0.9375em; } } @media screen and (max-width: 960px) and (max-width: 1280px) { .coupons .alt-image-list section .text p.disclaimer { font-size: 0.89063em; } } @media screen and (max-width: 960px) and (max-width: 1120px) { .coupons .alt-image-list section .text p.disclaimer { font-size: 0.84375em; } } @media screen and (max-width: 960px) and (max-width: 960px) { .coupons .alt-image-list section .text p.disclaimer { font-size: 0.79688em; } } @media screen and (max-width: 960px) and (max-width: 800px) { .coupons .alt-image-list section .text p.disclaimer { font-size: 0.75em; } } @media screen and (max-width: 960px) and (max-width: 640px) { .coupons .alt-image-list section .text p.disclaimer { font-size: 0.9375em; } } @media screen and (max-width: 960px) and (max-width: 480px) { .coupons .alt-image-list section .text p.disclaimer { font-size: 0.75em; } } .coupons .alt-image-list section .text p.disclaimer strong { font-family: "Kievit Bold"; } .coupons .alt-image-list section .text p a.primary { line-height: 1em; } @media screen and (min-width: 1281px) { .coupons .alt-image-list section .text p a.primary { font-size: 0.875em; } } @media screen and (max-width: 1280px) { .coupons .alt-image-list section .text p a.primary { font-size: 0.83125em; } } @media screen and (max-width: 1120px) { .coupons .alt-image-list section .text p a.primary { font-size: 0.7875em; } } @media screen and (max-width: 960px) { .coupons .alt-image-list section .text p a.primary { font-size: 0.74375em; } } @media screen and (max-width: 800px) { .coupons .alt-image-list section .text p a.primary { font-size: 0.7em; } } @media screen and (max-width: 640px) { .coupons .alt-image-list section .text p a.primary { font-size: 0.875em; } } @media screen and (max-width: 480px) { .coupons .alt-image-list section .text p a.primary { font-size: 0.7em; } } @media screen and (max-width: 960px) { .coupons .alt-image-list section .text p a.primary { line-height: 1em; } } @media screen and (max-width: 960px) and (min-width: 1281px) { .coupons .alt-image-list section .text p a.primary { font-size: 1em; } } @media screen and (max-width: 960px) and (max-width: 1280px) { .coupons .alt-image-list section .text p a.primary { font-size: 0.95em; } } @media screen and (max-width: 960px) and (max-width: 1120px) { .coupons .alt-image-list section .text p a.primary { font-size: 0.9em; } } @media screen and (max-width: 960px) and (max-width: 960px) { .coupons .alt-image-list section .text p a.primary { font-size: 0.85em; } } @media screen and (max-width: 960px) and (max-width: 800px) { .coupons .alt-image-list section .text p a.primary { font-size: 0.8em; } } @media screen and (max-width: 960px) and (max-width: 640px) { .coupons .alt-image-list section .text p a.primary { font-size: 1em; } } @media screen and (max-width: 960px) and (max-width: 480px) { .coupons .alt-image-list section .text p a.primary { font-size: 0.8em; } } .coupons .alt-image-list section .image { height: 400px; } @media screen and (max-width: 960px) { .coupons .alt-image-list section .image { height: auto; margin-bottom: 0; padding-bottom: 0; } } .coupons .alt-image-list section .image img { top: 0; bottom: auto; width: 100%; } .coupons .alt-image-list section .image-left > img { position: absolute; top: -3em; left: 0; width: 25%; z-index: 1; } @media screen and (max-width: 960px) { .coupons .alt-image-list section .image-left > img { display: none; } } .coupons .alt-image-list section .image-right > img { position: absolute; top: -6em; right: 0; width: 25%; z-index: 1; } @media screen and (max-width: 960px) { .coupons .alt-image-list section .image-right > img { display: none; } } .coupons .alt-image-list section:nth-child(odd) h2 { color: #09457d; } .coupons .alt-image-list section:nth-child(even) h2 { color: #0097db; } .calculators-conversions article { position: relative; } .calculators-conversions article #page-texture { position: absolute; right: 0; top: 350px; z-index: 10; } .calculators-conversions article #page-texture img { float: right; } @media screen and (max-width: 1100px) { .calculators-conversions article #page-texture { width: 40%; } } @media screen and (max-width: 800px) { .calculators-conversions article #page-texture { top: 8.5%; } } @media screen and (max-width: 700px) { .calculators-conversions article #page-texture { top: 9%; } } @media screen and (max-width: 640px) { .calculators-conversions article #page-texture { display: none; } } .calculators-conversions article #hero { border-top: 0; padding: 260px 0 36px 0; } @media screen and (max-width: 900px) { .calculators-conversions article #hero h1 { font-size: 2.5em; } } @media screen and (max-width: 768px) { .calculators-conversions article #hero { padding: 150px 0 36px 0; } .calculators-conversions article #hero h1 { font-size: 2.1em; } } @media screen and (max-width: 640px) { .calculators-conversions article #hero { padding: 100px 0 36px 0; } .calculators-conversions article #hero h1 { font-size: 1.85em; } } @media screen and (max-width: 480px) { .calculators-conversions article #hero { padding-top: 70px; } } .calculators-conversions article #hero > .row { min-height: 170px; } .calculators-conversions article #hero > .row .columns { border-top: 0; } .calculators-conversions article #hero .info .button { margin: 36px 13px 0 0; } .calculators-conversions article #hero .info .button + a { color: #404040; line-height: 1em; font-family: "Kievit Book"; } @media screen and (min-width: 1281px) { .calculators-conversions article #hero .info .button + a { font-size: 0.9375em; } } @media screen and (max-width: 1280px) { .calculators-conversions article #hero .info .button + a { font-size: 0.89063em; } } @media screen and (max-width: 1120px) { .calculators-conversions article #hero .info .button + a { font-size: 0.84375em; } } @media screen and (max-width: 960px) { .calculators-conversions article #hero .info .button + a { font-size: 0.79688em; } } @media screen and (max-width: 800px) { .calculators-conversions article #hero .info .button + a { font-size: 0.75em; } } @media screen and (max-width: 640px) { .calculators-conversions article #hero .info .button + a { font-size: 0.9375em; } } @media screen and (max-width: 480px) { .calculators-conversions article #hero .info .button + a { font-size: 0.75em; } } .calculators-conversions article #hero .info .button + a:hover { text-decoration: underline; } .calculators-conversions article #hero .info .social { margin: 1.75em 0 0 0; } .calculators-conversions article #hero .info p { font-size: 1.2em; } .calculators-conversions article section { padding-bottom: 36px; } .calculators-conversions article section > .row:first-child > .columns { border-top: #77a7cf 1px solid; padding-top: 36px; } .calculators-conversions article section h2 { margin-top: 0; } @media screen and (max-width: 800px) and (min-width: 640px) { .calculators-conversions article section .four td { padding: 16px; } } .calculators-conversions article section .large-6 { margin-left: -0.9375em; padding-right: 0; } @media screen and (max-width: 640px) { .calculators-conversions article section .large-6 { margin-left: 0; padding-right: 0.9375em; } } .lt-ie9 .calculators-conversions article section .large-6 { margin-left: 0; padding-left: 0; padding-right: 0.9375em; } .lt-ie9 .calculators-conversions article section .large-6 + .large-6 { padding-left: 0.9375em; padding-right: 0; } .calculators-conversions article section .large-7 { padding-left: 0; padding-right: 0; } @media screen and (max-width: 640px) { .calculators-conversions article section .large-7 { padding-left: 0.9375em; padding-right: 0.9375em; } } .calculators-conversions article section .large-12 { padding-left: 0; padding-right: 0; } @media screen and (max-width: 640px) { .calculators-conversions article section .large-12 { padding-left: 0.9375em; padding-right: 0.9375em; } } .calculator { margin: 30px 0 0 0; -webkit-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.5); -moz-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.5); box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.5); border: 1px solid #c2c2c2; } .calculator .title { width: 100%; font-family: "Kievit black"; line-height: 1em; text-align: center; text-transform: uppercase; color: #fff; background: #0097dc; padding: 16px 0 12px 0; } @media screen and (min-width: 1281px) { .calculator .title { font-size: 1.3125em; } } @media screen and (max-width: 1280px) { .calculator .title { font-size: 1.24688em; } } @media screen and (max-width: 1120px) { .calculator .title { font-size: 1.18125em; } } @media screen and (max-width: 960px) { .calculator .title { font-size: 1.11562em; } } @media screen and (max-width: 800px) { .calculator .title { font-size: 1.05em; } } @media screen and (max-width: 640px) { .calculator .title { font-size: 1.3125em; } } @media screen and (max-width: 480px) { .calculator .title { font-size: 1.05em; } } .calculator form { background: #fff; padding-top: 0 !important; padding-bottom: 0 !important; } .calculator form .input { display: inline-block; float: left; width: 50%; padding: 21px 0; text-align: left; } @media screen and (max-width: 640px) { .calculator form .input { text-align: center; } } .calculator form .input .input-wrapper { float: left; width: 50%; } .calculator form .input .input-wrapper input[type="text"] { width: 77px; height: 67px; color: #085daa; line-height: 1em; font-family: "Kievit Bold"; padding-left: 0; text-align: center; margin: 0; float: right; } @media screen and (min-width: 1281px) { .calculator form .input .input-wrapper input[type="text"] { font-size: 2.5em; } } @media screen and (max-width: 1280px) { .calculator form .input .input-wrapper input[type="text"] { font-size: 2.375em; } } @media screen and (max-width: 1120px) { .calculator form .input .input-wrapper input[type="text"] { font-size: 2.25em; } } @media screen and (max-width: 960px) { .calculator form .input .input-wrapper input[type="text"] { font-size: 2.125em; } } @media screen and (max-width: 800px) { .calculator form .input .input-wrapper input[type="text"] { font-size: 2em; } } @media screen and (max-width: 640px) { .calculator form .input .input-wrapper input[type="text"] { font-size: 2.5em; } } @media screen and (max-width: 480px) { .calculator form .input .input-wrapper input[type="text"] { font-size: 2em; } } .calculator form .input .label-wrapper { float: left; width: 50%; } .calculator form .input .label-wrapper label { color: #636363; text-transform: uppercase; font-size: 14px !important; font-family: "Kievit Medium"; padding: 0 0 0 10px; max-width: 100%; width: 100%; text-align: left; margin-top: 1.875em; } @media screen and (max-width: 960px) { .calculator form .input .input-wrapper { float: none; width: 100%; } .calculator form .input .input-wrapper input[type="text"] { float: none; margin: 0 auto; display: block; } .calculator form .input .label-wrapper { float: none; width: 100%; } .calculator form .input .label-wrapper label { margin-top: 10px; padding-left: 0; text-align: center; } .calculator form .input .label-wrapper .center { clear: both; float: none; text-align: center; margin-top: 10px; padding: 0; } .calculator form .input .label-wrapper .center .inner-center { width: 200px; } } @media screen and (max-width: 960px) and (max-width: 1100px) { .calculator form .input .label-wrapper .center .inner-center { width: 125px; } } @media screen and (max-width: 960px) and (max-width: 800px) { .calculator form .input .label-wrapper .center .inner-center { width: 100px; } .calculator form .input .label-wrapper .center .inner-center label { font-size: 12px !important; } } @media screen and (max-width: 960px) and (max-width: 640px) { .calculator form .input .label-wrapper .center .inner-center { width: 200px; } } @media screen and (max-width: 960px) and (max-width: 500px) { .calculator form .input .label-wrapper .center .inner-center { width: 120px; } .calculator form .input .label-wrapper .center .inner-center label { max-width: 65px; } } .calculator form .options { background: url("images/backgrounds/calculator-options.jpg") repeat; padding: 23px 0 7px 0; width: 50%; float: right; min-height: 117px; } @media screen and (max-width: 960px) { .calculator form .options { min-height: 147px; padding-top: 36px; } } .calculator form .options .radio, .calculator form .options .checkbox { margin: 0 0 16px 0; } .calculator form .options label { margin-top: 7px; padding-left: 5px; } .calculator form .options .center { clear: both; } .calculator form .options .center .inner-center { width: 200px; } @media screen and (max-width: 1100px) { .calculator form .options .center .inner-center { width: 125px; } } @media screen and (max-width: 800px) { .calculator form .options .center .inner-center { width: 100px; } .calculator form .options .center .inner-center label { font-size: 12px !important; } } @media screen and (max-width: 640px) { .calculator form .options .center .inner-center { width: 200px; } } @media screen and (max-width: 500px) { .calculator form .options .center .inner-center { width: 120px; } .calculator form .options .center .inner-center label { max-width: 65px; } } .calculator .results { background: url("images/backgrounds/calculator-results.jpg") repeat; padding: 24px 0; text-align: center; } .calculator .results p { color: #085daa; text-transform: uppercase; margin: 0; font-family: "Kievit Bold"; line-height: 1em; } @media screen and (min-width: 1281px) { .calculator .results p { font-size: 1.3125em; } } @media screen and (max-width: 1280px) { .calculator .results p { font-size: 1.24688em; } } @media screen and (max-width: 1120px) { .calculator .results p { font-size: 1.18125em; } } @media screen and (max-width: 960px) { .calculator .results p { font-size: 1.11562em; } } @media screen and (max-width: 800px) { .calculator .results p { font-size: 1.05em; } } @media screen and (max-width: 640px) { .calculator .results p { font-size: 1.3125em; } } @media screen and (max-width: 480px) { .calculator .results p { font-size: 1.05em; } } .calculator .results h3 { margin: 18px 0 0 0; color: #636363; line-height: 1em; font-family: "Kievit Light"; text-transform: none; font-weight: 100; } @media screen and (min-width: 1281px) { .calculator .results h3 { font-size: 2.8125em; } } @media screen and (max-width: 1280px) { .calculator .results h3 { font-size: 2.67188em; } } @media screen and (max-width: 1120px) { .calculator .results h3 { font-size: 2.53125em; } } @media screen and (max-width: 960px) { .calculator .results h3 { font-size: 2.39063em; } } @media screen and (max-width: 800px) { .calculator .results h3 { font-size: 2.25em; } } @media screen and (max-width: 640px) { .calculator .results h3 { font-size: 2.8125em; } } @media screen and (max-width: 480px) { .calculator .results h3 { font-size: 2.25em; } } .calculator .results h3 span span { color: #085daa; font-family: "Kievit Bold"; } @media screen and (max-width: 640px) { .calculator .results h3 { font-size: 35px; } } .calculator .results div { font-family: "Kievit Regular"; line-height: 1.25em; margin-top: 1em; padding: 0 10%; } @media screen and (min-width: 1281px) { .calculator .results div { font-size: 1em; } } @media screen and (max-width: 1280px) { .calculator .results div { font-size: 0.95em; } } @media screen and (max-width: 1120px) { .calculator .results div { font-size: 0.9em; } } @media screen and (max-width: 960px) { .calculator .results div { font-size: 0.85em; } } @media screen and (max-width: 800px) { .calculator .results div { font-size: 0.8em; } } @media screen and (max-width: 640px) { .calculator .results div { font-size: 1em; } } @media screen and (max-width: 480px) { .calculator .results div { font-size: 0.8em; } } .calculator.cook-time form .options .checkbox { margin-top: 25px; } .calculator.cook-time form .options label { margin-top: 30px; } .calc-conv-related-products { margin-bottom: -60px; padding: 1em 0; -webkit-box-shadow: black 0px 4px 4px -2px; -moz-box-shadow: black 0px 4px 4px -2px; box-shadow: black 0px 4px 4px -2px; } @media screen and (max-width: 640px) { .calc-conv-related-products { margin-bottom: 0; padding-bottom: 0 !important; } } @media screen and (max-width: 640px) { .calc-conv-related-products .row { padding: 0 5% 45px; } } .calc-conv-related-products .columns { padding-left: 0 !important; padding-right: 0 !important; width: 32%; } @media screen and (max-width: 640px) { .calc-conv-related-products .columns { width: 100%; } } .calc-conv-related-products .columns:nth-child(1) { margin-right: 1%; } .calc-conv-related-products .columns:nth-child(2) { margin-left: 1%; margin-right: 1%; } .calc-conv-related-products .columns:nth-child(3) { margin-left: 1%; } .calc-conv-related-products .lt-ie9 .columns { width: 33.3333%; margin: 0 !important; } .calc-conv-related-products p { line-height: 1.3125em; } @media screen and (min-width: 1281px) { .calc-conv-related-products p { font-size: 1.25em; } } @media screen and (max-width: 1280px) { .calc-conv-related-products p { font-size: 1.1875em; } } @media screen and (max-width: 1120px) { .calc-conv-related-products p { font-size: 1.125em; } } @media screen and (max-width: 960px) { .calc-conv-related-products p { font-size: 1.0625em; } } @media screen and (max-width: 800px) { .calc-conv-related-products p { font-size: 1em; } } @media screen and (max-width: 640px) { .calc-conv-related-products p { font-size: 1.25em; } } @media screen and (max-width: 480px) { .calc-conv-related-products p { font-size: 1em; } } .calc-conv-related-products .flexslider { background: transparent; margin-top: 1em; padding-bottom: 60px; } .calc-conv-related-products .flexslider .slides li { margin: 0; padding: 0; font-size: 1em !important; } .calc-conv-related-products .flexslider .slides li .play { position: absolute; top: 0; left: 0; } @media screen and (max-width: 800px) { .calc-conv-related-products .flexslider .slides li:nth-child(even) > div { margin-left: 15px; margin-right: 0; } .calc-conv-related-products .flexslider .slides li:nth-child(odd) > div { margin-right: 15px; margin-left: 0; } } @media screen and (max-width: 640px) { .calc-conv-related-products .flexslider { margin-bottom: 0; padding-bottom: 0; } .calc-conv-related-products .flexslider .slides li > div { margin: 0 !important; } } .calc-conv-related-products .flexslider .flex-direction-nav { display: none; width: 100%; } @media screen and (max-width: 640px) { .calc-conv-related-products .flexslider .flex-direction-nav { background: url(images/backgrounds/text-paging.png) 0 0 repeat-x; display: block; bottom: -60px; height: 60px; position: absolute; margin: 0 -5.5%; width: 111%; } .calc-conv-related-products .flexslider .flex-direction-nav a { background: url(images/sprites/arrow.carousel.mobile.png) no-repeat; margin: 0; width: 57px; height: 60px; top: auto; bottom: 0; } .calc-conv-related-products .flexslider .flex-direction-nav a.flex-prev { background-position: 0 0; left: 0; } .calc-conv-related-products .flexslider .flex-direction-nav a.flex-next { background-position: 0 bottom; right: 0; } } .calc-conv-related-products .flexslider .flex-control-nav { bottom: 20px; } @media screen and (max-width: 640px) { .calc-conv-related-products .flexslider .flex-control-nav { display: none; } } .calc-conv-related-products .flexslider .flex-text-paging { display: none; } @media screen and (max-width: 640px) { .calc-conv-related-products .flexslider .flex-text-paging { display: block; position: absolute; bottom: -40px; text-align: center; width: 100%; } } @media screen and (max-width: 640px) { .calc-conv-related-products .row:first-child { padding-bottom: 44px; } } .calc-conv-related-products .row:first-child .flexslider { border-bottom: 1px solid #8eb5d8; margin-bottom: 1em; } @media screen and (max-width: 640px) { .calc-conv-related-products .row:first-child .flexslider { border-bottom: none; } } .how-to #page-texture { position: absolute; left: -2%; top: 520px; z-index: 15; } @media screen and (max-width: 1120px) { .how-to #page-texture { display: none; } } .how-to #hero { position: relative; } .how-to #hero .layers { position: relative; display: block; } @media screen and (max-width: 640px) { .how-to #hero .layers { display: none; } } .how-to #hero .layers .backdrop { overflow: hidden; max-height: 800px; } .how-to #hero .layers .backdrop img, .how-to #hero .layers .backdrop figure { height: 100%; width: 100%; min-height: 800px; max-height: 800px; margin: 0 auto; } @media screen and (max-width: 640px) { .how-to #hero .layers .backdrop img, .how-to #hero .layers .backdrop figure { min-height: 0; } } .how-to #hero .row { position: absolute; top: 250px; left: 0; right: 0; } @media screen and (max-width: 1120px) { .how-to #hero .row { top: 225px; } } @media screen and (max-width: 960px) { .how-to #hero .row { top: 200px; } } @media screen and (max-width: 800px) { .how-to #hero .row { top: 175px; } } @media screen and (max-width: 640px) { .how-to #hero .row { position: static; } } .how-to #hero .row .large-5 img { -webkit-box-shadow: 0 2px 8px rgba(0, 0, 0, 0.5); -moz-box-shadow: 0 2px 8px rgba(0, 0, 0, 0.5); box-shadow: 0 2px 8px rgba(0, 0, 0, 0.5); } .how-to #hero .row .columns { padding: 0; } .how-to #hero .row .columns .info h1 { color: #09457d; font-family: "Kievit black"; line-height: 1em; margin-top: 0; margin-bottom: 0.25em; text-transform: uppercase; text-shadow: 1px 1px 2px #969696; } @media screen and (min-width: 1281px) { .how-to #hero .row .columns .info h1 { font-size: 3em; } } @media screen and (max-width: 1280px) { .how-to #hero .row .columns .info h1 { font-size: 2.85em; } } @media screen and (max-width: 1120px) { .how-to #hero .row .columns .info h1 { font-size: 2.7em; } } @media screen and (max-width: 960px) { .how-to #hero .row .columns .info h1 { font-size: 2.55em; } } @media screen and (max-width: 800px) { .how-to #hero .row .columns .info h1 { font-size: 2.4em; } } @media screen and (max-width: 640px) { .how-to #hero .row .columns .info h1 { font-size: 3em; } } @media screen and (max-width: 480px) { .how-to #hero .row .columns .info h1 { font-size: 2.4em; } } .how-to #hero .row .columns .info h1 + div { margin-top: 1em; margin-bottom: 2em; } .how-to #hero .row .columns .info p { font-family: "Kievit Book"; line-height: 1.375em; margin: 0.25em 0 0.75em 0; width: 78%; } @media screen and (min-width: 1281px) { .how-to #hero .row .columns .info p { font-size: 1.25em; } } @media screen and (max-width: 1280px) { .how-to #hero .row .columns .info p { font-size: 1.1875em; } } @media screen and (max-width: 1120px) { .how-to #hero .row .columns .info p { font-size: 1.125em; } } @media screen and (max-width: 960px) { .how-to #hero .row .columns .info p { font-size: 1.0625em; } } @media screen and (max-width: 800px) { .how-to #hero .row .columns .info p { font-size: 1em; } } @media screen and (max-width: 640px) { .how-to #hero .row .columns .info p { font-size: 1.25em; } } @media screen and (max-width: 480px) { .how-to #hero .row .columns .info p { font-size: 1em; } } @media screen and (max-width: 768px) { .how-to #hero .row .columns .info p { width: 90%; } } .how-to #hero .row .columns .info p.link-list { clear: both; overflow: auto; } .how-to #hero .row .columns .info p.link-list span { display: block; float: left; clear: left; padding-right: 10px; } .how-to #hero .row .columns .info p.link-list a { display: inline; white-space: nowrap; } .how-to #hero .row .columns .info form { overflow: auto; } @media screen and (max-width: 640px) { .how-to #hero .row .columns .info { padding: 8em 5% 2em 5%; position: static; width: 100%; } } .how-to #hero .row .columns .info a.button + label { margin-top: 2em; } @media screen and (max-width: 1280px) { .how-to #hero .row .columns .info a.button + label { margin-top: 1.75em; } } @media screen and (max-width: 640px) { .how-to #hero .row .columns .info a.button + label { margin-top: 1.5em; max-width: 160px !important; } } .how-to #hero .row .columns figure { -webkit-box-shadow: 0 2px 8px rgba(0, 0, 0, 0.5); -moz-box-shadow: 0 2px 8px rgba(0, 0, 0, 0.5); box-shadow: 0 2px 8px rgba(0, 0, 0, 0.5); position: relative; top: -20px; } @media screen and (max-width: 640px) { .how-to #hero .row .columns figure { width: 90%; margin: 0 5%; } } .how-to #hero .row .columns figure > img { width: 100%; } .how-to #hero .row .columns figure figcaption { background: #fff; background: rgba(255, 255, 255, 0.5); position: absolute; width: 100%; bottom: 0; left: 0; padding: 0 8% 1em 8%; } .how-to #hero .row .columns figure figcaption p a { color: #09457d; font-family: "Kievit Book"; line-height: 1em; text-transform: uppercase; } @media screen and (min-width: 1281px) { .how-to #hero .row .columns figure figcaption p a { font-size: 1.5625em; } } @media screen and (max-width: 1280px) { .how-to #hero .row .columns figure figcaption p a { font-size: 1.48438em; } } @media screen and (max-width: 1120px) { .how-to #hero .row .columns figure figcaption p a { font-size: 1.40625em; } } @media screen and (max-width: 960px) { .how-to #hero .row .columns figure figcaption p a { font-size: 1.32813em; } } @media screen and (max-width: 800px) { .how-to #hero .row .columns figure figcaption p a { font-size: 1.25em; } } @media screen and (max-width: 640px) { .how-to #hero .row .columns figure figcaption p a { font-size: 1.5625em; } } @media screen and (max-width: 480px) { .how-to #hero .row .columns figure figcaption p a { font-size: 1.25em; } } .how-to h3 { text-align: center; } .how-to .how-to-extras { background-color: #e4e4e4; -webkit-box-shadow: inset 0 8px 8px -8px #333333, inset 0 -8px 8px -8px #333333; -moz-box-shadow: inset 0 8px 8px -8px #333333, inset 0 -8px 8px -8px #333333; box-shadow: inset 0 8px 8px -8px #333333, inset 0 -8px 8px -8px #333333; padding-bottom: 32px; } .how-to .how-to-extras .row { border-top: #8ca4bb solid 1px; margin-top: 40px; } .how-to .how-to-extras .row:first-child { border-top: none; margin-top: 0; } @media screen and (max-width: 640px) { .how-to .how-to-extras .row { padding-left: 5%; padding-right: 5%; } } .how-to .how-to-extras > .row { padding-top: 0.5em; } .how-to .how-to-extras p { line-height: 1.3125em; color: #404040; font-family: "Kievit Book"; } @media screen and (min-width: 1281px) { .how-to .how-to-extras p { font-size: 1em; } } @media screen and (max-width: 1280px) { .how-to .how-to-extras p { font-size: 0.95em; } } @media screen and (max-width: 1120px) { .how-to .how-to-extras p { font-size: 0.9em; } } @media screen and (max-width: 960px) { .how-to .how-to-extras p { font-size: 0.85em; } } @media screen and (max-width: 800px) { .how-to .how-to-extras p { font-size: 0.8em; } } @media screen and (max-width: 640px) { .how-to .how-to-extras p { font-size: 1em; } } @media screen and (max-width: 480px) { .how-to .how-to-extras p { font-size: 0.8em; } } .how-to .how-to-extras p strong { font-family: "Kievit Medium"; } .how-to .how-to-extras .portions { -webkit-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.5); -moz-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.5); box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.5); border: 1px solid #c2c2c2; } .how-to .how-to-extras .turkey-tips { margin: 1em; } @media screen and (max-width: 960px) { .how-to .how-to-extras .turkey-tips { position: relative; } } @media screen and (max-width: 640px) { .how-to .how-to-extras .turkey-tips { left: auto; bottom: auto; margin-left: 0; margin-right: 0; } } .how-to .how-to-extras ul li { line-height: 1.3125em; color: #404040; font-family: "Kievit Book"; } @media screen and (min-width: 1281px) { .how-to .how-to-extras ul li { font-size: 1em; } } @media screen and (max-width: 1280px) { .how-to .how-to-extras ul li { font-size: 0.95em; } } @media screen and (max-width: 1120px) { .how-to .how-to-extras ul li { font-size: 0.9em; } } @media screen and (max-width: 960px) { .how-to .how-to-extras ul li { font-size: 0.85em; } } @media screen and (max-width: 800px) { .how-to .how-to-extras ul li { font-size: 0.8em; } } @media screen and (max-width: 640px) { .how-to .how-to-extras ul li { font-size: 1em; } } @media screen and (max-width: 480px) { .how-to .how-to-extras ul li { font-size: 0.8em; } } .how-to .how-to-extras .callout { border-top: 1px solid #9ab7d0; margin-top: 2em; margin-bottom: -1em; padding-top: 1em; } @media screen and (max-width: 960px) { .how-to .how-to-extras .callout { margin-bottom: 1em; } } @media screen and (max-width: 640px) { .how-to .how-to-extras .callout { margin-bottom: 0; padding-bottom: 12em; } } .how-to .how-to-extras .callout .row { margin: 0; } .how-to .how-to-extras .callout .row .columns { padding-left: 0; padding-right: 0; } .how-to .how-to-extras .callout p strong { color: #0097dc; display: block; font-family: "Kievit black"; line-height: 1.36em; letter-spacing: -1px; text-transform: uppercase; } @media screen and (min-width: 1281px) { .how-to .how-to-extras .callout p strong { font-size: 1.5625em; } } @media screen and (max-width: 1280px) { .how-to .how-to-extras .callout p strong { font-size: 1.48438em; } } @media screen and (max-width: 1120px) { .how-to .how-to-extras .callout p strong { font-size: 1.40625em; } } @media screen and (max-width: 960px) { .how-to .how-to-extras .callout p strong { font-size: 1.32813em; } } @media screen and (max-width: 800px) { .how-to .how-to-extras .callout p strong { font-size: 1.25em; } } @media screen and (max-width: 640px) { .how-to .how-to-extras .callout p strong { font-size: 1.5625em; } } @media screen and (max-width: 480px) { .how-to .how-to-extras .callout p strong { font-size: 1.25em; } } .how-to .how-to-extras .callout p .button { line-height: 1em; } @media screen and (min-width: 1281px) { .how-to .how-to-extras .callout p .button { font-size: 0.9375em; } } @media screen and (max-width: 1280px) { .how-to .how-to-extras .callout p .button { font-size: 0.89063em; } } @media screen and (max-width: 1120px) { .how-to .how-to-extras .callout p .button { font-size: 0.84375em; } } @media screen and (max-width: 960px) { .how-to .how-to-extras .callout p .button { font-size: 0.79688em; } } @media screen and (max-width: 800px) { .how-to .how-to-extras .callout p .button { font-size: 0.75em; } } @media screen and (max-width: 640px) { .how-to .how-to-extras .callout p .button { font-size: 0.9375em; } } @media screen and (max-width: 480px) { .how-to .how-to-extras .callout p .button { font-size: 0.75em; } } .how-to .how-to-extras .columns.large-8 { padding-left: 0; } @media screen and (max-width: 640px) { .how-to .how-to-extras .columns.large-8 { padding-left: 0.9375em; } } .how-to .how-to-extras form { padding-top: 1.5em; padding-bottom: 42px; } @media screen and (max-width: 640px) { .how-to .how-to-extras form { padding-top: 30px; padding-bottom: 30px; } } .how-to .how-to-extras form input[type="text"] { color: #0097dc; font-family: "Kievit Book"; line-height: 1em; padding-left: 1em; } @media screen and (min-width: 1281px) { .how-to .how-to-extras form input[type="text"] { font-size: 1.25em; } } @media screen and (max-width: 1280px) { .how-to .how-to-extras form input[type="text"] { font-size: 1.1875em; } } @media screen and (max-width: 1120px) { .how-to .how-to-extras form input[type="text"] { font-size: 1.125em; } } @media screen and (max-width: 960px) { .how-to .how-to-extras form input[type="text"] { font-size: 1.0625em; } } @media screen and (max-width: 800px) { .how-to .how-to-extras form input[type="text"] { font-size: 1em; } } @media screen and (max-width: 640px) { .how-to .how-to-extras form input[type="text"] { font-size: 1.25em; } } @media screen and (max-width: 480px) { .how-to .how-to-extras form input[type="text"] { font-size: 1em; } } .how-to .how-to-extras form .columns { padding-left: 0; padding-right: 0; } .how-to .how-to-categories { margin-bottom: -33px; padding: 1em 0; -webkit-box-shadow: black 0px 4px 4px -2px; -moz-box-shadow: black 0px 4px 4px -2px; box-shadow: black 0px 4px 4px -2px; } @media screen and (max-width: 640px) { .how-to .how-to-categories .row { padding: 0 5% 45px; } } .how-to .how-to-categories .columns { padding-left: 0 !important; padding-right: 0 !important; width: 32%; } @media screen and (max-width: 640px) { .how-to .how-to-categories .columns { width: 100%; } } .how-to .how-to-categories .columns:nth-child(1) { margin-right: 1%; } .how-to .how-to-categories .columns:nth-child(2) { margin-left: 1%; margin-right: 1%; } .how-to .how-to-categories .columns:nth-child(3) { margin-left: 1%; } .how-to .how-to-categories .lt-ie9 .columns { width: 33.3333%; margin: 0 !important; } .how-to .how-to-categories p { line-height: 1.3125em; } @media screen and (min-width: 1281px) { .how-to .how-to-categories p { font-size: 1.25em; } } @media screen and (max-width: 1280px) { .how-to .how-to-categories p { font-size: 1.1875em; } } @media screen and (max-width: 1120px) { .how-to .how-to-categories p { font-size: 1.125em; } } @media screen and (max-width: 960px) { .how-to .how-to-categories p { font-size: 1.0625em; } } @media screen and (max-width: 800px) { .how-to .how-to-categories p { font-size: 1em; } } @media screen and (max-width: 640px) { .how-to .how-to-categories p { font-size: 1.25em; } } @media screen and (max-width: 480px) { .how-to .how-to-categories p { font-size: 1em; } } .how-to .how-to-categories .flexslider { background: transparent; margin-top: 1em; padding-bottom: 60px; } .how-to .how-to-categories .flexslider .slides li { margin: 0; padding: 0; font-size: 1em !important; } .how-to .how-to-categories .flexslider .slides li .play { position: absolute; top: 0; left: 0; } @media screen and (max-width: 800px) { .how-to .how-to-categories .flexslider .slides li:nth-child(even) > div { margin-left: 15px; margin-right: 0; } .how-to .how-to-categories .flexslider .slides li:nth-child(odd) > div { margin-right: 15px; margin-left: 0; } } @media screen and (max-width: 640px) { .how-to .how-to-categories .flexslider { margin-bottom: 0; padding-bottom: 0; } .how-to .how-to-categories .flexslider .slides li > div { margin: 0 !important; } } .how-to .how-to-categories .flexslider .flex-direction-nav { display: none; width: 100%; } @media screen and (max-width: 640px) { .how-to .how-to-categories .flexslider .flex-direction-nav { background: url(images/backgrounds/text-paging.png) 0 0 repeat-x; display: block; bottom: -60px; height: 60px; position: absolute; margin: 0 -5.5%; width: 111%; } .how-to .how-to-categories .flexslider .flex-direction-nav a { background: url(images/sprites/arrow.carousel.mobile.png) no-repeat; margin: 0; width: 57px; height: 60px; top: auto; bottom: 0; } .how-to .how-to-categories .flexslider .flex-direction-nav a.flex-prev { background-position: 0 0; left: 0; } .how-to .how-to-categories .flexslider .flex-direction-nav a.flex-next { background-position: 0 bottom; right: 0; } } .how-to .how-to-categories .flexslider .flex-control-nav { bottom: 20px; } @media screen and (max-width: 640px) { .how-to .how-to-categories .flexslider .flex-control-nav { display: none; } } .how-to .how-to-categories .flexslider .flex-text-paging { display: none; } @media screen and (max-width: 640px) { .how-to .how-to-categories .flexslider .flex-text-paging { display: block; position: absolute; bottom: -40px; text-align: center; width: 100%; } } @media screen and (max-width: 640px) { .how-to .how-to-categories .row:first-child { padding-bottom: 60px; } } .how-to .how-to-categories .row:first-child .flexslider { border-bottom: 1px solid #8eb5d8; margin-bottom: 1em; } @media screen and (max-width: 640px) { .how-to .how-to-categories .row:first-child .flexslider { border-bottom: none; } } .how-to #callout-left p.number strong { line-height: 1em; font-family: "Kievit Medium"; } @media screen and (min-width: 1281px) { .how-to #callout-left p.number strong { font-size: 1.25em; } } @media screen and (max-width: 1280px) { .how-to #callout-left p.number strong { font-size: 1.1875em; } } @media screen and (max-width: 1120px) { .how-to #callout-left p.number strong { font-size: 1.125em; } } @media screen and (max-width: 960px) { .how-to #callout-left p.number strong { font-size: 1.0625em; } } @media screen and (max-width: 800px) { .how-to #callout-left p.number strong { font-size: 1em; } } @media screen and (max-width: 640px) { .how-to #callout-left p.number strong { font-size: 1.25em; } } @media screen and (max-width: 480px) { .how-to #callout-left p.number strong { font-size: 1em; } } .how-to #callout-left p { font-family: "Kievit Book"; line-height: 1em; } @media screen and (min-width: 1281px) { .how-to #callout-left p { font-size: 1em; } } @media screen and (max-width: 1280px) { .how-to #callout-left p { font-size: 0.95em; } } @media screen and (max-width: 1120px) { .how-to #callout-left p { font-size: 0.9em; } } @media screen and (max-width: 960px) { .how-to #callout-left p { font-size: 0.85em; } } @media screen and (max-width: 800px) { .how-to #callout-left p { font-size: 0.8em; } } @media screen and (max-width: 640px) { .how-to #callout-left p { font-size: 1em; } } @media screen and (max-width: 480px) { .how-to #callout-left p { font-size: 0.8em; } } .how-to #callout-left p strong { font-family: "Kievit Medium"; } .how-to #callout-mid { padding-bottom: 24px; } .how-to.feature #main { background: url("images/backgrounds/crosshatch.png") repeat-x; background-color: #71bade; background: url("images/backgrounds/crosshatch.png"), -webkit-linear-gradient(to bottom, #5ebbe9 0%, #5ebbe9 69px, #66b9e2 162px, #71bade 254px, #80bfdd 315px, #99c9e1 408px, #c4e2f1 562px, #e1f5ff 654px, #e1f5ff 100%), repeat-x #71bade; background: url("images/backgrounds/crosshatch.png"), -moz-linear-gradient(to bottom, #5ebbe9 0%, #5ebbe9 69px, #66b9e2 162px, #71bade 254px, #80bfdd 315px, #99c9e1 408px, #c4e2f1 562px, #e1f5ff 654px, #e1f5ff 100%), repeat-x #71bade; background: url("images/backgrounds/crosshatch.png"), -ms-linear-gradient(to bottom, #5ebbe9 0%, #5ebbe9 69px, #66b9e2 162px, #71bade 254px, #80bfdd 315px, #99c9e1 408px, #c4e2f1 562px, #e1f5ff 654px, #e1f5ff 100%), repeat-x #71bade; background: url("images/backgrounds/crosshatch.png"), -o-linear-gradient(to bottom, #5ebbe9 0%, #5ebbe9 69px, #66b9e2 162px, #71bade 254px, #80bfdd 315px, #99c9e1 408px, #c4e2f1 562px, #e1f5ff 654px, #e1f5ff 100%), repeat-x #71bade; background: url("images/backgrounds/crosshatch.png"), linear-gradient(to bottom, #5ebbe9 0%, #5ebbe9 69px, #66b9e2 162px, #71bade 254px, #80bfdd 315px, #99c9e1 408px, #c4e2f1 562px, #e1f5ff 654px, #e1f5ff 100%), repeat-x #71bade; background-repeat: repeat-x; } @media screen and (max-width: 640px) { .how-to.feature #main { background: #e1f5ff url("images/backgrounds/crosshatch-mobile.png") no-repeat; } } .how-to.feature #hero .row { position: static; padding-top: 200px; } @media screen and (max-width: 640px) { .how-to.feature #hero .row { padding-top: 50px; } } .how-to.feature #hero .row .howToFeatureHeaderWrapper { width: 632px; margin: 0 auto; } @media screen and (max-width: 800px) { .how-to.feature #hero .row .howToFeatureHeaderWrapper { width: auto; } } .how-to.feature #hero .row .howToFeatureHeaderWrapper .howToFeatureImage img { margin: 0 auto; display: block; } .how-to.feature #hero .row .howToFeatureHeaderWrapper .social { margin-bottom: 8px; } .how-to.feature .howToFeatureBodyWrapper { width: 672px; margin: 0 auto; } @media screen and (max-width: 800px) { .how-to.feature .howToFeatureBodyWrapper { width: auto; } } .how-tos article #hero { position: relative; } .how-tos article #hero.shadow { -webkit-box-shadow: 0px 5px 7px rgba(50, 50, 50, 0.4); -moz-box-shadow: 0px 5px 7px rgba(50, 50, 50, 0.4); box-shadow: 0px 5px 7px rgba(50, 50, 50, 0.4); } .how-tos article #hero .layers { width: 100%; position: relative; } .how-tos article #hero .layers .backdrop { min-height: 350px; } .how-tos article #hero .layers .backdrop img { display: block; margin: 0 auto; min-height: 350px; width: 100%; } @media screen and (max-width: 768px) { .how-tos article #hero .layers .backdrop { min-height: 300px; } .how-tos article #hero .layers .backdrop img { min-height: 300px; } } @media screen and (max-width: 640px) { .how-tos article #hero .layers .backdrop { min-height: 300px; } .how-tos article #hero .layers .backdrop img { min-height: 300px; } } @media screen and (max-width: 560px) { .how-tos article #hero .layers .backdrop { min-height: 250px; } .how-tos article #hero .layers .backdrop img { min-height: 250px; } } @media screen and (max-width: 480px) { .how-tos article #hero .layers .backdrop { min-height: 200px; } .how-tos article #hero .layers .backdrop img { min-height: 200px; } } @media screen and (max-width: 400px) { .how-tos article #hero .layers .backdrop { min-height: 150px; } .how-tos article #hero .layers .backdrop img { min-height: 150px; } } .how-tos article #hero .layers .product { position: absolute; bottom: 0; right: 0; max-width: 90em; width: 100%; } @media screen and (min-width: 1440px) { .how-tos article #hero .layers .product { width: auto; /* This is for IE8. Sigh. */ } } .how-tos article #hero .layers .product img { display: block; margin: 0 auto; } .how-tos article #hero .layers .product.full { max-width: 100%; } .how-tos article #hero .row { position: absolute; top: 32%; left: 0; right: 0; } .how-tos article #hero .row .info { position: static; width: 70%; max-width: 510px; } @media screen and (max-width: 640px) { .how-tos article #hero .row { position: static; } .how-tos article #hero .row .info { width: 100%; } } .how-tos article #hero .info { position: absolute; top: 28%; left: 8%; width: 40%; z-index: 20; } @media screen and (max-width: 960px) { .how-tos article #hero .info { width: 43%; } } @media screen and (max-width: 800px) { .how-tos article #hero .info { width: 45%; } } @media screen and (max-width: 720px) { .how-tos article #hero .info { width: 47%; } } @media screen and (max-width: 640px) { .how-tos article #hero .info { padding: 0 5% 5% 5%; position: static; width: 100%; } } .how-tos article #hero .info h1 { color: #09457d; font-family: "Kievit black"; line-height: 1em; margin-bottom: 0.25em; text-transform: uppercase; text-shadow: 1px 1px 2px #969696; } @media screen and (min-width: 1281px) { .how-tos article #hero .info h1 { font-size: 3em; } } @media screen and (max-width: 1280px) { .how-tos article #hero .info h1 { font-size: 2.85em; } } @media screen and (max-width: 1120px) { .how-tos article #hero .info h1 { font-size: 2.7em; } } @media screen and (max-width: 960px) { .how-tos article #hero .info h1 { font-size: 2.55em; } } @media screen and (max-width: 800px) { .how-tos article #hero .info h1 { font-size: 2.4em; } } @media screen and (max-width: 640px) { .how-tos article #hero .info h1 { font-size: 3em; } } @media screen and (max-width: 480px) { .how-tos article #hero .info h1 { font-size: 2.4em; } } @media screen and (max-width: 640px) { .how-tos article #hero .info h1 { font-size: 2em !important; } } .how-tos article #hero .info span { font-family: "Kievit Book"; line-height: 1.5em; text-transform: uppercase; } @media screen and (min-width: 1281px) { .how-tos article #hero .info span { font-size: 1em; } } @media screen and (max-width: 1280px) { .how-tos article #hero .info span { font-size: 0.95em; } } @media screen and (max-width: 1120px) { .how-tos article #hero .info span { font-size: 0.9em; } } @media screen and (max-width: 960px) { .how-tos article #hero .info span { font-size: 0.85em; } } @media screen and (max-width: 800px) { .how-tos article #hero .info span { font-size: 0.8em; } } @media screen and (max-width: 640px) { .how-tos article #hero .info span { font-size: 1em; } } @media screen and (max-width: 480px) { .how-tos article #hero .info span { font-size: 0.8em; } } .how-tos article #hero .info p { font-family: "Kievit Book"; line-height: 1.375em; margin: 0.25em 0 0.75em 0; } @media screen and (min-width: 1281px) { .how-tos article #hero .info p { font-size: 1.35em; } } @media screen and (max-width: 1280px) { .how-tos article #hero .info p { font-size: 1.2825em; } } @media screen and (max-width: 1120px) { .how-tos article #hero .info p { font-size: 1.215em; } } @media screen and (max-width: 960px) { .how-tos article #hero .info p { font-size: 1.1475em; } } @media screen and (max-width: 800px) { .how-tos article #hero .info p { font-size: 1.08em; } } @media screen and (max-width: 640px) { .how-tos article #hero .info p { font-size: 1.35em; } } @media screen and (max-width: 480px) { .how-tos article #hero .info p { font-size: 1.08em; } } @media screen and (max-width: 768px) { .how-tos article #hero .info p { font-size: 16px; } } @media screen and (max-width: 1080px) { .how-tos article #hero .info p { line-height: 1.375em; } } @media screen and (max-width: 1080px) and (min-width: 1281px) { .how-tos article #hero .info p { font-size: 1em; } } @media screen and (max-width: 1080px) and (max-width: 1280px) { .how-tos article #hero .info p { font-size: 0.95em; } } @media screen and (max-width: 1080px) and (max-width: 1120px) { .how-tos article #hero .info p { font-size: 0.9em; } } @media screen and (max-width: 1080px) and (max-width: 960px) { .how-tos article #hero .info p { font-size: 0.85em; } } @media screen and (max-width: 1080px) and (max-width: 800px) { .how-tos article #hero .info p { font-size: 0.8em; } } @media screen and (max-width: 1080px) and (max-width: 640px) { .how-tos article #hero .info p { font-size: 1em; } } @media screen and (max-width: 1080px) and (max-width: 480px) { .how-tos article #hero .info p { font-size: 0.8em; } } .how-tos article #sticky-bar .columns:first-child a, .how-tos article #sticky-bar .columns:last-child a, .how-tos article #sticky-bar .columns.last a { text-align: center; } @media screen and (max-width: 640px) { .how-tos article #sticky-bar .columns a { height: auto; } } .how-tos article .product-list .row { border: none; padding-top: 0; } @media screen and (max-width: 640px) { .how-tos article .product-list .row { padding-bottom: 0; } } .how-tos article .product-list .row:first-child { padding-top: 38px; } @media screen and (max-width: 640px) { .how-tos article .product-list .row:first-child { padding-top: 0; } } .how-tos article .product-list .row .related-product { border-bottom: none; margin-top: 0; padding-bottom: 30px; } @media screen and (max-width: 640px) { .how-tos article .product-list .row .related-product { border-top: none; } } @media screen and (max-width: 640px) { .how-tos article .product-list .row .related-product figure { margin-top: 1em; max-width: 400px; } } .how-tos article .product-list .row .related-product figure a { display: block; position: relative; } .how-tos article .product-list .row .related-product figure a .play { z-index: 1; } .how-tos article .product-list .row .related-product figure a .play img { border: none; box-shadow: none; } .how-tos article .product-list .row .related-product figure a:hover .play { opacity: 0.7; filter: alpha(opacity=70); -moz-opacity: 0.7; } .how-tos article .product-list .row h2 a { color: #0a57a4; } .how-tos article .product-list .section { border-top: rgba(8, 93, 170, 0.45) 1px solid; } .how-tos article .product-list #planning_and_prep { border-top: 0; } .product-finder .pf-form-fields { position: relative; z-index: 11; } .product-finder article { overflow: visible; padding-bottom: 32px; } .product-finder article form .button { margin: 25px 0 45px 0; } @media screen and (max-width: 768px) { .product-finder article form .button { margin: 25px 0 0 0; } } .product-finder article form h2 { position: relative; z-index: 20; } @media screen and (max-width: 640px) { .product-finder article form h2 { line-height: 1em; } } @media screen and (max-width: 640px) and (min-width: 1281px) { .product-finder article form h2 { font-size: 1.8em; } } @media screen and (max-width: 640px) and (max-width: 1280px) { .product-finder article form h2 { font-size: 1.71em; } } @media screen and (max-width: 640px) and (max-width: 1120px) { .product-finder article form h2 { font-size: 1.62em; } } @media screen and (max-width: 640px) and (max-width: 960px) { .product-finder article form h2 { font-size: 1.53em; } } @media screen and (max-width: 640px) and (max-width: 800px) { .product-finder article form h2 { font-size: 1.44em; } } @media screen and (max-width: 640px) and (max-width: 640px) { .product-finder article form h2 { font-size: 1.8em; } } @media screen and (max-width: 640px) and (max-width: 480px) { .product-finder article form h2 { font-size: 1.44em; } } @media screen and (max-width: 640px) { .product-finder article form label { max-width: none; } } @media screen and (min-width: 640px) and (max-width: 1100px) { .product-finder article form .large-4 { float: none; width: 50%; } .product-finder article form .large-2 { width: 25%; } } @media screen and (min-width: 640px) and (max-width: 768px) { .product-finder article form .large-4 { float: none; width: 100%; } .product-finder article form .large-2 { width: 50%; } } .product-finder #hero { position: relative; } .product-finder #hero .page-texture { position: absolute; right: 0; top: 260px; z-index: 10; } .product-finder #hero .page-texture img { float: right; } @media screen and (max-width: 1440px) { .product-finder #hero .page-texture { width: 50%; } } @media screen and (max-width: 1000px) { .product-finder #hero .page-texture { width: 40%; } } @media screen and (max-width: 640px) { .product-finder #hero .page-texture { display: none; } } .product-finder #hero .info { position: relative; z-index: 20; } .product-finder #hero .info p { line-height: 1.6875em; max-width: 570px; } @media screen and (min-width: 1281px) { .product-finder #hero .info p { font-size: 1.125em; } } @media screen and (max-width: 1280px) { .product-finder #hero .info p { font-size: 1.06875em; } } @media screen and (max-width: 1120px) { .product-finder #hero .info p { font-size: 1.0125em; } } @media screen and (max-width: 960px) { .product-finder #hero .info p { font-size: 0.95625em; } } @media screen and (max-width: 800px) { .product-finder #hero .info p { font-size: 0.9em; } } @media screen and (max-width: 640px) { .product-finder #hero .info p { font-size: 1.125em; } } @media screen and (max-width: 480px) { .product-finder #hero .info p { font-size: 0.9em; } } @media screen and (max-width: 768px) { .product-finder #hero .info p { line-height: 1.375em; } } @media screen and (max-width: 768px) and (min-width: 1281px) { .product-finder #hero .info p { font-size: 1.3em; } } @media screen and (max-width: 768px) and (max-width: 1280px) { .product-finder #hero .info p { font-size: 1.235em; } } @media screen and (max-width: 768px) and (max-width: 1120px) { .product-finder #hero .info p { font-size: 1.17em; } } @media screen and (max-width: 768px) and (max-width: 960px) { .product-finder #hero .info p { font-size: 1.105em; } } @media screen and (max-width: 768px) and (max-width: 800px) { .product-finder #hero .info p { font-size: 1.04em; } } @media screen and (max-width: 768px) and (max-width: 640px) { .product-finder #hero .info p { font-size: 1.3em; } } @media screen and (max-width: 768px) and (max-width: 480px) { .product-finder #hero .info p { font-size: 1.04em; } } @media screen and (max-width: 640px) { .product-finder #hero .info h1 { line-height: 1em; } } @media screen and (max-width: 640px) and (min-width: 1281px) { .product-finder #hero .info h1 { font-size: 2.6em; } } @media screen and (max-width: 640px) and (max-width: 1280px) { .product-finder #hero .info h1 { font-size: 2.47em; } } @media screen and (max-width: 640px) and (max-width: 1120px) { .product-finder #hero .info h1 { font-size: 2.34em; } } @media screen and (max-width: 640px) and (max-width: 960px) { .product-finder #hero .info h1 { font-size: 2.21em; } } @media screen and (max-width: 640px) and (max-width: 800px) { .product-finder #hero .info h1 { font-size: 2.08em; } } @media screen and (max-width: 640px) and (max-width: 640px) { .product-finder #hero .info h1 { font-size: 2.6em; } } @media screen and (max-width: 640px) and (max-width: 480px) { .product-finder #hero .info h1 { font-size: 2.08em; } } .product-finder .suggestion-wrapper { position: relative; } .product-finder .suggestion-wrapper .suggestion { position: absolute; top: 100%; left: 0; z-index: 10; background: #e0e0e0; width: 100%; display: none; height: 400px; overflow: scroll; } .product-finder .suggestion-wrapper .suggestion ul li { background: none; margin: 0; padding: 0; } .product-finder .suggestion-wrapper .suggestion ul li .category-heading { color: #09457d; text-transform: uppercase; line-height: 1em; font-family: "Kievit black"; padding: 16px 16px 10px 16px; display: block; border-top: #a7bed1 1px solid; border-bottom: #f2f2f2 1px solid; } @media screen and (min-width: 1281px) { .product-finder .suggestion-wrapper .suggestion ul li .category-heading { font-size: 0.9375em; } } @media screen and (max-width: 1280px) { .product-finder .suggestion-wrapper .suggestion ul li .category-heading { font-size: 0.89063em; } } @media screen and (max-width: 1120px) { .product-finder .suggestion-wrapper .suggestion ul li .category-heading { font-size: 0.84375em; } } @media screen and (max-width: 960px) { .product-finder .suggestion-wrapper .suggestion ul li .category-heading { font-size: 0.79688em; } } @media screen and (max-width: 800px) { .product-finder .suggestion-wrapper .suggestion ul li .category-heading { font-size: 0.75em; } } @media screen and (max-width: 640px) { .product-finder .suggestion-wrapper .suggestion ul li .category-heading { font-size: 0.9375em; } } @media screen and (max-width: 480px) { .product-finder .suggestion-wrapper .suggestion ul li .category-heading { font-size: 0.75em; } } @media screen and (max-width: 1150px) { .product-finder .suggestion-wrapper .suggestion ul li .category-heading { font-size: 16px; } } .product-finder .suggestion-wrapper .suggestion ul li ul { border-top: #a7bed1 1px solid; border-bottom: #f2f2f2 1px solid; padding: 3px 0 8px 0; } .product-finder .suggestion-wrapper .suggestion ul li ul li { padding: 0 16px; } .product-finder .suggestion-wrapper .suggestion ul li ul li a { display: block; color: #0097dc; line-height: 1em; font-family: "Kievit Bold"; text-transform: none; border: none; padding: 13px 16px 0 16px; } @media screen and (min-width: 1281px) { .product-finder .suggestion-wrapper .suggestion ul li ul li a { font-size: 0.9375em; } } @media screen and (max-width: 1280px) { .product-finder .suggestion-wrapper .suggestion ul li ul li a { font-size: 0.89063em; } } @media screen and (max-width: 1120px) { .product-finder .suggestion-wrapper .suggestion ul li ul li a { font-size: 0.84375em; } } @media screen and (max-width: 960px) { .product-finder .suggestion-wrapper .suggestion ul li ul li a { font-size: 0.79688em; } } @media screen and (max-width: 800px) { .product-finder .suggestion-wrapper .suggestion ul li ul li a { font-size: 0.75em; } } @media screen and (max-width: 640px) { .product-finder .suggestion-wrapper .suggestion ul li ul li a { font-size: 0.9375em; } } @media screen and (max-width: 480px) { .product-finder .suggestion-wrapper .suggestion ul li ul li a { font-size: 0.75em; } } @media screen and (max-width: 1150px) { .product-finder .suggestion-wrapper .suggestion ul li ul li a { font-size: 14px; } } .product-finder .suggestion-wrapper .suggestion ul li ul li a:hover { text-decoration: underline; } .product-finder .suggestion-wrapper .suggestion ul li:first-child a, .product-finder .suggestion-wrapper .suggestion ul li:first-child .category-heading { border-top: none; } .product-finder .suggestion-wrapper .suggestion ul li:last-child a, .product-finder .suggestion-wrapper .suggestion ul li:last-child .category-heading { border-bottom: none; } .product-finder .suggestion-wrapper .suggestion p { display: none; } .product-finder .suggestion-wrapper .suggestion.no-results { border: #d40000 solid 1px; height: auto; overflow: hidden; display: block; } .product-finder .suggestion-wrapper .suggestion.no-results ul { display: none; } .product-finder .suggestion-wrapper .suggestion.no-results p { color: #d60000; line-height: 1.26667em; font-family: "Kievit Medium"; display: block; padding: 16px 16px 13px 16px; } @media screen and (min-width: 1281px) { .product-finder .suggestion-wrapper .suggestion.no-results p { font-size: 0.9375em; } } @media screen and (max-width: 1280px) { .product-finder .suggestion-wrapper .suggestion.no-results p { font-size: 0.89063em; } } @media screen and (max-width: 1120px) { .product-finder .suggestion-wrapper .suggestion.no-results p { font-size: 0.84375em; } } @media screen and (max-width: 960px) { .product-finder .suggestion-wrapper .suggestion.no-results p { font-size: 0.79688em; } } @media screen and (max-width: 800px) { .product-finder .suggestion-wrapper .suggestion.no-results p { font-size: 0.75em; } } @media screen and (max-width: 640px) { .product-finder .suggestion-wrapper .suggestion.no-results p { font-size: 0.9375em; } } @media screen and (max-width: 480px) { .product-finder .suggestion-wrapper .suggestion.no-results p { font-size: 0.75em; } } .product-finder .zip-wrapper input { float: left; width: 80%; } .product-finder .zip-wrapper .button { float: left; width: 20%; margin: 0; clear: none; margin: 0.4375em 0 0 0; padding: 10px 15px 8px 15px; min-width: 0; font-size: 14px; text-transform: none; } .product-finder .no-results h3 { line-height: 1em; font-family: "Kievit Bold"; text-transform: none; margin-top: 0; } @media screen and (min-width: 1281px) { .product-finder .no-results h3 { font-size: 1.3125em; } } @media screen and (max-width: 1280px) { .product-finder .no-results h3 { font-size: 1.24688em; } } @media screen and (max-width: 1120px) { .product-finder .no-results h3 { font-size: 1.18125em; } } @media screen and (max-width: 960px) { .product-finder .no-results h3 { font-size: 1.11562em; } } @media screen and (max-width: 800px) { .product-finder .no-results h3 { font-size: 1.05em; } } @media screen and (max-width: 640px) { .product-finder .no-results h3 { font-size: 1.3125em; } } @media screen and (max-width: 480px) { .product-finder .no-results h3 { font-size: 1.05em; } } .product-finder .no-results p { line-height: 1.44444em; } @media screen and (min-width: 1281px) { .product-finder .no-results p { font-size: 1.125em; } } @media screen and (max-width: 1280px) { .product-finder .no-results p { font-size: 1.06875em; } } @media screen and (max-width: 1120px) { .product-finder .no-results p { font-size: 1.0125em; } } @media screen and (max-width: 960px) { .product-finder .no-results p { font-size: 0.95625em; } } @media screen and (max-width: 800px) { .product-finder .no-results p { font-size: 0.9em; } } @media screen and (max-width: 640px) { .product-finder .no-results p { font-size: 1.125em; } } @media screen and (max-width: 480px) { .product-finder .no-results p { font-size: 0.9em; } } .product-finder .map-wrapper h3 { width: 100%; border-bottom: #0097dc 1px solid; margin: 0 0 1.42857142857143em 0; padding: 0 0 0.57142857142857em 0; } .product-finder .map-wrapper .map { height: 530px; border: #0097dc 3px solid; } @media screen and (max-width: 640px) { .product-finder .map-wrapper .map { height: auto; border: none; } } .product-finder .map-wrapper .map .results-list { float: right; width: 40%; height: 524px; overflow-y: scroll; -webkit-overflow-scrolling: touch; background: #fff; } @media screen and (max-width: 640px) { .product-finder .map-wrapper .map .results-list { float: none; width: 100%; height: auto; overflow: visible; background: transparent; } } .product-finder .map-wrapper .map .results-list ul li { background: none; border-top: #90b6d9 solid 1px; padding: 0 0 24px 0; margin: 0; } .product-finder .map-wrapper .map .results-list ul li:first-child { border-top: none; } .product-finder .map-wrapper .map .results-list ul li .marker { width: 29px; height: 44px; background: url("images/icons/map-marker.png") no-repeat; color: #ffffff; font-size: 18px; font-family: "Kievit Bold"; float: left; text-align: center; padding: 6px 0 0 0; margin: 26px 1em 0 1.33333em; } @media screen and (max-width: 768px) { .product-finder .map-wrapper .map .results-list ul li .marker { padding: 8px 0 0 0; float: none; } } .product-finder .map-wrapper .map .results-list ul li .result { float: left; width: 75%; } @media screen and (max-width: 950px) { .product-finder .map-wrapper .map .results-list ul li .result { width: 68%; } } @media screen and (max-width: 768px) { .product-finder .map-wrapper .map .results-list ul li .result { width: 95%; float: none; font-size: 20px; padding-left: 5%; } } .product-finder .map-wrapper .map .results-list ul li .result h4 { color: #085daa; line-height: 1em; font-family: "Kievit Bold"; text-transform: uppercase; margin: 30px 0 0 0; cursor: pointer; } @media screen and (min-width: 1281px) { .product-finder .map-wrapper .map .results-list ul li .result h4 { font-size: 1.3125em; } } @media screen and (max-width: 1280px) { .product-finder .map-wrapper .map .results-list ul li .result h4 { font-size: 1.24688em; } } @media screen and (max-width: 1120px) { .product-finder .map-wrapper .map .results-list ul li .result h4 { font-size: 1.18125em; } } @media screen and (max-width: 960px) { .product-finder .map-wrapper .map .results-list ul li .result h4 { font-size: 1.11562em; } } @media screen and (max-width: 800px) { .product-finder .map-wrapper .map .results-list ul li .result h4 { font-size: 1.05em; } } @media screen and (max-width: 640px) { .product-finder .map-wrapper .map .results-list ul li .result h4 { font-size: 1.3125em; } } @media screen and (max-width: 480px) { .product-finder .map-wrapper .map .results-list ul li .result h4 { font-size: 1.05em; } } @media screen and (max-width: 768px) { .product-finder .map-wrapper .map .results-list ul li .result h4 { line-height: 1em; } } @media screen and (max-width: 768px) and (min-width: 1281px) { .product-finder .map-wrapper .map .results-list ul li .result h4 { font-size: 0.95em; } } @media screen and (max-width: 768px) and (max-width: 1280px) { .product-finder .map-wrapper .map .results-list ul li .result h4 { font-size: 0.9025em; } } @media screen and (max-width: 768px) and (max-width: 1120px) { .product-finder .map-wrapper .map .results-list ul li .result h4 { font-size: 0.855em; } } @media screen and (max-width: 768px) and (max-width: 960px) { .product-finder .map-wrapper .map .results-list ul li .result h4 { font-size: 0.8075em; } } @media screen and (max-width: 768px) and (max-width: 800px) { .product-finder .map-wrapper .map .results-list ul li .result h4 { font-size: 0.76em; } } @media screen and (max-width: 768px) and (max-width: 640px) { .product-finder .map-wrapper .map .results-list ul li .result h4 { font-size: 0.95em; } } @media screen and (max-width: 768px) and (max-width: 480px) { .product-finder .map-wrapper .map .results-list ul li .result h4 { font-size: 0.76em; } } .product-finder .map-wrapper .map .results-list ul li .result span.address { line-height: 1em; font-family: "Kievit Medium"; } @media screen and (min-width: 1281px) { .product-finder .map-wrapper .map .results-list ul li .result span.address { font-size: 1.125em; } } @media screen and (max-width: 1280px) { .product-finder .map-wrapper .map .results-list ul li .result span.address { font-size: 1.06875em; } } @media screen and (max-width: 1120px) { .product-finder .map-wrapper .map .results-list ul li .result span.address { font-size: 1.0125em; } } @media screen and (max-width: 960px) { .product-finder .map-wrapper .map .results-list ul li .result span.address { font-size: 0.95625em; } } @media screen and (max-width: 800px) { .product-finder .map-wrapper .map .results-list ul li .result span.address { font-size: 0.9em; } } @media screen and (max-width: 640px) { .product-finder .map-wrapper .map .results-list ul li .result span.address { font-size: 1.125em; } } @media screen and (max-width: 480px) { .product-finder .map-wrapper .map .results-list ul li .result span.address { font-size: 0.9em; } } .product-finder .map-wrapper .map .results-list ul li .result p { color: #404040; line-height: 1.2em; font-family: "Kievit Book"; } @media screen and (min-width: 1281px) { .product-finder .map-wrapper .map .results-list ul li .result p { font-size: 0.9375em; } } @media screen and (max-width: 1280px) { .product-finder .map-wrapper .map .results-list ul li .result p { font-size: 0.89063em; } } @media screen and (max-width: 1120px) { .product-finder .map-wrapper .map .results-list ul li .result p { font-size: 0.84375em; } } @media screen and (max-width: 960px) { .product-finder .map-wrapper .map .results-list ul li .result p { font-size: 0.79688em; } } @media screen and (max-width: 800px) { .product-finder .map-wrapper .map .results-list ul li .result p { font-size: 0.75em; } } @media screen and (max-width: 640px) { .product-finder .map-wrapper .map .results-list ul li .result p { font-size: 0.9375em; } } @media screen and (max-width: 480px) { .product-finder .map-wrapper .map .results-list ul li .result p { font-size: 0.75em; } } .product-finder .map-wrapper .map .results-list ul li .result p strong { font-family: "Kievit Medium"; } .product-finder .map-wrapper .map .results-list ul li .result p a { display: block; margin: 5px 0 0 0; } .product-finder .map-wrapper .map .results-list ul li .result p a:hover { text-decoration: underline; } .product-finder .map-wrapper .map #map { width: 60%; float: right; height: 524px; } .product-finder .map-wrapper .map #map .infoBox { padding-bottom: 26px; } @media screen and (max-width: 640px) { .product-finder .map-wrapper .map #map { float: none; width: 90%; border: #0097dc 3px solid; margin: 0 auto 20px auto; } } .product-finder .map-wrapper .map #map img { max-width: none; } .login #hero.simple p { line-height: 1.375em; } @media screen and (min-width: 1281px) { .login #hero.simple p { font-size: 1.25em; } } @media screen and (max-width: 1280px) { .login #hero.simple p { font-size: 1.1875em; } } @media screen and (max-width: 1120px) { .login #hero.simple p { font-size: 1.125em; } } @media screen and (max-width: 960px) { .login #hero.simple p { font-size: 1.0625em; } } @media screen and (max-width: 800px) { .login #hero.simple p { font-size: 1em; } } @media screen and (max-width: 640px) { .login #hero.simple p { font-size: 1.25em; } } @media screen and (max-width: 480px) { .login #hero.simple p { font-size: 1em; } } @media screen and (max-width: 640px) { .login h1 { font-size: 3.25em !important; } } @media screen and (max-width: 480px) { .login h1 { font-size: 2.5em !important; } } .login .large-7 { padding-left: 0; } @media screen and (max-width: 640px) { .login .large-7 { padding-left: 0.9375em; } } .login .large-4 { padding-left: 0; } @media screen and (max-width: 640px) { .login .large-4 { padding-left: 0.9375em; } } .login .large-8 { padding-right: 0; } @media screen and (max-width: 640px) { .login .large-8 { padding-right: 0.9375em; } } .login .form { margin-top: 70px; } @media screen and (max-width: 1120px) { .login .form { margin-top: 50px; } } @media screen and (max-width: 960px) { .login .form { margin-top: 30px; } } .login form #birthdate { overflow: hidden; } .login form #birthdate input { width: 40px; margin-top: .5em; float: left; clear: none; } @media screen and (max-width: 805px) and (max-width: 640px) { .login form #birthdate input { clear: none; } } .login form #birthdate input#year { width: 80px; } @media screen and (max-width: 805px) { .login form #birthdate input#year { clear: left; } } @media screen and (max-width: 805px) and (max-width: 640px) { .login form #birthdate input#year { clear: none; } } .login form #birthdate span { margin: .9em .5em 0; float: left; } .login form #birthdate label { float: none; } .login form #birthdate label + input { clear: left; } .login form #birthdate label + input:before { content: ""; } .login form .button + a { font-size: 14px !important; padding-top: 12px; } @media screen and (max-width: 960px) { .login form .button + a { display: block; padding-top: 0; } } @media screen and (max-width: 640px) { .login form .button + a { display: inline-block; padding-top: 12px; } } .login form .checkbox { margin-bottom: .5em; clear: both; } .login form .checkbox + label { line-height: 1.25em; margin-top: 1.625em; } @media screen and (max-width: 640px) { .login form + form .columns { margin-top: 2em; } } .profile #hero.simple .large-2 { margin-left: -0.9375em; } .profile #hero.simple .large-2 .badge img { padding-bottom: 10px; } @media screen and (max-width: 640px) { .profile #hero.simple .large-2 .badge img { float: left; margin-top: -40px; margin-right: 20px; } } .profile #hero.simple .large-2 .badge p { width: 100%; color: #09457d !important; line-height: 1.26em; font-family: "Kievit Medium"; margin: 0 0 1em 0; } @media screen and (min-width: 1281px) { .profile #hero.simple .large-2 .badge p { font-size: 0.9375em; } } @media screen and (max-width: 1280px) { .profile #hero.simple .large-2 .badge p { font-size: 0.89063em; } } @media screen and (max-width: 1120px) { .profile #hero.simple .large-2 .badge p { font-size: 0.84375em; } } @media screen and (max-width: 960px) { .profile #hero.simple .large-2 .badge p { font-size: 0.79688em; } } @media screen and (max-width: 800px) { .profile #hero.simple .large-2 .badge p { font-size: 0.75em; } } @media screen and (max-width: 640px) { .profile #hero.simple .large-2 .badge p { font-size: 0.9375em; } } @media screen and (max-width: 480px) { .profile #hero.simple .large-2 .badge p { font-size: 0.75em; } } @media screen and (max-width: 960px) { .profile #hero.simple .large-2 .badge p { line-height: 1.5em; } } @media screen and (max-width: 960px) and (min-width: 1281px) { .profile #hero.simple .large-2 .badge p { font-size: 1em; } } @media screen and (max-width: 960px) and (max-width: 1280px) { .profile #hero.simple .large-2 .badge p { font-size: 0.95em; } } @media screen and (max-width: 960px) and (max-width: 1120px) { .profile #hero.simple .large-2 .badge p { font-size: 0.9em; } } @media screen and (max-width: 960px) and (max-width: 960px) { .profile #hero.simple .large-2 .badge p { font-size: 0.85em; } } @media screen and (max-width: 960px) and (max-width: 800px) { .profile #hero.simple .large-2 .badge p { font-size: 0.8em; } } @media screen and (max-width: 960px) and (max-width: 640px) { .profile #hero.simple .large-2 .badge p { font-size: 1em; } } @media screen and (max-width: 960px) and (max-width: 480px) { .profile #hero.simple .large-2 .badge p { font-size: 0.8em; } } @media screen and (max-width: 640px) { .profile #hero.simple .large-2 .badge p { margin-top: 45px; } } .profile #hero.simple .large-2 .badge .button { width: 134px; display: block; max-width: 100%; } @media screen and (max-width: 950px) { .profile #hero.simple .large-2 .badge .button { margin-bottom: 40px; } } @media screen and (max-width: 640px) { .profile #hero.simple .large-2 .badge .button { margin-bottom: 0; } } @media screen and (max-width: 960px) { .profile #hero.simple .large-2 { width: 25%; } } @media screen and (max-width: 640px) { .profile #hero.simple .large-2 { width: 100%; } } @media screen and (max-width: 960px) { .profile #hero.simple .large-7 { width: 50%; } } @media screen and (max-width: 640px) { .profile #hero.simple .large-7 { width: 100%; } } .profile #hero.simple .headline { margin-top: 20px; padding-right: 6em; } @media screen and (max-width: 960px) { .profile #hero.simple .headline { padding-right: 2em; } } @media screen and (max-width: 640px) { .profile #hero.simple .headline { padding-right: 0; } } .profile #hero.simple .headline h3 { line-height: 1em; font-family: "Kievit black"; text-shadow: 1px 2px 0px #a2b1b8; color: #09457d; margin: 0; text-transform: uppercase; } @media screen and (min-width: 1281px) { .profile #hero.simple .headline h3 { font-size: 2.625em; } } @media screen and (max-width: 1280px) { .profile #hero.simple .headline h3 { font-size: 2.49375em; } } @media screen and (max-width: 1120px) { .profile #hero.simple .headline h3 { font-size: 2.3625em; } } @media screen and (max-width: 960px) { .profile #hero.simple .headline h3 { font-size: 2.23125em; } } @media screen and (max-width: 800px) { .profile #hero.simple .headline h3 { font-size: 2.1em; } } @media screen and (max-width: 640px) { .profile #hero.simple .headline h3 { font-size: 2.625em; } } @media screen and (max-width: 480px) { .profile #hero.simple .headline h3 { font-size: 2.1em; } } .profile #hero.simple .headline h3 strong { line-height: 1em; color: #085daa; } @media screen and (min-width: 1281px) { .profile #hero.simple .headline h3 strong { font-size: 1.4524em; } } @media screen and (max-width: 1280px) { .profile #hero.simple .headline h3 strong { font-size: 1.37978em; } } @media screen and (max-width: 1120px) { .profile #hero.simple .headline h3 strong { font-size: 1.30716em; } } @media screen and (max-width: 960px) { .profile #hero.simple .headline h3 strong { font-size: 1.23454em; } } @media screen and (max-width: 800px) { .profile #hero.simple .headline h3 strong { font-size: 1.16192em; } } @media screen and (max-width: 640px) { .profile #hero.simple .headline h3 strong { font-size: 1.4524em; } } @media screen and (max-width: 480px) { .profile #hero.simple .headline h3 strong { font-size: 1.16192em; } } @media screen and (max-width: 960px) { .profile #hero.simple .headline h3 { font-size: 2em; font-family: "Kievit Bold"; } .profile #hero.simple .headline h3 strong { line-height: 1em; } } @media screen and (max-width: 960px) and (min-width: 1281px) { .profile #hero.simple .headline h3 strong { font-size: 1.75em; } } @media screen and (max-width: 960px) and (max-width: 1280px) { .profile #hero.simple .headline h3 strong { font-size: 1.6625em; } } @media screen and (max-width: 960px) and (max-width: 1120px) { .profile #hero.simple .headline h3 strong { font-size: 1.575em; } } @media screen and (max-width: 960px) and (max-width: 960px) { .profile #hero.simple .headline h3 strong { font-size: 1.4875em; } } @media screen and (max-width: 960px) and (max-width: 800px) { .profile #hero.simple .headline h3 strong { font-size: 1.4em; } } @media screen and (max-width: 960px) and (max-width: 640px) { .profile #hero.simple .headline h3 strong { font-size: 1.75em; } } @media screen and (max-width: 960px) and (max-width: 480px) { .profile #hero.simple .headline h3 strong { font-size: 1.4em; } } .profile #hero.simple .headline p { line-height: 1.25em; } @media screen and (min-width: 1281px) { .profile #hero.simple .headline p { font-size: 1.25em; } } @media screen and (max-width: 1280px) { .profile #hero.simple .headline p { font-size: 1.1875em; } } @media screen and (max-width: 1120px) { .profile #hero.simple .headline p { font-size: 1.125em; } } @media screen and (max-width: 960px) { .profile #hero.simple .headline p { font-size: 1.0625em; } } @media screen and (max-width: 800px) { .profile #hero.simple .headline p { font-size: 1em; } } @media screen and (max-width: 640px) { .profile #hero.simple .headline p { font-size: 1.25em; } } @media screen and (max-width: 480px) { .profile #hero.simple .headline p { font-size: 1em; } } .profile #hero.simple .headline p a.primary { line-height: 1em; } @media screen and (min-width: 1281px) { .profile #hero.simple .headline p a.primary { font-size: 0.8em; } } @media screen and (max-width: 1280px) { .profile #hero.simple .headline p a.primary { font-size: 0.76em; } } @media screen and (max-width: 1120px) { .profile #hero.simple .headline p a.primary { font-size: 0.72em; } } @media screen and (max-width: 960px) { .profile #hero.simple .headline p a.primary { font-size: 0.68em; } } @media screen and (max-width: 800px) { .profile #hero.simple .headline p a.primary { font-size: 0.64em; } } @media screen and (max-width: 640px) { .profile #hero.simple .headline p a.primary { font-size: 0.8em; } } @media screen and (max-width: 480px) { .profile #hero.simple .headline p a.primary { font-size: 0.64em; } } .profile #hero.simple .aside > img { float: right; } .profile #hero.simple .aside .profile-progress { width: 100%; } @media screen and (max-width: 640px) { .profile #hero.simple .aside .profile-progress { width: 65%; } } .profile #hero.simple .aside .profile-progress .progress { width: 100%; } .profile #hero.simple .aside .profile-progress .profile-cta { line-height: 1em; font-family: "Kievit Book"; color: #404040; text-transform: uppercase; margin: 15px 0 0 0; } @media screen and (min-width: 1281px) { .profile #hero.simple .aside .profile-progress .profile-cta { font-size: 1.3125em; } } @media screen and (max-width: 1280px) { .profile #hero.simple .aside .profile-progress .profile-cta { font-size: 1.24688em; } } @media screen and (max-width: 1120px) { .profile #hero.simple .aside .profile-progress .profile-cta { font-size: 1.18125em; } } @media screen and (max-width: 960px) { .profile #hero.simple .aside .profile-progress .profile-cta { font-size: 1.11562em; } } @media screen and (max-width: 800px) { .profile #hero.simple .aside .profile-progress .profile-cta { font-size: 1.05em; } } @media screen and (max-width: 640px) { .profile #hero.simple .aside .profile-progress .profile-cta { font-size: 1.3125em; } } @media screen and (max-width: 480px) { .profile #hero.simple .aside .profile-progress .profile-cta { font-size: 1.05em; } } .profile #hero.simple .aside .profile-progress .profile-cta strong { line-height: 0.9em; font-family: "Kievit Medium"; color: #09457d; display: block; } @media screen and (min-width: 1281px) { .profile #hero.simple .aside .profile-progress .profile-cta strong { font-size: 1.333em; } } @media screen and (max-width: 1280px) { .profile #hero.simple .aside .profile-progress .profile-cta strong { font-size: 1.26635em; } } @media screen and (max-width: 1120px) { .profile #hero.simple .aside .profile-progress .profile-cta strong { font-size: 1.1997em; } } @media screen and (max-width: 960px) { .profile #hero.simple .aside .profile-progress .profile-cta strong { font-size: 1.13305em; } } @media screen and (max-width: 800px) { .profile #hero.simple .aside .profile-progress .profile-cta strong { font-size: 1.0664em; } } @media screen and (max-width: 640px) { .profile #hero.simple .aside .profile-progress .profile-cta strong { font-size: 1.333em; } } @media screen and (max-width: 480px) { .profile #hero.simple .aside .profile-progress .profile-cta strong { font-size: 1.0664em; } } .profile #hero.simple .aside .profile-progress .carrot { line-height: 0.9em; font-family: "Kievit Bold"; color: #0097dc; margin: 10px 0 0 0; display: block; } @media screen and (min-width: 1281px) { .profile #hero.simple .aside .profile-progress .carrot { font-size: 1em; } } @media screen and (max-width: 1280px) { .profile #hero.simple .aside .profile-progress .carrot { font-size: 0.95em; } } @media screen and (max-width: 1120px) { .profile #hero.simple .aside .profile-progress .carrot { font-size: 0.9em; } } @media screen and (max-width: 960px) { .profile #hero.simple .aside .profile-progress .carrot { font-size: 0.85em; } } @media screen and (max-width: 800px) { .profile #hero.simple .aside .profile-progress .carrot { font-size: 0.8em; } } @media screen and (max-width: 640px) { .profile #hero.simple .aside .profile-progress .carrot { font-size: 1em; } } @media screen and (max-width: 480px) { .profile #hero.simple .aside .profile-progress .carrot { font-size: 0.8em; } } .profile #hero.simple .aside .status, .profile #hero.simple .aside .connect { color: #404040; font-family: "Kievit Medium"; margin-top: 2em; } .profile #hero.simple .aside .status p, .profile #hero.simple .aside .status li, .profile #hero.simple .aside .connect p, .profile #hero.simple .aside .connect li { line-height: 1.375em; } @media screen and (min-width: 1281px) { .profile #hero.simple .aside .status p, .profile #hero.simple .aside .status li, .profile #hero.simple .aside .connect p, .profile #hero.simple .aside .connect li { font-size: 1em; } } @media screen and (max-width: 1280px) { .profile #hero.simple .aside .status p, .profile #hero.simple .aside .status li, .profile #hero.simple .aside .connect p, .profile #hero.simple .aside .connect li { font-size: 0.95em; } } @media screen and (max-width: 1120px) { .profile #hero.simple .aside .status p, .profile #hero.simple .aside .status li, .profile #hero.simple .aside .connect p, .profile #hero.simple .aside .connect li { font-size: 0.9em; } } @media screen and (max-width: 960px) { .profile #hero.simple .aside .status p, .profile #hero.simple .aside .status li, .profile #hero.simple .aside .connect p, .profile #hero.simple .aside .connect li { font-size: 0.85em; } } @media screen and (max-width: 800px) { .profile #hero.simple .aside .status p, .profile #hero.simple .aside .status li, .profile #hero.simple .aside .connect p, .profile #hero.simple .aside .connect li { font-size: 0.8em; } } @media screen and (max-width: 640px) { .profile #hero.simple .aside .status p, .profile #hero.simple .aside .status li, .profile #hero.simple .aside .connect p, .profile #hero.simple .aside .connect li { font-size: 1em; } } @media screen and (max-width: 480px) { .profile #hero.simple .aside .status p, .profile #hero.simple .aside .status li, .profile #hero.simple .aside .connect p, .profile #hero.simple .aside .connect li { font-size: 0.8em; } } @media screen and (max-width: 960px) { .profile #hero.simple .aside .status p, .profile #hero.simple .aside .status li, .profile #hero.simple .aside .connect p, .profile #hero.simple .aside .connect li { line-height: 1.5em; } } @media screen and (max-width: 960px) and (min-width: 1281px) { .profile #hero.simple .aside .status p, .profile #hero.simple .aside .status li, .profile #hero.simple .aside .connect p, .profile #hero.simple .aside .connect li { font-size: 1.125em; } } @media screen and (max-width: 960px) and (max-width: 1280px) { .profile #hero.simple .aside .status p, .profile #hero.simple .aside .status li, .profile #hero.simple .aside .connect p, .profile #hero.simple .aside .connect li { font-size: 1.06875em; } } @media screen and (max-width: 960px) and (max-width: 1120px) { .profile #hero.simple .aside .status p, .profile #hero.simple .aside .status li, .profile #hero.simple .aside .connect p, .profile #hero.simple .aside .connect li { font-size: 1.0125em; } } @media screen and (max-width: 960px) and (max-width: 960px) { .profile #hero.simple .aside .status p, .profile #hero.simple .aside .status li, .profile #hero.simple .aside .connect p, .profile #hero.simple .aside .connect li { font-size: 0.95625em; } } @media screen and (max-width: 960px) and (max-width: 800px) { .profile #hero.simple .aside .status p, .profile #hero.simple .aside .status li, .profile #hero.simple .aside .connect p, .profile #hero.simple .aside .connect li { font-size: 0.9em; } } @media screen and (max-width: 960px) and (max-width: 640px) { .profile #hero.simple .aside .status p, .profile #hero.simple .aside .status li, .profile #hero.simple .aside .connect p, .profile #hero.simple .aside .connect li { font-size: 1.125em; } } @media screen and (max-width: 960px) and (max-width: 480px) { .profile #hero.simple .aside .status p, .profile #hero.simple .aside .status li, .profile #hero.simple .aside .connect p, .profile #hero.simple .aside .connect li { font-size: 0.9em; } } @media screen and (max-width: 950px) { .profile #hero.simple .aside { padding-bottom: 30px; padding-top: 0px; float: left; } .profile #hero.simple .aside > img { float: none; } .profile #hero.simple .aside .profile-progress { float: none; } } .profile section.row .large-5 { margin-left: -0.9375em; } .profile section.row .large-5 input[disabled="disabled"] { background: transparent; border: none; box-shadow: none; padding-left: 0; } @media screen and (max-width: 640px) { .profile section.row .large-5 { margin-left: 0; padding-left: 0; padding-right: 0; } } .profile section.row .large-5 .small-12 { padding-left: 0; padding-right: 0; } .profile section.row .large-5 .small-6 { padding-right: 0; padding-left: 8px; } .profile section.row .large-5 .small-6.first { padding-left: 0; padding-right: 8px; } .profile section.row .large-5 .small-6 label br { display: none; } @media screen and (max-width: 960px) { .profile section.row .large-5 .small-6 label br { display: block; } } .profile section.row .large-5 .button { margin-top: 3em; } .profile section.row .large-5 .carrot { clear: both; line-height: 1em; margin-top: 0.5em; } @media screen and (min-width: 1281px) { .profile section.row .large-5 .carrot { font-size: 1em; } } @media screen and (max-width: 1280px) { .profile section.row .large-5 .carrot { font-size: 0.95em; } } @media screen and (max-width: 1120px) { .profile section.row .large-5 .carrot { font-size: 0.9em; } } @media screen and (max-width: 960px) { .profile section.row .large-5 .carrot { font-size: 0.85em; } } @media screen and (max-width: 800px) { .profile section.row .large-5 .carrot { font-size: 0.8em; } } @media screen and (max-width: 640px) { .profile section.row .large-5 .carrot { font-size: 1em; } } @media screen and (max-width: 480px) { .profile section.row .large-5 .carrot { font-size: 0.8em; } } .profile section.row .large-7 { padding-right: 19%; padding-left: 4%; } @media screen and (max-width: 640px) { .profile section.row .large-7 { padding-left: 0; } } .profile section.row .large-7 h3 { color: #0097dc; margin-top: 3em; } .profile section.row .large-7 p { color: #404040; line-height: 1.375em; padding-top: 0.5em; } @media screen and (min-width: 1281px) { .profile section.row .large-7 p { font-size: 1em; } } @media screen and (max-width: 1280px) { .profile section.row .large-7 p { font-size: 0.95em; } } @media screen and (max-width: 1120px) { .profile section.row .large-7 p { font-size: 0.9em; } } @media screen and (max-width: 960px) { .profile section.row .large-7 p { font-size: 0.85em; } } @media screen and (max-width: 800px) { .profile section.row .large-7 p { font-size: 0.8em; } } @media screen and (max-width: 640px) { .profile section.row .large-7 p { font-size: 1em; } } @media screen and (max-width: 480px) { .profile section.row .large-7 p { font-size: 0.8em; } } .profile section.row .large-7 .row { margin: 0; } .profile section.row .large-7 .row .radio { margin-bottom: 0; } .profile section.row .large-7 .row .radio + label { width: 83%; } .profile section.row .large-7 + .large-5 { clear: both; float: left; } .profile .form { margin-top: 4em; } @media screen and (max-width: 640px) { .profile .form { margin-top: 0; padding: 0 0.9375em; } } .profile .form .legend { margin-left: -0.9375em; } .profile figure { bottom: -30px; position: absolute; z-index: 0; right: 0; } .profile figure img { float: right; } @media screen and (max-width: 1120px) { .profile figure img { width: 90%; } } @media screen and (max-width: 960px) { .profile figure img { width: 80%; } } @media screen and (max-width: 800px) { .profile figure img { width: 70%; } } @media screen and (max-width: 640px) { .profile figure { display: none; } } .reveal-modal.turketarian-type-modal h2 { line-height: 1em; } @media screen and (min-width: 1281px) { .reveal-modal.turketarian-type-modal h2 { font-size: 1.75em; } } @media screen and (max-width: 1280px) { .reveal-modal.turketarian-type-modal h2 { font-size: 1.6625em; } } @media screen and (max-width: 1120px) { .reveal-modal.turketarian-type-modal h2 { font-size: 1.575em; } } @media screen and (max-width: 960px) { .reveal-modal.turketarian-type-modal h2 { font-size: 1.4875em; } } @media screen and (max-width: 800px) { .reveal-modal.turketarian-type-modal h2 { font-size: 1.4em; } } @media screen and (max-width: 640px) { .reveal-modal.turketarian-type-modal h2 { font-size: 1.75em; } } @media screen and (max-width: 480px) { .reveal-modal.turketarian-type-modal h2 { font-size: 1.4em; } } .reveal-modal.turketarian-type-modal form select { display: none; } .reveal-modal.turketarian-type-modal form .row { padding: 0; } .reveal-modal.turketarian-type-modal form .row + .row { margin-top: 3em; margin-bottom: 1em; } @media screen and (max-width: 640px) { .reveal-modal.turketarian-type-modal form .row + .row { margin-top: 0; } } .reveal-modal.turketarian-type-modal form .row .columns { text-align: center; } .reveal-modal.turketarian-type-modal form .row .columns p { font-family: "Kievit Medium"; margin: 20px 0 0 0 !important; padding: 0; } .reveal-modal.turketarian-type-modal form .row .columns p strong { font-family: "Kievit Bold"; line-height: 1em; } @media screen and (min-width: 1281px) { .reveal-modal.turketarian-type-modal form .row .columns p strong { font-size: 1.5em; } } @media screen and (max-width: 1280px) { .reveal-modal.turketarian-type-modal form .row .columns p strong { font-size: 1.425em; } } @media screen and (max-width: 1120px) { .reveal-modal.turketarian-type-modal form .row .columns p strong { font-size: 1.35em; } } @media screen and (max-width: 960px) { .reveal-modal.turketarian-type-modal form .row .columns p strong { font-size: 1.275em; } } @media screen and (max-width: 800px) { .reveal-modal.turketarian-type-modal form .row .columns p strong { font-size: 1.2em; } } @media screen and (max-width: 640px) { .reveal-modal.turketarian-type-modal form .row .columns p strong { font-size: 1.5em; } } @media screen and (max-width: 480px) { .reveal-modal.turketarian-type-modal form .row .columns p strong { font-size: 1.2em; } } .reveal-modal.turketarian-type-modal form .row .columns p .button { float: none; margin: 0; width: 188px; } @media screen and (max-width: 640px) { .reveal-modal.turketarian-type-modal form .row .columns { margin-bottom: 2em; } } .reveal-modal.turketarian-type-modal #modal-content form > p { font-family: "Kievit Bold"; margin: 0 0 2em 0; padding: 0; } .contact-us article #hero.simple { padding-top: 200px; margin: 0px auto; width: 100%; } @media screen and (max-width: 640px) { .contact-us article #hero.simple { width: 90%; } } @media screen and (max-width: 950px) { .contact-us article .large-8 { width: 100%; } } .contact-us article .large-1 { width: 3%; text-align: center; padding-top: 13px; } @media screen and (max-width: 640px) { .contact-us article .large-1 { padding: 13px 0 0 0; } } .contact-us article .large-2 { padding-right: 0; } .contact-us article .large-2[class*="column"]:last-child { float: left; } .contact-us article #comments { padding: 0.5em 0.75em; font-size: 14px; } .contact-us article .form { margin-top: 40px; } @media screen and (max-width: 640px) { .contact-us article .form { width: 90%; } } .contact-us-landing article #page-texture { position: absolute; right: 0; top: 220px; z-index: 10; } .contact-us-landing article #page-texture img { float: right; } @media screen and (max-width: 1440px) { .contact-us-landing article #page-texture { width: 50%; } } @media screen and (max-width: 1000px) { .contact-us-landing article #page-texture { width: 40%; } } @media screen and (max-width: 800px) { .contact-us-landing article #page-texture { top: 320px; } } @media screen and (max-width: 640px) { .contact-us-landing article #page-texture { display: none; } } .contact-us-landing article #hero .info { min-height: 260px; } @media screen and (max-width: 640px) { .contact-us-landing article #hero .info { min-height: 0; padding-bottom: 35px; } } .contact-us-landing article #callouts { position: relative; } .contact-us-landing article #callouts .columns.small-centered { padding-top: 30px; padding-bottom: 40px; height: 350px; } @media screen and (max-width: 640px) { .contact-us-landing article #callouts .columns.small-centered { height: 380px; } } @media screen and (max-width: 480px) { .contact-us-landing article #callouts .columns.small-centered { height: 335px; } } .contact-us-landing article #callouts .bottom-shadow { position: absolute; bottom: 0; left: 0; width: 100%; background: url("images/backgrounds/media-callout-bottom-shadow.png") repeat-x; height: 7px; } .contact-us-landing article .media-callouts { background: #e6e6e6; padding: 42px 0 68px 0; } /*.contact-us-landing article .media-callouts .columns:first-child { border-right: 1px solid #82a8cb; }*/ .contact-us-landing article .media-callouts .columns { padding-top: 12px; padding-bottom: 12px; } .contact-us-landing article .media-callouts .columns h2 { margin-top: 0; padding: 0 30px; } .contact-us-landing article .media-callouts .columns p { padding: 0 30px; } @media screen and (max-width: 768px) { .turkey-talk-line article #hero.simple { padding-top: 170px; } } .turkey-talk-line article #hero.simple .row { position: relative; } .turkey-talk-line article #hero.simple .large-6 { position: static; } .turkey-talk-line article #hero.simple .info { padding-bottom: 20px; } .turkey-talk-line article #hero.simple .info p strong { font-family: "Kievit Bold"; } .turkey-talk-line article #hero.simple figure { -webkit-box-shadow: 0 2px 8px rgba(0, 0, 0, 0.5); -moz-box-shadow: 0 2px 8px rgba(0, 0, 0, 0.5); box-shadow: 0 2px 8px rgba(0, 0, 0, 0.5); position: absolute; bottom: -20px; z-index: 100; } @media screen and (max-width: 950px) { .turkey-talk-line article #hero.simple figure { position: relative; } } .turkey-talk-line article #hero.simple figure img { width: 100%; } @media screen and (max-width: 640px) { .turkey-talk-line article .product-list { margin-top: 3em; } } .turkey-talk-line article .product-list .row { border-top: none; padding-top: 0; } .turkey-talk-line article .product-list .row p strong { font-family: "Kievit Bold"; } @media screen and (max-width: 640px) { .turkey-talk-line article .product-list .row { padding-top: 20px; padding-bottom: 20px; } .turkey-talk-line article .product-list .row:first-child { padding-bottom: 0; } .turkey-talk-line article .product-list .row .related-product { margin-top: 0; padding-top: 25px; padding-bottom: 20px; } } .turkey-talk-line article .product-list .row:first-child .columns:first-child { border-top: #82a8cb 1px solid; } @media screen and (max-width: 640px) { .turkey-talk-line article .product-list .row:first-child .columns:first-child { border-top: none; } } .turkey-talk-line article #callout-mid { padding-bottom: 26px; } .lt-ie9 .turkey-talk-line article #hero.simple figure { position: static; } .master-chef article h3 { line-height: 1em; } @media screen and (min-width: 1281px) { .master-chef article h3 { font-size: 1.5625em; } } @media screen and (max-width: 1280px) { .master-chef article h3 { font-size: 1.48438em; } } @media screen and (max-width: 1120px) { .master-chef article h3 { font-size: 1.40625em; } } @media screen and (max-width: 960px) { .master-chef article h3 { font-size: 1.32813em; } } @media screen and (max-width: 800px) { .master-chef article h3 { font-size: 1.25em; } } @media screen and (max-width: 640px) { .master-chef article h3 { font-size: 1.5625em; } } @media screen and (max-width: 480px) { .master-chef article h3 { font-size: 1.25em; } } .master-chef article #hero { position: relative; } .master-chef article #hero .layers { position: relative; display: block; } @media screen and (max-width: 640px) { .master-chef article #hero .layers { display: none; } } .master-chef article #hero .layers .backdrop { overflow: hidden; max-height: 800px; } .master-chef article #hero .layers .backdrop img, .master-chef article #hero .layers .backdrop figure { height: 100%; width: 100%; min-height: 800px; max-height: 800px; margin: 0 auto; } @media screen and (max-width: 640px) { .master-chef article #hero .layers .backdrop img, .master-chef article #hero .layers .backdrop figure { min-height: 0; } } .master-chef article #hero .row { position: absolute; top: 30%; left: 0; right: 0; } @media screen and (max-width: 960px) { .master-chef article #hero .row { top: 30%; } } @media screen and (max-width: 640px) { .master-chef article #hero .row { position: static; } } .master-chef article #hero .row .columns { padding: 0; } .master-chef article #hero .row .columns .info h1 { color: #09457d; font-family: "Kievit black"; line-height: 1em; margin-top: 0; margin-bottom: 0.25em; text-transform: uppercase; text-shadow: 1px 1px 2px #969696; max-width: 400px; } @media screen and (min-width: 1281px) { .master-chef article #hero .row .columns .info h1 { font-size: 3em; } } @media screen and (max-width: 1280px) { .master-chef article #hero .row .columns .info h1 { font-size: 2.85em; } } @media screen and (max-width: 1120px) { .master-chef article #hero .row .columns .info h1 { font-size: 2.7em; } } @media screen and (max-width: 960px) { .master-chef article #hero .row .columns .info h1 { font-size: 2.55em; } } @media screen and (max-width: 800px) { .master-chef article #hero .row .columns .info h1 { font-size: 2.4em; } } @media screen and (max-width: 640px) { .master-chef article #hero .row .columns .info h1 { font-size: 3em; } } @media screen and (max-width: 480px) { .master-chef article #hero .row .columns .info h1 { font-size: 2.4em; } } .master-chef article #hero .row .columns .info p { font-family: "Kievit Book"; line-height: 1.375em; margin: 0.25em 0 0.75em 0; width: 78%; } @media screen and (min-width: 1281px) { .master-chef article #hero .row .columns .info p { font-size: 1.25em; } } @media screen and (max-width: 1280px) { .master-chef article #hero .row .columns .info p { font-size: 1.1875em; } } @media screen and (max-width: 1120px) { .master-chef article #hero .row .columns .info p { font-size: 1.125em; } } @media screen and (max-width: 960px) { .master-chef article #hero .row .columns .info p { font-size: 1.0625em; } } @media screen and (max-width: 800px) { .master-chef article #hero .row .columns .info p { font-size: 1em; } } @media screen and (max-width: 640px) { .master-chef article #hero .row .columns .info p { font-size: 1.25em; } } @media screen and (max-width: 480px) { .master-chef article #hero .row .columns .info p { font-size: 1em; } } @media screen and (max-width: 1000px) { .master-chef article #hero .row .columns .info p { line-height: 1.275em; } } @media screen and (max-width: 1000px) and (min-width: 1281px) { .master-chef article #hero .row .columns .info p { font-size: 1.15em; } } @media screen and (max-width: 1000px) and (max-width: 1280px) { .master-chef article #hero .row .columns .info p { font-size: 1.0925em; } } @media screen and (max-width: 1000px) and (max-width: 1120px) { .master-chef article #hero .row .columns .info p { font-size: 1.035em; } } @media screen and (max-width: 1000px) and (max-width: 960px) { .master-chef article #hero .row .columns .info p { font-size: 0.9775em; } } @media screen and (max-width: 1000px) and (max-width: 800px) { .master-chef article #hero .row .columns .info p { font-size: 0.92em; } } @media screen and (max-width: 1000px) and (max-width: 640px) { .master-chef article #hero .row .columns .info p { font-size: 1.15em; } } @media screen and (max-width: 1000px) and (max-width: 480px) { .master-chef article #hero .row .columns .info p { font-size: 0.92em; } } @media screen and (max-width: 768px) { .master-chef article #hero .row .columns .info p { width: 90%; } } @media screen and (max-width: 640px) { .master-chef article #hero .row .columns .info { padding: 6em 5% 0 5%; position: static; width: 100%; } } .master-chef article #hero .row .columns figure { -webkit-box-shadow: 0 2px 8px rgba(0, 0, 0, 0.5); -moz-box-shadow: 0 2px 8px rgba(0, 0, 0, 0.5); box-shadow: 0 2px 8px rgba(0, 0, 0, 0.5); position: relative; z-index: 100; } @media screen and (max-width: 1280px) and (min-width: 1120px) { .master-chef article #hero .row .columns figure { top: 0; } } @media screen and (max-width: 1280px) and (max-width: 1120px) { .master-chef article #hero .row .columns figure { top: 10px; } } @media screen and (max-width: 1280px) and (max-width: 960px) { .master-chef article #hero .row .columns figure { top: 0; } } @media screen and (max-width: 1280px) and (max-width: 640px) { .master-chef article #hero .row .columns figure { top: 19px; } } @media screen and (max-width: 640px) { .master-chef article #hero .row .columns figure { width: 90%; margin: 0 5%; } } .master-chef article #hero .row .columns figure > img { width: 100%; } .master-chef article #hero .row .columns figure figcaption { background: #fff; background: rgba(255, 255, 255, 0.8); position: absolute; width: 100%; bottom: 0; left: 0; padding: 0 8% 1em 8%; width: 100%; } .master-chef article #hero .row .columns figure figcaption p a { color: #09457d; font-family: "Kievit Book"; line-height: 1em; text-transform: uppercase; } @media screen and (min-width: 1281px) { .master-chef article #hero .row .columns figure figcaption p a { font-size: 1.5625em; } } @media screen and (max-width: 1280px) { .master-chef article #hero .row .columns figure figcaption p a { font-size: 1.48438em; } } @media screen and (max-width: 1120px) { .master-chef article #hero .row .columns figure figcaption p a { font-size: 1.40625em; } } @media screen and (max-width: 960px) { .master-chef article #hero .row .columns figure figcaption p a { font-size: 1.32813em; } } @media screen and (max-width: 800px) { .master-chef article #hero .row .columns figure figcaption p a { font-size: 1.25em; } } @media screen and (max-width: 640px) { .master-chef article #hero .row .columns figure figcaption p a { font-size: 1.5625em; } } @media screen and (max-width: 480px) { .master-chef article #hero .row .columns figure figcaption p a { font-size: 1.25em; } } @media screen and (max-width: 640px) { .master-chef article #hero .secondary-info { padding: 5%; } } .master-chef article .row .columns.large-12 > h3 { text-align: center; margin: 1.238em 0 0.5em 0; } .master-chef article .flexslider ul li { padding: 0; } .faqs #hero { background: url("images/backgrounds/faq-gradient.png") repeat; height: 443px; padding-top: 222px; } @media screen and (max-width: 768px) { .faqs #hero { padding-top: 180px; } } @media screen and (max-width: 640px) { .faqs #hero { padding-top: 80px; height: 458px; } .faqs #hero p { margin-top: 78px; } } @media screen and (max-width: 400px) { .faqs #hero { padding-top: 40px; height: 320px; } .faqs #hero p { margin-top: 40px; } } .faqs #hero h1 { color: #0a57a4; } @media screen and (max-width: 400px) { .faqs #hero h1 { font-size: 2.5em; } } .faqs .faq-main { background-image: url("images/backgrounds/dot-print.png"), -webkit-linear-gradient(to bottom, rgba(136, 187, 212, 0.75) 0%, rgba(144, 199, 226, 0.76) 1%, rgba(146, 200, 227, 0.75) 2%, rgba(144, 198, 225, 0.74) 3%, rgba(144, 197, 224, 0.72) 4%, rgba(141, 193, 219, 0.62) 12%, rgba(140, 191, 217, 0.61) 13%, rgba(138, 189, 216, 0.57) 16%, rgba(135, 186, 212, 0.56) 17%, rgba(129, 177, 201, 0.46) 25%, rgba(131, 179, 203, 0.45) 26%, rgba(129, 177, 201, 0.44) 27%, rgba(129, 177, 201, 0.43) 28%, rgba(123, 169, 192, 0.38) 32%, rgba(123, 168, 191, 0.34) 35%, rgba(115, 158, 178, 0.28) 40%, rgba(113, 155, 176, 0.27) 41%, rgba(111, 152, 173, 0.25) 42%, rgba(109, 149, 169, 0.24) 43%, rgba(106, 145, 165, 0.23) 44%, rgba(103, 141, 160, 0.2) 47%, rgba(96, 132, 149, 0.18) 49%, rgba(90, 123, 140, 0.16) 51%, rgba(89, 122, 138, 0.15) 52%, rgba(85, 116, 132, 0.14) 53%, rgba(78, 107, 122, 0.13) 55%, rgba(72, 99, 112, 0.12) 56%, rgba(70, 96, 109, 0.11) 57%, rgba(62, 85, 96, 0.1) 58%, rgba(59, 81, 91, 0.1) 59%, rgba(52, 72, 81, 0.09) 60%, rgba(43, 58, 66, 0.08) 61%, rgba(33, 46, 52, 0.08) 62%, rgba(28, 38, 43, 0.07) 63%, rgba(22, 30, 34, 0.07) 64%, rgba(9, 12, 13, 0.06) 65%, rgba(0, 0, 0, 0.06) 99%, rgba(0, 0, 0, 0) 100%); background-image: url("images/backgrounds/dot-print.png"), -moz-linear-gradient(to bottom, rgba(136, 187, 212, 0.75) 0%, rgba(144, 199, 226, 0.76) 1%, rgba(146, 200, 227, 0.75) 2%, rgba(144, 198, 225, 0.74) 3%, rgba(144, 197, 224, 0.72) 4%, rgba(141, 193, 219, 0.62) 12%, rgba(140, 191, 217, 0.61) 13%, rgba(138, 189, 216, 0.57) 16%, rgba(135, 186, 212, 0.56) 17%, rgba(129, 177, 201, 0.46) 25%, rgba(131, 179, 203, 0.45) 26%, rgba(129, 177, 201, 0.44) 27%, rgba(129, 177, 201, 0.43) 28%, rgba(123, 169, 192, 0.38) 32%, rgba(123, 168, 191, 0.34) 35%, rgba(115, 158, 178, 0.28) 40%, rgba(113, 155, 176, 0.27) 41%, rgba(111, 152, 173, 0.25) 42%, rgba(109, 149, 169, 0.24) 43%, rgba(106, 145, 165, 0.23) 44%, rgba(103, 141, 160, 0.2) 47%, rgba(96, 132, 149, 0.18) 49%, rgba(90, 123, 140, 0.16) 51%, rgba(89, 122, 138, 0.15) 52%, rgba(85, 116, 132, 0.14) 53%, rgba(78, 107, 122, 0.13) 55%, rgba(72, 99, 112, 0.12) 56%, rgba(70, 96, 109, 0.11) 57%, rgba(62, 85, 96, 0.1) 58%, rgba(59, 81, 91, 0.1) 59%, rgba(52, 72, 81, 0.09) 60%, rgba(43, 58, 66, 0.08) 61%, rgba(33, 46, 52, 0.08) 62%, rgba(28, 38, 43, 0.07) 63%, rgba(22, 30, 34, 0.07) 64%, rgba(9, 12, 13, 0.06) 65%, rgba(0, 0, 0, 0.06) 99%, rgba(0, 0, 0, 0) 100%); background-image: url("images/backgrounds/dot-print.png"), -ms-linear-gradient(to bottom, rgba(136, 187, 212, 0.75) 0%, rgba(144, 199, 226, 0.76) 1%, rgba(146, 200, 227, 0.75) 2%, rgba(144, 198, 225, 0.74) 3%, rgba(144, 197, 224, 0.72) 4%, rgba(141, 193, 219, 0.62) 12%, rgba(140, 191, 217, 0.61) 13%, rgba(138, 189, 216, 0.57) 16%, rgba(135, 186, 212, 0.56) 17%, rgba(129, 177, 201, 0.46) 25%, rgba(131, 179, 203, 0.45) 26%, rgba(129, 177, 201, 0.44) 27%, rgba(129, 177, 201, 0.43) 28%, rgba(123, 169, 192, 0.38) 32%, rgba(123, 168, 191, 0.34) 35%, rgba(115, 158, 178, 0.28) 40%, rgba(113, 155, 176, 0.27) 41%, rgba(111, 152, 173, 0.25) 42%, rgba(109, 149, 169, 0.24) 43%, rgba(106, 145, 165, 0.23) 44%, rgba(103, 141, 160, 0.2) 47%, rgba(96, 132, 149, 0.18) 49%, rgba(90, 123, 140, 0.16) 51%, rgba(89, 122, 138, 0.15) 52%, rgba(85, 116, 132, 0.14) 53%, rgba(78, 107, 122, 0.13) 55%, rgba(72, 99, 112, 0.12) 56%, rgba(70, 96, 109, 0.11) 57%, rgba(62, 85, 96, 0.1) 58%, rgba(59, 81, 91, 0.1) 59%, rgba(52, 72, 81, 0.09) 60%, rgba(43, 58, 66, 0.08) 61%, rgba(33, 46, 52, 0.08) 62%, rgba(28, 38, 43, 0.07) 63%, rgba(22, 30, 34, 0.07) 64%, rgba(9, 12, 13, 0.06) 65%, rgba(0, 0, 0, 0.06) 99%, rgba(0, 0, 0, 0) 100%); background-image: url("images/backgrounds/dot-print.png"), -o-linear-gradient(to bottom, rgba(136, 187, 212, 0.75) 0%, rgba(144, 199, 226, 0.76) 1%, rgba(146, 200, 227, 0.75) 2%, rgba(144, 198, 225, 0.74) 3%, rgba(144, 197, 224, 0.72) 4%, rgba(141, 193, 219, 0.62) 12%, rgba(140, 191, 217, 0.61) 13%, rgba(138, 189, 216, 0.57) 16%, rgba(135, 186, 212, 0.56) 17%, rgba(129, 177, 201, 0.46) 25%, rgba(131, 179, 203, 0.45) 26%, rgba(129, 177, 201, 0.44) 27%, rgba(129, 177, 201, 0.43) 28%, rgba(123, 169, 192, 0.38) 32%, rgba(123, 168, 191, 0.34) 35%, rgba(115, 158, 178, 0.28) 40%, rgba(113, 155, 176, 0.27) 41%, rgba(111, 152, 173, 0.25) 42%, rgba(109, 149, 169, 0.24) 43%, rgba(106, 145, 165, 0.23) 44%, rgba(103, 141, 160, 0.2) 47%, rgba(96, 132, 149, 0.18) 49%, rgba(90, 123, 140, 0.16) 51%, rgba(89, 122, 138, 0.15) 52%, rgba(85, 116, 132, 0.14) 53%, rgba(78, 107, 122, 0.13) 55%, rgba(72, 99, 112, 0.12) 56%, rgba(70, 96, 109, 0.11) 57%, rgba(62, 85, 96, 0.1) 58%, rgba(59, 81, 91, 0.1) 59%, rgba(52, 72, 81, 0.09) 60%, rgba(43, 58, 66, 0.08) 61%, rgba(33, 46, 52, 0.08) 62%, rgba(28, 38, 43, 0.07) 63%, rgba(22, 30, 34, 0.07) 64%, rgba(9, 12, 13, 0.06) 65%, rgba(0, 0, 0, 0.06) 99%, rgba(0, 0, 0, 0) 100%); background-image: url("images/backgrounds/dot-print.png"), linear-gradient(to bottom, rgba(136, 187, 212, 0.75) 0%, rgba(144, 199, 226, 0.76) 1%, rgba(146, 200, 227, 0.75) 2%, rgba(144, 198, 225, 0.74) 3%, rgba(144, 197, 224, 0.72) 4%, rgba(141, 193, 219, 0.62) 12%, rgba(140, 191, 217, 0.61) 13%, rgba(138, 189, 216, 0.57) 16%, rgba(135, 186, 212, 0.56) 17%, rgba(129, 177, 201, 0.46) 25%, rgba(131, 179, 203, 0.45) 26%, rgba(129, 177, 201, 0.44) 27%, rgba(129, 177, 201, 0.43) 28%, rgba(123, 169, 192, 0.38) 32%, rgba(123, 168, 191, 0.34) 35%, rgba(115, 158, 178, 0.28) 40%, rgba(113, 155, 176, 0.27) 41%, rgba(111, 152, 173, 0.25) 42%, rgba(109, 149, 169, 0.24) 43%, rgba(106, 145, 165, 0.23) 44%, rgba(103, 141, 160, 0.2) 47%, rgba(96, 132, 149, 0.18) 49%, rgba(90, 123, 140, 0.16) 51%, rgba(89, 122, 138, 0.15) 52%, rgba(85, 116, 132, 0.14) 53%, rgba(78, 107, 122, 0.13) 55%, rgba(72, 99, 112, 0.12) 56%, rgba(70, 96, 109, 0.11) 57%, rgba(62, 85, 96, 0.1) 58%, rgba(59, 81, 91, 0.1) 59%, rgba(52, 72, 81, 0.09) 60%, rgba(43, 58, 66, 0.08) 61%, rgba(33, 46, 52, 0.08) 62%, rgba(28, 38, 43, 0.07) 63%, rgba(22, 30, 34, 0.07) 64%, rgba(9, 12, 13, 0.06) 65%, rgba(0, 0, 0, 0.06) 99%, rgba(0, 0, 0, 0) 100%); background-repeat: repeat; padding-top: 84px; padding-bottom: 84px; } @media screen and (max-width: 400px) { .faqs .faq-main { padding-top: 35px; } } .faqs .faq-main aside .faq-filter { -webkit-box-shadow: 1px 1px 0px 0px rgba(0, 0, 0, 0.28); -moz-box-shadow: 1px 1px 0px 0px rgba(0, 0, 0, 0.28); box-shadow: 1px 1px 0px 0px rgba(0, 0, 0, 0.28); } .faqs .faq-main aside .faq-filter h3 { background: #0097dc; text-align: center; color: #fff; font-size: 21px; line-height: 23px; padding: 18px 0 14px 0; text-transform: uppercase; margin: 0; } @media screen and (max-width: 1200px) { .faqs .faq-main aside .faq-filter h3 { font-size: 19px; } } .faqs .faq-main aside .faq-filter ul li { background: none; margin: 0; padding: 0; border-bottom: #fff solid 2px; } .faqs .faq-main aside .faq-filter ul li:last-child { border-bottom: none; } .faqs .faq-main aside .faq-filter ul li a { background: #09457d; color: #fff; padding: 18px 20px 14px 20px; font-family: "Kievit Bold"; font-size: 18px; line-height: 22px; text-transform: uppercase; display: block; word-wrap: break-word; } @media screen and (max-width: 1200px) { .faqs .faq-main aside .faq-filter ul li a { font-size: 16px; line-height: 20px; } } .faqs .faq-main aside .faq-filter ul li a:hover { text-decoration: none; background-color: #309dcd; background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #309dcd), color-stop(100%, #1481bc)); background-image: -webkit-linear-gradient(top, #309dcd, #1481bc); background-image: -moz-linear-gradient(top, #309dcd, #1481bc); background-image: -ms-linear-gradient(top, #309dcd, #1481bc); background-image: -o-linear-gradient(top, #309dcd, #1481bc); background-image: linear-gradient(top, #309dcd, #1481bc); } .faqs .faq-main aside .faq-filter ul li a.active, .faqs .faq-main aside .faq-filter ul li a.active:hover { background: #e0e0e0; color: #09457d; } @media screen and (max-width: 900px) { .faqs .faq-main aside { width: 100%; margin-bottom: 66px; } .faqs .faq-main aside .faq-filter h3 { background: #0097dc url("images/icons/faq-filter-arrow.png") right top no-repeat; cursor: pointer; } .faqs .faq-main aside .faq-filter ul { display: none; } .faqs .faq-main aside .faq-filter ul li { border-bottom: none; } .faqs .faq-main aside .faq-filter ul li a { text-align: center; font-size: 22px; line-height: 23px; border-top: 3px solid #fff; } .faqs .faq-main aside .faq-filter.open h3 { background-position: right -55px; } .faqs .faq-main aside .faq-filter.open ul { display: block; } } @media screen and (max-width: 400px) { .faqs .faq-main aside { margin-bottom: 35px; } } @media screen and (max-width: 900px) { .faqs .faq-main .faq-container { width: 100%; } } .faqs .faq-main .faq-container .faq { border-top: 1px solid #80acd2; margin: 0 0 39px 0; padding: 38px 0 0 0; } .faqs .faq-main .faq-container .faq:first-child { border-top: none; padding-top: 0; } .faqs .faq-main .faq-container .faq .letter { float: left; margin: 0 2.6% 0 0; font-size: 70px; line-height: 71px; font-family: "Kievit black"; text-transform: uppercase; text-shadow: 1px 1px 2px #969696; color: #09457d; width: 6%; } @media screen and (max-width: 1200px) { .faqs .faq-main .faq-container .faq .letter { font-size: 50px; line-height: 51px; } } @media screen and (max-width: 1000px) { .faqs .faq-main .faq-container .faq .letter { margin-right: 5%; } } @media screen and (max-width: 900px) { .faqs .faq-main .faq-container .faq .letter { font-size: 70px; line-height: 71px; width: 8%; } } @media screen and (max-width: 640px) { .faqs .faq-main .faq-container .faq .letter { width: 11%; } } @media screen and (max-width: 450px) { .faqs .faq-main .faq-container .faq .letter { font-size: 40px; line-height: 41px; } } .faqs .faq-main .faq-container .faq .faq-text { float: left; width: 91.4%; padding: 0 8% 0 0; } @media screen and (max-width: 1000px) { .faqs .faq-main .faq-container .faq .faq-text { width: 89%; } } @media screen and (max-width: 900px) { .faqs .faq-main .faq-container .faq .faq-text { width: 87%; padding: 0; } } @media screen and (max-width: 640px) { .faqs .faq-main .faq-container .faq .faq-text { width: 83%; } } .faqs .faq-main .faq-container .faq .faq-text h2 { margin: 0; color: #09457d; font-size: 35px; line-height: 36px; } @media screen and (max-width: 1200px) { .faqs .faq-main .faq-container .faq .faq-text h2 { font-size: 30px; line-height: 31px; } } @media screen and (max-width: 900px) { .faqs .faq-main .faq-container .faq .faq-text h2 { font-size: 41px; line-height: 42px; } } @media screen and (max-width: 450px) { .faqs .faq-main .faq-container .faq .faq-text h2 { font-size: 20px; line-height: 21px; } } .faqs .faq-main .faq-container .faq .faq-text .answer-image { float: left; width: 32.5%; margin: 0 4.8% 2% 0; } .faqs .faq-main .faq-container .faq .faq-text .answer-image img { width: 100%; -webkit-box-shadow: 0px -2px 8px 0px rgba(0, 0, 0, 0.25); -moz-box-shadow: 0px -2px 8px 0px rgba(0, 0, 0, 0.25); box-shadow: 0px -2px 8px 0px rgba(0, 0, 0, 0.25); } @media screen and (max-width: 900px) { .faqs .faq-main .faq-container .faq .faq-text .answer-image { width: 100%; margin: 0 0 26px 0; float: none; } } .faqs .faq-main .faq-container .faq .faq-text .answer-text p { font-size: 20px; font-family: "Kievit Book"; color: #404040; } .faqs .faq-main .faq-container .faq .faq-text .answer-text p:first-child { margin-top: 0; } .faqs .faq-main .faq-container .faq .answer { margin: 26px 0 0 0; }