
html{box-sizing:border-box;}
*,*:after,*:before{box-sizing:inherit;}
div{box-sizing: border-box; }

body{font-family: sans-serif; background-image: linear-gradient(45deg,#CEE007,#339E35);
background: -webkit-linear-gradient(45deg,#CEE007,#339E35);
background: -moz-linear-gradient(45deg,#CEE007,#339E35);
background: -o-linear-gradient(45deg,#CEE007,#339E35);
 padding: 1rem;}


h1{font-size:2rem; text-align: center; color: #279989; font-weight: bolder;}
h2{font-size: 1.2rem; text-align: center;}
h3{text-align: center;clear: both; font-size: 1rem; margin-top:2em;}
h4{font-size:.9rem; text-align: center; }
h5{font-size:1.2rem; text-align: center; color: #279989; padding-top: 20px; clear: both;}
p{font-size: 1rem; margin-left: 1rem; margin-right: 1rem; text-align: center; line-height: 1.5rem;}
a{text-decoration: none; color: gray;}
span{font-weight: bolder; font-size: 1.2rem; color: #2E2E2E;}
.english{width: 40%; margin: 0 auto; padding: .5rem; text-align: center; background-color: lightgray; color: white;}
header a{text-decoration: none;}
#testimonios{font-size: 3rem; color: #209a8d; font-weight: bolder; }
.test{width: 50%;}

/*PANEL DE MENÚ LATERAL*/
aside{width: 20%; background-color: white; float: left; position: relative; box-shadow: 3px 3px 3px black; padding: 1rem; position: fixed;}
aside a {text-decoration: none; color: white;}
aside a:visited{color: white;}
#panel{width:100%; margin: 0 auto; clear: both;}
.boton{color: white; width: 85%; margin: 10px auto; padding: .7rem; background-color: #339E35; border-radius:10px; box-shadow:3px 3px 3px black;}
.boton:hover{background-color:#cee007;}
.redes{width: 40%; margin: 10px auto;}


header{ width: 75%; float: right; padding-top: 1rem; padding-bottom: 1rem; background-color: white;}
header h2{color: gray; padding: 1rem 0;}
section{width: 75%; float: right; background-color: white; overflow: hidden; padding: 1rem;}

/*MENÚ ALTERNO PARA REDIMENCIONAR*/
#menu-pie{width: 95%; overflow: hidden; background-color: white; margin: 0 auto;}
#menu-pie a{text-decoration: none; color: white;}
.menu-alterno{width: 25%; float: left; background-color: #279989; color:white; border-radius: 8px; padding: .4rem 0 .4rem 0; border:2px solid white;}
.menu-alterno p{font-size: .8rem;}
#menu-redes{width: 95%; overflow: hidden; margin: 0 auto;}
#face,#twitter,#link{width: 33%; text-align: center; float: left;}
#face img,#twitter img,#link img{width: 40%;}
#menu-redes,#menu-pie{display: none;}

footer{width: 75%; float: right; background-color: white;}
#animacion{margin:0 auto; width:60%;}


#area-botones{width: 100%;}
.btn{width: 50%; float: left; text-align: center; padding: 1rem; }
.btn p{color: white; border-radius: 8px; background-color: #339e35; padding: .5rem 0; font-weight: bold;}


/*DOCUMENTO INMUEBLES*/
.linea-bloques{width: 100%; overflow: hidden; box-sizing: border-box;}
.bloque{width: 50%; float: left; overflow: hidden; padding:0 2rem 2rem 2rem; box-sizing: border-box;}
.anuncio{border: 4px groove #f0f0f0; }
.foto-portada{width:100%; padding: 1rem;}
.foto-portada h2{padding: .5rem 0; font-weight: bold;}
.alterno{color:#666; font-weight: 700;}

#asesoria{border: 2px solid #ccc; padding: 1rem; width: 90%; margin: 2rem auto;}
#asesoria p{text-align: left; line-height: 2rem;}
#referencia{line-height: 1rem; padding: 1rem 0;}

.descripcion{width: 100%; padding: .2rem .5rem;}
.descripcion ul{width: 100%; border: 2px solid #f0f0f0; padding: .5rem; margin: .5rem auto;}
.descripcion ul li{list-style: square; list-style-position: inside; line-height: 2rem;}
.datos{width: 50%; float: left; padding: 1rem 0;}
#liga{width: 100%; padding: 1rem 0; overflow: hidden;}
#liga p{text-align: center; color: green; font-weight: bolder;}
#liga a{text-decoration: none;}

#testimonio{width: 70%; margin: 1rem auto; padding: 1rem; line-height: 2rem; }
#testimonio h4{text-align: left;}
.imagen-sola{width: 70%; margin: 0 auto;}
.tercio{width: 33%; float: left; padding: 1rem; box-sizing: border-box;}

/*DOCUMENTO WTC*/
.foto-sola{width: 65%; margin: 0 auto;}
.foto-sola p{text-align: left;}
.bloque-texto-central{width: 65%; margin: 0 auto; padding: 1rem;}
.bloque-texto-central ul{padding: .5rem 0; border: 1px solid green;}
.bloque-texto-central ul li p{text-align: left; line-height: 1.5rem;}
.fila-foto{width: 100%; overflow: hidden; border: 2px solid gray;}
.foto{width: 50%; float: left; padding: 1rem; box-sizing: border-box;}
.texto{width: 90%; margin: 0 auto; padding: .5rem 0; }
.texto p{text-align: left;}
.texto h2 span{font-size: 1.5rem;}
.texto a h3{margin-bottom: 1rem;}
hr{border:4px solid gray; border-radius: 300px; height:0px; text-align: center; margin:1rem auto; opacity: .3;}
.video,.video-marco{width: 70%; margin: .5rem auto; }
#tarjeta{width: 100%; margin: 1rem auto; padding: 1rem; line-height: 2rem; font-weight: bolder; color: gray; text-align: center;}
#tarjeta p{font-size: 1.6rem;}

/*DOCUMENTO ALPES*/
.foto-sola-vertical{width: 45%; margin: 0 auto;}
.media-fila{width: 50%; float: left; padding: 1rem;}
.fila-foto .media-fila ul{width:85%; margin: 0 auto;}
.fila-foto .media-fila ul li p{text-align: left; line-height: 2rem;}
#resaltar{font-weight: bolder; text-decoration: underline;}

/*DOCUMENTO SAN LUCAS*/

/*DOCUMENTO PORTALES*/

/*DOCUMENTO LOS TOROS*/
.detalles{border:1px solid green; padding: 1rem; width: 80%; margin: 1rem auto;}
.detalles p{text-align: left;}
.video-marco{border: 10px double green; padding: 1rem;}

/*BALDERAS*/
.foto-chica{width: 16%; float: left; padding: .2rem;}
.letra-chica{font-size: .7rem;}
.tres-fotos{width: 33%; float: left; padding: .5rem;}
.dos-fotos{width: 50%; float: left; padding: 1rem; box-sizing: border-box; }
.dos-fotos p{text-align: left;}
.fotos-juntas{float: left;}

/*LERMA*/
.foto-texto{width: 50%; float: left; padding: 2rem;}
.fila-foto-lerma{width: 100%; overflow: hidden; display: flex; justify-content: center; align-items: center;}

/*DEL VALLE*/

.marco-para-texto{width: 80%; margin: 0 auto; padding: 1rem; border: 2px solid gray; border-radius: 10px; line-height: 2rem;}
.liga-whats{display: flex; align-items: center; justify-content: flex-start; padding: 1rem;}
.liga-whats a{text-decoration: none; color: green; font-weight: bolder;}
.liga-whats h2{display: inline-block; padding: .5rem;}
.liga-whats img{}


/*FORMATO DE CONTACTO*/
#formato-contacto{margin: 3rem auto; clear:both; width:65%; }
fieldset{border:2px solid #279989; border-style: groove; padding:1rem; box-sizing:border-box;}
fieldset p{text-align:left; margin-bottom: 0;}
legend{font-weight:700; color:#279989;}
#selector{margin-top: 1rem; margin-bottom: 1rem;}
#selector p:first-child{display: inline;}
input{width:95%; min-height:30px; padding:.5rem;}
textarea{width:95%; padding:1rem;}
input[type=submit]{width:50%; float: left;}
input[type=reset]{width:50%;}
#btn-form{text-align:center;}

/*******************************************************************************************************************************/


@media screen and (max-width:930px)
{
    body{padding: 0;}
    .bloque{padding: .5rem;}
    .boton{width:100%;}
    .foto-texto{width: 100%; float: none; padding: .5rem;}
    .fila-foto-lerma{display: block;}
    .imagen-sola{width: 100%;}
    .bloque-texto-central{width: 95%}
    section {width: 100%; padding: .5rem;}
    
}


@media screen and (max-width:768px)
{
    aside{display: none;}
    #menu-pie,#menu-redes{display: block;}
    header,section,footer{float: none; width:100%; margin: 0 auto;}
    .bloque{width: 90%; float: none; margin: 0 auto; padding: 1rem;}
    .foto-sola,.video,.video-marco{width: 80%;}
    .bloque-texto-central{width: 80%;}
    .foto-sola-vertical{width: 65%; margin: 0 auto;}
    .media-fila{width: 70%; float: none; padding: .5rem; margin: 0 auto;}
    .foto{float: none; width: 80%; margin: 0 auto;}
    #testimonio{width: 100%;}
    #asesoria{width: 100%;}
    .foto-chica{width: 33%;}
    .letra-chica{font-size: .5rem;}
    .dos-fotos,.tres-fotos{width: 100%; float: none; margin: 0 auto;}

}

@media screen and (max-width:525px)
{
    header,section,footer{width: 100%; margin: 0 auto;}
    .bloque{width: 100%;}
    .menu-alterno{width: 50%;}
    .foto-sola,.video,.video-marco{width: 100%;}
    #tarjeta{width: 80%;}
    .texto{width: 95%;}
    .bloque-texto-central{width: 90%;}
    h4 span{font-size: .8rem;}
    .media-fila{width: 90%;}
    .foto{width: 90%; padding: .5rem;}
    .btn{padding: .5rem 0;}
    .btn p{font-size: .8rem;}
    .tercio{float: none; width: 100%;}
    

}