/* max-width: 320 sm mobail screen
320px — 480px: Mobile devices.
481px — 768px: iPads, Tablets.
769px — 1024px: Small screens, laptops.
1025px — 1200px: Desktops, large screens.
1201px and more — Extra large screens, TV. */
@media (min-width: 1400px) {

    .container,
    .container-lg,
    .container-md,
    .container-sm,
    .container-xl,
    .container-xxl {
        max-width: 1600px;
    }
}

@media screen and (min-width:1201px) {}


@media screen and (min-width:1025px) and (max-width:1399px) {
    .logo {
        max-width: 200px;
    }
    .nav-item {
        padding-right: 0.5rem;
    }
    .nav-link {
        font-size: 0.8rem;
    }
    .btn_header {
        font-size: 0.8rem;
    }
    .contact_box p,
    .contact_box a {
        font-size: 1rem;
    }
}


@media screen and (min-width:769px) and (max-width:1024px) {
    .logo {
        max-width: 200px;
    }
    .nav-item {
        padding-right: 0.5rem;
    }
    .nav-link {
        font-size: 0.8rem;
    }
    .btn_header {
        font-size: 0.8rem;
    }
    .icon_box h4 {
        font-size: 1.2rem;
    }
}

@media screen and (min-width:821px) and (max-width:912px) {}

@media screen and (min-width:769px) and (max-width:820px) {}

@media screen and (min-width:577px) and (max-width:768px) {
    .hire_card h3 {
        font-size: 2rem;
    }
    .resume_area {
        padding: 100px 0;
    }
    .card_03 {
        padding: 2rem 1rem;
    }
    .copy {
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
        gap: 1rem;
    }
    .footer_menus li {
        padding: 2px 0.5rem;
    }

}


@media screen and (max-width:576px) {
    .hire_card {
        background-position: center center;
    }
    .copy {
        text-align: center;
        font-size: 0.8rem;
        justify-content: center;
        flex-wrap: wrap;
        gap: 1rem;
    }
    .top_heading h1 {
        font-size: 2.5rem;
        font-weight: bold;
    }
    .title {
        font-size: 1.8rem;
    }
    .icon_box h4 {
        font-size: 1.2rem;
    }
    .display-1 {
        font-size: 6rem;
    }
    .logo {
        max-width: 190px;
    }
    .resume_area {
        padding: 100px 0;
        background-position: center;
    }
    .contact_box p,
    .contact_box a {
        font-size: 1rem;
    }
    .top_banner {
        background: linear-gradient(to right, #134a668c, #134a6600), url(../img/banner.jpg);
        background-position: center center;
    }
    .icon_box:hover .icon_bg {
        width: 80px;
    }
    .footer_menus li {
        display: block;
    }
}

@media screen and (max-width:375px) {
    .hire_card {
        padding: 5rem 2rem;
        background: linear-gradient(to bottom, #134a668c, #134a668e), url(../img/card_bg.png);
        background-size: cover;
        background-position: center center;
    }
    .icon_box h4 {
        font-size: 1.1rem;
    }
    .title {
        font-size: 1.5rem;
    }
    .card_03 {
        padding: 2.5rem 1rem;
    }
    .card_btn {
        padding: 5px 19px;
    }
    .contact_box p,
    .contact_box a {
        font-size: 0.8rem;
    }
}