/* vdl_estl.css Enero 20204 */
/* Centralizar todo el css */

/* Repasar si coincide con los demas hmtls */
body, html {
    height: 100%;
    width: 100%;
    color: #363636;
    line-height: 1.8;
}
html,body,h1,h2,h3,h4,h5,h6 {
  font-family: "Verdana", sans-serif;
}

.vdl-container {padding:0.01em 16px;left:50%;transform:translate(-50%,-25%);-ms-transform:translate(-50%,-25%); margin-top: 1%;}

/* Esto son para el index.hmtl */
.bgimg-1 {
    background-image: url('../images/fondos/fachada.jpg');
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-size: 100%;
    min-height: 40%;
}

.bgimg-2 {
    background-image: url("../images/fondos/puente.jpg");
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-size: 100%;
    min-height: 40%;
}

.bgimg-3 {
    background-image: url("../images/fondos/sotano.jpg");
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-size: 100%;
    min-height: 40%;
}
/* Turn off parallax scrolling for tablets and phones */
@media only screen and (max-device-width: 1024px) {
    .bgimg-1, .bgimg-2, .bgimg-3 {
        background-attachment: scroll;
    }
} /* index.hmtl */

.vdl_fotos {
  width: 100%;
  height: auto;
}
.vdl_letra_grande {
  font-size: 3vw;
  color: black; 
  opacity: 1;
}

/* Esto es sobre todo para reservas.hmtl */
.amarillo{background-color: #E2F05C}
.rojo{background-color: red}
.verde{background-color: #45B584}
.blanco{background-color: white}
.azul{background-color: #53B8B1}
.naranja{background-color: #FF7F37}

.vdl-contiene {max-width:80%;margin:auto}

.vdl-lineas {
  display: flex;
  flex: auto;
  flex-direction: row;
  justify-content: space-between;
  align-items: stretch;
  height: 100%;
  padding-bottom: 10px;
} 
.vdl-lineas-wrap {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
  }
.vdl-lineas-wrap .boton {
  margin-left: 5px;
}

.vdl-lineas-centro {
  display: flex;
  flex: auto;
  flex-direction: row;
  justify-content: center;
  align-items: stretch;
  height: 100%;
  padding-bottom: 10px;
}

.vdl-caja-disponibilidad {font-size: 100%;}
@media screen and (max-width: 1200px) {
  .vdl-caja-disponibilidad {font-size: 95%;}
}
@media screen and (max-width: 1000px) {
  .vdl-caja-disponibilidad {font-size: 90%; }
}
@media screen and (max-width: 800px) {
  .vdl-caja-disponibilidad {font-size: 85%; }
}
@media screen and (max-width: 600px) {
  .vdl-caja-disponibilidad {font-size: 80%; }
}
@media screen and (max-width: 400px) {
  .vdl-caja-disponibilidad {font-size: 75%; }
}

.vdl-caja-foto {
  width: 50%;
  height: 100%;
  font-weight: bold;
  text-align: left;
  color: #363636;
  margin: 4px 0;
  padding: 2px;
}
.vdl-caja-reserva {
  width: 50%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 3px;
}
.vdl-caja-reserva {font-size: 100%;}
@media screen and (max-width: 1200px) {
  .vdl-caja-reserva {font-size: 85%;}
}
@media screen and (max-width: 1000px) {
  .vdl-caja-reserva {font-size: 80%;}
}
@media screen and (max-width: 800px) {
  .vdl-caja-reserva {font-size: 75%; }
}
@media screen and (max-width: 600px) {
  .vdl-caja-reserva {font-size: 70%;}
}
@media screen and (max-width: 400px) {
  .vdl-caja-reserva {font-size: 65%; }
}

.vdl-img-fondo {
  background-attachment: contain;
  background-size: cover;
  background-position: center;
}
.habitacion-doble {
  background-image: url('../images/fondos/habitacion03.jpg');
}

.habitacion01 {
  background-image: url('../images/fondos/habitacion01.jpg');
}
.boton,.boton-peque,.desplegable {
  display:inline-block;
  line-height:1.238em;
  letter-spacing:-1px;
  text-decoration:none;
  color: #2B2B2B;
  
  border:2px solid #000000;
  
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;   
  border-radius: 8px;
  
  background: #0A99A1; 
  background: -webkit-gradient(linear, 0 0, 0 bottom, from(#FFFFFF), to(#0A99A1));
  background: -webkit-linear-gradient(#FFFFFF, #0A99A1);
  background: -moz-linear-gradient(#FFFFFF, #0A99A1);
  background: -ms-linear-gradient(#FFFFFF, #0A99A1);
  background: -o-linear-gradient(#FFFFFF, #0A99A1);
  background: linear-gradient(#FFFFFF, #0A99A1);
  -pie-background: linear-gradient(#FFFFFF, #0A99A1);   

  cursor:pointer;
}
.boton:hover,.boton-peque:hover {background: #0A99A1;}
.boton{
  padding:6px 30px;
  font-size:75%;
}
.boton-peque{
  padding-left: 6px;
  padding-right: 6px;
  font-size:85%;
}

/*reserva_nueva */
.vdl-marco_con_sombras {
  position: absolute;
  width:90%;
  margin-left: 5%;
  margin-top: 1%;
}
.vdl-cuadro {
  width: 98%;
  height: 96%;
  margin: 1%;
}

.vdl-gris-texto-grande {
  font-size: 2.5em;
  color:#2E2E2E; /*oscuro sin llegar a negro */
  background-color:#f1f1f1;
}
.vdl-fondo-blanco { /* Para resaltar sobre los fondos grises los cuadros con sombra*/
  background-color:#fff;
}
@media screen and (max-width: 1200px) {
  .vdl-gris-texto-grande {font-size: 2.5em;}
}
@media screen and (max-width: 1000px) {
  .vdl-gris-texto-grande {font-size: 2.8em; }
}
@media screen and (max-width: 800px) {
  .vdl-gris-texto-grande {font-size: 3em; }
}
@media screen and (max-width: 600px) {
  .vdl-gris-texto-grande {font-size: 3.2em; }
}
@media screen and (max-width: 400px) {
  .vdl-gris-texto-grande {font-size: 3.5em; }
}


input[type=text],input[type=date],input[type=email],input[type=number] {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;

  font-size:80%;
  padding-left: 10px;

  border:1px solid #BBBBBB;
  -webkit-border-radius: 8px;-moz-border-radius: 8px;border-radius: 8px;
    
  background: #FFFFFF; 
  background: -webkit-gradient(linear, 0 0, 0 bottom, from(#FFFFFF), to(#E5E5E5));
  background: -webkit-linear-gradient(#FFFFFF, #E5E5E5);
  background: -moz-linear-gradient(#FFFFFF, #E5E5E5);
  background: -ms-linear-gradient(#FFFFFF, #E5E5E5);
  background: -o-linear-gradient(#FFFFFF, #E5E5E5);
  background: linear-gradient(#FFFFFF, #E5E5E5);
  -pie-background: linear-gradient(#FFFFFF, #E5E5E5);

  outline:none;
}
.vdl-radio{width:32px;height:32px;position:relative;top:2px}

.vdl-lineas-pie {
  display: flex;
  font-size: 85%;
}
@media screen and (max-width: 1200px) {
  .vdl-lineas-pie {font-size: 80%;}
}
@media screen and (max-width: 1000px) {
  .vdl-lineas-pie {font-size: 70%;}
}
@media screen and (max-width: 800px) {
  .vdl-lineas-pie {font-size: 65%; }
}
@media screen and (max-width: 600px) {
  .vdl-lineas-pie {font-size: 55%;}
}
@media screen and (max-width: 400px) {
  .vdl-lineas-pie {font-size: 50%; }
}
.vdl-pie {
  display: flex;
  flex: auto;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  font-size: 75%;
  /*color: black;*/
}
.vdl-pie img {
  height: 1em;
  margin-left: 5px;
  margin-right: 5px;
}
.vdl-pie-izda {
  width: 50%;
  height: 100%;
  display: flex;
  justify-content: flex-end;
  align-self: center;
}

@media screen and (max-width: 1000px) {
  .vdl-pie-izda {width: 25%; }
}
@media screen and (max-width: 800px) {
  .vdl-pie-izda {width: 25%; }
}
@media screen and (max-width: 600px) {
  .vdl-pie-izda {width: 25%;}
}
@media screen and (max-width: 400px) {
  .vdl-pie-izda {width: 25%; }
}

.vdl-pie-izda img {
  width: 25%;
  height: 100%;
}
@media screen and (max-width: 1500px) {
  .vdl-pie-izda img {width: 30%;}
}
@media screen and (max-width: 1200px) {
  .vdl-pie-izda img {width: 35%;}
}
@media screen and (max-width: 1000px) {
  .vdl-pie-izda img {width: 90%;}
}
@media screen and (max-width: 800px) {
  .vdl-pie-izda img {width: 90%; }
}
@media screen and (max-width: 600px) {
  .vdl-pie-izda img {width: 90%;}
}
@media screen and (max-width: 400px) {
  .vdl-pie-izda img {width: 90%; }
}
.vdl-pie-dha {
  width: 50%;
  height: 100%;
  display: flex;
  flex-direction: column;
  font-size: 70%!important;
}
@media screen and (max-width: 1000px) {
  .vdl-pie-dha {width: 75%; }
}
@media screen and (max-width: 800px) {
  .vdl-pie-dha {width: 75%; }
}
@media screen and (max-width: 600px) {
  .vdl-pie-dha {width: 75%;}
}
@media screen and (max-width: 400px) {
  .vdl-pie-dha {width: 75%; }
}

.vdl-pie-dha-item {
  display: flex;
  align-items: center; /*vertical*/
}
.vdl-pie-dha-item img {
  height: 1em;
  margin-left: 5px;
  margin-right: 5px;
}

#logogdn,#nombrefondo {width: 20%;}
@media screen and (max-width: 1500px) {
 #logogdn,#nombrefondo {width: 30%;}
}
@media screen and (max-width: 1200px) {
  #logogdn,#nombrefondo {width: 35%;}
}
@media screen and (max-width: 1000px) {
  #logogdn,#nombrefondo {width: 40%;}
}
@media screen and (max-width: 800px) {
  #logogdn,#nombrefondo {width: 50%; }
}
@media screen and (max-width: 600px) {
  #logogdn,#nombrefondo {width: 55%;}
}
@media screen and (max-width: 500px) {
  #logogdn,#nombrefondo {width: 50%;}
}
@media screen and (max-width: 400px) {
  #logogdn,#nombrefondo {width: 50%; }
}