@charset "iso-8859-1";
/* CSS Document */
/* azul rgb(43,69,145) verde rgb(49,152,66) */

.loscontenidos {padding:25px 100px;}
section {text-transform:uppercase; background:#ccc; width:100%; padding:0px; margin:20px 0px}
section h1 {color:rgb(43,69,145); display:inline-block; background:white; padding:8px 15px 0px; margin:0px; margin-left:40px; position:relative}

aside a {display:block; color:rgb(43,69,145); font-size:1em; padding:13px 20px 0px; margin:10px 0px 5px; text-align:left; width:300px;}
aside a span {border-bottom:1px solid #ccc; width:100%; display:inline-block}
aside a.activo {color:rgb(49,152,66)}
aside a, aside a:hover { padding-left:35px; color:gray; background-repeat:no-repeat; background-position:0px 10px; text-decoration:none}
aside a:hover, aside a.activo {background-position:0px -52px; color:rgb(49,152,66)}
aside a.seg { background-image:url(/img/dsgn/seg-small.png)}
aside a.med { background-image:url(/img/dsgn/med-small.png)}
aside a.amb { background-image:url(/img/dsgn/amb-small.png)}
aside a.sis { background-image:url(/img/dsgn/sis-small.png)}
aside a.con { background-image:url(/img/dsgn/con-small.png)}
aside a.ing { background-image:url(/img/dsgn/ing-small.png)}
aside a.covid { background-image:url(/img/dsgn/covid-small.png)}
aside.depresu a { width:400px;}
aside div {text-transform:uppercase; background:#ccc; padding:0px; margin:0px 0px 20px; width:380px;}
aside div p {color:rgb(43,69,145); display:inline-block; background:white; padding:8px 15px 0px; margin:0px; margin-left:20px; position:relative; font-size:1.5em}

.servicios {display:block; text-align:left;}
.servicios a {margin:0px; width:230px; height:110px; padding:0px}
.servicios a div {line-height:25px; background-size:auto 50%; background-position:20px center; font-size:1.3em; padding-left:85px}

.elservicio {padding:20px 80px 20px 0px; text-align:justify}
.servicios + p {margin-top:30px;}
.vinetas {-webkit-column-count: 2; -moz-column-count: 2; column-count: 2; text-align:left}
.vinetas ul {margin:0px; padding:0px;}
.vinetas ul li {margin:5px; list-style:none; background:url(/img/dsgn/li.jpg) no-repeat; background-position:0px 5px; padding-left:20px}
.elservicio h3 {font-size:1.2em; text-align:left; color:black; margin-top:20px}

p.solicitar { margin:50px auto 20px; width:220px;}
.solicitar a, .formupresu form .btn, .formpresu .btn {background-color:rgb(240,240,240); border:1px solid rgb(213,213,213); padding:15px 20px 13px; display:inline-block; -webkit-box-shadow: 0px 2px 5px 0px rgba(181,181,181,1); -moz-box-shadow: 0px 2px 5px 0px rgba(181,181,181,1); box-shadow: 0px 2px 5px 0px rgba(181,181,181,1);}
.solicitar a:hover, .formupresu form .btn:hover, .formpresu .btn:hover {text-decoration:none; background-color:gray; border:1px solid gray; color:white}

#peque_slider{margin:40px 0px; width:280px;}
#pslider{height:180px;}
.depresu #peque_slider{margin:40px 0px; width:380px;}
.depresu #peque_slider{height:254px;}
#pslider img{display: none;width:100%;border:5px solid gray;}
#pslider img:nth-child(1){display: block;}

.formupresu {padding:20px 100px 20px 100px; text-align:justify;}
.formupresu p.complete {color:rgb(43,69,145); padding:0px; margin:20px 0px;}
.formupresu form {padding:0px 20px;}
.formupresu form .btn, .formpresu .btn {color:rgb(43,69,145); border-radius:0px; font-size:1.1em; padding:10px 20px 7px;}

/* NOVEDADES */
.margenes a {color:black;}
.margenes {padding:20px 200px;}
.margenes article {padding:20px 0px; text-align:justify}
.margenes article h4, .formupresu h4 {font-size:1.4em; line-height:40px; border-bottom:1px solid #ccc; color:rgb(43,69,145); margin:0px 0px 15px}
.margenes article h4 i, .formupresu h4 i {font-size:0.6em}
.margenes article h4 span, .formupresu h4 span {color:#999}
.margenes article .foto img, .formupresu img {max-width:100%; margin-bottom:20px}
.margenes article .foto {max-height:200px; overflow:hidden}
.margenes article a .link, .formupresu a {color:rgb(49,152,66); text-decoration:none}
.volver { text-align:center; margin:30px 0px 0px}
.otrasnovedades aside { width:380px }
.otrasnovedades aside a { padding:0px; width:100%; max-width:380px; text-align:center; background:#ccc;}
.otrasnovedades aside a p { padding:10px 5px 5px; color:#333}
.otrasnovedades aside a p strong { color:rgb(43,69,145); font-weight:normal}
.otrasnovedades aside a img { max-width:100%}

.chau iframe, .mapa iframe {height:600px}
.contacto { padding:0px 20px;}
.mapa {display:none;}

form select { font-family:Arial, Helvetica, sans-serif}

@media only screen and (max-width:1700px){
}

@media only screen and (max-width:1650px){
.elservicio {padding:20px 60px 20px 20px}
.formupresu {padding:20px 50px 20px 20px}
.margenes {padding:10px 100px;}
aside.depresu a { width:380px;}
.depresu #peque_slider{width:360px; height:220px;}
aside div, .otrasnovedades aside, .otrasnovedades aside a { max-width:360px;}

}


@media only screen and (max-width:1400px){
.loscontenidos {padding:25px 10px; }
.servicios a {padding:10px}
.servicios a div {background-size:auto 60%;}
aside.depresu a { width:360px;}
.depresu #peque_slider{width:340px; height:220px;}
aside div, .otrasnovedades aside, .otrasnovedades aside a {width:340px;}
}

@media only screen and (max-width:1199px){
.loscontenidos {padding:25px 10px;}
aside a {width:250px; font-size:0.8em;}
aside a, aside a:hover { padding-left:35px; background-position:0px 6px;}
aside a:hover, aside a.activo {background-position:0px -56px; color:rgb(49,152,66)}
.elservicio {padding:20px 40px}
.formupresu {padding:0px 40px 20px 20px}
#peque_slider{width:230px;}
aside.depresu a { width:300px;}
.depresu #peque_slider{width:280px; margin-top:20px; height:180px;}
aside div, .otrasnovedades aside, .otrasnovedades aside a {width:280px;}
.margenes {padding:10px 20px;}

}

@media only screen and (max-width:1000px){
}

@media only screen and (max-width:991px){
/* sm */
.aside {display:none;}
.elservicio {padding:10px 40px}
.formupresu {padding:0px 20px 10px 20px;}
.servicios {height:110px!important; padding:5px; margin:0px;}
.servicios a{height:110px!important; width:200px!important}
.servicios a div {background-position:10px center; padding-left:65px}
.elservicio h3 {font-size:1.2em; text-align:left; color:black; margin-top:10px}
.margenes {padding:10px 20px;}
.margenes article {padding:10px 0px;}
.otrasnovedades { display:none}
}

@media only screen and (max-width:851px){
.servicios {height:100px!important}
.servicios a{height:100px!important; width:200px!important}
.servicios a div {background-position:10px center;}

}

@media only screen and (max-width:767px){
/* xs */
.loscontenidos {padding:0px;}
.loscontenidos > div { padding:0px}
section {margin:10px 0px}
section h1 {padding:8px 15px 0px; margin-left:20px; font-size:1.7em}
.servicios {height:95px!important; width:180px; padding:0px 5px 5px; margin:0px auto; font-size:1.2em!important;}
.servicios a {height:90px!important; padding-top:3px}
.servicios a div { line-height:20px}
.servicios + p {margin-top:10px;}
.vinetas {-webkit-column-count: 1; -moz-column-count: 1; column-count: 1;}
.elservicio {padding:10px 20px}
.formupresu {padding:0px 20px 10px}
.contacto .formupresu {padding:0px 50px 10px;}
.chau {display:none;}
.mapa {padding:20px 50px 50px; display:block}
.margenes article .foto {max-height:300px; margin-bottom:5px}
.contacto { padding:0px;}

}

@media only screen and (max-width:450px){
.mapa {padding:20px 20px 50px; display:block}
}
