/*ESTILOS BASE*/
*{
    margin: 0;
    box-sizing: border-box;
    font-family: 'Montserrat', sans-serif;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.5rem;
    text-decoration: none;   
}

body{
    max-width: 100%;
}

img{
    width: 100%;
    height: auto;
}
summary {
    list-style: none
}
summary::-webkit-details-marker {
    display: none; 
}
sup{
    font-size: .6rem;
}

/*encabezados*/
h1, h2, h3, h4, h5{
    font-family: 'Roboto Slab';
    color: rgb(86, 75, 64);
}

h1{
    font-size: 3rem;
}
h2{
    font-size: 2rem;
    letter-spacing: 1.2pt;
    font-weight: 800;
    line-height: 1;
    
}
h3{
    font-size: 1.5rem;
}
h4{
    font-size: 1.2rem;

}
@media all and (max-width:769px){
    h2{
        font-size: 1.5rem;
    }
}

/*carrusel de imaxes (owl-carousel)*/
.owl-carousel{
    position: relative;
}
.owl-nav{
    position:absolute;
    width: 100%;
    height: 90%;
    top: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
#carousel-rehab .owl-nav,
#carousel-cursos .owl-nav{
    height: 100%;
}
.owl-nav .owl-prev ,
.owl-nav .owl-next{
    height: 40px;
    width: 40px;
}
.owl-nav .owl-prev:hover ,
.owl-nav .owl-next:hover{
    cursor:pointer;
}
.owl-prev span , .owl-next span{
    font-size: 80px;
    color: rgba(255, 255, 255);
}
.owl-theme .owl-nav [class*="owl-"]:hover{
    background: rgba(255, 255, 255, 0.699);
}

.owl-theme .owl-nav [class*='owl-']:hover{
    background: rgba(29, 27, 25, 0.322);
}
.owl-dots{
    margin-top: 10px;
}

/*CLASES BÁSICAS*/

.contenedor-flex{
    display: flex;
    flex-wrap: wrap;
}
.flex-column{
    flex-direction: column;
}
.bold{
    font-weight: 600;
}
.franxa-imaxe img{
    display: block;
}

/*colores fondo*/

.verde1{
    background-color: rgb(174, 203, 94);
}
.marron{
    background-color: rgb(70, 49, 18);
}

/*color letra*/

.letra-blanca{
    color: white;
}
.letra-marron{
    color: rgb(86, 75, 64);
}
.letra-marron2{
    color:rgb(70, 49, 18);
}

/*franxa xenérica*/
.franxa{
    width: 100%;
    justify-content: center;
    align-items: center;
    text-align: center;
}

/*lazy load*/
.lazy {
    opacity: .1;
}
img:not(.initial) {
    transition: opacity 1s;
}
.initial,
.loaded,
.error,
.entered {
    opacity: 1;
}
img:not([src]) {
    visibility: hidden;
}

/*selector idioma*/
header {
    position: relative;
}
.idioma{
    position: absolute;
    top: 0;
    right: 0;
    margin: 1rem;
    cursor: pointer;
}
.idioma li {
    background-color: #a4b856ba;
    list-style: none;
    padding: .4rem .9rem .4rem .6rem;
    width: 6.5rem;
    justify-content: flex-end;
    align-items: center;
    color: rgb(73, 66, 58)
}
.idioma li a{
    color: rgb(73, 66, 58);
}
.idioma li:nth-child(1){
    display: flex;
}
.idioma ul i{
    margin-right: .5rem;
    transition: rotate .3s;
}
.idioma ul .rotar{
    rotate: 90deg;   
}
.idioma .visible{
    display: flex;
}
.idioma .oculto{
    display: none;
}


/*NAVEGACIÓN*/

header{
    width: 100%;
    height: 300px;
    flex-direction: column;
    justify-content: space-around;
    align-items: center;
}
.cabeceira{
    padding: 130px 0 40px 0;
}
@media screen and (max-width:900px){
    .cabeceira {
        padding: 110px 0 40px 0;
    }
} 
@media screen and (max-width:480px){
    .cabeceira {
        padding: 100px 0 40px 0;
    }
}
.cabeceira h1{
    font-family: 'Fredericka the Great', cursive;    
    font-size: 5rem;
    color: rgb(255, 255, 255);
    text-align: center;   
}
@media screen and (max-width:900px){
    .cabeceira h1{
        font-size: 4rem;
    }
} 
@media screen and (max-width:560px){
    .cabeceira h1{
        font-size: 3rem;
    }
}
@media screen and (max-width:360px){
    .cabeceira h1{
        font-size: 2.3rem;
    }
}
nav{
    max-width: 750px;
    margin: 0 auto;
    padding: 0 0 15px 0;
}
nav ul{
    justify-content: space-around;
    align-items: center;
    padding: 0 ;
}
nav li{
    list-style: none;
    margin-top: 5px;
}
nav li  a{   
    color: rgb(73, 66, 58);
    padding: 8px;
    font-size: .95rem;
}
@media screen and (max-width:480px){
    nav li{
        margin-top: 15px;
    }
    /* nav li a{
        font-size: .85rem;
    } */
}
nav .barra-vertical-menu{
    font-size:2rem ;
    font-weight: 200;
    color: rgb(86, 75, 64);
    transform: translateY(-3px);
}
@media screen and (max-width: 724px) {
    nav .barra-vertical-menu:nth-of-type(10){
        display: none;
    }
}
@media screen and (max-width: 599px) {
    nav .barra-vertical-menu:nth-of-type(10){
        display: inline;
    }
    nav .barra-vertical-menu:nth-of-type(8){
        display: none;
    }
}
@media screen and (max-width: 516px) {
    nav .barra-vertical-menu:nth-of-type(8){
        display: inline;
    }
    nav .barra-vertical-menu:nth-of-type(6){
        display: none;
    }
}

nav .menu-seleccionado{
    color: white;
}
nav a:hover{
    color: white;
}

/***FOOTER***/

.contido-footer{
    width: 100%;  
    padding: 2rem;
}
.contido-footer>div{
    flex: 0 0 25%;
    height: 180px;
    padding-left: 20px;
}
footer #localizacion, footer #contacto, #menu-footer{
    border-left: 1px solid white;
    font-size: .8rem;
}
.contido-footer #contacto{
    flex-direction: column;
}
footer h5{
    font-family: 'Fredericka the Great', cursive;
    color: white;
    font-size: 1.7rem;
}
.contido-footer a{
    color: white;
    padding: .4rem;
}
.contido-footer p{
    color: white
}
footer i{
    margin-right: 15px;
}
footer #contacto a{
    padding: .4rem;
}
#menu-footer ul{
    padding-left:1rem;
    flex-flow: column;
}
#menu-footer li{
    list-style: none;
    margin-bottom: .3rem;
}
#menu-footer a{
    font-size: .8rem;
}
@media screen and (max-width:930px){
    .contido-footer>div:first-child{
        flex:0 0 100%;
        height: 60px;
    }
    .contido-footer>div{
        flex: 0 0 33%;
    }
}

@media screen and (max-width:768px){
    .contido-footer>div{
        flex: 0 0 50%;
    }
    .contido-footer #localizacion, .contido-footer #contacto{
        height: 110px;
    }
    #menu-footer{
        height: 60px;
        flex: 0 0 100%;
        border-left: none;
        padding: 0;
        align-items: center;
    }
    #menu-footer ul{
        height: 100px;
        flex-flow: row wrap;
        justify-content: space-between;
        align-items: center;
        padding-left: 0;
    }
}

@media screen and (max-width:560px){
    .contido-footer>div{
        flex: 0 0 100%;
        justify-content: center;
        align-items: center;
        padding:0;
    }
    .contido-footer #contacto p{
        padding-right: 2rem;
    }
    .contido-footer #localizacion, .contido-footer #contacto{
        border-left: none;
        border-bottom: 1px solid white;
        height: 150px;
        width: 40%;
    }
    #menu-footer{
        height:200px;
        padding: 20px;
    }

    #menu-footer ul{
        flex-flow: column;
    }
}

.credito-deseño{
    color: white;
    background-color: rgb(33, 28, 25);
    padding: .1rem;
    text-align: center;
}
.credito-deseño a,.credito-deseño p{
    font-size: .7rem;
}
.credito-deseño a{
    color: rgb(211, 204, 186);
    margin-left: .4rem;
}

/**********INICIO***********************************************************/

.hero{
    width: 100%;
}
.hero img,
.hero video{
    max-height: 100vh;
    width: 100%;
    object-fit: cover;
    object-position: 50% 70%;
    vertical-align: middle;
}


/*sub-header*/

.sub-header{
    width: 100%;
    text-align: center;
    justify-content: center;
    align-items: center;
    padding: 50px;   
}
.inicio .sub-header div{
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 40vw;
    font-size: 1.1rem;
    font-weight: 400;
    line-height: 1.8rem;
}
.inicio .sub-header h2{
    line-height: 2rem;   
}

.inicio .sub-header p{
    margin-bottom: 10px;
}
@media all and (max-width:900px){
    .inicio .sub-header div{
        width: 70vw;
    }
}
@media all and (max-width:769px){
    .inicio .sub-header h2{
        width: 50vw;
    }
}
@media all and (max-width:480px){
    .inicio .sub-header div{
        width: 70vw;
    }
    .inicio .sub-header h2{
        width: 50vw;
    }
}

/*apartados*/

.apartados-inicio{ 
    flex-direction: column;
    align-items: center;
}
.apartado-inicio{
    align-items: center;
    margin: 50px 0px 10px 0px;
    gap: 70px;
}
.texto-apartado{
    width: 25vw;
}
.texto-apartado h2{
    margin-bottom: 30px;
}
#entorno{
    text-align: right;
    margin-bottom: 60px;
}
#cursos{
    margin-bottom: 70px;
}
#alojamiento img{
    width: 20vw;
}
#entorno img{
    width: 25vw;
}
#cursos img{
    width:25vw ;
}
.ver-mas{
    margin-top: 20px;
}
.ver-mas a{
    font-weight: 600;
    color:rgb(86, 75, 64);
}
@media all and (max-width:1200px){
    #alojamiento img{
        width: 25vw;
    }
    #cursos img,
    #entorno img{
        width:30vw ;
    
    }
}
@media all and (max-width:900px){
    #alojamiento img{
        width: 30vw;
    }
    #cursos img,
    #entorno img{
        width:35vw ;
    
    }
    .texto-apartado{
        width: 40vw;
    }
}
@media all and (max-width:769px){
    .ver-mas a{
        font-size: .9rem;
    }
    
}
@media all and (max-width:540px){
    .apartado-inicio{
        flex-direction: column;
        margin: 50px 0 0 0 ;
        gap: 30px;
    }
    .texto-apartado{
        width: 70vw;
        
    }
    #entorno .texto-apartado{
        order: 1;
    }

    #alojamiento img, #entorno img, #cursos img{
        width: 70vw;
    }
    
    .ver-mas{
        padding-top:15px;
    }
}

/*franxa reservas*/
#reservas #chaves{
    width: 70px;
}
#reservas .texto{
    width: 500px;
    color: rgb(61, 60, 60);
    padding: 35px 0 45px 0;
}
#reservas .texto .contenedor-flex{
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
#reservas .texto p{
    line-height: 30px;
    font-weight: 500;
}
#reservas a{
    color: white;   
}
#reservas .texto h2{
    padding: 3px 0 20px 0px;
}

/*******ALOJAMIENTO****************************************************************/

.alojamiento .sub-header{
    flex-direction: column;
}
.alojamiento .sub-header p{
    width: 60vw;
    margin-bottom: 1.5rem;
}
.alojamiento .sub-header h2{
    margin-bottom: 30px;
    margin-top: 10px;
    align-self: flex-start;
}

/*carousel rehabilitación*/

#carousel-rehab .owl-item img{
    aspect-ratio: 8/5.3;
    object-fit: cover;
}
.franxa-restauracion{
    height:50px;
}

/*****/

.casa-hoy{
    padding: 50px 0 0 0;
    margin-top: -10px;
    align-items: center;
}

.casa-hoy h2{
    margin-bottom: 30px;
}

.casa-hoy p{
    width: 60vw;
    max-width: 55rem;
    text-align: center;
}
@media all and (max-width:769px){
    .alojamiento .sub-header{
        flex-wrap: nowrap;
    }
    .alojamiento .sub-header p{
        width: 80vw;
    }
    .casa-hoy p{
        width: 80vw;

    }
}
@media all and (max-width:480px){
    .alojamiento .sub-header p{
        width: 80vw;
    }
}

/*tarxetas alojamiento*/

.tarxetas{
    flex-wrap: wrap;
    width: 100%;
    justify-content: space-around;
    padding: 2vw 0 3vw 0;
}

@media screen and (max-width: 748px){
    .tarxetas{
        padding: 8vw 0 4vw 0;
    }
}
.tarxeta{
    padding: 3vw;
    flex: 0 0 32%;
}
.texto-tarxeta h4{
    margin: 0 0 2vw 0;
}
.carousel-estancias{
    width: 25vw;
    margin: 0;
}
.carousel-estancias .owl-item img{
    aspect-ratio: 8/5.3;
    object-fit: cover;
}

.lavanderia .owl-item {
    background-color: rgba(174, 203, 94, 0.33);
}
@media all and (max-width:1200px){
    .carousel-estancias{
        width: 40vw;
    }  

}
@media all and (max-width:769px){
    .texto-tarxeta{
        margin: 0 auto;
    }

    .carousel-estancias{
        width: 80vw;
    }
    .texto-tarxeta h4{
        margin: 0 0 3vw 0;
    }
}
@media all and (max-width:560px){
    .tarxeta:nth-child(5){
        margin-bottom: 35px;
    }
}
@media all and (max-width:360px){
    
    .texto-tarxeta h4{
        margin: 0 0 6vw 6vw;
    }
}

.foto-dormitorio-2,
.foto-salon-3{
    object-position: 50% bottom;
}

/*franxa tarifas alojamiento*/

.contido-tarifas{
    height: 200px;
    width: 500px;
    flex-direction: column;
    justify-content: space-around;
    padding: 40px;
    font-weight: 500;
}
.contido-tarifas h3{
    font-weight: 600;
}
.contido-tarifas p{
    font-weight: 500;
}

/*******CURSOS***********************************************************************/

.texto-cursos{
    margin: 50px 0 55px 0;
    flex-direction: column;
    text-align: left;
}
.texto-cursos>*{
    width: 780px;
}
.ingles .texto-cursos>*{
    width: 870px;
}

.texto-cursos #obxetivos{
    padding: 10px 0 30px 0;
    list-style: none;
}
.texto-cursos #obxetivos li::before {
    content: "\2022"; 
    color: rgb(86, 75, 64);
    font-weight: bold; 
    font-size: 1.2rem;
    display: inline-block;
    width: 1.2em; 
}
.contacto-catas{
    display: inline-block;
    font-weight: 600 !important;
    color: black;
    margin-top: 1rem;

}
.cursos details{
    margin-top: 40px;
}
.cursos summary{
    cursor: pointer;
    background-color: rgb(227, 250, 142);
    padding: 7px;   
    position: relative;
    text-align: center;
    border-radius: 3px;
}
details summary::before { 
    content: url(../img/plus.svg);
    width: 1.5rem;
    position: absolute;
    top: 28%;
    left: 13px;
}
details[open] summary::before { 
    content:url(../img/dash.svg); 
}  
.cursos summary>*{
    display: inline;
}
.cursos details>div{
    padding-top: 20px;
    justify-content: space-between;
    gap: 10px;
    flex-wrap:nowrap!important;
}
.cabecera-programa, .cabecera-fechas{
    display: block;
    background-color:rgba(227, 250, 142, 0.687) ;
    padding: 7px 0 3px 30px;
}

#programa {
    width: 100%;
}
#programa #contenedor-programa,
#fechas #contenedor-fechas{
    display: flex;
    align-items: center;
    border: solid 4px rgba(227, 250, 142, 0.687);
    border-radius: 3px;
    height: 80%;
}
#programa ol, #fechas ul{   
    padding: 15px;   
}
#programa ol li{
    margin-bottom: 5px;
    list-style-type: upper-roman;
    list-style-position: inside;
    text-align: left;
}
.texto-cursos #fechas ul{
    list-style: square;
}
.cursos details #fechas ul li{
    margin-bottom: 5px;
    list-style-position: inside;
}
.cursos details div li::marker{
    font-weight: 600;
    color:rgb(86, 75, 64);
    margin-right: 1.2rem;
}
@media screen and (max-width: 900px){
    .texto-cursos{
        margin: 40px 0 25px 0; ;
    }
    .texto-cursos>*,
    .ingles .texto-cursos>*{
        width: 85vw;
    }
    .cursos details>div{
        flex-direction: column;
        gap: 15px;
    }
    .cursos details{
        margin-top: 35px;
    }
}
@media screen and (max-width: 560px){
    .cursos summary h3{
        font-size: 1.3rem;
    }
}
@media screen and (max-width: 480px){
    .cursos summary h3{
        font-size: 1.1rem;
    }
    .cursos summary::before{
        transform:scale(80%);
        left:10px;
    }
}
@media screen and (max-width: 390px){
    .cursos summary h3{
        font-size: 1rem;
    }
    .cursos summary::before{
        transform:scale(65%);
        left:8px;
    }
}
.cursos details #fechas ul li.completo{
    margin-bottom: 20px;
}
.cursos details #fechas ul li>span{
    position: relative;
}
.palabra-completo{
    position: absolute;
    top: 19px;
    left: 0;
    display: block;
    color: red;
}

/*carousel fotos cata*/

#carousel-cursos .owl-theme .owl-nav{
    margin-top: 0 !important;
}



/********ENTORNO**************************************************************************/

.titulo-entorno{
    text-align: center;
    margin: 10vh 0 8vh 0;
    font-weight: 600;
}
.actividades{
    justify-content: space-around;
    margin-top: 40px;
}
.actividade{
    flex: 0 0 30%;
    padding: 3vw;
    text-align: center;
}
.actividade h3{
    font-weight: 600;
    margin: 8px 0 20px 0;
}
.actividade:last-child>h3{
    margin-top: 45px;
}
.actividade p{
    margin-bottom: 10px;
}
.actividade a{
    display: block;
    color: rgb(86, 75, 64);
    text-decoration: underline dotted;
}
.carousel-entorno{
    width: 30vw;
}
@media all and (max-width:1200px){
    .carousel-entorno{
        width: 40vw;
    }  
}
@media all and (max-width:769px){
    .actividades{
        margin-bottom: 20px;
    }
    .actividade{
        margin-bottom: 20px;
    }
    .carousel-entorno{
        width: 80vw;
    }
    .actividade p{
        width: 80vw;
        margin: 0 auto;
    }
}


/*sección Cómo llegar*/

.como-llegar .seccion-der{
    /* height: 400px; */
    flex-grow: 1;
    justify-content: space-around;
    align-items: center;
    padding: 20px;
}
.como-llegar #camiño img{
    height: 400px;
    width: auto;
    display:block;   
}
.como-llegar #franxa img{
    display: none;
}
.como-llegar-texto{
    color: white;
    flex-direction: column;
    justify-content: space-evenly;
}
.como-llegar-texto div{
    margin-top: 10px;
}
.como-llegar-texto p{
    font-weight: 500;
}
.como-llegar-texto h2{
    font-weight: 600;
    margin-bottom: 20px;
    color: white;
}
.como-llegar-texto h4{
    margin-bottom: 10px;
    font-weight: 500;
}
.mapa{
    height: 300px;
    background-color: rgb(28, 29, 22);
}
.mapa iframe{
    height: 300px;
    width: 25vw;
}
@media screen and (max-width:1300px){
    .como-llegar .seccion-der{
        padding: 40px;
    }
    .como-llegar #camiño img{
        display: none;
    }
    .como-llegar #franxa img{
        display: block;
        height: auto;
        width: 100%;
    }
    .mapa iframe{
        height: 300px;
        width: 40vw;
    }
}
@media screen and (max-width:900px){
    .seccion-der{
        flex-direction: column;
    }
    .como-llegar #franxa img{
        display: none
    }
    .mapa iframe{
        height: 300px;
        width: 100vw;
    }
    .como-llegar-texto{
        padding:40px;
    }
    .como-llegar .seccion-der{
        padding: 0;
    }
}

/*******SOBRE MI**************************************************************************/

.contenedor-sobre-mi{
    width: 65vw;
    margin: 0 auto;
    justify-content: space-between;
    align-items: flex-start;
    padding: 5vw;
}
.sobre-mi img{
    width: 45%;
    height: 45%;
}
.contenedor-sobre-mi p{
    width: 45%;
}
@media screen and (max-width:1200px){
    .contenedor-sobre-mi{
        width: 80vw;
    }
}
@media screen and (max-width:900px){
    .contenedor-sobre-mi{
        width: 90vw;
    }
}
@media screen and (max-width:769px){
    .contenedor-sobre-mi{
        flex-direction: column;
        align-items: center;
    }
    .sobre-mi img{
    
        margin-top: 30px;
    }
    .contenedor-sobre-mi p{
        width: 80vw;
        margin: 40px 0 40px 0;
    }
}

@media screen and (max-width:560px){
    .sobre-mi img{
        width: 80vw;
    }
    
}

/************RESERVAS**************************************************************************/

.reservas-contido{
    min-height: 75vh;
    justify-content: center;
    gap: 30px;
    align-items: center;
    text-align: left;
    margin: 40px 0;
}
.reservas-contido img{
    width: 300px;
    margin: 30px 0 30px 0;
}
.reservas-contido>div{
    margin: 30px;
    background-color: rgba(255, 255, 255, 0.541);
    padding: 20px;
}
.reservas-contido div>*{
    color: black;
    font-size: 1.1rem;
    font-weight: 400;
}
#datos-contacto{
    margin-top: 30px;
}
#datos-contacto>*{
    margin-top: 1rem;
    font-size: 1.2rem;
    color: black;
    font-weight: 500;
}
@media screen and (max-width:900px){
    .reservas-contido>div{
        margin: 0 0 30px 0;
    }
    .reservas-contido img{
        width: 250px;
        margin: 30px 0 0 0;
    }
    .reservas-contido {
        text-align: center;
    }
}
@media screen and (max-width:360px){
    
    .reservas-contido img{
        width: 75vw;
    }
}