@media (max-width: 768px) {
    #header-carousel h1 {
        font-size: 20px !important;
        margin-left: 10px !important;
        margin-right: 10px !important;
    }

    #header-carousel h5 {
        font-size: 12px !important;
        margin-left: 10px !important;
        margin-right: 10px !important;
    }

    #header-carousel img {
        height: 450px;
        object-fit: cover;
    }
}

/* Tablet */
@media (min-width: 769px) and (max-width: 992px) {
    #header-carousel h1 {
        font-size: 28px !important;
        margin-left: 30px !important;
        margin-right: 30px !important;
    }

    #header-carousel h5 {
        font-size: 14px !important;
        margin-left: 30px !important;
        margin-right: 30px !important;
    }

    #header-carousel img {
        height: 400px;
        object-fit: cover;
    }
}

/* Desktop */
@media (min-width: 993px) {
    #header-carousel img {
        height: 650px;
        object-fit: cover;
    }
}

.offcanvas.offcanvas-end {
    width: 75% !important;
    max-width: 400px;
}