* {
 box-sizing: border-box;
}
/* FONT SIZE 16, 18px, 24,...*/
html, body {
width: 100%;
text-align:center;
margin: 0;
padding: 0;
font-family: "Roboto", sans-serif;
font-size:18px;

}
hr {
 border-top: 0.1vw solid #a8acb1;
 border-bottom:0 solid;
border-right:0.1vw solid #a8acb1;
border-left:0.1vw solid #a8acb1;
background-color:#a8acb1;
}
a {text-decoration:none; }
img {  width:100%; } /* css3 resize image when scree change */
























/*INDEX*/

.in_zero {margin:0;padding:0;font-size:3px;}

.in1 { margin:auto; padding:0.3% 0.3% 0.3% 3%;}
.in1_1 {float:left; padding-left:0; width:400px;}



	
.in3 {width:100%;background-color:#f5f7f9; position:relative;}
	.in3_1 { position:relative;padding-bottom: 40%;  }/*mySlide lo cambio a position absolute y in3_1 relative;esto es un truco para que no hay reflow al load image*/
	.in3_2 { position:absolute;background-color: rgba(255, 255, 255, 0); right:10%; top:15%;   }
.in3_black {
position: fixed; /* Sit on top of the page content */
  width: 100%; /* Full width (cover the whole page) */
  height: 100%; /* Full height (cover the whole page) */
  top: 0;  left: 0;  right: 0;  bottom: 0;
  background-color: rgba(0,0,0,1); /* Black background with opacity */
  z-index: 7; /* Specify a stack order in case you're using a different order for other elements */
  cursor: pointer; /* Add a pointer on hover */
}




	
.in6 {cursor:pointer; color: #a8acb1; font-size:18px;padding: 0.3% 0.6% 0.3% 0%}
.in6:hover {color:#181a1d;}




.t1 {color:#709bdb; font-size:18px;  font-weight: bold; margin:4% 0% 2% 0%;}
.t2 {color:#ffffff;font-size:36px; font-weight:100; margin:2% 0% 2% 0%; }
.t22 {margin-top:2%,margin-bottom:2%; font-size:16px; color:#777a81;}
.t3	{cursor:pointer; color:white;background-color:#ff3347; padding:4% 2% 4% 2%;margin:6% 0% 6% 0%;}
.t3:hover {background-color:#d9182b;}
.t4 {font-size:16px; }
.t4 a {color:#d7d7d7; text-decoration: none; }
.t4 a:hover {color:#ff3347; }
.t5 {font-size:14px; color:#ff3347;}	
	

.avideo{color:#a8acb1;}
.avideo:hover {color:#7a8189;}
.avideo:visited {color:#a8acb1;}


.i_v0{position:relative;
background-color:#f5f7f9;width:100%;cursor:pointer; color: #a8acb1; 
font-size:18px; }
.vimg {width:300px;padding:50px;}
.vimgp {position:absolute;
top:45%;
left:50%;
transform: translate(-50%, -50%);
}





	
.i_ics{padding: 0% 0% 0% 0;}
.i_ics0 {width:50%; margin:auto;font-size:36px; font-weight:300;padding-top:5%;padding-bottom:5%;}
.i_ics2 {width:70%;margin:auto;}
.i_ics222 {width:68%;margin:auto;}

.i_ics3 {width:7%;float:left;padding:0.5% 0.5% 0 0.5%;}
.i_ics4 {float:left; text-align:left;margin:auto;width:40%;}
.i_ics4_0 {padding:0 0 0 0; margin:0 0 0.5% 0;font-size:18px;font-weight:bold;}
.i_ics4_1 {font-size:16px;font-weight:300; margin:0;padding:0; }

/*Maximun performance in minimunspace */

.i_fr{background-color:#f5f7f9;padding:1% 0 1% 0;}
.i_fr0{font-family: 'Times New Roman'; font-size:42px;font-weight:bold;margin:0;padding:0;}
.i_fr1{width:80%;margin:-0.5% auto auto auto;font-size:36px;font-weight:300;}
.i_fr2{width:200px;margin:auto;padding:0.5%;}

/*ShippingWarrantyMounting kit icons*/

.i_x{padding: 0 0 0 0;}
.i_x1 {width:75%; margin:auto;font-size:18px; font-weight:300;margin-top:1%;margin-bottom:0;}
.i_x2 {float:left;width:33.33%;padding:0 4% 0% 4%;}
.i_x3 {width:30%; padding:0 0 0 0; margin:auto;}
.i_x4 { text-align:center;}
.i_x4_0 {padding:0 0 0 0; margin:0 0 0 0;font-size:18px;font-weight:bold;}
.i_x4_1 {font-size:16px;font-weight:300; }
.i_x4_2 { font-size:14px;color:#ff3347;font-weight:300;}
.i_x4_2 a{ color:#fd3346;}
.i_x4_2 a:hover{ color:#17191c;}

/*reviews*/

.i_pr0 { background-color:#f5f7f9;}
.i_pr1 { width:75%;margin:auto; padding:0%;}
.i_pr11 {font-size:36px;padding-top:5%;}
.i_pr12 {margin-top:2%;margin-bottom:2%;}



.i_prr0 {background-color:#f5f7f9;width:70%;margin:auto;padding-top:2%;}
.i_pr13 {width:15%;float:left; padding:0;margin:0;}
	.i_primg{}
	.i_pr132{font-size:18px;font-weight:bold;}
.i_pr14 {width:75%;float:left; margin: 2% 0 0 0;padding-left:5%;}	
.i_pr141 {margin-left:2%;font-size:18px;font-weight:bold;text-align:left;}	
.i_pr142 {margin-left:2%;font-size:16px;font-weight:100; text-align:left;}	




.r8 {color: #777a81; background-color:#f5f7f9;  }/*#f5f7f9*/
.r8_1{padding-left:10px;padding-top:10px;}
.r8_11{width:125px;} 
.r8_12 {margin:0;padding:0;text-align: left; font-size:10px; }
	

.i_r9 {background-color:#f5f7f9;width:100%;padding-top:0.4%; }/*181a1d;}#f5f7f9;*/
.i_r91 {}
.i_r92 {color:white; margin:0;padding:20px 0  20px  0;font-size:8px; color: #777a81; }






/*modal windows*/

/*MODA DIALOG*/
.mo2 {text-align:justify;
font-size:18px;
	width: 100%;
	margin: 0;
	padding: 0.2% 3% 0.2% 3%;
	background-color:#fff;
	}
.mo3 {

font-size:18px;
width:  100%;
	margin: 0;
	padding: 0.2% 3% 0.2% 3%;
	background-color:#f5f7f9;
}
.modalDialog {
	position: fixed;
	font-family: "Roboto", sans-serif;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background: rgba(0,0,0,0.8);
	z-index: 99999;
	opacity:0;
	-webkit-transition: opacity 400ms ease-in;
	-moz-transition: opacity 400ms ease-in;
	transition: opacity 400ms ease-in;
	pointer-events: none;
}
.modalDialog:target {
	opacity:1;
	pointer-events: auto;
}
.mo0 {
	width:  60%;
	position: relative;
	margin: 10% auto;
	border-radius: 1px;
	background: #fff;
	/* background: -moz-linear-gradient(#fff, #999);
	background: -webkit-linear-gradient(#fff, #999);
	background: -o-linear-gradient(#fff, #999); */
}
.close {
	
	font-weight:100; 
	color: red;
	font-size:48px;
	position: absolute;
	right: 0;
	text-align: center;
	top: 0px;
	text-decoration: none;
}
.close:hover {cursor:pointer;}
/*
When you click on href="#openModal", it finds the fragment with id="openModal" 
and puts the focus on it. Changing its state. The css .modalDialog:target comes 
into action making the modal visible with opacity:1.

When you click on href="#close", it tries to find fragment id="close", 
which is not present. It also removes focus from any other fragment, 
making modalDialog loose focus. So nothing remains in focus. and modal closes.
*/





/*GALLERY */

.mySlides { width:100%; display: none; position:absolute;}/*position absoulute para evitar reflow*/

/* Next & previous buttons */
.prev,
.next {
  cursor: pointer;
  position: absolute;
  top: 45%;
  width: auto;
  padding: 1%;
  margin-left: 2%;margin-right:2%; 
  color: #a8acb1;/*#636568;*/

background-color: rgba(255,255,255,0.1);

   font-size:18px;
  transition: 0.6s ease;
  user-select: none;
  -webkit-user-select: none;

}

/* Position the "next button" to the right */
.next {  right: 0; border-radius: 5vw;}
.prev {  left: 0; border-radius: 5vw;}


/* On hover, add a black background color with a little bit see-through */
.prev:hover,
.next:hover {
  background-color: rgba(0, 0, 0, 0.8);
}

/* Number text (1/3 etc) */
.numbertext { 
	

  width:20%;
  margin:0;padding:0;
  position: absolute;
  bottom: 2vw;
  left:47.5%;
}

.b1 {  cursor:pointer;float:left;margin:0.5vw; width: 1vw; height:1vw; border-radius: 2vw;background-color:rgba(0,0,0,0.4); }
.b2 {  cursor:pointer;float:left;margin:0.5vw; width: 1vw; height:1vw; border-radius: 2vw;background-color:rgba(255,255,255,0.4);}
.b1:hover{border-color:#181a1d;background-color:#181a1d;}
.b2:hover{border-color:#181a1d;background-color:#181a1d;}












/*VIDEO*/
.modalvideo_ {
  display: none;
  position: fixed;
  z-index: 1;
  
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow:hidden;
  background-color: rgba(0,0,0,0.8);
 }
.videocontent {
  position: relative;
  background-color: rgba(0,0,0,0);
  margin: auto;
  padding: 0;
  width: 90%;
  height:80%;
  max-width: 1200px;
   
}


.container1 {
    position: relative;
    width: 100%;
    top:0%;
	height: 0;
    padding-bottom: 56.25%;
}
.video1 {
    position: absolute;
    top: 15%;/*baja el video*/
    left: 0;
    width: 100%;
    height: 100%;
}

.closevid {
	z-index:20;
	font-weight:100; 
	color: #FFFFFF;
	font-size:48px;
	position: absolute;
	right: 0;
	text-align: center;
	top: 5%;/*baja la x*/
	text-decoration: none;
}
.closevid:hover {cursor:pointer;}


















/*CONFIUGRE_OPTIONS*/
.s_divsmallimages{}
.s_simg{height:40px;width:40px;margin:5px;padding:5px;object-fit: cover;}
.s_simg:hover{border:1px solid;}

#s_gallery{}
.s_img{ display:block;}/*default img inline makes space bottom*/
.s_g1 {
	position: absolute;
height:24000px;
	font-family: "Roboto", sans-serif;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background: black;
	z-index:7;
}
#container:fullscreen {
	width: 100%;
	height: 100%;
	background-color: green;
}
.s_g2 {
	width:  100%; 
	position:relative;
	margin: auto;
	border-radius: 1px;
	background: black;
}











.co0 {width:80%; font-size:36px;  margin:auto; padding:1vw 0 0.5vw 0;}	
.co1 {text-align:center; font-size:18px;}

.co2{width:50%;float:left;padding-right:3vw;}/*width es la mitad de co0*/
	.co2_1{width:40%;}/*image */
.co3{width:50%;float:left;} /*width es la mitad de co0*/
	.co3_1{font-size:24px; text-align:left; }
	.co3_2{font-size:18px; text-align:left;font-weight:300;}
	.co4{ width:100%; margin:1vw 0 0.5vw 0;   cursor:pointer; border:0.1vw solid #e4e6e7;}
		.co4_1 {width:50%;float:left; text-align:left; padding:0.3vw 0.7vw 0.3vw 0.7vw;   font-size:18px; color:black;}/*item name*/
		.co4_3 {width:20%;float:right; padding:0.3vw 0.7vw 0.3vw 0.7vw;   font-size:18px; color:black;  }/*item price*/
		.co5{  width:25%;float:right;}
		.co5_1{    outline: none!important; color:#7b6e6f; border-radius: 0.3vw; 
 margin-top:1vw;   margin-right:0vw;padding:0.2vw 0.5vw 0.2vw 0.5vw; border:0.1vw solid #e4e6e7;
  font-size:18px;}



.co6{background-color:black; margin:auto;}
.co7{width:100%;   margin:auto;}
.co8{margin:1vw; float:left;font-size:36px;color:white;}
.co9{cursor:pointer;margin:1vw; float:right;font-weight:bold;font-size:18px;color:#ff3347;border:0.2vw solid #ff3347;padding:0.5vw;}
.co9:hover{background-color:#ff3347;color:white;}
.co9 a {color:white; text-decoration:none; }
.co10{ margin:1vw;float:right;font-size:36px;color:white; padding:0 2vw 0 0;}


.divcle {clear:both;}






























/*CHECK OUT*/

.ch0 {width:100%;background-color:#222222; color:white;}
.ch1 {width:300px;float:left;padding:7px 0 7px 7px;}
.ch1_1{width:100%;}
.ch2 {float:right;padding:0.5vw 1vw 0 0;font-size:18px;}

.ch3{width:80%;   margin:auto;  padding:2vw 0vw 3vw 0vw;font-size:18px;margin:auto;}
		.ch4_1{width:50%;float:left; padding:0; margin:0;}
		.ch4_11{padding:3px 8px; background-color:#ff3347;color:white;border-radius:100px;}
	
.ch6 { width:80%;margin:auto;}
	.ch7{width:47%;margin-right:3%;float:left;}
			.ch27 { float:left;width:70%;font-size:16px;}
			.c_showall{font-size:14px;float:left;width:30%;padding-top:1vw;padding-left:3px;text-align:left;}
			.ch28 {width:100%;outline: none!important;font-size:16px;color:#7b6e6f; border-radius: 0.5vw!important; border:0.1vw solid #e4e6e7!important;}/*sin important no van*/
	
		.ch20{ font-size:18px;padding-bottom:0.9vw;}
		
		.ch30{font-size:18px; text-align:left;font-weight:300;}
		.ch28 {outline: none!important;color:#7b6e6f; border-radius: 0.3vw;padding:0.5vw; border:0.1vw solid #e4e6e7; margin-top:0.5vw}
		.ch_hr {margin:0 0 1vw 0; padding:0 0 0 0; }
	.ch8{width:50%;float:left;}
		.ch9 { width:100%; border-collapse: collapse;border:1px solid #e4e6e7;}
		.ch9 td {}
		.ch9 tr {}
		#paybutton {width:50%;margin:auto;}
.tch1{padding:0.5vw 0.5vw 0.5vw 0.75vw;font-size:18px;border-bottom:0.1vw solid #e4e6e7;text-align:left;background-color:#f5f7f9;}
.tch2{text-align:left;font-size:18px;margin:0.5vw 0px 0.1vw 0.6vw;font-weight:500;}
.tch3{text-align:left;font-size:16px;margin:0.1vw 0px 0.1vw 0.5vw;font-weight:300;}
.tch4{text-align:left;font-size:16px;margin:0.1vw 0px 0.2vw 0.3vw;font-weight:300;}

.tch5{padding-right:1.3vw;text-align:right;font-size:18px;border-top:0.1vw solid #e4e6e7;}/*dinero dch*/
.tch55{padding-right:1.3vw;text-align:right;font-size:18px;}/*dinero dch*/

.tch6{vertical-align:top;padding-top:0.6vw;padding-left:0.2vw;font-size:18px;font-weight:300;} /*qty*/
.tch7{ font-weight:300;padding:0.3vw 0.5vw 0.5vw 0.3vw; text-align:left;font-size:18px;border-top:0.1vw solid #e4e6e7;}
.tch77{font-weight:300;padding:0.3vw 0.5vw 0.5vw 0.3vw;text-align:left;font-size:18px;}
.tch8{font-weight:300;font-size:18px;margin:0.5vw 0 0.3vw 0;}
.tch9{font-size:36px;margin:0 0 0.5vw 0;}
.tch10{border-top:0.1vw solid #e4e6e7;background-color:#f5f7f9;}
.tch_spacer{font-size:16px; padding:0vw;}


/*end row*/
.ch_b1{background-color:#181a1d;color:white;}
.ch_b2{font-size:18px; font-weight:300;margin:auto;}
.ch_b3{font-size:18px;font-weight:300;margin:0;padding:0.7vw 0 0.5vw 0;}
.ch_b4{font-size:18px;font-weight:300;margin:0;padding:0.5vw 0 0.5vw 0;}
.ch_b4 a {color:white;}
.ch_b5{font-size:16px;margin:0;padding:0.5vw 0 0.8vw 0; color:#465a57;}






/*WARRANTY*/
.w0{width:80%;margin:auto;}
.wtext {text-align:left;font-size: 18px;font-weight: 300;}
.wtit0 {text-align:left;font-size:   24px;font-weight: bold;}
.wtit1 {text-align:left;font-size: 18px;font-weight: 400;}








/*media querys*/


@media screen and (max-width: 1200px) {
/*shop*/
.co2_1{width:60%;}

/*INDEX*/


.in3 {background-color:white;} 
.in3_2 {position:static;background-color:white;}
.t1 { margin:2% 0% 0% 0%;}
.t2 {margin:1% 0% 1% 0%; color:black;}
.t3	{width:20%;padding:2% 1% 2% 2%;margin: 1% auto;}
.t4 a {color:black;}
.t5 {padding-bottom:2vw;}	
.i_hrprice {width:40%;}




.i_ics0 {width:100%; padding-left:3vw;padding-right:3vw;font-size:24px;}
.i_ics2 {width:100%;}
.i_ics222 {width:95%;}



}

/*tablets*/
@media screen and (max-width:768px){
/*index*/
.in1_1 {width:95%;}
.i_x2 {float:none;width:100%;}
.i_x3 {width:10%; }

/*checkout:*/
.ch1 {float:none;margin:auto;padding-bottom:0;}
.ch2 {float:none;padding-bottom:7px;}
.ch_hr {display:none;}
.ch6 { width:80%;margin:auto;}
	.ch7{width:100%;margin:20px 0;float:none;}
.ch8{width:100%;float:none;}


/*SHOP*/
.co2{width:100%;float:none;padding-right:0vw;}/*width es la mitad de co0*/
	.co2_1{width:50%;}/*image */
.co3{width:100%;float:none;} /*width es la mitad de co0*/






.co6{background-color:black; margin:auto;}
.co7{width:100%;   margin:auto;}
.co8{margin:1vw; float:none;font-size:36px;color:white;}
.co9{width:30%;cursor:pointer;margin:auto; float:none;font-weight:bold;font-size:18px;color:#ff3347;border:0.2vw solid #ff3347;padding:0.5vw;}
.co10{ margin:1vw;float:none;font-size:36px;color:white; padding:0 2vw 0 0;}









.i_prr0 {width:70%;}
.i_pr13 {width:50%;float:none;margin:auto; }
.i_pr14 {width:100%;float:none; }	

.mo0 {	width:  90%;}



.s_simg{height:25px;width:25px;}

}/*end media query*/

/*mobiles*/
@media screen and (max-width:480px){
/*warranty*/


}/*end media query*/





/*
@media (max-width: 1200px) {

@media (max-width: 980px) {

@media (max-width: 979px) {

@media (max-width: 980px) {

@media (max-width: 768px) and (max-width: 979px){

@media (max-width: 768px) {

@media (max-width: 767px) {

@media (max-width: 480px) {
*/








































	





