@font-face {
  font-family: 'BebasKai-Regular';
  src: url('/fonts/BebasKai-Regular.otf');
}
@font-face {
  font-family: 'HelveticaNeueLTCom';
  src: url('/fonts/HelveticaNeueLTCom-Lt.ttf');
}

/*nav*/
.acneTopNav { box-shadow: 0 1px 10px -5px #000; position: relative;   /*margin-top:20px;*/ z-index: 99; float:left; width:100%;background-color: #fff; font-family: 'HelveticaNeueLTCom';}
#navMenu{padding: 0px 25px;float:left; }
.centerHold {  margin: 0 auto;    max-width: 950px; }
.acneTopNav #navMenu a, .acneTopNav #navMenu span { color:black; float: left;position:relative; z-index: 999999 !important;}
.acneTopNav #navMenu p { margin: 0;    padding: 10px 15px; font-weight:bold;}
#navMenu ul {       background: #5cccd0 none repeat scroll 0 0;    height: 80px;    left: 3px;    margin: 0;    padding: 0 10px;    position: absolute;    top: 30px;    width: 100px;    z-index: 999999 !important; display:none;}
#navMenu ul li{	list-style:none;	padding:10px 0;}
#navMenu span:hover ul {display:block}
.justifyLeft { text-align:left;}

/*nav*/


#DinairFluid {font-family: 'Lato', sans-serif; }
.header1Main { font-size:3em;    margin: 5% 0 3%; }
.header2Main, p.mobileFont, .mobileFont { font-size:1.4em !important;  font-weight:300; }
.header3Main, ol li { font-weight:300;font-size:1.4em; }

.header2Main, .header3Main, .header1Main { font-family: 'Raleway' !important; }

.dinairBtn{    -moz-appearance: none;    color: #fff;    margin: 0 auto;    padding: 1% 3%;    text-align: center;    width: 72%; margin-top: 4%;}
.dinairBtn:hover{ cursor:pointer; background:#fff; }
/* IE10+ */ 
/*.redGradiantBtn, .redGradiantBtn:hover { font-weight:700;font-family: 'HelveticaNeueLTCom';margin-bottom:5%; border-radius: 10px; font-size:2em;border:#f18750  2px solid; background-image: -ms-linear-gradient(top, #FFFFFF 0%, #F77568 50%, #5fccd1  100%);*/

.redGradiantBtn, .redGradiantBtn:hover { font-weight:700;font-family: 'Lato';margin-bottom:5%; border-radius: 10px; font-size:2em;border: #FFFFFF  2px solid; background-image: -ms-linear-gradient(top, #FFFFFF 0%, #EC008C 50%, #EC008C  100%);

/* IE10+ */ 
background-image: -ms-linear-gradient(top, #FFFFFF 0%, #EC008C 20%, #EC008C 75%, #EC008C 87.5%, #EC008C 93.75%, #EC008C 96.875%, #EC008C 100%);

/* Mozilla Firefox */ 
background-image: -moz-linear-gradient(top, #FFFFFF 0%, #EC008C 20%, #EC008C 75%, #EC008C 87.5%, #EC008C 93.75%, #EC008C 96.875%, #EC008C 100%);

/* Opera */ 
background-image: -o-linear-gradient(top, #FFFFFF 0%, #EC008C 20%, #EC008C 75%, #EC008C 87.5%, #EC008C 93.75%, #EC008C 96.875%, #EC008C 100%);

/* Webkit (Safari/Chrome 10) */ 
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #FFFFFF), color-stop(20, #EC008C), color-stop(75, #EC008C), color-stop(87.5, #EC008C), color-stop(93.75, #EC008C), color-stop(96.875, #EC008C), color-stop(100, #EC008C));

/* Webkit (Chrome 11+) */ 
background-image: -webkit-linear-gradient(top, #FFFFFF 0%, #EC008C 20%, #EC008C 75%, #EC008C 87.5%, #EC008C 93.75%, #EC008C 96.875%, #EC008C 100%);

/* W3C Markup */ 
background-image: linear-gradient(to bottom, #FFFFFF 0%, #EC008C 20%, #EC008C 75%, #EC008C 87.5%, #EC008C 93.75%, #EC008C 96.875%, #EC008C 100%);
}
.redGradiantBtn a{ color:#fff !important;}




.orangeGradiantBtn, .orangeGradiantBtn:hover { font-weight:700;font-family: 'HelveticaNeueLTCom';margin-bottom:5%; border-radius: 10px; font-size:2em;border:#f05a4c  2px solid; background-image: -ms-linear-gradient(top, #FFFFFF 0%, #F77568 50%, #5fccd1  100%);

/* Mozilla Firefox */ 
background-image: -moz-linear-gradient(top, #f59890 0%, #f05a4c  20%, #f9ebe4  100%);

/* Opera */ 
background-image: -o-linear-gradient(top, #f59890 0%, #f05a4c  20%, #f9ebe4  100%);

/* Webkit (Safari/Chrome 10) */ 
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #f59890), color-stop(20, #f05a4c ), color-stop(100, #f05a4c ));

/* Webkit (Chrome 11+) */ 
background-image: -webkit-linear-gradient(top, #f59890 0%, #f05a4c  20%, #f05a4c  100%);

/* W3C Markup */ 
background-image: linear-gradient(to bottom, #f59890 0%, #f05a4c  20%, #f05a4c  100%);
}
.orangeGradiantBtn a{ color:#fff !important;}




.acneBlue { color:#5fccd1}
ul.kitBullet{  font-size:1.2em; list-style:none; padding:0;}
ul.kitBullet li {padding:.5% 0;}
.blackBorderBtn{ color:#000; background:#fff; border:solid 1px #000; border-radius: 0; font-size:1.5em; border-radius:20px;}
.blackBorderBtn:hover, #kitToggleLearn:hover, #kitToggleLearn.activeSelectBtn, .outterLearn:hover  #kitToggleLearn { background:#FFBE6D; color:#fff;}
#kitToggleLearn:hover { background-color: black !important; border:solid 1px black;  }
#kitToggleLearn {  background:#FCD5A9 !important; cursor: pointer;  }
#kitToggleLearn.activeSelectBtn { color: black; }


#kitToggleLearn2:hover #kitToggleLearn { background-color: #5CCCD0 !important; border:solid 1px black; color: white;  }

/*#kitToggleLearn{ background:#000; color:#fff; float:left; width:98%;padding:1%; font-size:1.5em; margin:5% 0 0 0; font-weight:700}*/
.addToCartBtnKit { color:#fff !important; border-color:#fda980; background: #ffb48f !important;}
/*#kitToggleLearn {   border-radius:20px; background: #000 none repeat scroll 0 0;    border: 3px solid #000;    color: #fff;    font-size: 1.5em;  margin: 5% auto 0;    padding: 1%;    text-align: center;    width: 97%;}
*/
#kitToggleLearn {    background: #5CCCD0 none repeat scroll 0 0;    border: 1px solid black;    border-radius: 20px;    color: black;    float: left;    font-size: 1.5em;    margin: 28% 0 1% 43%;    padding: 0.5%;    text-align: center;    width: 20%;}

#kitToggleOpen{ display:none;  padding:1% 5%;  float:left; width:89.8%; border:solid 1px #dcdada; margin-top:95px;}
section { margin-top:2%;float:left; width:100%;position:relative;}
.kitTitles { padding:  0 ;} 
.table2Column {    margin:0;width: 45% ; border-bottom:1px solid #dcdada; border-right:1px solid #dcdada; padding:0 2% 1% 0;float:left; text-align:center; transition: width .2s;}
.table2Column:nth-child(2n+1) { border-right: 0 none;}

#kitToggleOpen .table2Column:nth-child(2n+1) {padding:0 2% 1% 5%}
.largeCircle { -moz-border-bottom-colors: none; -moz-border-left-colors: none; -moz-border-right-colors: none; -moz-border-top-colors: none; border-color: #000; border-radius: 20px; border-style: solid; border-width: 1px; height: 30px; margin: 10% auto; width: 30px;}
.compressSwat { float: left; font-size: 10px; height: 55px; padding: 2%; text-align: center; width: 10%;}
.selectionShadeSwa { float: left;    height: 32%;    margin: 2% 1% 0;    width: 31%;}
.selectionShadeSwa img {display: block;    margin: 0 auto;}
#FairSwat, #MediumSwat, #TanSwat, #DarkSwat, #DeepSwat {  margin-top:2%;float:left; width:100%;}
.topImg { position:absolute; top: -9.2%; left: 21%; -webkit-transition-delay: 1s; /* Safari */    transition-delay: .2s;}
.table2Column > input {    display: none;}
.table2Column .largeCircle {    margin: 1% auto;}
.table2Column p:nth-child(odd) {    font-size: 1em !important;    margin-top: -3%;}
#kitToggleOpen .table2Column {    height: 420px;}
.selectionShadeSwa div span {    display: block;    margin: 0 auto;    text-align: center !important;}
.selectionShadeSwa:nth-child(3n+1) img, .selectionShadeSwa:nth-child(3n+1) div {    float: right;}
.selectionShadeSwa:nth-child(3n+3) img, .selectionShadeSwa:nth-child(3n+3) div  {    float: left;}
.selectionShadeSwa:nth-child(7n) {    margin-left: 15%;}
.selectionShadeSwa span:nth-of-type(2n+1) {    font-weight: 700;margin-bottom: 10px;}
.selectionShadeSwa span:nth-of-type(2n) {    color: #5f6062;}
#footerBarTop {background-color:#5fccd1; }
#compressorSelected{ margin:0% auto 0%; display:block;max-width:50% !important;}

.movieTextHere { margin-top:0%;}
#headerDesktopBottom { display:;}
@media (max-width:850px){
#compressorSelected { margin:0 auto;}
#compressorSelected img { max-width:80%}
}

@media (max-width:780px){
.topImg { position:absolute; top: -1.2%; left: 21%; -webkit-transition-delay: 1s; /* Safari */    transition-delay: .2s;}
}

@media (max-width:750px){
.table2Column,.table2Column:nth-child(2n+1), .table2Column:nth-child(n+7)  { width:100%;  border-bottom: 1px solid #404040; border-right:0;  height:auto;   padding: 3% 0; float:left; overflow:hidden;}
.topImg { position:absolute; top: 1%;}
.header1Main {  font-size:3.3em }
.topImg { top:5%}
#kitToggleOpen .table2Column { height:auto;}
#navMenu ul li{	list-style:none;	padding:20px 0 0px 0;}
#navMenu { padding: 0 5px;}
.movieTextHere { margin-top:10%;}
#kitToggleLearn {
    margin-top: 38%;
    width: 50%;
}
}
@media (max-width:600px){
.header1Main {  font-size:3.1em }
#kitToggleOpen{ display:none;  padding:1% 5%;  float:left; width:89.8%; border:solid 1px #000; margin-top:10px;}
.compressSwat {    height: 55px;    padding: 2%;    width: 15%;}
.acneTopNav #navMenu p { padding: 10px 9px; font-size:1em}	
/*#kitToggleLearn { width:98%;}*/
#kitToggleOpen { border:0;}
.kitTitles { padding: 5% 0 ;}
.acneTopNav {display:none;}
.topImg { top:12%}

.movieTextHere { margin-top:5%;
}	
@media (max-width:500px){	
.topImg { top:15%}
}

@media (max-width:360px){	
.topImg { top:23%}
}