/* responsive */

@media (max-width: 1176px) {
    label.logo {
        padding: 5px;
    }
}

@media (max-width: 1050px) {
    label.logo {
        padding-left: 30px;
    }

    nav ul li a {
        font-size: 16px;
    }
}

@media (max-width: 986px) {
    label.logo {
        font-size: 20px;
        padding: 0;
    }
}

@media (max-width: 897px) {
    label.logo {
        font-size: 18px;
    }
}

@media (max-width: 890px) {
    .checkbtn {
        display: block;
    }

    label.logo {
        font-size: 22px;
    }

    nav> ul {
        position: absolute;
        width: 110%;
        height: 100vh;
        background: #2c3e50;
        top: 80px;
        left: -110%;
        text-align: center;
        transition: all 0.5s;
    }

    nav ul li {
        display: block;
        margin: 50px 0;
        line-height: 30px;
    }

    nav ul li a {
        font-size: 20px;
    }

    nav ul li a:hover,
    nav ul li a.active {
        background: none;
        color: #0082e6;
    }

    #check:checked ~ ul {
        left: 0;
    }

    .facilities>ul {
        display: block;
    }

    .hero-section {
        min-height: 110vh;
    }
}

@media (max-width: 770px) {
    .card-list {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
    }
}

@media(max-width: 767px) {
  .footer-col{
        width: 50%;
        margin-bottom: 30px;
    }
}

@media(max-width: 574px) {
    .footer-col{
        width: 100%;
    }
}

@media (max-width: 530px) {
    .heading {
        font-size: 20px;
        text-align: center;
        margin-top: 50px;
    }
}

@media (max-width: 450px) {
    .card-list {
        display: grid;
        grid-template-columns: 1fr;
        gap: 20px;
    }
}

@media (max-width: 435px) {
    .table-container > #old_new_table{
        width: 20%;
    }
}

@media (max-width: 420px) {
    label.logo {
        font-size: 20px;
        padding-left: 20px;
    }
}

@media (max-width: 390px) {
    label.logo {
        font-size: 18px;
        padding-left: 5px;
    }
}

@media (max-width: 355px) {
    label.logo {
        font-size: 16px;
        padding-left: 0px;
    }
}

@media (max-width: 326px) {
    label.logo {
        font-size: 14px;
        padding-left: 0px;
    }
}