@font-face {
    font-family: "monserrat-b";
    src: url(fonts/Montserrat-Bold.otf) format("truetype");
}

@font-face {
    font-family: "monserrat-l";
    src: url(fonts/Montserrat-Light.otf) format("truetype");
}
@font-face {
    font-family: "monserrat-r";
    src: url(fonts/Montserrat-Regular.otf) format("truetype");
}
@font-face {
    font-family: "monserrat-m";
    src: url(fonts/Montserrat-Medium.otf) format("truetype");
}

@font-face {
    font-family: "Eudora";
    src: url(fonts/Eudora.ttf) format("truetype");
}

@font-face {
    font-family: "Grandstander";
    src: url(fonts/Grandstander-clean.ttf) format("truetype");
}

@font-face {
    font-family: "Midnight";
    src: url(fonts/Midnight.ttf) format("truetype");
}

*{box-sizing: border-box!important;}

.whatssap{position: fixed;right: 10px;bottom: 10px;z-index: 100;display: flex;flex-direction: row;justify-content: center;align-items: center;}
.whatssap .send{background: white;border-radius: 10px 0 10px 0;padding: 10px;text-align: center;}
.whatssap .send p{font-size: 12px;text-align: center;}
.whatssap img{width: 40px;margin-left: 5px}
.motor{padding: 20px;border-radius: 20px;background: rgba(0,0,0,0.5);width: inherit;margin-top: 30px;box-sizing: border-box;display: none;flex-direction: column;justify-content: center;align-items: center;max-width: 1000px;}
.motor i{color: #BDDB9C;font-size: 35px;margin-bottom: 20px}


[ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak {
  display: none !important;
}
iframe{width: 100%;}
html{margin-top: 0 !important;}
body{font-size: 12px;font-family: monserrat-r;-webkit-font-smoothing: antialiased;position: relative;overflow-x: hidden;height: auto;margin: 0px;}
strong{font-family: monserrat-b}
body *{outline: none}
input{outline: none;}
input:focus::-webkit-input-placeholder{color: transparent;}
input:focus:-moz-placeholder{color: transparent;}
input:focus::-moz-placeholder{color: transparent;}
input:focus:-ms-input-placeholder {color: transparent;}
input:focus{outline: none}
textarea:focus::-webkit-input-placeholder{color: transparent;}
textarea:focus:-moz-placeholder{color: transparent;}
textarea:focus::-moz-placeholder{color: transparent;}
textarea:focus:-ms-input-placeholder {color: transparent;}
textarea:focus{outline: none}
a,button{color: initial;text-decoration: none;cursor: pointer;}
a:focus{outline: none;color: none;}
a{text-decoration: none!important;outline: none;}
a:hover{text-decoration: none;outline: none;color: inherit;}
h1,h2,h3,h4,h5,h6,p{margin:0px;line-height:normal;}
h1,h2,h3,h4,h5,h6{text-align: center;font-weight: normal;}
button{border: none;outline: none}

button[disabled], html input[type=button][disabled], input[type=reset][disabled], input[type=submit][disabled]{opacity: .5}
.input.ng-invalid.ng-dirty{border: 1px solid #E62117!important}
.input.ng-valid{background: white}

/*Globales*/

.max-widht,
.max-widht1,
.max-widht2,
.max-widht3,
.max-widht4,
.max-widht5,
.max-widht6{padding: 0;margin: 0 auto}

.max-widht{max-width: 1200px!important;width: 90%}
.max-widht1{max-width: 1100px!important;width: 90%}
.max-widht2{max-width: 900px!important;width: 90%}
.max-widht3{max-width: 700px!important;width: 90%}
.max-widht4{max-width: 600px!important;width: 90%}
.max-widht5{max-width: 500px!important;width: 90%}
.max-widht6{max-width: 400px!important;width: 90%}

.cerrar-menu{position: fixed;width: 100%;height: 100%;left: 100%;top: 0;z-index: 50;background: rgba(0,0,0,0.5);}
.open-menu{display: none;}
.open-menu i{color: #F5EFD7;font-size: 70px}

.global{}

.header{width: 100%;position: fixed;left: 0;top: 0;z-index: 1000;display: flex;flex-direction: row;justify-content: center;align-items: center;;padding: 15px 0;transition: all ease-in-out .5s}
.header.active{background: rgba(245,239,215, .9)}
.header .cont{width: 90%;max-width: 1300px;display: flex;flex-direction: row;justify-content: space-between;align-items: center;}
.header .logo{display: flex;flex-direction: row;justify-content: center;cursor: pointer;}
.header .logo img{width: 100px;}
.header .links, .header .links .box, .header .links .idioma{display: flex;flex-direction: row;justify-content: space-between;align-items: center;}
.header .links{flex: auto;#F5EFD7: 905px;left: 0;opacity: 1}
.header .links .link{color: #F5EFD7;font-size: 16px;text-align: center;margin-top: 6px}
.links-hover{padding: 5px;border-bottom: 2px solid transparent;transition: all ease-in-out .5s}
.links-hover:hover{border-bottom: 2px solid #F5EFD7}
.header .links .link img{width: 150px}

.header .links .box a{color: #F5EFD7;text-align: center;padding: 5px 10px;border-radius: 10px;box-sizing: border-box;padding-top: 8px;border: 1px solid white;transition: all ease-in-out .5s}
.header .links .box a:hover{background: rgba(183,172,149)}
.header .links .box a:first-child, .header .links .idioma a:first-child{margin-right: 10px}
.header .links .idioma a:first-child{padding-right: 10px;border-right: 3px solid #AB8041;}
.header .links .idioma a{color: #F5EFD7;font-size: ;text-align: center;padding-top: 5px}
.header a{font-family: Grandstander;text-transform: uppercase;font-size: 18px;text-align: center;}

.header .redes{display: flex;flex: row;justify-content: center;align-items: center;}
.header .redes a{color: white;padding: 5px;box-sizing: border-box;margin: 0 5px;font-size: 16px;border: 1px solid white;border-radius: 50%;width: 30px;height: 30px;display: flex;flex-direction: row;justify-content: center;align-items: center;}
.header .redes a:hover{background: rgba(183,172,149, .9)}

.header .white{display: flex;}
.header .grow{display: none;}

.header.active{}
.header.active .links .box a{color: #C7B8A2; background: #AB8041;border: 1px solid #AB8041}
.header.active .links .idioma a{color: #AB8041}
.header.active .links .link{color: #AB8041}
.header.active .white{display: none;}
.header.active .grow{display: flex;}
.header.active .open-menu i{color: #AB8041}
.header.active .links-hover:hover{border-bottom: 2px solid #AB8041}
.header.active .links .box a:hover{color: rgba(183,172,149);}
.header.active .redes a{color:  #AB8041;border: 1px solid  #AB8041;}
.header.active .redes a:hover{color: white;background:  #AB8041}

.home{min-height: 120vh;background: url('../img/foto-home-lido.jpg');background-position: center;background-size: cover;display: flex;flex-direction: row;justify-content: center;align-items: center;position: relative;padding-top: 80px}
.home:after{position: absolute;left: 0;top: 0;width: 100%;height: 100%;background: rgba(0,0,0,0.4);content: ''}
.home .cont{display: flex;flex-direction: column;justify-content: center;align-items: center;position: relative;z-index: 10;width: 90%}
.home .cont p{color: #F5EFD7;font-family: Eudora;font-size: 30px;;text-align: center;}
.home .cont h1{color: #F5EFD7;font-family: Grandstander;font-size: 60px;margin:30px 0;margin-bottom: 10px;text-align: center;}
.home .cont .cocina{color: #F5EFD7;font-family: Midnight;font-size: 60px;;text-align: center;}
.reservar{color: #F5EFD7;font-family: Grandstander;font-size: 30px;text-align: center;padding: 10px 30px;background: #629B66;border-radius: 20px;text-transform: uppercase;padding-top: 16px;margin-top: 20px;}
.reservar:hover{color: #F5EFD7;background: rgba(183,172,149, .9);}

.bienvenidos{background: white;padding-top: 40px;display: flex;flex-direction: column;}
.bienvenidos .titles{margin-bottom: 40px;text-align: center;color: #609A65;font-family: Grandstander;font-size: 40px;text-transform: uppercase;}
.bienvenidos .cont{width: 100%;background: url('../img/NUEVA-Hotel-Colibrí-3.2-Dogs-2709-2.jpg');background-position: center;background-size: cover;min-height: 350px;position: relative;display: flex;flex-direction: row;justify-content: center;align-items: center;padding: 50px 0;position: relative;}
.bienvenidos .cont:after{position: absolute;left: 0;top: 0;width: 100%;height: 100%;background: rgba(0,0,0,0.4);content: ''}
.bienvenidos .cont .box{display: flex;flex-direction: column;padding: 50px;box-sizing: border-box;width: 90%;max-width: 800px;position: relative;z-index: 1}
.bienvenidos .cont p{color: #F5EFD7;font-size: 20px;font-family: monserrat-l;text-align: justify;line-height: 25px}
.bienvenidos .cont a{color: #F5EFD7;font-size: 22px;text-align: center;font-family: Grandstander;margin-top: 15px;text-transform: uppercase;}
.bienvenidos .cont p strong{color: #F5EFD7; font-family: monserrat-b}
.masTexto{display: none}

.menus{background: white;padding-top: 40px;display: flex;flex-direction: column;}
.menus .titles{margin-bottom: 40px;text-align: center;color: #609A65;font-family: Grandstander;font-size: 40px;text-transform: uppercase;}
.menus .cont{width: 100%;background: url('../img/NUEVA-2022-Hotel-Lido-0405.jpg');background-position: center;background-size: cover;position: relative;display: flex;flex-direction: row;justify-content: center;align-items: center;padding: 80px 0}
.menus .cont .box{display: flex;flex-direction: row;width: 90%;max-width: 1200px;justify-content: space-between;align-items: stretch;}
.menus .cont .box .menu{width: 23%;display: flex;flex-direction: column;justify-content: flex-start;align-items: center;background: #E2D3B4;padding: 50px 20px;box-sizing: border-box;position: relative;position: relative;}
.menus .cont .box .menu a{position: absolute;left: 0;top: 0;width: 100%;height: 100%;z-index: 100}

.menus .cont .box .menu h2{color: #AB8041;font-size: 30px;text-align: center;text-transform: uppercase;font-family: Grandstander;position: relative;z-index: 10;transition: all ease-in-out .5s}
.menus .cont .box .menu strong{color: #AB8041;font-size: 14px;text-align: center;margin: 15px 0;position: relative;z-index: 10;transition: all ease-in-out .5s}
.menus .cont .box .menu p{color: #AB8041;font-size: 16px;text-align: center;font-family: monserrat-l;position: relative;z-index: 10;transition: all ease-in-out .5s}

.menus .cont .box .menu:hover:after{height: 100%}
.menus .cont .box .menu:hover h2{color: #F5EFD7}
.menus .cont .box .menu:hover strong{color: #F5EFD7}
.menus .cont .box .menu:hover p{color: #F5EFD7}

.galeria{background: white;padding-top: 40px;display: flex;flex-direction: column;justify-content: center;align-items: center;padding-bottom: 20px}
.galeria .titles{margin-bottom: 40px;text-align: center;color: #609A65;font-family: Grandstander;font-size: 40px;text-transform: uppercase;}
.galeria  .cont{width: 90%;max-width: 1200px;display: flex;flex-direction: row;justify-content: center;align-items: center;}
.galeria  a.ver{color: white;font-family: Grandstander;font-size: 30px;text-align: center;padding: 10px 30px;background: #629B66;border-radius: 20px;text-transform: uppercase;padding-top: 16px;margin-top: 20px;border: 1px solid #629B66}
.galeria  a.ver:hover{color: #629B66;background: transparent;}


#curator-feed-default-feed-layout{width: 90%;max-width: 1200px}
#curator-feed-default-feed-layout .crt-logo{color:#F5EFD7!important;}
#curator-feed-default-feed-layout .crt-post-text{display: none!important}
#curator-feed-default-feed-layout .crt-post {margin-top: -3px;}
#curator-feed-default-feed-layout .crt-post-share{display: none!important;}

.bodas{background: white;padding-top: 60px;display: flex;flex-direction: column;position: relative;}
.bodas .titles{margin-bottom: 40px;text-align: center;color: #609A65;font-family: Grandstander;font-size: 40px;text-transform: uppercase;}
.bodas .cont{width: 100%;max-width: 1500px;display: flex;flex-direction: row;justify-content: flex-end;align-items: flex-end;background: url('../img/Lido_wedding_desktop.jpg');background-size: 60% 100%;background-position: left;background-repeat: no-repeat;padding: 70px 0;margin: 0 auto}
.bodas .cont .box{display: flex;flex-direction: column;align-items: flex-start;align-content: flex-start;padding: 80px;box-sizing: border-box;width: 70%;max-width: 900px;background: rgba(230,215,186 )}
.bodas .cont p{color: #AB8041;font-size: 20px;font-family: monserrat-l;text-align: justify;line-height: 25px}
/*.bodas  a{color: #7C7973;font-size: 22px;text-align: center;font-family: Grandstander;margin-top: 15px;text-transform: uppercase;}*/
.bodas  p strong{color: #414143; font-family: monserrat-b}

/*.bodas  a{padding: 10px 6px;border: #7C7973 4px solid;transition:all ease-in-out .5s;margin-top: 20px}*/
/*.bodas  a:hover{background: #7C7973;color: white}*/

.bodas img{position: absolute;left: 5%;top: 0;width: 80%;height: 300px;object-fit: cover;}
.bodas .cont2{display: flex;;position: relative;width: 100%;flex-direction: row;justify-content: flex-end;align-items: flex-start;}
.bodas .cont2 .box2{padding: 20px 15px;box-sizing: border-box;width: 70%;background: rgba(230,215,186 );position: relative;z-index: 100;font-size: 15px;margin-top: 150px;margin-right: 10px;display: flex;flex-direction: column;justify-content: center;align-items: center;}
.bodas .cont2 p{color: #AB8041;;font-family: monserrat-l;text-align: left;line-height: 23px;margin-bottom: 15px}
.bodas .cont2 a{color: #F5EFD7;font-family: Grandstander;margin-top: 15px;text-transform: uppercase;}
.bodas .cont2 p strong{color: #414143; font-family: monserrat-b;font-size: 15px}

.bodas .cont2  .box2 p span{display: none;}

.reviews{background: white;padding-top: 60px;display: flex;flex-direction: column;}
.reviews .titles{margin-bottom: 40px;text-align: center;color: #609A65;font-family: Grandstander;font-size: 40px;text-transform: uppercase;}
.reviews .cont{width: 100%;max-width: 1500px;display: flex;flex-direction: row;justify-content: flex-end;align-items: flex-end;}
.reviews .fHhYpu, .reviews .gGgqlY {font-family: Grandstander;}

.contacto{background: white;padding: 60px 20px;display: flex;flex-direction: column;justify-content: center;align-items: center;box-sizing: border-box;}
.contacto .titles{margin-bottom: 40px;text-align: center;color: #609A65;font-family: Grandstander;font-size: 40px;text-transform: uppercase;}
.contacto .p1{color: #578E56;font-size: 22px;text-align: center;margin-bottom: 10px}
.contacto .p1 span{color: #4C4B4C;}
.contacto .p1 strong{font-family: monserrat-b}
.contacto .p2{color: #578E56;font-size: 24px;text-align: center;font-family: monserrat-b}
.contacto img{width: 300px;margin:40px 0;}
.contacto p{color:  #4C4B4C;font-size: 22px;text-align: center;}
.contacto .reservar{color: #F5EFD7;font-family: Grandstander;font-size: 30px;text-align: center;padding: 10px 30px;background: #629B66;border-radius: 20px;text-transform: uppercase;padding-top: 16px;margin-top: 20px;border: 1px solid #629B66}
.contacto .reservar:hover{color: #629B66;background: transparent;}

.contacto .p1 br{display: none}

.como{padding: 60px 0;display: flex;flex-direction: column;justify-content: center;align-items: center;background: #7C786F}
.como h2{color: #E3D4B7;font-size: 40px;text-transform: uppercase;font-family: Grandstander;text-align: center;}
.como iframe{width: 90%;max-width: 1000px;height: 300px;margin: 25px 0}
.como p{color: #E3D4B7;font-size: 20px;text-align: center;margin-bottom: 10px;text-transform: uppercase;font-family: Grandstander}
.como .redes{display: flex;flex-direction: row;justify-content: center;align-items: center;}
.como .redes a{margin: 5px 10px;padding: 10px;border-radius: 50%;background: #E4D4B7;border: 1px solid #E4D4B7;transition: all ease-in-out .5s}
.como .redes a i{color:  #7C786F;font-size: 20px;transition: all ease-in-out .5s}

.como .redes a:last-child i{color: #E4D4B7;font-size: 30px}

.como .redes a:hover{background:#7C786F }
.como .redes a:hover i{color:  #E4D4B7;}
.como .redes a:last-child{background: transparent;border: 0}

.footer{background: #E4D5B6;display: flex;flex-direction: column;justify-content: center;align-items: center;padding: 30px 0}
.footer p{color: #7C786F;text-align: center;;width: 90%;max-width: 700px;margin-bottom: 10px}
.footer p:nth-child(1){font-family: monserrat-b;font-size: 20px}
.footer p:nth-child(2){font-family: monserrat-l;font-size: 16px;margin-bottom: 20px}
.footer p:nth-child(3){font-family: Grandstander;font-size: 20px}

.pc{display: flex;}
.movil{display: none!important}
.header a.reservar{display: none}
@media(max-width: 1200px){
    .header .links{position: fixed;left: -100%;top: 0;z-index: 1000;flex-direction: column;height: 100vh;background: #AB8041;width: 50%;justify-content: start;align-items: center;}
    .header.active .links{background:  rgba(230,215,186 )}
    .header .links .link{margin-bottom: 10px}
    .header .links, .header .links .box, .header .links .idioma{flex-direction: column;justify-content: center;align-items: center;}
    .header .links .box, .header .links .idioma{flex-direction: column;justify-content: center;align-items: center;margin: 20px 0}
    .header .links .box a:first-child, .header .links .idioma a:first-child{margin-bottom: 5px}
    .header .links .idioma a:first-child{padding: 0;margin-right: 0;border: 0}
    .open-menu{display: flex;}
    .header a.reservar{margin-top: 0px;padding: 5px 10px;font-size: 15px;display: flex;padding-top: 8px}
}

@media(max-width: 1035px){
    .menus .cont .box{flex-direction: column;}
    .menus .cont .box .menu{width: 100%;margin-bottom: 15px}
}

@media(max-width: 753px){
.bodas .cont{background-size: cover;}
.bodas .cont .box{width: 100%;padding: 80px 20px}
.home{min-height: 100vh}

}

@media(max-width: 560px){
    .home .cont p{font-size: 25px}
    .home .cont .cocina{font-size: 40px}
    .contacto img{width: 250px}
    .reviews .titles{font-size: 30px}
    .contacto .p1 br{display: inherit}
    #curator-feed-default-feed-layout .crt-panel-next,#curator-feed-default-feed-layout .crt-panel-prev{display: none}

    .bodas .cont p, .bienvenidos .cont p{font-size: 16px;text-align: left;}
    .contacto .p2, .contacto img, .contacto p{display: none;}
    .header .logo img{width: 80px}
    .titles{font-size: 25px!important}
    .footer p{font-size: 12px}
    .bienvenidos .cont .box{padding: 30px 20px}
    .pc{display: none!important}
    .movil{display: flex!important}
    .header{padding: 10px 0}
    .home{min-height: 80vh;}
    .home .cont{margin-top: -20%}

    .bodas .cont{background: url('../img/Lido_wedding_mobile.jpg');background-size: 60% 100%;background-position: left;background-repeat: no-repeat;padding: 70px 0;margin: 0 auto}

    .home .cont h1{font-size: 30px;}
    .home{padding-top: 160px}

    .motor{width: 100%;max-width: inherit;;padding: 10px 0px;border-radius: 0px}
    .home .cont{width: 100%}
}

@media(max-width: 430px){

    .home .cont p{font-size: 18px}

}
/* Define la animación */
@keyframes vibrate {
  0% {
    transform: translate(0);
  }
  10% {
    transform: translate(-5px, 0);
  }
  20% {
    transform: translate(5px, 0);
  }
  30% {
    transform: translate(0, -5px);
  }
  40% {
    transform: translate(0, 5px);
  }
  50% {
    transform: translate(0);
  }
  60% {
    transform: translate(0);
  }
  70% {
    transform: translate(-5px, 0);
  }
  80% {
    transform: translate(5px, 0);
  }
  90% {
    transform: translate(0, -5px);
  }
  1000% {
    transform: translate(0, 5px);
  }
}

/* Agrega la animación al hacer hover */
.header .links .box a:hover {
  animation: vibrate 0.8s cubic-bezier(0.455, 0.030, 0.515, 0.955) both;
}
.links-hover:hover {
  animation: vibrate 0.8s cubic-bezier(0.455, 0.030, 0.515, 0.955) both;
}
@media(min-width: 600px){
    .menu:hover {
      animation: vibrate 0.8s cubic-bezier(0.455, 0.030, 0.515, 0.955) both;
    }
    .menus .cont .box .menu:after{position: absolute;left: 0;bottom: 0;background: #699766;width: 100%;height: 0px;transition: all ease-in-out .3s;content: ''}
}

@media(max-width: 600px){
    .menus .cont .box .menu:hover{background: #699766}
}