/* css for tablets */
@media (max-width: 768px) {
    .top-bar, .quote-btn{
        display: none;
    }
    .header-container{
        padding: 40px 20px !important;
    }
    #slide-menu .close-btn{
        padding: 10px 140px;
    }

    .policy-content{
        padding: 30px 10px;
    }
    
    .policy-section{
        padding: 20px 10px;
        width: 100%;
    }

    .policy-heading{
        font-size: 24px;
    }
}


/* css for mobiles */
@media only screen and (max-width: 600px){
    h1{
        font-size: 32px;
    }
    h2{
        font-size: 28px;
    }
    .section-txt{
        font-size: 14px;
    }
    .adam-container{
        padding: 60px 20px;
        width: 100%;
    }
    .hero-container{
        padding: 80px 20px;
    }
    .hero-CTA-container{
        flex-direction: column;
        align-items: center;
    }
    .hero-cta{
        width: max-content;
    }
    .colored-card-container{
        margin-top: -20px;
    }
    .color-container{
        padding: 0;
        flex-direction: column;
        gap: 0;
    }
    .colored-card{
        width: 100%;
        position: relative;
    }
    .about-container{
        flex-direction: column-reverse;
    }
    .intro-content, .side-banner-img-container{
        width: 100%;
        padding: 0;
    }
    .intro-content{
        text-align: center;
        align-items: center;
    }
    .services-container{
        gap: 15px;
    }
    .service-card-txt-container{
        display: none;
    }
    .service-card{
        width: 47%;
        padding: 30px 15px;
    }
    .service-card-icon{
        font-size: 30px;
    }
    .service-card-heading{
        font-size: 18px;
    }
    .serve-cta{
        width: 100%;
        font-size: 14px;
    }
    .progress-container{
        text-align: center;
    }
    .stats-container{
        padding: 10px 0;
        flex-wrap: wrap;
        gap: 10px;
        row-gap: 20px;
    }
    .stat-box{
        width: 48%;
        flex-direction: column;
        gap: 5px;
    }
    .stat-number{
        font-size: 24px;
    }
    .stat-txt{
        font-size: 14px;
    }
    .stat-icon{
        font-size: 42px;
    }
    .why-txt{
        width: 100%;
    }
    .fact-card-container{
        flex-direction: column;
    }
    .testimonial-card{
        max-width: 100%;
    }
    .hc-container{
        text-align: center;
    }
    .home-form-container{
        width: 100%;
        text-align: left;
    }
    .flexed-input{
        flex-direction: column;
    }
    .my-label[for="tandc"]{
        font-size: 14px;
    }
    .checked-op{
        gap: 10px;
    }
    .footer-primary-container{
        flex-direction: column;
    }
    .logo{
        width: 190px;
    }
    
    .pg-title-container{
        text-align: center;
    }

    .page-title{
        font-size: 28px;
    }
    .service-cta-card-overlay{
        background-position: -490px -15px;
        width: 100%;
        padding: 30px;
    }
    .service-cta-card-left{
        width: 100%;
    }
    .service-cta-btn{
        width: 100%;
    }
    .service-cta-card-overlay::before{
        opacity: .75;
    }
    .work-tab-container{
        flex-direction: column;
    }
    .work-tab{
        width: 100%;
    }

    .blog-tab-container{
        flex-direction: column;
    }

    .blog-meta{
        padding: 20px;
    }

    .blog-tab{
        width: 100%;
    }

    .policy-content{
        padding: 30px 10px;
    }
    
    .policy-section{
        padding: 20px 10px;
        width: 100%;
    }

    .policy-heading{
        font-size: 24px;
    }

    .contact-main-conatiner{
        flex-direction: column;
        padding: 45px 15px;
    }

    .contact-main-section{
        padding: 0 20px;
    }

    .contact-info-container{
        text-align: center;
        width: 100%;
        padding: 0;
        align-items: center;
    }

    hr.contact-hr{
        width: 100%;
    }

    .icon-box-container{
        flex-direction: column;
    }

    .form-container{
        width: 100%;
        padding: 20px;
    }

    .contact-input-control{
        font-size: 14px !important;
        padding: 15px !important;
        width: 100%;
    }

    .contact-title-container{
        padding: 150px 20px;
    }

    .single-service-title-container, .process-box-container{
        flex-direction: column;
    }
    
    .service-hero-content-container, .service-form-container{
        width: 100%;
    }
    
    .service-form-container{
        padding: 30px 20px;
    }

    .flexed-input{
        gap: 10px;
    }

    .flexed-container, .process-box, .past-work-tab{
        width: 100%;
    }

    .single-service-title-container{
        gap: 20px;
    }

    .sitemap-ur{
        font-size: 12px;
    }




}