* {margin:0;padding:0; font-family: Verdana;}
body {background-color:rgb(245,245,255); width:device-width;}

/* Estructura del menu*/
#menu{position: absolute;position:fixed;top: 0px;width: 100%;height: 120px;background-color: rgba(240,240,255,0.9); z-index:3;} 
#menu img{margin-left: 130px;margin-top:7px; width:190px;}
#menu ul{margin-left: 25%; margin-top: -80px;}

#menumob {width: 90px;height: 90px;position:absolute;position:fixed;z-index:4;top:15px;left:25px; transition-duration: 500ms;}
#menumob img{width:50px;height:40px;position:absolute;position:fixed;z-index:4;top:40px;left:35px;}
#menumob div{ padding-left:30px; margin-top:95px; margin-left:-25px; background-color:rgb(240,245,255); height:2100px; width:550px; transition-duration: 500ms; transform-origin: left; transform:scaleX(0);}
#menumob div ul a{text-decoration:none;}
#menumob div ul li{ margin-top: 10px; margin-left: 20px; color:rgba(0,0,0,0); font-weight: normal; font-size:40px; text-decoration:none;}
#menumob:hover div ul li{display:block; color:rgb(0,0,0); transform: scaleX(1);}
#menumob:hover div{display:block; transition-duration: 500ms; transform: scaleX(1);}



.nav li{padding: 8px 16px; margin-left:2%;}
.nav a li {color: #000000;text-decoration: none;font-size: 28px;display: block;z-index:1;transition-duration: 500ms;}
.nav a li{float: left;list-style: none;transition-duration: 500ms;border-radius: 10px;}
.nav a li:hover{background: rgb(170,170,245);z-index:1;color: white;}
.nav a > li:hover{color:white;}
.nav a li ul{background-color: rgba(255,255,255,0.8); display: none;position: absolute;width: 300px;}
.nav a li ul a{width: 250px;position: relative;left:20px;}
.nav a li:hover > ul{display: block;}

#banner_pagina{position:absolute;top:120px;left:0px;width: 1350px;height:120px;color:white;background-color: rgb(4,17,65);}
#banner_pagina2{position:absolute;top:220px;left:0px;width: 1350px;height:70px;color:white;background-color: rgb(4,7,35);}


#sub_banner_pagina{position:absolute;top:0px;left:0px;width: 1350px;height:20px;background-color:rgb(5,5,40);color:rgb(30,41,68);}
#sub_banner_pagina p{font-size:12px;color:white;margin-top:3px;}
#sub_banner_pagina table tr td{font-size:11px;color:white;margin-top:3px;}
#sub_banner_pagina table tr td a{text-decoration:none;color:white;}
#img_sub_banner_pagina {position:absolute;top:0px;left:0px;width: 1350px;height:20px;}
#img_sub_banner_pagina img{margin-top:2px;}

#imagenes{position: absolute;top: 170px;left:50px;width: 1250px;height: 200px;color: white;}

#videos{position: absolute;top: 195px;left:50px;width: 1250px;height: 700px;background: rgba(255,0,0,0);;color: white;}
.videos iframe{margin-left: 40px;margin-top: 25px;}

#nuevos_ingresos img{background:rgb(4,17,65);width:220px;height:220px; margin-left:20px; margin-bottom:20px;transition-duration: 500ms;}
#nuevos_ingresos img:hover{background:rgb(0,0,0);-webkit-transform:scale(1.091);transition-duration: 500ms;}

#promociones img{background:rgb(4,17,65);width:220px;height:220px; margin-left:20px; margin-bottom:70px;transition-duration: 500ms; }
#promociones img:hover{background:rgb(0,0,0);transition-duration: 500ms;}

#boton_buscar:hover{background:rgb(90,110,170);transition-duration: 400ms;color:white;}


/*SUB PAGINA DE QUIENES SOMOS*/
#contenedor{position: absolute;top: 100px;left:0px;width: 1250px;height: 1500px;background: rgba(255,0,0,0);;color: white;}
#contenido{position: absolute;top: 650px;left:50px;width: 1250px;height: 1460px;background: rgba(0,255,0,0);}
#contenido p{font-size:38px; color: rgb(8,34,130); text-align:justify; margin-bottom:80px;}
#contenido h3{font-size:50px; color: rgb(4,17,65); text-align:left; margin-bottom:30px;}
#contenido img{margin-top:100px; margin-bottom:100px;}
#mision{width:1150px;height:400px; padding:50px; margin-bottom:70px; border-radius:25px;}
#mision_titulo{width:350px; font-size:45px; padding:20px; text-align:center; margin-bottom:30px; border-radius:15px;}

#nosotros_marcas img{width:225px; height:225px;margin-top:10px; margin-bottom:10px;}



#info{position:absolute; top:300px; left:50px; width:1250px; height:1750px; color:white;}
#info h3{font-size:50px; color: rgb(4,17,65); text-align:left; margin-bottom:30px;}


.ban img{margin-top: 80px; margin-bottom: 50px;width: 1250px;}

.album img{width: 380px;height: 285px;margin-left: 17px;margin-right: 14px;margin-bottom: 30px;}









/* BUSCADOR DE VER DETALLES PRODUCTOS*/
#contenedor_busqueda_productos{position: absolute; top: 300px;width: 1350px; height: 800px; font-size:35px;}
#contenedor_busqueda_productos form input{background:black; padding:20px; color:white; width:1300px;margin-left:25px; margin-top:20px; font-size:37px;}


/* CAJA DE RESULTADOS DE BUSQUEDA DE PRODUCTOS*/
#result ul a li{display:block;transition-duration: 300ms;}
#result ul a:hover li{background:rgb(210,210,230);}

/* CAJA DE DATOS DE PRODUCTO BUSCADO*/  
#busqueda{width: 1250px; padding: 25px; background-color:white; margin-top:30px;margin-left:25px;}
#busqueda img{width:1250px;height:1250px;background: rgb(255,255,255);transition-duration: 300ms;}
#busqueda table tr{height:35px; font-size:30px;}

table.detallesprod{background:white; }
table.detallesprod tr td{ font-size:40px; height:80px; padding-left:20px;}
table.detallesprod tr td button{ width:300px; height:65px;font-size:35px; color:white; margin-left:30px;}
table.detallesprod tr td table tr td{ font-size:32px; height:40px;}



/* IMAGENES DE BUSQUEDA DE PRODUCTOS MISMA CATEGORIA*/
#coincidencias{width: 1300px;height: 600px;margin-top: 50px;margin-left: 32px;}
#coincidencias table tr td{text-align:center;}
#coincidencias table tr td{font-size:11px;}
td.imagenes_coincidencias {background-color:rgb(0,0,50);}
td.imagenes_coincidencias:hover {background-color:rgb(110,0,0); transition-duration: 400ms;}
td.imagenes_coincidencias p{font-size:40px;}
td.imagenes_coincidencias img{width:600px;height:600px;transition-duration: 400ms; margin-top:10px;}

.imagenes_coincidencias button {background:rgb(240,140,0); width:400px; height: 90px; font-size:35px; color:white; margin-top:60px; margin-bottom:60px; border-radius:45px;}
.imagenes_coincidencias button img{width:225px; height:45px;}




td.imagenes_coincidencias li:hover{background:rgb(4,17,66);}




#contenedor_servicios{position: absolute;top: 280px;left:50px;width: 1250px;height: 2000px;}
#contenedor_servicios h2{font-size: 40px;text-align: center;color: black;}

#contenedor_productos{position:absolute; top:210px; left:0px; width: 1350px; height: 1500px;}

ul.columns li {width: 600px;height: 900px;float: left; display: inline;margin-left:50px; padding: 0;position: relative;background: rgb(100,100,120);margin-bottom: 150px; color:black; align:center;}
ul.columns li:hover {z-index: 1;background: rgb(160,10,0); transition-duration: 400ms;}
ul.columns li img {width: 600px;height: 600px;transition-duration: 500ms;}
ul.columns li p {font-size:40px; color:white; text-align:center; margin-top:8px;}
ul.columns li button {background:rgb(240,140,0); width:400px; height: 90px; font-size:35px; color:white; margin-left:100px; margin-top:30px; border-radius:45px;}
ul.columns li button img{width:225px; height:45px;}
ul.columns li .info {position: absolute;left: -5px; top: -5px;z-index: 1;display: none;background: rgba(4,17,66,0);}
ul.columns li .info input{width: 120px;margin-top:220px;margin-right: 10px;margin-left: 60px;  background: rgba(110,110,110,1);color:rgb(255,255,255);font-size: 12px;}
ul.columns li:hover .info {display: block;width: 250px;height: 250px;}

ul.sub_categoria li {width: 240px;height: 240px;float: left; display: inline;margin-left:20px;margin-top:20px; padding: 0;background:rgb(4,17,66);position: relative;}
ul.sub_categoria li:hover {z-index: 2;}
ul.sub_categoria li img {z-index: 0;position: relative;width: 240px;height: 240px;transition-duration: 400ms;}
ul.sub_categoria li:hover img{position: absolute;margin-left: 10px;width: 220px;height: 220px;z-index: 2;margin-top: 10px;}

.subnav li{float: left;list-style: none;width: 220px;height: 26px;background:rgb(110,110,120);padding-top: 6px;padding-left: 7px;transition-duration: 400ms;}
.subnav a li{color: white;text-decoration: none;font-size: 10.5px;font-family: Verdana;text-align: justify;}
.subnav a li ul{z-index:2;display: none;position: relative;left:220px;top:-19px;width: 300px;}
.subnav a li:hover{background: rgb(14,27,86);z-index:1;}
.subnav a:hover li ul {background: rgb(14,27,86);display:block;}

.subnav2 li{font-size:10.5px;color:white;float: left;list-style: none;width: 220px;height: 26px;background:rgb(110,110,120);padding-top: 6px;padding-left: 7px;transition-duration: 400ms;}
.subnav2 li ul{color: white;text-decoration: none;font-size: 10.5px;font-family: Verdana;text-align: justify;}
.subnav2 li ul a li{z-index:2;display: none;position: relative;left:220px;top:-19px;width: 200px;color:white;}
.subnav2 li:hover{background: rgb(14,27,86);z-index:1;}
.subnav2 li:hover ul a li{z-index:1;display:block;}
.subnav2 li ul a li:hover{background: rgb(14,27,86);display:block;}

#cab{position: absolute;left: 0px;top: 80px;width: 1350px;height: 90px;}


#submenu{position: absolute;left: 25px;top: 210px;width: 0px;height: 0px;}




#textos{color:white;width: 450px;height: 300px;margin-top: -300px;margin-left: 450px;}
#textos h3{font-size: 15px;}
#textos h4{margin-left:20px;font-size: 13px;}
#textos p{margin-left:20px;font-size:13px;text-align:justify;}



#formulario{width: 600px;height: 400px;background-image:url('../Imagenes/Paginas/formulario.png');background-size: cover;font-size: 14px;margin-top: 100px;margin-left: 200px;color: white;}
#formulario h4{font-size:12px;}
#formulario form input{width:500px;margin-left:50px;background: rgba(255,255,255,0.4);color:rgba(0,0,0,0.8);}
#formulario form textarea{width:500px;height:80px;margin-left:50px;margin-bottom:  15px;background: rgba(255,255,255,0.4);color:rgba(0,0,0,0.8);}
#formulario form p{width:500px;margin-left:50px;margin-bottom: 5px;}


#catalogo_formulario{width: 1350px;height: 1800px; background-image:url('../Imagenes/Paginas/catalogo_cel.png'); font-size: 12px;position:absolute; top: 1550px;left: -220px;color: red;}
#catalogo_formulario table tr h4{font-size:12px;}
#catalogo_formulario table tr{height:25px;}
#catalogo_formulario table tr td input{width:100%; color:black;}
#catalogo_formulario table tr td textarea{width:100%;height:50px;resize:none;}


#tbcat_formulario tr td {font-size:50px;} 
#tbcat_formulario_2 tr td {height:70px; font-size:45px;}
#tbcat_formulario_2 tr td h4{font-size:30px;}
#tbcat_formulario_2 tr td p{font-size:30px;}
#tbcat_formulario_2 tr td input{height:50px; color:black; font-size:45px; background-color:rgb(240,240,240);}
#tbcat_formulario_2 tr td #boton_enviar_catalogo{color:white; background-color:rgb(20,0,80);}
#tbcat_formulario_2 tr td #boton_enviar_catalogo:hover{color:black; background-color:rgb(255,130,00); transition-duration:400ms; }



/* FORMULARIO DE CONTACTO DE PAGINAS*/
#pag_detpro_formulario{width: 1250px;height: 1050px; font-size: 30px;position:absolute; margin-left:50px; margin-top:1150px; background:white;}
#pag_detpro_formulario table tr h4{font-size:35px; font-weight: normal; margin-bottom:50px;}
#pag_detpro_formulario table tr h3{font-size:42px;}
#pag_detpro_formulario table tr{height:25px; height:50px;}
#pag_detpro_formulario table tr td p{font-size:30px; font-weight:bold;}
#pag_detpro_formulario table tr td input{width:100%;color:rgb(0,0,0); height:60px; margin-bottom:30px; font-size:30px;}
#pag_detpro_formulario table tr td textarea{width:100%;height:130px;resize:none; font-size:30px;}




#respuesta{margin-top: 25px;margin-left:200px;width: 600px;height: 20px;color: black;font-size:13px;}

/* MENU DE SUBMENU INFERIOR*/
#subpag {position:absolute; top:10900px; left:0px; width:1350px; height:90px; font-size:35px; background:none;}
#subpag input{margin:15px;padding:5px;border-radius:5px;background:white;transition-duration:0.2s; font-size:35px; width:70px;}
#subpag input:hover{background:rgb(120,120,150);color:white;}


/* SUB MENU INFERIOR PRINCIPAL*/
#datos{position: absolute;width: 1350px;height: 160px;background: rgb(4,17,66);color:#FFFFFF;left: 0px;top:11200px;}
.datos{text-align: center;font-size: 33px;}
.datos a{margin-left: 25px;margin-right: 25px;}
.datos h2{margin-top:8px;font-size: 25px;}
.datos p b a{text-decoration: none;color: white;}
.datos p b a:hover{text-decoration: underline white; }


/* SECCION DE WHSTASPP*/
#whats {width: 550px;height: 110px;position:absolute;position:fixed;z-index:3;top:2320px;left:1250px;border-radius: 15px;transition-duration: 500ms;}
#whats img{width:160px;height:160px;position:absolute;position:fixed;z-index:2;top:2300px;left:1200px;}
#whats p{margin-top: 10px;margin-left: 20px; color:rgba(0,0,0,0); position:absolute; font-weight: normal; font-size:35px; transition-duration: 500ms;transform-origin: right;transform:scaleX(0);}
#whats:hover{background:rgba(255,255,255,1);left:690px;}
#whats:hover p{color:rgba(0,0,0,1);display:block;transform: scaleX(1);}

#form_sesion{width:600px;height:700px;position:absolute;font-family: Verdana;top:300px;left:350px; background:white; padding:50px;}
#form_sesion p{color: black; font-size: 33px;}
#form_sesion input{ font-size: 33px; margin-bottom:80px; height:65px; width:550px;}


#S1{width:1350px;height:130px;background-color:none;font-family: Verdana;position:absolute;top:500px;left:510px}
#S1 table tr td form select {font-size:55px; width: 120px;}
#S1 table tr td form select option{font-size:15px;}
#S1 table tr td form button{font-size:40px; margin-left:80px; width:250px; height:50px; background-color:rgb(250,200,30)}

#S2{width:500px;height:90px;position:absolute;font-family: Verdana;top:0px;left:0px;}
#S2 p{position:absolute;top:15px;color: white;font-size: 13px;}
#S2 input{position:absolute;width:220px;top:15px;}