a {text-decoration: none;}
/* ENCABEZADO */
/* LOGOTIPO */
.encabezadoA1 {border: 0px solid green; display: block; height: 15%; width: 90%; position: fixed; 
              top: 2.5%; left: 5%; background-color: transparent;  z-index: 20; padding: 0px; text-align: center;}
.encabezadoA2 {display: block; height: 15%; width: 30%; position: fixed; 
             top: 2.5%; left 5%; transform: translate(-50%, 0%); padding: 0px; 
             border: 1px solid blue; z-index: 12;}
.encabezadoA3 {border: 0px solid green; display: block; height: 15%; width: 30%; position: fixed; 
              top: 2.5%; left: 5%; background-color: transparent; z-index: 12; padding: 0px; text-align: left;}
/*Logotipo y Detallado Automotriz*/
/*Logotipo*/
.clogotipo  { aspect-ratio: 1/1;  border: 0px solid red; height: 100%; position: relative; 
             display: inline-block; z-index: 21;}
.img11 {aspect-ratio: 1/1; height: 100%; }
/*Cuadro Detallado automotriz*/
.cdetallado1 { aspect-ratio: 2/1;  border: 0px solid blue; height: 50%; position: relative; 
             display: inline-block; z-index: 20; transform: translate(0%, -80%); text-align: left;}
.cdetallado2 { aspect-ratio: 3/1;  border: 1px solid green; height: 50%; position: relative; 
             display: inline-block; z-index: 20; transform: translate(0%, -70%);} 
.cdetallado3 { aspect-ratio: 2/1;  border: 0px solid red; height: 50%; position: relative; 
             display: inline-block; z-index: 20; transform: translate(0%, -55%);} 
/*Texto DETALLADO AUTOMORIZ*/
.detallado1 { font-family: Abril+Fatface; color: black; z-index: 21; font-size:2.5vh; vertical-align: middle;
             margin-left: 10px; white-space: nowrap; text-wrap: nowrap;}
.detallado2 { font-family: Abril+Fatface; color: green; z-index: 21; font-size:3vh; vertical-align: middle;
             margin: 0px; white-space: nowrap; text-wrap: nowrap;}
.detallado3 { font-family: Abril+Fatface; color: black; z-index: 21; font-size:2vw; vertical-align: middle;
             margin-left: 10px; white-space: nowrap; text-wrap: nowrap;}
/*Texto HERMOPSILLO*/
.hermosillo1 { text-decoration: none; font-family: Arial; color: black; font-size:1.5vh; text-decoration: none; 
              margin-left: 10px;  white-space: nowrap; word-wrap: nowrap;}
.hermosillo2 { font-family: Arial; color: blue;  font-size:3vh; text-decoration: none; margin-left: 10px; 
              white-space: nowrap; word-wrap: nowrap;}
.hermosillo3 { font-family: Arial; color: black;   font-size:1vw; text-decoration: none; margin-left: 10px; 
               white-space: nowrap; word-wrap: nowrap;}


/* MENU */
/* Cuadro MENU */
.encabezadoB1 {border: 0px solid blue; display: block; height: 4%; width: 100%; position: fixed; 
              top: 18%; left: %; background-color: transparent; z-index: 20; padding: 0px; text-align: center;}
.encabezadoB2 {display: block; height: 15%; width: 30%; position: fixed; 
             top: 2.5%; left 35%; transform: translate(70%, 0%); padding: 0px; 
             border: 0px solid red;}
.encabezadoB3 {border: 0px solid blue; display: block; height: 7%; width: 40%; position: fixed; 
              top: 2.5%; left: 35%; background-color: transparent; z-index: 15; padding: 0px; text-align: center;}
/* Botones MENU */
.botonmenu1 { border: 1px solid gray; height: 100%; width: 30%; position: relative; text-decoration: none;
             display: inline-block; z-index: 21; transform: translate(0%, 25%); font-family: Arial; 
             font-size: 1.8vh; color: black; place-items: center; padding-top: 3px;}
.botonmenu2 { border: 1px solid white; height: 100%; width: 30%; position: relative; text-decoration: none;
             display: inline-block; z-index: 15; transform: translate(0%, 25%); font-family: Arial; 
             font-size: 3vh; color: black; place-items: center; padding-top: 7px;}
.botonmenu3 { border: 1px solid gray; height: 80%; width: 30%; position: relative; text-decoration: none;
             display: inline-block; z-index: 15; transform: translate(0%, 25%); font-family: Arial; 
             font-size: 1.1vw; color: black; place-items: center; padding-top: 9px;}
.botonmenu3:hover {border: 1px solid black; color: gray;}
/* REDES */
.encabezadoC1 {border: 0px solid red; display: block; height: 7%; width: 100%; position: fixed; 
              top: 93%; left: 0%; background-color: white; z-index: 20; padding: 0px; text-align: center;}
.encabezadoC2 {display: block; height: 15%; width: 30%; position: fixed; 
             top: 2.5%; right 5%; transform: translate(100%, 50%); padding: 0px; 
             border: 1px solid blue;}
.encabezadoC3 {border: 0px solid red; display: block; height: 7%; width: 20%; position: fixed; 
              top: 2.5%; left: 75%; background-color: transparent; z-index: 15; padding: 0px; text-align: right;}
/* REDES SOCIALES*/
.redes1 {aspect-ratio: 1/1; border: 0px solid blue; display: inline-block; height: 100%; margin: 0; padding: 0;}
.redes2 {aspect-ratio: 1/1; height: 80%;}
.redes3 {aspect-ratio: 1/1;  border: 0px solid blue; display: inline-block; height: 100%; margin: 0; padding: 0;}
.redes31 {aspect-ratio: 1/1; border: 0px solid blue; display: inline-block; height: 100%; margin: 0; padding: 0;}
.redes32 {aspect-ratio: 1/2; border: 0px solid blue; display: inline-block; height: 100%; margin: 0; padding: 0;}
.redes33 {aspect-ratio: 1/3; border: 0px solid blue; display: inline-block; height: 100%; margin: 0; padding: 0;}
.redess1 {aspect-ratio: 1/1; /*filter: grayscale(100%);*/ height: 100%;}
.redess2 {aspect-ratio: 1/1; /*filter: grayscale(100%);*/ height: 100%;}
.redess3 {aspect-ratio: 1/1; /*filter: grayscale(100%);*/ height: 85%;}
.redess3:hover {aspect-ratio: 1/1; height: 95%; filter: saturate(100%); transition-delay: 0.1s;}
.redess4 {aspect-ratio: 1/1; /*filter: grayscale(100%);*/ height: 25%;}
.redess4:hover {aspect-ratio: 1/1; height: 35%; filter: saturate(100%); transition-delay: 0.1s;}

.serv1 { text-decoration: none; font-family: Arial; font-size: 1.8vh; color: white; text-decoration: underline;}
.serv2 { text-decoration: none; font-family: Arial; font-size: 1.8vh; color: white; text-decoration: underline;}
.serv3 { text-decoration: none; font-family: Arial; font-size: 1.1vw; color: white; text-decoration: underline;}

/*ABOUT*/
.about1 { border: 1px solid gray; display: block; width: 35%; height: 5%; position: fixed; border-radius: 8px; 
          top: 40%; left: 75%; background-color: rgba(0, 0, 0, 0.55); z-index: 13; padding: 0px; padding-top: 8px;text-align: center;
          text-decoration: none; font-family: Arial; font-size: 1.8vh; color: #D3D3D3; transform: rotate(270deg);}
.about2 { border: 0px solid gray; display: block; height: 5%; width: 20%; position: fixed; 
          top: 93%; left: 80%; background-color: white; z-index: 20; padding: 0px; text-align: center;
          text-decoration: none; font-family: Arial; font-size: 1.8vh; color: white; text-decoration: underline;}
.about3 { border: 1px solid #D3D3D3; border-radius: 15px; display: block; height: 5%; width: 15%; position: fixed; 
          top: 25%; left: 80%; background-color: transparent; z-index: 20; padding: 0px; padding-top: 8px; text-align: center;
          text-decoration: none; font-family: Arial; font-size: 1.1vw; color: #D3D3D3;}