/* Fonts */

@font-face{
    font-family: 'baskerville';
    src: url('/assets/styles/webfonts/youngliving-modified-librebaskerville-regular-webfont.woff2') format('woff2'),
         url('/assets/styles/webfonts/youngliving-modified-librebaskerville-regular-webfont.woff') format('woff');
    font-weight: 400;
    font-style: normal;
}

@font-face{
    font-family: 'baskerville';
    src: url('/assets/styles/webfonts/youngliving-modified-librebaskerville-bold-webfont.woff2') format('woff2'),
         url('/assets/styles/webfonts/youngliving-modified-librebaskerville-bold-webfont.woff') format('woff');
    font-weight: 700;
    font-style: normal;
}


@font-face {
    font-family: 'montserrat';
    src: url('/assets/styles/webfonts/montserrat-extralight-webfont.woff2') format('woff2'),
         url('/assets/styles/webfonts/montserrat-extralight-webfont.woff') format('woff');
    font-weight: 200;
    font-style: normal;
}

@font-face {
    font-family: 'montserrat';
    src: url('/assets/styles/webfonts/montserrat-light-webfont.woff2') format('woff2'),
         url('/assets/styles/webfonts/montserrat-light-webfont.woff') format('woff');
    font-weight: 400; /* uses 300 weight montserrat */
    font-style: normal;
}

@font-face {
    font-family: 'montserrat';
    src: url('/assets/styles/webfonts/montserrat-regular-webfont.woff2') format('woff2'),
         url('/assets/styles/webfonts/montserrat-regular-webfont.woff') format('woff');
    font-weight: 700; /* uses 400 weight montserrat */
    font-style: normal;
}

@font-face {
    font-family: 'montserrat';
    src: url('/assets/styles/webfonts/montserrat-medium-webfont.woff2') format('woff2'),
         url('/assets/styles/webfonts/montserrat-medium-webfont.woff') format('woff');
    font-weight: 800; /* uses 500 weight montserrat */
    font-style: normal;
}





/* Bootstrap Bugs and Overrides */
.pagefooter a:hover, .pagefooter a:focus { text-decoration:initial; border-bottom:initial; }
a { color: #00aab3; }
a:hover, a:focus { border-bottom: 1px dotted #00aab3; }

body {
    font-family:baskerville, "Mrs Eaves", Garamond, "Apple Garamond", Georgia, serif;
	font-weight:400;
    color: #000;
    margin:0;
    background-color:#eeeeee;
}

.ng-cloak { display:none !important; }

.noselect { -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }


/* Global Layout */
.pagewrapper { max-width:1280px; margin:0 auto; -webkit-transition: margin .3s; transition: margin .3s; background-color:#fff; }
.pagemain { display:table; table-layout: fixed; width:100%; background-color:#fff; }
.pagecontent { display:table-cell; vertical-align:top; width:100%; }


/* Header */
.pageheader {
    font-family:montserrat, avenir, "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
	font-weight:400;
    display:block;
    position:relative;
    height:300px;
}

.header-content {
    position:absolute;
    width:100%;
    height:100%;
    background:url(/shared/fpo/header.jpg) #ccc no-repeat; background-size:cover;
    background-position:center center;
  -webkit-box-shadow: inset 0 0 40px rgba(0,0,0,.9);
  -moz-box-shadow: inset 0 0 40px rgba(0,0,0,.9);
  box-shadow: inset 0 0 40px rgba(0,0,0,.9);
}

.active .header-content:after {
    opacity: 1;
    /* -webkit-transition-delay: 0; */
    /* transition-delay: 0; */
}

.pageheader .logo {
    text-indent: -999em;
    background: url(/assets/styles/min/young-living.png) no-repeat;
    outline: none;
    position: absolute;
    top: 25px;
    left: 20px;
    width: 260px;
    height: 80px;
    z-index: 2;
    border-bottom: 0px;
    background-size: contain;
}

/* YL Logo */

.mobile-logo {
    display: none;
}

/* HEADER MENU BUTTON */
.header-menu-button {
    color: #fff;
    -webkit-appearance: none;
    background: none;
    border: 0;
    cursor: pointer;
    padding: 0;
    text-align: left;
    text-decoration: none;
    font-weight: normal;
    display: none;
    outline: none;
}

/* HAMBURGER BUTTON */

button.header-menu-button.c-hamburger {
	float:left;
}

.c-hamburger {
  display: none;
  position: relative;
  margin: 0;
  padding: 0;
  width:30px;
  height: 40px;
  font-size: 0;
  text-indent: -9999px;
  appearance: none;
  box-shadow: none;
  border-radius: none;
  border: none;
  cursor: pointer;
  transition: background 0.3s;
}

.c-hamburger:focus {
  outline: none;
}

.c-hamburger span {
  display: block;
  position: absolute;
  top: 24px;
  left: 0px;
  right: 0px;
  height: 4px;
  background: white;
  border-radius: 5px
}

.c-hamburger span::before,
.c-hamburger span::after {
  position: absolute;
  display: block;
  left: 0;
  width: 100%;
  height: 4px;
  background-color: #fff;
  content: "";
  border-radius: 5px
}

.c-hamburger span::before {
  top: -10px;
}

.c-hamburger span::after {
  bottom: -10px;
}

.c-hamburger--htx {
  background-color: none;
}

.c-hamburger--htx span {
  transition: background 0s 0.3s;
}

.c-hamburger--htx span::before,
.c-hamburger--htx span::after {
  transition-duration: 0.3s, 0.3s;
  transition-delay: 0.3s, 0s;
}

.c-hamburger--htx span::before {
  transition-property: top, transform;
}

.c-hamburger--htx span::after {
  transition-property: bottom, transform;
}

/* active state, i.e. menu open */
.c-hamburger--htx.is-active {
  background-color: none;
}

.c-hamburger--htx.is-active span {
  background: none;
}

.c-hamburger--htx.is-active span::before {
  top: 0;
  transform: rotate(45deg);
}

.c-hamburger--htx.is-active span::after {
  bottom: 0;
  transform: rotate(-45deg);
}

.c-hamburger--htx.is-active span::before,
.c-hamburger--htx.is-active span::after {
  transition-delay: 0s, 0.3s;
}

.header .menu ul {
  padding: 0;
  margin: 0;
}
.header .menu ul li {
  display: inline-block;
  float: left;
  list-style: none;
  padding: 0 0 0 5px;
  margin: 0;
}
.header .menuIcon {
  display: none;
  background: #000;
  width: 100%;
  text-align: center;
}
.header .menuIcon:hover {
  background: #999;
}
.header .menuIcon a {
  width: 100%;
  display: inline-block;
  color: #fff;
}
.header .menuIcon a img {
  vertical-align: middle;
}


.header-menu-button .icon-menu { display: inline-block; margin-right: 8px; vertical-align: top; }
/*.header-toolbar-div { position:absolute; left:0; display:none; height:100%; width:1px; background:#404040; }*/

/* COOKIE BANNER */
#cookie-alert p {
    text-align: center;
}

#cookie-message {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #5eaa42;
    color: #fff;
    font-family: "Montserrat", sans-serif;
    font-size: 13px;
    font-weight: 600;
    text-align: center;
    padding: 10px 40px;
    transition: top 250ms ease-in-out;
    z-index: 9998;
}

#cookie-message.is-active {
    background: #4CAF50;
    margin: 0px;
}

#cookie-message.is-active p {
    color: white;
    font-size: 22px;
    font-style: normal;
    display: block;
    -webkit-margin-before: 1em;
    -webkit-margin-after: 1em;
    -webkit-margin-start: 0px;
    -webkit-margin-end: 0px;
}

#cookie-message.is-active p a {
    color: midnightblue;
    display: inline !important;
    text-decoration: underline;
}

#cookie-message.is-active .btn {
    color: #0065a0;
    background-color: #fff;
    line-height: 42px;
    text-align: center;
    display: inline-block;
    margin: 0 auto;
    width: 190px;
}

/* HEADER TOOLBAR */
.header-toolbar { position:absolute; top:15px; left:0px; right:0px; height:40px; z-index:110; }

.header-toolbar a:hover {
    border-bottom: none;
}

.header-toolbar-items {
    height: 40px;
    float:right;
}
.header-toolbar-item {
    border-right: 1px solid rgba(255, 255, 255, .4);
    float: left;
    font-size:12px;
    height: 32px;
    margin:10px 0;
    position: relative;
    padding: 0 10px;
    text-align: left;
    z-index:2;
}

.header-toolbar-item.header-toolbar-notification:last-child {
    border-right:0;
}

.header-toolbar-item a {
    cursor: pointer;
}

.header-toolbar-item a:hover {
    border-bottom: none;
}

.icon-mail {
    font-size: 20px;
    display: inline;
    vertical-align: initial;
    background: none !important;
}
.icon-cart {
    font-size: 20px;
    display: inline;
    vertical-align: initial;
    background: none !important;
}
.header-toolbar-notification {
    position: relative;
    padding: 0 20px 0 0;
    margin: 10px;
}
.header-toolbar-notification a { display:block; padding:2px 0; color:#fff; text-decoration:none; }
.header-toolbar-badge-blue, .header-toolbar-badge-green {
    color:#fff;
    -webkit-border-radius:100px;
    border-radius:100px;
    font-family:montserrat, avenir, "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
	font-weight:700;
    font-size: 10px;
    padding: 3px;
    position: absolute;
    top: 0;
    right: 8px;
    line-height: normal;
    min-width: 20px;
    text-align: center;
    box-sizing: border-box;
}
.header-toolbar-badge-blue { background-color: #03cbe5; }
.header-toolbar-badge-green { background-color: #a0ba6f; }



/* Header Locale Selector */
.header-locale-button { display:block; font-size:14px; font-weight:normal; color:#fff; margin:0; width:80px; box-sizing:border-box; padding:2px 0px 2px 8px; vertical-align:top; line-height:20px; cursor:pointer; background:rgba(0,0,0,0.6); text-decoration:none; white-space: nowrap; /*border:2px solid #666; -webkit-border-radius:2px; border-radius:2px;*/ }
.header-locale-button:hover { color: #fff;} /* SS Added */
.header-locale-button:after { content:" "; display:inline-block; background:url(/assets/styles/min/drop-arrow.png) no-repeat; margin:0; height:20px; width:20px; vertical-align:top; background-position:center center; }
    .header-locale-button:before, .header-locale-option:before {
        content: " ";
        display: inline-block;
        background: url(/assets/styles/min/flag-sprites-new.png?v=5) no-repeat;
        margin: 0 4px 0 2px;
        height: 16px;
        width: 20px;
        vertical-align: top;
    }
.header-locale-option:before { margin: -3px 4px 0 0; }

.header-toolbar-locale .flag-globe:before { background-position: 0 -20px; }
.header-toolbar-locale .flag-us:before { background-position: 0 -40px; }
.header-toolbar-locale .flag-ca:before { background-position: 0 -60px; }
.header-toolbar-locale .flag-gb:before { background-position: 0 -80px; }
.header-toolbar-locale .flag-au:before { background-position: 0 -100px; }
.header-toolbar-locale .flag-at:before { background-position: 0 -120px; }
.header-toolbar-locale .flag-de:before { background-position: 0 -140px; }
.header-toolbar-locale .flag-mx:before { background-position: 0 -160px; }
.header-toolbar-locale .flag-es:before { background-position: 0 -180px; }
.header-toolbar-locale .flag-my:before { background-position: 0 -200px; }
.header-toolbar-locale .flag-sg:before { background-position: 0 -220px; }
.header-toolbar-locale .flag-jp:before { background-position: 0 -240px; }
.header-toolbar-locale .flag-se:before { background-position: 0 -260px; }
.header-toolbar-locale .flag-hk:before { background-position: 0 -280px; }
.header-toolbar-locale .flag-cz:before { background-position: 0 -300px; }
.header-toolbar-locale .flag-ec:before { background-position: 0 -340px; }
.header-toolbar-locale .flag-eu:before { background-position: 0 -320px; }
.header-toolbar-locale .flag-tw:before { background-position: 0 -360px; }
.header-toolbar-locale .flag-lt:before { background-position: 0 -400px; }
.header-toolbar-locale .flag-nl:before { background-position: 0 -420px; }
.header-toolbar-locale .flag-ro:before { background-position: 0 -440px; }
.header-toolbar-locale .flag-nz:before { background-position: 0 -520px; }
.header-toolbar-locale .flag-mo:before { background-position: 0 -580px; }
.header-toolbar-locale .flag-cr:before { background-position: 0 -600px; }
.header-toolbar-locale .flag-kr:before { background-position: 0 -620px; }
.header-toolbar-locale .flag-za:before { background-position: 0 -640px; }

.header-toolbar-locale .flag-ad:before { background-position: 0 -320px; }
.header-toolbar-locale .flag-al:before { background-position: 0 -320px; }
.header-toolbar-locale .flag-am:before { background-position: 0 -320px; }
.header-toolbar-locale .flag-az:before { background-position: 0 -320px; }
.header-toolbar-locale .flag-ba:before { background-position: 0 -320px; }
.header-toolbar-locale .flag-be:before { background-position: 0 -320px; }
.header-toolbar-locale .flag-bg:before { background-position: 0 -320px; }
.header-toolbar-locale .flag-by:before { background-position: 0 -320px; }
.header-toolbar-locale .flag-ch:before { background-position: 0 -320px; }
.header-toolbar-locale .flag-cy:before { background-position: 0 -320px; }
.header-toolbar-locale .flag-dk:before { background-position: 0 -320px; }
.header-toolbar-locale .flag-ee:before { background-position: 0 -320px; }
.header-toolbar-locale .flag-fi:before { background-position: 0 -380px; }
.header-toolbar-locale .flag-fo:before { background-position: 0 -320px; }
.header-toolbar-locale .flag-fr:before { background-position: 0 -480px; }
.header-toolbar-locale .flag-ge:before { background-position: 0 -320px; }
.header-toolbar-locale .flag-gi:before { background-position: 0 -320px; }
.header-toolbar-locale .flag-gl:before { background-position: 0 -320px; }
.header-toolbar-locale .flag-gr:before { background-position: 0 -320px; }
.header-toolbar-locale .flag-hr:before { background-position: 0 -320px; }
.header-toolbar-locale .flag-hu:before { background-position: 0 -320px; }
.header-toolbar-locale .flag-id:before { background-position: 0 -460px; }
.header-toolbar-locale .flag-ie:before { background-position: 0 -320px; }
.header-toolbar-locale .flag-is:before { background-position: 0 -320px; }
.header-toolbar-locale .flag-it:before { background-position: 0 -320px; }
.header-toolbar-locale .flag-kg:before { background-position: 0 -320px; }
.header-toolbar-locale .flag-kz:before { background-position: 0 -320px; }
.header-toolbar-locale .flag-li:before { background-position: 0 -320px; }
.header-toolbar-locale .flag-lu:before { background-position: 0 -320px; }
.header-toolbar-locale .flag-lv:before { background-position: 0 -320px; }
.header-toolbar-locale .flag-mc:before { background-position: 0 -320px; }
.header-toolbar-locale .flag-md:before { background-position: 0 -320px; }
.header-toolbar-locale .flag-me:before { background-position: 0 -320px; }
.header-toolbar-locale .flag-mk:before { background-position: 0 -320px; }
.header-toolbar-locale .flag-mt:before { background-position: 0 -320px; }
.header-toolbar-locale .flag-no:before { background-position: 0 -320px; }
.header-toolbar-locale .flag-pe:before { background-position: 0 -320px; }
.header-toolbar-locale .flag-ph:before { background-position: 0 -540px; }
.header-toolbar-locale .flag-co:before { background-position: 0 -560px; }
.header-toolbar-locale .flag-pl:before { background-position: 0 -320px; }
.header-toolbar-locale .flag-pt:before { background-position: 0 -320px; }
.header-toolbar-locale .flag-rs:before { background-position: 0 -320px; }
.header-toolbar-locale .flag-ru:before { background-position: 0 -500px; }
.header-toolbar-locale .flag-si:before { background-position: 0 -320px; }
.header-toolbar-locale .flag-sk:before { background-position: 0 -320px; }
.header-toolbar-locale .flag-sm:before { background-position: 0 -320px; }
.header-toolbar-locale .flag-tj:before { background-position: 0 -320px; }
.header-toolbar-locale .flag-tm:before { background-position: 0 -320px; }
.header-toolbar-locale .flag-tr:before { background-position: 0 -320px; }
.header-toolbar-locale .flag-ua:before { background-position: 0 -320px; }
.header-toolbar-locale .flag-uz:before { background-position: 0 -320px; }
.header-toolbar-locale .flag-th:before {
    background-position: 0 -720px;
}


/* We don't need all these flags.. let's stick with the flag sprite I created and just add more as needed. Each flag was designed separately for this sprite image to make sure we have clean/crisp edges */
/*
.header-toolbar-locale .flag-ad:before { background-position: 0 -20px; }
.header-toolbar-locale .flag-al:before { background-position: 0 -40px; }
.header-toolbar-locale .flag-am:before { background-position: 0 -60px; }
.header-toolbar-locale .flag-at:before { background-position: 0 -80px; }
.header-toolbar-locale .flag-au:before { background-position: 0 -100px; }
.header-toolbar-locale .flag-az:before { background-position: 0 -120px; }
.header-toolbar-locale .flag-ba:before { background-position: 0 -140px; }
.header-toolbar-locale .flag-be:before { background-position: 0 -160px; }
.header-toolbar-locale .flag-bg:before { background-position: 0 -180px; }
.header-toolbar-locale .flag-by:before { background-position: 0 -200px; }
.header-toolbar-locale .flag-ca:before { background-position: 0 -220px; }
.header-toolbar-locale .flag-ch:before { background-position: 0 -240px; }
.header-toolbar-locale .flag-cy:before { background-position: 0 -260px; }
.header-toolbar-locale .flag-cz:before { background-position: 0 -280px; }
.header-toolbar-locale .flag-de:before { background-position: 0 -300px; }
.header-toolbar-locale .flag-dk:before { background-position: 0 -320px; }
.header-toolbar-locale .flag-ee:before { background-position: 0 -360px; }
.header-toolbar-locale .flag-es:before { background-position: 0 -380px; }
.header-toolbar-locale .flag-fi:before { background-position: 0 -400px; }
.header-toolbar-locale .flag-fo:before { background-position: 0 -420px; }
.header-toolbar-locale .flag-fr:before { background-position: 0 -440px; }
.header-toolbar-locale .flag-gb:before { background-position: 0 -460px; }
.header-toolbar-locale .flag-ge:before { background-position: 0 -480px; }
.header-toolbar-locale .flag-gi:before { background-position: 0 -500px; }
.header-toolbar-locale .flag-gl:before { background-position: 0 -520px; }
.header-toolbar-locale .flag-gr:before { background-position: 0 -540px; }
.header-toolbar-locale .flag-hk:before { background-position: 0 -560px; }
.header-toolbar-locale .flag-hr:before { background-position: 0 -580px; }
.header-toolbar-locale .flag-hu:before { background-position: 0 -600px; }
.header-toolbar-locale .flag-ie:before { background-position: 0 -620px; }
.header-toolbar-locale .flag-is:before { background-position: 0 -640px; }
.header-toolbar-locale .flag-it:before { background-position: 0 -660px; }
.header-toolbar-locale .flag-jp:before { background-position: 0 -680px; }
.header-toolbar-locale .flag-kg:before { background-position: 0 -700px; }
.header-toolbar-locale .flag-kz:before { background-position: 0 -720px; }
.header-toolbar-locale .flag-li:before { background-position: 0 -740px; }
.header-toolbar-locale .flag-lt:before { background-position: 0 -760px; }
.header-toolbar-locale .flag-lu:before { background-position: 0 -780px; }
.header-toolbar-locale .flag-lv:before { background-position: 0 -800px; }
.header-toolbar-locale .flag-mc:before { background-position: 0 -820px; }
.header-toolbar-locale .flag-md:before { background-position: 0 -840px; }
.header-toolbar-locale .flag-me:before { background-position: 0 -860px; }
.header-toolbar-locale .flag-mk:before { background-position: 0 -880px; }
.header-toolbar-locale .flag-mt:before { background-position: 0 -900px; }
.header-toolbar-locale .flag-mx:before { background-position: 0 -920px; }
.header-toolbar-locale .flag-nl:before { background-position: 0 -940px; }
.header-toolbar-locale .flag-no:before { background-position: 0 -960px; }
.header-toolbar-locale .flag-pe:before { background-position: 0 -980px; }
.header-toolbar-locale .flag-pl:before { background-position: 0 -1000px; }
.header-toolbar-locale .flag-pt:before { background-position: 0 -1020px; }
.header-toolbar-locale .flag-ro:before { background-position: 0 -1040px; }
.header-toolbar-locale .flag-rs:before { background-position: 0 -1060px; }
.header-toolbar-locale .flag-ru:before { background-position: 0 -1080px; }
.header-toolbar-locale .flag-se:before { background-position: 0 -1100px; }
.header-toolbar-locale .flag-sg:before { background-position: 0 -1120px; }
.header-toolbar-locale .flag-si:before { background-position: 0 -1140px; }
.header-toolbar-locale .flag-sk:before { background-position: 0 -1160px; }
.header-toolbar-locale .flag-sm:before { background-position: 0 -1180px; }
.header-toolbar-locale .flag-tj:before { background-position: 0 -1200px; }
.header-toolbar-locale .flag-tm:before { background-position: 0 -1220px; }
.header-toolbar-locale .flag-tr:before { background-position: 0 -1240px; }
.header-toolbar-locale .flag-ua:before { background-position: 0 -1260px; }
.header-toolbar-locale .flag-us:before { background-position: 0 -1280px; }
.header-toolbar-locale .flag-uz:before { background-position: 0 -1300px; }
.header-toolbar-locale .flag-my:before { background-position: 0 -1340px; }
*/

.header-locale-menu { position:absolute; width:80px; top:24px; left:10px; background-color:rgba(0,0,0,0.8); list-style-type: none; margin:0; padding:8px 0px 5px 0px; display:none; opacity:0; overflow:hidden; -webkit-transition: opacity .3s; transition: opacity .3s; }
.header-locale-menu a, .header-user-menu a { color: #fff; display: block; padding:0; text-decoration: none; -webkit-transition: background .2s; transition: background .2s; padding: 4px 0 4px 10px; font-size:14px; line-height:14px; }
.header-locale-menu a:hover, .header-locale-menu a:focus, .header-user-menu a:hover, .header-user-menu a:focus { background-color: rgba(255, 255, 255, .5); color: #fff; } /* SS Added color */

.header-toolbar-locale.active .header-locale-menu { -webkit-box-shadow: 0 2px 6px rgba(0, 0, 0, .4); box-shadow: 0 2px 6px rgba(0, 0, 0, .4); display:block; opacity:1; }
.header-toolbar-locale.active .header-locale-button { background:rgba(0,0,0,0.8); }


/* Header Link */
.header-toolbar-signup a { display:inline-block; vertical-align:middle; color:#fff; line-height:24px; font-size:14px; text-decoration:none; }
.header-toolbar-signup a:hover { text-decoration:underline; color:#fff; }

.header-toolbar-signin a { display:inline-block; vertical-align:middle; color:#fff; line-height:24px; font-size:14px; text-decoration:none; }
.header-toolbar-signin a:hover { text-decoration:underline; color:#fff; }


/* User Menu */
.header-user-button { display:block; padding:2px 0 2px 2px; cursor:pointer; }
    .header-user-button:after {
        content: " ";
        display: inline-block;
        background: url(/assets/styles/min/drop-arrow.png) no-repeat;
        margin: 0;
        height: 20px;
        width: 20px;
        vertical-align: top;
        background-position: center center;
    }

.header-user-avatar { display:inline-block; width:20px; height:20px; margin-right:3px; vertical-align:middle; background:#666; }
.header-user-avatar img { display:block; width:20px; height:20px; }
.header-user-name { display:inline-block; vertical-align:middle; color:#fff; line-height:20px; font-size:14px; }
.header-user-menu a { padding-left:28px; }

.header-user-menu {
  background-color:rgba(0,0,0,0.8); display:none; overflow:hidden; padding:8px 0 8px 0; /*-webkit-transition: opacity .3s; transition: opacity .3s;*/
  /* For IE 8, Added by Jacob*/
  -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000)";
}
.header-toolbar-user.active .header-user-menu {
  -webkit-box-shadow: 0 2px 6px rgba(0, 0, 0, .4); box-shadow: 0 2px 6px rgba(0, 0, 0, .4); display:block;
}
.header-toolbar-user.active .header-user-button {
  background-color:rgba(0,0,0,0.8);
  /* For IE 8, Added by Jacob*/
  -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000)";
}



/* MAIN NAVIGATION */
/* Dropdown menus */
.nav-main > ul,
.nav-menu { list-style-type: none; margin: 0; padding: 0; }
.nav-main-outer { position:absolute; right:20px; top:68px; z-index:109; }
.nav-main { -webkit-box-sizing: border-box; box-sizing: border-box; padding:0;  }
.nav-main-top a { color: #fff; font-family:montserrat, avenir, "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif; font-weight:700; font-size: 17px; padding:0; text-decoration: none; text-shadow: 1px 2px 7px rgba(0, 0, 0, .5); }
.nav-main a:hover,
.nav-main a:focus { color: #b0c778; border-bottom: none; } /* SS Added Border Bottom */
.nav-menu a { display: inline-block; font-family:montserrat, avenir, "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif; font-weight:400; font-size: 16px; padding-top: 2px; white-space: nowrap; }
.nav-main-top { display: inline-block; position: relative; margin-left: 15px; }
.nav-main-top:first-child { margin-left: 0; }
.nav-main-top.home { display:none; }
.nav-menu {
    /*opacity: 0;*/
    display:none;
    max-height: 0; min-width: 160px;
    overflow: hidden; /* This is required for IE8 */
    padding-top:14px; position: absolute; top:100%; left: 0; -webkit-transition: opacity .3s; transition: opacity .3s;
}
.nav-menu li { display: block; margin-left: 0; }
.last .nav-menu { left: auto; right: 0; text-align: right; }

/* Hover */
/* .nav-main-top.enable-hover:hover > .nav-menu { display:block; max-height: 600px; } */

.channel-toolbar-links-1 { }
.channel-toolbar-links-2 { margin-bottom:10px; display:none; }
.channel-toolbar-link a { margin-bottom:5px; color:#fff; font-size:16px; }


/* PRODUCT SEARCH */
.search-form {
  position: relative;
}

#nav-product-search {
  height: 30px;
  padding: 0 6px;
  border-radius: 20px;
  vertical-align: middle;
}

.search-field {
    box-sizing:content-box;
  width: 60px;
  padding-left: 27px !important;
  background-color: rgb(0,0,0) !important;
  background-color: rgba(0,0,0,.3) !important;
  color: #fff !important;
  border: 1px solid rgba(255,255,255,.5) !important;
  font-size: 14px !important;
}

.nav-menu .search-field { margin-bottom: 4px; }

.search-field.long {
  width: 154px;
}


.btn-search {
  display: block;
  text-indent: -999em;
  background-image: url(/global/img/common/sprites.png);
  background-repeat: no-repeat;
  outline: none;
  position: absolute;
  top: 8px;
  left: 6px;
  width: 19px;
    box-sizing:content-box;
  height: 19px !important;
  background-position: 0 -124px;
}

.btn-search:hover {
  border: none !important;
}


/* SLIM HEADER */
.header-slim .nav-main,
.header-slim .header-social-links,
.header-slim .header-toolbar-items, 
.header-slim .header-toolbar-locale,
.header-slim .header-menu-button
{ 
  display: none; 
}


/* Breadcrumbs */
.breadcrumb-bar {
    color: #fff;
    font-size: 14px;
  display: block;
  position: absolute;
  bottom: 0;
  min-height: 30px;
  width: 100%;
  background: #000;
  background: rgba(0,0,0,.5);
    text-align: center;
    text-shadow: 0 1px 4px rgba(0, 0, 0, .8);
}
.breadcrumb-bar .sep {
    display: inline-block;
    margin: 0 4px;
}
.breadcrumb-bar a {
    display: inline-block;
    color: inherit;
    text-decoration: none;
    margin-top: 6px;
}
.breadcrumb-bar a:hover,
.breadcrumb-bar a:focus,
.breadcrumb-bar .active {
    color: #b0c778;
    border-bottom: none; display:inline-block; /* SS Added */
}
.breadcrumb-bar .active {
    font-weight: bold;
}


/* Footer */
.pagefooter { background: #b0c778 url(/shared/footer/footer-bg.jpg) left bottom no-repeat; color: #fff; font-size: 1.3em; padding-bottom: 30px; font-family:montserrat, avenir, "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif; font-weight:400; }
.pagefooter a { color: #fff; text-decoration: none; }
.pagefooter ul { list-style-type: none; margin: 0; padding: 0; }
.pagefooter h3 { margin: 0; padding: 0; color:#fff; font-size:30px; }

.pagefooter-content { margin: 0 auto; padding: 0 20px; max-width: 940px; min-height: 380px; position: relative; }
.pagefooter-cols:after { content: " "; clear: both; display: table; }
.pagefooter-col1,
.pagefooter-col2 { -webkit-box-sizing: border-box; box-sizing: border-box; float: left; width: 45%; }

.pagefooter-col1 .pagefooter-links { margin-right: 20px; margin-top: 36px; }
.pagefooter-col1 .pagefooter-links a { display: block; border-bottom: 1px dotted rgba(255, 255, 255, .8); padding: 4px 0; }

.pagefooter-col2 { background-color: rgba(255, 255, 255, .1); padding: 40px; width: 55%; }
.pagefooter-col2 h3 { border-bottom: 1px solid rgba(255, 255, 255, .6); margin-bottom: 4px; padding-bottom: 8px;}
.pagefooter-col2 .pagefooter-contact-info { border-top: 1px solid rgba(255, 255, 255, .6); font-size: .8em; padding-top: 12px; }
.pagefooter-col2 .pagefooter-contact-info li { margin-top: 6px; }
.pagefooter-col2 .pagefooter-contact-info p { color: #fff; } /* fix NVO bug*/
.pagefooter-col2 .pagefooter-contact-info li:first-child { margin-top: 0; }
.pagefooter-col2 .pagefooter-label,
.pagefooter-col2 .pagefooter-label-data { display:table-cell; }
.pagefooter-col2 .pagefooter-label { padding-right: 8px; text-align: right; width: 170px; }
.pagefooter-col2 .pagefooter-label-data { font-family:baskerville, "Mrs Eaves", Garamond, "Apple Garamond", Georgia, serif; font-weight:700; }
.pagefooter-col2 .pagefooter-label-data a { border-bottom: 1px dotted #fff; display: inline-block; margin-bottom: 6px; }

.pagefooter-copy { clear: both; font-size: .6em; margin-top:30px; text-align: center; width: 100%; }

.pagefooter .pagefooter-social-links { margin-top: 12px; overflow:hidden; }
.pagefooter-social-links li { display: inline-block; margin-left:0; }
.pagefooter-social-links li:first-child { margin-left: 0; }

ul.pagefooter-partner-links {
    list-style:none;
    margin:0;
}

ul.pagefooter-partner-links li {
    display:inline-block;
    list-style:none;
    margin:25px 15px;
}

/* swiched back to PNG sprites
let's use the existing icons and style already in place on live site for footer social icons
.pagefooter-social-links .ico { color: #dceeaf; font-size: 2.2em; text-shadow: 0 0 12px rgba(0, 0, 0, .05); }
.pagefooter-social-links .ico:hover,
.pagefooter-social-links .ico:focus { color: #fff; }
*/

.pagefooter-social-links a { display:block; text-indent:-999em; background-image:url(/shared/footer/social-sprites.png?v=2); background-repeat:no-repeat; width:48px; height:48px; opacity:0.7; outline:none; }
.pagefooter-social-links a:hover { opacity:1.0 }
.pagefooter-social-links a:hover { border: none; }
.pagefooter-social-links a.cms-selected { background-color:rgba(255,0,0,0.5); border-radius:4px; }

.footericon-facebook { background-position: 0 -50px; }
.footericon-twitter { background-position: 0 -100px; }
.footericon-linkedin { background-position: 0 -150px; }
.footericon-youtube { background-position: 0 -200px; }
.footericon-feed { background-position: 0 -250px; }
.footericon-blog { background-position: 0 -300px; }
.footericon-vimeo { background-position: 0 -350px; }
.footericon-pinterest { background-position: 0 -400px; }
.footericon-instagram { background-position: 0 -450px; }


/* Left Channel Navigation */
.leftnav { display:table-cell; vertical-align:top; width:240px; padding-top:30px; background-color:#e2f8f9; }

/*
 Need to discuss changing layout to float instead of table.. currently this is breaking the site.
.leftnav { float: left; width:25%; padding-top:30px; background-color:#e2f8f9; }
*/


ul.leftnav-1 { margin:0 0 30px 20px; padding:0; list-style:none; width:220px; box-sizing:border-box; }

ul.leftnav-1 > li { list-style:none; margin:0; padding:0; border-top:1px solid #d4e1e2;  display:block; }
ul.leftnav-1 > li:first-child { border-top:1px solid #a7bf69; }
ul.leftnav-1 > li:last-child { border-bottom:1px solid #a7bf69; }
ul.leftnav-1 > li > a, .left-cat-1 { display:block; font-family:montserrat, avenir, "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif; font-weight:700; font-size:19px; line-height:20px; color:#000; text-decoration:none; padding:13px 5px 12px 0px; }
ul.leftnav-1 > li > a { border-bottom: none; } /* SS Added */
ul.leftnav-1 > li > a:hover { color:#839D57; }
ul.leftnav-1 > li.leftnav-active > a { color:#839D57; }
ul.leftnav-1 > li.leftnav-active > a.navSubItems { padding-bottom:5px; }

ul.leftnav-2 { margin:0 0 20px 0px; padding:0; list-style:none; width:220px; box-sizing:border-box; display:none; }
ul.leftnav-1 > li.leftnav-open ul.leftnav-2 { display:block; }
ul.leftnav-2 > li { list-style:none; margin:0; padding:0; display:block; position:relative; }
ul.leftnav-2 > li a { display:block; font-family:montserrat, avenir, "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif; font-weight:400; font-size:16px; line-height:22px; color:#00aab3; text-decoration:none; padding:0px 5px 0px 0px; }
ul.leftnav-2 > li a { border-bottom: none; } /* SS Added */
ul.leftnav-2 > li a:hover { color:#000; }
ul.leftnav-2 > li.leftnav-active > a { color:#000; }
ul.leftnav-2 > li a:hover:before, ul.leftnav-2 > li.leftnav-active a:before { content:" "; display:block; position:absolute; left:-12px; top:6px; width:8px; height:10px; background:url(/shared/leftnav/arrow.png) no-repeat; }


/* Banner Area */
.pagebanner { display:block; padding:40px; background-color:#f6f6f6; }
.pagebanner .headline { display:block; }
.pagebanner h1 { font-family:montserrat, avenir, "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif; font-weight:200; margin:0; padding:0; line-height:normal; font-size:70px; color:#839D57; }

.header-toolbar { -webkit-transition:left 0.3s; transition:left 0.3s; z-index: 10000000;}

.icon-angle-right {
    display: none;
}

/* Responsive Styles */

@media (max-width: 1024px) {
  .pageheader .logo  {
    width:220px;
    height:80px;
  }
}

@media (max-width: 979px) { /* Changed from 979 due to too many top menus */

    /* YL Logo */
    .header-locale-option:before { margin: 2px 4px 0 0; }

    .header-content.mobile-hide, .pagebanner.mobile-hide, .breadcrumb-bar.mobile-hide {
      display: none !important;
    }

    .nfr .pageheader.mobile-hide {
       height: 0px !important;
     }

    .page-alert {
       margin-top: 108px;
    }

    .pageheader.mobile-hide {
      height: 106px !important;
    }

    .mobile-logo {
        display: block;
        float: left;
        width: 30px;
        margin: 10px;
    }

    /*.title-area {
      display: none;
    }*/
    /*.pagemain, .signin-container {
      margin-top: 108px;
    }*/

    .icon-mail {
        font-size: 26px;
        margin-top: 5px;
    }
    .icon-cart {
        font-size: 26px;
    }
    .c-hamburger {display: block;}

    .header-locale-menu { left:2px; }
    .header-locale-button { width:auto; }

    .pagebanner { padding:30px; display: none; }
    .pagebanner h1 { font-size: 60px; }
    .header-toolbar { background-color:#000; height: 55px; border-bottom: 2px solid #b0c778; width:100%; position:fixed; top:0; right:0; }
    .pageheader { height:280px; }
    .pageheader .logo  { top:25px; }
    .header-content { top:40px; height:240px;}

    .leftnav { display:none; }

    .channel-toolbar-links-2 { display:block; }

    .pagewrapper { margin:0; }

    .header-locale-button { border:0; padding:2px 0px 2px 0px; }

    /* Sidebar menu */
    .header-menu-button { display:block; font-size: 46px; margin-right: 20px;}
    .header-user-button { display: inline-block; }

    .nav-main-outer {
        background: #1e1e20;
        position: fixed;
        height: 100%;
        right:auto;
        top:0;
        -webkit-transition: left 0.3s; transition: left 0.3s;
        -webkit-box-shadow: inset 0 0 20px rgba(0,0,0,.6); -moz-box-shadow: inset 0 0 20px rgba(0,0,0,.6); box-shadow: inset 0 0 20px rgba(0,0,0,.6);
    }

    .nav-main {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        display:block;
        position:absolute;
        width:100%;
        top:56px;
        bottom:0;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        padding-bottom: 50px;
    }

    .nav-main::-webkit-scrollbar { width:10px; }
    .nav-main::-webkit-scrollbar-button { height:0; }
    .nav-main::-webkit-scrollbar-track  { }
    .nav-main::-webkit-scrollbar-track-piece { /*background-color:rgba(255,255,255,0.1); -webkit-border-radius:4px; border-radius:4px;*/ }
    .nav-main::-webkit-scrollbar-thumb { background:rgba(255,255,255,0.1); -webkit-border-radius:5px; border-radius:5px; }
    .nav-main::-webkit-scrollbar-corner { background-color:#006; }
    .nav-main::-webkit-resizer  {  }


    .nav-main-top.home { display:block; }
    .nav-main-top { display:block; padding:0; margin:0; border-bottom:1px solid #404040; }
    .nav-main-top > a { display:block; padding:10px 20px !important; line-height:24px; }
    .nav-main-top a { text-shadow:none; }

    .nav-main-top:hover > a, .nav-main-top:focus > a {
        padding-bottom: 8px;
         
        color: #fff;
    }

    .nav-main .selected > a { color: #b0c778 !important;}

    .nav-menu {
        line-height:25px;
        padding-top:40px;
        background: #333333;
    }
    .nav-menu, .last .nav-menu {
        padding-top: 0;
        position: relative;
        top: auto;
        left: auto;
        right: auto;
        text-align: left;
    }
    .nav-menu li { margin:0; }
    .nav-menu .nav-menu li:last-child { padding-bottom: 8px; }
    .nav-menu .nav-menu li:first-child { border-top: none;}
    .nav-menu a {
        padding: 10px 20px 10px 40px !important;
        border-bottom: 1px solid #404040 !important;;
    }
    .nav-menu .nav-menu a { font-size: 14px; }
    .nav-menu { display: block; max-height:0; }

    .active > .nav-menu {
      opacity: 1;
      max-height: 100% !important;
      transition: max-height 0.8s;
      -webkit-transition: max-height 0.8s;
      -moz-transition: max-height 0.8s;
    }

    /* Move User Nav to Top of Slideout Menu */
    .header-toolbar-user { border: 0; -webkit-box-sizing: border-box; box-sizing: border-box; margin: 0 20px; padding: 8px 8px 0 0; height: 40px; width:230px; position:fixed; left:-270px; top:0; z-index:11; -webkit-transition:left 0.3s; transition:left 0.3s; }
    /*.navopen .header-toolbar-user { left: 0; }*/
    /*.navopen .pagewrapper { margin:0 -270px 0 270px; }*/
    .navopen .nav-main-outer { left:0; }
    /*.navopen .header-toolbar { left:270px; }*/
    .navopen body,
    .navopen { overflow:hidden; height: 100%; width: 100%; }

    .nav-menu .nav-menu a {padding:10px 60px !important; background: #555555;}

    .menu {
        max-height: 0;
        overflow: hidden;
        float: none;
        text-align: center;
        width: 100%;
        -webkit-transition: max-height 0.3s;
        -moz-transition: max-height 0.3s;
        transition: max-height 0.3s;
        z-index: 1000000;
    }
    .menu.menuOpen {
        max-height: 1000px;
        -webkit-transition: max-height 0.3s;
        -moz-transition: max-height 0.3s;
        transition: max-height 0.3s;
    }
    .menu ul li {
        display: block;
        width: 100%;
        background: none;
    }
    .menu ul li a {
        color: #fff;
        padding: 10px 0;
        width: 100%;
        text-align: left;
        cursor: pointer;
        box-sizing: border-box;
    }
    .menuIcon {
        display: inline-block;
    }
    .icon-angle-right {
        display: block;
        float: right;
        font-size: 26px;
        width: initial;
        height: initial;
    }

    .nav-main li > a .icon-angle-right {
      -ms-transform: rotate(90deg); /* IE 9 */
      -webkit-transform: rotate(90deg); /* Chrome, Safari, Opera */
      transform: rotate(90deg);
      -webkit-transition: -webkit-transform .3s; /* Safari */
      transition: transform .3s;
    }
    .nav-main li.active > a .icon-angle-right {
      -ms-transform: rotate(-90deg) translate(0,-2px); /* IE 9 */
      -webkit-transform: rotate(-90deg) translate(0,-2px); /* Chrome, Safari, Opera */
      transform: rotate(-90deg) translate(0,-2px);
      -webkit-transition:  -webkit-transform .3s; /* Safari */
      transition: transform .3s;
    }

    .nav-main-top.language-selector {
      border-bottom: none;
    }
    .nav-main-top.language-selector a {
      font-size: 14px;
      font-weight: 300;
      text-align: center;
    }

     .nav-main-top.language-selector a .icon-angle-right {
      display: inline-block;
      float: none;
      font-size: 18px;
      margin: 0 0 0 10px;
      vertical-align: middle;
    }

    .nav-main-top.language-selector .nav-menu a {
      padding: 10px 20px 10px 0px !important;
    }

    .nav-main-top a.login {
      color: #00C5D1;
    }
    .nav-main-top a.logout {
      color: #ff9500;
    }

    /* Mobile - White Nav Styles */
    a.drop-down {
      background: #ffffff; /* Old browsers */ /* FF3.6-15 */ /* Chrome10-25,Safari5.1-6 */
      background: -webkit-linear-gradient(#ffffff 0%, #e5e5e5 100%);
      background: -o-linear-gradient(#ffffff 0%, #e5e5e5 100%);
      background: linear-gradient(#ffffff 0%, #e5e5e5 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
      display: block;
      margin: 0;
      border-bottom: 2px solid #d0d0d0;
      position: fixed;
      z-index: 999999;
      top: 54px;
      padding: 0px;
      bottom: initial;
      padding: 15px 20px 10px 20px !important;
      width: 100%;
      color: #808080;
      font-family:montserrat, avenir, "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
	  font-weight:700;
      font-size: 18px;
      cursor: pointer;
      line-height: 26px;
      box-sizing: border-box;
    }

    a.drop-down:hover {
      color: #808080;
      border-bottom: none;
    }

    a.drop-down span.section-title {
      position: absolute;
      top: 0;
      font-size: 10px;
      line-height: inherit;
      padding: 0;
    }

    a.drop-down .icon-angle-right {
      -ms-transform: rotate(90deg);
      -webkit-transform: rotate(90deg);
      transform: rotate(90deg);
      -webkit-transition: -webkit-transform .3s;
      transition: transform .3s;
    }

    a.drop-down.menuOpen .icon-angle-right {
      -ms-transform: rotate(-90deg) translate(0,-2px);
      -webkit-transform: rotate(-90deg) translate(0,-2px);
      transform: rotate(-90deg) translate(0,-2px);
      -webkit-transition: -webkit-transform .3s;
      transition: transform .3s;
    }

    .nav-main-outer.secondary-menu {
      background: #e6e6e6;
      position: fixed;
      height: 100%;
      right: auto;
      -webkit-transition: left 0.3s;
      transition: left 0.3s;
      -webkit-box-shadow: inset 0 0 0 rgba(0,0,0,0);
      -moz-box-shadow: inset 0 0 0 rgba(0,0,0,0);
      box-shadow: inset 0 0 0 rgba(0,0,0,0);
    }

    .secondary-menu {
      max-height: 0;
      overflow: hidden;
      float: none;
      width: 100%;
      -webkit-transition: max-height 0.3s;
      -moz-transition: max-height 0.3s;
      transition: max-height 0.3s;
      z-index: 100001;
    }

    .secondary-menu.menuOpen {
      max-height: 1000px;
      -webkit-transition: max-height 0.3s;
      -moz-transition: max-height 0.3s;
      transition: max-height 0.3s;
    }

    .secondary-menu .nav-main {
      top: 105px;
    }

    .secondary-menu .nav-main > ul {
        border-top: 2px solid #d0d0d0 !important;
    }

    .secondary-menu .nav-main-top {
      border-bottom: 1px solid #fff;
    }

    .secondary-menu .nav-main-top a {
      text-align: left;
      color: #808080;
    }

    .secondary-menu .nav-menu {
      line-height: 25px;
      background: #f2f2f2;
      border-top: none;
    }
    .secondary-menu .nav-menu a{
      width: 100%;
      border-bottom: 1px solid #fff !important;
    }

     .secondary-menu .nav-main-top.er-widget {
      border-bottom: none;
      margin-top: 15px;
    }

    .secondary-menu .nav-main-top.er-widget a {
      color: #00C5D1;
      font-weight: normal;
    }
}

@media (max-width: 767px) {
    .pagebanner { padding:30px; }
    .pagebanner .headline { }
    .pagebanner h1 { font-size: 40px; }
    .pageheader { height: 215px; }
    .pageheader .logo  { top:20px; left:50%; width:208px; height:64px; margin-left:-104px; }

    .header-content { height:160px; top: 55px;}

    .header-toolbar-signup { display:none; }
    .header-toolbar-signin { display:none; }
    .header-toolbar-items { margin-right:10px; }

    .pagefooter-col1,
    .pagefooter-col2 { background-color: transparent; float: none; padding-left: 0; padding-right: 0; width: auto; }
    .pagefooter-col1 .pagefooter-links { margin-right: 0; padding-top: 20px; }
}

@media only screen and (max-width: 479px) {
    .pagefooter-col2 .pagefooter-label,
    .pagefooter-col2 .pagefooter-label-data { display: block; text-align: left; }
    .pagefooter-col2 .pagefooter-label { margin-bottom: 2px; margin-top: 8px; }
    .pagefooter-copy { position: relative; bottom: auto; }
    .pagefooter { padding-bottom: 8px; }
    .pageheader .logo  { top:20px; width:130px; height:40px; margin-left:-65px; }
}

/* IE8 */
.lt-ie9 .search-field {
  border: 1px solid #eee !important;
  color: #eee !important;
  background-color: transparent !important;
  padding-top: 8px !important;
  height: 22px !important;
  width: 44px;
}

.lt-ie9 .search-field.long {
  width: 140px;
}

@media (max-width: 480px) {
    .header-toolbar-locale { display: none;}
}


/*** VIDEO GRID ***/
.video-grid {
	font-size:0; /* prevents space between inline blocks */
}

.video-grid-item {
    vertical-align: top;
}

.video-modal-close {
	text-align:right;
}
.video-modal-close:after {
	content:'\00d7';
	font-family:montserrat,avenir,"Helvetica Neue",Arial,Helvetica,Geneva,sans-serif;
	font-weight:400;
	font-size:46px;
	color:#fff;
	cursor:pointer;
	display:inline-block;
	vertical-align:middle;
	padding:5px;
}

.video-grid-item-thumbnail {
	position:relative;
	background:#ccc;
}
.video-grid-item-thumbnail:before {
	content:' ';
	display:block;
	position:absolute;
	border:1px solid rgba(0,0,0,0.2);
	top:0;
	width:100%;
	height:100%;
}

.video-grid-item-thumbnail:after {
	content:' ';
	display:block;
	position:absolute;
	width:50px;
	height:50px;
	top:50%;
	left:50%;
	margin:-25px 0 0 -25px;
	background:url('/shared/components/video-grid/play-button-50px.png') no-repeat;
	background-position:center center;
	opacity:0.6;
}

.video-grid-item-thumbnail:hover:after {
	opacity:0.8;
}

.video-grid-item-thumbnail img {
	background-color:#666;
	display:block;
	max-width:100%;
	height:auto;
}

.video-grid-item-thumbnail.is-playing-inline {
	background:#000;
}

.video-grid-item-thumbnail.is-playing-inline img {
	opacity:0;
}

.video-grid-item-thumbnail.is-playing-inline:before,
.video-grid-item-thumbnail.is-playing-inline:after {
	display:none;
}


.video-grid-item-caption {
	font-size:14px;
	text-align:center;
	padding-top:5px;
}

.video-grid-3column .video-grid-container {
	margin-right:-25px;
	margin-bottom:-15px;
}

.video-grid-3column .video-grid-item {
	display: inline-block;
	width:33.33333%;
	padding-right:25px;
	padding-bottom:15px;
}

@media screen and (max-width: 767px) {
	.video-grid-3column .video-grid-container {
		margin-right:-20px;
	}
	.video-grid-3column .video-grid-item {
		padding-right:20px;
		width: 50%;
		text-align:center;
	}
	.video-grid-item-thumbnail {
		display:inline-block !important;
		vertical-align:middle;
	}
	}


@media screen and (max-width: 640px) {
	.video-grid-3column .video-grid-container {
		margin-right:0;
		margin-bottom:0;
	}
	.video-grid-item {
		width: 100% !important;
		text-align:center;
		padding-right:0 !important;
	}
}