@charset "utf-8";
/* CSS Document */

/* This class is added on scroll */
.fixed {	position: fixed;	top: 0; z-index: 1;	margin-top: 100px;	height: 100px;  z-index: 100;}

.product {  font-size: 19px;  line-height: 30px; color:#404040;     margin-top: 80px; }

/* Navigation Settings */
#transparent {background: #fff; opacity:0.9;  height: 120px;  margin-top: 100px;   border-bottom: 1px solid #ABABAB; border-top: 1px solid #ABABAB;     z-index: 20;}

prodnav { position: fixed; width: 100%; z-index: 100; background: #fff; opacity: 0.9; top: 95px; border-bottom: 1px solid #ABABAB; border-top: 1px solid #ABABAB;  }
prodnav ul{	margin: auto;  width: 521px;  padding: 0; margin-top: 10px; 	}

prodnav li { display: inline-block;	padding-top: 11px;}
prodnav li a {	color: #757575;	margin-right:50px;	z-index:999;	font-size: 11px;	line-height:20px;}
prodnav li a:hover{text-decoration:none; color: #757575;}
prodnav .textContainer {margin:auto; width: 540px; height:29px;}
prodnav .navText {float:left; font-size:12px; color:#a3a3a3;  line-height: 18px; }
.main-img {  margin: 0 auto;  text-align: center;  background-size: cover;  background-repeat: no-repeat;  height: 100%;  background-position: 50% 50%;}

@media only screen and (max-width: 520px) {	nav li { }
nav li a {		font-size: 14px;	}
}

#navButton svg{   fill: #a3a3a3;  width: 40px;  height: 51px;  padding: 11px 18px 10px 17px }
#navButton:hover svg{fill: #fff;}
#navButton{  display: block;  background: #fff;  border: 2px solid #a3a3a3;  border-radius: 6px;  width: 83px;  height: 74px;  text-align: center;   float:left;    transition: background 0.5s, border-color 0.5s;  -webkit-transition: background 0.5s, border-color 0.5s;  -moz-transition: background 0.5s, border-color 0.5s;}
#navButton:hover{ background:#88C54B; border: 2px solid #a3a3a3; fill: #fff;}

.prod-active, .prod-active svg{background:#88C54B!important; fill:#fff!important; }

.nav-divider{margin-top:0px; display:none;}


 /* Desktop Media Query  */

 @media only screen and (max-width : 800px)  { 
 	.fixed {	position: relative;	top: 0; 	z-index: 1;	margin-top: 100px;	height: 100px;}
	 .product h1 {font-size: 48px;   line-height: 55px;}
	 .product h2 {line-height: 36px; margin-bottom: 16px; font-size: 24px; text-align:left;}
	 #contentInnerNS{padding: 0px 5px 17px 5px;}
	 .nav-divider{margin-top:92px; display:block;}
	 .product {    margin-top: -28px;}
	 #transparent    { margin-top: 14px;}
     prodnav {margin-top: 0;}
     prodnav ul {margin-top: 20px;}
}

 /* STRICT IPAD RESOLUTION HORZ FIX*/
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) { 
	.fixed {	position: relative;	top: 0; 	z-index: 1;	margin-top: 100px;	height: 100px;}
	 prodnav { position: relative;	bottom: 0;	width: 100%; top: 85px;}
	 .nav-divider{margin-top:92px; display:block;}
	 .product {margin-top: 0px;}
	
}

  /* STRICT IPAD RESOLUTION  PORTRAIT FIX*/
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation: portrait) { 
.fixed {	position: relative;	top: 0; 	z-index: 1;	margin-top: 100px;	height: 100px;}
prodnav { position: relative;	bottom: 0;	width: 100%; top: 85px;}
.nav-divider{margin-top:92px; display:block;}
.product {margin-top: -100px;}
	
}


 /* MOBILE MEDIA PHONE   */
 @media only screen and (max-width : 600px)  {
 	.fixed {	position: relative;	top: 0; 	z-index: 1;	margin-top: 100px;	height: 100px;}
 prodnav { position: relative;	bottom: 0;	width: 100%; top: 85px;}
 prodnav ul {width: 323px; margin-top: 18px;}
 prodnav li a{ margin-right: 10px;}
 
.product h1 {    font-size: 27px;  line-height: 33px;}



#navButton svg{   fill: #a3a3a3;  width: 36px;  height: 51px;    padding: 4px 0px 0px 2px;}
#navButton:hover svg{fill: #fff;}
#navButton{  display: block;  background: #fff;  border: 2px solid #a3a3a3;  border-radius: 6px;  width: 62px;  height: 61px;  text-align: center;   float:left;    transition: background 0.5s, border-color 0.5s;  -webkit-transition: background 0.5s, border-color 0.5s;  -moz-transition: background 0.5s, border-color 0.5s;}
#navButton:hover{ background:#88C54B; border: 2px solid #a3a3a3; fill: #fff;}
.nav-divider{margin-top:92px; display:block;}
.product {    margin-top: -128px;}
 
}