@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199.98px) {}

@media (max-width: 1100px) {
  .banner-services{background-size: 75%;}
  .banner-hero h1 {font-size: 5rem !important;}
  .big-h3 {font-size:  $basefont-size *2.25;}
  .service{
    &__sidebar{
      .heading{ padding-right: 100px;}
    }
    &__wrapper-item{
      h5{font-size: 2.75rem !important;}
    }
  }
  .client_logo{
    ul.col8{width: auto !important;}
  }
  .reviewsection {
    .client_logo{ padding: 0;}
  }
  .gutter {padding: 0 4rem !important; }
  .testimonial_review{
    .reviewslide{ width:90%; padding: 0; }
    .reviewslide__content{padding:0 0 50px 300px;min-height: auto;}
  } 
  .reviewsection{
    h2 {font-size: 3rem !important; }
    .why-item .big{font-size: 3.5rem;}
  } 
  .industries{
    .grid{
      figure figcaption h2{ min-height: 55px;}
      .swiper-industries{ padding-bottom: 40px !important;
        .swiper-pagination {bottom: 5px; }
      }
    }
  }
  .t-burger{ padding-top: 5rem!important;}
  .b-burger{ padding-bottom: 5rem!important;}
  .burger{ padding: 5rem 0!important;}
  .g-review{ padding-right:20px }
  .imenso_rating .footercreds {display: block;}
  .banner1{ height:auto }
  .big-h1 {font-size: 3rem; }
  .para3{ padding-right:0 }
  .lined::after {left: 20% !important; }
  .css-case{
    .techicons li{ margin: .5rem 0;max-width:none; width: 100%;
        a {min-width: 120px;
        .ti-image{ margin-right: 5px;}
        &:after{width: 10px; right: -20px;}
      }
    }
    .tip-title {margin-left: 30px;}
   }
}

@media (min-width: 991.98px) {
  /*.industries{
    .grid{ padding-bottom: 0 !important;
      figure{ margin-bottom:0 }
      .swiper-industries{ padding-bottom: 0px !important;
        .swiper-pagination{ display:none !important }
      }
    }
  }*/
}

@media (max-width: 991.98px) {
  .blog-details{
    .blog__body h1{ font-size: 2.5rem !important;}
  }
  .bigger-h1 {font-size: 3.5rem;}
  .industries{
    .swiper-button-next, .swiper-button-prev{ display:none }
  }
  .navbar-nav{ display: block; padding-bottom: 1rem;
    .nav-link{ padding-left: 0 !important }
  }
  .navbar.fixed-top .dropdown .dropdown-toggle:after{ right: 17px;}
  .navbar{ height:auto; padding:10px 0; background-color:transparent;
    &:after{ content: ''; position: absolute; left: 0; top: 0; background: #fff; width: 100%; height: 60px; z-index: -1; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);}
    &.fixed-top {height: auto; padding:6px 0 2px; background-color:transparent;
      .navbar-brand img{ width: 110px;}
      .navbar-toggler-icon{ width: 1em; height: 1em;}
    }
    .navbar-collapse{height: calc(100vh - 40px); overflow: auto; margin-left: -15px; padding-left: 15px; background: #fff; position: relative; transition: 0.1s all !important; width: 100%;  left:calc(-100% - 15px);}
    .dropdown-menu, .megamenu{ position:relative !important }
    .megamenu{
      .dropdown-menu{ top:0 !important; display:none !important; padding: 0 !important;
        .header-links{ margin:10px 0 20px }
      }
      &:hover{
        .dropdown-menu{display: inline-block !important;}
      }
    }
    .ms-4{ margin-left:0px !important; margin-top: 20px; }
  }
  .banner-hero h1 {font-size: 4.5rem !important;}
  .project__item-brief{ display:block; margin-top: 20px;
    p{ margin-right: 0; width: auto; margin-bottom: 0px}
  }
  .help{
    .btns .btn{ margin:10px }
  }
  .big-h3 {font-size: 2rem; }
  .projects, .section-header{
    .heading, h2{font-size: $basefont-size * 2 !important;}
  }
  .mt-5{ margin-top: 2rem!important;}
  .mb-5{ margin-bottom: 2rem!important;}
  .t-burger{ padding-top: 4rem!important;}
  .b-burger{ padding-bottom: 4rem!important;}
  .burger{ padding: 4rem 0!important;}
  .service__wrapper-item h5{font-size: 2.5rem !important;}
  .imenso_rating .brand-logo{ margin-bottom:12px }
  .collapse{
    &:not(.show) {}
    &.show{ left:0 }
  }
  .banner__clients-logos{
    img{ max-width: 100px !important;}
  }
  .big-h1 {font-size: 2.75rem; }
  .lined::after {left: 23% !important; display:none }
  .lined .sidebar, .estimate_section .sidebar{ position:relative; top:0; padding-bottom: 20px; }
  .big-light{font-size: 2.25rem !important;}
  .why-item .big { font-size: 3rem !important;}
  .banner{min-height: auto !important;
    h2 {font-size: $basefont-size * 4; }
    &__clients-logos{
      img{  width: 80px !important; padding: 10px 10px;}
    }
    .form-inline{max-width: 600px;}
  }
  .img-text-sml {font-size: $basefont-size * 3.5;}
  .lining .shade {padding-left: 50px;
    &:before {left: 0; width: 40px; }
    &.no-line{ padding-left: 0px; }
  }
  .big-h2{ font-size: 2.5rem;}
  .common-card{ padding:30px }
  .line2 { top:0}
  .top{
    .blog__category{ top: 60px !important;}
  }
  .blog__search{width: 80% !important;}
  .gutter {padding: 0 2rem !important; }
  .achieved-section{ background-image:none !important }
  .inner-hero{
    .case-points{display: inline-block; margin-right: 20px;
      ul{ margin-bottom:0 }
    }
  }
  .css-case{
    .tip-title { display: block; word-break: break-all;}
   }
}

@media (min-width: 768px) and (max-width: 991.98px) {}
@media (min-width: 320px) and (max-width: 767.98px) {}

@media (min-width: 767.98px) {
  .bannermobile-show{ display:none }
}

@media (max-width: 767.98px) {
  ul.timeline{
    &:before{ height: auto; top: 7px; bottom: 6px;}
    > li {padding-left: 55px;}
  }
  .inner-hero h1 {
      font-size: 2.75rem;
  }
  .icon-box{ padding:30px 0;}
  .feature-tabs{
    .mt-4{ margin-top:10px !important }
    img{ margin-bottom:20px }
  }
  .inner-hero{ height:auto;

  }
  .banner1{ padding: 5rem 0;
    &.banner-services{background-position: center top; background-size: 100% auto !important; }
    &.banner-technology{background: none !important; }
  }
.blog__Table-cnt{
  #mainNav{ display:none}
}
  .blog-details{
    .blog__body h1{ font-size: 2rem !important;}
  }
  .top{
    .blog__category{ position: fixed !important; top: calc(100% - 15px) !important; z-index: 111; box-shadow: 0 0 10px 0px rgba(0,0,0,.2); padding: 15px 0 5px !important; transition: .5s ease all;
      ul li{margin: 3px;
        a {font-size: 11px !important; padding: 3px 10px !important; }
      }
      &:after{ content:'Blog Category'; position: absolute; left: 50%; top: -10px; border-radius: 20px; border: 1px solid; background-color: $white; font-size: 12px; line-height: 100%; padding: 3px 10px !important; transform: translateX(-50%);}
      &:hover{top:auto !important; bottom: 0px !important;}
    }
  }
  .bigger-h1 {font-size: 3rem;}
  .sml-part{ padding-left: 40px;}
  .zebra{
    &:before{width: 50px;}
    &:after{margin-left: 25px;}
  }
  .banner-hero{ height: auto !important; padding: 70px 0;
    .banner-hero h1 {font-size: 4rem !important;}
  }
  .project{display: block;
    &__item{max-width: 100%; margin-bottom: 50px}
  }
  .testimonial_review.t-burger{ padding-top: 0 !important;
    .reviewslide{ width:100%;}
  }
  .reviewsection{
    .w-50 {width: 100% !important; }
  }
  .gutter {padding: 0 2rem !important; }
  .imenso_rating{
    .footercreds{ justify-content: flex-start; margin-top: 10px; display: block;}
  }
  .service{
    &__sidebar{position: relative !important; top: 0 !important; position: relative !important; position: relative !important; position: relative !important; position: relative !important; margin-bottom: 0px;
      .heading{    padding-right: 0 !important ;}
    }
    &:after{ width: 100% !important; }
    &__wrapper-item{ margin-bottom:50px !important;
      &:first-child{ margin-top: 0px !important;}
    }
  }
  .project{
    &__item{
      a{ display:block }
    }
    &__item{
      img{ width:100% }
    }
  }
  .big-h3 {font-size: 1.5rem; }
  .projects{
    .heading{font-size: $basefont-size * 1.75 !important;}
  }
  .mt-5{ margin-top: 1.5rem !important;}
  .mb-5{ margin-bottom: 1.5rem !important;}
  .t-burger{ padding-top: 3rem !important;}
  .b-burger{ padding-bottom: 3rem;}
  .burger{ padding: 3rem 0;}
  ul, ol{ margin-left:0; padding-left:0 }
  .testimonial_review{
    .reviewslide{ display:block; width: 90% !important; padding-bottom: 20px;
      &__authorimg{ position: relative; width: 150px; height: 150px; border-radius: 100%; overflow: hidden; margin: 0 auto 20px; background: #fedc86;
        &:before{ display:none}
      }
      &__content{ padding:0;text-align: center;
        .blockquote{ position:relative; font-size: $basefont-size * 1;}
        &-author{font-size: $basefont-size * 1;}
      }
    }
  }
  .footer{
    .col-xs-4{ flex: 0 0 auto; width: 33.33%;}
    .col-xs-6{ flex: 0 0 auto; width: 50%;}
  }
  .blog{
    .blog__img{
      img{ width:100% }
      &:after{padding-bottom: 62.67%;}
      &.col2:after{padding-bottom: 62.67%;}
    }
  }
  .service__wrapper-item h5{font-size: 2.5rem !important;}
  .service__sidebar{ padding-bottom: 20px !important;}
  .service__wrapper-item{ margin-bottom:40px !important }
  .reviewsection .why-item .big{ font-size: 3rem !important;}
  .reviewsection .why-item p{ margin-top:0 !important; }
  .industries .grid{ padding-bottom:0;
    figure{ margin-bottom:0}
  }
  .footer{
    &.py-5{padding-top: 0rem!important; padding-bottom: 1.5rem!important;}
    .copyright{ padding-top: 1.5rem!important;}
  }
  .reviewsection {
    .text-center {text-align: left !important; }
    .my-5 {margin-top: 1.5rem!important; margin-bottom: 1.5rem!important; }
  }
  .imenso_rating .footercreds{
    a{margin: 0 10px 0px 0; display: inline-block; width: 70px; height: 70px; text-align: center; position: relative;
      img{width: 90%; height: auto; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%)}
    }
  }
  .imenso_rating{
    &.border-bottom{ border-bottom:0 !important }
    .py-5 {padding-top: 1.5rem!important; padding-bottom: 0rem!important; }
  }
  .service__wrapper-item ul{ margin-top:10px !important }
  .big-h1 {font-size: 2.5rem; }
  .project__item{ padding-right: 0px; padding-left: 0px;}
  .big-light{font-size: 2rem !important;}
  .why-item .big { font-size: 2.5rem !important;}
  .banner{
    &__clients-logos{
      img{ min-width: 80px !important;}
    }
    .form-inline{max-width: 500px;}
    h2 {font-size: $basefont-size * 3; }
    .gutter {padding: 0 !important; }
  }
  .big-h2{ font-size: 2rem;}
  .banner-services{
    .mt-5{ margin-top:0 !important; }
    .mt-4{ margin-top:0 !important; }
  }
  .common-card{ padding:20px }
  .inner-banner{ padding: 100px 0 50px !important}
}

@media (max-width: 575.98px) { 
  .footer__links i{ margin-right:0 }
  .icon-box {padding: 10px 0;
    .mt-4 {margin-top: 0.75rem!important; }
  }
  .big-points li{ font-size: 1rem;
    i{ font-size: 1.25rem;}
  }
  .big-text{ font-size:1.25rem }
  .inner-hero{ margin-top: 30px;
    h1 {font-size: 2rem; }
  } 
  .pay-features{
    .col-6{ width:100% !important }
  }
  .service-block{
    .ps-5{ padding-left:0rem !important }
  }
  .banner1{ 
    &.banner-services{ background-position: center bottom;}
  }
  .blog-details{
    .blog__body h1{ font-size: 1.5rem !important;}
  }
  .inner-banner.t-burger { padding: 80px 0 50px !important}
  .blog__search{width: 100% !important;}
  .bigger-h1 {font-size: 2.5rem;}
  .commoncard{ padding: 30px; border-radius: 10px;
    &__image{ margin:auto; }
    h3{ text-align:center; min-height:auto !important }
  }
  .bulletpoint__item, .common-card{ border-radius: 10px;}
  p{ font-size:1rem }
  .big-h2 {font-size: 1.5rem; }
  .btn-primary{padding: 10px 25px;}
  .bordercard .icn{ margin:0 } 
  .col-lg-9{
    .container-fluid{ margin:0; padding:0 15px;
      .col-sm-10{ padding:0 }
    }
  }
  .service-block{
    .col-sm-2{ position:relative; margin-bottom: 20px; background-size: 100% auto !important;
      &:after{ content:''; position:relative; padding-bottom:75%; display:block }
    }
  }
.banner-services .btn{ width:100% !important}
  .zebra{
    &:before, &:after{display: none}
  }
  .banner-hero h1 {font-size: 3.5rem !important;}
  .big-h3 {font-size: 1.25rem; }
  .projects, .section-header{
    .heading, h2{font-size: $basefont-size * 1.5 !important;}
  }
  .t-burger{ padding-top: 2rem !important;}
  .b-burger{ padding-bottom: 2rem !important;}
  .burger{ padding: 2rem 0 !important;}
  .project__item-brief h3 {font-size: 1.25rem;}
  .mobile-hide{ display:none !important }
  .footer{
    .col-xs-4, .col-xs-6{ flex: 0 0 auto; width: 100%;}
  }
  .footer__blur-heading { border-bottom:1px solid #ddd; display:block; }
  .mobile-show{
    .footer__links{
      li{ display:inline-block; margin-right:10px;
        a{ padding:5px 10px; display: block; border:1px solid #ddd; border-radius: 20px}
      }
    }
  }
  .service__wrapper-item{
    h5{font-size: 1.5rem !important;}
    p{ margin-top:0 !important }
  }
  .blog{ margin: 10px 0;
    &__body{ padding: 15px !important;}
  }
  .projects .heading{ margin-bottom: 0}
  .project__item{ margin-bottom: 30px; margin-top: 10px;}
  .reviewsection .why-item .big{ font-size: 2rem !important;}
  .testimonial_review .reviewslide__authorimg{  width: 100px; height: 100px;}
  .industries .grid figure figcaption h2{min-height: auto !important;}
  .service__wrapper-item{
    .btn-bordered.mt-4{ margin-top: 0.5rem !important;}
  }
  .techstack{
    .mb-4 { margin-bottom:1rem!important }
  }
  .big-h1 {font-size: 2.25rem; }
  .big-light{font-size: 1.5rem !important;}
  .why-item .big { font-size: 2rem !important;}
  .banner{
    &.burger{ padding-top:100px }
    .form-inline{ max-width:100% }
  }
  .sml-part {padding-left: 00px !important; }
  .p-line:after{height: 100%; width: 1px;left: 52px; }
  .approach-cnt{ display:block; position: relative; margin-bottom: 20px;
    div[role="progressbar"]{ position:absolute; left: 0}
    .media-heading{ margin:0 }
    .media-heading, p{ position:relative; margin-left:100px }
  }
  .big-p {font-size: 1rem;}
  .why-item{
    .big{ line-height:100%; padding-bottom:5px }
    p{ margin-top:0 }
    .title{ margin-top:10px }
  }
  .banner .btn-primary{ padding: 15px 20px; font-size: .6rem;}
}

@media (min-width: 575.98px) {  
  .mobile-show{ display:none; }
}

@media (max-width: 420px) { 
  .bigger-h1 {font-size: $basefont-size * 2;}
  .commoncard{ padding: 20px;}
  .big-h1 {font-size: 1.75rem; } 
  .banner-hero{
    h1 {font-size: 3rem !important; width: 90%;}
  }
  .line2{ left:40% !important; width: 100%; top:0 !important; }
  .line1{ right: 20% !important; width: 100%; bottom: 0 !important;}
  .banner__developertech{ margin-top:40px }
  .service__wrapper-item h5{font-size: 1.5rem !important;}
  .techicons li{ width: calc(50% - 12px); margin: 5px;
    a{min-width: 100%}
  }
  .banner{
    .gutter {padding: 0px !important; }
    h2 {font-size: $basefont-size * 2.4; }
    &.burger{ padding-top:100px }
    .form-inline{ max-width:100% }
  }
}