@font-face {
    font-family: 'Messapia';
    src: url('../fonts/Messapia-Bold.otf');
}

@font-face {
    font-family: 'Gotham';
    src: url('../fonts/GothamBook.ttf');
}

@font-face {
    font-family: 'GothicA1';
    src: url('../fonts/GothicA1-Regular.ttf');
}

body {
    overflow-X: hidden;
    /* background-image: url('../img/bg.jpg');
    background-repeat: no-repeat; */
    font-family: 'Messapia', sans-serif;
    font-size: 14px;
}

main {
    overflow-x: hidden;
}

.nav-link {
    color: #fff;
    font-weight: bold;
    border-radius: 1.5rem;
}

.nav-link.active,
.nav-item:hover,
.nav-link:hover {
    background-color: #E3A857;
    color: #fff !important;
    border-radius: 1.5rem;
    font-weight: bold;
}

.text-gold {
    color: #E1B05D;
}

.bg-blue {
    background-image: url('../img/bgblue.jpg');
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

@media (max-width: 767px) {
    .carousel-inner-multiple .carousel-item-multiple>div {
        display: none;
    }

    .carousel-inner-multiple .carousel-item-multiple>div:first-child {
        display: block;
    }
}

.carousel-inner-multiple .carousel-item-multiple.active,
.carousel-inner-multiple .carousel-item-next,
.carousel-inner-multiple .carousel-item-prev {
    display: flex;
}

/* medium and up screens */
@media (min-width: 768px) {

    .carousel-inner-multiple .carousel-item-end.active,
    .carousel-inner-multiple .carousel-item-next {
        transform: translateX(25%);
    }

    .carousel-inner-multiple .carousel-item-start.active,
    .carousel-inner-multiple .carousel-item-prev {
        transform: translateX(-25%);
    }
}

.carousel-inner-multiple .carousel-item-end,
.carousel-inner-multiple .carousel-item-start {
    transform: translateX(0);
}

p {
    font-family: 'Gotham', sans-serif;
}

.gotham {
    font-family: 'Gotham', sans-serif !important;
}

.bg-blue1 {
    background: #092844 !important;
}

.bg-blue2 {
    background: #2C3C52 !important;
}

.bg-blue3 {
    background: #7CB0E8 !important;
}

.bg-blue5 {
    background: #A4BCDF !important;
}

.bg-blue6 {
    background: #3A5C9E !important;
}

.bg-gold1 {
    background: #AA874D !important;
}



.bg-image {
    background-image: url('../img/relleno.jpg');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    /* height: 100vh; */
    /* background-size: auto;
    background-position: center;
    background-repeat: no-repeat; */
}


.bg-gold {
    background-color: #AF8542;
}

.bg-blue4 {
    background-color: #001A29;
}

.gotic {
    font-family: 'GothicA1', Courier, monospace;
}

.messapia {
    font-family: 'Messapia', Courier, monospace;
}

.btn-outline-gold {
    --bs-btn-color: #AF8542;
    --bs-btn-border-color: #AF8542;
    --bs-btn-hover-color: #000;
    --bs-btn-hover-bg: #AF8542;
    --bs-btn-hover-border-color: #AF8542;
    --bs-btn-focus-shadow-rgb: 227, 168, 87;
    --bs-btn-active-color: #000;
    --bs-btn-active-bg: #AF8542;
    --bs-btn-active-border-color: #AF8542;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #AF8542;
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: #AF8542;
    --bs-gradient: none
}

.btn-gold {
    --bs-btn-color: #000;
    --bs-btn-bg: #AF8542;
    --bs-btn-border-color: #AF8542;
    --bs-btn-hover-color: #000;
    --bs-btn-hover-bg: #ECC977;
    --bs-btn-hover-border-color: #ECC977;
    --bs-btn-focus-shadow-rgb: 227, 168, 87;
    --bs-btn-active-color: #000;
    --bs-btn-active-bg: #AF8542;
    --bs-btn-active-border-color: #AF8542;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #000;
    --bs-btn-disabled-bg: #AF8542;
    --bs-btn-disabled-border-color: #AF8542;
}

.btn-blue {
    --bs-btn-color: #000;
    --bs-btn-bg: rgb(24, 76, 110);
    --bs-btn-border-color: rgba(24, 76, 110);
    --bs-btn-hover-color: #000;
    --bs-btn-hover-bg: rgba(33, 93, 137, 0.62);
    /* Un tono más claro para hover */
    --bs-btn-hover-border-color: rgba(33, 93, 137, 0.62);
    --bs-btn-focus-shadow-rgb: 33, 93, 137;
    /* RGB para el color hover */
    --bs-btn-active-color: #000;
    --bs-btn-active-bg: rgba(24, 76, 110);
    --bs-btn-active-border-color: rgba(24, 76, 110);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #000;
    --bs-btn-disabled-bg: rgba(24, 76, 110);
    --bs-btn-disabled-border-color: rgba(24, 76, 110);


}

.btn-outline-blue {
    --bs-btn-color: #FFF;
    --bs-btn-border-color:rgba(35, 160, 229, 1);
    --bs-btn-hover-color: #FFF;
    --bs-btn-border-width: 3px; /* Tamaño del borde */
    --bs-btn-hover-bg:rgba(35, 160, 229, 1);
    --bs-btn-hover-border-color:rgba(35, 160, 229, 1);
    --bs-btn-focus-shadow-rgb: 227, 168, 87;
    --bs-btn-active-color: #FFF;
    --bs-btn-active-bg:rgba(35, 160, 229, 1);
    --bs-btn-active-border-color:rgba(35, 160, 229, 1);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color:rgba(35, 160, 229, 1);
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color:rgba(35, 160, 229, 1);
    --bs-gradient: none
}

.text-blue {
    color: #001A29;
}

.bg-amenities {
    background-image: url('../img/amenities.jpg');
    background-size: cover;
    min-height: 100vh;
}

/* FORM */
#listamenities input {
    position: absolute;
}

#listamenities label {
    display: block;
    float: left;
    height: 100vh;
    overflow: hidden;
    background: #30354a;
    text-align: center;
    font-size: 14px;
    line-height: 50px;
    transition: background 300ms ease;
    color: #fff;
    width: 100%;
}

#listamenities label:hover {
    transition-duration: 0s;
}

#listamenities li:nth-child(even)>input+label {
    background: #3a4059;
}

#listamenities label:hover,
#listamenities li:nth-child(even)>input+label:hover {
    /* background: #2196f3;
    color: #fff; */
    cursor: pointer;
}

#listamenities input[type=checkbox]:checked~label {
    background: #2196f3;
    color: #fff;
    width: calc(100% / 14);
}

/* SLIDES */
.accslide {
    display: block;
    height: 100vh;
    width: 0px;
    /* padding: 10px 0; */
    float: left;
    overflow-x: hidden;
    font-size: 12px;
    line-height: 1.5;
    white-space: nowrap;
    transition: all 700ms ease;
    overflow-y: hidden;
}



#listamenities {
    display: flex;
    width: 100%;
    align-items: start;
}

#listamenities li {
    width: calc(100% / 14);
    transition: width 1000ms linear;
    overflow: hidden;
}


#listamenities li .row {
    margin: 0 !important;
}

#listamenities:has(input:checked) li:has(input:not(:checked)) {
    width: 0px;
}

#listamenities li:has(input:checked) {
    width: 100%;
}

#rad1:checked~.accslide {
    width: calc(100% - calc(100% / 14)) !important;
}

#rad2:checked~.accslide {
    width: calc(100% - calc(100% / 14)) !important;
}

#rad3:checked~.accslide {
    width: calc(100% - calc(100% / 14));
}


#rad4:checked~.accslide {
    width: calc(100% - calc(100% / 14));
}


#rad5:checked~.accslide {
    width: calc(100% - calc(100% / 14));
}


#rad6:checked~.accslide {
    width: calc(100% - calc(100% / 14));
}

#rad7:checked~.accslide {
    width: calc(100% - calc(100% / 14));
}

#rad8:checked~.accslide {
    width: calc(100% - calc(100% / 14));
}

#rad9:checked~.accslide {
    width: calc(100% - calc(100% / 14));
}

#rad10:checked~.accslide {
    width: calc(100% - calc(100% / 14));
}

#rad11:checked~.accslide {
    width: calc(100% - calc(100% / 14));
}

#rad12:checked~.accslide {
    width: calc(100% - calc(100% / 14));
}

#rad13:checked~.accslide {
    width: calc(100% - calc(100% / 14));
}

#rad14:checked~.accslide {
    width: calc(100% - calc(100% / 14));
}

.accslide img {
    height: 100%;
    width: 100%;
    object-fit: cover;
    object-position: 50% center;
}



#rad1:checked~#letreroSports,
#rad2:checked~#letreroAreasVerdes,
#rad3:checked~#letreroPrecios,
#rad4:checked~#letreroCreditos,
#rad5:checked~#letreroAmbiente,
#rad6:checked~#letreroPet,
#rad7:checked~#letreroRunning {
    left: 0;
    transition: left 1000ms linear;
    /* transition: right 1000ms linear; */
}

#rad8:checked~#letreroEstacionamiento,
#rad9:checked~#letreroCoworking,
#rad10:checked~#letreroGym,
#rad11:checked~#letreroShops,
#rad12:checked~#letreroPath,
#rad13:checked~#letreroConectividad {
    /* right: calc(100vw - 100%); */
    right: unset;
    left: 0;
    transition: left 1000ms linear;
    /* transition: right 1000ms linear; */
}

#letreroSports,
#letreroAreasVerdes,
#letreroPrecios,
#letreroCreditos,
#letreroAmbiente,
#letreroPet,
#letreroRunning,
#letreroEstacionamiento,
#letreroCoworking,
#letreroGym,
#letreroShops,
#letreroPath,
#letreroConectividad {
    /* display: none !important; */
    opacity: 0;
    height: 0;
    transition: opacity 500ms linear, height 500ms linear;
}

@media (min-width: 768px) {

    #sports:hover,
    #creditosh:hover,
    #sports:has(> input:checked),
    #creditosh:has(> input:checked),
    #estacionamiento:has(> input:checked),
    #path:has(> input:checked) {
        border-left: #7CB0E8 4px solid;
    }

    #estacionamiento:hover,
    #path:hover {
        border-right: #7CB0E8 4px solid;
    }

    #estacionamiento:has(> input:checked),
    #path:has(> input:checked),
    #gym:has(> input:checked),
    #shops:has(> input:checked),
    #coworking:has(> input:checked),
    #conectividad2:has(> input:checked) {
        border-right: 0px;
    }

    #areasverdes:hover,
    #pet:hover,
    #areasverdes:has(> input:checked),
    #pet:has(> input:checked),
    #gym:has(> input:checked) {
        border-left: #AA874D 4px solid;
    }

    #gym:hover {
        border-right: #AA874D 4px solid;
    }

    #precios:hover,
    #runnningtracks:hover,
    #precios:has(> input:checked),
    #runnningtracks:has(> input:checked),
    #shops:has(> input:checked) {
        border-left: #A4BCDF 4px solid;
    }

    #shops:hover {
        border-right: #A4BCDF 4px solid;
    }


    #ambientefam:hover,
    #ambientefam:has(> input:checked),
    #coworking:has(> input:checked),
    #conectividad2:has(> input:checked) {
        border-left: #3A5C9E 4px solid;
    }

    #coworking:hover,
    #conectividad2:hover {
        border-right: #3A5C9E 4px solid;
    }

    /* #labelsports:hover~#letreroSports,
    #rad1:checked~#letreroSports,
    #labelareasverdes:hover~#letreroAreasVerdes,
    #rad2:checked~#letreroAreasVerdes,
    #labelprecios:hover~#letreroPrecios,
    #rad3:checked~#letreroPrecios,
    #labelcreditosh:hover~#letreroCreditos,
    #rad4:checked~#letreroCreditos,
    #labelambientefam:hover~#letreroAmbiente,
    #rad5:checked~#letreroAmbiente,
    #labelpet:hover~#letreroPet,
    #rad6:checked~#letreroPet,
    #labelrunnningtracks:hover~#letreroRunning,
    #rad7:checked~#letreroRunning,
    #labelestacionamiento:hover~#letreroEstacionamiento,
    #rad8:checked~#letreroEstacionamiento,
    #labelcoworking:hover~#letreroCoworking,
    #rad9:checked~#letreroCoworking,
    #labelgym:hover~#letreroGym,
    #rad10:checked~#letreroGym,
    #labelshops:hover~#letreroShops,
    #rad11:checked~#letreroShops,
    #labelpath:hover~#letreroPath,
    #rad12:checked~#letreroPath,
    #labelconectividad2:hover~#letreroConectividad,
    #rad13:checked~#letreroConectividad { */

    #listamenities .btn-check:hover~.translate-middle-y,
    #listamenities .btn-check:checked~.translate-middle-y {
        opacity: 1;
        height: auto;
    }

    #listamenities:has(input:checked) li:has(input:not(:checked) ~ .translate-middle-y) {
        display: none;
    }

    #listamenities:has(input:checked)~#letreroAmenidades {
        /* display: none !important; */
        z-index: -1 !important;
    }

}


@media (max-width: 768px) {
    p {
        font-size: 0.65rem !important;
    }

    #listamenities label {
        padding: 0px;
    }

    .accslide img {
        height: calc((100vh - ((100vh/7)))/3);
    }
}

@media (max-width: 991px) {

    #listamenities li {
        width: 50%;
        height: calc(100vh/7);
    }

    .alt-max {
        height: auto;
    }

    #listamenities label {
        width: 100%;
        height: 100%;
        padding: 1rem;
        float: none !important;
    }

    #listamenities input[type=checkbox]:checked~label {
        width: 100%;
    }

    .accslide {
        float: none !important;
        position: absolute;
        height: 100% !important;

    }

    #rad1:checked~.accslide {
        width: 100% !important;
    }


    #rad2:checked~.accslide {
        width: 100% !important;
    }

    #rad3:checked~.accslide {
        width: 100% !important;
    }


    #rad4:checked~.accslide {
        width: 100% !important;
    }


    #rad5:checked~.accslide {
        width: 100% !important;
    }

    #rad6:checked~.accslide {
        width: 100% !important;
    }

    #rad7:checked~.accslide {
        width: 100% !important;
    }

    #rad8:checked~.accslide {
        width: 100% !important;
    }

    #rad9:checked~.accslide {
        width: 100% !important;
    }

    #rad10:checked~.accslide {
        width: 100% !important;
    }

    #rad11:checked~.accslide {
        width: 100% !important;
    }

    #rad12:checked~.accslide {
        width: 100% !important;
    }

    #rad13:checked~.accslide {
        width: 100% !important;
    }

    #rad14:checked~.accslide {
        width: 100% !important;
    }
}




/* #sports:hover#textAmenities, #creditosh:hover {
    visibility: hidden;
} */


.start-1 {
    left: calc(100% / 14);
}

.start-2 {
    left: calc((100% / 14) * 2);
}

.start-3 {
    left: calc((100% / 14) * 3);
}

.start-4 {
    left: calc((100% / 14) * 4);
}

.start-5 {
    left: calc((100% / 14) * 5);
}

.start-6 {
    left: calc((100% / 14) * 6);
}

.end-1 {
    right: calc((100% / 14) * 6);
    left: calc(((100%/14)*8) - (100%/12));
}

.end-2 {
    right: calc((100% / 14) * 5);
    left: calc(((100%/14)*9) - (100%/12));
}

.end-3 {
    right: calc((100% / 14) * 4);
    left: calc(((100%/14)*10) - (100%/12));
}

.end-4 {
    right: calc((100% / 14) * 3);
    left: calc(((100%/14)*11) - (100%/12));
}

.end-5 {
    right: calc((100% / 14) * 2);
    left: calc(((100%/14)*12) - (100%/12));
}

.end-6 {
    right: calc(100% / 14);
    left: calc(((100%/14)*13) - (100%/12));
}


@media (max-width: 1400px) {
    .end-1 {
        left: calc(((100%/14)*8) - (100%/6));
    }

    .end-2 {
        left: calc(((100%/14)*9) - (100%/6));
    }

    .end-3 {
        left: calc(((100%/14)*10) - (100%/6));
    }

    .end-4 {
        left: calc(((100%/14)*11) - (100%/6));
    }

    .end-5 {
        left: calc(((100%/14)*12) - (100%/6));
    }

    .end-6 {
        left: calc(((100%/14)*13) - (100%/6));
    }
}

@media (min-width: 992px) {
    .alt-max {
        height: 100%;
    }
}


.hovergreen:hover,
.hovergreen.active {
    background-color: #03CD2C;
    color: #fff;
    padding: 0.5rem;
    border-radius: 2rem;
}


.hoverblue:hover,
.hoverblue.active {
    background-color: #01C0DC;
    color: #fff;
    padding: 0.5rem;
    border-radius: 2rem;
}


.hoverred:hover,
.hoverred.active {
    background-color: #FF3B3C;
    color: #fff;
    padding: 0.5rem;
    border-radius: 2rem;
}


.hovergold:hover,
.hovergold.active {
    background-color: #C0863D;
    color: #fff;
    padding: 0.5rem;
    border-radius: 2rem;
}

.text-success {
    color: #03CD2C !important;
}

.bg-success-2 {
    background-color: rgb(2, 153, 32, .5) !important;
}

.bg-success {
    background-color: rgb(3, 205, 44, .75) !important;
}

.bg-primary {
    background-color: #01C0DC;
}

.bg-primary-2 {
    background-color: #126774;
}


.bg-danger {
    background-color: #FF3B3C;
}

.bg-danger-2 {
    background-color: #882323;
}


.bg-warning {
    background-color: #C0863D;
}

.bg-warning-2 {
    background-color: #966f3d;
}

@font-face {
    font-family: 'Nexa';
    src: url(../fonts/NexaRegular.otf) format("opentype");
}

#listConectividad>li>ul li {
    font-family: 'Nexa', Arial, Helvetica, sans-serif;
}

.nexa {
    font-family: 'Nexa', Arial, Helvetica, sans-serif;
}

.fs-7 {
    font-size: 0.75rem;
}

.border-gold {
    border-color: #AA874D;
}

.modal-content {
    /* background-image: url('../img/bgblue.jpg'); */
    background: rgba(16, 60, 89, .62);
}

.start-90 {
    left: 90% !important;
}

.h-60 {
    height: 600px;
}

.h-30 {
    height: 300px;
}

.h-20 {
    height: 250px;
}

@media (min-width: 1400px) {
    .h-20 {
        height: 400px !important;
    }

    .h-5 {
        height: 800px !important;
    }

}

.h-5 {
    height: 500px;
}

.object-position-start {
    object-position: left;
}

@media (max-width: 992px) {
    .h-5 {
        height: 300px !important;
    }

    .translate-middle-y {
        display: none;
    }

    /* .vh-100 {
        height: 75vh !important;
    }

    .min-vh-100 {
        min-height: 75vh !important;
    } */
}

.bg-black-5 {
    background: rgba(0, 0, 0, 0.5);
    /* Black background with 50% opacity */

}

.text-blue {
    color: rgba(20, 59, 86, 1);

}