/* CUADRO QUE DESEAS HACER */
.que1 {border: 0px solid red; display: block; height: 5%; width: 95%; position: fixed; 
              top: 25.5%; left: 2.5%; background-color: transparent; z-index: 20; padding: 0px; text-align: center;}
.que2 {border: 0px solid red; display: block; height: 5%; width: 96%; position: fixed; 
              top: 42.5%; left: 2%; background-color: transparent; z-index: 12; padding: 0px; text-align: center;}
.que3 {border: 0px solid red; display: block; height: 5%; width: 25%; position: fixed; 
              top: 20%; left: 5%; background-color: transparent; z-index: 2; padding: 0px; text-align: center;}
/* PARA VIDEOS*/
.que4 {border: 0px solid red; display: block; height: 5%; width: 100%; position: fixed; 
              top: 25.5%; left: 0%; background-color: transparent; z-index: 20; padding: 0px; text-align: center;}
.que5 {border: 0px solid red; display: block; height: 5%; width: 96%; position: fixed; 
              top: 42.5%; left: 2%; background-color: transparent; z-index: 12; padding: 0px; text-align: center;}
.que6 {border: 0px solid red; display: block; height: 5%; width: 100%; position: fixed; 
              top: 20%; left: 0%; background-color: transparent; z-index: 2; padding: 0px; text-align: center;}


/* TEXTO QUE DESEAS HACER */
.hacer1 { font-family: Abril+Fatface; color: white; z-index: 21; font-size:3vh; vertical-align: middle;
             margin-left: 10px; white-space: nowrap; text-wrap: nowrap; font-weight: bold;}
.hacer2 { font-family: Abril+Fatface; color: green; z-index: 15; font-size:3vh; vertical-align: middle;
             margin: 0px; white-space: nowrap; text-wrap: nowrap; font-weight: bold;}
.hacer3 { font-family: Abril+Fatface; color: white; z-index: 2; font-size:3.5vw; vertical-align: middle;
           white-space: nowrap; text-wrap: nowrap; font-weight: bold;}

/*MOVIL*/
.movil1 { display: flex; flex-direction: column; z-index: 10; position: fixed; top: 29%; left: 15%; width: 70%; 
          aspect-ratio: 1/1.6;}
.movil2 {}
.movil3 { display: flex; flex-direction: column; z-index: 10; position: fixed; top: 30%; left: 5%; width: 25%; 
          aspect-ratio: 1/1.28; }
/*MOVIL VIDEOS*/
.movil4 { display: flex; flex-direction: column; z-index: 10; position: fixed; top: 29%; left: 15%; width: 70%; 
          aspect-ratio: 1/1.6;}
.movil5 {}
.movil6 { display: flex; flex-direction: column; z-index: 10; position: fixed; top: 30%; left: 37.5%; width: 25%; 
          aspect-ratio: 1/1.28; }

/*Scroll*/
.miscroll {overflow: auto; flex-grow: 1; top: 0%; left: 0%; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.75); border-radius: 15px; border: 1px solid white;}
::-webkit-scrollbar {width: 6px;}
::-webkit-scrollbar-track  background: rgba(0, 0, 0, 0.75); }
::-webkit-scrollbar-thumb {background: rgba(255, 255, 255, 0.75); }
::-webkit-scrollbar-thumb:hover {background: rgba(255, 255, 255, 0); }

/*SECCIONES*/
.sec1 {border: 1px solid yellow; top: 0%; left: 5%; width: 90%; height: 100%; } 
.sec2 {border: 1px solid yellow; top: 0%; left: 5%; width: 90%; height: 100%; } 
.sec3 {overflow: auto; flex-grow: 1; border: 1px solid red; top: 0%; left: 2.5%; width: 95%; height: 100%; } 

/*SEPARADORES*/
.divisor  {border: 0px solid white; aspect-ratio: 1/0.070; top: 0%; left: 10%; width: 80%; }
.vacio11  {border: 0px solid red;   aspect-ratio: 1/0.020; top: 0%; left: 10%; width: 80%; }
.vacio12  {border: 1px solid red;   aspect-ratio: 1/0.160; top: 0%; left: 10%; width: 80%; }
.vacio13  {border: 0px solid red;   aspect-ratio: 1/0.027; top: 0%; left: 10%; width: 80%; }

/* TITULOS */
.titulo1 {border: 0px solid pink; position: relative; padding: 0px; padding-top: 3px; display: block;  
  left: 5%; width: 90%;
  border-bottom: 1px solid gray; aspect-ratio: 1/0.17;text-align:center; font-size:1.8vh; font-family: Arial; color: white; font-weight: bold;}
.titulo2 {position: relative; padding: 3px; display: block; 
  left: 10%; width: 80%;
  border-bottom: 1px solid gray; text-align:center; font-size:1.8vw; font-family: Arial; color: white; font-weight: bold;}
.titulo3 {border: 0px solid pink; aspect-ratio: 1/0.175; position: relative; padding: 3px; display: block;
  left: 5%; width: 90%;
  border-bottom: 1px solid gray; text-align:center; font-size:1.4vw; font-family: Arial; color: white; font-weight: bold;}

/* TITULOS INCLUYE Y PRECIO */
.inc1 { aspect-ratio: 1/0.075; border: 0px solid pink; position: relative; padding: 0px; display: block; 
  left: 10%; width: 80%;
  border-bottom: 1px solid gray; text-align:center; font-size:1.8vh; font-family: Arial; color: white; font-weight: bold;}
.inc2 { aspect-ratio: 1/0.075; border: 1px solid pink; position: relative; padding: 0px; display: block; 
  left: 10%; width: 80%;
  border-bottom: 1px solid gray; text-align:center; font-size:1.8vw; font-family: Arial; color: white; font-weight: bold;}
.inc3 { aspect-ratio: 1/0.075; border: 0px solid blue; position: relative; padding: 0px; display: block; 
  left: 10%; width: 80%;
  border-bottom: 1px solid gray; text-align:center; font-size:1.3vw; font-family: Arial; color: white; font-weight: bold;}

/*DESCIPCIÓN */
.tdes1 {aspect-ratio: 1/1.188; border: 0px solid magenta; left: 5%; width: 90%; position: relative; padding: 0px; display: block; 
  text-align:justify; font-size:1.7vh; font-family: Arial; color: white;}
.tdes2 {aspect-ratio: 1/1.000; border: 1px solid magenta; left: 10%; width: 80%; position: relative; padding: 0px; display: block; 
  text-align:justify; font-size:1.8vw; font-family: Arial; color: white;}
.tdes3 {aspect-ratio: 1/0.963; border: 0px solid magenta; left: 10%; width: 80%; position: relative; padding: 0px; display: block; 
  text-align:justify; font-size:1.0vw; font-family: Arial; color: white;}

/*QUE INCLUYE */
.queinc1 {aspect-ratio: 1/1.48; border: 0px solid magenta; left: 7%; width: 86%; position: relative; padding: 0px; display: block; 
  text-align:justify; font-size:1.7vh; font-family: Arial; color: white;}
.queinc2 {aspect-ratio: 1/1; border: 0px solid magenta; left: 10%; width: 80%; position: relative; padding: 0px; display: block; 
  text-align:justify; font-size:1.8vw; font-family: Arial; color: white;}
.queinc3 {aspect-ratio: 1/1.225; border: 0px solid magenta; left: 10%; width: 80%; position: relative; padding: 0px; display: block; 
  text-align:justify; font-size:1.00vw; font-family: Arial; color: white;}

/*FLECHA*/
.flechad {aspect-ratio: 1/0.1; background-image: url('https://carcare.mx/img/0.flechaup.webp'); 
  left: 10%; width: 80%;
  border: 0px solid red; background-size: 100%; background-repeat: no-repeat; background-position-y: top; background-position-x: center; 
  position: relative; display: block; }
.flechau {aspect-ratio: 1/0.1; background-image: url('https://carcare.mx/img/0.flechado.webp'); 
  left: 10%; width: 80%;
  border: 0px solid red; background-size: 100%; background-repeat: no-repeat; background-position-y: top; background-position-x: center; 
  position: relative; display: block; }

/*TIPO DE AUTO */
.tipo1 { aspect-ratio: 1/0.075; left: 10%; width: 80%; position: relative; padding: 3px; display: block; 
  border: 0px solid yellow; text-align:center; font-size:1.6vh; font-family: Arial; color: white; font-weight: bold;}
.tipo2 { aspect-ratio: 1/0.075; left: 10%; width: 80%; position: relative; padding: 3px; display: block; 
  border: 1px solid yellow; text-align:center; font-size:1.8vw; font-family: Arial; color: white; font-weight: bold;}
.tipo3 { aspect-ratio: 1/0.035; left: 10%; width: 80%; position: relative; padding 3px; display: block; 
  border: 0px solid yellow; text-align:center; font-size:1.2vw; font-family: Arial; color: white; font-weight: bold;}

/*NOTA */
.nota1 { aspect-ratio: 1/0.12; left: 1%; width: 98%; position: relative; padding: 0px; padding-left: 10px; padding-right: 10px; display: block; 
  border: 0px solid green; text-align:justify; font-size:1.35vh; font-family: Arial; color: white; font-style: italic;}
.nota2 { aspect-ratio: 1/0.12; left: 5%; width: 90%; position: relative; padding: 0px; padding-left: 10px; padding-right: 10px; display: block; 
  border: 1px solid green; text-align:justify; font-size:1.5vw; font-family: Arial; color: white; font-style: italic;}
.nota3 { aspect-ratio: 1/0.10; left: 5%; width: 90%; position: relative; padding: 0px; padding-left: 10px; padding-right: 10px; display: block; 
  border: 0px solid green; text-align:justify; font-size:0.8vw; font-family: Arial; color: white; font-style: italic;}

/*AGENDAR CITA*/
.cita1 { aspect-ratio: 1/0.15; left: 5%; width: 90%; position: relative; margin: 0; padding: 0px;  
  border: 0px solid red; align-items: center; display: block;}
.cita2 { aspect-ratio: 1/0.075; left: 10%; width: 80%; position: relative; margin: 0; padding: 0px;
  border: 0px solid red; align-items: center; display: block;}
.cita3 { aspect-ratio: 1/0.15; left: 10%; width: 80%; position: relative; margin: 0; padding: 0px;
  border: 0px solid red; align-items: center; display: block;}

/*VIA WHATS APP TEXTO*/
.viawa1 {left: 0%; width: 90%; height: 100%; position: absolute; 
 border: 0px solid green; margin: 0; padding: 0px; vertical-align: middle; text-align: center; display: inline-block; 
 font-size:1.8vh; font-family: Arial; color: white; font-weight: bold;}
.viawa2 {left: 5%; width: 80%; height: 100%; position: absolute; 
 border: 0px solid green; margin: 0; padding: 0px; vertical-align: middle; text-align: center; display: inline-block; 
 font-size:1.8vh; font-family: Arial; color: white; font-weight: bold;}
.viawa3 {left: 5%; width: 80%; height: 100%; position: absolute;   
 border: 0px solid green; margin: 0; padding: 0px; vertical-align: middle; text-align: center; display: inline-block; 
 font-size:1.0vw; font-family: Arial; color: white; font-weight: bold;}

/*VIA WHATS CUADRO IMAGEN */
.viawat1 {aspect-ratio: 1/1; left: 85%; top: 0; height: 100%; margin: 0; padding: 0px; position: absolute; 
 border: 0px solid blue; margin: 0; padding: 0px; text-align:center; display: inline-block; }
.viawat2 {aspect-ratio: 1/1; left: 85%; top: 0; height: 100%; margin: 0; padding: 0px; position: absolute; 
 border: 0px solid blue; margin: 0; padding: 0px; text-align:center; display: inline-block; }
.viawat3 {aspect-ratio: 1/1;left: 85%; top: 0; height: 100%; margin: 0; padding: 0px; position: absolute;   
  border: 0px solid blue; margin: 0; padding: 0px; text-align:center; display: inline-block;}

/*ICONO WHATS */
.iconowa1 {aspect-ratio: 1/1; /*filter: grayscale(100%);*/ height: 85%;}
.iconowa3 {aspect-ratio: 1/1; /*filter: grayscale(100%);*/ height: 85%;}
.iconowa3:hover {aspect-ratio: 1/1; height: 95%; filter: saturate(100%); transition-delay: 0.1s;}

/*SEDAN*/
.sed1 {border: 0px solid red; aspect-ratio: 1/0.382; background-image: url('https://carcare.mx/img/0.sed.webp'); 
  background-size: 100%; background-repeat: no-repeat; background-position-y: cener; background-position-x: center; 
  border-bottom: 1px solid gray; left: 10%; width: 80%; position: relative; display: block; 
  padding: 0px; font-size:1.7vh; text-align:right; font-family: Arial; color: white; }
.sed2 {border: 0px solid red; aspect-ratio: 1/0.295; background-image: url('https://carcare.mx/img/0.sed.webp');
  background-size: 100%; background-repeat: no-repeat; background-position-y: cener; background-position-x: center; 
  border-bottom: 1px solid gray; left: 10%; width: 80%; position: relative; display: block; 
  padding: 0px; font-size:1.8vh; text-align:right; font-family: Arial; color: white; }
.sed3 {border: 0px solid red; aspect-ratio: 1/0.288; background-image: url('https://carcare.mx/img/0.sed.webp');
  background-size: 100%; background-repeat: no-repeat; background-position-y: cener; background-position-x: center; 
  border-bottom: 1px solid gray; left: 10%; width: 80%; position: relative; display: block; 
  padding: 0px; font-size:1.0vw; text-align:right; font-family: Arial; color: white; }

/*SUV*/
.suv1 {border: 0px solid red; aspect-ratio: 1/0.382; background-image: url('https://carcare.mx/img/0.suv.webp');
  background-size: 100%; background-repeat: no-repeat; background-position-y: cener; background-position-x: center; 
  border-bottom: 1px solid gray; left: 10%; width: 80%; position: relative; display: block; 
  padding: 0px; font-size:1.7vh; text-align:right; font-family: Arial; color: white; }
.suv2 {border: 0px solid red; aspect-ratio: 1/0.295; background-image: url('https://carcare.mx/img/0.suv.webp');  
  background-size: 100%; background-repeat: no-repeat; background-position-y: cener; background-position-x: center; 
  border-bottom: 1px solid gray; left: 10%; width: 80%; position: relative; display: block; 
  padding: 0px; font-size:1.8vh; text-align:right; font-family: Arial; color: white; }
.suv3 {border: 0px solid red; aspect-ratio: 1/0.288; background-image: url('https://carcare.mx/img/0.suv.webp');  
  background-size: 100%; background-repeat: no-repeat; background-position-y: cener; background-position-x: center; 
  border-bottom: 1px solid gray; left: 10%; width: 80%; position: relative; display: block; 
  padding: 0px; font-size:1.0vw; text-align:right; font-family: Arial; color: white; }

/*VAN*/
.van1 {border: 0px solid red; aspect-ratio: 1/0.382; background-image: url('https://carcare.mx/img/0.van.webp'); 
  background-size: 100%; background-repeat: no-repeat; background-position-y: cener; background-position-x: center; 
  border-bottom: 1px solid gray; left: 10%; width: 80%; position: relative; display: block; 
  padding: 0px; font-size:1.7vh; text-align:right; font-family: Arial; color: white; }
.van2 {border: 1px solid red; aspect-ratio: 1/0.295; background-image: url('https://carcare.mx/img/0.van.webp');
  background-size: 100%; background-repeat: no-repeat; background-position-y: cener; background-position-x: center; 
  border-bottom: 1px solid gray; left: 10%; width: 80%; position: relative; display: block; 
  padding: 0px; font-size:1.8vh; text-align:right; font-family: Arial; color: white; }
.van3 {border: 0px solid red; aspect-ratio: 1/0.288; background-image: url('https://carcare.mx/img/0.van.webp');
  background-size: 100%; background-repeat: no-repeat; background-position-y: cener; background-position-x: center; 
  border-bottom: 1px solid gray; left: 10%; width: 80%; position: relative; display: block; 
  padding: 0px; font-size:1.0vw; text-align:right; font-family: Arial; color: white; }

/*REFERENCIA */
.ref1 {font-size:1.5vh; font-family: Arial; color: yellow; font-style: italic;}
.ref2 {font-size:1.5vw; font-family: Arial; color: yellow; font-style: italic;}
.ref3 {font-size:0.9vw; font-family: Arial; color: yellow; font-style: italic;}

/*TITULO VIDEO */
.unotit1 {font-family: Abril+Fatface; color: white; z-index: 2; font-size:3.0vh; vertical-align: middle;
           white-space: nowrap; text-wrap: nowrap; font-weight: bold; text-align:center;}
.unotit2 {font-family: Abril+Fatface; color: white; z-index: 2; font-size:2.5vh; vertical-align: middle;
           white-space: nowrap; text-wrap: nowrap; font-weight: bold; text-align:center;}
.unotit3 {font-family: Abril+Fatface; color: white; z-index: 2; font-size:3.5vw; vertical-align: middle;
           white-space: nowrap; text-wrap: nowrap; font-weight: bold; text-align:center;}

/*MOVIL*/
.video1 { display: flex; flex-direction: column; z-index: 10; position: fixed; top: 29%; left: 15%; width: 70%; 
          aspect-ratio: 1/1.6;}
.video2 {}
.video3 { display: flex; flex-direction: column; z-index: 10; position: fixed; top: 30%; left: 5%; width: 25%; 
          aspect-ratio: 1/1.28; }