@charset "utf-8";



/* Fonts */

 @import url('https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700'); 



/* Common */

body {margin: 0 auto;}

img {border: none; margin: 0; padding: 0; vertical-align: bottom;}

.clear {clear: both; height: 0;}

.clearfix::after {display: table; content: ''; clear: both;}

.tr3 {transition: all ease-in 0.3s;	-moz-transition: all ease-in 0.3s;	-o-transition: all ease-in 0.3s; -webkit-transition: all ease-in 0.3s;}

.bxs {box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;}

#tmpShell {width: 100%; background: #fff; overflow: hidden; font-family: 'Open Sans', Arial, sans-serif; color: #444;}

.tmpIn {width: 960px; margin: 0 auto;}



/* Header */

header#hdr {height: 110px; position: relative; text-align: center;}

#followLink {position: absolute; left: 0; top: 40%;}

.btnBl a {padding: 10px 15px; font: 600 13px 'Open Sans', Arial, sans-serif; text-decoration: none;}

.btnBl a:link, .btnBl a:visited {background: #729cfe; border: 1px solid #5e89ed; color: #fff;}

.btnBl a:hover {background: #5e89ed; border: 1px solid #4c77dc; color: #fff;}

#followLink a span {padding-left: 20px; background: url(../images/iconpluswhite.svg) no-repeat left center; background-size: auto 15px;}

#logo {

    display: inline-block;

    padding: 10px 30px 20px 30px;

    border-radius: 0 0 10px 10px;

    -moz-border-radius: 0 0 10px 10px; 

    -webkit-border-radius: 0 0 5px 5px; 

    background: #fff; 

    box-shadow: 0 0 10px #777;

}

#logo img {width: 240px;}

#logo img:hover {opacity: 0.8;}

#askQuestion {position: absolute; right: 0; top: 40%;}

#askQuestion a span {padding-left: 20px; background: url(../images/iconque.svg) no-repeat left center; background-size: auto 15px;}



/* Promo Banner */

#promoBan {background: #f6f6f6; border-top: dashed 2px #ccc;}

#promoBanIn {padding: 20px 0 10px 0;}

#promoBanImg {float: left; width: 15%;}

#promoBanImg img {width: 100%;}

#promoBanTxt {float: left; width: 85%; padding: 20px; padding-right: 0;}

#promoBanTxt span {display: block; padding-bottom: 10px; font-weight: 600; font-size: 22px;}

#promoBanTxt a {display: inline-block; float: right; margin-top: 10px; text-align: right; text-decoration: none; text-transform: uppercase; font-size: 15px;}



/* Content Area */

.contArea {margin-top: 15px; background: #fff;}



/* Gallery */

#gallBlock {float: left; width: 550px; overflow: hidden;}

#gallBlock #gallImages {width: 550px;}

#gallBlock #gallImages .lrgImg {display: none; min-height: 550px;}

#gallBlock #gallImages .lrgImg .imgLgIn {display: table-cell; vertical-align: middle; text-align: center; width: 550px; height: 550px; background: #f6f6f6;}

#gallBlock #gallImages .lrgImg .imgLgIn img {max-width: 100%; max-height: 100%;}

#gallBlock #gallImages .lrgImg .imgLgIn video {width: 100%;}

#gallBlock #gallImages input {display: none;}

#gallBlock #gallThumbs {text-align: left;}

#gallBlock #gallThumbs label {float: left; display: block; width: 87.5px; margin: 0; margin-top: 5px; margin-right: 5px; padding: 0;}

#gallBlock #gallThumbs label .imgSmIn {display: table-cell; vertical-align: middle; text-align: center; width: 86px; height: 86px; background: #f6f6f6;}

#gallBlock #gallThumbs label .imgSmIn img {/*max-width: 100%; max-height: 100%;*/ width: 100%; height: 100%; vertical-align: bottom;}

#gallBlock #gallThumbs label:nth-child(6) {margin-right: 0;}

#gallBlock label:hover {cursor: pointer;}

#gallBlock input:checked + label {background: #f6f6f6;}

#gallBlock #img1:checked ~ #imgblock1, 

#gallBlock #img2:checked ~ #imgblock2,

#gallBlock #img3:checked ~ #imgblock3, 

#gallBlock #img4:checked ~ #imgblock4, 

#gallBlock #img5:checked ~ #imgblock5, 

#gallBlock #img6:checked ~ #imgblock6 {display: block;}

#gallBlock .hideImg {display: none !important;}



/* Benefits */

#benefits {margin-top: 10px;}

.benCell {float: left; width: 23.5%; height: 170px; padding: 15px; background: #f1f1f1; text-align: center;}

.benCell img {height: 60px; margin-bottom: 15px;}

.benTxt {font-size: 12px; font-weight: 600;}

.benTxt span {display: block; font-size: 16px;}

.benSpace {float: left; width: 2%; height: 170px; position: relative; padding-top: 65px;}

.benSpace img {width: 360%; z-index: 500; margin-left: -130%;}



/* Title */

#prTitle {padding-bottom: 10px;}

#prTitle span {font: 600 18px 'Open Sans', Arial, sans-serif;}



/* Specifications */

#specsBlock {float: right; width: 395px;}

#specsBlock ul {margin: 0; padding: 0; list-style: none;}

#specsBlock ul li {padding: 3px 0; font-size: 13px; color: #555;}

#specsBlock ul li .specsHd {margin-top: 10px; padding-top: 10px; font-size: 14px; font-weight: 600; color: #5f88ea; text-transform: uppercase; border-top: 1px solid #eee;}

#specsBlock ul li:first-child, #specsBlock ul li:first-child .specsHd {margin-top: 0;}

#specsBlock ul li::after {display: table; content: ''; clear: both;}

#specsBlock ul li span {float: right; font-weight: 400; color: #555;}

#specsBlock ul li.specLine {font-weight: 600; font-size: 16px; color: #444;}

#specsBlock ul li.specLine span {font-weight: 600;}

#specsBlock ul li#oldPrice {margin-top: 10px; padding-top: 10px; border-top: 1px solid #eee;}

#specsBlock ul li#oldPrice span {text-decoration: line-through;}

#specsBlock ul li#redPrice span {color: #f00;}



/* Policy */

#polTabs {display: flex; flex-wrap: wrap; margin-top: 10px; padding-bottom: 10px; background: #fff; border: 1px solid #efefef;}

#polTabs label {

	display: block;

    padding: 15px 0; 

    font: 600 14px 'Open Sans', Arial, sans-serif;  

    text-align: center; 

    color: #999;

    cursor: pointer;

    background: #f7f7f7;

    box-sizing: border-box; 

    -moz-box-sizing: border-box; 

    -webkit-box-sizing: border-box;

}

#polTabs label[for="polTab1"] {width: 20% !important;}

#polTabs label[for="polTab2"] {width: 20% !important;}

#polTabs label[for="polTab3"] {width: 20% !important;}

#polTabs label[for="polTab4"] {width: 20% !important;}

#polTabs label[for="polTab5"] {width: 20% !important;}

#polTabs .polTabContent {

    display: none; 

    order: 99; 

    flex-grow: 1; 

    width: 100%;

    padding: 15px;

    font: 400 13px 'Open Sans', Arial, sans-serif;

    color: #555;

    text-align: justify;

    line-height: 20px;

}

#polTabs input[type="radio"] {display: none;}

#polTabs input[type="radio"]:checked + label {background: #fff; color: #5179d8;}

#polTabs input[type="radio"]:checked + label + .polTabContent {display: block;}

#polTabs .polSpace {padding-top: 15px;}

#polTabs .polHd {margin-bottom: 5px; font: 600 17px 'Open Sans', Arial, sans-serif;}

#polTabs .polTabContent a {text-decoration: none; font-weight: 600;}

#polTabs .polTabContent a:link, #polTabs .polTabContent a:visited {color: #5179d8;}

#polTabs .polTabContent a:hover {color: #111;}

#polTabs span {font-weight: 600; color: #333;}



/* Footer */

footer#foot {margin-top: 15px; background: #ececec;}



/* Lab Logos */

 #labLogos {padding: 15px 0;}

.labLg {float: left; width: 20%; padding: 5px 5px 5px 70px;}

#labLg1 {background: url(../images/labgia.png) no-repeat left center; background-size: auto 60px;}

#labLg2 {background: url(../images/labegl.png) no-repeat left center; background-size: auto 60px;}

#labLg3 {background: url(../images/labagi.png) no-repeat left center; background-size: auto 60px;}

#labLg4 {background: url(../images/labdgi.png) no-repeat left center; background-size: auto 60px;}

#labLg5 {background: url(../images/labigl.png) no-repeat left center; background-size: auto 60px;}

.labTxt {font-size: 8px; color: #666; text-transform: uppercase;}

.labNm {font-size: 30px; font-weight: 600; font-variant: normal; color: #333;} 



/* Credit */

#footBot {padding: 10px 0; border-top: 1px solid #f7f7f7;}

#creditNote {float: left; font: 400 10px 'Open Sans', Arial, sans-serif; color: #555; letter-spacing: 1px; line-height: 28px;}

#creditNote img {width: 12px; vertical-align: middle;}

#pmtImg {float: right; line-height: 30px;}

#pmtImg img {height: 25px; margin-left: 10px;}