@charset "utf-8";
body
{
	margin: 0;
	padding: 0;
	font-family: 'Archivo Narrow', sans-serif;
	font-size: 14px;
	display: inline-block;
	width: 100% !important;
	color: #333333;
	overflow-x: hidden;
	font-weight:400;
}
input, button, select, textarea{ outline: none; font-family: 'Archivo Narrow', sans-serif;}
#Body, #Body *{font-family: 'Archivo Narrow', sans-serif;}
a, p, strong, ul, h1, h2, h3, h4, h5, h6{margin: 0;padding: 0}
h1{font-size: 24px}
h3{font-size: 28px}
h4{font-size: 22px}
li{list-style: none}
a:focus, input:focus{outline: none !important;text-decoration: none;}
a:hover{text-decoration: none}

.pagewidth{float:left; width:100%}
.wrappage {width: 100%; }
input[type=text]::-ms-clear {  display: none !important; width : 0 !important; height: 0 !important; }
input[type=text]::-ms-reveal {  display: none !important; width : 0 !important; height: 0 !important; }
.input-text, .sub_search{outline :0px !important; }
.sub_search{border:0px !important}
#Body .tab-content-m{float:left; width:100%}
select:focus, button:focus, option:focus, select::-moz-focus-inner, option::-moz-focus-inner {
    outline: none !important;
    border: none !important;
}
code {
    padding: 2px;
    background: #ddd;
}
img{max-width:100%;}
#gh-logo{max-width:500%}
a.text:hover{text-decoration:none}
/* Micro reset */
*,*:before,*:after{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;margin:0;padding:0;}
  
/* Begin style header */
.header-container{ display: inline-block; width: 100%; position: relative; }
.header-container  .nav-trigger { display: none; }
.header-container #nav-trigger +label{  margin-bottom: 0}

.header-content{  display: inline-block; width: 100%; text-align: center; position: relative; border-bottom: 1px solid #DCDCDC; padding-bottom: 20px;}
.header-content .logo-content{ float: left; text-align: left;width: auto; width: 120px; margin-top: 20px; }
.header-link{display: inline-block; float: right; margin: 50px 0 0 0px;}
.header-link img{display: none}
.header-link a{margin: 0 0 0 35px; color: #474747; font-weight: 400; font-size: 16px; text-transform: uppercase; font-family: 'Oswald', sans-serif;}
/* End style header */ 

/* Begin style details content */
.main-container{display: inline-block; width: 100%;}
.product-detail-content{display:inline-block; width:100%;}
.product-shop-container{width:50%; float:right; padding-left: 30px}
.box-images-details{  float:left; width: 50%; }
.slider{
	width: 100%;
	display:inline-block;
	position:relative;
	overflow: hidden;
}
.slider .grid-wrapper {
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  position: relative;
  height: 570px;
  width: 570px;
  margin: 0 auto;
}
.slider .grid-item {
  height: 20%;
  width: 20%;
  position:relative;
  z-index:16;
  background:#fff;
  opacity:0;
  float:left;
} 
.slider .grid-item:hover:nth-of-type(5n + 1) ~ .grid-content .img-details p{ left: 0px; }
.slider .grid-item:hover:nth-of-type(1n + 1) ~ .grid-content .img-details  p{ top: 0px; }
.slider .grid-item:hover:nth-of-type(5n + 2) ~ .grid-content .img-details  p{ left: -12.5%; }
.slider .grid-item:hover:nth-of-type(1n + 6) ~ .grid-content .img-details  p{ top: -12.5%; }
.slider .grid-item:hover:nth-of-type(5n + 3) ~ .grid-content .img-details  p{ left: -25%; }
.slider .grid-item:hover:nth-of-type(1n + 11) ~ .grid-content .img-details  p{ top: -25%; }
.slider .grid-item:hover:nth-of-type(5n + 4) ~ .grid-content .img-details  p{ left: -37.5%; }
.slider .grid-item:hover:nth-of-type(1n + 16) ~ .grid-content .img-details  p{ top: -37.5%; }
.slider .grid-item:hover:nth-of-type(5n + 5) ~ .grid-content .img-details  p{ left: -50%; }
.slider .grid-item:hover:nth-of-type(1n + 21) ~ .grid-content .img-details  p{ top: -50%; }
/*Last thing remaining is to add transitions*/
.grid-content{ margin-left: -30px; }
.slider  .img-details{
	position: absolute;
	left: 0;
	top: 0;
	-webkit-transition: all 0.25s;
	transition: all 0.25s;
	text-align:center;
	z-index:2;
    height: 570px;
    width:570px;
	overflow: hidden;
	background: #fff
}
.slider  .img-details img{max-height: 453px;}
.slider .grid-item ~ .grid-content .img-details p{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height: 100%; 
}
.slider .grid-item ~ .grid-content .img-details img{
	max-width:100%;
	max-height:100%;
}
.slider .grid-item:hover ~ .grid-content .img-details p{
   width:150%;
   height:150%
} 
.slider .grid-item:hover ~ .grid-content .img-details p img{
	width: auto;
	height: auto;
   max-width:100%;
   max-height:100%
} 

.slider input[name='slide_switch'] {
	display: none;
}

.slider label {
	/*Lets add some spacing for the thumbnails*/
	margin: 20px 0 0 30px;
	cursor: pointer;
	transition: all 0.5s;
	/*Default style = low opacity*/
	opacity: 1;
	float:left;
}
.slider span {
	/*Lets add some spacing for the thumbnails*/
	width:90px;
	height:90px ;
	text-align:center;
	display:inline-table;
	background: #fff; 
	border:1px solid #EFEFEF;
}
.slider input[value=""] + label{display: none !important}
.slider  span:has(img[src=""]){display:none;}
.slider label img{max-width:88px; max-height:88px;width:auto; }
.slider label   img[src=""]{display:none}
/*Time to add the click effects*/
.slider input[name='slide_switch']:checked+label {opacity: 1;}
.slider input[name='slide_switch']:checked+label span img, .slider span:hover img { }
/*Clicking any thumbnail now should change its opacity(style)*/
/*Time to work on the main images*/
.slider input[name='slide_switch'] ~ .img-details {
	opacity: 0;
	display:none;
}
.slider input[name='slide_switch']:checked + label + .img-details {
	opacity: 1;
	display:block;
	z-index:13;
	background: #fff
}
.slider input[name='slide_switch'][value=""]:checked + label + .img-details {z-index: 0}
.slider input[value*="http"] + label + div{ opacity: 1; display:block; z-index:2;}
.slider input#id1[value=""] + label + div + input#id2[value*="http"] + label + div,
.slider input#id1[value=""] + label + div + input#id2[value=""] + label + div + input#id3[value*="http"] + label + div,
.slider input#id1[value=""] + label + div + input#id2[value=""] + label + div + input#id3[value=""] + label + div + input#id4[value*="http"] + label + div,
.slider input#id1[value=""] + label + div + input#id2[value=""] + label + div + input#id3[value=""] + label + div + input#id4[value=""] + label + div + input#id5[value*="http"] + label + div,
.slider input#id1[value=""] + label + div + input#id2[value=""] + label + div + input#id3[value=""] + label + div + input#id4[value=""] + label + div + input#id5[value=""] + label + div + input#id6[value*="http"] + label + div,
.slider input#id1[value=""] + label + div + input#id2[value=""] + label + div + input#id3[value=""] + label + div + input#id4[value=""] + label + div + input#id5[value=""] + label + div + input#id6[value=""] + label + div + input#id7[value*="http"] + label + div,
.slider input#id1[value=""] + label + div + input#id2[value=""] + label + div + input#id3[value=""] + label + div + input#id4[value=""] + label + div + input#id5[value=""] + label + div + input#id6[value=""] + label + div + input#id7[value=""] + label + div + input#id8[value*="http"] + label + div,
.slider input#id1[value=""] + label + div + input#id2[value=""] + label + div + input#id3[value=""] + label + div + input#id4[value=""] + label + div + input#id5[value=""] + label + div + input#id6[value=""] + label + div + input#id7[value=""] + label + div + input#id8[value=""] + label + div + input#id9[value*="http"] + label + div,
.slider input#id1[value=""] + label + div + input#id2[value=""] + label + div + input#id3[value=""] + label + div + input#id4[value=""] + label + div + input#id5[value=""] + label + div + input#id6[value=""] + label + div + input#id7[value=""] + label + div + input#id8[value=""] + label + div + input#id9[value=""] + label + div + input#id10[value*="http"] + label + div,
.slider input#id1[value=""] + label + div + input#id2[value=""] + label + div + input#id3[value=""] + label + div + input#id4[value=""] + label + div + input#id5[value=""] + label + div + input#id6[value=""] + label + div + input#id7[value=""] + label + div + input#id8[value=""] + label + div + input#id9[value=""] + label + div + input#id10[value=""] + label + div + input#id11[value*="http"] + label + div,
.slider input#id1[value=""] + label + div + input#id2[value=""] + label + div + input#id3[value=""] + label + div + input#id4[value=""] + label + div + input#id5[value=""] + label + div + input#id6[value=""] + label + div + input#id7[value=""] + label + div + input#id8[value=""] + label + div + input#id9[value=""] + label + div + input#id10[value=""] + label + div + input#id11[value=""] + label + div + input#id2[value*="http"] + label + div{ opacity: 1; display:block; z-index:3;}

 
 .product-view-name{  font-size:30px; font-family: 'Oswald', sans-serif !important;  line-height:35px; color:#474747 ; font-weight: 700;  margin:0px 0  0px; padding: 0 0 11px;}
  
 .price{display: inline-block; padding: 23px 0 0; width: 100%; border-top:1px solid #eeeeee; margin: 24px 0 0 }
 .price div,  .price  p{font-size:16px; color:#333333; font-family: 'Archivo Narrow', sans-serif; line-height:20px; float: left;  margin-bottom: 8px }
 .price .price-old{padding-left: 20px; color: #e90505; line-height: 40px; margin-bottom:0; }
 .price .price-new{font-weight: 700; clear: left; color: #245699; font-size: 28px; line-height: 32px; margin-bottom:0}
 .price input{display: none}
 .price input ~ .box-price-new{display:none}
 .price input[value=""] ~ .box-price-new{display:inline-block}
 .price input[value=""] ~ .box-price-old{display: none}
 
 .description{display: flex; justify-content: center; width: 100%; margin-top: 11px; padding-bottom: 10px; border-bottom: 1px solid #ccc; border-top: 1px solid #ccc; padding-top: 20px;}
 .description,  .description p,  .description a,  .description li,  .description td,  .description th{ font-size:16px;font-family: 'Archivo Narrow', sans-serif;  line-height:23px; color: #474747 }
 .description h1,  .description h2,  .description h3, .description h4,  .description h5,  .description h6{ font-weight: 700; color: #474747;margin-bottom: 12px }
 .description h1{  font-size:26px; line-height:33px;}
 .description h2{  font-size:22px; line-height: 29px;}
 .description h3{  font-size:18px; line-height: 24px;}
 .description h4{  font-size:14px; color: #333333; margin-bottom: 8px}
 .description h5, .description h6{ font-size:14px; margin-bottom: 8px}

 .description-video {
	width: 100%;
	max-width: 390px;
	font-family: arial;
	text-align: center;
	position: relative;
	min-height: 120px;
}
.description-video a:after {
	content: "\A0\25BA";
	position: absolute;
	width: 60px;
	height: 46px;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	margin: auto;
	border: 0;
	border-radius: 10px;
	color: white;
	background: rgba(0,0,0,.6);
	font-size: 24px;
	padding-top: 11px;
	cursor: pointer;
}

.description-video p { 
	position:absolute; 
	margin:0; color:white; 
	background-color: #000; 
} 
.description-video .yt_hd { 
	font-size:16px; 
	width:100%; 
	height:28px; 
	padding-top:6px; 
	text-align:left; 
	top:0; 
	left:0; 
	padding-left:10px; 
	overflow:hidden; 
} 
.description-video .yt_ft { 
	font-size:12px; 
	width:100%; 
	bottom:0; 
	left:0; 
	display: none;
} 
.description-video img { 
	display:block; 
	max-width:100%; 
	border:0; 
	margin-bottom: 10px;
}
.description-video .yt_inp {
    position: absolute;
	display: none;
    top: 100%;
    left: 0;
    width: 100%;
    text-align: center;
    padding: 0.5em 0.2em;
    border: 0;
    color: white;
    background: rgba(0,0,0,.7);
}

.description-video a:hover:after { background:#CC181E; }

@media(max-width: 500px) {
	.description-video {
		max-width: 100%;
	}
	.description-video .yt_inp,
	.description-video .yt_ft {
		display: block;
	}

	.description {
		padding-bottom: 50px;
	}

	.description-video img {
		margin-bottom: 40px;
		max-width: 100%;
		margin-bottom: 0;
	}
}

.trustmakers{display: inline-block; width: 100%; padding: 40px 0 0; margin-left: 52px;}
.trustmakers-inner {width: 40%; float: left; display: inline-block; text-align: center;}
.trustmakers-inner img {margin: 0 auto; display: block; padding-bottom: 20px;}
.trustmakers .free-shipping img{margin-top: 8px;}
.trustmakers-inner span{font-size: 16px;font-weight: 400; font-family: 'Oswald', sans-serif; line-height: 22px; margin: 10px 0 0; display: inline-block;}


@media(max-width: 500px) {
	.trustmakers{margin-left: 28px;}
}

/* Begin tabs*/
.tabs{margin-top: 37px;}
main {
  width: 100%;
  margin: 17px 0 0;
  position:relative;
  
} 
main section {
  display: none;
  width:100%;
  z-index: 0;
  padding: 40px 0 0;
   border-top:1px solid #cccccc;
}
main input {
  display: none;
}
main label {
  display: inline-block;
   color:#222222;
   font-size:24px;
   line-height:25px;
   font-weight:700;
   font-family: 'Oswald', sans-serif;
   padding:0;
   float:left;
   cursor:pointer;
   position: relative;
   text-transform: uppercase;
   margin: 0 8px;
   border: 1px solid #ccc;
   border-bottom: 0;
}
main input[name="tabs-mobile"] + label{display: none}
main label span{ width:100%; display: inline-block; padding:0 40px; position: relative; line-height: 60px; background: #EEEEEE;}
main input:checked + label span,main input + label:hover span{background: #fff}
main input:checked + label  span:after,main input:checked + label:hover  span:after{position: absolute; width: 100%; left: 0; border-bottom: 3px solid #fff; bottom: -2px; content: ""}

#tab1:checked ~ #content1,
#tab2:checked ~ #content2,
#tab3:checked ~ #content3,
#tab4:checked ~ #content4{
  display: inline-block;
} 
main section  p{max-width:100%;}
main section, main section a, main section li, main section p, main section td, main section th{ font-size:16px; color:#474747;font-family: 'Archivo Narrow', sans-serif; font-weight: 400}
main section h1, main section h2, main section h3, main section h4, main section h5, main section h6{ margin:0px 0 8px;line-height:33px; font-weight: 700; font-size:30px; color:#474747; font-family: 'Oswald', sans-serif; text-transform: uppercase; border-bottom: 1px solid #ccc; padding: 0 0 10px;}
main section h3{font-size: 18px; line-height: 23px;border: 0;}
main section h4{font-size: 16px; line-height: 21px; border: 0;}
main section h5, main section h6{font-size: 14px; line-height: 20px; border: 0;}
main section p{line-height: 18px; margin-bottom: .9rem; }
main section a{color: #000000 !important}
main section a:hover{ text-decoration: underline;}
main section a.text, main section a.text:hover, main section a.text:active, main section a.text:focus{color: #000000 !important; text-decoration: none !important;}
main section ol{margin:0px 0 10px 0px; display: inline-block; width: 100%}
main section ol {margin-left: 15px;padding-right: 15px;}
main section ol li{list-style-type: inherit; padding-left: 2px}
main section ul{margin:0 0 10px 10px; display: inline-block; width: 100%;}
main section#content1 ul{margin:17px 0 10px 15px;}
main section li{position: relative; padding-left: 20px;  }
main section ul li:before{position: absolute; top:10px; left:4px; background: #474747; width:6px; height: 6px; z-index: 1; content: ""; border-radius: 10px;} 
main section img{max-width: 100%}

main section .descripton-info {
    display: inline-block;
    float: left;
    width: 50%;
    margin: 30px 0 0;
}
main section .descripton-info.left{
	padding-right: 30px
}
main section .descripton-info.right{
	padding-left: 30px
}
main section table{
	margin:  20px 0 0;
	width: 100%;
	border: 1px solid #ccc;
}
main section tr td:first-child{
	font-weight: 700
}
main section tr {
    border-bottom: 1px solid #ccc;
}
main section tr:nth-child(2n +1){
	background: #EEEEEE;
}
main section td{
	padding: 0 20px;
	/* line-height: 30px */
}
/* end tab*/
/* Section Description */
.table-fitment-container table {
	color: #333;
	font-family: inherit;
	border-collapse: collapse;
	border-spacing: 0;
	width:100%;
}

.table-fitment-container tr {
	text-align:center;
}

.table-fitment-container th {
	background: #F3F3F3;
	font-weight: bold;
	font-size: 14px;
	text-align: center;
}

.table-fitment-container td, .table-fitment-container th {
	border: 1px solid #CCC;
	/* height: 30px; */
}

.table-fitment-container td {
	background: #FAFAFA;
	text-align: center;
	padding: 0px 10px;
	font-size: 12px;
}
/* End Section Description */
/* End style details content */
/* Begin footer */ 
.footer{margin-top: 43px; background: #EEEEEE;}
.footer-right-content {text-align: left;}
#footer-logo {width: 120px;}
.footer-bottom{ display:inline-block; width:100%; min-height: 80px;}
.footer-bottom-content{display: flex; justify-content: space-between; align-items: center; width: 100%; text-align: center; min-height: 120px;}
.footer-bottom .box-footer{width: auto;  text-align: left; display: table-cell; vertical-align: middle; margin: 20px 0;}
.footer-bottom .box-footer:nth-child(2){margin: 0 auto; float: none; text-align: center;padding: 40px 30px;}
.footer-bottom .box-footer:last-child{float:  right; }
.footer-bottom .box-footer p, .footer-bottom .box-footer a{font-size:16px;font-family: 'Archivo Narrow', sans-serif; line-height:24px; font-weight:400;  color:#131313; }
.footer-bottom .box-footer h4{color: #245699;font-family: 'Archivo Narrow', sans-serif; margin-bottom: 14px; font-size: 20px; line-height: 24px;}
.footer-bottom .box-footer li{ margin-bottom: 5px;}
.footer-bottom .box-footer li:last-child{ margin-bottom: 0px;}
.footer-bottom .box-footer p a{font-size: 22px; color: #fff; background: #ff901a; display: inline-block; padding: 12px 27px; margin-top: 13px}
.footer-bottom .box-footer p a:hover{color: #fff; }
 
.footer-copy{ padding: 6px 0px; display: inline-block; width: 100%}
.footer-copy p{color: #333333 !important;  font-family: 'Archivo Narrow', sans-serif; font-size: 14px; font-weight: 400; line-height: 18px; display: inline-block; float: right;}
.footer-copy p a{color: #245699 !important}
.footer-copy p a.text{color: #333333 !important}
.footer-copy p:first-child{float: left; padding-top: 10px}
.footer-copy .rainstorm img{float: right;}
.rainstorm{margin: 0 0 0 10px;}
/* End footer */

@media (max-width:1199px){ 
	/* Begin listing */
	.grid-content {margin-left: -22px;}
	.slider .grid-wrapper, .slider .img-details{width: 480px; height: 480px;}
	.slider .img-details img{max-height: 478px;}
	.slider label{margin: 20px 0 0 22px;}
	.slider span{width: 78px; height: 78px}
	.slider label img{ max-width: 76px; max-height: 76px } 

	.footer-bottom .box-footer:last-child, .footer-bottom .box-footer:first-child{width: auto}
	/* End listing */
	/* Begin home */
	.search-content{width: 500px}
	/* End home */
}
@media  (max-width:1140px){ 
	/* Begin home*/
	.search-content{width: 480px}
	.menu-header ul li a{padding: 11px 10px 9px}
	/* End home */

}
@media (max-width:1024px){
	/* Begin listing */
	.slider .grid-item{z-index: -10}
	/* End listing */ 
}
@media (max-width:992px){
	/* Begin listing */
	.menu-header ul li a{font-size: 14px;}

	.box-images-details{width: 45%;}
	.product-shop-container{width: 55%}
	.slider .grid-wrapper, .slider .img-details{width: 413px; height: 413px;}
	.slider .img-details img{max-height: 412px;}
	.slider span{width: 86px; height: 86px}
	.slider label img{ max-width: 84px; max-height: 84px }
	/* End listing */
}
@media  (min-width: 768px) and (max-width:938px){
	/* Begin listing */

	.box-images-details{width: 50%;}
	.product-shop-container{width: 50%}
	.slider .grid-wrapper, .slider .img-details{width: 374px; height: 374px;}
	.slider .img-details img{max-height: 372px;}
	.slider span{width: 77px; height: 77px}
	.slider label img{ max-width: 75px; max-height: 75px }

	/* End listing */   
}
@media(max-width: 767px){
	/* page listing */
	.header-link{float: right; margin-left: 0;}
	.header-content .text-shipping,.header-link a span, .header-link a:first-child{display: none}
	.header-link a{margin: 0;}
	.header-link a img{display: inline-block;}
 
	.main-container{padding-top: 20px;}
	.box-images-details,  .product-shop-container{width:100%; float:none; padding:0;}
	.box-images-details{margin-top: 50px}
 	
 	main section .descripton-info{width: 100%; margin: 10px 0 0; padding: 0 !important;}
 	main section .descripton-info.right {margin-top: 30px;}

 	.slider .grid-wrapper{width: 620px; height: 620px}
 	.slider .img-details{width: 620px; height: 620px;}
 	.slider .img-details img{max-height: 618px;}
	.grid-content{margin-left: -10px}
	.slider label{margin: 10px 0 0 10px} 
 	.slider span{width: 80px; height: 80px;}
 	.slider label img{max-width: 78px; max-height: 78px;}

 	main label span{padding: 0 12px;}

	main input[name="tabs"] + label{display: none}
	main input[name="tabs-mobile"] + label{display: inline-block; width: 100%; margin: 0 0 5px;border-bottom: 1px solid #ccc;}
	main section{display: none !important; padding: 20px 0 25px; border: 0;}
	main input[name="tabs-mobile"]:checked + label +  section{display: inline-block !important; }
	main input:checked + label span::after, main input:checked + label:hover span::after{border:0;}
	main input:checked + label span::before, main input:checked + label:hover span::before{position: absolute;content: "-"; right: 12px; font-size: 35px;}
	main input + label span::before, main input + label:hover span::before{position: absolute;content: "+"; right: 12px; font-size: 35px;}
}
@media(max-width:736px){
}
@media(max-width:667px){
}
@media(max-width:640px){
}
@media(max-width:639px){
	/* page listing */
 
 	.main-container{padding-top: 13px;}

 	.slider .grid-wrapper, .slider .img-details{width: 460px; height: 460px;}
 	.slider .img-details img{max-height: 458px}
 	.grid-content{margin-left: -10px}
 	.slider label{margin: 10px 0 0 10px}
 	.slider span{width: 84px; height: 84px;}
 	.slider label img{max-width: 82px; max-height: 82px;}

 	.footer-bottom .box-footer{display: block; width: 100% !important; text-align: center; }
	
}
@media(max-width:568px){ 
	
}
@media(max-width:480px){ 
	
}
@media(max-width:479px){
	
	/* page listing */
 	.slider .grid-wrapper{width: 300px; height: 300px}
 	.slider .img-details{width: 300px; height: 300px;}
 	.slider .img-details img{max-height: 298px}
 	.grid-content{margin-left: -20px}
 	.slider label{margin:20px 0 0 20px} 
 	.slider span{width: 60px; height: 60px;}
 	.slider label img{max-width: 58px; max-height: 58px;}
}
@media(max-width:414px){
	
}
@media(max-width:400px){ 
	
}
@media(max-width:399px){ 

}
@media(max-width:320px){ 
}