@import url('https://fonts.googleapis.com/css2?family=Akshar:wght@300..700&family=Vollkorn:ital,wght@0,400..900;1,400..900&family=Yellowtail&display=swap');


html,body{
  height:100%;
}
body{
  margin:0px;
  font:400 16px/22px "Akshar","Arial";
  background:#edebea;
}

:root{
  --rosafuerte:rgba(227,99,122,1);
  --salmon:rgba(233,217,209,1);
  --cafe:rgba(89,79,74,1);
  --verde:rgba(193,209,157,1);
}

a{text-decoration:none;color:inherit;
-webkit-transition: all .3s;    -moz-transition: all .3s;    -o-transition: all .3s;    transition: all .3s;
}
.underline{text-decoration:underline;}

.Yellowtail{font-family: "Yellowtail" !important;}
.Vollkorn{font-family: "Vollkorn" !important;}
.Akshar{font-family: "Akshar" !important;}


.borde{border:1px #df0000 solid !important;box-sizing:border-box;}
.bco{color:#ffffff;}
.ngo{color:#000000;}
.rojo{color:var(--rojo);}
.cafe{color:var(--cafe);}
.salmon{color:var(--salmon);}

.fondobco{background:#ffffff !important;}
.fondongo{background:#000000;}
.fondoSalmon{background:var(--salmon);}
.fondoCafe{background:var(--cafe);}
.fondoVerde{background:var(--verde);}

.bold{font-weight:700 !important;}
.extrabold{font-weight:900 !important;}


.tabla_principal{width:100%;display:inline-block;text-align:center;margin:0px;}
.contenidos{width:100%;text-align:center;display:inline-block;float:none;box-sizing:border-box; overflow:hidden;}

.lienzo{width:90%;max-width: 500px;display: inline-block; float: none;}

.renglon{width:100%;display:inline-block;box-sizing:border-box; }
  .renglonOdd:nth-child(odd){background-color:#ffffff;}/* alternacolores entre filas*/
  .renglonOdd:nth-child(even){background-color:#f2f2f2;}
.btn{display: inline-block;
  -webkit-transition: all .3s;    -moz-transition: all .3s;    -o-transition: all .3s;    transition: all .3s;
}
.btn_enviar{background:#ffffff;color:blue; padding:5px 25px; display:inline-block; 
  border:1px var(--main) solid;
  -webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;}


.menuTop{display: inline-block; margin-top:40px;float:none;position:relative; z-index: 99999;}
.btnMenu{text-decoration:none;color:inherit; cursor: pointer;
  display: inline-block; color:#ffffff; margin:0px 10px;
  font:400 18px/20px "Akshar","Arial";
-webkit-transition: all .3s;    -moz-transition: all .3s;    -o-transition: all .3s;    transition: all .3s;
}

.btnReservar{display:inline-block;width:160px; float:none;position: relative;}
.btnReservar img{display:inline-block; width:100%; top:-20px;left:0 ; position: absolute;}


#primeraseccion{display:inline-block;width:100%;height:80px;}
#encabezado{width:100%; height:100px; display:inline-block;text-align:center;margin:0px;background: var(--rosafuerte);
 position:fixed;top::0px;left:0px; 
z-index: 9000 !important;
}

#redesTop{width:200px;display:inline-block;position: absolute; top:30px ; right: 10px;}
  #redesTop img{width:30px;display:inline-block;}
#logotipoTop{width:200px;display:inline-block;position: absolute; top:0px; left:10px;}
  #logotipoTop img{width:100px;display:inline-block;}

.btnImagen{width:240px !important;}

.titulo{text-align:center !important;font:700 40px/50px "Vollkorn","Arial";}
.titulo2{text-align:center !important;font:500 40px/50px "Akshar","Arial";}

.subtitulo{text-align:center !important;font:300 40px/50px "Akshar","Arial";}
.subtitulo2{text-align:center !important;font:300 34px/40px "Akshar","Arial";}

.feteTitulo{width:100%;display:inline-block; text-align:center !important;
  font:500 40px/50px "Yellowtail","Arial";color:#594f4a;margin:30px 0px;}

#portada001{width:100%;height:80vh;}
#portada00_1 img{object-fit: cover;width:100%;height:100%;vertical-align:middle;}

#portadaHorarios{width:100%;max-width:600px; text-align: left;margin:50px 0px;}
#portadaHorarios .renglon{margin:5px 0px;}


.cajaRosaContent{width:100%;display:inline-block;float:none;margin-top:60px;}
.titRosaTop{width:80%;display:inline-block;float:none;text-align:center;padding:10px 0px;
  font:300 50px/50px "Yellowtail","Arial" !important;
  background:var(--rosafuerte);color:#ffffff; }

.imagenRosaContent{width:80%;display:inline-block; height:100vh;overflow: hidden;}
.imagenRosaContent img{object-fit:cover;  object-position: top;width:100%;height:100%;vertical-align:middle;}

.JourneeBox{width:45%;height:530px; display:inline-block;margin:5% 2%; float: left;}
#imagenJournee01{width:100%;height:100%;display: inline-block;}
#imagenJournee02{width:100%;height:100%;display: inline-block;}
#imagenSouvenirs{width:100%;height:100%;display: inline-block;}

.cajaCafeContent{width:100%;display:inline-block;float:none;margin-top:60px;}

.reservacionesBox{margin:50px 0px;}
.reservacionesBox .titulo2{margin:20px 0px; color: var(--cafe);}
.reservacionesBox .btnImagen{margin:10px 0px;}




.video-responsive {
  position: relative;
  padding-bottom: 177.78%; /* Relación 9:16 → 16/9 = 1.7778 → 177.78% */
  height: 0;
  overflow: hidden;
  max-width: 100%;
  background: #000;
}

.video-responsive iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}


.textoReserva{width:90%;display:inline-block; margin:50px 1%;background:var(--cafe);box-sizing:border-box;
  font:300 30px/40px "Akshar","Arial" !important; color:#ffffff;
  padding:60px 1%; }
.textoReservaBox{width:600px;display:inline-block;}


.cajaGalleria{width:100%;max-width:800px;display: inline-block; overflow:hidden;}
  .img1{width:calc(60% - 20px);float: left; margin:6px; overflow: hidden;}
  .img2{width:calc(40% - 20px);float: left; margin:6px; overflow: hidden;}



#souvenirs{padding:50px 0px;}


.seccionVerde{padding:50px 0px;}
.horariosVerde{width:100%;max-width:580px;text-align: left;
  font:500 24px/36px "Akshar","Arial";
}
.horariosVerde .renglon{margin-bottom:10px;}
.horariosVerde .titulo{margin:40px 0px;
  font:600 40px/40px "Akshar","Arial";
}

.seccVerdeDatos .renglon{margin:15px 0px; color: var(--cafe);
  font:600 24px/20px "Akshar","Arial";
}
.seccVerdeDatos .subtitulo{margin:40px 0px 15px 0px;
  font:600 30px/20px "Akshar","Arial";
}

.redesMed{width: 100%;display: inline-block; margin: 30px 0px;}
.redesMed
img { margin: 0px 10px;
  filter: brightness(0) saturate(50%) invert(19%) sepia(45%) saturate(234%) hue-rotate(352deg) brightness(155%) contrast(91%);
}



.logotipoCafe{width:250px;margin:20px 0px 40px 0px;}
.redesBot{width: 100%;display: inline-block; margin: 30px 0px;}
.redesBot
img { margin: 0px 30px;
  filter: brightness(0) saturate(50%) invert(19%) sepia(45%) saturate(234%) hue-rotate(352deg) brightness(155%) contrast(91%);
}




.menuPie{width:90%;display: inline-block; max-width: 600px; margin:40px 0px;margin-left:10%;}
.menuPie .btnMenu{width:46%; display:inline-block; float:left; text-align: left;
  color:#ffffff;margin:20px 0px;
  font:400 26px/26px "Akshar","Arial";
}
.menuPie .btnMenu:hover{color: var(--rosafuerte);}







/* formulario */
.formulario{width:100%;display: inline-block;max-width:580px; float: none;margin:50px 0px;}
.form_label{width:100%;display:inline-block;float:left;padding:10px 8px 4px 0px ;
  box-sizing:border-box;
}
.form_input{width:100%;display:inline-block;float:left;box-sizing:border-box;
  background: #dbd0ca;
  margin-bottom: 20px;padding:0px 8px;
  -webkit-border-radius:10px !important;-moz-border-radius:10px !important;border-radius:10px !important;
  }
.redondo{
  -webkit-border-radius:10px !important;-moz-border-radius:10px !important;border-radius:10px !important;
}
.g-recaptcha{background:#dbd0ca;border:1px #acacac solid; height:80px; margin-bottom: 20px;
  -webkit-border-radius:10px !important;-moz-border-radius:10px !important;border-radius:10px !important;
}


.form_input input,
.form_input textarea{display:inline-block;font:600 22px/20px "Akshar","Arial","Sans";border:none;box-sizing:border-box;
  color:#594f4a;outline: none;background:transparent;padding:15px 10px;}
.form_area{width:100%;box-sizing:border-box;height:90px;resize: none;}
.input_100{width:100%;}
.input_area{width:100%;height:150px;}

.select-style{width:100%;display:inline-block;float:left;overflow: hidden;box-sizing:border-box;
    background: transparent url("images/arrowdown.png") no-repeat right center;}
  .select-style select{width:100%;padding:5px;border:none;box-shadow:none;background-color:transparent;box-sizing:border-box;
      -webkit-appearance: none;-moz-appearance: none;appearance: none;
      font:400 20px/20px "Akshar","Arial","Sans";color:#594f4a;}
  .select-style select:focus{outline: none;}
.select-style-bco{background: #ffffff url("images/arrowdown.png") no-repeat right center;}

#unmomento{width:100%;float:left;font:500 16px/22px "Akshar";}
.marcorojo{background:#ffd0d0 !important;}
.enviandomensaje{display:none;font:500 26px/30px "Akshar";margin-top:20px;color:#000000;}

.formulario
::-webkit-input-placeholder {color:#594f4a;}
.formulario
::-moz-placeholder {color:#594f4a;}
.formulario
:-ms-input-placeholder {color:#594f4a;}
.formulario
:-moz-placeholder {color:#594f4a;}




/* celdas responsivas */
[class*="celda-"]{display:inline-block;float:left;box-sizing:border-box;}
  .celda-0{width:4.111111%;}
  .celda-1{width:8.333333%;}    .celda-1x{width:12.50000%;}   
  .celda-2{width:16.666666%;}   .celda-2x{width:20.83333%;}   
  .celda-3{width:25%;}      .celda-3x{width:29.16666%;}   
  .celda-4{width:33.333333%;}   .celda-4x{width:37.50000%;}
  .celda-5{width:41.666666%;}   .celda-5x{width:45.83333%;}   
  .celda-6{width:50%;}      .celda-6x{width:54.16666%;}     
  .celda-7{width:58.333333%;}   .celda-7x{width:62.50000%;} 
  .celda-8{width:66.666666%;}   .celda-8x{width:70.83333%;}
  .celda-9{width:75%;}      .celda-9x{width:79.16666%;}
  .celda-10{width:83.333333%;}  .celda-10x{width:87.50000%;}  
  .celda-11{width:91.666666%;}  .celda-11x{width:95.833333%;}
  .celda-12{width:100%;}
[class*="colum-"]{box-sizing:border-box;float:left;}
  .colum-0{width:4.111111%;}
  .colum-1{width:8.333333%;}    .colum-1x{width:12.50000%;}   
  .colum-2{width:16.666666%;}   .colum-2x{width:20.83333%;}   
  .colum-3{width:25%;}      .colum-3x{width:29.16666%;}   
  .colum-4{width:33.333333%;}   .colum-4x{width:37.50000%;}
  .colum-5{width:41.666666%;}   .colum-5x{width:45.83333%;}   
  .colum-6{width:50%;}      .colum-6x{width:54.16666%;}     
  .colum-7{width:58.333333%;}   .colum-7x{width:62.50000%;} 
  .colum-8{width:66.666666%;}   .colum-8x{width:70.83333%;}
  .colum-9{width:75%;}      .colum-9x{width:79.16666%;}
  .colum-10{width:83.333333%;}  .colum-10x{width:87.50000%;}  
  .colum-11{width:91.666666%;}  .colum-11x{width:95.833333%;}
  .colum-12{width:100%;}
  



#menuresponsive{width:auto;display:inline-block;}
#btnMenuresponsive{display:none;position:fixed;top:25px;right:15px;width:25px;}











.gallery{max-width:900px;margin:0 auto;position:relative;overflow:hidden;border-radius:12px;box-shadow:0 6px 24px rgba(0,0,0,.08);
}


/* contenedor de las diapositivas */
.slides{display:flex;
  width:350px;height:350px; aspect-ratio: 1/1; transition:transform .45s cubic-bezier(.2,.9,.2,1);will-change:transform;
}
.slide{min-width:100%;box-sizing:border-box;display:flex;align-items:center;justify-content:center;position:relative;
}
.slide img{width:100%;o_bject-fit:cover;display:block;}


/* flechas */
.nav-btn{position:absolute;top:50%;transform:translateY(-50%);z-index:20;background:rgba(255,255,255,.85);border:none;padding:10px 12px;border-radius:8px;cursor:pointer;backdrop-filter:blur(4px)}
.nav-btn:active{transform:translateY(-50%) scale(.98)}
.nav-btn.left{left:12px}
.nav-btn.right{right:12px}
.nav-btn svg{width:20px;height:20px}


/* indicadores */
.dots{position:absolute;left:50%;transform:translateX(-50%);bottom:12px;display:flex;gap:8px;z-index:20}
.dot{width:10px;height:10px;border-radius:50%;background:rgba(255,255,255,.6);cursor:pointer}
.dot.active{background:rgba(255,255,255,1);box-shadow:0 2px 6px rgba(0,0,0,.25)}


/* caption simple */
.caption{position:absolute;left:0;right:0;bottom:60px;padding:12px 18px;color:#fff;background:linear-gradient(180deg,rgba(0,0,0,0) 0%, rgba(0,0,0,.45) 100%);font-size:16px}


/* responsive */
@media (max-width:700px){
.slide img{height:300px}
.nav-btn{padding:8px}
}




.grecaptcha-badge{display: none !important;}



.mostrar{display:none;}
.ocultar{}



@media screen and (max-width:770px){/* cell potrait */

body{
  font:400 14px/18px "Akshar","Arial";
}


#encabezado{height:100px;}


#btnMenuresponsive{display:inline-block;z-index:9990;background:var(--main);}
  #menuresponsive{width:80%;height:80%;display:none;
    background:rgba(147,184,83,1);position:fixed;top:50px;left:10%;z-index:9900;
    border: none;}
  #menuresponsive .btnMenu{width:100%;padding:10px 0px;margin:5px 0px;}
  #menuresponsive .btnMenu2{width:100%;padding:10px 0px;margin:0px 0px; 
    font:300 16px/16px "Akshar","Arial";
    background: #789a44;}

#logotipoTop{width:100px;left:-15px;top:10px;}
#logotipoTop img{width:60px;}
  #redesTop img{width:30px;}
#redesTop{position: absolute; top:10px; right:calc(50% - 100px);}
.btnReservar{display:inline-block;width:160px; float:none;position: relative;}
.btnReservar img{display:inline-block; width:100%; top:50px;left:0 ; position: absolute;}

.titulo{text-align:center !important;font:700 26px/50px "Vollkorn","Arial";}
.titulo2{text-align:center !important;font:500 26px/50px "Akshar","Arial";}

.imagen100{width:100%;}


#portada001{width:100%;height:40vh;}
#portadaHorarios{margin:20px 0px;}
#portadaHorarios2 {margin:0;}
#portadaHorarios2 .subtitulo{font:400 22px/50px "Akshar";}

.btnImagen{width:160px !important;}


.titRosaTop{width:90%;
  font:300 26px/26px "Yellowtail","Arial" !important;
  background:var(--rosafuerte);}
.cajaRosaContent .subtitulo2{font:400 24px/26px "Akshar";}

.JourneeBox{width:90%;height:250px; display:inline-block;margin:5% 5%; float: left;overflow: hidden;}
#imagenJournee01,
#imagenJournee02
{width:100%;height:200px;}

#imagenSouvenirsBox,
#imagenSouvenirs
{width:100%;aspect-ratio:1/1; }

.imagenRosaContent{width:90%;height:80vh;margin:0px 5%;}

.feteTitulo{ font:400 30px/30px "Yellowtail","Arial";margin:15px 0px;}

.reservacionesBox .titulo,
.reservacionesBox .titulo2{font:400 24px/36px "Akshar";}

.MusiqueLive br{display:none;}


  .img1,
  .img2{width:46%;margin:5px 2%; overflow: hidden;height:20vh;}
  .img1 img{object-fit: cover;width:100%;height:100%;vertical-align:middle;}
  .img2 img{object-fit: cover;width:100%;height:100%;vertical-align:middle;}



.horariosVerde{width:100%;max-width:initial;text-align: left;
  font:600 14px/20px "Akshar","Arial";
}
.horariosVerde .colum-2{width:15%;}
.horariosVerde .colum-3{width:35%;}
.horariosVerde .colum-5{width:45%;}
.horariosVerde .titulo{margin:40px 0px;
  font:600 40px/40px "Akshar","Arial";
}


.textoReserva{margin:20px 1%;
  font:300 26px/30px "Akshar","Arial" !important;
  padding:30px 1%; }
.textoReservaBox{width:100%;display:inline-block;}

.redesMed,
.redesBot
{width: 100%;display: inline-block; margin:20px 0px;}
.redesMed img,
.redesBot img {width:30px;margin: 0px 5px;}


.formulario{width:90%;max-width:initial;margin:20px 0px;}
.form_input{width:100%;display:inline-block;float:left;box-sizing:border-box;
  background: #dbd0ca;
  margin-bottom:10px;padding:0px 8px;
  }
.form_input input,
.form_input textarea{font:500 14px/14px "Akshar","Arial","Sans";padding:6px 4px;}
.input_area{width:100%;height:80px;}


.logotipoCafe{width:160px;margin:20px 0px 40px 0px;}

.seccionUltima .titulo2{font:500 24px/28px "Akshar","Arial","Sans";}


.menuPie .btnMenu{
  color:#ffffff;margin:16px 0px;
  font:400 16px/16px "Akshar","Arial";
  margin:8px 0px;
}

.mostrar{display:inline-block;}


}/* media screen */