a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1;-webkit-text-size-adjust:none}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:'';content:none}table{border-collapse:collapse;border-spacing:0}mark{background-color:transparent;color:inherit}input::-moz-focus-inner{border:0;padding:0}input,select,textarea{-moz-appearance:none;-webkit-appearance:none;-ms-appearance:none;appearance:none}blockquote,em,i{font-style:italic}blockquote,p,pre{margin:0 0 2em}html{box-sizing:border-box}*,:after,:before{box-sizing:inherit}body *{-webkit-tap-highlight-color:transparent}body,html{background:#fff;min-width:320px}body.is-preload *,body.is-preload :after,body.is-preload :before{-moz-animation:none!important;-webkit-animation:none!important;-ms-animation:none!important;animation:none!important;-moz-transition:none!important;-webkit-transition:none!important;-ms-transition:none!important;transition:none!important}b,h1,h2,h3,h4,h5,h6,strong{color:#1c1d26;font-weight:300}a{-moz-transition:border-color .2s ease-in-out,color .2s ease-in-out;-webkit-transition:border-color .2s ease-in-out,color .2s ease-in-out;-ms-transition:border-color .2s ease-in-out,color .2s ease-in-out;transition:border-color .2s ease-in-out,color .2s ease-in-out;border-bottom:1px dotted;color:var(--color-number1);text-decoration:none}a:hover{color:var(--color-number1);border-bottom-color:transparent}h1,h2,h3,h4,h5,h6{line-height:1em;margin:0 0 1em}h2,h3,h4,h5,h6{line-height:1.25em}h1 a,h2 a,h3 a,h4 a,h5 a,h6 a{color:inherit;border:0}h2{font-size:2em;}h3{font-size:1.35em}h4{font-size:1.1em}h5{font-size:.9em}h6{font-size:.7em}sub,sup{font-size:.8em;position:relative}sub{top:.5em}sup{top:-.5em}code,pre{font-family:"Courier New",monospace;font-size:.9em}hr{border:0;border-bottom:1px solid rgba(255,255,255,.3);margin:3em 0}hr.major{margin:4em 0}blockquote{border-left:4px solid rgba(255,255,255,.3);padding:.5em 0 .5em 2em}code{background:rgba(255,255,255,.075);border-radius:4px;margin:0 .25em;padding:.25em .65em}pre{-webkit-overflow-scrolling:touch}pre code{display:block;line-height:1.75em;padding:1em 1.5em;overflow-x:auto}
body,input,button,select,textarea{font-family:'Poppins',sans-serif;font-size:20px;font-weight:300;line-height:1.25em;letter-spacing:0.015em;}@media screen and (max-width: 1680px){body,input,button,select,textarea{font-size:16px;}}@media screen and (max-width: 1280px){body,input,button,select,textarea{font-size:14px}}


@keyframes spinner-show {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}
@keyframes spinner-hide {
    0% {
        color: rgba(255, 255, 255, 0.15);
        z-index: 100001;
        -moz-transform: scale(1) rotate(0deg);
        -webkit-transform: scale(1) rotate(0deg);
        -ms-transform: scale(1) rotate(0deg);
        transform: scale(1) rotate(0deg);
    }

    99% {
        color: #1c1d26;
        z-index: 100001;
        -moz-transform: scale(0.5) rotate(360deg);
        -webkit-transform: scale(0.5) rotate(360deg);
        -ms-transform: scale(0.5) rotate(360deg);
        transform: scale(0.5) rotate(360deg);
    }

    100% {
        color: #1c1d26;
        z-index: -1;
        -moz-transform: scale(0.5) rotate(360deg);
        -webkit-transform: scale(0.5) rotate(360deg);
        -ms-transform: scale(0.5) rotate(360deg);
        transform: scale(0.5) rotate(360deg);
    }
}
@keyframes spinner-rotate {
    0% {
        -moz-transform: scale(1) rotate(0deg);
        -webkit-transform: scale(1) rotate(0deg);
        -ms-transform: scale(1) rotate(0deg);
        transform: scale(1) rotate(0deg);
    }

    100% {
        -moz-transform: scale(1) rotate(360deg);
        -webkit-transform: scale(1) rotate(360deg);
        -ms-transform: scale(1) rotate(360deg);
        transform: scale(1) rotate(360deg);
    }
}
@keyframes overlay-hide {
    0% {
        opacity: 1;
        z-index: 100000;
    }

    15% {
        opacity: 1;
        z-index: 100000;
    }

    99% {
        opacity: 0;
        z-index: 100000;
    }

    100% {
        opacity: 0;
        z-index: -1;
    }
}

body.landing {
    text-decoration: none;
}

    body.landing:before {
        -moz-osx-font-smoothing: grayscale;
        -webkit-font-smoothing: antialiased;
        display: inline-block;
        font-style: normal;
        font-variant: normal;
        text-rendering: auto;
        line-height: 1;
        text-transform: none !important;
        font-family: 'Font Awesome 6 Free';
        font-weight: 900;
    }

    body.landing:before {
        animation: spinner-show 1.5s 1 0.25s ease forwards, spinner-hide 0.25s ease-in-out forwards !important;
        transform-origin: 50% 50%;
        color: rgba(255, 255, 255, 0.15);
        content: '\f1ce';
        cursor: default;
        display: block;
        font-size: 2em;
        height: 2em;
        left: 50%;
        line-height: 2em;
        margin: -1em 0 0 -1em;
        opacity: 0;
        position: fixed;
        text-align: center;
        top: 50%;
        width: 2em;
        z-index: -1;
    }

    body.landing:after {
        animation: overlay-hide 1.5s ease-in forwards !important;
        background: #1c1d26;
        content: '';
        display: block;
        height: 100%;
        left: 0;
        opacity: 0;
        position: fixed;
        top: 0;
        width: 100%;
        z-index: -1;
    }

    body.landing.is-preload:before {
        animation: spinner-show 1.5s 1 0.25s ease forwards, spinner-rotate 0.75s infinite linear !important;
        z-index: 100001;
    }

    body.landing.is-preload:after {
        animation: none !important;
        opacity: 1;
        z-index: 100000;
    }

@media (-webkit-min-device-pixel-ratio: 2) {

    body.landing:before {
        line-height: 2.025em;
    }

}

button,.button{text-align:center;padding:0 1em;border:none;background:none;cursor:pointer}
button,.button{
    display:inline-block;
    font-size:0.875em;
    background:var(--color-number1);
    color:#fff;
    min-width:3em;
    border-radius:0.75em;
    padding:0.75em 1em;
    line-height:1em;
    &:hover{
        background:var(--color-number1-blur);
        color:#fff;
    }
    &.sty0{
        background-color:transparent;
        color: inherit;
    }
}

.buttons{
    display:flex;
    flex-direction: row;
    flex-wrap: nowrap;
    width: calc(100% + 1em);
    justify-content: center;
    margin-bottom:2em;
    & li{
        margin-right:1em;
    }
}

a{
    border-bottom: 0;
}

strong{
    font-weight:600;
}

.container {
    margin: 0 auto;
    /* margin-top:4em; */
    margin-bottom:4em;
    max-width: calc(100% - 4em);
    width: 70em;
    text-align: center;
    &.xsmall{width: 17.5em;}
    &.small{width: 35em;}
    &.medium{width: 52.5em;}
    &.large{width: 87.5em;}
    &.xlarge{width: 105em;}
    &.max{width: 100%;}
    @media screen and (max-width: 1280px){width: 90%;max-width: 100%;}
    @media screen and (max-width: 980px){width:calc(100% - 2em)!important;}
    @media screen and (max-width: 736px){margin-top:3em;}
}

#page-wrapper{
    backface-visibility: hidden;
    transition: transform 0.5s ease;
    padding-top: 3em !important;
    overflow-x: hidden;
}

.flex{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
}

.card{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    margin-bottom:2rem;
    text-align: left;
    & picture{
        width:40%;
        & img{
            width:100%;
        }
    }
    & > div{
        display: flex;
        flex-direction: column;
        justify-content: center;
        width:55%;
        padding:0 2em;
        & h2{
            font-size:1.5em;
            font-weight:400;
            margin:0 0 0.5rem;
        }
        & h3{
            font-size:1.125em;
            font-weight:400;
            margin:0;
        }
        & p{font-size:1em;margin-bottom:1rem;}
        & hr{
            margin: 1em 0 1em -2em;
            border-bottom: solid 3px var(--color-number1);
            opacity: 1;
            width: calc(50% + 2em);
        }
        & a{width:fit-content;padding:0.75em 1.5em;}
        & ul{
            & li{
                display: inline-block;
                margin-right:1em;
            }
            &.amenities{
                list-style-type: disc;
                list-style-position: inside;
                margin-bottom:1em;
                & li{
                    display: list-item;
                }
            }
        }
    }
    .landing &{
        margin-bottom:4em;text-align: left;
        & div{width: 50%;}
    }
    @media screen and (max-width: 736px){
        text-align:center !important;
        & picture{width:100%;max-width: 420px;}
        & div{
            width:100% !important;;padding:1em 0;
            & a{margin: 0 auto;}
        }
    }
}

.card-square{
    & > div{
        width:100%;
        position: relative;
        display: flex;
        flex-direction:row;
        flex-wrap:wrap;
        justify-content:center;
        margin-bottom:2rem;
    }
    & article{
        width:30%;margin-right:1em;margin-bottom:1em;padding:1em;text-align:center;border:#dfdfdf 1px solid;flex-direction: row;
        & picture{
            position:relative;
            width: 100%;
            display: block;
            background: #eee;
            overflow: hidden;
            cursor: pointer;
            margin-bottom:0.5em;
            &:before{
                content: '';
                display: block;
                padding-top: 66.67%;
            }
            & img{
                width:100%;
                height:100%;
                position: absolute;
                top:0;
                left:0;
                right:0;
                bottom:0;
                object-fit: cover;
            }
        }
        & h3{text-transform:uppercase;color:var(--color-number1);margin:0;}
        & h3 span{color:#000;}
        & h4{margin-bottom:0;}
        & p{padding-top:1em;}
        & ul{color: #000;font-weight:300;}
        @media screen and (max-width:736px){width:calc(50% - 1em);}
        @media screen and (max-width:480px){width:100%;}
    }
}

.gallery-grid{
    width:calc(100% + 1em);
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    & picture{
        width:calc(25% - 1em);
        position: relative;
        background: #eee;
        overflow: hidden;
        display: block;
        cursor: pointer;
        margin-right:1em;
        margin-bottom:1em;
        &:before{
            content: '';
            display: block;
            padding-top: 90%;
        }
        & img{
            position: absolute;
            height: 100%;
            object-fit: cover;
            object-position: 50% 50%;
            top: 0;
            left: 0;
            bottom: 0;
            right: 0;
        }
    }
    .landing &{
        width:calc(100% + 0.5em);
        margin-bottom: 2em;
        & picture{
            width:calc(12.5% - 0.5em);
            margin-right:0.5em;
            margin-bottom:0.5em;
        }
    }
    @media screen and (max-width: 736px){
        & picture{
            width:calc(50% - 1em);
        }
        .landing &{
            & picture{
                width:calc(25% - 0.5em);
                margin-right:0.5em;
                margin-bottom:0.5em;
            }
        }
    }
}

#navbar{
    display: flex;
    flex-direction: row;
    background:var(--color-number2);
    position: absolute;
    top: 0;
    width:100%;
    z-index: 22;
    & nav{
        width:calc(100% - 10em);
        display: flex;
        flex-direction: column;
        padding:0 0.5em;
        & ul{
            display: flex;
            flex-direction: row;
            justify-content: flex-end;
            order: 2;
            width:100%;
            height:3em;
            line-height:3em;
            &:last-child{order:1;}
            & li{margin-left:0.5em;}
            & .button{
                margin-left:1em;
            }
        }
    }
    & .logo{
        position: relative;
        width:10em;
        height:6em;
        & img{object-fit: contain;width:100%;height:100%;}
    }
    @media screen and (max-width: 736px){display: none;}
}
#titleBar {
    backface-visibility: hidden;
    transition: transform 0.5s ease;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-end;
    height: 6em;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 10001;
    background: var(--color-number2);
    box-shadow: 0 0.125em 0.125em 0 rgba(0, 0, 0, 0.125);
    & .title{
        position: absolute;
        left:0.5em;
        & .logo {
            position: relative;
            display: inline-block;
            height:6em;
            padding:0.5em 0;
            & img{
                width:auto;
                height:auto;
                max-height: 5em;
            }
        }
    }
    & .button{
        border-radius:0;
        font-size:1em;
        height:3em;
        min-width:6em;
        line-height:3em;
        padding:0 1em;
        margin-left:0.5em;
        & span{
            font-size:0.875em;
        }
    }
    & .toggle{
        display: inline-block;
        width: 4.5em;
        height:3em;
        color: var(--color-number2);
        text-align: center;
        line-height:3em;
        background: #fff;
        & i{
            font-size:1.25em;
        }
    }
    & .phone{
        line-height:2.5em;
        padding-right:1em;
    }
    & .toggle_{
        text-decoration: none;
        height: 60px;
        right: 0;
        position: absolute;
        top: 0;
        width: 90px;
        outline: 0;
        border: 0;
        &:before{
            -moz-osx-font-smoothing: grayscale;
            -webkit-font-smoothing: antialiased;
            display: inline-block;
            font-style: normal;
            font-variant: normal;
            text-rendering: auto;
            line-height: 1;
            text-transform: none !important;
            font-family: 'Font Awesome 6 Free';
            font-weight: 900;
            background: var(--color-number1);
            color: rgba(255, 255, 255, 0.5);
            content: '\f0c9';
            display: block;
            font-size: 18px;
            height: 44px;
            left: 0;
            line-height: 44px;
            position: absolute;
            text-align: center;
            top: 0;
            width: 54px;
            margin-left: 36px;
        } 
    }
    @media screen and (min-width: 881px){display: none;}
}
#navPanel{
    backface-visibility: hidden;
    transform: translateX(275px);
    transition: transform 0.5s ease;
    display: block;
    height: 100%;
    right: 0;
    overflow-y: auto;
    position: fixed;
    top: 0;
    width: 275px;
    z-index: 10002;
    background: var(--color-number2);
    padding: 0.75em 1.25em;
    & .link{
        border: 0;
        border-top: solid 1px rgba(255, 255, 255, 0.05);
        border-color: var(--color-number3);
        color: rgba(255, 255, 255, 0.75);
        color: var(--color-number3);
        display: block;
        height: 3em;
        line-height: 3em;
        text-decoration: none;
        &:hover{
            color: inherit !important;
        }
        &:first-child{
            border-top: 0;
        }
    }
    @media screen and (min-width: 881px){display: none;}
}
body.navPanel-visible{
    & #titleBar{
        transform: translateX(-275px);
    }
    & #navPanel{
        transform: translateX(0);
    }
}
#footer {
    background:var(--color-number2);
    padding: 2em 0 4em 0;
    text-align: center;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    & .logo{
        width:10em;
        & img{width:100%;}
    }
    & .contact{
        padding-left:1em;
        text-align: left;
        & ul {
            & li{line-height:1.5em;}
        }
    }
    & .copyright{
        padding-top:1rem;
        width:100%;
        & li{
            display: inline-block;
            margin-left:1em;
            line-height:1.5em;
        }
    }
    @media screen and (max-width: 736px){
        flex-direction: column;
        & .logo{margin-bottom:1rem;}
        & .contact{text-align: center;}
    }
}

@keyframes floating-button-intro{
    0%{transform: translateY(0.5em);opacity:0;}
    100%{transform: translateY(0);opacity:1;}
}
@keyframes floating-button-leave{
    0%{transform: translateY(0);opacity:1;}
    100%{transform: translateY(0.5em);opacity:0;display:none;}
}

#floatingBar{
    position: fixed;
    bottom:0;
    right: 0;
    width: 10em;
    z-index:100;
    padding:0.75em;
    display: flex;
    flex-direction:row;
    justify-content: flex-end;
    align-items: flex-end;
    & .floating-button{
        min-width:auto;
        display:block;
        width:2.5em;
        height:2.5em;
        line-height:2.5em;
        background-color: var(--color-number1);
        color: #fff;
        border-radius:50%;
        text-align: center;
    }
    #button-to-top{
        font-size:1em;
        padding:0;
        &.default{display:none;}
        &.active{display:block; animation: floating-button-intro 1s;}
        &.leave{animation:floating-button-leave 1s;animation-fill-mode: forwards;}
    }
    @media screen and (max-width: 480px){
        flex-direction: column;
        padding:0.5em;
        & .floating-button{
            width:3em;
            height:3em;
            line-height:3em;
        }
    }
}

#banner {
    background-attachment:scroll;
    background-color: #272833;
    background-position: center center;
    background-size: cover;
    box-shadow: 0 0.25em 0.5em 0 rgba(0, 0, 0, 0.25);
    min-height:calc(100vw / 4);
    position: relative;
    text-align: center;
    z-index: 1;
    .landing &{
        height:calc(100dvh - 3em);
        /* min-height:calc(100dvh - 3em); */
        /* max-height:calc(100dvh * (2/3)); */
        @media screen and (max-width: 480px){
            max-height:480px;
        }
        & .content{
            display: flex;
            flex-direction: column;
        }
        & header{
            max-width:100%;
            position: relative;
            & p{
                width:25em;
                max-width:100%;
                line-height: 1em;
                margin: 0 0 1em;
            }
        }
        @media screen and (max-width: 480px){
            & .content{
                padding:6em 3em;
            }
        }
    }
    &:after {
        content: '';
        display: block;
        height: 100%;
        left: 0;
        position: absolute;
        top: 0;
        width: 100%;
    }
    & .content {
        display: inline-block;
        margin-right: 1%;
        max-width: 100%;
        width:100%;
        height:100%;
        padding: 6em;
        position: relative;
        text-align: center;
        vertical-align: middle;
        z-index: 1;
        & header {
            display: inline-block;vertical-align: middle;
            & h2{font-size: 2.5em;margin: 0;}
            & p{margin: 0.5em 0 0 0;top: 0;}
        }
        & footer{
            position: absolute;bottom:0;left:0;width:100%;
            & div {
                display: flex;
                flex-direction: row;
                flex-wrap: wrap;
                justify-content: center;
                align-items: center;
                text-align: center;
                width: fit-content;
                margin:0 auto;
                margin-bottom: 1em;
                justify-self: center;
                padding: 1.5em 1.5em;
                border-radius:0.5em;
                background: rgba(50, 62, 72, 0.75);
                & article{
                    width:10em;padding-right:1em;
                    & label{
                        text-transform: uppercase;
                        line-height: 1.5em;
                        margin-bottom: 0.25em;
                        font-size: 1em;
                        font-weight: 500;
                        color: #ffffff;
                    }
                    & input {
                        line-height: 2.5em;
                        height: 2.5em;
                        color: #ffffff;
                        text-align: center;
                        transition: border-color 0.2s ease-in-out;
                        background: transparent;
                        border-radius: 4px;
                        border: solid 1px rgba(255, 255, 255, 0.3);
                        display: block;
                        outline: 0;
                        padding: 0 1em;
                        text-decoration: none;
                        width: 100%;
                    }
                    & button {
                        background:var(--color-number1);
                        padding: 0 1.5em;
                        text-transform: uppercase;
                        line-height: 1em;
                        height: 3.5em;
                        display: inline-block;
                    }
                    &.small{width:8em;padding:0;}
                    /* &:last-child{
                        padding-top:1em;
                        width:100%;
                        & p{
                            color:#fff;
                            margin-bottom:0.5em;
                        }
                    } */
                }
                @media screen and (max-width: 480px){
                    width:calc(100% + 0.75em);
                    padding:1.5em 0.5em;
                    margin-bottom:0;
                    border-radius:0;
                    & article{
                        &.small{padding:0;padding-top: 1em;}
                    }
                }
            }
        }
    }
    body.is-touch & {background-attachment: scroll;}
    @media screen and (max-width: 736px){
        min-height:calc(100vw / 3);
    }
}
#main{
    padding:3em 0 0;
    & header.major{
        width:100%;padding-bottom:2em;text-align: center;
        & h2{margin-bottom:0.5rem;}
        & p{margin-bottom:0;margin-top:2rem;}
    }
}
#intro{
    margin-top:0;
    & header.major{
        padding-bottom:0;
        & h1{font-size:2em;margin-bottom:0.5rem;line-height:1.25em;letter-spacing:-.025em;}
        & h2{font-size:1.35em;margin-bottom:1em;}
    }
}
.banner-card{
    & article {
        position: relative;
        height: 30em;
        display: flex;
        flex-direction: row;
        justify-content: flex-end;
        align-items: center;
        margin-bottom:2rem;
        & picture{
            position: absolute;
            width:calc(100% - 5em);
            height:100%;
            display: block;
            left:0;
            & img{
                z-index: 0;
                width:100%;
                height:100%;
                object-fit: cover;
            }
        }
        & div{
            display: flex;
            flex-direction: column;
            justify-content: center;
            position: relative;
            background-color: var(--color-number2);
            width: 20em;
            min-height:15em;
            padding:2.5em 2em;
            right:0;
            top:0;
            z-index:10;
            & p {
                margin:0;
            }
        }
        .left &{
            justify-content: flex-start;
            & picture{
                right:0;
                left:auto;
            }
        }
        @media screen and (max-width: 736px){
            height:auto;
            flex-direction: column;
            & picture{
                width:100%;
                height:15em;
                position: relative;
            }
            & div{
                width:100%;
            }
        }
    }
}

.pre-footer{
    width:100%;
    padding:1em;
    & ul{
        display:flex;
        flex-direction: row;
        justify-content: center;
        & li{
            margin-right:1.5em;
            &:last-child{
                margin-right:0;
            }
            & a{
                font-size:1.5em;
            }
        }
    }
}

.modal {display: none;}
.modal-background {position: fixed;
    z-index: 12000;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgba(0,0,0,0.3);
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}
.modal-content {
    background-color: #fff;
    border-radius: 0;
    z-index: 12001;
    padding: 2em;
    width: 40em;
    max-width: calc(100% - 3em);
    max-height: calc(100vh - 4em);
    position: relative;
    margin-bottom: 2em;
    transform: translateY(0.75rem);
    transition: opacity 0.25s ease, transform 0.25s ease;
    opacity: 0;
}
.modal-content.loaded {
    transform: translateY(0);
    transition: opacity 0.5s ease, transform 0.5s ease;
    opacity: 1;
}
.modal-content.small {width: 30em;}
.modal-content.large {width: 50em;}
.modal .close {position: absolute;color: #000;font-weight: bold;top: 1.5em;right: 1.5em;cursor: pointer;z-index: 12002;}
.modal h3 {font-size: 1.5em;color: var(--color-rojo);margin: 1.5rem 0;width:100%;text-align: left;text-transform: none;font-weight: 500;}
@media screen and (max-width: 736px) {.modal-content{padding: 1em;}.modal h3 {font-size: 1.2em;}}

#modal-image-gallery .modal-content {padding: 1em;width: auto;}
        #modal-image-gallery img {max-width: 100%;max-height: 100%;margin: 0;}
        #modal-image-gallery .close {color: var(--color-blanco);font-size: 1.5em;top: 1.5em; right: 1.5em;}
        #modal-image-gallery .arrow {font-size: 2em;color: var(--color-blanco);position: absolute;top: calc(50% - 0.5em);cursor: pointer;}
        #modal-image-gallery .arrow.pre {left: 1em;}
        #modal-image-gallery .arrow.next {right: 1em;}