/* Extra small devices (phones, less than 576px) */
@media (max-width: 575.98px) {

    .timing-table table,
    .timing-table thead,
    .timing-table tbody,
    .timing-table th,
    .timing-table td,
    .timing-table tr {
        display: block;
    }

    .timing-table thead {
        display: none;
    }

    .timing-table td {
        position: relative;
        padding-right: 50%;
        text-align: left;
        border-top: none;
    }

    .timing-table td::before {
        content: attr(data-label);
        position: absolute;
        right: 16px;
        font-weight: bold;
    }

    .title h2 {
        white-space: break-spaces;
    }

    header .navbar .location-btn {
        margin-right: auto !important;
        margin-left: 0 !important;
    }

    .call-btn {
        bottom: calc(10% - 10px);
    }

    .scroll-to-top {
        bottom: calc(10% - 10px);
    }

    .navbar .logo {
        height: calc(40px + 35 * (100vw - 320px) / 1600);
    }

    .short-header .logo {
        height: calc(40px + 35 * (100vw - 320px) / 1600);
    }

    .shorter-head-section {
        padding: calc(30px + 50 * (100vw - 320px) / 1600) 0 calc(30px + 20 * (100vw - 320px) / 1600);
    }
}

/* Small devices (phones landscape, ≥576px and <768px) */
@media (min-width: 576px) and (max-width: 767.98px) {
    header .navbar .location-btn {
        margin-right: auto !important;
        margin-left: 0 !important;
    }

    .title h2 {
        white-space: break-spaces;
    }

    .call-btn {
        bottom: calc(10% - 10px);
    }

    .scroll-to-top {
        bottom: calc(10% - 10px);
    }

    .navbar .logo {
        height: calc(40px + 35 * (100vw - 320px) / 1600);
    }

    .short-header .logo {
        height: calc(40px + 35 * (100vw - 320px) / 1600);
    }

    .shorter-head-section {
        padding: calc(30px + 50 * (100vw - 320px) / 1600) 0 calc(30px + 20 * (100vw - 320px) / 1600);
    }
}

/* Medium devices (tablets, ≥768px and <992px) */
@media (min-width: 768px) and (max-width: 991.98px) {
    /* Your CSS here */
}

/* Large devices (desktops, ≥992px and <1200px) */
@media (min-width: 992px) and (max-width: 1199.98px) {
    .about-us-section {
        margin-left: 30px;
    }
}

/* Extra large devices (large desktops, ≥1200px) */
@media (min-width: 1200px) {
    .about-us-section {
        margin-left: 30px;
    }
}