@media (max-width: 1199px){
    .about-banner h1{
        font-size: 52px;
    }
    .main-nav > li{
        margin-right: 0;
    }
    .main-nav > li > a {
        padding: 10px 13px;
    }
    .web-middle-img {
        margin: 15px;
    }
}
@media (min-width: 992px){
    .mob-nav{
        display:none;
    }
    #closeMenu{
        display:none;
    }
}
@media (max-width: 991px){
    .logo-box a img {
        width: 96px;
    }
    #openMenu {
        background-color: transparent;
        border: none;
        margin-top: -9px;
        margin-left: 15px;
    }
    /* Overlay styles */
        #menuOverlay {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(0, 0, 0, 0.5);
            display: none;
            z-index: 999;
        }

        /* Menu styles */
        #mobOpenMenu {
            position: fixed;
            top: 0;
            right: -100%;
            width: 300px;
            height: 100%;
            background: white;
            box-shadow: -2px 0 5px rgba(0, 0, 0, 0.2);
            z-index: 1000;
            display: none;
            overflow-y: auto;
            animation: slidein 0.5s forwards;
        }

        /* Close button styles */
        #closeMenu {
            display: block;
            margin: 10px;
            font-size: 28px;
            background: none;
            border: none;
            cursor: pointer;
            position: absolute;
            right: 0;
            top: 0;
        }

        /* Keyframe animation */
        @keyframes slidein {
            from {
                right: -100%;
            }
            to {
                right: 0;
            }
        }

        @keyframes slideout {
            from {
                right: 0;
            }
            to {
                right: -100%;
            }
        }
    .logo-menu-flex .logo-box{
        display:none;
    }
    .main-nav > li{
        width: 200px;
    }
    .enquiry-btn{
        background-color: var(--theme-color);
        padding: 9px 19px;
        border-radius: 20px;
        text-decoration: none;
        color: var(--color-white);
        font-family: var(--font-man);
        font-size: 15px;
        font-weight: 600;
        margin-top: -10px;
    }
    .mob-nav{
        padding-top: 10px;
        padding-bottom: 8px;
    }
    .logo-menu-flex {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        border-radius:0;
    }
    .main-nav{
        flex-direction: column;
    }
    .banner-heading h1{
        font-size: 48px;
    }
    .banner-heading {
        padding-bottom: 26px;
    }
    .appro-head-flex{
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
        padding-bottom: 14px;
    }
    .catagory-border{
        border-right:none;
    }
    .blog-title-flex{
        justify-content: space-around;
    }
    .ceo-name{
        padding: 15px;
    }
    .ceo-name>h4{
        font-size: 22px;
    }
    /*.client-review-bg.margin{
        margin: 23px auto 0;
    }
    .client-review-bg.margin-top{
        margin: 23px auto 0;
    }*/
    .blog-title{
        font-size: 22px;
    }
    .icon-arrow-right2.big-size::before {
        font-size: 20px;
    }
    .about-description{
        flex-direction: column;
        border-bottom: 0;
    }
    .about-border{
        border-right:none;
    }
    .title-des-flex{
        justify-content: space-between;
    }
    .section-head.abs{
        margin-top: 96px;
    }
    .heading-btn-flex{
        flex-direction: row;
        align-items: center;
        gap: 10px;
    }
    .about-us-btn.blog-btn-width {
        width: 30%;
    }
    .img-lebel{
        left: 6px;
    }
    .testimonial-bg{
        padding-bottom: 25px;
    }
 /*--- about-us ---*/
    .about-us-flex {
        align-items: center;
    }
    .growth-bg{
        padding:20px 0px;
    }
    .pro-level-agency-img-bg{
        height: 471px;
    }
    .agency-title.pad{
        padding: 0px 32px;
        margin: 27px 0px;
    }
    .agency-des{
        padding: 0px 32px;
    }
    .agency-title {
        font-size: 46px;
    }
    .working-img{
        height: auto;
    }
    .working-bg{
        padding: 21px 38px;
    }
    .type-work {
        padding: 6px 0px;
    }
    .type-work>li {
    padding: 6px 0px;
    }
    .type-work>li>a {
        font-size: 21px;
    }
    .agency-title.margin{
        font-size: 36px;
    }
    .work-brand-title>p {
        font-size: 25px;
    }
    .client-logo{
        width: 90%;
    }
    .client-logo-flex{
        padding: 47px 20px;
    }
    .we-are-des>h2{
        font-size: 45px;
    }
    .map {
        margin-top: 20px;
    }
     /*--- service ---*/
    .tech-icon-width {
        width: 33.33333333% !important;
    }
    .ser-margin {
        flex-direction: column-reverse;
    }
    .service-cata-img{
        margin-top: 20px;
    }
    .web-section-title.dm{
        margin-top: 30px;
    }
    /*--- course ---*/
    .course-tab-flex {
        gap: 17px;
    }
    .course-tab-flex>li>a{
        padding: 0px 20px;
    }
    .client-review-bg {
        margin-bottom: 20px;
    }
    .client-review-bg.margin {
        margin: 0px auto 0;
        margin-bottom: 20px;
    }
    .portfolio-popup{
        left: 34%;
    }
    /*------case study ------*/
    
}
@media (min-width: 768px){
    .desktop-box-none{
        display: none;
    }
}
@media (max-width: 767px){
    .banner-head-flex{
        align-items: flex-start;
        flex-direction: column;
    }
    .banner-heading h1{
        font-size: 37px;
    }
    .banner-btn {
        padding: 17px 37px;
        flex-direction: row-reverse;
        gap: 10px;
    }
    .up-arrow{
        margin-bottom: 0;
    }
    .ceo-img-flex{
        flex-direction: column;
    }
    .ceo-rel{
        width: 100%;
        height: 46vh;
    }
    .client-form{
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        width: 100%;
    }
    .client-form form{
        width: 100%;
    }
    .pho-mail-flex{
        gap: 6px;
        flex-direction: column;
        align-items: center;
    }
    .banner-form-head{
        font-size: var(--title);
    }
    .section-head.abs {
        font-size: var(--sub-title);
        margin-top: 80px;
    }
    .img-lebel{
        left: 0px;
    }
    .form-box {
        max-width: 80%;
    }
    .form-box h2{
        font-size: 32px;
    }
    .form-padding {
        padding: 20px 10px;
    }
    .form-box>h5{
        font-size: 19px;
    }
    .form-box h2 {
        display:none;
    }
    .form-box h6{
        font-size: 15px;
    }
    .form-box{
        padding: 18px;
    }
    .banner {
        position: relative;
        padding-top: 55px;
    }
    .banner-heading{
        display:none;
    }
    #openMenu{
        background-color: transparent;
        border: none;
        margin-top: -9px;
    }
    .service-text>h2 {
        font-size: var(--title);
        margin-top: var(--section-ele-padding);
    }
    .service-list{
        display: flex;
        justify-content: space-between;
        overflow-x: auto;
        gap: 15px;
    }
    .service-title {
        font-size: var(--sub-title);
        text-wrap-mode: nowrap;
    }
    .contact-btn{
        justify-content: center;
        margin-top: 15px;
    }
    .testimonial-bg{
        padding-bottom: var(--section-padding);
        margin-top: var(--section-padding);
    }
    .testimonial-btn{
        margin-top: 15px;
    }
    .service-bg {
        padding-top: var(--section-padding);
    }
    .ser-head-padding{
        padding: var(--section-ele-padding);
    }
    .description{
        margin-top: var(--section-ele-padding);
        margin-bottom: 0;
    }
    .learn-btn{
        padding-top: var(--section-ele-padding);
    }
    .learn-btn.pad {
        padding: 0px 32px;
    }
    .ceo-contact>li{
        gap: 5px;
    }
    .ceo-contact a{
        font-size: 14px;
    }
    .our-approach-bg{
        margin-top: var(--section-padding);
    }
    .catagory-list{
        margin-left: 0;
    }
    .catagory-img-padding {
        padding-top: var(--section-ele-padding);
    }
    .catagory-details-padding {
        padding-top: 0;
    }
    .catagory-details {
        margin-top: 0;
    }
    .catagory-text {
        margin-top: var(--section-padding);
    }
    .catagory-text>li p {
        font-size: var(--destription);
    }
    .choose-us-bg {
        padding: 10px 15px;
    }
    .heading p {
        font-size: var(--destription);
        margin-bottom: 26px;
    }
    .about-us{
        margin-top: 0;
        font-size: var(--destription);
    }
    .count-section {
        padding: 25px 3px 0px 3px;
    }
    .title{
        font-size: 50px;
    }
    .count-padding {
        padding: 25px 3px 0px 3px;;
    }
    .blog-bg {
        padding: 20px 15px;
    }
    .heading-btn-flex{
        margin-bottom: var(--section-ele-padding);
    }
    .send-btn{
        padding: 14px 33px;
    }
    .form-bg-padding {
        padding: 0;
    }
    /*--- about-us ---*/
    .about-banner {
        position: relative;
        padding: 70px 0px 0px 0px;
    }
    .about-banner h1 {
        font-size: var(--title);
    }
    .client-logo {
        width: 40%;
    }
    .agency-title {
        font-size: 45px;
    }
    .agency-title.text{
        margin: 6px;
    }
    .get-in-touch-btn-flex{
        margin-top: 20px;
    }
    .plas-img{
        width: 11%;
    }
    .we-are-des>h2{
        font-size: 45px;
    }
    .get-in-touchbg-img {
        width: 34%;
    }
    .we-are-des>h2{
        font-size: 45px;
    }
    .project-no-flex{
        padding: var(--section-ele-padding);
    }
    .project-award-flex {
        justify-content: center;
    }
    .mob-box-none{
        display:none;
    }
    .client-logo-flex.border-left{
        border: 1px solid #1212121A;
    }
    .about-us-flex{
        flex-direction: column;
    }
    .working-bg{
        padding: var(--section-padding);
    }
    .blog-page-title{
        font-size: 30px;
    }
    .icon-arrow-right2.big-size::before {
        font-size: 30px;
    }
    .blog-title {
        font-size: var(--title);
        margin-top: var(--section-ele-padding);
    }
    .ceo-name>h2{
        font-size: var(--title);
    }
    .client-form>h2 {
        font-size: var(--title);
        text-align: center;
    }
    .send-btn-flex{
        display: flex;
        justify-content: center;
    }
    .divider-separator{
        margin: 0px;
    }
    .aboutus-description{
        text-align: center;
        font-size: var(--destription);
        font-weight: var(--sub-title-font-weight);
    }
    .clientcheck-boxbg-overlay{
        margin-bottom: 0px;
    }
    .course-tab-flex>li>a>p{
        margin: 0px;
    }
    .company-check-box-pad{
        margin-top: 0;
    }
    .we-are-des>h2 {
        font-size: var(--sub-title);
        text-align: center;
    }
    .growth-bg {
        padding-top: var(--section-padding);
    }
    .agency-bg {
        margin: 0px 0px;
    }
    .working-field-bg {
        margin: 0px 0px;
    }
    .agency-title {
        font-size: var(--sub-title);
    }
    .agency-des{
        font-size: var(--destription);
        margin-bottom: 35px;
    }
    .agency-title.margin {
        font-size: var(--sub-title);
        text-align: center;
    }
    .type-work>li>a {
        font-size: 18px;
    }
    .work-brand-title>p {
        font-size: 20px;
    }
    .experience-banner{
        margin: 15px auto;
    }
    .company-img-pad {
        padding: 1px;
    }
    .get-in-touchbg-img {
        width: 41%;
    }
    .agency-title-abs.pad {
        padding: var(--section-padding);
    }
    .client-review-bg {
        margin-bottom: 15px;
    }
    .appro-head-flex{
        padding-bottom: 0;
    }
    .about-us.white-col {
        font-size: var(--destription);
        margin-bottom: 22px;
        margin-top: 14px;
    }
    /*--- service ---*/
    .tech-icon-width {
        width: 50% !important;
    }
    .course-tab-flex>li>a>p {
        margin: 0px;
        text-wrap-mode: nowrap;
    }
    .course-tab-flex {
        justify-content: space-between;
        overflow-x: auto;
        gap: 10px;
        height: 90px;
    }
    .blog-banner {
        position: relative;
        padding: 60px 0px 5px 0px;
    }
    .testimonial-page-bg{
        padding: 15px 0px;
    }
    .client-review-bg.margin-top{
        margin-bottom: 15px;
    }
    .web-development-banner{
        padding-top: 50px;
        padding-bottom: 50px;
    }
    .service-page-title>h1 {
        font-size: 25px;
    }
    .service-page-heading p {
        font-size: 16px;
        font-weight: 400;
    }
    .web-section-des {
        font-size: 16px;
        font-weight: 400;
    }
    .web-application-title {
        font-size: 22px !important;
    }
    .service-cata>h2{
        font-size: 22px;
    }
    .service-ul>li{
        font-weight: 400;
        font-size: 16px;
    }
    .ser-margin{
        margin: 0px 0px !important;
    }
    .web-section-title>h2 {
        font-size: 25px;
    }
    .client-review-bg.margin{
        margin: 0px 0px 15px 0px;
    }
    .ser-margin.res{
        flex-direction: column;
    }
    .section-head {
        font-size: var(--title);
    }
    .course-banner h1{
        font-size: 30px;
    }
    .course-banner h2 {
        font-size: 20px;
        font-weight: 600;
    }
    .course-banner p strong{
        font-weight: 600;
    }
    .course-tab-flex>li>a{
        padding: 12px 20px;
    }
    .course-banner{
        padding: 70px 0px 4px 0px;
    }
    .course-tab {
        padding-bottom: 20px;
    }
    .cus-form-control.black{
        padding: 12px 9px;
    }
    .pho-mail-flex.gap{
        gap: 5px;
    }
    .courseform-select{
        padding: 12px 7px; 
    }
    .cus-textarea.black {
        padding: 12px 9px; 
    }
    .send-btn.course-enqu{
        margin-top: 0px;
        padding: 12px 40px;
    }
    .blog-catagory{
        padding: 10px 16px;
    }
    .blog-details-title{
        font-size: 32px;
        margin-top: 0px;
    }
    /*--- contact us ---*/
    .contact{
        margin-top: var(--section-ele-padding);
        font-size: var(--title);
    }
    .contact-details-flex{
        margin-top: var(--section-ele-padding);
    }
    .info>h2{
        font-size: 17px;
        font-weight: 600;
    }
    .info p{
        font-size: 15px;
    }
    .contact-info{
        width: 30px;
        height: 30px;
    }
    /*--- Portfolio pop up ---*/
    .portfolio-popup{
        left: 26%;
        max-width: 179px;
    }
    .portfolio-popup h2{
        font-size: 9px;
    }
    #portfolio-close{
        bottom: 7px;
    }
    .blog-description{
        margin-top: 10px;
    }
    /*--- Course Details ---*/
    .course-details-heading{
        font-size: var(--title);
    }
    .course-heading {
        font-size: var(--title);
        margin-bottom: 13px;
        margin-top: 0;
    }
    .apply-btn{
        width: 40%;
    }
    .course-heading.center {
        margin-bottom: 30px;
    }
    .course-heading.res{
        margin-top: 20px;
        margin-bottom: 20px;
    }
    .apply-btn.flex{
        width: 90%;
    }
    /*--- case-study ---*/
    .case-study-banner{
        padding-top: 65px;
        padding-bottom: 10px;
    }
    .case-study-banner-title>h1{
        font-size: 40px;
        margin-bottom: 22px;
    }
    .case-study-title{
        font-size: 30px;
    }
    .case-title{
        font-size: 30px;
        margin-bottom: 10px;
    }
    .case-study-description-margin{
        margin-bottom: 35px;
        margin-top: 0px;
    }
    .case-study-img{
        object-fit: cover;
        object-position: top;
    }
    .case-studies-card-thumb{
        padding: 165px 0px;
    }
    .case-studies-card-title {
        font-size: 22px;
    }
    .case-studies-card-content{
        padding: 15px;
    }
    .ceo-name{
        bottom: -31px;
    }
    /*--top-website-design-companies-in-kolkata--*/
    .top-website-banner{
        padding-top: 73px;
    }
    .request-form>h2{
        font-size: var(--sub-title);
        margin-bottom: 10px;
    }
    .web-application-title.res{
        margin-top: 2px;
    }
    .sub-page-des{
        font-size: 16px;
        margin: 2px;
    }
    .sub-page-des.res{
        text-align: center;
    }
    .sub-page-com-name{
        font-size: 30px;
    }
    .sub-port-enq-flex{
        font-size: 15px;
        gap: 13px;
    }
    .how-to-explore-company h2{
        font-size: 26px;
        text-align: center;
    }
    .how-to-explore-company h3{
        font-size: 18px;
    }
    .how-to-explore-company .why-choose-des{
        text-align: center;
    }
}
@media (max-width: 650px){
    .client-review {
        margin: -91px auto 0;
    }
    .about-us-btn.about-width {
        width: 50%;
    }
    /*.get-in-touchbg-img {
        width: 38%;
    }*/
    .project-count {
        font-size: 38px;
    }
}
@media (max-width: 600px){
    
}
@media (max-width: 575px){
    .about-us-btn.blog-btn-width{
        width: 50%;
    }
    .service-list>li {
        margin-bottom: 15px;
    }
    .service-list p{
        margin: 0;
    }
    .parallax-write>h2 {
        font-size: 45px;
    }
    .parallax-write p{
        font-size: 16px;
    }
    .footer-logo{
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        margin-bottom: 20px;
    }
    .footer-logo p{
        text-align: center;
    }
    /*--- about-us ---*/
    .client-logo-flex {
        padding: 57px 20px;
    }
    /*.get-in-touchbg-img {
        width: 45%;
    }*/
    .project-award-flex {
        flex-direction: column;
    }
    .project-no-flex {
        padding-left: 28px;
    }
    .project-count-border{
        border: none;
    }
    .client-logo-flex {
        height: 150px;
    }
    .client-logo {
        width: 80%;
    }
    /*--- service ---*/
    .service-page-title span{
        padding: 3px 11px;
    }
    .service-banner-svg>img {
        width: 200px;
        height: 179px;
    }
    .web-middle-img {
        margin: 10px;
    }
    .portfolio-popup {
        left: 34%;
    }
}
@media (max-width: 431px){
    .client-review{
        margin: -31px auto 0;
    }
    .about-us-btn.about-width {
        width: 71%;
    }
    .footer-title {
        text-align: center;
    }
    .footer-quick-link>li{
        display: flex;
        justify-content: center;
    }
    /*.get-in-touchbg-img {
        width: 51%;
    }*/
    /*--- service ---*/
    .portfolio-popup {
        left: 29%;
        max-width: 156px;
    }
    /*----- case study -----*/
}
@media (max-width: 374px){
    .agency-title-abs.pad {
        padding: 19px;
    }
    .service-banner-svg>img {
        width: 170px;
        height: 137px;
    }
}
@media (max-width: 356px){
    .service-title {
        font-size: 27px;
    }
    .service-list p{
        font-size: 20px;
    }
    .get-in-touchbg-img {
        width: 71%;
    }
}