.navbar {
    min-width: 360px;
}

.nav-link,
.dropdown-item {
    color: black;
}

@media (width <= 320px) {
    .navbar-container-hyperlink-img {
        width: 300px;
        height: 60px;
    }

    .offcanvas.offcanvas-end {
        width: 100% !important;
    }
}

@media (321px <= width <= 480px) {
    .navbar-container-hyperlink-img {
        width: 250px;
        height: 60px;
    }

    .offcanvas.offcanvas-end {
        width: 100% !important;
    }
}

@media (481px <= width <= 768px) {
    .navbar-container-hyperlink-img {
        width: 300px;
        height: 60px;
    }
}

@media (769px <= width <= 991px) {
    .navbar-container-hyperlink-img {
        width: 425px;
        height: 100px;
    }

    .navbar-toggler-icon {
        width: 50px;
        height: 50px;
    }

    .offcanvas.offcanvas-end {
        width: 100% !important;
    }

    .offcanvas-title {
        font-size: 2rem;
    }

    .offcanvas-header .btn-close {
        font-size: 2.1rem;
    }

    .offcanvas-header .btn-close,
    .nav-item.dropdown,
    .dropdown-item,
    .nav-link {
        font-size: 1.5rem;
    }
}

@media (992px <= width <= 1200px) {
    .navbar-container-hyperlink-img {
        width: 400px;
        height: 70px;
    }
}

@media (width >= 1201px) {
    .navbar-container-hyperlink-img {
        width: 400px;
        height: 70px;
    }

    .offcanvas-header .btn-close,
    .nav-item.dropdown,
    .dropdown-item,
    .nav-link {
        font-size: 1rem;
    }

    .offcanvas {
        width: 20% !important;
    }
}