#footer > footer > .text-white > div > div > div .gap-4 {
    flex-wrap: wrap;
    gap: 20px !important;
}

.small-txt {
    font-size: 12px;
}

#nosotros img {
    object-fit: cover !important;
}

button.small-txt {
    padding: 4px 8px;
}

#vacantes .card-body .mt-3:last-child > div  {
    flex-wrap: wrap;
}

.grid {
    display: grid;
    gap: 10px;
}

.two-cols {
    grid-template-columns: repeat(2, 1fr);
}


@media only screen and (max-width: 1280px) {

    #carouselExample img {
        min-height: unset !important;
    }


}

/*home banner*/

 .carousel img {
            top: 0;
            left: 0;
        }

        .carousel-title {
            max-width: 850px;
            font-size: 48px;
            font-weight: bold;
            line-height: 1.2;
        }

        .object-fit-cover {
            object-fit: cover;
        }

        .carousel-img-container {
            width: 100%;
            min-height: 468px;
        }


        .carousel-img-container img {
            width: 100%;
            height: 100%;
        }

        .carousel-img-container:after {
            content: '';
            position: absolute;
            width: 100%;
            height: 100%;
            background-color: black;
            opacity: 0.35;
        }


        .carousel-img-container  .carousel-title {
            z-index: 1;
        }


     .container-title {
            max-width: 1350px;
            width: 100%;
            margin: auto;
            padding: 0 50px;
        }

        .carousel-control-prev {
            justify-content: flex-start;
            padding-left: 50px;
        }


         .carousel-control-next {
            justify-content: flex-end;
            padding-right: 50px;
        }


         @media only screen and (max-width: 1350px) {
            .carousel-control-prev {
              padding-left: 10px;
             }

             .carousel-control-next {
              padding-right: 10px;
             }
        }


        @media only screen and (max-width: 1024px) {

            .container-title {
                padding: unset
            }

            .carousel-title {
                font-size: 35px;
                max-width: 700px;
                padding: 0 50px;
             }
        }

        @media only screen and (max-width: 768px) { 
            .carousel-title {
                text-align: center;
                margin: auto;
            }
        }
            

        @media only screen and (max-width: 767px) {
            .carousel-title {
                font-size: 28px;
                padding: 0 20px;
               
             }

             .carousel-img-container {
                 min-height: 250px;
             }
        }


/*home banner end*/



@media only screen and (max-width: 767px) {
    #footer > footer > .text-white > div > div > div .gap-4 {
        justify-content: center;
    }

    #carouselExample button {
        width: 20px;
    }

    #vacantes img {
        max-height: 150px;
        object-fit: cover;
    }
}