/* laptop */

@media only screen and (max-width: 1024px) {

    .container{
        padding-inline: 30px;
    }

    .top-header {
        padding: 0px;
    }

    .top-header .main-top-head {
        padding-inline: 20px;
    }


    .header .header-content {
        justify-content: center !important;
        gap: 30px;
    }

    .header .header-content #nav-links .head-menus {
        gap: 30px;
    }

    .banner {
        padding: 100px 0;
    }

    .banner .banner-content .right-banner-content p{
        padding-right: 0px;
    }

    .right-banner-content {
        padding-inline: 0px;
    }

    .about-us-sec {
        padding: 70px 0px;
    }

    .about-us-sec .main-about .about-content {
        width: 51%;
    }

    .about-us-sec .main-about .about-img {
        width: 49%;
    }

    /* #about-third-content {
        display: none;
    } */

    .service-sec .main-service {
        flex-wrap: nowrap;
        padding-inline: 40px;
    }

    .service-sec {
        padding: 70px 0;
    }

    .cta-section {
        padding: 60px 40px;
    }

    .gallery-sec {
        padding: 70px 0px;
    }

    .testimonial-sec {
        padding: 70px 0px;
    }

    .footer-sec .main-footer {
        padding-inline: 40px;
    }

    .footer-copyright {
        padding: 20px 40px;
    }
}


/* tablet  */


@media only screen and (max-width:768px) {

    .container{
        padding-inline: 20px;
    }

    .top-header .main-top-head {
        padding-inline: 20px;

    }

    .top-header .main-top-head .right-content {
        gap: 30px;
    }


    .header .header-content {
        justify-content: space-between !important;
        gap: 0px;
        padding: 10px 20px;
    }

    .header .header-content .logo img {
        max-width: 85px;
    }


    .header-btn {
        display: none;
    }

    .header-main{
        position: relative;
    }
    .nav-links{
        display: none;
    }

    .header-main nav,.header-main .nav-btn{
     display: none;
    }
    #nav-links{
        display: none;
    }

    #nav-toggle-2{
        display: none;
    }

    nav .head-menus a{
        color: black;
    }

    nav .head-menus{
        column-gap: 30px;
        flex-direction: column;
        width: 100%;
        position: absolute;
        right:0;
        top: 80%;
        background-color: #fff;
        padding: 50px 40px;
        z-index: -1;
        text-align: center; 
        /* display: none;      */
    }

    header .bars{
        display: block;
    }

    .banner {
        padding: 80px 0;
    }

    .right-banner-content, .left-banner-content {
       width: 100%;
    }

    .banner .left-banner-content .bnr-img{
      width: 75%;
    }



    .banner .banner-content{
        flex-direction: column;
        justify-content: start !important;
        gap: 30px;
    }

    .banner .banner-content .right-banner-content p{
        padding-right: 150px;
    }

    .about-us-sec {
        padding: 50px 0px;
    }

    .about-us-sec .main-about {
        flex-direction: column;
    }

    .about-us-sec .main-about .about-content {
        width: 100%;
    }

    .about-us-sec .main-about .about-img {
        width: 100%;
        /* margin: auto; */
    }

    .service-sec{
        padding: 50px 0;
    }

    .service-sec .main-service {
        flex-wrap: wrap;
        padding-inline: 20px;
        justify-content: center;
    }

    .service-sec .main-service .service-content {
        max-width: 340px;
    }

    .our-client{
        padding: 50px 0;
    }

    .cta-section {
        padding: 40px 20px;
    }

    .gallery-sec {
        padding: 50px 0;
    }

    .testimonial-sec {
        padding-inline: 20px;
    }

    .owl-theme .owl-nav {
        display: none;
    }

    .owl-theme .owl-dots {
        display: none
    }

    .owl-item active {
        width: 100%;
    }

    .newsletter-sec{
        flex-direction: column;
    }

    .newsletter-sec .newsletter-img {
        width: 100%;
        overflow: hidden;
        height: auto;
    }

    .newsletter-sec .newslatter-content{
        width: 100%;
        padding-block:50px ;
    }

    .newsletter-sec .email-btn {
        margin-right: 20px;
    }

    #counter {
        padding: 0px;
        gap: 20px;
    }

    .exeprience-sec .counter-row .count {
        font-size: 50px;
    }


    .footer-sec .main-footer {
        padding-inline: 20px;
    }

    .footer-copyright {
        padding: 20px 20px;
    }

    .footer-sec .main-footer .footer-icons {
        margin-top: 15px;
    }

}


/* mobile large  */


@media only screen and (min-width:320px) and (max-width:600px) {
    
    .container{
        padding-inline: 15px;
    }

    h1 {
        font-size: 30px;
    }

    h2 {
        font-size: 24px;
        color: #141414;
    }

    h3 {
        font-size: 30px;
    }

    h4 {
        font-size: 20px;
    }

    h5 {
        font-family: times new roman;
        font-size: 18px;
    }

    h6 {
        font-size: 12px;
    }

    p {
        font-family: poppins-regular;
        font-size: 15px !important;
    }

    .primary-btn {
        font-family: times new roman;
        border-radius: 10px;
        border: none;
        font-size: 15px;
        padding: 20px 20px;
    }

    .top-header {
        display: none;
    }

    .header .header-content {
        padding: 10px 15px;
        justify-content: space-between !important;
    }

    .header .header-content .logo img {
        max-width: 80px;
    }

    .right-banner-content {
        text-align: start;
        padding-inline: 0px;
        width: 100%;
    }

    .banner .banner-content .right-banner-content .main-btn{
        gap: 15px;
        justify-content: start;
    }

    .banner .banner-content{
        gap: 20px;
    }

    .banner {
        padding: 40px 0;
        margin-top: 0;
    }

    .banner .banner-content .right-banner-content p {
        padding-inline: 0px;
        margin: 10px 0px 20px 0px;
    }

    .banner .banner-content .main-btn .btn2 {
        font-size: 14px;
    }

    .about-us-sec {
        padding: 30px 0px;
    }

    .about-us-sec .main-about {
        gap: 20px;
        flex-direction: column;
    }


    .about-us-sec .main-about .about-content button {
        margin-top: 10px;
        padding: 20px 20px
    }

    .service-sec {
        padding: 30px 0;
    }

    .service-sec hr, .about-us-sec .main-about .about-content hr, .our-client hr,.gallery-sec .gallery-text hr {
    
        width: 20%;
    }

    .service-sec .main-service {
        padding-inline: 10px;
        margin-top: 20px;
    }

    .service-sec .main-service .service-content {
        max-width: 400px;
    }

    .service-sec .main-service .service-content .service-img img {
        width: 100%;
        max-width: 400px;
    }

    .service-sec .main-service .service-content .ser-info{
        padding: 20px 15px;
    }

    .service-sec .main-service .service-content .ser-info p{
        margin: 10px 0px;
    }

    .our-client{
        padding: 30px 0px;
    }


    .service-sec button{
        padding: 20px 20px;
    }

    .cta-section {
        padding: 30px 10px;
    }

    .cta-content {
        flex-direction: column;
        column-gap: 20px;

    }

    .cta-section .cta-content .cta-text {
        width: 100%;
        text-align: center;
    }

    .cta-section .cta-content .btn {
        font-size: 16px;
        margin-top: 20px;
    }



    .gallery-img {
        gap: 5px;
        grid-auto-rows: 150px;
    }

    .gallery-sec {
        padding: 30px 10px;
    }


    .gallery-sec .gallery-content button{
        padding: 20px 20px;
    }

    #counter{
        flex-direction: column;
    }

    .exeprience-sec .counter-row .count{
        font-size: 45px;
}

    .testimonial-sec {
        padding: 30px 10px;
    }


    .testimonial-sec hr{
        width: 20%;
    }

    .newsletter-sec{
        flex-direction: column;
    }

    .newsletter-sec .newsletter-img{
        width: 100%;
        height: auto;
    }

    .newsletter-sec .email-btn{
        width: 50%;
    }

    .newsletter-sec .newslatter-content{
        width: 100%;
    }

    
    .footer-sec{
        background: linear-gradient(rgba(0, 0, 0, 90% ), rgba(0, 0, 0, 90% ));
    }
   
    .footer-sec .main-footer {
        margin: 0;
        padding: 10px;
        gap: 20px;
    }


    .footer-contact-info, .footer-nav {
        width: 100%;
    }

    .footer-sec .main-footer .footer-logo-text {
        width: 100%;
    }

    .footer-copyright {
        padding: 10px 10px;
    }

    .bottom-footer {
        flex-direction: column;
        text-align: center;
    }

    .left-copyright {
        margin-top: 15px;
    }

}


@media only screen and (min-width:320px) {


    /* h1{
        font-size: 38px;
    } */

    .banner .banner-content .main-btn .btn2{
        padding: 20px 20px;
        font-size: 14px;
    }
}