/** Shopify CDN: Minification failed

Line 84:2 Expected identifier but found "*"
Line 149:2 Expected identifier but found "*"
Line 1653:2 Expected identifier but found "*"
Line 1670:2 Expected identifier but found "*"
Line 1686:2 Expected identifier but found "*"
Line 2702:4 Expected identifier but found "*"
Line 6831:0 Unexpected "#404"

**/
/*============================================================================
  Shopify Timber
  Copyright 2015 Shopify Inc.
  Author Carson Shold @cshold
  Built with Sass - http://sass-lang.com/

  Some things to know about this file:
    - Sass is compiled on Shopify's server so you don't need to convert it to CSS yourself
    - The output CSS is compressed and comments are removed
    - You cannot use @imports in this file
        * Use grunt or gulp tasks to enable @imports - https://github.com/Shopify/shopify-css-import
    - Helpers variables, mixins, and starter classes are provided. Change as needed.
    - The file is prepped with a CSS reset
    - The font icons are prepared using https://icomoon.io/app
==============================================================================*/
/*============================================================================
  Table of Contents

  #Breakpoint and Grid Variables
  #General Variables
  #Sass Mixins
  #Normalize
  #Grid Setup
  #Basic Styles
  #Helper Classes
  #Typography
  #Rich Text Editor
  #Links and Buttons
  #Lists
  #Tables
  #Reponsive Tables
  #OOCSS Media Object
  #Images and Iframes
  #Forms
  #Icons
  #Pagination
  #Site Header
  #Site Nav and Dropdowns
  #Mobile Nav
  #Drawers
  #Site Footer
  #Product and Collection Grids
  #Collection Filters
  #Breadcrumbs
  #Product Page
  #Notes and Form Feedback
  #Cart Page
  #Ajax Cart Styles
  #Home Slide Show Styles
  #Individual Page Styles
==============================================================================*/
/*============================================================================
  #Breakpoint and Grid Variables
==============================================================================*/
/*================ The following are dependencies of csswizardry grid ================*/
/*============================================================================
  #General Variables
==============================================================================*/
/*1180px*/
/*================ Typography ================*/
@font-face {
  font-family: 'icons';
  src: url("//exederm.com/cdn/shop/t/13/assets/icons.eot?v=178685692947934814651765402979");
  src: url("//exederm.com/cdn/shop/t/13/assets/icons.eot?v=178685692947934814651765402979#iefix") format("embedded-opentype"), url("//exederm.com/cdn/shop/t/13/assets/icons.woff?v=47653217421655892331765402979") format("woff"), url("//exederm.com/cdn/shop/t/13/assets/icons.ttf?v=168172611022620091531765402979") format("truetype"), url("//exederm.com/cdn/shop/t/13/assets/icons.svg?v=150461254228185264111765402979#timber-icons") format("svg");
  font-weight: normal;
  font-style: normal; }

/*Font Awesome is also linked via index.liquid*/
/*============================================================================
  #Sass Mixins
==============================================================================*/
.clearfix {
  *zoom: 1; }
  .clearfix:after {
    content: '';
    display: table;
    clear: both; }

/*============================================================================
  Prefixer mixin for generating vendor prefixes:
    - Based on https://github.com/thoughtbot/bourbon/blob/master/app/assets/stylesheets/addons/_prefixer.scss
    - Usage:

      // Input:
      .element {
        @include prefixer(transform, scale(1), ms webkit spec);
      }

      // Output:
      .element {
        -ms-transform: scale(1);
        -webkit-transform: scale(1);
        transform: scale(1);
      }
==============================================================================*/
/*============================================================================
  Layer promotion mixin for creating smoother animations with higher FPS.
==============================================================================*/
/*============================================================================
  Dependency-free breakpoint mixin
    - Based on http://blog.grayghostvisuals.com/sass/sass-media-query-mixin/
    - Usage docs: http://shopify.github.io/Timber/#sass-mixins
==============================================================================*/
/*============================================================================
  #Normalize
==============================================================================*/
*, input, :before, :after {
  box-sizing: border-box; }

html, body {
  padding: 0;
  margin: 0; }

article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary {
  display: block; }

audio, canvas, progress, video {
  display: inline-block;
  vertical-align: baseline; }

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  height: auto; }

input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none; }

/*============================================================================
  #Grid Setup
    - Based on csswizardry grid, but with floated columns, a fixed gutter size, and BEM classes
    - Breakpoints defined above, under #Breakpoint and Grid Variables
    - Note the inclusion of .grid-uniform to take care of clearfixes on evenly sized grid items
==============================================================================*/
/* Force clearfix on grids */
.grid, .grid--rev, .grid--full,
.grid-uniform {
  *zoom: 1; }
  .grid:after, .grid--rev:after, .grid--full:after,
  .grid-uniform:after {
    content: '';
    display: table;
    clear: both; }

.lt-ie9 .grid, .lt-ie9 .grid--rev, .lt-ie9 .grid--full, .lt-ie9 .grid-uniform {
  text-align: left; }

/* Manual grid__item clearfix */
.grid__item.clear {
  clear: both; }

/*============================================================================
  Drop relative positioning into silent classes which can't take advantage of
  the `[class*="push--"]` and `[class*="pull--"]` selectors.
==============================================================================*/
/*============================================================================
  Grid Setup
    1. Allow the grid system to be used on lists.
    2. Remove any margins and paddings that might affect the grid system.
    3. Apply a negative `margin-left` to negate the columns' gutters.
==============================================================================*/
.grid, .grid--rev, .grid--full,
.grid-uniform {
  list-style: none;
  margin: 0;
  padding: 0; }

.grid__item {
  box-sizing: border-box;
  float: left;
  min-height: 1px;
  padding-left: 0;
  vertical-align: top;
  width: 100%; }

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

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

/*============================================================================
  WIDTHS
    - Create width classes, prefixed by the specified namespace.
==============================================================================*/
/*================ Clearfix helper on uniform grids ================*/
/*================ Helper show/hide classes around our breakpoints ================*/
/*================ Our regular, non-responsive width and helper classes ================*/
/** Whole */
.one-whole {
  width: 100%; }

/* Halves */
.one-half {
  width: 50%; }

/* Thirds */
.one-third {
  width: 33.333%; }

.two-thirds {
  width: 66.666%; }

/* Quarters */
.one-quarter {
  width: 25%; }

.two-quarters {
  width: 50%; }

.three-quarters {
  width: 75%; }

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

.two-fifths {
  width: 40%; }

.three-fifths {
  width: 60%; }

.four-fifths {
  width: 80%; }

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

.two-sixths {
  width: 33.333%; }

.three-sixths {
  width: 50%; }

.four-sixths {
  width: 66.666%; }

.five-sixths {
  width: 83.333%; }

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

.two-eighths {
  width: 25%; }

.three-eighths {
  width: 37.5%; }

.four-eighths {
  width: 50%; }

.five-eighths {
  width: 62.5%; }

.six-eighths {
  width: 75%; }

.seven-eighths {
  width: 87.5%; }

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

.two-tenths {
  width: 20%; }

.three-tenths {
  width: 30%; }

.four-tenths {
  width: 40%; }

.five-tenths {
  width: 50%; }

.six-tenths {
  width: 60%; }

.seven-tenths {
  width: 70%; }

.eight-tenths {
  width: 80%; }

.nine-tenths {
  width: 90%; }

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

.two-twelfths {
  width: 16.666%; }

.three-twelfths {
  width: 25%; }

.four-twelfths {
  width: 33.333%; }

.five-twelfths {
  width: 41.666%; }

.six-twelfths {
  width: 50%; }

.seven-twelfths {
  width: 58.333%; }

.eight-twelfths {
  width: 66.666%; }

.nine-twelfths {
  width: 75%; }

.ten-twelfths {
  width: 83.333%; }

.eleven-twelfths {
  width: 91.666%; }

.show {
  display: block !important; }

.hide {
  display: none !important; }

.text-left {
  text-align: left !important; }

.text-right {
  text-align: right !important; }

.text-center {
  text-align: center !important; }

.left {
  float: left !important; }

.right {
  float: right !important; }

/*================ Our responsive classes, if we have enabled them ================*/
@media only screen and (max-width: 480px) {
  /** Whole */
  .small--one-whole {
    width: 100%; }

  /* Halves */
  .small--one-half {
    width: 50%; }

  /* Thirds */
  .small--one-third {
    width: 33.333%; }

  .small--two-thirds {
    width: 66.666%; }

  /* Quarters */
  .small--one-quarter {
    width: 25%; }

  .small--two-quarters {
    width: 50%; }

  .small--three-quarters {
    width: 75%; }

  /* Fifths */
  .small--one-fifth {
    width: 20%; }

  .small--two-fifths {
    width: 40%; }

  .small--three-fifths {
    width: 60%; }

  .small--four-fifths {
    width: 80%; }

  /* Sixths */
  .small--one-sixth {
    width: 16.666%; }

  .small--two-sixths {
    width: 33.333%; }

  .small--three-sixths {
    width: 50%; }

  .small--four-sixths {
    width: 66.666%; }

  .small--five-sixths {
    width: 83.333%; }

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

  .small--two-eighths {
    width: 25%; }

  .small--three-eighths {
    width: 37.5%; }

  .small--four-eighths {
    width: 50%; }

  .small--five-eighths {
    width: 62.5%; }

  .small--six-eighths {
    width: 75%; }

  .small--seven-eighths {
    width: 87.5%; }

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

  .small--two-tenths {
    width: 20%; }

  .small--three-tenths {
    width: 30%; }

  .small--four-tenths {
    width: 40%; }

  .small--five-tenths {
    width: 50%; }

  .small--six-tenths {
    width: 60%; }

  .small--seven-tenths {
    width: 70%; }

  .small--eight-tenths {
    width: 80%; }

  .small--nine-tenths {
    width: 90%; }

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

  .small--two-twelfths {
    width: 16.666%; }

  .small--three-twelfths {
    width: 25%; }

  .small--four-twelfths {
    width: 33.333%; }

  .small--five-twelfths {
    width: 41.666%; }

  .small--six-twelfths {
    width: 50%; }

  .small--seven-twelfths {
    width: 58.333%; }

  .small--eight-twelfths {
    width: 66.666%; }

  .small--nine-twelfths {
    width: 75%; }

  .small--ten-twelfths {
    width: 83.333%; }

  .small--eleven-twelfths {
    width: 91.666%; }

  .small--show {
    display: block !important; }

  .small--hide {
    display: none !important; }

  .small--text-left {
    text-align: left !important; }

  .small--text-right {
    text-align: right !important; }

  .small--text-center {
    text-align: center !important; }

  .small--left {
    float: left !important; }

  .small--right {
    float: right !important; }

  .grid-uniform .small--one-half:nth-child(2n+1),
  .grid-uniform .small--one-third:nth-child(3n+1),
  .grid-uniform .small--one-quarter:nth-child(4n+1),
  .grid-uniform .small--one-fifth:nth-child(5n+1),
  .grid-uniform .small--one-sixth:nth-child(6n+1),
  .grid-uniform .small--two-sixths:nth-child(3n+1),
  .grid-uniform .small--three-sixths:nth-child(2n+1),
  .grid-uniform .small--two-eighths:nth-child(4n+1),
  .grid-uniform .small--four-eighths:nth-child(2n+1),
  .grid-uniform .small--five-tenths:nth-child(2n+1),
  .grid-uniform .small--one-twelfth:nth-child(12n+1),
  .grid-uniform .small--two-twelfths:nth-child(6n+1),
  .grid-uniform .small--three-twelfths:nth-child(4n+1),
  .grid-uniform .small--four-twelfths:nth-child(3n+1),
  .grid-uniform .small--six-twelfths:nth-child(2n+1) {
    clear: both; } }
@media only screen and (min-width: 481px) and (max-width: 768px) {
  /** Whole */
  .medium--one-whole {
    width: 100%; }

  /* Halves */
  .medium--one-half {
    width: 50%; }

  /* Thirds */
  .medium--one-third {
    width: 33.333%; }

  .medium--two-thirds {
    width: 66.666%; }

  /* Quarters */
  .medium--one-quarter {
    width: 25%; }

  .medium--two-quarters {
    width: 50%; }

  .medium--three-quarters {
    width: 75%; }

  /* Fifths */
  .medium--one-fifth {
    width: 20%; }

  .medium--two-fifths {
    width: 40%; }

  .medium--three-fifths {
    width: 60%; }

  .medium--four-fifths {
    width: 80%; }

  /* Sixths */
  .medium--one-sixth {
    width: 16.666%; }

  .medium--two-sixths {
    width: 33.333%; }

  .medium--three-sixths {
    width: 50%; }

  .medium--four-sixths {
    width: 66.666%; }

  .medium--five-sixths {
    width: 83.333%; }

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

  .medium--two-eighths {
    width: 25%; }

  .medium--three-eighths {
    width: 37.5%; }

  .medium--four-eighths {
    width: 50%; }

  .medium--five-eighths {
    width: 62.5%; }

  .medium--six-eighths {
    width: 75%; }

  .medium--seven-eighths {
    width: 87.5%; }

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

  .medium--two-tenths {
    width: 20%; }

  .medium--three-tenths {
    width: 30%; }

  .medium--four-tenths {
    width: 40%; }

  .medium--five-tenths {
    width: 50%; }

  .medium--six-tenths {
    width: 60%; }

  .medium--seven-tenths {
    width: 70%; }

  .medium--eight-tenths {
    width: 80%; }

  .medium--nine-tenths {
    width: 90%; }

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

  .medium--two-twelfths {
    width: 16.666%; }

  .medium--three-twelfths {
    width: 25%; }

  .medium--four-twelfths {
    width: 33.333%; }

  .medium--five-twelfths {
    width: 41.666%; }

  .medium--six-twelfths {
    width: 50%; }

  .medium--seven-twelfths {
    width: 58.333%; }

  .medium--eight-twelfths {
    width: 66.666%; }

  .medium--nine-twelfths {
    width: 75%; }

  .medium--ten-twelfths {
    width: 83.333%; }

  .medium--eleven-twelfths {
    width: 91.666%; }

  .medium--show {
    display: block !important; }

  .medium--hide {
    display: none !important; }

  .medium--text-left {
    text-align: left !important; }

  .medium--text-right {
    text-align: right !important; }

  .medium--text-center {
    text-align: center !important; }

  .medium--left {
    float: left !important; }

  .medium--right {
    float: right !important; }

  .grid-uniform .medium--one-half:nth-child(2n+1),
  .grid-uniform .medium--one-third:nth-child(3n+1),
  .grid-uniform .medium--one-quarter:nth-child(4n+1),
  .grid-uniform .medium--one-fifth:nth-child(5n+1),
  .grid-uniform .medium--one-sixth:nth-child(6n+1),
  .grid-uniform .medium--two-sixths:nth-child(3n+1),
  .grid-uniform .medium--three-sixths:nth-child(2n+1),
  .grid-uniform .medium--two-eighths:nth-child(4n+1),
  .grid-uniform .medium--four-eighths:nth-child(2n+1),
  .grid-uniform .medium--five-tenths:nth-child(2n+1),
  .grid-uniform .medium--one-twelfth:nth-child(12n+1),
  .grid-uniform .medium--two-twelfths:nth-child(6n+1),
  .grid-uniform .medium--three-twelfths:nth-child(4n+1),
  .grid-uniform .medium--four-twelfths:nth-child(3n+1),
  .grid-uniform .medium--six-twelfths:nth-child(2n+1) {
    clear: both; } }
@media only screen and (max-width: 768px) {
  /** Whole */
  .medium-down--one-whole {
    width: 100%; }

  /* Halves */
  .medium-down--one-half {
    width: 50%; }

  /* Thirds */
  .medium-down--one-third {
    width: 33.333%; }

  .medium-down--two-thirds {
    width: 66.666%; }

  /* Quarters */
  .medium-down--one-quarter {
    width: 25%; }

  .medium-down--two-quarters {
    width: 50%; }

  .medium-down--three-quarters {
    width: 75%; }

  /* Fifths */
  .medium-down--one-fifth {
    width: 20%; }

  .medium-down--two-fifths {
    width: 40%; }

  .medium-down--three-fifths {
    width: 60%; }

  .medium-down--four-fifths {
    width: 80%; }

  /* Sixths */
  .medium-down--one-sixth {
    width: 16.666%; }

  .medium-down--two-sixths {
    width: 33.333%; }

  .medium-down--three-sixths {
    width: 50%; }

  .medium-down--four-sixths {
    width: 66.666%; }

  .medium-down--five-sixths {
    width: 83.333%; }

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

  .medium-down--two-eighths {
    width: 25%; }

  .medium-down--three-eighths {
    width: 37.5%; }

  .medium-down--four-eighths {
    width: 50%; }

  .medium-down--five-eighths {
    width: 62.5%; }

  .medium-down--six-eighths {
    width: 75%; }

  .medium-down--seven-eighths {
    width: 87.5%; }

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

  .medium-down--two-tenths {
    width: 20%; }

  .medium-down--three-tenths {
    width: 30%; }

  .medium-down--four-tenths {
    width: 40%; }

  .medium-down--five-tenths {
    width: 50%; }

  .medium-down--six-tenths {
    width: 60%; }

  .medium-down--seven-tenths {
    width: 70%; }

  .medium-down--eight-tenths {
    width: 80%; }

  .medium-down--nine-tenths {
    width: 90%; }

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

  .medium-down--two-twelfths {
    width: 16.666%; }

  .medium-down--three-twelfths {
    width: 25%; }

  .medium-down--four-twelfths {
    width: 33.333%; }

  .medium-down--five-twelfths {
    width: 41.666%; }

  .medium-down--six-twelfths {
    width: 50%; }

  .medium-down--seven-twelfths {
    width: 58.333%; }

  .medium-down--eight-twelfths {
    width: 66.666%; }

  .medium-down--nine-twelfths {
    width: 75%; }

  .medium-down--ten-twelfths {
    width: 83.333%; }

  .medium-down--eleven-twelfths {
    width: 91.666%; }

  .medium-down--show {
    display: block !important; }

  .medium-down--hide {
    display: none !important; }

  .medium-down--text-left {
    text-align: left !important; }

  .medium-down--text-right {
    text-align: right !important; }

  .medium-down--text-center {
    text-align: center !important; }

  .medium-down--left {
    float: left !important; }

  .medium-down--right {
    float: right !important; }

  .grid-uniform .medium-down--one-half:nth-child(2n+1),
  .grid-uniform .medium-down--one-third:nth-child(3n+1),
  .grid-uniform .medium-down--one-quarter:nth-child(4n+1),
  .grid-uniform .medium-down--one-fifth:nth-child(5n+1),
  .grid-uniform .medium-down--one-sixth:nth-child(6n+1),
  .grid-uniform .medium-down--two-sixths:nth-child(3n+1),
  .grid-uniform .medium-down--three-sixths:nth-child(2n+1),
  .grid-uniform .medium-down--two-eighths:nth-child(4n+1),
  .grid-uniform .medium-down--four-eighths:nth-child(2n+1),
  .grid-uniform .medium-down--five-tenths:nth-child(2n+1),
  .grid-uniform .medium-down--one-twelfth:nth-child(12n+1),
  .grid-uniform .medium-down--two-twelfths:nth-child(6n+1),
  .grid-uniform .medium-down--three-twelfths:nth-child(4n+1),
  .grid-uniform .medium-down--four-twelfths:nth-child(3n+1),
  .grid-uniform .medium-down--six-twelfths:nth-child(2n+1) {
    clear: both; } }
@media only screen and (min-width: 769px) {
  /** Whole */
  .large--one-whole {
    width: 100%; }

  /* Halves */
  .large--one-half {
    width: 50%; }

  /* Thirds */
  .large--one-third {
    width: 33.333%; }

  .large--two-thirds {
    width: 66.666%; }

  /* Quarters */
  .large--one-quarter {
    width: 25%; }

  .large--two-quarters {
    width: 50%; }

  .large--three-quarters {
    width: 75%; }

  /* Fifths */
  .large--one-fifth {
    width: 20%; }

  .large--two-fifths {
    width: 40%; }

  .large--three-fifths {
    width: 60%; }

  .large--four-fifths {
    width: 80%; }

  /* Sixths */
  .large--one-sixth {
    width: 16.666%; }

  .large--two-sixths {
    width: 33.333%; }

  .large--three-sixths {
    width: 50%; }

  .large--four-sixths {
    width: 66.666%; }

  .large--five-sixths {
    width: 83.333%; }

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

  .large--two-eighths {
    width: 25%; }

  .large--three-eighths {
    width: 37.5%; }

  .large--four-eighths {
    width: 50%; }

  .large--five-eighths {
    width: 62.5%; }

  .large--six-eighths {
    width: 75%; }

  .large--seven-eighths {
    width: 87.5%; }

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

  .large--two-tenths {
    width: 20%; }

  .large--three-tenths {
    width: 30%; }

  .large--four-tenths {
    width: 40%; }

  .large--five-tenths {
    width: 50%; }

  .large--six-tenths {
    width: 60%; }

  .large--seven-tenths {
    width: 70%; }

  .large--eight-tenths {
    width: 80%; }

  .large--nine-tenths {
    width: 90%; }

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

  .large--two-twelfths {
    width: 16.666%; }

  .large--three-twelfths {
    width: 25%; }

  .large--four-twelfths {
    width: 33.333%; }

  .large--five-twelfths {
    width: 41.666%; }

  .large--six-twelfths {
    width: 50%; }

  .large--seven-twelfths {
    width: 58.333%; }

  .large--eight-twelfths {
    width: 66.666%; }

  .large--nine-twelfths {
    width: 75%; }

  .large--ten-twelfths {
    width: 83.333%; }

  .large--eleven-twelfths {
    width: 91.666%; }

  .large--show {
    display: block !important; }

  .large--hide {
    display: none !important; }

  .large--text-left {
    text-align: left !important; }

  .large--text-right {
    text-align: right !important; }

  .large--text-center {
    text-align: center !important; }

  .large--left {
    float: left !important; }

  .large--right {
    float: right !important; }

  .grid-uniform .large--one-half:nth-child(2n+1),
  .grid-uniform .large--one-third:nth-child(3n+1),
  .grid-uniform .large--one-quarter:nth-child(4n+1),
  .grid-uniform .large--one-fifth:nth-child(5n+1),
  .grid-uniform .large--one-sixth:nth-child(6n+1),
  .grid-uniform .large--two-sixths:nth-child(3n+1),
  .grid-uniform .large--three-sixths:nth-child(2n+1),
  .grid-uniform .large--two-eighths:nth-child(4n+1),
  .grid-uniform .large--four-eighths:nth-child(2n+1),
  .grid-uniform .large--five-tenths:nth-child(2n+1),
  .grid-uniform .large--one-twelfth:nth-child(12n+1),
  .grid-uniform .large--two-twelfths:nth-child(6n+1),
  .grid-uniform .large--three-twelfths:nth-child(4n+1),
  .grid-uniform .large--four-twelfths:nth-child(3n+1),
  .grid-uniform .large--six-twelfths:nth-child(2n+1) {
    clear: both; } }
/*============================================================================
  PUSH
    - Push classes, to move grid items over to the right by certain amounts
==============================================================================*/
[class*="push--"] {
  position: relative; }

/* Whole */
.push--one-whole {
  left: 100%; }

/* Halves */
.push--one-half {
  left: 50%; }

/* Thirds */
.push--one-third {
  left: 33.333%; }

.push--two-thirds {
  left: 66.666%; }

/* Quarters */
.push--one-quarter {
  left: 25%; }

.push--two-quarters {
  left: 50%; }

.push--three-quarters {
  left: 75%; }

/* Fifths */
.push--one-fifth {
  left: 20%; }

.push--two-fifths {
  left: 40%; }

.push--three-fifths {
  left: 60%; }

.push--four-fifths {
  left: 80%; }

/* Sixths */
.push--one-sixth {
  left: 16.666%; }

.push--two-sixths {
  left: 33.333%; }

.push--three-sixths {
  left: 50%; }

.push--four-sixths {
  left: 66.666%; }

.push--five-sixths {
  left: 83.333%; }

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

.push--two-eighths {
  left: 25%; }

.push--three-eighths {
  left: 37.5%; }

.push--four-eighths {
  left: 50%; }

.push--five-eighths {
  left: 62.5%; }

.push--six-eighths {
  left: 75%; }

.push--seven-eighths {
  left: 87.5%; }

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

.push--two-tenths {
  left: 20%; }

.push--three-tenths {
  left: 30%; }

.push--four-tenths {
  left: 40%; }

.push--five-tenths {
  left: 50%; }

.push--six-tenths {
  left: 60%; }

.push--seven-tenths {
  left: 70%; }

.push--eight-tenths {
  left: 80%; }

.push--nine-tenths {
  left: 90%; }

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

.push--two-twelfths {
  left: 16.666%; }

.push--three-twelfths {
  left: 25%; }

.push--four-twelfths {
  left: 33.333%; }

.push--five-twelfths {
  left: 41.666%; }

.push--six-twelfths {
  left: 50%; }

.push--seven-twelfths {
  left: 58.333%; }

.push--eight-twelfths {
  left: 66.666%; }

.push--nine-twelfths {
  left: 75%; }

.push--ten-twelfths {
  left: 83.333%; }

.push--eleven-twelfths {
  left: 91.666%; }

@media only screen and (min-width: 481px) and (max-width: 768px) {
  /* Whole */
  .push--medium--one-whole {
    left: 100%; }

  /* Halves */
  .push--medium--one-half {
    left: 50%; }

  /* Thirds */
  .push--medium--one-third {
    left: 33.333%; }

  .push--medium--two-thirds {
    left: 66.666%; }

  /* Quarters */
  .push--medium--one-quarter {
    left: 25%; }

  .push--medium--two-quarters {
    left: 50%; }

  .push--medium--three-quarters {
    left: 75%; }

  /* Fifths */
  .push--medium--one-fifth {
    left: 20%; }

  .push--medium--two-fifths {
    left: 40%; }

  .push--medium--three-fifths {
    left: 60%; }

  .push--medium--four-fifths {
    left: 80%; }

  /* Sixths */
  .push--medium--one-sixth {
    left: 16.666%; }

  .push--medium--two-sixths {
    left: 33.333%; }

  .push--medium--three-sixths {
    left: 50%; }

  .push--medium--four-sixths {
    left: 66.666%; }

  .push--medium--five-sixths {
    left: 83.333%; }

  /* Eighths */
  .push--medium--one-eighth {
    left: 12.5%; }

  .push--medium--two-eighths {
    left: 25%; }

  .push--medium--three-eighths {
    left: 37.5%; }

  .push--medium--four-eighths {
    left: 50%; }

  .push--medium--five-eighths {
    left: 62.5%; }

  .push--medium--six-eighths {
    left: 75%; }

  .push--medium--seven-eighths {
    left: 87.5%; }

  /* Tenths */
  .push--medium--one-tenth {
    left: 10%; }

  .push--medium--two-tenths {
    left: 20%; }

  .push--medium--three-tenths {
    left: 30%; }

  .push--medium--four-tenths {
    left: 40%; }

  .push--medium--five-tenths {
    left: 50%; }

  .push--medium--six-tenths {
    left: 60%; }

  .push--medium--seven-tenths {
    left: 70%; }

  .push--medium--eight-tenths {
    left: 80%; }

  .push--medium--nine-tenths {
    left: 90%; }

  /* Twelfths */
  .push--medium--one-twelfth {
    left: 8.333%; }

  .push--medium--two-twelfths {
    left: 16.666%; }

  .push--medium--three-twelfths {
    left: 25%; }

  .push--medium--four-twelfths {
    left: 33.333%; }

  .push--medium--five-twelfths {
    left: 41.666%; }

  .push--medium--six-twelfths {
    left: 50%; }

  .push--medium--seven-twelfths {
    left: 58.333%; }

  .push--medium--eight-twelfths {
    left: 66.666%; }

  .push--medium--nine-twelfths {
    left: 75%; }

  .push--medium--ten-twelfths {
    left: 83.333%; }

  .push--medium--eleven-twelfths {
    left: 91.666%; } }
@media only screen and (max-width: 768px) {
  /* Whole */
  .push--medium-down--one-whole {
    left: 100%; }

  /* Halves */
  .push--medium-down--one-half {
    left: 50%; }

  /* Thirds */
  .push--medium-down--one-third {
    left: 33.333%; }

  .push--medium-down--two-thirds {
    left: 66.666%; }

  /* Quarters */
  .push--medium-down--one-quarter {
    left: 25%; }

  .push--medium-down--two-quarters {
    left: 50%; }

  .push--medium-down--three-quarters {
    left: 75%; }

  /* Fifths */
  .push--medium-down--one-fifth {
    left: 20%; }

  .push--medium-down--two-fifths {
    left: 40%; }

  .push--medium-down--three-fifths {
    left: 60%; }

  .push--medium-down--four-fifths {
    left: 80%; }

  /* Sixths */
  .push--medium-down--one-sixth {
    left: 16.666%; }

  .push--medium-down--two-sixths {
    left: 33.333%; }

  .push--medium-down--three-sixths {
    left: 50%; }

  .push--medium-down--four-sixths {
    left: 66.666%; }

  .push--medium-down--five-sixths {
    left: 83.333%; }

  /* Eighths */
  .push--medium-down--one-eighth {
    left: 12.5%; }

  .push--medium-down--two-eighths {
    left: 25%; }

  .push--medium-down--three-eighths {
    left: 37.5%; }

  .push--medium-down--four-eighths {
    left: 50%; }

  .push--medium-down--five-eighths {
    left: 62.5%; }

  .push--medium-down--six-eighths {
    left: 75%; }

  .push--medium-down--seven-eighths {
    left: 87.5%; }

  /* Tenths */
  .push--medium-down--one-tenth {
    left: 10%; }

  .push--medium-down--two-tenths {
    left: 20%; }

  .push--medium-down--three-tenths {
    left: 30%; }

  .push--medium-down--four-tenths {
    left: 40%; }

  .push--medium-down--five-tenths {
    left: 50%; }

  .push--medium-down--six-tenths {
    left: 60%; }

  .push--medium-down--seven-tenths {
    left: 70%; }

  .push--medium-down--eight-tenths {
    left: 80%; }

  .push--medium-down--nine-tenths {
    left: 90%; }

  /* Twelfths */
  .push--medium-down--one-twelfth {
    left: 8.333%; }

  .push--medium-down--two-twelfths {
    left: 16.666%; }

  .push--medium-down--three-twelfths {
    left: 25%; }

  .push--medium-down--four-twelfths {
    left: 33.333%; }

  .push--medium-down--five-twelfths {
    left: 41.666%; }

  .push--medium-down--six-twelfths {
    left: 50%; }

  .push--medium-down--seven-twelfths {
    left: 58.333%; }

  .push--medium-down--eight-twelfths {
    left: 66.666%; }

  .push--medium-down--nine-twelfths {
    left: 75%; }

  .push--medium-down--ten-twelfths {
    left: 83.333%; }

  .push--medium-down--eleven-twelfths {
    left: 91.666%; } }
@media only screen and (min-width: 769px) {
  /* Whole */
  .push--large--one-whole {
    left: 100%; }

  /* Halves */
  .push--large--one-half {
    left: 50%; }

  /* Thirds */
  .push--large--one-third {
    left: 33.333%; }

  .push--large--two-thirds {
    left: 66.666%; }

  /* Quarters */
  .push--large--one-quarter {
    left: 25%; }

  .push--large--two-quarters {
    left: 50%; }

  .push--large--three-quarters {
    left: 75%; }

  /* Fifths */
  .push--large--one-fifth {
    left: 20%; }

  .push--large--two-fifths {
    left: 40%; }

  .push--large--three-fifths {
    left: 60%; }

  .push--large--four-fifths {
    left: 80%; }

  /* Sixths */
  .push--large--one-sixth {
    left: 16.666%; }

  .push--large--two-sixths {
    left: 33.333%; }

  .push--large--three-sixths {
    left: 50%; }

  .push--large--four-sixths {
    left: 66.666%; }

  .push--large--five-sixths {
    left: 83.333%; }

  /* Eighths */
  .push--large--one-eighth {
    left: 12.5%; }

  .push--large--two-eighths {
    left: 25%; }

  .push--large--three-eighths {
    left: 37.5%; }

  .push--large--four-eighths {
    left: 50%; }

  .push--large--five-eighths {
    left: 62.5%; }

  .push--large--six-eighths {
    left: 75%; }

  .push--large--seven-eighths {
    left: 87.5%; }

  /* Tenths */
  .push--large--one-tenth {
    left: 10%; }

  .push--large--two-tenths {
    left: 20%; }

  .push--large--three-tenths {
    left: 30%; }

  .push--large--four-tenths {
    left: 40%; }

  .push--large--five-tenths {
    left: 50%; }

  .push--large--six-tenths {
    left: 60%; }

  .push--large--seven-tenths {
    left: 70%; }

  .push--large--eight-tenths {
    left: 80%; }

  .push--large--nine-tenths {
    left: 90%; }

  /* Twelfths */
  .push--large--one-twelfth {
    left: 8.333%; }

  .push--large--two-twelfths {
    left: 16.666%; }

  .push--large--three-twelfths {
    left: 25%; }

  .push--large--four-twelfths {
    left: 33.333%; }

  .push--large--five-twelfths {
    left: 41.666%; }

  .push--large--six-twelfths {
    left: 50%; }

  .push--large--seven-twelfths {
    left: 58.333%; }

  .push--large--eight-twelfths {
    left: 66.666%; }

  .push--large--nine-twelfths {
    left: 75%; }

  .push--large--ten-twelfths {
    left: 83.333%; }

  .push--large--eleven-twelfths {
    left: 91.666%; } }
/*============================================================================
  PULL
    - Pull classes, to move grid items back to the left by certain amounts
==============================================================================*/
/*============================================================================
  #Basic Styles
==============================================================================*/
html {
  background-color: white; }

body {
  background-color: white;
  color: #5b5b5b; }

[tabindex='-1']:focus {
  outline: none; }

.wrapper-no-adjust {
  *zoom: 1;
  max-width: 1520px;
  margin: 0 auto;
  padding: 0 15px !important; }
  .wrapper-no-adjust:after {
    content: '';
    display: table;
    clear: both; }
  @media screen and (min-width: 480px) {
    .wrapper-no-adjust {
      padding: 0 30px; } }

.lt-ie9 .wrapper-no-adjust {
  width: 1520px;
  text-align: left; }

.search-container {
  *zoom: 1;
  max-width: 1520px;
  margin: 0 auto;
  padding: 0 15px !important; }
  .search-container:after {
    content: '';
    display: table;
    clear: both; }
  @media screen and (min-width: 480px) {
    .search-container {
      padding: 0 30px; } }

.lt-ie9 .search-container {
  width: 1520px; }

.wrapper {
  *zoom: 1;
  max-width: 1520px;
  margin: 0 auto;
  padding: 0 15px !important; }
  .wrapper:after {
    content: '';
    display: table;
    clear: both; }
  @media screen and (min-width: 480px) {
    .wrapper {
      padding: 0 30px; } }
  @media screen and (max-width: 768px) {
    .wrapper {
      margin: 0 auto;
      /*0 auto 0 -30px*/ } }

.lt-ie9 .wrapper {
  width: 1520px;
  text-align: left; }

.main-content {
  display: block;
  margin-top: 50px; }

/*============================================================================
  #Helper Classes
==============================================================================*/
.is-transitioning {
  display: block !important;
  visibility: visible !important; }

.display-table {
  display: table;
  table-layout: fixed;
  width: 100%; }

.display-table-cell {
  display: table-cell;
  vertical-align: middle;
  float: none; }

@media screen and (min-width: 769px) {
  .large--display-table {
    display: table;
    table-layout: fixed;
    width: 100%; }

  .large--display-table-cell {
    display: table-cell;
    vertical-align: middle;
    float: none; } }
.visually-hidden, .supports-fontface .icon-fallback-text .fallback-text {
  position: absolute;
  overflow: hidden;
  clip: rect(0 0 0 0);
  height: 1px;
  width: 1px;
  margin: -1px;
  padding: 0;
  border: 0; }

/*============================================================================
  #Typography
==============================================================================*/
body,
input,
textarea,
button,
.about-more-info button,
.about-more-info .btn,
.about-more-info .btn--secondary,
select {
  font-size: 15px;
  line-height: 21px;
  font-family: "Open Sans", sans-serif;
  color: #5b5b5b;
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
  -webkit-text-size-adjust: 100%; }

h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6, .header-one {
  display: block;
  font-family: "Encode Sans", sans-serif;
  font-weight: 500;
  margin: 0 0 0.5em;
  line-height: 1.4; }
  h1 a, .h1 a, h2 a, .h2 a, h3 a, .h3 a, h4 a, .h4 a, h5 a, .h5 a, h6 a, .h6 a, .header-one a {
    text-decoration: none;
    font-weight: inherit; }

/*================ Use em() Sass function to declare font-size ================*/
h1, .h1, .header-one {
  font-size: 3.21429em; }

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

h3, .h3 {
  font-size: 1.57143em; }

h4, .h4 {
  font-size: 1.42857em; }

h5, .h5 {
  font-size: 1.14286em; }

h6, .h6 {
  font-size: 1em; }

p {
  margin: 0 0 15px 0; }
  p img {
    margin: 0; }

em {
  font-style: italic; }

b, strong {
  font-weight: bold; }

small {
  font-size: 0.9em; }

sup, sub {
  position: relative;
  font-size: 60%;
  vertical-align: baseline; }

sup {
  top: -0.5em; }

sub {
  bottom: -0.5em; }

/*================ Blockquotes ================*/
blockquote {
  font-size: 1.125em;
  line-height: 1.45;
  font-style: italic;
  margin: 0 0 30px;
  padding: 15px 30px;
  border-left: 1px solid white; }
  blockquote p {
    margin-bottom: 0; }
    blockquote p + cite {
      margin-top: 15px; }
  blockquote cite {
    display: block;
    font-size: 0.75em; }
    blockquote cite:before {
      content: '\2014 \0020'; }

/*================ Code ================*/
code, pre {
  background-color: #faf7f5;
  font-family: Consolas,monospace;
  font-size: 1em;
  border: 0 none;
  padding: 0 2px;
  color: #51ab62; }

pre {
  overflow: auto;
  padding: 15px;
  margin: 0 0 30px; }

/*================ Horizontal Rules ================*/
hr {
  clear: both;
  border-top: solid #d5d5d5;
  border-width: 1px 0 0;
  height: 0; }
  hr.hr--small {
    margin: 15px 0; }
  hr.hr--clear {
    border-top-color: transparent; }

/*================ Section Headers ================*/
.section-header {
  margin-bottom: 20px; }

@media screen and (min-width: 769px) {
  .section-header {
    display: table;
    width: 100%; }

  .section-header__title {
    margin-bottom: 12px; }

  .section-header__left {
    display: table-cell;
    vertical-align: middle;
    margin-bottom: 0; }
    .section-header__left h1, .section-header__left .h1, .section-header__left h2, .section-header__left .h2, .section-header__left h3, .section-header__left .h3, .section-header__left h4, .section-header__left .h4,
    .section-header__left .h1, .section-header__left .h2, .section-header__left .h3, .section-header__left .h4 {
      margin-bottom: 0; }

  .section-header__right {
    display: table-cell;
    vertical-align: middle;
    text-align: right;
    width: 335px; } }
  @media screen and (min-width: 769px) and (max-width: 768px) {
    .section-header__right {
      margin-bottom: 30px; } }

.section-header__right .form-horizontal,
.section-header__right .collection-view {
  display: inline-block;
  vertical-align: middle; }
@media screen and (min-width: 481px) {
  .section-header__right label + select,
  .section-header__right .collection-view {
    margin-left: 15px; } }

@media screen and (max-width: 768px) {
  .section-header {
    text-align: center; } }
.collection-view {
  display: inline-block;
  border: 1px solid white;
  border-radius: 3px;
  padding: 0 5px;
  height: 37px;
  overflow: hidden;
  /*================ Only show on larger screens ================*/ }
  @media screen and (min-width: 769px) {
    .collection-view {
      display: inline-block; } }

.change-view {
  display: block;
  background: none;
  border: 0 none;
  float: left;
  padding: 10px 8px;
  color: white;
  line-height: 1; }
  .change-view:hover, .change-view:focus {
    color: #3e9a76; }

.change-view--active {
  cursor: default;
  color: #3e9a76; }

/*============================================================================
  #Rich Text Editor
==============================================================================*/
.rte {
  margin-bottom: 15px; }
  .rte a {
    text-decoration: underline; }
  .rte h1, .rte .h1, .rte h2, .rte .h2, .rte h3, .rte .h3, .rte h4, .rte .h4, .rte h5, .rte .h5, .rte h6, .rte .h6 {
    margin-top: 2em; }
    .rte h1:first-child, .rte .h1:first-child, .rte h2:first-child, .rte .h2:first-child, .rte h3:first-child, .rte .h3:first-child, .rte h4:first-child, .rte .h4:first-child, .rte h5:first-child, .rte .h5:first-child, .rte h6:first-child, .rte .h6:first-child {
      margin-top: 0; }
    .rte h1 a, .rte .h1 a, .rte h2 a, .rte .h2 a, .rte h3 a, .rte .h3 a, .rte h4 a, .rte .h4 a, .rte h5 a, .rte .h5 a, .rte h6 a, .rte .h6 a {
      text-decoration: none; }
  .rte > div {
    margin-bottom: 15px; }
  .rte li {
    margin-bottom: 0.4em; }

.rte--header {
  margin-bottom: 0; }

/*============================================================================
  #Links and Buttons
==============================================================================*/
a,
.text-link {
  color: #3e9a76;
  text-decoration: underline;
  background: transparent;
  font-weight: 500; }

a:hover,
a:focus {
  color: #64c19c; }

button, .about-more-info button, .about-more-info .btn, .about-more-info .btn--secondary {
  overflow: visible; }

button[disabled], .about-more-info [disabled].btn, .about-more-info [disabled].btn--secondary,
html input[disabled] {
  cursor: default; }

.btn, .btn--secondary,
.rte .btn--secondary,
.rte .btn,
.rte .btn--secondary {
  display: inline-block;
  padding: 8px 10px;
  width: auto;
  margin: 0;
  line-height: 1.42;
  font-weight: bold;
  text-decoration: none;
  text-align: center;
  vertical-align: middle;
  white-space: nowrap;
  cursor: pointer;
  border: 1px solid transparent;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  /*border-radius: $radius;*/
  width: 200px;
  /*================ Set primary button colors - can override later ================*/
  background-color: #3e9a76;
  color: white; }
  .btn:hover, .btn--secondary:hover,
  .rte .btn:hover,
  .rte .btn--secondary:hover {
    background-color: #2f765a;
    color: white; }
  .btn:active, .btn--secondary:active, .btn:focus, .btn--secondary:focus,
  .rte .btn:active,
  .rte .btn--secondary:active,
  .rte .btn:focus,
  .rte .btn--secondary:focus {
    background-color: #21513e;
    color: white; }
  .btn[disabled], [disabled].btn--secondary, .btn.disabled, .disabled.btn--secondary,
  .rte .btn[disabled],
  .rte [disabled].btn--secondary,
  .rte .btn.disabled,
  .rte .disabled.btn--secondary {
    cursor: default;
    color: #b6b6b6;
    background-color: #f6f6f6; }

.btn--secondary,
.rte .btn--secondary {
  background-color: #3e9a76; }
  .btn--secondary:hover,
  .rte .btn--secondary:hover {
    background-color: #2f765a;
    color: white; }
  .btn--secondary:active, .btn--secondary:focus,
  .rte .btn--secondary:active,
  .rte .btn--secondary:focus {
    background-color: #21513e;
    color: white; }

.btn--small {
  padding: 4px 5px;
  font-size: 0.85714em;
  font-family: "Open Sans", sans-serif; }

.btn--large {
  padding: 10px 30px;
  font-size: 16px;
  -webkit-box-shadow: 0px 5px 13px -4px rgba(0, 0, 0, 0.42);
  box-shadow: 0px 5px 13px -4px rgba(0, 0, 0, 0.42);
  font-family: "Open Sans", sans-serif; }

.btn--full {
  width: 100%; }

/*================ Force an input/button to look like a text link ================*/
.text-link {
  display: inline;
  border: 0 none;
  background: none;
  padding: 0;
  margin: 0; }

/*============================================================================
  #Lists
==============================================================================*/
/*ul, ol {
  margin: 0 0 ($gutter / 2) 40px;
  padding: 0;
}*/
ul, ol {
  margin: 0 0 15px 40px;
  padding: 0; }

ol {
  list-style: decimal; }

ul ul, ul ol,
ol ol, ol ul {
  margin: 4px 0 5px 20px; }

li {
  margin: 0; }

ul.square {
  list-style: square outside; }

ul.disc {
  list-style: disc outside; }

ol.alpha {
  list-style: lower-alpha outside; }

.no-bullets {
  list-style: none outside;
  margin-left: 0; }

.inline-list {
  margin-left: 0; }
  .inline-list li {
    display: inline-block;
    margin-bottom: 0; }

/*============================================================================
  #Tables
==============================================================================*/
table {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0; }

table.full {
  width: 100%;
  margin-bottom: 1em; }

.table-wrap {
  max-width: 100%;
  overflow: auto;
  -webkit-overflow-scrolling: touch; }

th {
  font-weight: bold; }

th, td {
  text-align: left;
  padding: 15px;
  border: 1px solid white; }

/*============================================================================
  Responsive tables, defined with .table--responsive on table element.
  Only defined for IE9+
==============================================================================*/
@media screen and (max-width: 680px) {
  .table--responsive thead {
    display: none; }
  .table--responsive tr {
    display: block; }
  .table--responsive tr,
  .table--responsive td {
    float: left;
    clear: both;
    width: 100%; }
  .table--responsive th,
  .table--responsive td {
    display: block;
    text-align: right;
    padding: 15px; }
  .table--responsive td:before {
    content: attr(data-label);
    float: left;
    text-align: center;
    font-size: 18px;
    padding-right: 10px; }
  .table--responsive.cart-table img {
    margin: 0 auto; }
  .table--responsive.cart-table .js-qty, .table--responsive.cart-table .ajaxcart__qty {
    float: right; } }

@media screen and (max-width: 480px) {
  .table--small-hide {
    display: none !important; }

  .table__section + .table__section {
    position: relative;
    margin-top: 10px;
    padding-top: 15px; }
    .table__section + .table__section:after {
      content: '';
      display: block;
      position: absolute;
      top: 0;
      left: 15px;
      right: 15px;
      border-bottom: 1px solid white; } }
/*============================================================================
  #OOCSS Media Object
    - http://www.stubbornella.org/content/2010/06/25/the-media-object-saves-hundreds-of-lines-of-code/
==============================================================================*/
.media,
.media-flex {
  overflow: hidden;
  _overflow: visible;
  zoom: 1; }

.media-img {
  float: left;
  margin-right: 30px; }

.media-img-right {
  float: right;
  margin-left: 30px; }

.media-img img,
.media-img-right img {
  display: block; }

/*============================================================================
  #Images and Iframes
==============================================================================*/
img {
  border: 0 none; }

svg:not(:root) {
  overflow: hidden; }

img,
iframe {
  max-width: 100%; }

.lt-ie9 img {
  width: 100%; }

.video-wrapper {
  position: relative;
  overflow: hidden;
  max-width: 100%;
  padding-bottom: 56.25%;
  height: 0;
  height: auto; }
  .video-wrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; }

/*============================================================================
  #Forms
==============================================================================*/
form {
  margin-bottom: 0; }

.form-vertical {
  margin-bottom: 15px;
  background-color: #e4f5ef;
  padding: 20px;
  overflow: auto; }
  .form-vertical input, .form-vertical textarea {
    font-weight: 400; }
  .form-vertical.white {
    background-color: white; }
  .form-vertical .form-required {
    color: #999999;
    font-weight: 700;
    margin-bottom: 15px; }
  .form-vertical .form-privacy {
    font-size: 12px;
    line-height: 16px;
    color: #535353; }

span.left.city, span.right.state {
  margin: 0;
  width: 100% !important; }

.wufoo li {
  width: 90%; }

/*================ Prevent zoom on touch devices in active inputs ================*/
@media screen and (max-width: 768px) {
  input,
  textarea {
    font-size: 16px; } }
input,
textarea,
button,
.about-more-info button,
.about-more-info .btn,
.about-more-info .btn--secondary,
select {
  padding: 0;
  margin: 0;
  -webkit-user-select: text;
  -moz-user-select: text;
  -ms-user-select: text;
  user-select: text; }

button, .about-more-info button, .about-more-info .btn, .about-more-info .btn--secondary {
  background: none;
  border: none;
  cursor: pointer; }

button, .about-more-info button, .about-more-info .btn, .about-more-info .btn--secondary,
input,
textarea {
  -webkit-appearance: none;
  -moz-appearance: none; }

button, .about-more-info button, .about-more-info .btn, .about-more-info .btn--secondary {
  background: none;
  border: none;
  display: inline-block;
  cursor: pointer; }

input[type="image"] {
  padding-left: 0;
  padding-right: 0; }

fieldset {
  border: 1px solid white;
  padding: 15px; }

legend {
  border: 0;
  padding: 0; }

button, .about-more-info button, .about-more-info .btn, .about-more-info .btn--secondary,
input[type="submit"] {
  cursor: pointer; }

input,
textarea,
select {
  border: 1px solid white;
  max-width: 100%;
  padding: 8px 10px;
  border-radius: 3px; }
  input:focus,
  textarea:focus,
  select:focus {
    border: 1px solid #e6e6e6; }
  input[disabled], input.disabled,
  textarea[disabled],
  textarea.disabled,
  select[disabled],
  select.disabled {
    cursor: default;
    background-color: #f6f6f6;
    border-color: #b6b6b6; }
  input.input-full,
  textarea.input-full,
  select.input-full {
    width: 100%; }

textarea {
  min-height: 100px; }

/*================ Input element overrides ================*/
input[type="checkbox"],
input[type="radio"] {
  display: inline;
  margin: 0 8px 0 0;
  padding: 0;
  width: auto; }

input[type="checkbox"] {
  -webkit-appearance: checkbox;
  -moz-appearance: checkbox; }

input[type="radio"] {
  -webkit-appearance: radio;
  -moz-appearance: radio; }

input[type="image"] {
  padding-left: 0;
  padding-right: 0; }

select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-position: right center;
  background-image: url("//exederm.com/cdn/shop/t/13/assets/ico-select.svg?v=3540120393686482291765402979");
  background-repeat: no-repeat;
  background-position: right 10px center;
  background-color: transparent;
  padding-right: 28px;
  text-indent: 0.01px;
  text-overflow: '';
  cursor: pointer;
  /*================ Hide the svg arrow in IE9 and below ================*/ }
  .ie9 select, .lt-ie9 select {
    padding-right: 10px;
    background-image: none; }

optgroup {
  font-weight: bold; }

option {
  color: #000;
  background-color: #fff; }

select::-ms-expand {
  display: none; }

/*================ Form labels ================*/
.hidden-label {
  position: absolute;
  height: 0;
  width: 0;
  margin-bottom: 0;
  overflow: hidden;
  clip: rect(1px, 1px, 1px, 1px); }
  .ie9 .hidden-label, .lt-ie9 .hidden-label {
    position: static;
    height: auto;
    width: auto;
    margin-bottom: 2px;
    overflow: visible;
    clip: initial; }

label[for] {
  cursor: pointer; }

/*================ Horizontal Form ================*/
.form-vertical input,
.form-vertical select,
.form-vertical textarea {
  display: block;
  margin-bottom: 10px; }
.form-vertical input[type="radio"],
.form-vertical input[type="checkbox"] {
  display: inline-block; }

/*================ Error styles ================*/
input.error,
select.error,
textarea.error {
  border-color: #d02e2e;
  background-color: #fff6f6;
  color: #d02e2e; }

label.error {
  color: #d02e2e; }

/*================ Input Group ================*/
.input-group {
  position: relative;
  display: table;
  border-collapse: separate; }
  .input-group .input-group-field:first-child,
  .input-group .input-group-btn:first-child,
  .input-group .input-group-btn:first-child > .btn,
  .input-group .input-group-btn:first-child > .btn--secondary,
  .input-group input[type="hidden"]:first-child + .input-group-field,
  .input-group input[type="hidden"]:first-child + .input-group-btn > .btn,
  .input-group input[type="hidden"]:first-child + .input-group-btn > .btn--secondary {
    border-radius: 3px 0 0 3px; }
  .input-group .input-group-field:last-child,
  .input-group .input-group-btn:last-child > .btn,
  .input-group .input-group-btn:last-child > .btn--secondary {
    border-radius: 0 3px 3px 0; }
  .input-group input::-moz-focus-inner {
    border: 0;
    padding: 0;
    margin-top: -1px;
    margin-bottom: -1px; }

.input-group-field,
.input-group-btn {
  display: table-cell;
  vertical-align: middle;
  margin: 0; }

.input-group .btn, .input-group .btn--secondary,
.input-group .input-group-field {
  height: 37px; }

.input-group .input-group-field {
  width: 100%; }

.input-group-btn {
  position: relative;
  white-space: nowrap;
  width: 1%;
  padding: 0; }

/*============================================================================
  #Icons
==============================================================================*/
.icon-fallback-text .icon {
  display: none; }
  .supports-fontface .icon-fallback-text .icon {
    display: inline-block; }

/*============================================================================
  A generic way to visually hide content while
  remaining accessible to screen readers (h5bp.com)
==============================================================================*/
.icon:before {
  display: none; }

.supports-fontface .icon:before {
  display: inline;
  font-family: "icons";
  text-decoration: none;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }

/*================ Icon mapping ================*/
.icon-amazon_payments:before {
  content: "\e800"; }

.icon-american_express:before {
  content: "\41"; }

.icon-arrow-down:before {
  content: "\e607"; }

.icon-bitcoin:before {
  content: "\42"; }

.icon-cart:before {
  content: "\e600"; }

.icon-cirrus:before {
  content: "\43"; }

.icon-dankort:before {
  content: "\64"; }

.icon-diners_club:before {
  content: "\63"; }

.icon-discover:before {
  content: "\44"; }

.icon-facebook:before {
  content: "\66"; }

.icon-fancy:before {
  content: "\46"; }

.icon-google:before {
  content: "\67"; }

.icon-google_wallet:before {
  content: "\47"; }

.icon-grid-view:before {
  content: "\e603"; }

.icon-hamburger:before {
  content: "\e601"; }

.icon-instagram:before {
  content: "\69"; }

.icon-interac:before {
  content: "\49"; }

.icon-jcb:before {
  content: "\4a"; }

.icon-list-view:before {
  content: "\e604"; }

.icon-maestro:before {
  content: "\6d"; }

.icon-master:before {
  content: "\4d"; }

.icon-minus:before {
  content: "\e602"; }

.icon-paypal:before {
  content: "\50"; }

.icon-pinterest:before {
  content: "\70"; }

.icon-plus:before {
  content: "\e605"; }

.icon-rss:before {
  content: "\72"; }

.icon-search:before {
  content: "\73"; }

.icon-stripe:before {
  content: "\53"; }

.icon-tumblr:before {
  content: "\74"; }

.icon-twitter:before {
  content: "\54"; }

.icon-vimeo:before {
  content: "\76"; }

.icon-visa:before {
  content: "\56"; }

.icon-x:before {
  content: "\e606"; }

.icon-youtube:before {
  content: "\79"; }

.payment-icons {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  cursor: default; }
  .payment-icons li {
    margin: 0 7.5px 7.5px;
    color: #bbbbbb;
    cursor: default; }
  .payment-icons .icon {
    font-size: 30px;
    line-height: 30px; }
  .payment-icons .fallback-text {
    text-transform: capitalize; }

.social-icons li {
  margin: 0 15px 15px;
  vertical-align: middle; }
  @media screen and (min-width: 481px) {
    .social-icons li {
      margin-left: 0; } }
  .social-icons li .icon {
    font-size: 30px;
    line-height: 26px; }
  .social-icons li a {
    color: #bbbbbb; }
    .social-icons li a:hover {
      color: #a2a2a2; }

#social-icons {
  text-align: right; }

#social-icons a:hover {
  -webkit-filter: brightness(0.9);
  filter: brightness(0.9); }

@media screen and (max-width: 480px) {
  #social-icons {
    text-align: left; } }
/*============================================================================
  #Pagination
==============================================================================*/
.pagination {
  margin-bottom: 1em;
  text-align: center; }
  .pagination > span {
    display: inline-block;
    line-height: 1; }
  .pagination a {
    display: block; }
  .pagination a,
  .pagination .page.current {
    padding: 8px; }

/*============================================================================
  #Site Header
==============================================================================*/
.site-header {
  padding-top: 30px;
  padding-bottom: 10px;
  -webkit-box-shadow: 0px 7px 14px 1px rgba(33, 77, 60, 0.33);
  box-shadow: 0px 7px 14px 1px rgba(33, 77, 60, 0.33); }
  .site-header .grid--table {
    display: table;
    table-layout: fixed;
    width: 100%; }
    .site-header .grid--table > .grid__item {
      float: none;
      display: table-cell;
      vertical-align: middle; }

.site-header__logo {
  text-align: center;
  margin: 0 auto;
  max-width: 100%; }
  @media screen and (min-width: 769px) {
    .site-header__logo {
      text-align: left; } }
  .site-header__logo a,
  .site-header__logo a:hover,
  .site-header__logo a:focus {
    text-decoration: none; }
  .site-header__logo a, .site-header__logo img {
    display: block; }
  .site-header__logo img {
    margin: 0 auto; }

.site-header__logo-link {
  max-width: 450px;
  margin: 0 auto; }

.site-header__cart-toggle {
  display: inline-block;
  text-decoration: none; }

.site-header__search {
  display: inline-block;
  max-width: 400px;
  margin-top: 15px;
  width: 100%; }

.search-bar {
  max-width: 100%; }
  @media screen and (max-width: 768px) {
    .search-bar {
      margin-left: auto;
      margin-right: auto; } }

@media screen and (min-width: 855px) {
  .wrapper-no-adjust {
    *zoom: 1;
    max-width: 1520px;
    margin: 0 auto;
    padding: 0 75px !important; }

  .wrapper.main-content.basic-page {
    max-width: 1320px; } }
/*@media screen and (min-width:855px) and (max-width:1200px) {
.wrapper.main-content.basic-page {
	margin: 0 30px;
	}
}*/
/*============================================================================
  #Top Links on Desktop Above Site Nav
==============================================================================*/
.cart-header-links {
  font-family: "Encode Sans";
  color: #3e9a76;
  font-size: 12px;
  line-height: 15px;
  font-weight: 600;
  text-decoration: none; }

#CartCount {
  background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/qty-bg.png?v=1610930407");
  background-repeat: no-repeat;
  padding: 1px 16px 3px 8px;
  margin: 10px 0 0 8px;
  font-weight: 600;
  color: #535353; }

.qty {
  font-size: 13px;
  font-weight: 600;
  color: #535353; }

.cart-header-divider {
  display: inline-block;
  font-weight: 400;
  font-size: 16px;
  line-height: 14px;
  color: #c4c9bd; }

.fa-user, .fa-shopping-cart {
  font-size: 110% !important; }

/*============================================================================
  #Site Nav and Dropdowns
==============================================================================*/
.site-nav, .site-nav--mobile {
  font-size: 1.42857em;
  cursor: default;
  margin: 0 0 0 -15px; }
  .site-nav li, .site-nav--mobile li {
    margin: 0;
    display: block;
    border: 0 none;
    font-size: 14px; }
  .site-nav > li, .site-nav--mobile > li {
    position: relative;
    display: inline-block;
    text-transform: lowercase; }
    .site-nav > li a, .site-nav--mobile > li a {
      font-weight: 600;
      color: #000000;
      transition: all .2s ease 0s; }
    .site-nav > li a:hover, .site-nav--mobile > li a:hover,
    .site-nav > li a:focus,
    .site-nav--mobile > li a:focus {
      transition: all .2s ease 0s; }

/* Extra code for "coupon bar" below the header */
#couponbar {
  z-index: -10;
  position: relative;
  text-align: center;
  margin: 0px;
  padding: 13px 15px;
  left: 0px;
  height: auto;
  width: 100%;
  box-sizing: border-box;
  border: medium none;
  background-color: #3e9a76;
  color: #edf6dc;
  font-size: 14px;
  font-weight: 500;
  line-height: 18px;
  font-family: "Open Sans", sans-serif;
  height: 45px; }

a.couponbarlink {
  transition: all .3s ease 0s;
  color: inherit;
  text-decoration: none; }

a.couponbarlink:hover {
  transition: all .3s ease 0s;
  -webkit-filter: brightness(0.3);
  filter: brightness(0.9); }

@media screen and (min-width: 375px) and (max-width: 480px) {
  #couponbar {
    font-size: 12px; } }
@media screen and (max-width: 374px) {
  #couponbar {
    font-size: 11px; } }
/*================ Home to hamburger and cart that toggle drawers ================*/
.text-right .site-nav--mobile {
  margin: 0 -15px 0 0; }

/*main links- also used on desktop version*/
.site-nav__link {
  display: block;
  text-decoration: none;
  padding: 10px;
  white-space: nowrap;
  /* color: #56a28b;
   font-size:20px;*/
  font-size: 15px;
  text-transform: none;
  font-weight: 600;
  color: #000000;
  letter-spacing: .01em; }
  .site-nav__link:hover, .site-nav__link:active, .site-nav__link:focus {
    color: #3E9A76; }
  .site-nav__link .icon-hamburger {
    color: #3E9A76; }
  .site-nav__link .fa-shopping-cart {
    color: #3E9A76; }
  .site-nav__link .icon-arrow-down {
    position: relative;
    top: -2px;
    font-size: 10px;
    padding-left: 7.5px; }
  .site-nav--active > .site-nav__link {
    font-weight: bold; }
  .site-nav--mobile .site-nav__link {
    display: inline-block; }
  @media screen and (max-width: 1160px) {
    .site-nav__link {
      padding: 20px 10px;
      font-size: 18px; } }
  @media screen and (max-width: 950px) {
    .site-nav__link {
      padding: 20px 2px;
      font-size: 16px; } }
  @media screen and (max-width: 768px) {
    .site-nav__link {
      padding: 20px 2px;
      font-size: 26px; } }

/*================ Dropdowns ================*/
.site-nav__dropdown {
  opacity: 0;
  pointer-events: none;
  position: absolute;
  left: 0;
  margin: 0;
  z-index: 5; }
  .supports-no-touch .site-nav--has-dropdown:hover .site-nav__dropdown, .site-nav--has-dropdown.nav-hover .site-nav__dropdown, .nav-focus + .site-nav__dropdown, .supports-no-touch .site-nav--has-dropdown:focus .site-nav__dropdown, .supports-no-touch .site-nav--has-dropdown[aria-expanded=true] > .site-nav__dropdown {
    opacity: 1;
    pointer-events: auto; }
  .site-nav__dropdown .site-nav__link {
    font-size: 14px;
    padding: 8px 20px;
    text-align: left;
    background: rgba(255, 255, 255, 0.7);
    color: #535353; }
  .site-nav__dropdown a {
    background-color: #f2f2f2; }
    .site-nav__dropdown a:hover, .site-nav__dropdown a:focus {
      color: #F7F6EA;
      background: #3E9A76; }

.site-nav__dropdown a:active, .site-nav__dropdown a:focus {
  font-weight: bold !important; }

.site-nav__dropdown {
  padding: 10px 0;
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.3);
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.3);
  -moz-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.3); }

.site-nav li:nth-of-type(3) .site-nav__dropdown:after, .site-nav--mobile li:nth-of-type(3) .site-nav__dropdown:after {
  content: ' ';
  display: table;
  clear: both; }
.site-nav li:nth-of-type(3) .site-nav__dropdown li:nth-of-type(1), .site-nav--mobile li:nth-of-type(3) .site-nav__dropdown li:nth-of-type(1), .site-nav li:nth-of-type(3) .site-nav__dropdown li:nth-of-type(8), .site-nav--mobile li:nth-of-type(3) .site-nav__dropdown li:nth-of-type(8) {
  border-right: 0; }
  .site-nav li:nth-of-type(3) .site-nav__dropdown li:nth-of-type(1) a, .site-nav--mobile li:nth-of-type(3) .site-nav__dropdown li:nth-of-type(1) a, .site-nav li:nth-of-type(3) .site-nav__dropdown li:nth-of-type(8) a, .site-nav--mobile li:nth-of-type(3) .site-nav__dropdown li:nth-of-type(8) a {
    font-weight: bold;
    font-size: 18px;
    padding: 5px 20px; }

/*================ Search bar in header ================*/
.nav-search {
  position: relative;
  padding: 10px 0; }
  @media screen and (max-width: 768px) {
    .nav-search {
      padding: 0 0 15px;
      margin: 0 auto;
      text-align: center; } }

/*============================================================================
  #Mobile Nav
  - List of items inside the mobile drawer
==============================================================================*/
.mobile-nav {
  margin: -15px -15px 0 -15px; }
  .mobile-nav li {
    margin-bottom: 0; }

.icon-minus:hover, .icon-plus:hover {
  color: #000;
  background: #3E9A76; }

.mobile-nav__search {
  padding: 15px; }
  .mobile-nav__search .search-bar {
    margin-bottom: 0; }

.mobile-nav__item {
  position: relative;
  display: block; }
  .mobile-nav > .mobile-nav__item {
    background-color: #ffffff; }
  .mobile-nav__item:after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 15px;
    right: 15px;
    border-bottom: 1px solid #e9e9e9; }
  .mobile-nav > .mobile-nav__item:last-child:after {
    display: none; }

.mobile-nav__item a {
  display: block;
  color: #535353; }

.mobile-nav__toggle button, .mobile-nav__toggle .about-more-info .btn, .about-more-info .mobile-nav__toggle .btn, .mobile-nav__toggle .about-more-info .btn--secondary, .about-more-info .mobile-nav__toggle .btn--secondary {
  color: #000; }

.mobile-nav__item a {
  color: #535353; }

.mobile-nav__item a:hover {
  color: #ffffff;
  background-color: #3E9A76; }

.mobile-nav__item a,
.mobile-nav__toggle button,
.mobile-nav__toggle .about-more-info .btn,
.about-more-info .mobile-nav__toggle .btn,
.mobile-nav__toggle .about-more-info .btn--secondary,
.about-more-info .mobile-nav__toggle .btn--secondary {
  padding: 11px 15px;
  text-decoration: none; }
  .mobile-nav__item a:hover, .mobile-nav__item a:active, .mobile-nav__item a:focus,
  .mobile-nav__toggle button:hover,
  .mobile-nav__toggle .about-more-info .btn:hover,
  .about-more-info .mobile-nav__toggle .btn:hover,
  .mobile-nav__toggle .about-more-info .btn--secondary:hover,
  .about-more-info .mobile-nav__toggle .btn--secondary:hover,
  .mobile-nav__toggle button:active,
  .mobile-nav__toggle .about-more-info .btn:active,
  .about-more-info .mobile-nav__toggle .btn:active,
  .mobile-nav__toggle .about-more-info .btn--secondary:active,
  .about-more-info .mobile-nav__toggle .btn--secondary:active,
  .mobile-nav__toggle button:focus,
  .mobile-nav__toggle .about-more-info .btn:focus,
  .about-more-info .mobile-nav__toggle .btn:focus,
  .mobile-nav__toggle .about-more-info .btn--secondary:focus,
  .about-more-info .mobile-nav__toggle .btn--secondary:focus {
    color: #f7f6ea;
    background-color: #3E9A76; }
  .mobile-nav__item a:active, .mobile-nav__item a:focus,
  .mobile-nav__toggle button:active,
  .mobile-nav__toggle .about-more-info .btn:active,
  .about-more-info .mobile-nav__toggle .btn:active,
  .mobile-nav__toggle .about-more-info .btn--secondary:active,
  .about-more-info .mobile-nav__toggle .btn--secondary:active,
  .mobile-nav__toggle button:focus,
  .mobile-nav__toggle .about-more-info .btn:focus,
  .about-more-info .mobile-nav__toggle .btn:focus,
  .mobile-nav__toggle .about-more-info .btn--secondary:focus,
  .about-more-info .mobile-nav__toggle .btn--secondary:focus {
    background-color: #3E9A76; }

.mobile-nav__toggle button, .mobile-nav__toggle .about-more-info .btn, .about-more-info .mobile-nav__toggle .btn, .mobile-nav__toggle .about-more-info .btn--secondary, .about-more-info .mobile-nav__toggle .btn--secondary {
  background: transparent; }

.mobile-nav__item--active {
  font-weight: bold; }

.mobile-nav__has-sublist {
  display: table;
  width: 100%; }
  .mobile-nav__has-sublist .mobile-nav__link {
    display: table-cell;
    vertical-align: middle;
    width: 100%;
    border: 0 none; }

.mobile-nav__toggle {
  display: table-cell;
  vertical-align: middle;
  width: 1%; }

.mobile-nav--expanded .mobile-nav__toggle-open {
  display: none; }

.mobile-nav__toggle-close {
  display: none; }
  .mobile-nav--expanded .mobile-nav__toggle-close {
    display: block; }

.mobile-nav li:nth-of-type(3) .mobile-nav__sublist:after {
  content: ' ';
  display: table;
  clear: both; }
.mobile-nav li:nth-of-type(3) .mobile-nav__sublist li:nth-of-type(1), .mobile-nav li:nth-of-type(3) .mobile-nav__sublist li:nth-of-type(6) {
  border-right: 0; }
  .mobile-nav li:nth-of-type(3) .mobile-nav__sublist li:nth-of-type(1) a, .mobile-nav li:nth-of-type(3) .mobile-nav__sublist li:nth-of-type(6) a {
    font-weight: bold;
    padding: 6px 30px 6px 15px; }

.mobile-nav__sublist {
  margin: 0;
  max-height: 0;
  visibility: hidden;
  overflow: hidden;
  transition: all 300ms cubic-bezier(0.57, 0.06, 0.05, 0.95);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden; }
  .mobile-nav__sublist .mobile-nav__item {
    background-color: #f4fafc; }
  .mobile-nav--expanded + .mobile-nav__sublist {
    visibility: visible;
    max-height: 700px;
    transition: all 700ms cubic-bezier(0.57, 0.06, 0.05, 0.95); }
  .mobile-nav__sublist .mobile-nav__item:after {
    top: 0;
    bottom: auto;
    border-bottom: 0px solid #e3e3e3; }
  .mobile-nav__sublist .mobile-nav__link {
    padding-left: 30px;
    font-weight: normal;
    color: #535353; }

/*============================================================================
  #Drawers
==============================================================================*/
.js-drawer-open {
  overflow: hidden;
  height: 100%; }

.drawer {
  -webkit-transform: translateZ(0);
  will-change: transform;
  display: none;
  position: fixed;
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  top: 0;
  bottom: 0;
  padding: 0 15px 15px;
  max-width: 95%;
  z-index: 10;
  color: white;
  background-color: #3e9a76;
  transition: all 0.4s cubic-bezier(0.46, 0.01, 0.32, 1); }
  .drawer a {
    color: #000;
    font-size: 14px;
    font-weight: 400;
    text-transform: capitalize; }
    .drawer a:hover, .drawer a:focus {
      opacity: 1; }
  .drawer input,
  .drawer textarea {
    border-color: #3e9a76;
    background-color: white; }

.drawer--left {
  width: 300px;
  left: -300px;
  border-right: 1px solid #3e9a76; }
  .js-drawer-open-left .drawer--left {
    display: block;
    -ms-transform: translateX(300px);
    -webkit-transform: translateX(300px);
    transform: translateX(300px); }
    .lt-ie9 .js-drawer-open-left .drawer--left {
      left: 0; }

.drawer--right {
  width: 300px;
  right: -300px;
  border-left: 1px solid #3e9a76; }
  .js-drawer-open-right .drawer--right {
    display: block;
    -ms-transform: translateX(-300px);
    -webkit-transform: translateX(-300px);
    transform: translateX(-300px); }
    .lt-ie9 .js-drawer-open-right .drawer--right {
      right: 0; }

#PageContainer {
  overflow: hidden; }

.is-moved-by-drawer {
  -webkit-transform: translateZ(0);
  will-change: transform;
  transition: all 0.4s cubic-bezier(0.46, 0.01, 0.32, 1); }
  .js-drawer-open-left .is-moved-by-drawer {
    -ms-transform: translateX(300px);
    -webkit-transform: translateX(300px);
    transform: translateX(300px); }
  .js-drawer-open-right .is-moved-by-drawer {
    -ms-transform: translateX(-300px);
    -webkit-transform: translateX(-300px);
    transform: translateX(-300px); }

/*Updated Nav Drawer backround*/
#NavDrawer {
  color: #3e9a76;
  background-color: #ffffff;
  box-shadow: 5px 1px 6px 0px rgba(0, 0, 0, 0.3);
  -webkit-box-shadow: 5px 1px 6px 0px rgba(0, 0, 0, 0.3);
  -moz-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.3);
  border: none; }

.drawer__header {
  display: table;
  height: 70px;
  width: 100%;
  margin-bottom: 15px;
  /*border-bottom: 1px solid $colorDrawerBorder;*/ }

.drawer__title,
.drawer__close {
  display: table-cell;
  vertical-align: middle; }

.drawer__title {
  width: 100%;
  color: transparent; }

/*updated "x" icon button size*/
#NavDrawer .icon.icon-x {
  font-size: 36px;
  color: #3E9A76; }

.drawer__close {
  width: 1%;
  text-align: center;
  font-size: 1.28571em; }

.drawer__close button, .drawer__close .about-more-info .btn, .about-more-info .drawer__close .btn, .drawer__close .about-more-info .btn--secondary, .about-more-info .drawer__close .btn--secondary {
  position: relative;
  right: -20px;
  height: 100%;
  padding: 0 20px;
  color: inherit; }
  .drawer__close button:active, .drawer__close .about-more-info .btn:active, .about-more-info .drawer__close .btn:active, .drawer__close .about-more-info .btn--secondary:active, .about-more-info .drawer__close .btn--secondary:active, .drawer__close button:focus, .drawer__close .about-more-info .btn:focus, .about-more-info .drawer__close .btn:focus, .drawer__close .about-more-info .btn--secondary:focus, .about-more-info .drawer__close .btn--secondary:focus {
    background-color: #ffffff; }

/*============================================================================
  #Product and Collection Grids
==============================================================================*/
.grid__image {
  display: block;
  margin: 0 auto 15px; }
  .grid__image img {
    display: block;
    margin: 4px auto 12px auto; }

#collection-of-four {
  display: block;
  position: relative;
  margin: 0 auto; }

#product-grid-box {
  max-width: 100%;
  width: 23%;
  border: 1px solid #eee;
  height: 420px;
  margin: 0 12px;
  padding: 2%;
  box-shadow: 0px 2px 9px rgba(0, 0, 0, 0.19);
  text-align: center; }

/*--Yotpo--*/
#yotpo-ratings-product-grid .standalone-bottomline {
  float: none;
  margin: 7% 18%;
  display: flex; }

.yotpo a.text-m {
  display: inline-block;
  font-weight: 500; }

.yotpo .text-m {
  font-size: 13px;
  font-weight: 500;
  margin: auto auto auto 5px; }

@media screen and (min-width: 1280px) and (max-width: 1320px) {
  #yotpo-ratings-product-grid .standalone-bottomline {
    float: none;
    margin: 7% 17%;
    display: flex; } }
@media screen and (min-width: 1245px) and (max-width: 1280px) {
  #yotpo-ratings-product-grid .standalone-bottomline {
    float: none;
    margin: 7% 12%;
    display: flex; } }
@media screen and (min-width: 1235px) and (max-width: 1244px) {
  #yotpo-ratings-product-grid .standalone-bottomline {
    float: none;
    margin: 7% 14%;
    display: flex; } }
@media screen and (min-width: 1200px) and (max-width: 1234px) {
  #yotpo-ratings-product-grid .standalone-bottomline {
    float: none;
    margin: 7% 13%;
    display: flex; } }
@media screen and (min-width: 1199px) and (max-width: 1229px) {
  #product-grid-box {
    width: 22%; } }
@media screen and (min-width: 1079px) and (max-width: 1199px) {
  #yotpo-ratings-product-grid .standalone-bottomline {
    float: none;
    margin: 7% 25%;
    display: flex; } }
@media screen and (min-width: 980px) and (max-width: 1078px) {
  #yotpo-ratings-product-grid .standalone-bottomline {
    float: none;
    margin: 7% 26%;
    display: flex; } }
@media screen and (min-width: 830px) and (max-width: 979px) {
  #yotpo-ratings-product-grid .standalone-bottomline {
    float: none;
    margin: 7% 24%;
    display: flex; } }
@media screen and (min-width: 826px) and (max-width: 829px) {
  #yotpo-ratings-product-grid .standalone-bottomline {
    float: none;
    margin: 7% 22%;
    display: flex; } }
@media screen and (min-width: 769px) and (max-width: 825px) {
  #yotpo-ratings-product-grid .standalone-bottomline {
    float: none;
    margin: 7% 23%;
    display: flex; } }
@media screen and (min-width: 690px) and (max-width: 768px) {
  #yotpo-ratings-product-grid .standalone-bottomline {
    float: none;
    margin: 7% 20%;
    display: flex; } }
@media screen and (min-width: 640px) and (max-width: 689px) {
  #yotpo-ratings-product-grid .standalone-bottomline {
    float: none;
    margin: 6.5% 18%;
    display: flex; } }
@media screen and (min-width: 500px) and (max-width: 639px) {
  #yotpo-ratings-product-grid .standalone-bottomline {
    margin: 2.5% 30%;
    float: none;
    display: flex; } }
@media screen and (min-width: 443px) and (max-width: 499px) {
  #yotpo-ratings-product-grid .standalone-bottomline {
    margin: 2.5% 28%;
    float: none;
    display: flex; } }
@media screen and (min-width: 415px) and (max-width: 442px) {
  #yotpo-ratings-product-grid .standalone-bottomline {
    margin: 3% 28%;
    float: none;
    display: flex; } }
@media screen and (min-width: 408px) and (max-width: 414px) {
  #yotpo-ratings-product-grid .standalone-bottomline {
    margin: 3% 25%;
    float: none;
    display: flex; } }
@media screen and (max-width: 407px) {
  #yotpo-ratings-product-grid .standalone-bottomline {
    margin: 3% 23%;
    float: none;
    display: flex; } }
@media screen and (min-width: 1200px) and (max-width: 1280px) {
  #product-grid-box {
    max-width: 22%;
    width: 320px; } }
@media screen and (min-width: 1025px) and (max-width: 1199px) {
  #product-grid-box {
    max-width: 50%;
    width: 360px;
    margin: 0 5%; } }
@media screen and (min-width: 960px) and (max-width: 1024px) {
  #product-grid-box {
    max-width: 50%;
    width: 370px;
    margin: 0 5%; } }
@media screen and (min-width: 830px) and (max-width: 960px) {
  #product-grid-box {
    max-width: 47.5%;
    width: 360px;
    margin: 0 2%; } }
@media screen and (min-width: 769px) and (max-width: 830px) {
  #product-grid-box {
    max-width: 47%;
    width: 320px;
    margin: 0 3%; } }
@media screen and (max-width: 768px) {
  #product-grid-box {
    max-width: 43.7%;
    width: 320px;
    margin: 0 3% 0 3.3%; }

  .collection-name {
    margin-top: 60px; }

  #ProductThumbs {
    max-width: 420px;
    margin: auto; } }
@media screen and (min-width: 640px) and (max-width: 767px) {
  #product-grid-box {
    max-width: 45%;
    width: 330px;
    margin: 0 2%; } }
@media screen and (max-width: 639px) {
  #product-grid-box {
    max-width: 100%;
    width: 96%;
    margin: 0 auto 0 2%;
    padding: 4% 2% 0 2%; } }
/* Rollover box shadow for product thumbnails/product grid boxes throughout site*/
#product-grid-box:hover {
  -webkit-box-shadow: 0px 2px 5px 2px rgba(0, 0, 0, 0.33);
  box-shadow: 0px 2px 5px 2px rgba(0, 0, 0, 0.33);
  transition: all .2s ease 0s; }

/*Some formatting for the YotPo stars in the product grid boxes*/
#yotpo-ratings-product-grid {
  max-height: 30px;
  height: 30px; }

.prod-price {
  font-size: 18px;
  line-height: 26px;
  font-weight: 600;
  display: block;
  margin-top: 10px; }

.grid__image {
  display: block;
  margin: 4px 0; }

.add-to-cart-link, #add {
  display: inline-block;
  padding: 8px 10px;
  margin: 0;
  line-height: 1.42;
  font-size: 15px;
  color: #3e9a76 !important;
  font-family: "Open Sans";
  font-size: 16px;
  font-weight: 700;
  text-decoration: underline;
  border: 0px solid white;
  background-color: transparent;
  max-width: 100%;
  border-radius: 0;
  border: 0; }

.add-to-cart-link:hover, #add:hover,
.add-to-cart-link:focus, #add:focus {
  color: #64c19c !important;
  background-color: transparent; }

.rte > div .collection-name {
  margin-bottom: 26px; }

.collection-name {
  font-family: "Encode Sans";
  font-size: 22px;
  line-height: 28px;
  text-align: center;
  margin-bottom: 26px;
  font-weight: 600;
  width: 100%;
  border-bottom: 1px solid #e4e4e4;
  line-height: 0.1em; }

.collection-name span {
  background: #fff;
  padding: 0 10px; }

.collection-name2, h1.collection-name2, .collection-name2.h1, .collection-name2.h1 {
  font-family: "Encode Sans";
  font-size: 36px;
  line-height: 45px;
  text-align: center;
  margin-bottom: 12px;
  font-weight: 400;
  width: 100%;
  border-bottom: 1px solid #bbb;
  line-height: 0.1em;
  margin: 10px 0 30px; }

.collection-name2 span, h1.collection-name2 span, .collection-name2.h1 span, .collection-name2.h1 span {
  background: #fff;
  padding: 0 10px; }

.prod-name, .prod-name a, .prod-name .h6 {
  font-size: 20px;
  font-weight: 400; }

/*============================================================================
  #Collection Filters
==============================================================================*/
.filter--active {
  font-weight: bold; }

/*============================================================================
  #Breadcrumbs
==============================================================================*/
.breadcrumb {
  background-color: #eef4f7;
  padding: 15px 0;
  width: 100%;
  margin-bottom: 30px;
  display: none;
  /*updated*/ }
  .breadcrumb a,
  .breadcrumb span {
    color: #3e9a76;
    display: none;
    margin-right: 7px; }
    .breadcrumb a:first-child,
    .breadcrumb span:first-child {
      padding-left: 0; }

.breadcrumb-list {
  list-style-type: none;
  margin: 0; }
  .breadcrumb-list li {
    display: none;
    margin-bottom: 0; }

/*============================================================================
  #Product Page
==============================================================================*/
.product-single__variants {
  display: none; }
  .no-js .product-single__variants {
    display: block; }

.product-single__photos {
  margin-bottom: 30px; }

.product-single__photos a, .product-single__photos img,
.product-single__thumbnails a,
.product-single__thumbnails img {
  display: block;
  margin: 0 auto; }
.product-single__photos li,
.product-single__thumbnails li {
  margin-bottom: 30px; }

.product-single__photos img {
  border: 0px solid #979797; }

.product-single__thumbnail {
  border: .02em solid #979797;
  padding: 2px;
  margin: 0 0 0 10px; }

.grid__item .product-single__thumbnail {
  min-height: 50px;
  max-width: 90px;
  display: block;
  margin: 0 0 0 10px; }

/*Awards Metafields NEA award text*/
p.metafields4, .metafields-nea, p.metafields-nea, .metafields-nea p, .metafields-nea {
  font-size: 22px;
  font-weight: 400;
  line-height: 28px;
  letter-spacing: -.02em; }

/* Style the tab */
.custom-tab, .pt {
  overflow: hidden;
  background-color: #F4FAFC;
  margin-bottom: 15px; }

@media screen and (max-width: 768px) {
  .custom-tab, .pt {
    margin-bottom: -5px; }

  .col-768-max .span_2_of_2-768-max .award2-hero-container {
    padding-top: 0; }

  .award2-hero-container {
    padding-top: 0;
    margin-top: 0; } }
@media screen and (max-width: 481px) {
  .custom-tab button, .custom-tab .about-more-info .btn, .about-more-info .custom-tab .btn, .custom-tab .about-more-info .btn--secondary, .about-more-info .custom-tab .btn--secondary {
    width: 100%;
    text-align: left;
    background-image: none; }

  .custom-tab button.active, .custom-tab .about-more-info .active.btn, .about-more-info .custom-tab .active.btn, .custom-tab .about-more-info .active.btn--secondary, .about-more-info .custom-tab .active.btn--secondary {
    background-color: #deeef3; } }
.product-tabs {
  max-width: 1200px;
  text-align: left;
  margin: 0 auto; }

/* Style the buttons that are used to open the tab content */
.custom-tab button, .custom-tab .about-more-info .btn, .about-more-info .custom-tab .btn, .custom-tab .about-more-info .btn--secondary, .about-more-info .custom-tab .btn--secondary {
  background-color: inherit;
  float: left;
  border: none;
  outline: none;
  cursor: pointer;
  padding: 32px 16px 14px 16px;
  font-size: 20px;
  font-weight: 600;
  color: #535353;
  transition: 0.3s;
  background-image: url(https://cdn.shopify.com/s/files/1/0524/5622/7007/files/grayline.png?v=1613635424);
  background-position: right;
  background-repeat: no-repeat;
  background-size: 2px; }

.custom-tab button:last-child, .custom-tab .about-more-info .btn:last-child, .about-more-info .custom-tab .btn:last-child, .custom-tab .about-more-info .btn--secondary:last-child, .about-more-info .custom-tab .btn--secondary:last-child {
  background: none; }

/* Change background color of buttons on hover */
.custom-tab button:hover, .custom-tab .about-more-info .btn:hover, .about-more-info .custom-tab .btn:hover, .custom-tab .about-more-info .btn--secondary:hover, .about-more-info .custom-tab .btn--secondary:hover {
  font-weight: 600;
  text-decoration: underline; }

/* Create an active/current tablink class */
.custom-tab button.active, .custom-tab .about-more-info .active.btn, .about-more-info .custom-tab .active.btn, .custom-tab .about-more-info .active.btn--secondary, .about-more-info .custom-tab .active.btn--secondary {
  text-decoration: underline;
  font-weight: 600;
  color: #3E9A76; }

/* Style the tab content */
.custom-tab-content {
  display: none;
  padding: 6px 12px;
  border: 0px solid #ccc;
  border-top: none;
  background-color: #F4FAFC; }

/*Tab metafield copy*/
.metafields3-product-tabs li {
  background-image: url(https://cdn.shopify.com/s/files/1/0524/5622/7007/files/checkmark.png?v=1613607256);
  background-repeat: no-repeat;
  margin: 5px 0;
  padding: 4px 0 4px 30px;
  background-size: 16px;
  list-style-type: none;
  background-position-y: 3px; }

p.metafields3-product-tabs {
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  letter-spacing: -.02em; }

ul.metafields3-product-tabs, .metafields3-product-tabs li {
  font-size: 16px;
  font-weight: 400;
  line-height: 24px; }

ul.metafields3-product-tabs {
  margin: 30px 0 5px 0; }

/*@media screen and (max-width:480px) {
 ul.metafields3, .metafields3 li, .custom-tab-content p.metafields3, .custom-tab-content .metafields3 ul li {
     font-size: 16px;
     font-weight: 400;
     line-height: 24px;
	}

}*/
/*============================================================================
  #Notes and Form Feedback
==============================================================================*/
.note,
.errors {
  border-radius: 3px;
  padding: 6px 12px;
  margin-bottom: 15px;
  border: 1px solid transparent;
  font-size: 0.9em;
  text-align: left; }
  .note ul,
  .note ol,
  .errors ul,
  .errors ol {
    margin-top: 0;
    margin-bottom: 0; }
  .note li:last-child,
  .errors li:last-child {
    margin-bottom: 0; }
  .note p,
  .errors p {
    margin-bottom: 0; }

.note {
  border-color: white; }

.errors ul {
  list-style: disc outside;
  margin-left: 20px; }

.form-success {
  color: #56ad6a;
  background-color: #ecfef0;
  border-color: #56ad6a; }
  .form-success a {
    color: #56ad6a;
    text-decoration: underline; }
    .form-success a:hover {
      text-decoration: none; }

.form-error,
.errors {
  color: #d02e2e;
  background-color: #fff6f6;
  border-color: #d02e2e; }
  .form-error a,
  .errors a {
    color: #d02e2e;
    text-decoration: underline; }
    .form-error a:hover,
    .errors a:hover {
      text-decoration: none; }

/*============================================================================
  #Cart Page
==============================================================================*/
.cart__row {
  position: relative;
  margin-top: 30px;
  padding-top: 30px;
  border-top: 1px solid white; }
  .cart__row:first-child {
    margin-top: 0; }
  .cart__row:first-child {
    padding-top: 0; }
  .cart__row .js-qty, .cart__row .ajaxcart__qty {
    margin: 0 auto; }

.cart-table th {
  font-weight: normal; }
.cart-table td,
.cart-table th {
  padding: 30px 15px;
  border: none; }

@media screen and (min-width: 769px) {
  .cart__row--table-large {
    display: table;
    table-layout: fixed;
    width: 100%; }
    .cart__row--table-large .grid__item {
      display: table-cell;
      vertical-align: middle;
      float: none; } }
.cart__image {
  display: block; }
  .cart__image img {
    display: block;
    max-width: 100%; }

.cart__subtotal {
  margin: 0 0 0 10px;
  display: inline; }

.cart__mini-labels {
  display: block;
  margin: 10px 0;
  font-size: 0.85714em; }
  @media screen and (min-width: 769px) {
    .cart__mini-labels {
      display: none; } }

.cart__remove {
  display: block; }

.additional_checkout_buttons {
  margin-top: 30px;
  text-align: center; }

/*============================================================================
  #Ajax Cart Styles (conditionally loaded)
==============================================================================*/
.ajaxcart__inner {
  margin-bottom: 30px; }

.ajaxcart__row > .grid, .ajaxcart__row > .grid--rev, .ajaxcart__row > .grid--full {
  margin-left: -15px; }
  .ajaxcart__row > .grid > .grid__item, .ajaxcart__row > .grid--rev > .grid__item, .ajaxcart__row > .grid--full > .grid__item {
    padding-left: 15px; }

.ajaxcart__product {
  position: relative;
  max-height: 500px; }
  .ajaxcart__product.is-removed {
    max-height: 0;
    overflow: hidden;
    visibility: hidden;
    transition: all 450ms cubic-bezier(0.57, 0.06, 0.05, 0.95);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden; }

.ajaxcart__row {
  padding-bottom: 15px;
  margin-bottom: 15px;
  border-bottom: 1px solid #3e9a76; }

.ajaxcart__product-image {
  display: block;
  overflow: hidden;
  margin-bottom: 15px; }
  .ajaxcart__product-image img {
    display: block;
    margin: 0 auto;
    max-width: 100%; }

.ajaxcart__product-name,
.ajaxcart__product-meta {
  display: block; }

.ajaxcart__product-name + .ajaxcart__product-meta {
  padding-top: 6px; }

/*================ Quantity Selectors ================*/
.js-qty, .ajaxcart__qty {
  position: relative;
  margin-bottom: 1em;
  max-width: 100px;
  min-width: 75px;
  overflow: visible;
  border: 1px solid #bbb;
  margin: 8px 0;
  padding: 1px; }
  .js-qty input, .ajaxcart__qty input {
    display: block;
    background: none;
    text-align: center;
    width: 100%;
    padding: 5px 25px;
    margin: 0; }

.js-qty__adjust, .ajaxcart__qty-adjust {
  cursor: pointer;
  position: absolute;
  display: block;
  top: 0;
  bottom: 0;
  border: 0 none;
  padding: 0 8px;
  background: none;
  text-align: center;
  overflow: hidden;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none; }
  .js-qty__adjust:hover, .ajaxcart__qty-adjust:hover, .js-qty__adjust:focus, .ajaxcart__qty-adjust:focus {
    color: #3e9a76; }

.js-qty__adjust--plus, .ajaxcart__qty--plus {
  right: 0;
  border-left: 1px solid #bbb; }

.js-qty__adjust--minus, .ajaxcart__qty--minus {
  left: 0;
  border-right: 1px solid #bbb; }

/*================ Quantity Selectors in Ajax Cart ================*/
.ajaxcart__qty {
  margin: 0; }
  .is-loading .ajaxcart__qty {
    opacity: 0.5;
    transition: none; }

.ajaxcart__qty-num {
  border-color: #3e9a76;
  color: white; }

.ajaxcart__qty-adjust {
  color: white; }

.ajaxcart__qty--plus {
  border-color: #3e9a76; }

.ajaxcart__qty--minus {
  border-color: #3e9a76; }

/*============================================================================
  #Exederm helper & general styles
==============================================================================*/
.hSpacer {
  display: block;
  width: 100%; }
  .hSpacer.twenty-five {
    height: 25px; }
  .hSpacer.fifteen {
    height: 15px; }
  .hSpacer.ten {
    height: 10px; }
  .hSpacer.forty {
    height: 40px; }
  .hSpacer.sixty {
    height: 60px; }

.check-list {
  list-style: none;
  padding: 0;
  margin: 0;
  float: left;
  font-weight: 400; }
  .check-list li {
    background-image: url(/cdn/shop/files/sprite_copy.png?3756116678429145426);
    background-repeat: no-repeat;
    text-transform: uppercase;
    color: #898989;
    font-size: 16px;
    margin: 5px 0;
    padding: 4px 0 4px 30px; }
    .check-list li:last-of-type {
      margin-bottom: 0; }
  .check-list.first {
    margin-right: 50px; }

@media screen and (max-width: 768px) {
  .med--center {
    text-align: center !important; } }

@media screen and (max-width: 480px) {
  .small--center {
    text-align: center !important; } }

@media screen and (max-width: 480px) {
  .small-no-left {
    padding-left: 0; } }

/*============================================================================
  #Exederm header styles
==============================================================================*/
#green-stripe {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 12px;
  background-color: #ffffff;
  /*#5fa787;*/
  display: block; }

/*============================================================================
  #Exederm footer styles
==============================================================================*/
#footer-container {
  margin: 0 auto;
  background-color: #F6F5F4;
  /*padding: 0 18%;
  */
  padding: 12px 0; }

.footer-main-block {
  background-color: #f6f5f4;
  width: 100%;
  margin-top: 30px; }

.footer-main-block .border-right {
  border-right: none;
  /*1px solid #cbe4c7;
  */
  padding-right: 12px; }

.footer-main-block .grid__item a {
  font-family: "Open Sans", sans-serif;
  display: block;
  font-size: 12px;
  color: #535353;
  font-weight: 400;
  line-height: 30px;
  text-decoration: none; }

.footer-main-block .grid__item a:hover {
  text-decoration: underline;
  color: #3E9A76; }

.footer-main-block .single a {
  font-family: "Encode Sans", sans-serif;
  display: block;
  font-size: 14px;
  font-weight: 700;
  line-height: 38px; }

.footer-main-block .grid__item ul li:first-of-type a {
  font-family: "Encode Sans", sans-serif;
  font-size: 14px;
  font-weight: 700;
  line-height: 30px; }

.footer-main-block .push-down {
  padding-top: 32px; }

.footer-main-block .push-down li:first-of-type a {
  font-size: 12px !important;
  font-weight: 400 !important;
  line-height: 30px; }

.footer-main-block .all-bold a {
  font-size: 16px;
  font-weight: 700; }

.footer-disappear {
  display: block; }

@media screen and (max-width: 1199px) {
  .footer-disappear {
    display: none; } }
.footer-appear {
  display: block; }

@media screen and (max-width: 1199px) {
  .footer-appear {
    display: block; } }
.footer-linklist {
  list-style-type: none;
  margin: 0; }

.footerline {
  margin: 0 0 30px;
  border-bottom: solid #d5d5d5 1px; }

/*Quick Access Bar container background color override*/
#qab_container {
  background: #F6F5F4; }

/*Smaller type for footer links on mobile screens*/
@media only screen and (max-width: 479px) {
  .grid__item.one-half.footer-col {
    padding: 0 0 0 20px;
    /* margin: 0 auto;
     */ }

  .footer-main-block .grid__item a {
    font-size: 11px;
    letter-spacing: -.01em;
    line-height: 30px; }

  .footer-main-block .single a {
    font-size: 13px;
    letter-spacing: -.02em;
    line-height: 30px; }

  .footer-main-block .grid__item ul li:first-of-type a {
    font-size: 13px;
    line-height: 30px;
    letter-spacing: -.02em; } }
/*tablet size footer */
@media screen and (max-width: 639px) {
  .footer-tablet {
    display: none; } }
@media screen and (min-width: 640px) and (max-width: 1199px) {
  .footer-tablet {
    display: block; } }
@media screen and (min-width: 1199px) {
  .footer-tablet {
    display: none; }

  .footer-main-block, .footer-disclaimer {
    padding: 40px 9% 8px 9%;
    /*40px 0 8px;
    */ } }
/*mobile footer disappears over 639px*/
@media only screen and (min-width: 639px) {
  .footer-appear {
    display: none; }

  .site-header__logo-link {
    padding-right: 15px; } }
@media screen and (min-width: 640px) and (max-width: 1199px) {
  .site-header__logo-link {
    padding-right: 130px; } }
/*for footer screen size below 640px;
 target size 414px*/
@media only screen and (max-width: 639px) {
  .footer-appear {
    display: block; }

  .grid__item.one-half.footer-col {
    letter-spacing: -.02em; }

  .grid__item.one-whole img {
    margin-bottom: 20px; }

  .footer-disclaimer {
    padding: 0; }

  #fr1, #fr2 {
    padding-left: 20px; } }
@media screen and (max-width: 479px) {
  .footer-main-block .wrapper, .footer-disclaimer .wrapper {
    padding: 0 4px 0 0;
    margin-left: 4px; } }
@media screen and (max-width: 414px) {
  .footer-appear {
    display: block;
    width: 380px; }

  #flg {
    width: 380px;
    /* margin: 0 0 0 20px;*/ }

  #fd {
    padding: 0 10px 0 12px; }

  .footer-main-block .grid__item ul li:first-of-type a {
    margin-top: -14px; }

  .grid__item.one-half.footer-col {
    letter-spacing: -.02em;
    padding: 0;
    /*0 0 0 30px;*/
    margin-bottom: 10px; }

  .grid__item.one-half .footer-col {
    letter-spacing: -.02em; }

  .footer-main-block .grid__item a {
    font-size: 11px;
    letter-spacing: -.01em;
    line-height: 28px; }

  .footer-main-block .single a {
    font-size: 13px;
    letter-spacing: -.02em;
    line-height: 28px; } }
@media screen and (max-width: 360px) {
  #flg {
    width: 340px;
    margin: 0; }

  .grid__item.one-half.footer-col {
    letter-spacing: -.02em;
    padding: 0 0 0 10px;
    margin-bottom: 10px; } }
.footer-disclaimer {
  color: #535353;
  font-size: 12px;
  line-height: 16px;
  font-weight: 400;
  width: 100%;
  background-color: #f6f5f4;
  /*#6eae9b;
  */
  /*border-top:10px solid white;
  */ }

.lastitem, .lastitem li {
  color: #f6f5f4 !important; }

.footer-bottom-nav ul {
  list-style: none;
  padding: 0;
  margin: 0;
  float: left;
  font-weight: 300; }

.footer-bottom-nav ul li {
  display: inline-block;
  font-weight: 400;
  font-size: 12px;
  line-height: 14px;
  color: #c4c9bd; }

.footer-bottom-nav ul li a {
  color: #535353;
  font-weight: 700;
  padding: 12px 0;
  display: inline-block;
  font-size: 12px; }

.footer-bottom-nav ul li a:hover {
  color: #535353; }

@media screen and (max-width: 768px) {
  .footer-links {
    text-align: left; } }
/*============================================================================
  #Exederm homepage exclusive styles
==============================================================================*/
.basic-button, .homepage-hero-container button, .babies-hero-container button, .adults-hero-container button, .products-hero-container button, .homepage-hero-container .about-more-info .btn, .about-more-info .homepage-hero-container .btn, .babies-hero-container .about-more-info .btn, .about-more-info .babies-hero-container .btn, .adults-hero-container .about-more-info .btn, .about-more-info .adults-hero-container .btn, .products-hero-container .about-more-info .btn, .about-more-info .products-hero-container .btn, .homepage-hero-container .about-more-info .btn--secondary, .about-more-info .homepage-hero-container .btn--secondary, .babies-hero-container .about-more-info .btn--secondary, .about-more-info .babies-hero-container .btn--secondary, .adults-hero-container .about-more-info .btn--secondary, .about-more-info .adults-hero-container .btn--secondary, .products-hero-container .about-more-info .btn--secondary, .about-more-info .products-hero-container .btn--secondary, .home-main-content .button-light, .home-main-content .button-small {
  font-weight: 400;
  font-size: 18px;
  padding: 5px 15px;
  color: white;
  background-color: #3e9a76;
  margin-top: 10px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px; }
  .basic-button:hover, .homepage-hero-container button:hover, .babies-hero-container button:hover, .adults-hero-container button:hover, .products-hero-container button:hover, .homepage-hero-container .about-more-info .btn:hover, .about-more-info .homepage-hero-container .btn:hover, .babies-hero-container .about-more-info .btn:hover, .about-more-info .babies-hero-container .btn:hover, .adults-hero-container .about-more-info .btn:hover, .about-more-info .adults-hero-container .btn:hover, .products-hero-container .about-more-info .btn:hover, .about-more-info .products-hero-container .btn:hover, .homepage-hero-container .about-more-info .btn--secondary:hover, .about-more-info .homepage-hero-container .btn--secondary:hover, .babies-hero-container .about-more-info .btn--secondary:hover, .about-more-info .babies-hero-container .btn--secondary:hover, .adults-hero-container .about-more-info .btn--secondary:hover, .about-more-info .adults-hero-container .btn--secondary:hover, .products-hero-container .about-more-info .btn--secondary:hover, .about-more-info .products-hero-container .btn--secondary:hover, .home-main-content .button-light:hover, .home-main-content .button-small:hover {
    background-color: #2f765a; }

.homepage-hero-container, .babies-hero-container, .adults-hero-container, .products-hero-container {
  width: 100%;
  height: 420px;
  display: block;
  /*background-image:url(/cdn/shop/files/EXE-004_Homepage_Revised_v4_02.jpg?1020533051153216260);*/
  background-size: cover;
  background-position: 46%;
  padding-bottom: 15px; }
  @media screen and (max-width: 768px) {
    .homepage-hero-container, .babies-hero-container, .adults-hero-container, .products-hero-container {
      background-position: 39%; } }
  @media screen and (max-width: 660px) {
    .homepage-hero-container, .babies-hero-container, .adults-hero-container, .products-hero-container {
      background-position: 35%; } }
  @media screen and (max-width: 650px) {
    .homepage-hero-container, .babies-hero-container, .adults-hero-container, .products-hero-container {
      height: 340px; } }
  @media screen and (max-width: 480px) {
    .homepage-hero-container, .babies-hero-container, .adults-hero-container, .products-hero-container {
      background-image: url(/cdn/shop/files/EXE-004_Homepage_MOBILE_v3_02_4f78e5ff-5c8f-4090-be68-13f606f862ac.jpg?8068642555580753942); } }
  .homepage-hero-container h1, .babies-hero-container h1, .adults-hero-container h1, .products-hero-container h1, .homepage-hero-container .h1, .babies-hero-container .h1, .adults-hero-container .h1, .products-hero-container .h1 {
    font-family: 'Encode Sans', sans-serif;
    font-size: 50px;
    line-height: 54px;
    color: #535353;
    margin-bottom: 0; }
    @media screen and (max-width: 960px) {
      .homepage-hero-container h1, .babies-hero-container h1, .adults-hero-container h1, .products-hero-container h1, .homepage-hero-container .h1, .babies-hero-container .h1, .adults-hero-container .h1, .products-hero-container .h1 {
        font-size: 38px;
        line-height: 40px; } }
    @media screen and (max-width: 768px) {
      .homepage-hero-container h1, .babies-hero-container h1, .adults-hero-container h1, .products-hero-container h1, .homepage-hero-container .h1, .babies-hero-container .h1, .adults-hero-container .h1, .products-hero-container .h1 {
        font-size: 35px;
        line-height: 38px; } }
    @media screen and (max-width: 480px) {
      .homepage-hero-container h1, .babies-hero-container h1, .adults-hero-container h1, .products-hero-container h1, .homepage-hero-container .h1, .babies-hero-container .h1, .adults-hero-container .h1, .products-hero-container .h1 {
        font-size: 29px;
        line-height: 33px; } }
    @media screen and (max-width: 400px) {
      .homepage-hero-container h1, .babies-hero-container h1, .adults-hero-container h1, .products-hero-container h1, .homepage-hero-container .h1, .babies-hero-container .h1, .adults-hero-container .h1, .products-hero-container .h1 {
        font-size: 22px;
        line-height: 24px; } }
  .homepage-hero-container h2, .babies-hero-container h2, .adults-hero-container h2, .products-hero-container h2, .homepage-hero-container .h2, .babies-hero-container .h2, .adults-hero-container .h2, .products-hero-container .h2 {
    font-weight: 300;
    font-size: 44px;
    line-height: 40px;
    color: #539c7c; }
    @media screen and (max-width: 960px) {
      .homepage-hero-container h2, .babies-hero-container h2, .adults-hero-container h2, .products-hero-container h2, .homepage-hero-container .h2, .babies-hero-container .h2, .adults-hero-container .h2, .products-hero-container .h2 {
        font-size: 36px;
        line-height: 35px; } }
    @media screen and (max-width: 768px) {
      .homepage-hero-container h2, .babies-hero-container h2, .adults-hero-container h2, .products-hero-container h2, .homepage-hero-container .h2, .babies-hero-container .h2, .adults-hero-container .h2, .products-hero-container .h2 {
        font-size: 31px;
        line-height: 36px; } }
    @media screen and (max-width: 480px) {
      .homepage-hero-container h2, .babies-hero-container h2, .adults-hero-container h2, .products-hero-container h2, .homepage-hero-container .h2, .babies-hero-container .h2, .adults-hero-container .h2, .products-hero-container .h2 {
        font-size: 25px;
        line-height: 27px; } }
    @media screen and (max-width: 400px) {
      .homepage-hero-container h2, .babies-hero-container h2, .adults-hero-container h2, .products-hero-container h2, .homepage-hero-container .h2, .babies-hero-container .h2, .adults-hero-container .h2, .products-hero-container .h2 {
        font-size: 20px;
        line-height: 25px; } }
  .homepage-hero-container button a, .babies-hero-container button a, .adults-hero-container button a, .products-hero-container button a, .homepage-hero-container .about-more-info .btn a, .about-more-info .homepage-hero-container .btn a, .babies-hero-container .about-more-info .btn a, .about-more-info .babies-hero-container .btn a, .adults-hero-container .about-more-info .btn a, .about-more-info .adults-hero-container .btn a, .products-hero-container .about-more-info .btn a, .about-more-info .products-hero-container .btn a, .homepage-hero-container .about-more-info .btn--secondary a, .about-more-info .homepage-hero-container .btn--secondary a, .babies-hero-container .about-more-info .btn--secondary a, .about-more-info .babies-hero-container .btn--secondary a, .adults-hero-container .about-more-info .btn--secondary a, .about-more-info .adults-hero-container .btn--secondary a, .products-hero-container .about-more-info .btn--secondary a, .about-more-info .products-hero-container .btn--secondary a {
    color: white; }
  @media screen and (max-width: 768px) {
    .homepage-hero-container, .babies-hero-container, .adults-hero-container, .products-hero-container {
      height: 340px;
      /* padding-top:50px;
       padding-left: 30px;*/ } }

.lt-ie9 .homepage-hero-container, .lt-ie9 .babies-hero-container, .lt-ie9 .adults-hero-container, .lt-ie9 .products-hero-container {
  text-align: left;
  background-size: 100%; }

.homepage-top-coupon {
  display: none; }
  @media screen and (max-width: 480px) {
    .homepage-top-coupon {
      display: block;
      width: 100% !important;
      float: none;
      text-align: center; } }

@media screen and (max-width: 480px) {
  .homepage-coupon-column {
    display: none; } }

@media screen and (max-width: 768px) {
  .homepage-babies {
    width: 50% !important;
    float: left; } }
@media screen and (max-width: 480px) {
  .homepage-babies {
    width: 100% !important;
    float: none;
    text-align: center; } }

@media screen and (max-width: 768px) {
  .homepage-adults {
    width: 50% !important;
    float: right; } }
@media screen and (max-width: 480px) {
  .homepage-adults {
    width: 100% !important;
    float: none;
    text-align: center; } }

.homepage-med {
  clear: none !important; }
  @media screen and (max-width: 768px) {
    .homepage-med {
      display: none; } }

.home-main-content h1, .home-main-content .h1, .home-main-content .header-one {
  font-size: 24px;
  line-height: 30px;
  font-weight: 400; }
.home-main-content p {
  font-weight: 300;
  font-size: 18px;
  line-height: 23px; }
.home-main-content .button-light {
  background-color: #d4e5f8;
  color: #3e9a76; }
  .home-main-content .button-light:hover {
    background-color: #a8caf1; }
.home-main-content .button-small {
  font-size: 14px; }

.homepage-coupon-column {
  text-align: right; }
  @media screen and (max-width: 768px) {
    .homepage-coupon-column {
      text-align: left; } }

@media screen and (max-width: 380px) {
  .site-header__logo-link img {
    max-width: 70%; } }

.cycle-slideshow {
  margin: 0 35px; }
  .cycle-slideshow img {
    max-width: 100%;
    width: 100%; }
  .cycle-slideshow .cycle-prev, .cycle-slideshow .cycle-next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%); }
  .cycle-slideshow .cycle-prev {
    left: -35px; }
  .cycle-slideshow .cycle-next {
    right: -35px; }

/*============================================================================
  #Exederm product page template styles for "product.liquid"
==============================================================================*/
/*============================================================================ #Exederm product page template styles for "product.liquid" ==============================================================================*/
.yotpo-label {
  display: none !important; }

.yotpo .promoted-products-box {
  display: none !important; }

.yotpo {
  margin-bottom: 15px; }

.yotpo .yotpo-default-button, .yotpo input[type="button"].yotpo-default-button {
  display: inline-block;
  text-overflow: ellipsis;
  border: none;
  font-family: "Encode Sans", sans-serif !important;
  text-transform: capitalize !important;
  font-weight: 600 !important;
  text-align: center;
  font-size: 14px;
  /*      padding: 12px 18px !important; */
  background: #3e9a76 !important;
  color: #fff;
  height: auto;
  margin: 0 0 5px 0; }

.yotpo.yotpo-main-widget .yotpo-icon-btn .yotpo-icon, .yotpo .yotpo-modal-dialog .yotpo-icon-btn .yotpo-icon {
  font-size: 19px;
  color: #fff;
  display: none !important; }

@media screen and (max-width: 768px) {
  .yotpo-first-review-stars {
    display: none; }

  .yotpo.yotpo-main-widget.yotpo-small .yotpo-bottomline.yotpo-bottomline-2-boxes,
  .yotpo .yotpo-modal-dialog.yotpo-small .yotpo-bottomline.yotpo-bottomline-2-boxes,
  .yotpo-regular-box .yotpo-bottomline .yotpo-bottomline-2-boxes .yotpo-bottomline-empty-state {
    display: none; }

  .yotpo-regular-box.yotpo-bottomline.yotpo-bottomline-2-boxes.yotpo-bottomline-empty-state {
    display: none; }

  .yotpo .yotpo-default-button, .yotpo input[type="button"].yotpo-default-button {
    margin: 0 0 6px 0; } }
.product-description.rte {
  max-width: 570px; }

#productSelect-option-0 {
  border: 1px solid #bbb;
  border-radius: 0; }

.product-title {
  font-size: 45px;
  line-height: 54px;
  font-family: 'Encode Sans', sans-serif;
  color: #535353; }

#prod-desc-price {
  padding-left: 8%; }

@media screen and (min-width: 481px) and (max-width: 768px) {
  #prod-desc-price {
    padding-left: 2%; }

  .metafields, ul {
    margin: 0 0 0 15px; }

  #AddToCartForm {
    margin-left: -4px; }

  .special-offer-text {
    margin-left: -10px; }

  .stores {
    margin: 10px 0 0 0;
    display: inline-block; } }
@media screen and (min-width: 360px) and (max-width: 480px) {
  #AddToCartForm {
    margin-left: 7px; }

  #prod-desc-price {
    padding-left: 4px; }

   /* .product-tabs {
	margin: 0 3%;
	}*/ }
@media screen and (min-width: 422px) and (max-width: 480px) {
  #AddToCartForm {
    margin-left: -4px; }

  #prod-desc-price {
    padding-left: 0; } }
@media screen and (max-width: 480px) {
  .grid.product-single, .product-single.grid--rev, .product-single.grid--full {
    margin: auto 5%; }

  .metafields, ul {
    margin: 0 0 0 18px; }

  .special-offer-text {
    margin-left: -15px; } }
.stores {
  margin: 10px 0 0 0px;
  display: inline-block; }

#topsection {
  max-width: 1300px; }

#award-section {
  margin: 0 auto; }

.nea-award-info {
  display: block;
  padding: 0 5%;
  text-align: center;
  max-width: 600px; }

@media screen and (max-width: 1600px) {
  .nea-award-info {
    padding: 5% 8%;
    max-width: 100%; } }
@media screen and (max-width: 1280px) {
  .nea-award-info {
    padding: 10%;
    max-width: 100%; } }
@media screen and (min-width: 769px) and (max-width: 1279px) {
  .nea-award-info {
    padding: 2% 10%;
    max-width: 100%; } }
@media screen and (max-width: 768px) {
  .nea-award-info {
    padding: 3%;
    max-width: 100%; }

  .award1-hero-container {
    margin-bottom: 0; } }
@media screen and (min-width: 420px) and (max-width: 479px) {
  .nea-award-info {
    padding: 4% 0;
    max-width: 100%; } }
.award1-hero-container {
  width: 100%;
  height: 360px;
  display: block;
  background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/Exederm_FlareControl_inset-prodpg.png?v=1613693438");
  background-size: cover;
  background-position: 0; }

@media screen and (min-width: 769px) {
  .award1-hero-container {
    margin-bottom: 37px; } }
@media screen and (max-width: 768px) {
  .award1-hero-container {
    background-position: 39%; } }
@media screen and (max-width: 660px) {
  .award1-hero-container {
    background-position: 35%; } }
@media screen and (max-width: 650px) {
  .award1-hero-container {
    height: 340px;
    padding-top: 40px; } }
.award2-hero-container {
  width: 100%;
  height: 360px;
  display: block;
  background-color: #F9F4EB;
  padding: 4.2%; }

@media screen and (max-width: 768px) {
  .award2-hero-container {
    background-position: 39%; } }
@media screen and (max-width: 660px) {
  .award2-hero-container {
    background-position: 35%; } }
@media screen and (max-width: 650px) {
  .award2-hero-container {
    height: 340px; } }
#AddToCartForm {
  padding-left: 0; }

@media screen and (min-width: 856px) and (max-width: 1599px) {
  .product-title {
    font-size: 40px;
    line-height: 50px; } }
@media screen and (min-width: 769px) and (max-width: 855px) {
  .product-title {
    font-size: 38px;
    line-height: 48px; } }
@media screen and (max-width: 768px) {
    /*.product-tabs {
         padding: 0 4px;
    }
    
   .product-tabs {
	margin: 0 7%;
	}*/
  .product-title {
    font-size: 32px;
    line-height: 42px; } }
#AddToCart .btn, #AddToCart .btn--secondary, #AddToCart .btn--secondary {
  background-color: #3E9A76;
  font-size: 16px;
  line-height: 21px;
  padding: 10px 15px;
  width: 200px; }

#AddToCart .btn.disabled, #AddToCart .disabled.btn--secondary, #AddToCart .disabled.btn--secondary {
  background-color: #f1f1f1;
  font-size: 16px;
  line-height: 21px;
  padding: 10px 15px;
  width: 200px; }

.prod-desc-extended h2, .prod-desc-extended .h2, .prod-desc-extended .h2 {
  font-size: 20px;
  line-height: 22px;
  padding: 0;
  margin: 0;
  color: #3e9a76; }

.prod-desc-extended p {
  font-size: 15px;
  line-height: 22px;
  font-weight: 400;
  color: #535353; }

#ProductPrice {
  margin: 18px 0; }

@media screen and (max-width: 768px) {
  .spec-offers {
    text-align: center; } }
.ingredients {
  color: #4f709d; }

.button-products-page {
  display: block;
  margin-top: 20px; }

.button-products-page a {
  color: white;
  font-size: 14px; }

#shopify-section-other-top-rated-products {
  margin-bottom: 12px; }

/*============================================================================
  #Exederm basic page styles
==============================================================================*/
.basic-page h1, .basic-page .h1 {
  font-size: 45px;
  line-height: 56px;
  font-family: 'Encode Sans', sans-serif;
  color: #535353;
  /*text-transform: capitalize;*/
  font-weight: 500;
  margin-bottom: 40px; }
  .basic-page h1.green, .basic-page .green.h1 {
    color: #3e9a76; }
.basic-page h2, .basic-page .h2 {
  font-size: 26px;
  line-height: 32px;
  font-family: 'Encode Sans', sans-serif;
  color: #535353;
  margin-bottom: 36px; }
.basic-page h3, .basic-page .h3 {
  font-size: 22px;
  line-height: 28px;
  font-family: 'Encode Sans', sans-serif;
  color: #535353;
  margin-bottom: 28px; }
.basic-page h4, .basic-page .h4 {
  font-size: 20px;
  line-height: 25px;
  font-family: 'Encode Sans', sans-serif;
  color: #535353;
  margin-bottom: 28px; }
.basic-page p {
  font-family: 'Open Sans', sans-serif;
  margin-bottom: 35px;
  font-size: 16px;
  line-height: 24px;
  font-weight: 400; }
.basic-page p + ul {
  margin-top: -23px; }
.basic-page ul + h2, .basic-page ul + .h2 {
  margin-top: 30px; }
.basic-page li {
  font-weight: 400; }

@media screen and (min-width: 961px) and (max-width: 1400px) {
  .basic-page h1.green, .basic-page .green.h1 {
    font-size: 3vw;
    line-height: 4vw;
    margin-bottom: 24px; } }
@media screen and (min-width: 768px) and (max-width: 960px) {
  .basic-page h1.green, .basic-page .green.h1 {
    font-size: 3.2vw;
    line-height: 4.3vw;
    margin-bottom: 24px; } }
@media screen and (min-width: 540px) and (max-width: 767px) {
  .basic-page h1.green, .basic-page .green.h1 {
    font-size: 5.2vw;
    line-height: 6vw;
    margin-bottom: 24px; } }
@media screen and (max-width: 539px) {
  .basic-page h1.green, .basic-page .green.h1 {
    font-size: 36px;
    line-height: 48px;
    margin-bottom: 18px; }

  /*h3.about-irritants-section-title, h3.about-irritants-section-title2, h3.about-irritants-subtitle {
  font-size:5vw;
  line-height:7vw;*/ }
/*
@media screen only and (max-width:768px) {
  .basic page {
    h1 {
    font-size:20px;
    line-height:45px;
    margin-bottom:36px;
    margin-bottom:40px;
      &.green{
      color:$color-primary;
      }  
    }
    h2 {
    font-size:24px;
    line-height:30px;
    margin-bottom:24px;
    }
  	h3 {
    font-size:18px;
    line-height:24px;  	
  	}
    h4 {
    font-size:16px;
    line-height:21px;
    }
    p{
    font-size:14px;
    line-height:18px;
    }
   }
}*/
/*May need to use*/
/*============================================================================
  #Exederm collections page styles
==============================================================================*/
.babies-hero-container, .adults-hero-container {
  background-image: url(/cdn/shop/files/EXE-004_Products_Children_v2_02.jpg?1124939924229273763);
  height: 267px;
  padding-top: 100px; }
  @media screen and (max-width: 768px) {
    .babies-hero-container, .adults-hero-container {
      background-position: 52%; } }
  .babies-hero-container h1, .adults-hero-container h1, .babies-hero-container .h1, .adults-hero-container .h1 {
    font-size: 54px;
    line-height: 47px; }
    @media screen and (max-width: 768px) {
      .babies-hero-container h1, .adults-hero-container h1, .babies-hero-container .h1, .adults-hero-container .h1 {
        font-size: 45px; } }
  .babies-hero-container h2, .adults-hero-container h2, .babies-hero-container .h2, .adults-hero-container .h2 {
    font-size: 38px;
    line-height: 39px;
    padding-right: 25%; }
    @media screen and (max-width: 768px) {
      .babies-hero-container h2, .adults-hero-container h2, .babies-hero-container .h2, .adults-hero-container .h2 {
        font-size: 29px;
        line-height: 29px; } }
  @media screen and (max-width: 768px) {
    .babies-hero-container, .adults-hero-container {
      height: 205px;
      padding-top: 65px; } }

.adults-hero-container {
  background-image: url(/cdn/shop/files/EXE-004_Products_Children_v2_02_3bb39574-6844-426b-88a6-8868c44d97c2.jpg?4221936516231421414); }
  @media screen and (max-width: 768px) {
    .adults-hero-container {
      background-position: 60% 50%; } }

.collections-page .yotpo .pull-left {
  text-align: center !important;
  float: none !important; }

/*============================================================================
  #Exederm product overview page styles
==============================================================================*/
.products-hero-container {
  background-image: url(/cdn/shop/files/EXE-004_Products_Overview_02.jpg?12791059967412829515);
  height: 267px;
  padding-top: 100px; }
  @media screen and (max-width: 768px) {
    .products-hero-container {
      height: 205px;
      padding-top: 65px;
      background-position: 50%; } }
  @media screen and (max-width: 480px) {
    .products-hero-container {
      background-position: 40%; } }
  .products-hero-container h1, .products-hero-container .h1 {
    font-size: 54px;
    line-height: 50px; }
  .products-hero-container h2, .products-hero-container .h2 {
    font-size: 38px;
    line-height: 39px;
    margin-bottom: 0; }

.products-overview-babies {
  text-align: right; }
  @media screen and (max-width: 768px) {
    .products-overview-babies {
      text-align: center;
      margin-bottom: 30px; } }

.products-overview-adults {
  text-align: left; }
  @media screen and (max-width: 768px) {
    .products-overview-adults {
      text-align: center; } }

  /*============================================================================
  #Exederm faq page styles
==============================================================================*/
/*toggle styles*/
.panel-title > a:before {
  float: right !important;
  font-family: FontAwesome;
  content: "\f068";
  padding-right: 5px; }

.panel-title > a.collapsed:before {
  float: right !important;
  content: "\f067"; }

.panel-title > a:hover, .panel-title > a:active, .panel-title > a:focus {
  text-decoration: none; }

#accordion h3 button span, #accordion .h3 button span, #accordion h3 .about-more-info .btn span, .about-more-info #accordion h3 .btn span, #accordion .h3 .about-more-info .btn span, .about-more-info #accordion .h3 .btn span, #accordion h3 .about-more-info .btn--secondary span, .about-more-info #accordion h3 .btn--secondary span, #accordion .h3 .about-more-info .btn--secondary span, .about-more-info #accordion .h3 .btn--secondary span, #accordion .h3 button span, #accordion .h3 .about-more-info .btn span, .about-more-info #accordion .h3 .btn span, #accordion .h3 .about-more-info .btn--secondary span, .about-more-info #accordion .h3 .btn--secondary span, #accordion h3 .about-more-info .btn span, #accordion .h3 .about-more-info .btn span, #accordion h3 .about-more-info .btn--secondary span, #accordion .h3 .about-more-info .btn--secondary span, .about-more-info #accordion h3 .btn span, .about-more-info #accordion .h3 .btn span, .about-more-info #accordion h3 .btn--secondary span, .about-more-info #accordion .h3 .btn--secondary span, #accordion .h3 .about-more-info .btn span, #accordion .h3 .about-more-info .btn--secondary span, .about-more-info #accordion .h3 .btn span, .about-more-info #accordion .h3 .btn--secondary span, #accordion h3 .about-more-info .btn--secondary span, #accordion .h3 .about-more-info .btn--secondary span, .about-more-info #accordion h3 .btn--secondary span, .about-more-info #accordion .h3 .btn--secondary span, #accordion .h3 .about-more-info .btn--secondary span, .about-more-info #accordion .h3 .btn--secondary span {
  font-size: 22px;
  margin: 0;
  color: #3e9a76;
  font-weight: 400; }

#accordion h3, #accordion .h3, #accordion .h3 {
  padding: 0;
  line-height: auto;
  margin: 18px 0; }

#accordion div {
  padding: 0 0 10px 0; }

#accordion p {
  margin: 0;
  /* padding-left: 25px;
   */
  color: #000000;
  font-weight: 400;
  font-size: 16px;
  line-height: 24px; }

#accordion {
  margin-bottom: 50px; }

.Accordion-panel {
  margin-top: -10px; }

span.Accordion-title {
  text-align: left;
  float: left; }

span.Accordion-title > a:before {
  float: right !important;
  font-family: FontAwesome;
  content: "\f068";
  padding-right: 5px; }

span.Accordion-title > a.collapsed:before {
  float: right !important;
  content: "\f067"; }

span.Accordion-title > a:hover, span.Accordion-title > a:active, span.Accordion-title > a:focus {
  text-decoration: none; }

@media screen and (max-width: 768px) {
  #accordion h3 button span, #accordion .h3 button span, #accordion h3 .about-more-info .btn span, .about-more-info #accordion h3 .btn span, #accordion .h3 .about-more-info .btn span, .about-more-info #accordion .h3 .btn span, #accordion h3 .about-more-info .btn--secondary span, .about-more-info #accordion h3 .btn--secondary span, #accordion .h3 .about-more-info .btn--secondary span, .about-more-info #accordion .h3 .btn--secondary span, #accordion .h3 button span, #accordion .h3 .about-more-info .btn span, .about-more-info #accordion .h3 .btn span, #accordion .h3 .about-more-info .btn--secondary span, .about-more-info #accordion .h3 .btn--secondary span, #accordion h3 .about-more-info .btn span, #accordion .h3 .about-more-info .btn span, #accordion h3 .about-more-info .btn--secondary span, #accordion .h3 .about-more-info .btn--secondary span, .about-more-info #accordion h3 .btn span, .about-more-info #accordion .h3 .btn span, .about-more-info #accordion h3 .btn--secondary span, .about-more-info #accordion .h3 .btn--secondary span, #accordion .h3 .about-more-info .btn span, #accordion .h3 .about-more-info .btn--secondary span, .about-more-info #accordion .h3 .btn span, .about-more-info #accordion .h3 .btn--secondary span, #accordion h3 .about-more-info .btn--secondary span, #accordion .h3 .about-more-info .btn--secondary span, .about-more-info #accordion h3 .btn--secondary span, .about-more-info #accordion .h3 .btn--secondary span, #accordion .h3 .about-more-info .btn--secondary span, .about-more-info #accordion .h3 .btn--secondary span {
    font-size: 16px;
    margin: 0;
    color: #3e9a76;
    font-weight: 400; }

  #accordion h3, #accordion .h3, #accordion .h3 {
    padding: 0px; }

  #accordion div {
    padding: 10px; }

  #accordion p {
    margin: 0;
    /*padding-left:25px;
    */ }

  #accordion a:active, #accordion a:focus, #accordion a:hover {
    color: #28634c; } }
@media screen only and (max-width: 630px) {
  span.Accordion-title {
    text-align: left;
    float: left; }

  #accordion h3 button span, #accordion .h3 button span, #accordion h3 .about-more-info .btn span, .about-more-info #accordion h3 .btn span, #accordion .h3 .about-more-info .btn span, .about-more-info #accordion .h3 .btn span, #accordion h3 .about-more-info .btn--secondary span, .about-more-info #accordion h3 .btn--secondary span, #accordion .h3 .about-more-info .btn--secondary span, .about-more-info #accordion .h3 .btn--secondary span, #accordion .h3 button span, #accordion .h3 .about-more-info .btn span, .about-more-info #accordion .h3 .btn span, #accordion .h3 .about-more-info .btn--secondary span, .about-more-info #accordion .h3 .btn--secondary span, #accordion h3 .about-more-info .btn span, #accordion .h3 .about-more-info .btn span, #accordion h3 .about-more-info .btn--secondary span, #accordion .h3 .about-more-info .btn--secondary span, .about-more-info #accordion h3 .btn span, .about-more-info #accordion .h3 .btn span, .about-more-info #accordion h3 .btn--secondary span, .about-more-info #accordion .h3 .btn--secondary span, #accordion .h3 .about-more-info .btn span, #accordion .h3 .about-more-info .btn--secondary span, .about-more-info #accordion .h3 .btn span, .about-more-info #accordion .h3 .btn--secondary span, #accordion h3 .about-more-info .btn--secondary span, #accordion .h3 .about-more-info .btn--secondary span, .about-more-info #accordion h3 .btn--secondary span, .about-more-info #accordion .h3 .btn--secondary span, #accordion .h3 .about-more-info .btn--secondary span, .about-more-info #accordion .h3 .btn--secondary span, #accordion .h3 button span, #accordion .h3 .about-more-info .btn span, .about-more-info #accordion .h3 .btn span, #accordion .h3 .about-more-info .btn--secondary span, .about-more-info #accordion .h3 .btn--secondary span, #accordion .h3 .about-more-info .btn span, #accordion .h3 .about-more-info .btn--secondary span, .about-more-info #accordion .h3 .btn span, .about-more-info #accordion .h3 .btn--secondary span, #accordion .h3 .about-more-info .btn--secondary span, .about-more-info #accordion .h3 .btn--secondary span, #accordion h3 .about-more-info .btn span, #accordion .h3 .about-more-info .btn span, #accordion h3 .about-more-info .btn--secondary span, #accordion .h3 .about-more-info .btn--secondary span, #accordion .h3 .about-more-info .btn span, #accordion .h3 .about-more-info .btn--secondary span, #accordion h3 .about-more-info .btn--secondary span, #accordion .h3 .about-more-info .btn--secondary span, #accordion .h3 .about-more-info .btn--secondary span, .about-more-info #accordion h3 .btn span, .about-more-info #accordion .h3 .btn span, .about-more-info #accordion h3 .btn--secondary span, .about-more-info #accordion .h3 .btn--secondary span, .about-more-info #accordion .h3 .btn span, .about-more-info #accordion .h3 .btn--secondary span, .about-more-info #accordion h3 .btn--secondary span, .about-more-info #accordion .h3 .btn--secondary span, .about-more-info #accordion .h3 .btn--secondary span, #accordion .h3 .about-more-info .btn span, #accordion .h3 .about-more-info .btn--secondary span, #accordion .h3 .about-more-info .btn--secondary span, .about-more-info #accordion .h3 .btn span, .about-more-info #accordion .h3 .btn--secondary span, .about-more-info #accordion .h3 .btn--secondary span, #accordion h3 .about-more-info .btn--secondary span, #accordion .h3 .about-more-info .btn--secondary span, #accordion .h3 .about-more-info .btn--secondary span, .about-more-info #accordion h3 .btn--secondary span, .about-more-info #accordion .h3 .btn--secondary span, .about-more-info #accordion .h3 .btn--secondary span, #accordion .h3 .about-more-info .btn--secondary span, .about-more-info #accordion .h3 .btn--secondary span {
    font-size: 14px;
    margin: 0;
    color: #3e9a76;
    font-weight: 600;
    width: 95%; }

  .Accordion-panel .basic-page p {
    margin-bottom: 35px;
    font-size: 16px;
    line-height: 24px;
    font-weight: 500; } }
/*@media screen and (min-width:480px) and (max-width:560px) {
 #accordion h3 button span, #accordion .h3 button span, #accordion h3 .about-more-info .btn span, .about-more-info #accordion h3 .btn span, #accordion .h3 .about-more-info .btn span, .about-more-info #accordion .h3 .btn span, #accordion h3 .about-more-info .btn--secondary span, .about-more-info #accordion h3 .btn--secondary span, #accordion .h3 .about-more-info .btn--secondary span, .about-more-info #accordion .h3 .btn--secondary span {
 		width:420px;
 	}

}*/
@media screen and (max-width: 560px) {
  #accordion h3 button span, #accordion .h3 button span, #accordion h3 .about-more-info .btn span, .about-more-info #accordion h3 .btn span, #accordion .h3 .about-more-info .btn span, .about-more-info #accordion .h3 .btn span, #accordion h3 .about-more-info .btn--secondary span, .about-more-info #accordion h3 .btn--secondary span, #accordion .h3 .about-more-info .btn--secondary span, .about-more-info #accordion .h3 .btn--secondary span, #accordion .h3 button span, #accordion .h3 .about-more-info .btn span, .about-more-info #accordion .h3 .btn span, #accordion .h3 .about-more-info .btn--secondary span, .about-more-info #accordion .h3 .btn--secondary span, #accordion h3 .about-more-info .btn span, #accordion .h3 .about-more-info .btn span, #accordion h3 .about-more-info .btn--secondary span, #accordion .h3 .about-more-info .btn--secondary span, .about-more-info #accordion h3 .btn span, .about-more-info #accordion .h3 .btn span, .about-more-info #accordion h3 .btn--secondary span, .about-more-info #accordion .h3 .btn--secondary span, #accordion .h3 .about-more-info .btn span, #accordion .h3 .about-more-info .btn--secondary span, .about-more-info #accordion .h3 .btn span, .about-more-info #accordion .h3 .btn--secondary span, #accordion h3 .about-more-info .btn--secondary span, #accordion .h3 .about-more-info .btn--secondary span, .about-more-info #accordion h3 .btn--secondary span, .about-more-info #accordion .h3 .btn--secondary span, #accordion .h3 .about-more-info .btn--secondary span, .about-more-info #accordion .h3 .btn--secondary span {
    font-size: 16px;
    margin: 0;
    color: #3e9a76;
    /*font-weight: 600;*/
    letter-spacing: -.02em;
    width: 340px; }

  #accordion p {
    margin: 0;
    /* padding-left: 25px;
     */
    color: #000000;
    font-weight: 500;
    font-size: 16px;
    line-height: 22px; } }
@media screen and (max-width: 421px) {
  #accordion h3 button span, #accordion .h3 button span, #accordion h3 .about-more-info .btn span, .about-more-info #accordion h3 .btn span, #accordion .h3 .about-more-info .btn span, .about-more-info #accordion .h3 .btn span, #accordion h3 .about-more-info .btn--secondary span, .about-more-info #accordion h3 .btn--secondary span, #accordion .h3 .about-more-info .btn--secondary span, .about-more-info #accordion .h3 .btn--secondary span, #accordion .h3 button span, #accordion .h3 .about-more-info .btn span, .about-more-info #accordion .h3 .btn span, #accordion .h3 .about-more-info .btn--secondary span, .about-more-info #accordion .h3 .btn--secondary span, #accordion h3 .about-more-info .btn span, #accordion .h3 .about-more-info .btn span, #accordion h3 .about-more-info .btn--secondary span, #accordion .h3 .about-more-info .btn--secondary span, .about-more-info #accordion h3 .btn span, .about-more-info #accordion .h3 .btn span, .about-more-info #accordion h3 .btn--secondary span, .about-more-info #accordion .h3 .btn--secondary span, #accordion .h3 .about-more-info .btn span, #accordion .h3 .about-more-info .btn--secondary span, .about-more-info #accordion .h3 .btn span, .about-more-info #accordion .h3 .btn--secondary span, #accordion h3 .about-more-info .btn--secondary span, #accordion .h3 .about-more-info .btn--secondary span, .about-more-info #accordion h3 .btn--secondary span, .about-more-info #accordion .h3 .btn--secondary span, #accordion .h3 .about-more-info .btn--secondary span, .about-more-info #accordion .h3 .btn--secondary span {
    width: 280px; } }
@media screen and (max-width: 414px) {
  #accordion h3 button span, #accordion .h3 button span, #accordion h3 .about-more-info .btn span, .about-more-info #accordion h3 .btn span, #accordion .h3 .about-more-info .btn span, .about-more-info #accordion .h3 .btn span, #accordion h3 .about-more-info .btn--secondary span, .about-more-info #accordion h3 .btn--secondary span, #accordion .h3 .about-more-info .btn--secondary span, .about-more-info #accordion .h3 .btn--secondary span, #accordion .h3 button span, #accordion .h3 .about-more-info .btn span, .about-more-info #accordion .h3 .btn span, #accordion .h3 .about-more-info .btn--secondary span, .about-more-info #accordion .h3 .btn--secondary span, #accordion h3 .about-more-info .btn span, #accordion .h3 .about-more-info .btn span, #accordion h3 .about-more-info .btn--secondary span, #accordion .h3 .about-more-info .btn--secondary span, .about-more-info #accordion h3 .btn span, .about-more-info #accordion .h3 .btn span, .about-more-info #accordion h3 .btn--secondary span, .about-more-info #accordion .h3 .btn--secondary span, #accordion .h3 .about-more-info .btn span, #accordion .h3 .about-more-info .btn--secondary span, .about-more-info #accordion .h3 .btn span, .about-more-info #accordion .h3 .btn--secondary span, #accordion h3 .about-more-info .btn--secondary span, #accordion .h3 .about-more-info .btn--secondary span, .about-more-info #accordion h3 .btn--secondary span, .about-more-info #accordion .h3 .btn--secondary span, #accordion .h3 .about-more-info .btn--secondary span, .about-more-info #accordion .h3 .btn--secondary span {
    width: 270px; } }
  /*============================================================================
  #Exederm about x page overview styles
==============================================================================*/
.relevant-info {
  font-family: 'Encode Sans', sans-serif;
  font-size: 20px;
  line-height: 25px;
  color: #535353; }

.about-more-info {
  border: 5px solid white;
  padding: 25px 15px;
  font-size: 24px;
  line-height: 24px;
  font-family: 'Encode Sans', sans-serif;
  color: #535353;
  min-height: 145px;
  position: relative; }
  @media screen and (max-width: 440px) {
    .about-more-info {
      font-size: 20px;
      line-height: 21px; } }
  @media screen and (max-width: 380px) {
    .about-more-info {
      font-size: 14px;
      line-height: 16px; } }
  .about-more-info button, .about-more-info .btn, .about-more-info .btn--secondary, .about-more-info .btn, .about-more-info .btn--secondary {
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    margin-top: 28px;
    background-color: #3e9a76;
    color: white;
    padding: 7px 12px;
    position: absolute;
    left: 15px;
    bottom: 15px; }
    @media screen and (max-width: 340px) {
      .about-more-info button .fa, .about-more-info .btn .fa, .about-more-info .btn--secondary .fa, .about-more-info .btn .fa, .about-more-info .btn--secondary .fa {
        display: none; } }
    .about-more-info button:hover, .about-more-info .btn:hover, .about-more-info .btn--secondary:hover, .about-more-info .btn:hover, .about-more-info .btn--secondary:hover {
      background-color: #2f765a; }

.about-skin-box {
  background-color: #e4f5ef;
  padding: 45px 31% 45px 50px;
  position: relative;
  margin: 30px 0; }
  @media screen and (max-width: 825px) {
    .about-skin-box {
      padding: 45px 50px; } }
  @media screen and (max-width: 480px) {
    .about-skin-box {
      padding: 20px 25px; } }
  .about-skin-box img {
    float: right;
    position: absolute;
    bottom: 0;
    right: -30px;
    width: 31%; }
  .about-skin-box h2, .about-skin-box .h2 {
    color: #51a389;
    font-size: 20px;
    margin-bottom: 20px; }
  .about-skin-box strong {
    color: #51a389; }

.about-skin-box.irritant {
  margin-bottom: 190px; }
  @media screen and (max-width: 825px) {
    .about-skin-box.irritant {
      margin-bottom: 30px; } }
  .about-skin-box.irritant img {
    bottom: -180px; }

@media screen and (max-width: 825px) {
  .about-x-img-hide {
    display: none !important; } }

@media screen and (max-width: 768px) {
  .about-img {
    padding-left: 0px; } }

  /*============================================================================
  #Exederm about x page individual styles
==============================================================================*/
.about-skin-indv h1, .about-skin-indv .h1, .about-irri-indv h1, .about-irri-indv .h1 {
  font-size: 28px;
  line-height: 29px;
  font-family: 'Encode Sans', sans-serif;
  color: #535353;
  text-transform: lowercase; }
.about-skin-indv h2, .about-skin-indv .h2, .about-irri-indv h2, .about-irri-indv .h2 {
  font-size: 20px;
  line-height: 22px;
  font-family: 'Encode Sans', sans-serif;
  color: #3e9a76;
  margin-bottom: 15px; }
.about-skin-indv p, .about-irri-indv p {
  margin-bottom: 50px; }
.about-skin-indv p:last-of-type, .about-irri-indv p:last-of-type {
  margin-bottom: 0px; }
.about-skin-indv ul + h2, .about-skin-indv ul + .h2, .about-irri-indv ul + h2, .about-irri-indv ul + .h2 {
  margin-top: 30px; }
.about-skin-indv img, .about-irri-indv img {
  display: block;
  float: right;
  margin: 20px; }
  @media screen and (max-width: 768px) {
    .about-skin-indv img, .about-irri-indv img {
      float: none;
      margin: 20px auto; } }

.about-skin-box-indv {
  background-color: #e4f5ef;
  position: relative;
  margin: 30px 0; }

.box-interior {
  padding: 45px 30px; }
  @media screen and (max-width: 768px) {
    .box-interior {
      padding: 35px 25px 25px 0px; } }

  /*============================================================================
  #Exederm store locator page styles
==============================================================================*/
.main_search_bar, .search_within_distance {
  margin-bottom: 20px; }

  /*============================================================================
  #Exederm contact page styles
==============================================================================*/
.contact-page h1, .contact-page .h1 {
  font-size: 28px;
  line-height: 29px;
  font-family: 'Encode Sans', sans-serif;
  color: #535353;
  text-transform: capitalize;
  margin: 28px 0; }
.contact-page h2, .contact-page .h2 {
  font-size: 20px;
  line-height: 22px;
  font-family: 'Encode Sans', sans-serif;
  color: #3e9a76;
  margin-bottom: 15px; }
.contact-page h3, .contact-page .h3 {
  font-size: 21px;
  line-height: 28px;
  color: #535353;
  font-weight: 300; }

.form-half {
  width: 50%;
  float: left !important; }
  .form-half.left {
    padding-right: 10px; }
  .form-half.right {
    padding-left: 10px; }
  @media screen and (max-width: 768px) {
    .form-half {
      float: none !important;
      width: 100% !important;
      padding: 0 !important; } }

.small-down--show {
  display: none; }
  @media screen and (max-width: 650px) {
    .small-down--show {
      display: block; } }

@media screen and (max-width: 650px) {
  .small-down--hide {
    display: none; } }

.footer-bottom-nav {
  padding-bottom: 30px; }

p.intro-text {
  font-size: 21px;
  line-height: 1.3; }

.retailer-container {
  position: relative;
  overflow: hidden; }

.retailer_container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%; }

  /*============================================================================
  #Tiny slider css
==============================================================================*/
.tns-outer {
  padding: 0 !important; }

.tns-outer [hidden] {
  display: none !important; }

.tns-outer [aria-controls],
.tns-outer [data-action] {
  cursor: pointer; }

.tns-slider {
  -webkit-transition: all 0s;
  -moz-transition: all 0s;
  transition: all 0s; }

.tns-slider > .tns-item {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

.tns-horizontal.tns-subpixel {
  white-space: nowrap; }

.tns-horizontal.tns-subpixel > .tns-item {
  display: inline-block;
  vertical-align: top;
  white-space: normal; }

.tns-horizontal.tns-no-subpixel:after {
  content: '';
  display: table;
  clear: both; }

.tns-horizontal.tns-no-subpixel > .tns-item {
  float: left; }

.tns-horizontal.tns-carousel.tns-no-subpixel > .tns-item {
  margin-right: -100%; }

.tns-no-calc {
  position: relative;
  left: 0; }

.tns-gallery {
  position: relative;
  left: 0;
  min-height: 1px; }

.tns-gallery > .tns-item {
  position: absolute;
  left: -100%;
  -webkit-transition: transform 0s, opacity 0s;
  -moz-transition: transform 0s, opacity 0s;
  transition: transform 0s, opacity 0s; }

.tns-gallery > .tns-slide-active {
  position: relative;
  left: auto !important; }

.tns-gallery > .tns-moving {
  -webkit-transition: all 0.25s;
  -moz-transition: all 0.25s;
  transition: all 0.25s; }

.tns-autowidth {
  display: inline-block; }

.tns-lazy-img {
  -webkit-transition: opacity 0.6s;
  -moz-transition: opacity 0.6s;
  transition: opacity 0.6s;
  opacity: 0.6; }

.tns-lazy-img.tns-complete {
  opacity: 1; }

.tns-ah {
  -webkit-transition: height 0s;
  -moz-transition: height 0s;
  transition: height 0s; }

.tns-ovh {
  overflow: hidden; }

.tns-visually-hidden {
  position: absolute;
  left: -10000em; }

.tns-transparent {
  opacity: 0;
  visibility: hidden; }

.tns-fadeIn {
  opacity: 1;
  filter: alpha(opacity=100);
  z-index: 0; }

.tns-normal,
.tns-fadeOut {
  opacity: 0;
  filter: alpha(opacity=0);
  z-index: -1; }

.tns-vpfix {
  white-space: nowrap; }

.tns-vpfix > div,
.tns-vpfix > li {
  display: inline-block; }

.tns-t-subp2 {
  margin: 0 auto;
  width: 310px;
  position: relative;
  height: 10px;
  overflow: hidden; }

.tns-t-ct {
  width: 2333.3333333%;
  width: -webkit-calc(100% * 70 / 3);
  width: -moz-calc(100% * 70 / 3);
  width: calc(100% * 70 / 3);
  position: absolute;
  right: 0; }

.tns-t-ct:after {
  content: '';
  display: table;
  clear: both; }

.tns-t-ct > div {
  width: 1.4285714%;
  width: -webkit-calc(100% / 70);
  width: -moz-calc(100% / 70);
  width: calc(100% / 70);
  height: 10px;
  float: left; }

  /*============================================================================
  #Individual Page Styles
==============================================================================*/
/*"About Skin and Irritants" Page, CTA boxes are also on the "About Skin" page and the "About Irritants" page */
.box-half {
  background-color: #f4fafc;
  /*width: 580px;*/
  max-height: 380px;
  padding: 0;
  margin: 0;
  box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.2);
  max-width: 100%;
  margin-bottom: 30px; }

a.cta-box-link {
  text-decoration: none;
  box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.2);
  display: block;
  max-width: 580px;
  transition: all .2s ease 0s; }

a.cta-box-link:hover {
  -webkit-box-shadow: 0px 2px 5px 2px rgba(0, 0, 0, 0.33);
  box-shadow: 0px 2px 5px 2px rgba(0, 0, 0, 0.33);
  transition: all .2s ease 0s; }

.cta-image1 {
  background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/about-skin-elbow.png?v=1612641300");
  background-repeat: no-repeat;
  height: 295px;
  margin: 0; }

.cta-image2 {
  background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/about-irritants-blue.png?v=1612641300");
  background-repeat: no-repeat;
  height: 295px;
  margin: 0; }

.cta-title, .basic-page h2, .basic-page .h2 {
  color: #3e9a76;
  font-family: "Encode Sans";
  font-size: 22px;
  font-weight: 500;
  line-height: 28px;
  display: inline-block;
  padding: 26px;
  text-align: left; }

#cta-boxes .grid-item {
  padding-left: 0; }

/*#cta-boxes {
	margin-left: -30px;
	}*

/*
@media screen and (min-width:481px) and (max-width:800px) {
#cta-boxes {
	margin-left: -15px;
	}
}


@media screen and (max-width:480px) {
#cta-boxes {
	margin-left: -30px;
	}
}*/
/*"About Skin" Page - 2021 */
.about-skin-subtitle {
  display: inline-block;
  max-width: 640px;
  color: #535353;
  font-family: "Open Sans";
  font-size: 20px;
  font-weight: 400;
  line-height: 36px; }

.about-skin-section-title, .about-skin-subtitle h3, .about-skin-subtitle .h3 {
  color: #535353 !important;
  font-family: "Encode Sans";
  font-size: 22px;
  font-weight: 500;
  line-height: 28px;
  text-align: center;
  max-width: 1183px;
  margin: 0 2%; }

.as-wrap {
  max-width: 1400px;
  margin: 0 auto;
  padding: 3% 15px; }

.as-wrap2 {
  max-width: 100%;
  width: 1400px;
  margin: 0 auto;
  padding: 0 15px !important;
  height: 200px; }

p.as-box {
  font-family: "Open Sans";
  font-weight: 400;
  display: block;
  color: #000 !important;
  margin: 0 30px;
  font-size: 14px;
  line-height: 20px; }

.basic-page h2, .basic-page .h2, .basic-page .h2, h2, .h2 {
  margin-bottom: 0 !important; }

@media screen and (min-width: 769px) and (max-width: 1201px) {
  .large--one-half {
    width: 100%;
    padding: 2px 23%; } }
/*  @media screen and (min-width:640px) and (max-width:768px) {
   .large--one-half {
   width:100%;
   padding:2px 15% 3px 14%;  
   } 
 } 
 
 @media screen and (min-width:480px) and (max-width:639px) {
   .large--one-half {
   width:100%;
   padding: 2px 5% 3px 5%;  
   } 
 } */
@media screen and (min-width: 410px) and (max-width: 480px) {
  .large--one-half {
    width: 100%;
    padding: 2px 2% 3px 9%; }

  .hSpacer.forty {
    display: none; }

  .about-skin-section-title, .about-skin-subtitle h3, .about-skin-subtitle .h3 {
    margin: 0; }

  .green-768 {
    color: #3e9a76;
    font-size: 36px !important;
    line-height: 44px !important;
    margin-bottom: 30px !important; } }
@media screen and (max-width: 855px) {
  p.as-box {
    margin: 0 25px;
    font-size: 13px;
    line-height: 18px; } }
@media screen and (min-width: 720px) and (max-width: 855px) {
  .about-skin-section-title {
    margin: 0 8% 28px 8%; }

  /* .basic-page h1.green {
   font-size: }*/ }
.as-box-half {
  background-color: #f4fafc;
  height: 510px;
  padding: 0;
  margin: 0;
  box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.2);
  max-width: 100%;
  margin-bottom: 30px; }

.aboutskin-hero-container {
  width: 100%;
  height: 360px;
  display: block;
  background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/about-skin-hero.jpg?v=1612671895");
  background-size: cover;
  background-position: 46%;
  /*padding-top:115px;*/ }
  @media screen and (max-width: 768px) {
    .aboutskin-hero-container {
      background-position: 39%; } }
  @media screen and (max-width: 660px) {
    .aboutskin-hero-container {
      background-position: 35%; } }
  @media screen and (max-width: 650px) {
    .aboutskin-hero-container {
      height: 340px;
      padding-top: 40px; } }
  @media screen and (max-width: 480px) {
    .aboutskin-hero-container {
      background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/about-skin-hero-mobile1.jpg?v=1612839610");
      background-image-repeat: no-repeat; } }

.aboutskin-hero-container2 {
  width: 100%;
  height: 360px;
  display: block;
  /*background-image:url('https://cdn.shopify.com/s/files/1/0524/5622/7007/files/about-skin-hero.jpg?v=1612671895');*/
  background-size: cover;
  background-position: 46%;
  /*padding-top:115px;*/
 /* @include respond(660px){
    background-position:35%;
  }

  @include respond(650px){
    height:340px;
    padding-top:0;
  }*/ }
  @media screen and (max-width: 768px) {
    .aboutskin-hero-container2 {
      background-position: 39%; } }
  @media screen and (max-width: 960px) {
    .aboutskin-hero-container2 {
      background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/what-is-eczema-med.jpg?v=16127505840");
      background-repeat: no-repeat;
      background-size: cover;
      width: 100%;
      height: 360px; } }
  @media screen and (max-width: 480px) {
    .aboutskin-hero-container2 {
      background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/what-is-eczema-med.jpg?v=16127505840");
      background-repeat: no-repeat;
      background-size: cover;
      width: 100%;
      height: 100%; } }

.as-exp-subhead1 {
  font-size: 26px;
  line-height: 28px;
  font-family: 'Encode Sans', sans-serif;
  color: #535353;
  /* margin-bottom: 28px; */
  font-weight: 600;
  /* margin: 30px 0; */
  display: block;
  padding: 15% 0 0; }

.as-exp-block1 {
  font-size: 16px;
  line-height: 24px;
  font-weight: 400; }

@media screen and (max-width: 959px) {
  #as-exp1 {
    display: block;
    padding: 20px; }

  #as-exp2 {
    display: block;
    padding: 26px; }

  .as-bg1 {
    display: block;
    padding: 0 10% 7%;
    background-color: rgba(255, 252, 250, 0.8) !important; }

  .as-bg1-prod {
    display: block;
    padding: 0 10% 7%;
    background-color: rgba(255, 252, 250, 0.8) !important; }

  .as-exp-subhead1 {
    padding: 8% 0 0; } }
@media screen and (max-width: 900px) {
  .as-exp-block1 {
    font-size: 16px;
    line-height: 21px;
    font-weight: 400; }

  .as-exp-subhead1 {
    font-size: 22px;
    line-height: 26px; }

  .as-exp-subhead1 {
    padding: 4% 0 0; }

  .as-bg1 {
    display: block;
    padding: 0 10% 5%;
    background-color: rgba(255, 252, 250, 0.8) !important; }

  .as-bg1-prod {
    display: block;
    padding: 0 10% 5%;
    background-color: rgba(255, 252, 250, 0.8) !important; } }
@media screen and (max-width: 768px) {
  #as-exp2 {
    padding: 0 20px;
    margin-bottom: 0; }

  .hSpacer.forty {
    display: none; } }
@media screen and (max-width: 640px) {
  .as-exp-block1 {
    font-size: 13px;
    line-height: 16px;
    font-weight: 400; }

  .as-exp-subhead1 {
    font-size: 22px;
    line-height: 26px; }

  .as-exp-subhead1 {
    padding: 4% 0 0;
    margin-bottom: -10px; }

  .as-bg1-prod {
    display: block;
    padding: 0 10% 5%;
    background-color: rgba(255, 252, 250, 0.8) !important; }

  #as1 {
    margin-left: -15px !important; } }
@media screen and (max-width: 480px) {
  .as-box-half {
    height: 510px; }

  .cta-title {
    padding: 26px 26px 18px !important; } }
#what-is-bg {
  background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/what-is-eczema-dermatitis3.jpg?v=1612745227");
  background-repeat: no-repeat;
  background-size: cover;
  width: 100%;
  height: 360px;
  margin: 0 0 0 -50%;
  background-position-x: 100%; }
  @media screen and (max-width: 768px) {
    #what-is-bg {
      background-position: 39%; } }
  @media screen and (max-width: 960px) {
    #what-is-bg {
      display: none; } }
  @media screen and (max-width: 660px) {
    #what-is-bg {
      background-position: 35%; } }
  @media screen and (max-width: 650px) {
    #what-is-bg {
      height: 400px;
      padding-top: 40px; } }
  @media screen and (max-width: 480px) {
    #what-is-bg {
      background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/about-skin-hero-mobile.jpg?v=1612671895"); } }

.aboutskin-hero-container3 {
  width: 100%;
  min-height: 360px;
  display: block;
  background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/as-bg-3.png?v=1612826729");
  background-size: cover;
  /*background-position:46%;
  padding-top:115px;*/ }
  @media screen and (max-width: 768px) {
    .aboutskin-hero-container3 {
      background-position: 39%; } }
  @media screen and (max-width: 660px) {
    .aboutskin-hero-container3 {
      background-position: 35%; } }
  @media screen and (max-width: 650px) {
    .aboutskin-hero-container3 {
      height: 340px;
      padding-top: 40px; } }
  @media screen and (max-width: 480px) {
    .aboutskin-hero-container3 {
      height: 100%;
      padding-top: 0; } }

.twotypes {
  padding: 0 0 26px 0;
  color: #535353;
  font-weight: 500;
  font-size: 26px;
  line-height: 32px;
  display: block; }

.two-types-desc {
  margin-bottom: 18px !important; }

/*atopic eczema*/
.cta-image3 {
  background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/atopic-eczema-boximg.png?v=1612737660");
  background-repeat: no-repeat;
  height: 295px;
  margin: 0; }

/*contact-dermatitis*/
.cta-image4 {
  background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/contact-dermatitis-boximg.png?v=1612737661");
  background-repeat: no-repeat;
  height: 295px;
  margin: 0; }

/*seborrheic dermatitis*/
.cta-image5 {
  background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/seborrheic-dermatitis-boximg.png?v=1612737661");
  background-repeat: no-repeat;
  height: 295px;
  margin: 0; }

/*hand dermatitis*/
.cta-image6 {
  background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/hand-dermatitis-boximg.png?v=1612737661");
  background-repeat: no-repeat;
  height: 295px;
  margin: 0; }

/*children's skin*/
.cta-image7 {
  background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/childrens-skin-boximg.png?v=1612737661");
  background-repeat: no-repeat;
  height: 295px;
  margin: 0; }

/*adult skin*/
.cta-image8 {
  background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/adult-skin-boximg.png?v=1612737660");
  background-repeat: no-repeat;
  height: 295px;
  margin: 0; }

/* "About Irritants Page - 2021" */
.ai-box-half {
  background-color: #f4fafc;
  padding: 0;
  margin: 0;
  box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.2);
  max-width: 100%;
  margin-bottom: 30px; }

/*Fragrance*/
.cta-image9 {
  background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/fragrance.png?v=1612841829");
  background-repeat: no-repeat;
  height: 295px;
  margin: 0; }

/*Colors and Dyes*/
.cta-image10 {
  background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/colors-and-dyes.png?v=1612841830");
  background-repeat: no-repeat;
  height: 295px;
  margin: 0; }

/*Parabens*/
.cta-image11 {
  background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/parabens.png?v=1612841830");
  background-repeat: no-repeat;
  height: 295px;
  margin: 0; }

/*Formaldehyde*/
.cta-image12 {
  background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/formaldehyde.png?v=1612841830");
  background-repeat: no-repeat;
  height: 295px;
  margin: 0; }

/*Sodium Laureth Sulfate*/
.cta-image13 {
  background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/sodium-laureth-sulfate.png?v=1612841830");
  background-repeat: no-repeat;
  height: 295px;
  margin: 0; }

/*Lanolin*/
.cta-image14 {
  background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/lanolin.png?v=1612841830");
  background-repeat: no-repeat;
  height: 295px;
  margin: 0; }

/*Botanicals*/
.cta-image15 {
  background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/botanicals.png?v=1612841830");
  background-repeat: no-repeat;
  height: 295px;
  margin: 0; }

/*Pthalates*/
.cta-image16 {
  background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/pthalates.png?v=1612841830");
  background-repeat: no-repeat;
  height: 295px;
  margin: 0; }

/*Cocamidopropyl Betaine*/
.cta-image17 {
  background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/cocamidopropyl-betaine.png?v=1612841830");
  background-repeat: no-repeat;
  height: 295px;
  margin: 0; }

.aboutirritants-hero-container {
  width: 100%;
  height: 360px;
  display: block;
  background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/about-irritants-hero.jpg?v=1612843855");
  background-size: cover;
  background-position: 20%;
  /*padding-top:115px;*/ }
  @media screen and (max-width: 768px) {
    .aboutirritants-hero-container {
      background-position: 39%; } }
  @media screen and (max-width: 480px) {
    .aboutirritants-hero-container {
      /*background-image:url('https://cdn.shopify.com/s/files/1/0524/5622/7007/files/about-skin-hero-mobile1.jpg?v=1612839610');*/
      background-image-repeat: no-repeat; } }

@media screen and (min-width: 2140px) {
  .aboutirritants-hero-container {
    padding-left: 115px;
    padding-top: 0; } }
@media screen and (min-width: 1680px) and (max-width: 2140px) {
  .aboutirritants-hero-container {
    padding-left: 115px;
    padding-top: 1%; } }
@media screen and (min-width: 1520px) and (max-width: 1680px) {
  .aboutirritants-hero-container {
    padding-left: 100px;
    padding-top: 26px; } }
@media screen and (min-width: 1401px) and (max-width: 1520px) {
  .aboutirritants-hero-container {
    padding-left: 61px;
    padding-top: 36px; } }
@media screen and (min-width: 855px) and (max-width: 1400px) {
  .aboutirritants-hero-container {
    padding-left: 61px;
    padding-top: 40px; } }
@media screen and (min-width: 768px) and (max-width: 855px) {
  .aboutirritants-hero-container {
    padding-left: 61px;
    padding-top: 6%; } }
@media screen and (min-width: 661px) and (max-width: 768px) {
  .aboutirritants-hero-container {
    padding-left: 30px;
    padding-top: 2%; } }
@media screen and (max-width: 660px) {
  .aboutirritants-hero-container {
    background-position: 35%;
    padding-top: 20px; } }
@media screen and (min-width: 520px) and (max-width: 650px) {
  .aboutirritants-hero-container {
    height: 340px;
    padding: 40px 20px 20px 20px; } }
@media screen and (min-width: 422px) and (max-width: 520px) {
  .aboutirritants-hero-container {
    height: 340px;
    padding: 30px 0 0 20px; } }
@media screen and (min-width: 320px) and (max-width: 421px) {
  .aboutirritants-hero-container {
    height: 340px;
    padding: 20px 0 0 20px; } }
.aboutirritants-hero-container2 {
  width: 100%;
  height: 172px;
  display: block;
  background-color: #F9F4EB;
  background-size: cover;
  background-position: 46%;
  /*padding-top:115px;*/
 /* @include respond($medium){
  background-position:39%;
  }

  @include respond(660px){
    background-position:35%;
  }

  @include respond(650px){
    height:260px;
  }

  @include respond($small){
    background-image-repeat:no-repeat;
  }*/ }

@media screen and (min-width: 1007px) {
  .aboutirritants-hero-container2 {
    height: 172px; } }
@media screen and (min-width: 817px) and (max-width: 1006px) {
  .aboutirritants-hero-container2 {
    height: 200px; } }
@media screen and (min-width: 713px) and (max-width: 816px) {
  .aboutirritants-hero-container2 {
    height: 230px; } }
@media screen and (min-width: 481px) and (max-width: 712px) {
  .aboutirritants-hero-container2 {
    height: 260px;
    min-height: 260px;
    max-height: 320px; } }
@media screen and (max-width: 855px) {
  .aboutirritants-hero-container2 {
    background-position: 39%; } }
@media screen and (max-width: 660px) {
  .aboutirritants-hero-container2 {
    background-position: 35%; } }
@media screen and (max-width: 480px) {
  .aboutirritants-hero-container2 {
    background-image-repeat: no-repeat; } }
/* Individual Content Pages Common Styles - for About Skin and About Irritants Subpages*/
.col-768 li {
  margin: .20em 0 1em 0; }

/* metafields subhead h2*/
.meta-subtitle h2, .meta-subtitle .h2, h2.meta-subtitle, .meta-subtitle.h2 {
  color: #535353;
  font-family: "Encode Sans";
  font-size: 22px;
  font-weight: 500;
  display: inline-block;
  padding: 0 0 10px 0;
  text-align: left; }

p.metafields {
  margin-bottom: 14px;
  font-weight: 400; }

p.metafields2 {
  margin-bottom: 34px; }

p.metafields3 {
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  letter-spacing: -.02em; }

ul.metafields3, .metafields3 li {
  font-size: 16px;
  font-weight: 400;
  line-height: 24px; }

ul.metafields3 {
  margin: 30px 0 5px 20px; }

/*.check-list.first {
    margin-right: 50px;
}
.check-list {
    list-style: none;
    padding: 0;
    margin: 0;
        margin-right: 0px;
    float: left;
    font-weight: 400;
}*/
.metafields3 li {
  background-image: url(https://cdn.shopify.com/s/files/1/0524/5622/7007/files/checkmark.png?v=1613607256);
  background-repeat: no-repeat;
  margin: 5px 0;
  padding: 4px 0 4px 30px;
  background-size: 16px;
  list-style-type: none;
  background-position-y: 3px; }

@media screen and (max-width: 480px) {
  p.metafields3, ul.metafields3, li.medtafields3 {
    font-size: 16px;
    font-weight: 400;
    line-height: 22px; } }
/*end-metafields subhead*/
@media screen and (max-width: 1280px) {
  #ap {
    margin: 0 20px 0 -10px; } }
/* Common styles for green box content on About Irritants individual pages (pages for each irritant) */
.green-content-box {
  font-family: "Encode Sans" sans-serif;
  background-color: #f4fafc;
  text-align: center;
  display: block;
  padding: 10px 60px 30px 60px; }

h4.experts, .experts.h4 {
  font-family: 'Encode Sans', sans-serif;
  color: #535353;
  font-weight: 500;
  font-size: 20px;
  line-height: 25px;
  margin: 15px 0; }

.expert-quote {
  font-family: 'Encode Sans', sans-serif;
  color: #3E9A76;
  font-weight: 400;
  font-size: 28px;
  line-height: 34px;
  display: block;
  margin: 34px 0 0 0; }

.attribution {
  font-family: 'Open Sans', sans-serif;
  color: #000;
  font-weight: 400;
  font-size: 14px;
  line-height: 20px;
  margin-bottom: 15px;
  display: block; }

/* End Individual Content Pages Common Styles */
/*"Atopic Eczema" page*/
.aboutskin-atopic-hero-container {
  width: 100%;
  height: 200px;
  display: block;
  background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/atopic-eczema-hero.jpg?v=1613356441");
  background-size: cover;
  background-position: 46%; }
  @media screen and (max-width: 768px) {
    .aboutskin-atopic-hero-container {
      background-position: 39%; } }
  @media screen and (max-width: 660px) {
    .aboutskin-atopic-hero-container {
      background-position: 35%; } }
  @media screen and (max-width: 650px) {
    .aboutskin-atopic-hero-container {
      height: 200px;
      padding-top: 40px; } }
  @media screen and (max-width: 480px) {
    .aboutskin-atopic-hero-container {
      background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/atopic-eczema-hero-mobile_fc0c8f28-5490-464e-a1de-3737cbf140d0.jpg?v=1613357112");
      background-image-repeat: no-repeat; } }

.as-wrap-indiv {
  max-width: 100%;
  max-width: 1400px;
  margin: 0 auto;
  padding: 2.5% 15px;
  height: 200px; }

/*#as-indiv-secondary {
	background-color:#F9F4EB;
    background-size:cover;
	width: 100%;
	height: 200px;
    margin: 0 0 0 -50%;
    background-position-x: 100%;
 
  @include respond($medium){
  background-position:39%;
  }
  
  @include respond (960px) {
  display:none;
  }
  
  @include respond(660px){
    background-position:35%;
  }

  @include respond(650px){
    height:200px;
    padding-top:40px;
  }

  @include respond($small){
    background-color:#F9F4EB;
  }    
}*/
.as-indiv-secondary-hero-container {
  width: 100%;
  height: 200px;
  display: block;
  background-size: cover;
  background-position: 46%; }
  @media screen and (max-width: 768px) {
    .as-indiv-secondary-hero-container {
      background-position: 39%;
      height: 320px;
      padding-top: 20px; } }
  @media screen and (max-width: 960px) {
    .as-indiv-secondary-hero-container {
      background-position: 36%;
      height: 300px;
      padding-top: 20px; } }
  @media screen and (max-width: 660px) {
    .as-indiv-secondary-hero-container {
      background-position: 35%; } }
  @media screen and (max-width: 650px) {
    .as-indiv-secondary-hero-container {
      height: 360px;
      padding-top: 20px; } }
  @media screen and (max-width: 480px) {
    .as-indiv-secondary-hero-container {
      /*background-color:#F9F4EB;*/
      height: 400px; } }
  @media screen and (max-width: 400px) {
    .as-indiv-secondary-hero-container {
      height: 460px;
      padding-top: 20px; } }
  @media screen and (max-width: 359px) {
    .as-indiv-secondary-hero-container {
      height: 500px;
      padding-top: 20px; } }
  @media screen and (max-width: 315px) {
    .as-indiv-secondary-hero-container {
      height: 600px;
      padding-top: 20px; } }

h2.as-exp-subhead2, .as-exp-subhead2.h2 {
  font-size: 26px;
  line-height: 32px;
  font-family: 'Encode Sans', sans-serif;
  color: #535353;
  font-weight: 500;
  display: block;
  padding: 1.5% 0;
  max-width: 1200px;
  letter-spacing: -.01em; }

h3.as-exp-subhead3, .as-exp-subhead3.h3 {
  font-size: 20px;
  line-height: 25px;
  font-family: 'Encode Sans', sans-serif;
  color: #535353;
  font-weight: 500;
  display: block;
  margin-top: 1%;
  max-width: 1140px; }

@media screen and (max-width: 640px) {
  h2.as-exp-subhead2, .as-exp-subhead2.h2 {
    font-size: 24px;
    line-height: 30px; }

  h3.as-exp-subhead3, .as-exp-subhead3.h3 {
    font-size: 18px;
    line-height: 24px;
    margin-top: 2.5%; } }
.as-bg1 {
  padding: 0 2%; }

@media screen and (max-width: 300px) {
  #as-exp1 {
    width: 280px; } }
/* "Contact Dermatitis" Page */
.aboutskin-cd-hero-container {
  width: 100%;
  height: 200px;
  display: block;
  background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/contact-dermatitis-hero.jpg?v=1613442707");
  background-size: cover;
  background-position: 46%; }
  @media screen and (max-width: 768px) {
    .aboutskin-cd-hero-container {
      background-position: 39%; } }
  @media screen and (max-width: 660px) {
    .aboutskin-cd-hero-container {
      background-position: 35%; } }
  @media screen and (max-width: 650px) {
    .aboutskin-cd-hero-container {
      height: 200px;
      padding-top: 40px; } }
  @media screen and (max-width: 480px) {
    .aboutskin-cd-hero-container {
      background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/contact-dermatitis-mobile.jpg?v=1613442919");
      background-image-repeat: no-repeat; } }

h2.as-exp-subhead2-cd, .as-exp-subhead2-cd.h2 {
  font-size: 26px;
  line-height: 32px;
  font-family: 'Encode Sans', sans-serif;
  color: #535353;
  font-weight: 500;
  display: block;
  padding: 3.25% 0;
  max-width: 1200px;
  letter-spacing: -.01em; }

@media screen and (max-width: 640px) {
  h2.as-exp-subhead2-cd, .as-exp-subhead2-cd.h2 {
    font-size: 24px;
    line-height: 30px; } }
/* "Seborrheic Dermatitis" Page */
.aboutskin-sd-hero-container {
  width: 100%;
  height: 200px;
  display: block;
  background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/seborrheic-dermatitis-hero.jpg?v=1613443855");
  background-size: cover;
  background-position: 46%; }
  @media screen and (max-width: 768px) {
    .aboutskin-sd-hero-container {
      background-position: 39%; } }
  @media screen and (max-width: 660px) {
    .aboutskin-sd-hero-container {
      background-position: 35%; } }
  @media screen and (max-width: 650px) {
    .aboutskin-sd-hero-container {
      height: 200px;
      padding-top: 40px; } }
  @media screen and (max-width: 480px) {
    .aboutskin-sd-hero-container {
      background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/seborrheic-dermatitis-mobile.jpg?v=1613443855");
      background-image-repeat: no-repeat; } }

h2.as-exp-subhead2-sd, .as-exp-subhead2-sd.h2 {
  font-size: 26px;
  line-height: 32px;
  font-family: 'Encode Sans', sans-serif;
  color: #535353;
  font-weight: 500;
  display: block;
  padding: 3.25% 0;
  max-width: 1200px;
  letter-spacing: -.01em; }

@media screen and (max-width: 640px) {
  h2.as-exp-subhead2-sd, .as-exp-subhead2-sd.h2 {
    font-size: 22px;
    line-height: 28px; } }
/* "Hand Dermatitis" Page */
.aboutskin-hd-hero-container {
  width: 100%;
  height: 200px;
  display: block;
  background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/hand-dermatitis-hero.jpg?v=1613445228");
  background-size: cover;
  background-position: 46%; }
  @media screen and (max-width: 768px) {
    .aboutskin-hd-hero-container {
      background-position: 39%; } }
  @media screen and (max-width: 660px) {
    .aboutskin-hd-hero-container {
      background-position: 35%; } }
  @media screen and (max-width: 650px) {
    .aboutskin-hd-hero-container {
      height: 200px;
      padding-top: 40px; } }
  @media screen and (max-width: 480px) {
    .aboutskin-hd-hero-container {
      background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/hand-dermatitis-mobile.jpg?v=1613445228");
      background-image-repeat: no-repeat; } }

h2.as-exp-subhead2-hd, .as-exp-subhead2-hd.h2 {
  font-size: 26px;
  line-height: 32px;
  font-family: 'Encode Sans', sans-serif;
  color: #535353;
  font-weight: 500;
  display: block;
  padding: 3.25% 0;
  max-width: 1200px;
  letter-spacing: -.01em; }

@media screen and (max-width: 640px) {
  h2.as-exp-subhead2-hd, .as-exp-subhead2-hd.h2 {
    font-size: 22px;
    line-height: 28px; } }
.as-wrap-indiv-hd {
  max-width: 1400px;
  margin: 0 auto;
  padding: 3.5% 15px;
  height: 200px; }

@media screen and (min-width: 1681px) {
  .as-wrap-indiv-hd {
    padding: 2.5% 15px; } }
/* "Children's Skin" Page */
.aboutskin-cs-hero-container {
  width: 100%;
  height: 200px;
  display: block;
  background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/childrens-skin-hero.jpg?v=1613446755");
  background-size: cover;
  background-position: 46%; }
  @media screen and (max-width: 768px) {
    .aboutskin-cs-hero-container {
      background-position: 39%; } }
  @media screen and (max-width: 660px) {
    .aboutskin-cs-hero-container {
      background-position: 35%; } }
  @media screen and (max-width: 650px) {
    .aboutskin-cs-hero-container {
      height: 200px;
      padding-top: 40px; } }
  @media screen and (max-width: 480px) {
    .aboutskin-cs-hero-container {
      background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/childrens-skin-mobile.jpg?v=1613446754");
      background-image-repeat: no-repeat; } }

h2.as-exp-subhead2-cs, .as-exp-subhead2-cs.h2 {
  font-size: 26px;
  line-height: 32px;
  font-family: 'Encode Sans', sans-serif;
  color: #535353;
  font-weight: 500;
  display: block;
  padding: 3.25% 0;
  max-width: 1200px;
  letter-spacing: -.01em; }

@media screen and (max-width: 640px) {
  h2.as-exp-subhead2-cs, .as-exp-subhead2-cs.h2 {
    font-size: 22px;
    line-height: 28px; } }
.as-wrap-indiv-cs {
  max-width: 1400px;
  margin: 0 auto;
  padding: 3.5% 15px;
  height: 200px; }

@media screen and (min-width: 1681px) {
  .as-wrap-indiv-cs {
    padding: 2.5% 15px; } }
/* "Adult Skin" Page */
.aboutskin-ads-hero-container {
  width: 100%;
  height: 200px;
  display: block;
  background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/adult-skin-hero.jpg?v=1613446754");
  background-size: cover;
  background-position: 46%; }
  @media screen and (max-width: 768px) {
    .aboutskin-ads-hero-container {
      background-position: 39%; } }
  @media screen and (max-width: 660px) {
    .aboutskin-ads-hero-container {
      background-position: 35%; } }
  @media screen and (max-width: 650px) {
    .aboutskin-ads-hero-container {
      height: 200px;
      padding-top: 40px; } }
  @media screen and (max-width: 480px) {
    .aboutskin-ads-hero-container {
      background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/adult-skin-mobile.jpg?v=1613446754");
      background-image-repeat: no-repeat; } }

h2.as-exp-subhead2-ads, .as-exp-subhead2-ads.h2 {
  font-size: 26px;
  line-height: 32px;
  font-family: 'Encode Sans', sans-serif;
  color: #535353;
  font-weight: 500;
  display: block;
  padding: 3.25% 0;
  max-width: 1200px;
  letter-spacing: -.01em; }

@media screen and (max-width: 640px) {
  h2.as-exp-subhead2-ads, .as-exp-subhead2-ads.h2 {
    font-size: 22px;
    line-height: 28px; } }
.as-wrap-indiv-ads {
  max-width: 1400px;
  margin: 0 auto;
  padding: 3.5% 15px;
  height: 200px; }

@media screen and (min-width: 1681px) {
  .as-wrap-indiv-ads {
    padding: 2.5% 15px; } }
/* About Irritants - "Fragrances & Perfumes" Page */
.aboutirritants-fragrances-hero-container {
  width: 100%;
  height: 200px;
  display: block;
  background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/fragrance-hero.jpg?v=1613526152");
  background-size: cover;
  background-position: 46%; }
  @media screen and (max-width: 768px) {
    .aboutirritants-fragrances-hero-container {
      background-position: 39%; } }
  @media screen and (max-width: 660px) {
    .aboutirritants-fragrances-hero-container {
      background-position: 35%; } }
  @media screen and (max-width: 650px) {
    .aboutirritants-fragrances-hero-container {
      height: 200px;
      padding-top: 40px; } }
  @media screen and (max-width: 480px) {
    .aboutirritants-fragrances-hero-container {
      background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/fragrance-mobile.jpg?v=1613526541");
      background-image-repeat: no-repeat; } }

.ai-indiv-secondary-hero-container {
  width: 100%;
  height: 200px;
  display: block;
  background-size: cover;
  background-position: 46%; }
  @media screen and (max-width: 1200px) {
    .ai-indiv-secondary-hero-container {
      padding-top: 8px; } }
  @media screen and (max-width: 768px) {
    .ai-indiv-secondary-hero-container {
      background-position: 39%;
      height: 300px;
      padding-top: 20px; } }
  @media screen and (max-width: 960px) {
    .ai-indiv-secondary-hero-container {
      background-position: 36%;
      height: 260px;
      padding-top: 20px; } }
  @media screen and (max-width: 660px) {
    .ai-indiv-secondary-hero-container {
      background-position: 35%; } }
  @media screen and (max-width: 650px) {
    .ai-indiv-secondary-hero-container {
      height: 300px;
      padding-top: 20px; } }
  @media screen and (max-width: 480px) {
    .ai-indiv-secondary-hero-container {
      /*background-color:#F9F4EB;*/
      height: 320px; } }
  @media screen and (max-width: 400px) {
    .ai-indiv-secondary-hero-container {
      height: 360px;
      padding-top: 20px; } }
  @media screen and (max-width: 359px) {
    .ai-indiv-secondary-hero-container {
      height: 420px;
      padding-top: 20px; } }
  @media screen and (max-width: 315px) {
    .ai-indiv-secondary-hero-container {
      height: 450px;
      padding-top: 20px; } }

@media screen and (min-width: 480px) {
  #as-exp1 {
    margin-top: 1%; } }
/*About Irritants "Color & Dye" page*/
.aboutirritants-color-dye-hero-container {
  width: 100%;
  height: 200px;
  display: block;
  background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/colors-and-dyes-hero.jpg?v=1613529412");
  background-size: cover;
  background-position: 46%; }
  @media screen and (max-width: 768px) {
    .aboutirritants-color-dye-hero-container {
      background-position: 39%; } }
  @media screen and (max-width: 660px) {
    .aboutirritants-color-dye-hero-container {
      background-position: 35%; } }
  @media screen and (max-width: 650px) {
    .aboutirritants-color-dye-hero-container {
      height: 200px;
      padding-top: 40px; } }
  @media screen and (max-width: 480px) {
    .aboutirritants-color-dye-hero-container {
      background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/colors-and-dyes-mobile.jpg?v=1613529561");
      background-image-repeat: no-repeat; } }

/* About Irritants - "Parabens" Page */
.aboutirritants-parabens-hero-container {
  width: 100%;
  height: 200px;
  display: block;
  background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/parabens-hero.jpg?v=1613531637");
  background-size: cover;
  background-position: 46%; }
  @media screen and (max-width: 768px) {
    .aboutirritants-parabens-hero-container {
      background-position: 39%; } }
  @media screen and (max-width: 660px) {
    .aboutirritants-parabens-hero-container {
      background-position: 35%; } }
  @media screen and (max-width: 650px) {
    .aboutirritants-parabens-hero-container {
      height: 200px;
      padding-top: 40px; } }
  @media screen and (max-width: 480px) {
    .aboutirritants-parabens-hero-container {
      background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/parabens-mobile.jpg?v=1613531246");
      background-image-repeat: no-repeat; } }

/* About Irritants - "Formaldehyde" Page */
.aboutirritants-formaldehyde-hero-container {
  width: 100%;
  height: 200px;
  display: block;
  background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/formaldehyde-hero.jpg?v=1613526152");
  background-size: cover;
  background-position: 46%; }
  @media screen and (max-width: 768px) {
    .aboutirritants-formaldehyde-hero-container {
      background-position: 39%; } }
  @media screen and (max-width: 660px) {
    .aboutirritants-formaldehyde-hero-container {
      background-position: 35%; } }
  @media screen and (max-width: 650px) {
    .aboutirritants-formaldehyde-hero-container {
      height: 200px;
      padding-top: 40px; } }
  @media screen and (max-width: 480px) {
    .aboutirritants-formaldehyde-hero-container {
      background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/formaldehyde-mobile_79a1a97e-0b6d-4063-924c-72f8fc06ac1e.jpg?v=1613533213");
      background-image-repeat: no-repeat; } }

h2.as-exp-subhead2f, .as-exp-subhead2f.h2 {
  font-size: 26px;
  line-height: 32px;
  font-family: 'Encode Sans', sans-serif;
  color: #535353;
  font-weight: 600;
  display: block;
  padding: 1% 0;
  max-width: 1200px;
  letter-spacing: -.01em; }

@media screen and (max-width: 640px) {
  h2.as-exp-subhead2f, .as-exp-subhead2f.h2 {
    font-size: 24px;
    line-height: 30px; } }
/* About Irritants - "SLS- Sodium Lauretn Sulfate" Page */
.aboutirritants-sls-hero-container {
  width: 100%;
  height: 200px;
  display: block;
  background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/sodium-laureth-sulfate-hero.jpg?v=1613526152");
  background-size: cover;
  background-position: 46%; }
  @media screen and (max-width: 768px) {
    .aboutirritants-sls-hero-container {
      background-position: 39%; } }
  @media screen and (max-width: 660px) {
    .aboutirritants-sls-hero-container {
      background-position: 35%; } }
  @media screen and (max-width: 650px) {
    .aboutirritants-sls-hero-container {
      height: 200px;
      padding-top: 40px; } }
  @media screen and (max-width: 480px) {
    .aboutirritants-sls-hero-container {
      background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/sodium-laureth-sulfate-mobile.jpg?v=1613526152");
      background-image-repeat: no-repeat; } }

h2.as-exp-subhead2s, .as-exp-subhead2s.h2 {
  font-size: 26px;
  line-height: 32px;
  font-family: 'Encode Sans', sans-serif;
  color: #535353;
  font-weight: 600;
  display: block;
  padding: 2.5% 0;
  max-width: 1200px;
  letter-spacing: -.01em; }

@media screen and (max-width: 640px) {
  h2.as-exp-subhead2s, .as-exp-subhead2s.h2 {
    font-size: 24px;
    line-height: 30px; } }
h3.as-exp-subhead3s, .as-exp-subhead3s.h3 {
  font-size: 20px;
  line-height: 25px;
  font-family: 'Encode Sans', sans-serif;
  color: #535353;
  font-weight: 600;
  display: block;
  margin-top: 0;
  max-width: 1140px; }

/* About Irritants - "Lanolin" Page */
.aboutirritants-lanolin-hero-container {
  width: 100%;
  height: 200px;
  display: block;
  background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/lanolin-hero.jpg?v=1613526152");
  background-size: cover;
  background-position: 46%; }
  @media screen and (max-width: 768px) {
    .aboutirritants-lanolin-hero-container {
      background-position: 39%; } }
  @media screen and (max-width: 660px) {
    .aboutirritants-lanolin-hero-container {
      background-position: 35%; } }
  @media screen and (max-width: 650px) {
    .aboutirritants-lanolin-hero-container {
      height: 200px;
      padding-top: 40px; } }
  @media screen and (max-width: 480px) {
    .aboutirritants-lanolin-hero-container {
      background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/lanolin-mobile.jpg?v=1613526152");
      background-image-repeat: no-repeat; } }

/* About Irritants - "Botanicals" Page */
.aboutirritants-botanicals-hero-container {
  width: 100%;
  height: 200px;
  display: block;
  background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/botanicals-hero.jpg?v=1613526152");
  background-size: cover;
  background-position: 46%; }
  @media screen and (max-width: 768px) {
    .aboutirritants-botanicals-hero-container {
      background-position: 39%; } }
  @media screen and (max-width: 660px) {
    .aboutirritants-botanicals-hero-container {
      background-position: 35%; } }
  @media screen and (max-width: 650px) {
    .aboutirritants-botanicals-hero-container {
      height: 200px;
      padding-top: 40px; } }
  @media screen and (max-width: 480px) {
    .aboutirritants-botanicals-hero-container {
      background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/botanicals-mobile.jpg?v=1613526152");
      background-image-repeat: no-repeat; } }

h2.as-exp-subhead2b, .as-exp-subhead2b.h2 {
  font-size: 26px;
  line-height: 32px;
  font-family: 'Encode Sans', sans-serif;
  color: #535353;
  font-weight: 600;
  display: block;
  padding: 4.2% 0 1%;
  max-width: 1200px;
  letter-spacing: -.01em; }

@media screen and (max-width: 640px) {
  h2.as-exp-subhead2b, .as-exp-subhead2b.h2 {
    font-size: 24px;
    line-height: 30px; } }
h3.as-exp-subhead3b, .as-exp-subhead3b.h3 {
  font-size: 20px;
  line-height: 25px;
  font-family: 'Encode Sans', sans-serif;
  color: #535353;
  font-weight: 600;
  display: block;
  margin-top: 0;
  max-width: 1140px; }

/* About Irritants - "Phthalates" Page */
.aboutirritants-phthalates-hero-container {
  width: 100%;
  height: 200px;
  display: block;
  background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/phthalates-hero.jpg?v=1613526152");
  background-size: cover;
  background-position: 46%; }
  @media screen and (max-width: 768px) {
    .aboutirritants-phthalates-hero-container {
      background-position: 39%; } }
  @media screen and (max-width: 660px) {
    .aboutirritants-phthalates-hero-container {
      background-position: 35%; } }
  @media screen and (max-width: 650px) {
    .aboutirritants-phthalates-hero-container {
      height: 200px;
      padding-top: 40px; } }
  @media screen and (max-width: 480px) {
    .aboutirritants-phthalates-hero-container {
      background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/phthalates-mobile.jpg?v=1613526152");
      background-image-repeat: no-repeat; } }

h2.as-exp-subhead2p, .as-exp-subhead2p.h2 {
  font-size: 26px;
  line-height: 32px;
  font-family: 'Encode Sans', sans-serif;
  color: #535353;
  font-weight: 600;
  display: block;
  padding: 4.2% 0 1%;
  max-width: 1200px;
  letter-spacing: -.01em; }

@media screen and (max-width: 640px) {
  h2.as-exp-subhead2p, .as-exp-subhead2p.h2 {
    font-size: 24px;
    line-height: 30px; } }
h3.as-exp-subhead3p, .as-exp-subhead3p.h3 {
  font-size: 20px;
  line-height: 25px;
  font-family: 'Encode Sans', sans-serif;
  color: #535353;
  font-weight: 600;
  display: block;
  margin-top: 0;
  max-width: 1140px; }

/* About Irritants - "CAPB" Page */
.aboutirritants-capb-hero-container {
  width: 100%;
  height: 200px;
  display: block;
  background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/cocamidopropyl-betaine-hero.jpg?v=1613526152");
  background-size: cover;
  background-position: 46%; }
  @media screen and (max-width: 768px) {
    .aboutirritants-capb-hero-container {
      background-position: 39%; } }
  @media screen and (max-width: 660px) {
    .aboutirritants-capb-hero-container {
      background-position: 35%; } }
  @media screen and (max-width: 650px) {
    .aboutirritants-capb-hero-container {
      height: 200px;
      padding-top: 40px; } }
  @media screen and (max-width: 480px) {
    .aboutirritants-capb-hero-container {
      background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/cocamidopropyl-betaine-mobile.jpg?v=1613526152");
      background-image-repeat: no-repeat; } }

h2.as-exp-subhead2cb, .as-exp-subhead2cb.h2 {
  font-size: 26px;
  line-height: 32px;
  font-family: 'Encode Sans', sans-serif;
  color: #535353;
  font-weight: 600;
  display: block;
  padding: 4.2% 0 1%;
  max-width: 1200px;
  letter-spacing: -.01em; }

@media screen and (max-width: 640px) {
  h2.as-exp-subhead2cb, .as-exp-subhead2cb.h2 {
    font-size: 24px;
    line-height: 30px; } }
h3.as-exp-subhead3cb, .as-exp-subhead3cb.h3 {
  font-size: 20px;
  line-height: 25px;
  font-family: 'Encode Sans', sans-serif;
  color: #535353;
  font-weight: 600;
  display: block;
  margin-top: 0;
  max-width: 1140px; }

/* "FAQ" Page */
/*See page template*/
/*"Products" main page*/
.products-hero-container {
  width: 100%;
  height: 360px;
  display: block;
  background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/products-hero.jpg?v=1613608918");
  background-size: cover;
  background-position: 46%;
  /*padding-top:115px;*/ }
  @media screen and (max-width: 768px) {
    .products-hero-container {
      background-position: 39%; } }
  @media screen and (max-width: 660px) {
    .products-hero-container {
      background-position: 35%; } }
  @media screen and (max-width: 650px) {
    .products-hero-container {
      height: 340px;
      padding-top: 40px; } }
  @media screen and (max-width: 480px) {
    .products-hero-container {
      background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/products-mobile.jpg?v=1613609145");
      background-image-repeat: no-repeat; } }

.products-bottom-hero-container {
  width: 100%;
  height: 360px;
  display: block;
  /*background-image:url('https://cdn.shopify.com/s/files/1/0524/5622/7007/files/product-philosphy-hero.jpg?v=1613546734');*
  background-size:cover;
  background-position:46%;
  /*padding-top:115px;*/
 /* @include respond(660px){
    background-position:35%;
  }

  @include respond(650px){
    height:340px;
    padding-top:0;
  }*/ }
  @media screen and (max-width: 768px) {
    .products-bottom-hero-container {
      background-position: 39%; } }
  @media screen and (max-width: 960px) {
    .products-bottom-hero-container {
      background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/Exederm_IntensiveMoisturizer_Products-Main.jpg?v=1618891941");
      background-repeat: no-repeat;
      background-size: cover;
      width: 100%;
      height: 360px;
      background-position: 60%; } }
  @media screen and (max-width: 480px) {
    .products-bottom-hero-container {
      background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/product-philosphy-mobile.jpg?v=1613547082");
      background-repeat: no-repeat;
      background-size: cover;
      width: 100%;
      height: 100%; } }

.as-wrap-products {
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 15px; }

@media screen and (max-width: 768px) {
  .as-wrap-products {
    padding: 2.5% 15px 0; } }
#products-bg {
  background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/Exederm_IntensiveMoisturizer_Products-Main.jpg?v=1618891941");
  background-repeat: no-repeat;
  background-size: cover;
  width: 100%;
  height: 360px;
  margin: 0 0 0 -50%;
  background-position-x: 80%; }
  @media screen and (max-width: 768px) {
    #products-bg {
      background-position: 39%; } }
  @media screen and (max-width: 960px) {
    #products-bg {
      display: none; } }
  @media screen and (max-width: 660px) {
    #products-bg {
      background-position: 35%; } }
  @media screen and (max-width: 650px) {
    #products-bg {
      height: 400px;
      padding-top: 40px; } }
  @media screen and (max-width: 480px) {
    #products-bg {
      background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/product-philosphy-mobile_7db7fc8e-03d2-4d5f-af54-5284a21a2d79.jpg?v=1618892327"); } }

/* Box image - "Eczema Care For Children" */
.cta-image18 {
  background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/eczema-care-for-babies-and-children.jpg?v=1613609784");
  background-repeat: no-repeat;
  height: 295px;
  margin: 0; }

/* Box image - "Eczema Care For Adults" */
.cta-image19 {
  background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/eczema-care-for-adults.jpg?v=1613609784");
  background-repeat: no-repeat;
  height: 295px;
  margin: 0; }

.prodtxt {
  font-size: 24px;
  line-height: 54px;
  font-weight: 400; }

@media screen and (max-width: 1200px) {
  .prodtxt {
    font-size: 22px;
    line-height: 52px;
    font-weight: 400; } }
@media screen and (max-width: 1180px) {
  .prodtxt {
    font-size: 20px;
    line-height: 50px;
    font-weight: 400; } }
@media screen and (max-width: 900px) {
  .prodtxt {
    font-size: 16px;
    line-height: 21px;
    font-weight: 400; } }
@media screen and (max-width: 640px) {
  .prodtxt {
    font-size: 13px;
    line-height: 16px;
    font-weight: 400; } }
#prod-exp1 {
  display: block;
  padding: 0 0 0 30px; }

@media screen and (max-width: 959px) {
  #prod-exp1 {
    display: block;
    padding: 20px; } }
.as-bg2-prod {
  display: block;
  padding: 0 10% 5%;
  background-color: rgba(255, 252, 250, 0); }

@media screen and (max-width: 1280px) {
  .as-bg2-prod {
    padding: 0; } }
@media screen and (max-width: 1200px) {
  .as-bg2-prod {
    padding: 4% 5% 0 1%; } }
@media screen and (max-width: 1000px) {
  #prod-exp1 {
    padding: 0 0 0 10px; }

  .cta-title, .basic-page h2, .basic-page .h2, .basic-page .h2 {
    font-size: 18px;
    font-weight: 600; } }
@media screen and (max-width: 960px) {
  .as-bg2-prod {
    display: block;
    padding: 5% 5% 10% 10%;
    background-color: rgba(255, 252, 250, 0.8);
    margin-top: 8.5%; }

  .prodtxt {
    font-size: 18px;
    line-height: 48px;
    font-weight: 400;
    letter-spacing: -.02em; } }
@media screen and (max-width: 640px) {
  .as-bg2-prod {
    display: block;
    padding: 0 10% 5%;
    background-color: rgba(255, 252, 250, 0.8); } }
@media screen and (max-width: 600px) {
  .as-bg2-prod {
    display: block;
    padding: 0 4% 4%;
    background-color: rgba(255, 252, 250, 0.8);
    margin-top: 18%; }

  .prodtxt {
    font-size: 16px;
    line-height: 46px;
    font-weight: 400; } }
@media screen and (min-width: 480px) {
  #prod-exp1 {
    margin-top: 1%; } }
@media screen and (min-width: 478px) and (max-width: 480px) {
  .as-bg2-prod {
    display: block;
    padding: 0 4% 4%;
    background-color: rgba(255, 252, 250, 0.8);
    margin-top: 5%; }

  .check {
    width: 20px; }

  #prod-exp1 {
    padding: 0 0 3% 2%; } }
@media screen and (max-width: 476px) {
  .as-bg2-prod {
    display: block;
    padding: 0 2% 2%;
    background-color: rgba(255, 252, 250, 0.8);
    margin-top: 4%; }

  .check {
    width: 20px; } }
@media screen and (max-width: 466px) {
  .as-bg2-prod {
    padding: 1% 2%;
    margin-top: 6%; } }
@media screen and (max-width: 465px) {
  .prodtxt {
    font-size: 15px;
    line-height: 45px;
    font-weight: 400; }

  .as-bg2-prod {
    padding: 1% 2%;
    margin-top: 6%; }

  .check {
    width: 17px; }

  .cta-title, .basic-page h2, .basic-page .h2, .basic-page .h2 {
    font-size: 16px;
    font-weight: 600; }

  .fa.fa-chevron-right {
    margin: 34px 18px 0 -30px !important; } }
@media screen and (max-width: 421px) {
  .as-bg2-prod {
    padding: 1% 2%;
    margin-top: 10%; }

  .prodtxt {
    font-size: 13px;
    line-height: 45px;
    font-weight: 400;
    letter-spacing: -.02em; } }
@media screen and (max-width: 300px) {
  #prod-exp1 {
    width: 280px; } }
/* "404" page */
#404 {
  padding: 20% 0;
  display: block;
  margin-left: auto;
  margin-right: auto;
  margin-top: 200px;
  font-family: 'Encode Sans' sans-serif;
  text-align: left; }

h1.not-found-title, .not-found-title.h1 {
  line-height: 28px;
  margin-bottom: 14px; }

h2.not-found, .not-found.h2 {
  font-family: 'Encode Sans' sans-serif;
  font-size: 22px;
  font-weight: 32px;
  color: #535353;
  text-align: left;
  padding-left: 0;
  line-height: 0;
  padding-bottom: 70px; }

/* "Home (Index)" Page */
#flare-section-left {
  margin: 0 auto; }

.flare-info-block {
  display: block;
  padding: 13% 5% 15% 40%;
  /* 13% 0 15% 52.5%*/
  text-align: left;
  max-width: 870px;
  margin-left: 5%; }

p.flare-info {
  margin-bottom: 15px;
  font-size: 20px;
  line-height: 29px;
  margin-top: 12px; }

@media screen and (max-width: 1600px) {
  .flare-info-block {
    padding: 20% 8% 8% 12.5%;
    max-width: 100%; } }
@media screen and (max-width: 1280px) {
  .flare-info-block {
    padding: 10%;
    max-width: 100%; } }
@media screen and (min-width: 769px) and (max-width: 1279px) {
  .flare-info-block {
    padding: 25% 8%;
    max-width: 100%;
    margin: auto auto;
    text-align: center; } }
@media screen and (max-width: 768px) {
  .flare-info-block {
    display: block;
    margin: auto auto;
    text-align: center;
    max-width: 640px;
    padding: 7% 4px 5% 4px;
    letter-spacing: -.02em;
    vertical-align: middle; }

  p.flare-info {
    margin-bottom: 30px;
    font-size: 20px;
    line-height: 29px;
    margin-top: 12px; } }
.flare1-hero-container {
  width: 100%;
  height: 466px;
  display: block;
  background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/flare-control-cream-two-thirds.jpg?v=1613787413");
  background-size: cover;
  background-position: 60%;
  /*padding-top:115px;*/
  /*@include respond($small){
    background-image:url('https://cdn.shopify.com/s/files/1/0524/5622/7007/files/about-skin-hero-mobile1.jpg?v=1612839610');
    background-image-repeat:no-repeat;
  }*/ }
  @media screen and (max-width: 768px) {
    .flare1-hero-container {
      background-position: 39%; } }
  @media screen and (max-width: 768px) {
    .flare1-hero-container {
      height: 300px; } }
  @media screen and (max-width: 660px) {
    .flare1-hero-container {
      background-position: 35%; } }
  @media screen and (max-width: 650px) {
    .flare1-hero-container {
      height: 340px;
      padding-top: 40px; } }

.flare2-hero-container {
  width: 100%;
  height: 466px;
  display: block;
  background-color: #F9F4EB;
  /*@include respond($small){
    background-image:url('https://cdn.shopify.com/s/files/1/0524/5622/7007/files/about-skin-hero-mobile1.jpg?v=1612839610');
    background-image-repeat:no-repeat;
  }*/ }
  @media screen and (max-width: 768px) {
    .flare2-hero-container {
      background-position: 39%; } }
  @media screen and (max-width: 768px) {
    .flare2-hero-container {
      height: 300px; } }
  @media screen and (max-width: 660px) {
    .flare2-hero-container {
      background-position: 35%; } }
  @media screen and (max-width: 650px) {
    .flare2-hero-container {
      height: 340px;
      padding-top: 40px; } }

/* Start "Why Exederm" homepage section */
.whyexederm-hero-container {
  width: 100%;
  min-height: 300px;
  display: block;
  background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/as-bg-3.png?v=1612826729");
  background-size: cover; }

.white-button {
  display: inline-block;
  padding: 8px 10px;
  margin: 0;
  line-height: 1.42;
  font-weight: bold;
  text-decoration: none;
  text-align: center;
  vertical-align: middle;
  white-space: nowrap;
  cursor: pointer;
  width: 200px;
  background-color: #fff;
  border: 2px solid #3e9a76;
  color: #3e9a76; }

/*#exederm-product-line img {
	 max-width: 100%;
  height: auto;
}*/
#exederm-product-line img {
  max-width: 700px;
  height: auto;
  margin: 0 auto !important;
  display: block; }

#exederm-product-line img {
  max-width: 100%;
  height: auto;
  margin: 0 auto !important;
  display: block;
  float: right; }

@media screen and (min-width: 1600px) {
  #exederm-product-line img {
    max-width: 700px;
    float: right; } }
@media screen and (max-width: 769px) {
  #exederm-product-line img {
    float: none; } }
#we-product-bullets {
  height: 360px;
  display: block;
  background-color: #F9F4EB; }

@media screen and (min-width: 640px) and (max-width: 769px) {
  #bullets-1 {
    display: none; }

  #bullets-2 {
    display: block; }

  #we-product-bullets {
    height: auto; } }
@media screen and (min-width: 770px) {
  #bullets-1 {
    display: block; }

  #bullets-2 {
    display: none; } }
@media screen and (min-width: 750px) and (max-width: 770px) {
  #we-product-bullets {
    padding-left: 4.5rem; } }
@media screen and (min-width: 720px) and (max-width: 749px) {
  #we-product-bullets {
    padding-left: 3rem; } }
@media screen and (min-width: 659px) and (max-width: 719px) {
  #we-product-bullets {
    padding-left: 2rem; } }
@media screen and (min-width: 640px) and (max-width: 658px) {
  #we-product-bullets {
    height: 100%; }

  #bullets-1 {
    display: block;
    margin-left: 20%; } }
@media screen and (max-width: 639px) {
  #bullets-1 {
    display: block; }

  #bullets-2 {
    display: none; } }
@media screen and (min-width: 575px) and (max-width: 639px) {
  #bullets-1 {
    display: block;
    margin-left: 18%; } }
@media screen and (min-width: 500px) and (max-width: 574px) {
  #bullets-1 {
    display: block;
    margin-left: 15%; } }
@media screen and (min-width: 440px) and (max-width: 499px) {
  #bullets-1 {
    display: block;
    margin-left: 13%; } }
@media screen and (min-width: 360px) and (max-width: 430px) {
  #bullets-1 {
    display: block;
    margin-left: 5%;
    min-width: 300px; } }
.white-button:hover, .white-button:active {
  background-color: #3e9a76;
  color: #fff;
  transition: .2s ease 0s; }

.whyexederm-block {
  margin: 75px auto;
  max-width: 850px;
  padding: 20px; }

h2.why-exederm, .why-exederm.h2 {
  color: #535353;
  font-weight: 600;
  font-size: 24px;
  line-height: 32px;
  display: block; }

/*end- "Why exederm" homepage section*/
/* "Shop All Products" section*/
.shop-all-products {
  text-align: center;
  margin: 0 auto 75px auto; }

/* "Find My Solution" page */
/*.fms-wrap {
	max-width: 100%;
	width: 1200px;
	margin: 0 auto;
}

.fms-container {
	width: 100%;
	display: block;
	max-width:1330px;
	}

.fms-content {
	position: relative;
	max-width: 100%;
	padding: 35px;
	width:550px;
	background-color: #e5f1f8;
	margin: auto auto;
	
}

.fms {
	padding-bottom:20px;
}

#fms-one {
background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/fms-cta.png?v=1613982506");
	max-width:100%;
	height:auto;
	min-height:500px;
	display: block;
	background-size: cover;
		padding-top:100px;
}*/
.fms-wrap {
  max-width: 100%;
  width: 1200px;
  margin: 0 auto; }

.fms-content {
  position: relative;
  max-width: 100%;
  padding: 40px 80px 35px 50px;
  width: 500px;
  height: 300px;
  background-color: #e5f1f8;
  margin: auto auto; }

.fms {
  padding-bottom: 20px; }

#fms-images {
  background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/fms-elbow.jpg?v=161390"), url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/fms-flarecream.png?v=1613903263");
  background-position: left top, right bottom;
  background-repeat: no-repeat, no-repeat;
  padding: 150px;
  height: 550px; }

@media screen and (min-width: 481px) and (max-width: 769px) {
  #fms-images {
    background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/left-elbow-image-3.jpg?v=1614127367"), url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/right-fc-cream-3.jpg?v=1614127824");
    height: 600px;
    padding: 150px 50px; }

  .fms-content {
    position: relative;
    max-width: 100%;
    padding: 35px 10px 15px 10px;
    width: 455px;
    height: 250px;
    background-color: #e5f1f8;
    margin: auto auto;
    text-align: center; }

  .fms {
    padding-bottom: 0; } }
@media screen and (max-width: 480px) {
  #fms-images {
    background-image: url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/left-elbow-image-3.jpg?v=1614127367"), url("https://cdn.shopify.com/s/files/1/0524/5622/7007/files/right-fc-cream-3.jpg?v=1614127824");
    height: 730px;
    padding: 200px 15px; }

  .fms {
    padding-bottom: 0; }

  .fms-content {
    position: relative;
    max-width: 100%;
    padding: 35px 15px 15px 15px;
    width: 360px;
    height: 280px;
    background-color: #e5f1f8;
    margin: auto auto;
    text-align: center; } }
/* Start "NEA" homepage section */
.nea-hero-container {
  width: 100%;
  min-height: 300px;
  display: block; }

.fa-star {
  color: #FEBD12;
  font-size: 30px !important;
  line-height: 40px; }

.nea-block {
  margin: 60px auto;
  max-width: 990px;
  padding: 20px; }

.nea {
  font-size: 16px;
  line-height: 32px !important; }

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

  .nea2 {
    display: none; } }
@media screen and (max-width: 768px) {
  .nea {
    display: none; }

  .nea2 {
    display: block; } }
.nea2 {
  font-size: 16px;
  line-height: 24px !important; }

/* End "NEA homepage section" */
/* retailers slideshow headline at bottom */
.retailers {
  text-align: center; }

@media screen and (max-width: 500px) {
  h2.retailer-slider-headline, .retailer-slider-headline.h2 {
    font-size: 22px; } }
/* -- End "Home" Page*/
/* "Collections List" template page */
#collection-list-grid {
  padding-left: 0 !important; }

/*Children & Babies page and Adults*/
#abc-hero {
  max-width: 1400px;
  margin: auto auto; }

.abc, h2.abc, .abc.h2, .abc h2, .abc .h2 {
  padding-left: 0; }

.shopify-policy__container {
  max-width: 100% !important;
  padding: 0 !important; }

.shopify-policy__title {
  display: none !important; }

.yotpo .main-widget .write-review .yotpo-header h2.y-label.yotpo-header-title, .yotpo .main-widget .write-review .yotpo-header .y-label.yotpo-header-title.h2 {
  font-size: 22px; }

.yotpo .main-widget .write-form #write-question-tabpanel h2.y-label.yotpo-header-title, .yotpo .main-widget .write-form #write-question-tabpanel .y-label.yotpo-header-title.h2 {
  font-size: 22px; }

.shopify-challenge__container {
  padding: 40px 0; }

.shopify-challenge__message {
  padding-bottom: 24px; }

.shopify-challenge__container .shopify-challenge__button.btn, .shopify-challenge__container .shopify-challenge__button.btn--secondary {
  margin-top: 24px; }

.metafield-rich_text_field p {
  margin-bottom: 1rem; }

.metafield-rich_text_field p:last-of-type {
  margin-bottom: 0; }