.carousel-control-next, .carousel-control-prev {
    z-index: 10;
    width: 10%;
}

.carousel-control-next-icon, .carousel-control-prev-icon {
    background: black;
    width: 50px;
    height: 50px;
    border-radius: 65px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.carousel {
    width: 100%;
}
.carousel-item {
    position: relative;
    display: none;
    float: left;
    width: 100%;
    margin-right: -100%;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    transition: transform .6s ease-in-out;
}
.carousel-item.banner {
    height: 45vh;
    /*max-height: 30vh;*/
}
    .carousel-item img {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover;
    }

    .carousel-item .container-text-float {
        position: absolute;
        left: 0;
        top: 50%;
        color: #000000;
        text-align: center;
        min-height: 30%;
        padding: 20px;
        width: 50%;/*La mitad del max-width permitido*/
        height: 100vh;
        display: flex;
        transform: translateY(-50%);
        justify-content: center;
        align-items: center;
        flex-direction: column;
        padding-top: 40px;
        background-color: rgba(255,255,255,0.5);
    }
        /*.carousel-item .container-text-float .container-text-float {
    display: flex;
    position: absolute;
    top: 0;
    width: 50vw;
    height: 60vh;
    background: rgba(255, 255, 255, .8);
    z-index: 9;
    color: #000000;
}*/

        /*    .carousel-item .container-text-float .richText {
        display: flex;
        margin: 0px 100px;
        width: 50vw;
        height: 60vh;
        justify-content: center;
        align-items: center;
        color: #000000;
        padding: 0px 150px;
        background-color: #ffffff
    }*/
        .carousel-item .container-text-float .richText {
            width: 80%;
            text-align: left;
        }

    .carousel-item .container-button {
        width: 60%;
        display: flex;
        flex-wrap: wrap;
        justify-content: left;
        gap: 25px;
        align-items: center;
        margin: 10px 0 10px 0px;
    }

        .carousel-item .container-button .button-simple-umb {
            padding: 5px 10px 5px 10px;
            display: -webkit-inline-box;
            justify-content: center;
            align-items: center;
            height: auto !important;
            -webkit-box-align: center;
            margin: 10px 0px;
            width: 100%;
            color: #FCFCFC;
            background: var(--green);
            box-shadow: 0px 8px 8px rgba(0, 0, 0, .4);
            border-radius: 10px;
            border: 1px solid var(--green);
            display: flex;
            font-weight: normal;
        }
            .carousel-item .container-button .button-simple-umb:hover {
                background: var(--green-10);
                border-color: var(--primary-100);
                color: var(--primary-100);
            }
            .carousel-item .container-button .button-simple-umb:active {
                background: var(--primary-100);
                border-color: var(--primary-100);
                color: var(--green-10);
            }

.carousel-inner {
    position: relative;
    width: 100%;
    max-width: 1980px;
    height: auto;
    overflow: hidden;
}
@media (max-width: 480px) {
    /* Ajustes específicos para pantallas más grandes */
    .fa-2xl {
        font-size: 1em;
    }
    .carousel-control-next-icon, .carousel-control-prev-icon {
        width: 30px !important;
        height: 30px !important;
    }
}

@media (min-width: 768px) {
    /* Ajustes específicos para pantallas más grandes */
    .carousel-item .container-text-float .richText {
        width: 70%;
    }
}
@media (max-width: 768px) {
    /* Cambios en el diseño para tabletas */
    .carousel-item .container-button {
        width: 100%;
    }
    .carousel-item .container-text-float {
        width: 100% !important;
    }


@media (min-width: 992px) {
    /* Estilo para pantallas grandes */
    .carousel-item .container-text-float .richText {
        width: 60%;
    }
}
@media (max-width: 992px) {
    /* Estilo para pantallas grandes */
    .richText p {
        font-size: 14px !important;
    }

    .richText h1 {
        font-size: 22px !important;
    }
}

@media (max-width: 1024px) {

}

@media (min-width: 1600px) {
    /* Ajustes para pantallas 4K o ultra grandes */
}
