/*=========================================
        LARGE TABLETS
=========================================*/

@media (max-width: 1200px){

    .container{
        width:95%;
    }

    .hero h1{
        font-size:52px;
    }

}

/*=========================================
        TABLETS
=========================================*/

@media (max-width: 992px){

    .hero{
        text-align:center;
        padding:120px 0;
    }

    .hero-buttons{
        justify-content:center;
        flex-wrap:wrap;
    }

    .stats .container,
    .service-grid,
    .why-grid,
    .pricing-grid,
    .testimonial-grid{
        grid-template-columns:repeat(2,1fr);
    }

    .contact-wrapper{
        grid-template-columns:1fr;
    }

    .form-grid{
        grid-template-columns:1fr;
    }

}

/*=========================================
        MOBILE
=========================================*/

@media (max-width:768px){


    .hero h1{
        font-size:38px;
    }

    .section-title h2{
        font-size:32px;
    }

    .process-grid,
    .stats .container,
    .service-grid,
    .why-grid,
    .pricing-grid,
    .testimonial-grid,
    .contact-grid,
    .footer-grid{
        grid-template-columns:1fr;
    }

    .carrier-form form{
        padding:30px;
    }

}

/*=========================================
        SMALL PHONES
=========================================*/

@media (max-width:480px){

    .hero h1{
        font-size:30px;
    }

    .page-banner h1{
        font-size:36px;
    }

    .btn-primary,
    .btn-secondary{
        width:100%;
        display:block;
        text-align:center;
    }

    .hero-buttons{
        flex-direction:column;
    }

    .page-banner{
        height:300px;
    }

}
@media (max-width: 768px) {
    header .btn-primary {
        font-size: 12px;
        padding: 7px 12px;
    }
}