/* -------------------------------------------------------------------------- */
/* 1. MOBILE FIRST (Min-Width) - Estilos base que se aplican hacia arriba     */
/* -------------------------------------------------------------------------- */
/** xs */
#animation-menu {
    height: auto !important;
    .menu-horizontal {
        .item-menu {
            max-width: 100%;
            a {
                h2 {
                    font-size: 1rem;
                    line-height: 1.2;
                }
            }
        }
        .contenidor_menu {
            display: block;
        }
    }
}

.lugares {
    .bloque {
        ul {
            li { font-size: 0.84rem; }
        }
    }
}

img.centered-mapa {
    margin-left: 0px;
    width: 100%;
    height: auto;
}


#menu-visible {
    width: 100%;
    min-width: 100%;

    .item {
        width: 40px;
    }
}

.h100vh {
    height: auto !important;
}

.col-lg-4r,
.col-lg-5r,
.col-lg-6r,
.col-lg-7r,
.col-lg-8r {
    width: 100%;
}

.pr80 {
    padding-right: auto !important;
}

.contenido2col {
    column-count: 1; 
    gap:initial;
    text-align: center;
}

#contenido_logo_texto  {
    svg {
        width: 300px;
    }
}

#lifestyle {
    height: auto !important;

    #img1,
    #img3 {
        height: 300px !important;
    }

    #img2,
    #img4 {
        height: 300px !important;
    }
}

.l_col1row1 {
    height: 100%;
}
.l_col1row2 {
    height: 100%;
}
.l_col2row1 {
    height: 100%;
}
.l_col2row2 {
    height: 100%;
}

.contenido-2, .contenido-1 {
    column-count: 1;
}


.cuadro-absolute {
    .cuadro {
        background-color: rgba(77, 34, 39, 0.6);
    }
}


.accordion-item:first-of-type {
    border-top-left-radius: 0px !important;
    border-top-right-radius: 0px !important;
}
.accordion-item:last-of-type {
    border-bottom-right-radius: 0px !important;
    border-bottom-left-radius: 0px !important;
}

.logo-animation svg {
    bottom: 20px;
    width: 100%;
}

h2.title {
    font-size: 2.3rem !important;
}

.info-video {
    .logo-arca {
        img {
            width: 250px;
        }
    }
    .lema {
        width: 400px;
    }
}



/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {
    /** sm */
}


/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
    /** md */
    #animation-menu {
        .menu {
            .vertical-item {
                &:hover {
                    width: 50vw;
                }

                .info {
                    .numero {
                        font-size: 18rem;
                    }
                }
            }
        }
    }

}


/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
    /** lg */

   body.page-index3 {
        font-size: 15px;
    }
    section {
        overflow: hidden;
    }

    .top-title {
        font-size: .8rem;
    }
    h2 {
        font-size: 1.8rem;
    }
    .contenido {
        font-size: .9rem;
    }

    #menu-visible {
        .item {
            span.txt {
                font-size: .8rem;
                
            }
            span.num {
                top: 7px;
            }
            &.active {
                span.txt {
                    bottom: -10px;
                }
            }
            &:hover {
                span.txt {
                    bottom: -10px;
                }
            }
        }
    }

    #animation-menu {
        .quote-text {
            left: 20px;
            width: 400px;
        }

        .menu {
            .vertical-item {
                .info {
                    h2 {
                        font-size: 2rem;
                    }
                    .numero {
                        font-size: 15rem;
                    }

                    .thumbnail {
                        height: 300px;
                    }
                }

                &:hover {
                    width: 30vw;
                }
            }
        }

    }

    #animation-menu {
        height: 100vh !important;
        .menu-horizontal {
            .item-menu {
                max-width: 15%;
                a {
                    h2 {
                        font-size: 1rem;
                        line-height: 1.2;
                    }
                    .seccion {
                        font-size: 0.9rem !important;
                    }
                }
            }
            .contenidor_menu {
                display: flex;
                align-items: center;
                justify-content: space-around;
            }
        }
    }

    .col2row1 {
        height: 60%;
    }
    .col2row2 {
        height: 40%;
    }

    .h100vh {
        height: 100vh !important;
    }

        .col-lg-5r {
        width: calc(41.66666667% - 80px);
    }
    .col-lg-6r {
        width: calc(50% - 80px);
    }
    .col-lg-7r,
    .col-xxl-7  r {
        width: calc(58.33333333% - 80px);
    }
        .col-lg-8r {
        width: calc(66.66666667% - 80px);
    }
    .col-lg-9r,
    .col-xxl-9r {
        width: calc(75% - 80px);
    }
    .col-lg-4r {
        width: calc(33.33333333% - 80px);
    }

    .pr80 {
         padding-right: 80px !important;
            }

    .contenido2col {
        column-count: 2; 
        gap: 30px; 
        text-align: justify;
        font-size: .9rem;
    }

    img.centered-mapa {
        margin-left: -120px;
        height: 100%;
        width: auto;
    }

    #contenido_logo_texto  {
        svg {
            width: 400px;
        }
    }

    #lifestyle {
        height: 100vh !important;

        #img1,
        #img3 {
            height: 100% !important;
        }

        #img2,
        #img4 {
            height: 100% !important;
        }
    }

    .l_col1row1 {
       height: 55%;
    }
    .l_col1row2 {
        height: 45%;
    }
    .l_col2row1 {
        height: 45%;
    }
    .l_col2row2 {
        height: 55%;
    }

        .contenido-2 {
        column-count: 2;
        gap: 30px; 
        text-align: justify;
        font-size: 0.7rem;
    }
    .contenido-1 {
        column-count: 1;
        text-align: justify;
        font-size: 0.7rem;
    }


    .accordion-item:first-of-type {
        border-top-left-radius: var(--bs-accordion-border-radius) !important;
        border-top-right-radius: var(--bs-accordion-border-radius) !important;
    }
    .accordion-item:last-of-type {
        border-bottom-right-radius: var(--bs-accordion-border-radius) !important;
        border-bottom-left-radius: var(--bs-accordion-border-radius) !important;
    }

    .logo-animation svg {
        bottom: 0px;
        width: 100%;
    }

    h2.title {
        font-size: 1.9rem !important;
    }

    .info-video {
        .logo-arca {
            img {
                width: 350px;
            }
        }
        .lema {
            width: 500px;
        }
    }
    
}


/* X-Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
    /** xl */
    
        body.page-index3 {
        font-size: 15px;
    }

    section {
        overflow: hidden;
    }

    .top-title {
        font-size: .8rem;
    }
    h2 {
        font-size: 1.8rem;
    }
    .contenido {
        font-size: .9rem;
    }

    #menu-visible {
        .item {
            span.txt {
                font-size: .8rem;
                
            }
            span.num {
                top: 7px;
            }
            &.active {
                span.txt {
                    bottom: -10px;
                }
            }
            &:hover {
                span.txt {
                    bottom: -10px;
                }
            }
        }
    }

    #animation-menu {
        .quote-text {
            left: 60px;
            width: 400px;
        }

        .menu {
            .vertical-item {
                .info {
                    h2 {
                        font-size: 2rem;
                    }
                    .numero {
                        font-size: 15rem;
                    }

                    .thumbnail {
                        height: 300px;
                    }
                }
            }
        }

    }

    .contenido2col {
        font-size: 1rem;
    }
    
    .l_col1row1 {
        height: 48%;
    }
    .l_col1row2 {
        height: 52%;
    }
    .l_col2row1 {
        height: 55%;
    }
    .l_col2row2 {
        height: 45%;
    }

    .col2row1 {
        height: 50%;
    }
    .col2row2 {
        height: 50%;
    }

    .contenido-2 {
        font-size: 0.9rem;
    }
    .contenido-1 {
        font-size: 0.9rem;
    }

    h2.title {
        font-size: 2rem !important;
    }

}


/* XX-Large devices (larger desktops, 1400px and up) */
@media (min-width: 1400px) {
    /** xxl */

    section {
        overflow: hidden;
    }

    .top-title {
        font-size: 1rem;
    }
    h2 {
        font-size: 2.5rem;
    }
    .contenido {
      font-size: 1rem;
    }

    #menu-visible {
        .item {
            span.txt {
                font-size: 1rem;
            }
            span.num {
                top: 5px;
            }
            &.active {
                span.txt {
                    bottom: -7px;
                }
            }
            &:hover {
                span.txt {
                    bottom: -7px;
                }
            }
        }
    }
    
    #animation-menu {
        .quote-text {
            left: 100px;
            width: auto;
        }

        .menu {
            .vertical-item {
                .info {
                    h2 {
                        font-size: 2.5rem;
                    }
                    .numero {
                        font-size: 25rem;
                    }
                    .thumbnail {
                        height: 400px;
                    }
                }
            }
        }
    }

    #animation-menu {
        .menu-horizontal {
            .item-menu {
                a {
                    h2 {
                        font-size: 1.3rem;
                        line-height: 1.2;
                    }
                    .seccion {
                        font-size: 1rem !important;
                    }
                }
            }
        }
    }

    .lugares {
        .bloque {

            ul {
                li { font-size: 1rem; }
            }
        }
    }

    img.centered-mapa {
        margin-left: 0px;
    }

    .col2row1 {
        height: 45%;
    }
    .col2row2 {
        height: 55%;
    }

    .contenido-2, .contenido-1 {
        font-size: 0.9rem;
    }

    .cuadro-absolute {
        .cuadro {
            background-color: transparent;
        }
    }

    h2.title {
        font-size: 2rem !important;
    }
}



/** CUSTOM */
@media (min-width: 1600px) {
    .contenido {
        font-size: 1.1rem;
    }

    .col2row1 {
        height: 40%;
    }
    .col2row2 {
        height: 60%;
            }
    .contenido-2, .contenido-1 {
        font-size: 1rem;
    }
}



/** bloquear impresion
** Oculta todo el contenido del body cuando se imprime la página */
@media print {
    body {
        display: none !important;
    }
}