@charset "utf-8";
/* CSS Document */

* { border:0;
margin:0;
padding:0;
box-sizing:border-box;}
a { text-decoration:none; }
img, video { max-width:100%;}
strong, input[type="submit"] {font-family: 'din-bold';}
h1, h2, h3, h4 { font-weight:normal; font-family: 'DINPro-Regular';}
input[type="submit"]:hover,  a:hover, button:hover{ opacity:0.8;}
input[type="submit"] { -webkit-appearance: none;}

body { font-family: 'din-regular', sans-serif; font-size:16px; color:#3e3e3e; background:#fff;  }

#top, #nav, #banner, .home, #tit, .main { 
display:block; width:100%;
}
.cont { width:1110px; margin:0 auto;}

#top {  font-size:0; background:#fff; }
#top .cont {padding:20px 0 ;}
h1, #top p { display:inline-block;  vertical-align:middle;}
h1 { width:30%; }
#top p { width:70%; text-align:right; font-size:18px; text-transform:uppercase;}

#nav { background:#20667a;}
ul#menu  { list-style:none; }
ul#menu li:first-child { padding-left:0;}
ul#menu li { padding-right:51px; font-size:15px; line-height:40px; display:inline-block;  vertical-align:middle; text-transform:uppercase; letter-spacing:0.5px;  }
ul#menu li.pedidos { padding:0 18px; background:#c32927; font-family: 'din-bold';}
ul#menu li a { color:#fff; }
ul#menu li a:hover, ul#menu li.current a { color:#fff; }

.col2, .col3, .col4, .col4-3, .col3doble, .col6, .colleft { display:inline-block; vertical-align:top;}
.col3 { width:350px;}
.col3doble { width:730px;}
.col4 { width:255px;}
.col4-3 { width:825px;}
.col2 { width:540px;}
.col6 { width:160px;}
.right-gap { margin-right:25px;}
.left-gap { margin-left:25px;}

#banner { background:#4c808e url(images/bg-banner.jpg) right top no-repeat; height:460px; padding:30px 0;}
#banner .col3doble, #banner .col3 { height:400px;}
#banner .col3doble { background: #191e37 url(images/banner.jpg) no-repeat;}
#banner .col3doble p { text-align: center; width: 280px; line-height:40px; border:solid 2px #c32927; margin:30px 30px 0 0; float:right;}
#banner .col3doble a { color:#fff; text-transform:uppercase; font-size:22px; }
#banner .col3 { background:rgba(32,102,122,.8); padding:30px; color:#fff;}
#banner .col3 h3 {text-transform:uppercase; font-size:30px; border-bottom:solid 1px #7ea6b1; padding-bottom:18px;}
#banner .col3 h4 { font-size:22px; padding:18px 0;}
#banner .col3 h4 a { color:#fff;}

.home { padding:40px 0;}
.home h2 { color:#c32927; text-transform:uppercase; text-align:center; font-size:24px; padding-bottom:30px;}
.home p {text-align:justify; line-height:21px; margin-bottom:10px;}

#tit { background:#4c808e url(images/bg-banner.jpg) no-repeat right top -170px;}
#tit h2{font-size:32px; color:#fff;  line-height:100px; text-transform:uppercase;}

.main { min-height:350px; padding:40px 0;}
.main p { margin-bottom:16px; line-height:1.4; text-align:justify;}
.main a{ color:#c32927; font-family: 'din-bold';}
.main h3 {color:#c32927;  font-size:26px;}
.main h4 {color:#c32927;  font-size:22px;}
.main ul { margin-left:16px; line-height:1.8; margin-bottom:16px;}

.tog { border-bottom:solid 1px #ccc; margin-bottom:20px; margin-bottom:20px;}
.faq h4{ position: relative; padding-bottom:10px; }
.faq h4 a {font-family: 'DINPro-Regular' !important;}
.faq h4:hover{cursor:pointer;}
div.expand{display:none;padding:10px 0 ;z-index:-4;}

.contact input, .contact textarea, .contact select { padding:5px 10px; font:inherit; color:inherit; border:solid 1px #ccc; height:30px; background:#fff; width:100%; display:block; vertical-align:top; margin-bottom:20px; margin-top:5px;}
.contact textarea { height:100px; width:100%; }
input[type="submit"]{  padding:0; width:40%; color:#fff;  display:block; background:#c32927; border:none; margin:0; text-transform:uppercase; height:40px;  font-family: 'din-bold';}

.catalogo .col4 { margin-right:25px; margin-bottom:30px;}
.catalogo .col4:nth-of-type(4n+4) { margin-right:0px;}
.catalogo .col4  img { display:block;}
.catalogo .link { width:100%; height:0; position:absolute; bottom:0; left:0;transition:all 0.75s linear 0s; 
background:rgba(0,0,0,.6) url(images/plus.png) no-repeat center center; }
.catalogo a { display:block;  position:relative;}
.catalogo a:hover .link { height:170px; opacity:1; }
.catalogo .col4 h4{ text-align:center; font-size:22px; text-transform:uppercase; padding:10px 0; background:#ccc; color:#3e3e3e; }

.producto h2 {line-height:1; margin-bottom:20px; color:#4c808e;  font-size:28px;}
.producto h3 { font-size:24px; padding-bottom:10px; line-height:1; border-bottom:solid 1px #ccc; margin-bottom:20px;}

.producto p { margin-bottom:10px;}
.producto table { font-size:13px; width:100%; margin-top:20px; text-align:center;}
.producto td { vertical-align:top; border-bottom:solid 1px #ccc; padding:2px 0;}
.producto tr:first-of-type {color:#296b7e; }
.producto td:first-child { padding-right:2px; }

.news .col3 { margin-right:25px; margin-bottom:40px; min-height:300px; border-bottom:solid 1px #ccc; padding-bottom:10px;}
.news .col3:nth-of-type(3n+3) { margin-right:0px;}
.news .foto { background:#f0f0f0; height:193px; text-align:center;}
.news .foto img { margin:0 auto; max-height:100%;}
.news .col3 h3 { line-height:1; margin:10px 0; font-size:24px;}
.news .col3 h3 a{ color:#3e3e3e; font-family:'DINPro-Regular'; }
.news .leer { display:inline-block; font-size:11px; padding:4px 14px; text-transform:uppercase;
color:#296b7e; font-family:'DINPro-Regular'; border:solid 1px #296b7e; margin-top:10px;}

.login .col3doble { padding-left:40px; border-left:solid 1px #eee;}
.login h3 { margin-bottom:20px;}
.login input, .login textarea, .login select { padding:5px 10px; font:inherit; color:inherit; border:solid 1px #ccc; height:30px; background:#fff; width:100%; display:block; vertical-align:top; margin-bottom:20px; margin-top:5px;}
.login textarea { height:100px; width:100%; }
.login .log input { width:60%;}
.login .log input[type="checkbox"] { display:inline-block; width:20px; height:20px; vertical-align:middle; margin:0; }
.login input[type="submit"]{  padding:0; width:40%; color:#fff;  display:block; background:#c32927; border:none; margin:0; text-transform:uppercase; height:40px;  font-family: 'din-bold';}
.login a {font-size:13px; font-family:'DINPro-Regular';}
.login .col3doble span { display:none;}

.forgot input { padding:5px 10px; font:inherit; color:inherit; border:solid 1px #ccc; height:30px; background:#fff; width:50%; display:inline-block; vertical-align:middle; margin-left:6px; }
.forgot input[type="submit"] { width:20%;  display:inline-block; color:#fff; background:#c32927; border:none; margin:0; text-transform:uppercase; height:30px;  font-family: 'din-bold'; font-size:14px; }
.forgot span.KT_field_hint { display:none;}
.forgot form { margin-bottom:20px;}

.listado .col3 { padding-right:40px; border-right:solid 1px #eee;}
.listado .col3 h3, .listado #carro { margin-bottom:20px;}
.listado .boton {color:#fff; background:#c32927; width:60%; padding:10px 0; font-size:14px; text-align:center;
display:inline-block;}
.listado .col3 ul { list-style:none; margin-left:0;}
.listado .col3 ul li{ margin-bottom:15px; border-bottom:solid 1px #ccc; overflow:hidden; }
.listado .col3 ul li input[type="button"]{ float:right; margin:4px 0; border:solid 1px #296b7e; color:#296b7e; font-size:11px; padding:4px; text-transform:uppercase; background:#fff; cursor:pointer; }

.listado table { font-size:13px; width:100%; margin-bottom:40px; }
.listado td { vertical-align:top; border-bottom:solid 1px #ccc; padding:3px 6px 3px 0;}
.listado tr:first-of-type {color:#296b7e; }
.listado td input { border:solid 1px #ddd;}
.listado td input[type="button"] { border:none; background:#296b7e; text-transform:uppercase; font-family:inherit; color: #fff; font-size:11px; height:20px; padding:0 6px; cursor:pointer;}

.pedido ul { list-style:none; width:50%; margin:30px 0;}
.pedido ul li{ margin-bottom:15px; border-bottom:solid 1px #ccc; }
.pedido textarea { padding:5px 10px; font:inherit; color:inherit; border:solid 1px #ccc; 
height:100px; width:50%; display:block; vertical-align:middle; margin-bottom:30px;  }
.pedido input[type="submit"] { width:20%; }


#footer { background:#ccc; font-family:'DIN-Medium';}
#footer .bot {padding:20px 0;  font-size:14px; }
#footer .bot a {color:#296b7e; font-family: 'din-bold';}
#footer .pie {padding:10px 0; color:#666; font-size:11px; border-top: solid 1px #999;  }
#footer .pie a {color:#666;}
#footer p { display:inline-block; vertical-align:middle; width:49.7%;}
#footer .right { text-align:right; }


/*Style 'show menu' label button and hide it by default*/
.show-menu {
	color: #FFF;
	display: none; padding:0px 0 0px 0;
}
.show-menu img { height:18px; vertical-align:bottom; padding-left:5px;}
/*Hide checkbox*/
input[type=checkbox]{
    display: none;
}

/*Show menu when invisible checkbox is checked*/
input[type=checkbox]:checked ~ #menu{
    display: block;
}

.nume { width:40px; }

::-webkit-input-placeholder {color: #3e3e3e; opacity:1;}
:-moz-placeholder {color: #3e3e3e; opacity:1;}
::-moz-placeholder {color: #3e3e3e; opacity:1;}
:-ms-input-placeholder {color: #3e3e3e; opacity:1;}


#background-video{
object-fit: cover;
    width: 730px;
    height: 400px;

}

.right-aligned-container {
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

.right-aligned-container a {
    margin: 0 10px;
    color: #000000; /* Esto se aplicará solo si hay texto dentro del enlace */
}



@media screen and (max-width: 1110px){
.cont { width:97%; }
#banner .col3doble { background-size:contain;}
.col3 { width:31.5%;}
.col3doble { width:65%;}
.col4 { width:23%;}
.col4-3 { width:74%;}
.col2 { width:48.6%;}
.col6 { width:14.4%; }
.right-gap { margin-right:2.2%;}
.left-gap { margin-left:2.25%;}
ul#menu li { padding-right:2%;}
#banner .col3doble p { width:44%;}
.catalogo .col4, .news .col3 {margin-right:2.2%;}
.catalogo a:hover .link { height:100%;}



}

@media screen and (max-width: 940px){
ul#menu li { font-size:14px; letter-spacing:0;}
#banner { height:auto;}
#banner .col3doble, #banner .col3 { height:370px;}
.col4 { width:22.9%;}
.login .log input { width:100%;}
#tit h2 { line-height:1; padding:30px 0;}
.forgot input[type="submit"] { width:30%;}
.listado .boton {width:100%; }
#background-video {
    height: 370px;
}

}

@media screen and (max-width: 840px){
ul#menu li { padding-right:1.25%;}
ul#menu li.pedidos { padding:0 1.2%;}
#banner .col3doble, #banner .col3 { height:310px; z-index:1;}
#banner .col3doble p { margin:5% 5% 0 0;}
#banner .col3 { padding:3%;}
#banner .col3 h3 {padding-bottom:15px;}
#banner .col3 h4 { padding:15px 0;}
.producto tr:first-of-type { font-size:12px;}
#background-video {
    height: 310px;
}
}

@media screen and (max-width: 800px){
.producto .col2{ width:100%; display:block;}
/*.producto .right-gap { margin-right:0; margin-bottom:30px;}*/
.producto tr:first-of-type { font-size:13px;}
}

@media screen and (max-width: 768px){
#top p { font-size:16px;}	
	#nav { text-align:right; height:40px; display:inline-block; }
/*Make dropdown links appear inline*/
	/*#nav ul {
		position: relative; z-index:40;display: none;
	}

	#nav li {
		margin-bottom: 0px;
	}
	#nav ul li, #nav  li a {
		width: 100%; display:block;
	}
	.show-menu {
	display:block; line-height:40px; cursor:pointer; font-size:15px; color:#fff; text-transform:uppercase;
	}
.show-menu img { vertical-align: text-bottom; margin-left:0;}
ul#menu { width:200px; float:right; margin-right:18px; top:0px; background:#20667a; border-bottom:solid 2px #fff;}
ul#menu li { padding:0; line-height:normal;}
ul#menu li a {background:rgba(255,255,255, 0.8); border:solid 1px #fff; padding:10px; color:#fff; }
ul#menu li a:hover {background:#fff; color:#802528; }*/
#banner .col3doble { background-position:bottom; background-color:#323551;}
#banner .col3doble p { margin:5%; width:90%;}
#banner .col3 h3 { font-size:24px;}
#banner .col3 h4 { font-size:22px;}
#tit h2 { font-size:26px; line-height:normal; padding:30px 0;}
#tit { background-position: right top -190px;}
.main .contact .col3 p{ font-size:15px; text-align:left;}
.catalogo .col4 h4 { font-size:20px;}
.news .foto { height:auto;}
.listado .col3 { padding-right:20px;}
}

@media screen and (max-width: 690px){
.col4 { width:22.8%;}
.news .col3 {margin-right:2%;}
}

@media screen and (max-width: 680px){
.main .contact .col3 p{ font-size:14px;}
.catalogo .col4 h4 { font-size:18px;}
.listado .col3, .listado .col3doble {width:100%; display:block;}
.listado .col3 { padding-right:0px; border:none; margin-bottom:30px;}
.listado .col3doble td img { min-width:50px;}
.listado table { font-size:11px; }
.listado td { padding:3px 3px 3px 0;}
.pedido ul, .pedido textarea, .pedido input[type="submit"] { width:100%; }
}

@media screen and (max-width: 580px){
h1 { width:32%; }
#top p { width:68%;padding-left:20%;}
.col2, .col3, .col4, .col4-3, .col3doble,  .col6 { width:100%; display:block;}
.right-gap { margin-right:0; margin-bottom:30px;}
.left-gap { margin-left:0;}
#banner { padding:20px 0;}
#banner .col3doble { background-size:cover; height:280px;}
#banner .col3doble p { margin:4%; width:50%;}
#banner .col3 { height:auto;}
#banner .col3 h4, #banner .col3 img { display:inline-block; vertical-align:top; width:49%;}
#banner .col3 img { width:50%; padding-left:2%;}
#footer p { display:block; width:100%; text-align:center;}
#footer .right {  text-align:center; padding-top:10px;}
.catalogo .col4 h4 { font-size:24px;}
.login .col3doble { padding-left:0px; border-left:none;}
.forgot input, .forgot input[type="submit"], .forgot label { display:block; margin-left:0; margin-bottom:10px;}
.forgot input { width:100%;}
.forgot input[type="submit"] { width:50%;}
.listado td input { width:90%;}
}

@media screen and (max-width: 480px){
h1, #top p { display:block; width:100%;}
#top p { font-size:15px; padding-left:0%; text-align:left; padding-top:10px;}
#banner .col3 img { width:49%;}
#banner .col3doble a { font-size:18px;}
.contact input[type="submit"] { width:100%;}
.producto table, .producto tr:first-of-type  { font-size:12px;}

}

@media screen and (max-width: 390px){
.producto tr:first-of-type  { font-size:11px;}
}


@media screen and (max-width: 380px){
#banner .col3{ padding-top:90px!important;}
#banner .col3doble { background-size:100% auto; height:200px;}
#banner .col3doble p { line-height:normal; padding:5px 27px;}
#banner .col3 h4 { font-size:20px;}
.producto tr:first-of-type  { font-size:10px; letter-spacing:-0.3px;}
.forgot input[type="submit"] { width:100%;}
}