@media screen and (min-width: 576px) {
  .maplayout ul li[data-title="Punjab"] {
    left: 69.5%;
    top: 27%;
  }

  .maplayout ul li[data-title="Delhi"] {
    left: 70%;
    top: 29%;
  }

  .maplayout ul li[data-title="Tamil Nadu"] {
    left: 70%;
    top: 41%;
  }

  .maplayout ul li[data-title="Assam"] {
    left: 74.1%;
    top: 29%;
  }

  .maplayout ul li[data-title="West bengal"] {
    left: 72.5%;
    top: 31%;
  }

  .maplayout ul li[data-title="Bangladesh"] {
    left: 73.2%;
    top: 30%;
  }

  .maplayout ul li[data-title="United States"] {
    left: 20%;
    top: 22%;
  }
}

@media screen and (min-width: 768px) {
  .svg-container {
    display: none;
  }

  .enquire-form {
    min-width: 650px;
    max-width: 650px;
  }

  .jobmodal {
    min-width: 650px;
  }

  .main-navigation li:hover>ul.sub-menu {
    opacity: 1;
    visibility: visible;
  }

  .maplayout ul li[data-title="Punjab"] {
    left: 69.5%;
    top: 30%;
  }

  .maplayout ul li[data-title="Delhi"] {
    left: 70%;
    top: 31%;
  }

  .maplayout ul li[data-title="Tamil Nadu"] {
    left: 70.3%;
    top: 43%;
  }

  .maplayout ul li[data-title="Assam"] {
    left: 74.2%;
    top: 31%;
  }

  .maplayout ul li[data-title="West bengal"] {
    left: 72.5%;
    top: 34%;
  }

  .maplayout ul li[data-title="Bangladesh"] {
    left: 73.2%;
    top: 33%;
  }

  .maplayout ul li[data-title="United States"] {
    left: 20%;
    top: 25%;
  }
  .floating-btn-right-sec {
    width: 42px;
    right: 0;
    top: 50%;
  }
  .floating-btn-right-sec a {
    height: 42px;
    width:160px;
    right: 0;
    font-size: 0.875rem;
  }
  .floating-btn-right-sec a:hover {
    right: 118px;
  }
}

@media screen and (min-width: 992px) {
  .main-banner .slider-widget {
    position: absolute;
    height: 100%;
    top: 0;
    background-color: var(--primary-color);
    overflow: hidden;
  }

  .main-banner .slider-widget .slider-widget-inner {
    position: relative;
    width: 100%;
    height: 100%;
  }

  .main-banner .slideshow {
    width: 100%;
    position: absolute;
    height: 100%;
  }

  .main-banner .slideshow .home-slider,
  .main-banner .slideshow .home-slider .slick-list,
  .main-banner .slideshow .home-slider .slick-list .slick-track,
  .main-banner .slideshow .home-slider .slick-list .slick-track .item {
    width: 100%;
    height: 100%;
  }

  .item-m6-l4:not(:nth-child(-n + 3)),
  .item-l6:not(:nth-child(-n + 2)) {
    margin-top: 30px;
  }

  .enquire-form {
    min-width: 800px;
    max-width: 800px;
  }

  .main-navigation ul.sub-menu {
    position: absolute;
    top: 100%;
    background-color: #d8edf3;
    min-width: 200px;
    opacity: 0;
    visibility: hidden;
    transition: all ease-in-out 0.35s;
  }

  .main-navigation ul.sub-menu a {
    padding: 8px 15px;
  }

  .main-navigation li:hover>ul.sub-menu {
    opacity: 1;
    visibility: visible;
  }

  .maplayout ul li[data-title="Punjab"] {
    left: 69.5%;
    top: 32%;
  }

  .maplayout ul li[data-title="Delhi"] {
    left: 70%;
    top: 33%;
  }

  .maplayout ul li[data-title="Tamil Nadu"] {
    left: 70.7%;
    top: 45%;
  }

  .maplayout ul li[data-title="Assam"] {
    left: 74.2%;
    top: 34%;
  }

  .maplayout ul li[data-title="West bengal"] {
    left: 72.7%;
    top: 36%;
  }

  .maplayout ul li[data-title="Bangladesh"] {
    left: 73.4%;
    top: 35%;
  }

  .maplayout ul li[data-title="United States"] {
    left: 20%;
    top: 25%;
  }
}

@media screen and (min-width: 1200px) {
  .main-navigation ul.sub-menu a:hover {
    color: #22318c;
  }

  .item-s6-xl4:not(:nth-child(-n + 3)),
  .item-s6-l4-x3:not(:nth-child(-n + 4)),
  .item-s6-m3-xl4:not(:nth-child(-n + 4)) {
    margin-top: 30px;
  }

  .maplayout ul li[data-title="Punjab"] {
    left: 69.5%;
    top: 32%;
  }

  .maplayout ul li[data-title="Delhi"] {
    left: 70%;
    top: 33%;
  }

  .maplayout ul li[data-title="Tamil Nadu"] {
    left: 70.8%;
    top: 46%;
  }

  .maplayout ul li[data-title="Assam"] {
    left: 74.5%;
    top: 35%;
  }

  .maplayout ul li[data-title="West bengal"] {
    left: 72.5%;
    top: 37%;
  }

  .maplayout ul li[data-title="Bangladesh"] {
    left: 73.7%;
    top: 36%;
  }

  .maplayout ul li[data-title="United States"] {
    left: 20%;
    top: 25%;
  }
}

@media screen and (min-width: 1400px) {
  .banner-property-search {
    width: 1296px;
  }

  .impact-element .cont h3 {
    font-size: 1.5rem;
  }

  .maplayout ul li[data-title="Punjab"] {
    left: 64.5%;
    top: 32%;
  }

  .maplayout ul li[data-title="Delhi"] {
    left: 65%;
    top: 33%;
  }

  .maplayout ul li[data-title="Tamil Nadu"] {
    left: 66%;
    top: 46%;
  }

  .maplayout ul li[data-title="Assam"] {
    left: 69.5%;
    top: 35%;
  }

  .maplayout ul li[data-title="West bengal"] {
    left: 68%;
    top: 37%;
  }

  .maplayout ul li[data-title="Bangladesh"] {
    left: 68.7%;
    top: 36%;
  }

  .maplayout ul li[data-title="United States"] {
    left: 20%;
    top: 25%;
  }
}

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

  .projects,
  .section-ptb,
  .impact-roofsol,
  .mission-vision {
    overflow-x: hidden;
  }

  .philosophy-section {
    overflow: hidden;
  }

  .mission-vision .mv-element .inner-content {
    max-width: calc(100% - 40%);
  }

  /* Safty page*/
  .safety-section {
    overflow: hidden;
  }

  /* Carrer PAge*/
  .lifeat-section {
    overflow: hidden;
  }

  /* Product Detatails */
  .details-overview,
  .sec-project-gallery.impact-roofsol {
    overflow: hidden;
  }

  /* Contact Us */
  .partner-section,
  .enquire-section {
    overflow: hidden;
  }
}

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

  h2,
  h1.section-title,
  h2.section-title {
    font-size: 2.1rem;
  }

  h3,
  .bottom-common-section .phone a {
    font-size: 1.62rem;
  }

  .main-navigation>.menu>li {
    margin-right: 24px;
  }

  .hero-text .banner-title {
    font-size: 3rem;
  }

  /* About US*/
  .mission-vision .right-img {
    min-width: 498px;
  }
}

@media screen and (max-width: 1370px) {
  .main-header .logo img {
    max-height: 40px;
  }

  h2,
  h1.section-title,
  h2.section-title {
    font-size: 1.8rem;
  }

  h3,
  .bottom-common-section .phone a {
    font-size: 1.42rem;
  }

  .main-navigation>.menu>li {
    margin-right: 20px;
  }

  .hero-text .banner-title {
    font-size: 2.6rem;
  }

  /* .our-services .service-box img+div {
    min-height: 180px;
  } */

  .project-items .p-xl-5 {
    padding: 2rem !important;
  }

  .project-box .content .address {
    flex-wrap: wrap;
  }

  .project-box .content .address span {
    display: block;
    margin-bottom: 8px;
  }

  /* About Us*/
  .mission-vision .mv-element .inner-content {
    max-width: calc(100% - 45%);
  }

  .single-slider {
    margin-bottom: 50px;
  }
}

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

  /* About Us*/
  .mission-vision .mv-element .inner-content {
    max-width: calc(100% - 40%);
  }

  .mission-vision .right-img {
    min-width: 400px;
    max-width: 450px;
  }
}

@media screen and (max-width: 1199px) {
  .order-1-mx-1199 {
    order: 1;
  }
  .item-s6-xl4:not(:nth-child(-n + 2)),
  .item-s6-m3-xl4:not(:nth-child(-n + 3)) {
    margin-top: 30px;
  }

  /* Navigations */
  .header-widget>.d-flex {
    flex-direction: row-reverse;
  }

  .nav-togl {
    display: block;
    background: transparent;
    border: 0;
    margin-left: 15px;
  }

  .nav-togl span {
    width: 26px;
    height: 2px;
    background-color: #22318c;
    display: block;
    margin: 5px auto;
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
  }

  /* .nav-togl.active span {
        background-color: #fff;
    } */

    .nav-togl:focus {
      outline: 0 none;
    }

    .nav-togl:hover {
      cursor: pointer;
    }

    .nav-togl.active {
      -webkit-transition: all 0.3s ease-in-out;
      -o-transition: all 0.3s ease-in-out;
      transition: all 0.3s ease-in-out;
      -webkit-transition-delay: 0.6s;
      -o-transition-delay: 0.6s;
      transition-delay: 0.6s;
      -webkit-transform: rotate(45deg);
      -ms-transform: rotate(45deg);
      -o-transform: rotate(45deg);
      transform: rotate(45deg);
      z-index: 9999;
    }

    .nav-togl.active span:nth-child(2) {
      width: 0px;
    }

    .nav-togl.active span:nth-child(1),
    .nav-togl.active span:nth-child(3) {
      -webkit-transition-delay: 0.3s;
      -o-transition-delay: 0.3s;
      transition-delay: 0.3s;
    }

    .nav-togl.active span:nth-child(1) {
      -webkit-transform: translateY(5px);
      -ms-transform: translateY(5px);
      -o-transform: translateY(5px);
      transform: translateY(5px);
    }

    .nav-togl.active span:nth-child(3) {
      -webkit-transform: translateY(-9px) rotate(90deg);
      -ms-transform: translateY(-9px) rotate(90deg);
      -o-transform: translateY(-9px) rotate(90deg);
      transform: translateY(-9px) rotate(90deg);
    }

  /* .navtrigger {
        position: absolute;
        right: 0;
        top: 0px;
        width: 35px;
        cursor: pointer;
        height: 48px;
    }

    .navtrigger:before {
        content: "";
        position: absolute;
        top: 50%;
        left: 50%;
        height: 8px;
        width: 8px;
        border-right: 2px solid #ffffff;
        border-bottom: 2px solid #ffffff;
        transform: translate(-50%, -50%) rotate(-45deg);
        -webkit-transition: all 0.3s ease-in-out;
        -o-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out;
    } */
    body.menu-open {
      overflow: hidden;
      position: fixed;
      width: 100%;
      height: 100%;
    }

    .main-header {
      padding-top: 10px;
      padding-bottom: 10px;
    }

    .main-header nav {
      position: fixed;
      top: 60px;
      background-color: #3f51b5;
      width: 290px;
      height: calc(100% - 60px);
      left: -305px;
      -webkit-transition: left ease-in-out 0.35s;
      transition: left ease-in-out 0.35s;
      overflow-x: hidden;
      overflow-y: visible;
      z-index: 1;
    }

    .main-navigation>ul>li>a::before,
    .main-navigation>ul>li>a::after {
      display: none;
    }

    .main-header nav.open {
      left: -12px;
    }

    .main-navigation>.menu {
      flex-wrap: wrap;
    }

    .main-header nav ul li {
      width: 100%;
    }

    .main-header nav ul li a {
      color: #ffffff;
    }

    .main-header nav ul li a {
      padding: 10px 12px;
      border-bottom: 1px solid rgba(255, 255, 255, 0.3);
    }

    .main-header .header-widget.top {
      padding: 4px 15px;
      height: 73px;
    }

    .main-navigation>.menu>li {
      margin-right: 0;
    }

    .main-header nav ul li a {
      position: relative;
      font-size: 0.875rem;
    }

    .main-header nav ul li a .navtrigger {
      position: absolute;
      right: 0;
      top: 0;
      bottom: 0;
      width: 25px;
      background: rgba(0, 0, 0, 0.3);
      transform: inherit;
    }

    .main-header nav ul li a .navtrigger:before {
      content: "";
      position: absolute;
      top: 50%;
      left: 50%;
      height: 8px;
      width: 8px;
      border-right: 2px solid #ffffff;
      border-bottom: 2px solid #ffffff;
      transform: translate(-50%, -50%) rotate(-45deg);
    }

    .main-header nav .sub-menu .backmenu-row {
      position: fixed;
      width: 100%;
      z-index: 1;
      padding: 10px;
      padding-left: 40px;
      background: rgb(24 105 110);
      font-size: 0.875rem;
      width: 290px;
      left: -290px;
    }

    .main-header nav .sub-menu .backmenu-row .back-trigger {
      padding: 0;
      position: absolute;
      left: 0;
      top: 0;
      bottom: 0;
      width: 30px;
      display: block;
      background: #3d3d3d;
      border: 1px solid #404040;
    }

    .main-header nav .sub-menu .backmenu-row .back-trigger:before {
      content: "";
      position: absolute;
      top: 19px;
      left: 16px;
      height: 8px;
      width: 8px;
      border-right: 2px solid #ffffff;
      border-bottom: 2px solid #ffffff;
      transform: translate(-50%, -50%) rotate(135deg);
      transform-origin: center;
    }

    .main-header nav li.sub-open .sub-menu .backmenu-row {
      left: 0;
    }

    .main-header nav .sub-menu .backmenu-row em {
      color: #ffffff;
      font-style: normal;
    }

    .main-header nav .sub-menu {
      position: fixed;
      width: 290px;
      min-height: calc(100% - 60px);
      max-height: calc(100% - 60px);
      left: -290px;
      -webkit-transition: left ease-in-out 0.35s;
      transition: left ease-in-out 0.35s;
      background-color: #23969d;
      overflow-y: auto;
      overflow-x: hidden;
      padding-top: 41px;
      z-index: 1;
    }

    .main-header nav li.sub-open>.sub-menu {
      left: 0px;
    }

    .main-header nav .sub-menu,
    .main-header nav .sub-menu .backmenu-row {
      top: 60px;
    }

    .main-header nav .sub-menu .sub-menu {
      background-color: rgba(0, 0, 0, 0.3);
    }

    .main-header nav .sub-menu .sub-menu .sub-menu {
      background-color: rgba(0, 0, 0, 0.3);
    }

    .main-header nav .sub-menu .sub-menu .sub-menu .sub-menu {
      background-color: rgba(0, 0, 0, 0.3);
    }

    .main-header nav .sub-menu .sub-menu .sub-menu .sub-menu .sub-menu {
      background-color: rgba(0, 0, 0, 0.3);
    }

    .our-services .slick-prev,
    .our-services .slick-next {
      display: none !important;
    }

    .our-services .slick-dots {
      display: block !important;
    }

    .why-roofsol h4 {
      text-align: center;
    }

    .why-roofsol h4 img {
      display: block;
      margin: 0 auto;
    }

    .testimonials .slick-prev {
      left: 0;
    }

    .testimonials .slick-next {
      right: 0;
    }

    .project-box .content::after {
      width: 50px;
      opacity: 1;
      right: 30px;
    }

    /* Navigation End*/
    .testimonials,
    .our-services {
      overflow-x: hidden;
    }

    .main-footer .socials {
      margin-bottom: 1.5rem !important;
    }

    /* About Us */
    .mission-vision .right-img {
      min-width: 380px;
      max-width: 380px;
    }

    .journey-section {
      overflow: hidden;
    }

    /* Servive page*/
    .service-element .left-widget {
      width: 50%;
    }

    .service-list .service-element:nth-child(odd) .right-widget {
      width: 50%;
      padding-left: 50px;
    }

    .service-list .service-element:nth-child(even) .right-widget {
      width: 50%;
      padding-right: 50px;
    }

    /* Contact Map Sections */
    .enquire-section .bg-img img {
      height: 100%;
    }

    .item-s6-xl4:not(:nth-child(-n + 3)),
    .item-s6-l4-x3:not(:nth-child(-n + 4)),
    .item-s6-m3-xl4:not(:nth-child(-n + 4)) {
      margin-top: 30px;
    }
  }

  @media screen and (max-width: 991px) {
    h1 {
      font-size: 2.8rem;
    }

    h3 {
      font-size: 1.5rem;
    }

    h4 {
      font-size: 1.25rem;
    }

    h5 {
      font-size: 1.1rem;
    }

    .section-ptb {
      padding-top: 50px;
      padding-bottom: 50px;
    }

    .main-header {
      min-height: 60px;
    }

    .main-banner {
      min-height: 100vh;
      background-color: var(--black-color);
    }

    .main-banner .text-widget {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      z-index: 2;
    }

    .main-banner .text-widget {
      width: 100%;
      padding: 0 30px;
    }

    .main-banner .text-widget h1 {
      line-height: 1.5rem;
    }

    .image-slider-wrapper {
      background-color: var(--dark-color);
    }

    .image-slider-wrapper img,
    .slideshow .item img {
      opacity: 0.6;
    }

    .slideshow .item img {
      position: absolute;
    }

    .swift-up-text>span {
      line-height: 2.5rem;
    }

    .cd-nav-trigger {
      margin-right: 50px;
    }

    .cd-nav-trigger.is-active {
      margin-right: 0px;
    }

    .back-list {
      background: rgba(0, 0, 0, 0.3);
      padding: 10px 15px;
    }

    .left-icon-list {
      margin: 15px 0;
      transform: inherit !important;
    }

    [data-scrollax] {
      transform: inherit !important;
    }

    .counters {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 15px;
    }

    .main-footer .footer-grid {
      display: block;
    }

    .main-footer .footer-grid .footer-menu {
      gap: 10px;
    }

    .main-footer .footer-grid .footer-widget {
      margin-bottom: 20px;
    }

    .home-banner {
      height: calc(100vh - 60px);
    }

    .feature-box {
      padding: 25px;
    }

    .feature-items .feature-box img {
      max-width: 40px;
    }

    .feature-box h3 {
      font-size: .85rem;
    }

  /* .testimonials .slider-single .testi-cont {
    padding-bottom: 25px;
  } */

  .footer-bottom .container {
    flex-wrap: wrap;
    justify-content: center !important;
  }

  .bottom-common-section {
    text-align: center;
    background: linear-gradient(90deg,
      rgba(51, 176, 184, 1) 64%,
      rgb(51 176 184) 64%);
  }

  .bottom-common-section .justify-content-end {
    justify-content: center !important;
  }

  .bottom-common-section .container::before {
    width: 100%;
    height: 10px;
    left: 0;
    top: calc(50% - 8px);
    display: block;
    clip-path: none;
  }

  .bottom-common-section .right-col {
    clip-path: none;
    padding-top: 40px;
    padding-bottom: 40px;
    margin-bottom: 40px;
  }

  .our-services {
    padding-top: 50px;
  }

  .testimonials {
    padding-top: 50px;
    padding-bottom: 100px;
  }

  .technology-partners {
    padding-top: 50px;
    padding-bottom: 100px;
  }

  .awards {
    padding-bottom: 50px;
  }

  .projects {
    padding-bottom: 50px;
  }

  .main-footer .footer-top {
    padding-top: 50px;
  }

  /* About us */
  .mission-vision .mv-element .inner-content {
    max-width: 45%;
  }

  .journey .slick-prev {
    left: -22px;
    z-index: 1;
  }

  .journey .slick-next {
    right: -22px;
    z-index: 1;
  }

  .font24 {
    font-size: 1.25rem;
  }

  /* Safty Page */
  .safety-section {
    padding-top: 0;
  }

  .safety-section .section-title {
    margin-top: 50px;
  }

  .safety-section .p-3.p-lg-4.p-xl-5 {
    padding-right: var(--bs-gutter-x, 0.75rem) !important;
    padding-left: var(--bs-gutter-x, 0.75rem) !important;
    padding-top: 50px !important;
  }

  .safety-section.clients {
    padding-top: 100px;
  }

  /* Carrer PAge*/
  .lifeat-section .section-title {
    margin-top: 50px;
  }

  .multiple-btn {
    flex-wrap: wrap;
  }

  .multiple-btn .btn-item:not(:last-child) {
    border-right: 0;
    margin-right: 0;
    padding-right: 0;
    margin-bottom: 13px;
    width: 100%;
  }

  /* Projects */
  .impact-roofsol.to-bottom {
    padding-top: 50px;
    padding-bottom: 100px;
  }

  /* Product Detatails */
  .details-overview .section-title {
    margin-top: 50px;
  }

  /* Contact Us */
  .contact-top-roofsol {
    text-align: center;
  }

  .contact-details .contact-element {
    display: flex;
    justify-content: center;
  }

  .contact-top-roofsol iframe {
    width: 100%;
    margin-top: 30px;
  }

  .domestic-section {
    padding-top: 120px;
  }

  .domestic-section .item:not(:last-child) {
    margin-bottom: 30px;
  }

  .enquire-section {
    text-align: center;
    padding-top: 100px;
    padding-bottom: 50px;
  }

  .enquire-section .bg-img {
    display: none;
  }

  .partner-section {
    text-align: center;
  }

  /* Contact Us */
  .international-section .item:not(:last-child) {
    margin-bottom: 30px;
  }

  /* Additional pading 30px */

  .section-ptb {
    padding-top: 30px;
    padding-bottom: 30px;
  }

  .our-services {
    padding-top: 30px;
  }

  .testimonials {
    padding-top: 30px;
  }

  .technology-partners {
    padding-top: 30px;
  }

  .awards {
    padding-bottom: 30px;
  }

  .service-box p:last-child {
    margin-bottom: 0;
  }

  .clients {
    padding-top: 33px;
  }

  .projects {
    padding-bottom: 30px;
  }

  .main-footer .footer-top {
    padding-top: 30px;
  }

  .safety-section .p-3.p-lg-4.p-xl-5 {
    padding-top: 30px !important;
  }

  .safety-section .section-title {
    margin-top: 0;
  }

  .impact-roofsol.to-bottom {
    padding-top: 30px;
  }

  .details-overview .section-title {
    margin-top: 30px;
  }

  .domestic-section {
    padding-top: 120px;
  }

  .enquire-section {
    padding-bottom: 30px;
  }
}

@media screen and (max-width: 767px) {
  body {
    font-size: 14px;
  }

  .hero-text .banner-title {
    font-size: 1.5rem;
  }

  h2,
  h1.section-title,
  h2.section-title {
    font-size: 1.5rem;
  }

  h3,
  .bottom-common-section .phone a {
    font-size: 1.2rem;
  }

  .hero-text .btn,
  .btn {
    font-size: 14px;
    padding: 9px 16px;
    min-width: 112px;
  }

  .hero-text .btn {
    margin-top: 15px;
  }

  /* .logo img {
    max-width: 190px;
  } */
  .main-header .logo img {
    max-height: 25px;
  }

  .main-header .header-widget .btn {
    padding: 6px 8px;
    min-width: 98px;
  }
  .main-header .header-widget .btn::after {
    background-size: 14px;
    right: 0;
  }
  .nav-togl {
    margin-left: 3px;
  }

  .arrow-vhc .slider-arrows .arrow-elmnt.arrow-elmnt_dir_left {
    left: 15px;
  }

  .arrow-vhc .slider-arrows .arrow-elmnt.arrow-elmnt_dir_right {
    right: 15px;
  }

  .main-banner .slider-ctrl {
    right: 20px;
    bottom: 55px;
  }

  .main-banner .slider-ctrl .swiper-button-next::after,
  .main-banner .slider-ctrl .swiper-button-prev::after,
  .main-banner .slider-ctrl .swiper-pagination {
    font-size: 1rem;
  }

  .item-s6-m3-xl4:not(:nth-child(-n + 2)) {
    margin-top: 30px;
  }

  .feature-items {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin-left: 8px;
  }

  .feature-box {
    padding: 20px;
    width: 46%;
  }

  .feature-items img {
    max-width: 35px;
  }

  .feature-box h3 {
    font-size: 0.85rem;
  }

  .feature-items .feature-box:nth-child(3),
  .feature-items .feature-box:nth-child(6) {
    /* background-color: var(--primary-color); */
  }

  .feature-items .feature-box:nth-child(3) h3,
  .feature-items .feature-box:nth-child(6) h3 {
    /* color: var(--white-color); */
  }

  .feature-items .feature-box:nth-child(3)::after,
  .feature-items .feature-box:nth-child(6)::after {
    display: none;
  }

  .feature-items .feature-box:nth-child(3) img,
  .feature-items .feature-box:nth-child(6) img {
    /* filter: brightness(10); */
  }

  .feature-items .feature-box:nth-child(4),
  .feature-items .feature-box:nth-child(5) {
    /* background-color: var(--white-color); */
  }

  .feature-items .feature-box:nth-child(4) h3,
  .feature-items .feature-box:nth-child(5) h3 {
    color: var(--forth-color);
  }

  .feature-items .feature-box:nth-child(4) img,
  .feature-items .feature-box:nth-child(5) img {
    /* filter: brightness(0) saturate(100%) invert(55%) sepia(58%) saturate(469%) hue-rotate(135deg) brightness(97%) contrast(91%); */
  }

  .feature-items .feature-box:nth-child(4)::after,
  .feature-items .feature-box:nth-child(5)::after {
    content: "";
    width: 100%;
    height: 0;
    position: absolute;
    left: 0;
    bottom: 0;
    /* background: var(--secondary-color); */
    display: block;
    transition: var(--primary-transition);
    z-index: -1;
  }
/* 
  body,
  .clients,
  .testimonials {
    overflow-x: hidden !important;
  } */
  .slick-prev, .slick-next {
    width: 30px;
    height: 30px;
  }
  .slick-slider .slick-prev,
  .slick-slider .slick-next {
    top: inherit;
    bottom: -30px;
    transform: translateX(-50%);
  }
  .slick-slider .slick-prev {
    left: calc(50% - 30px);
  }

  .slick-slider .slick-next {
    right: calc(50% - 60px);
  }
  .slick-slider.project-items .slick-prev,
  .slick-slider.project-items .slick-next {
    bottom: -50px;
  }

  .our-services {
    padding-bottom: 100px;
    overflow: hidden;
  }

  h4 {
    font-size: 1.1rem;
  }

  .section-title {
    margin-bottom: 20px;
  }

  .projects {
    padding-top: 120px;
  }

  .project-items .p-xl-5 {
    padding: 1rem !important;
  }

  .project-box .content h3 {
    font-size: 1rem;
  }

  .project-box .content::after {
    width: 40px;
    height: 40px;
    right: 0;
  }

  .project-box .content .address span {
    font-size: 0.8rem;
    margin-bottom: 5px;
  }

  .projects .slick-dots li.slick-active button:before {
    background-color: var(--primary-color);
  }

  .projects .btn-secondarybg.btn {
    margin-top: 80px !important;
  }

  .testimonials {
    padding-bottom: 150px;
  }

  .testimonial-box .slider-nav .slick-list {
    padding-left: 15px !important;
    padding-right: 15px !important;
  }

  .testimonials .slider-single .testi-cont {
    font-size: 1rem;
  }

  .testimonials .slick-prev {
    left: 16px;
    top: 180px;
    left: 43%;
    transform: translateX(-50%);
  }

  .testimonials .slick-next {
    right: 31%;
    top: 180px;
    transform: translateX(-50%);
  }

  .awards {
    padding-top: 110px;
    padding-bottom: 60px;
  }

  .bottom-common-section .left-col {
    padding-top: 30px;
    padding-bottom: 30px;
  }

  .bottom-common-section .left-col h3 {
    margin: 0;
  }

  .bottom-common-section .container::before {
    top: calc(50% + 6px);
  }

  .bottom-common-section .right-col {
    margin-bottom: 0;
  }

  /* About us */
  .hero-text .banner-title {
    margin: 0;
  }

  section.about-roofsol {
    padding-bottom: 0;
  }

  section.about-roofsol .polygon {
    display: none;
  }

  .impact-roofsol:not(.to-bottom) {
    padding: 75px 0 30px;
  }

  .impact-roofsol:not(.to-bottom)::after {
    width: 44%;
    z-index: -2;
  }

  .mission-vision .right-img {
    position: inherit;
    min-width: 100%;
    max-width: 100%;
  }

  .mission-vision .mv-element .inner-content {
    max-width: 100%;
  }

  .journey-section {
    padding-bottom: 0;
  }

  .journey .slick-prev {
    left: 0;
    background: #fff;
  }

  .journey .slick-next {
    right: 0;
    background: #fff;
  }

  .philosophy-section .col-lg-6 {
    margin-top: 50px;
  }

  /* Safty page*/
  .safety-section .p-3.p-lg-4.p-xl-5 {
    padding-right: 15px !important;
    padding-left: 15px !important;
  }

  .safety-section p:last-child {
    margin-bottom: 0;
  }

  .security-list li {
    width: 100%;
  }

  /* Servive page*/
  .service-element .left-widget {
    width: 100%;
  }

  .service-list .service-element:nth-child(odd) .right-widget {
    width: 100%;
    padding-left: 0;
  }

  .service-list .service-element:nth-child(even) .right-widget {
    width: 100%;
    padding-right: 0;
  }

  section.services-roofsol.section-ptb {
    padding-top: 0;
  }

  section.services-roofsol.section-ptb .text-uppercase {
    margin-top: 15px;
  }

  .mission-vision p:last-child, .journey-section p:last-child {
    margin-bottom: 0;
  }

  .font24 {
    font-size: 1rem;
  }

  .team-box .bot-element {
    min-height: 98px;
  }
  .floating-btn-right-sec {
    display: flex;
    width: 100%;
    bottom: 0;
    left: 0;
    z-index: 10;
  }
  .floating-btn-right-sec a {
    width: 33.33%;
    font-size: 0.625rem;
    flex-direction: column;
    padding: 5px 3px 5px 3px;
  }
  .floating-btn-right-sec a .icon {
    width: 24px;
    height: 24px;
  }
  .footer-bottom {
    padding: 15px 15px 60px 15px;
  }
  .caption-box {
      padding: 7px;
      bottom: 5px;
  }
  .caption-box h4 {
    font-size: 11px;
    line-height: 0;
    margin-bottom: 2px;
}
.caption-box .designation {
    font-size: 11px;
}
}

@media screen and (max-width: 575px) {
  .our-services .slick-dots {padding-bottom: 15px}
  .item-s6-xl4:not(:first-child),
  .item-s6-m3-xl4:not(:first-child) {
    margin-top: 30px;
  }

  .left-icon-list {
    grid-template-columns: 100px calc(100% - 110px);
    gap: 10px;
    align-items: start;
  }

  .left-icon-list .icon {
    margin-top: 7px;
  }

  .left-icon-list .content p {
    margin-bottom: 5px;
  }

  .article-grid-list article:first-child figure,
  .article-grid-list article:nth-child(2) figure,
  .article-grid-list article:nth-child(4) figure,
  .article-grid-list article:nth-child(6) figure {
    min-height: 200px;
  }
  .maplayout {
    width: 335px;
    margin: 0 auto;
  }
  .maplayout ul li svg {
    width: 10px;
  }
  .maplayout ul li[data-title="Punjab"] {
    left: 69.5%;
    top: 27%;
  }

  .maplayout ul li[data-title="Delhi"] {
    left: 70%;
    top: 29%;
  }

  .maplayout ul li[data-title="Tamil Nadu"] {
    left: 70%;
    top: 38%;
  }

  .maplayout ul li[data-title="Assam"] {
    left: 74%;
    top: 26%;
  }

  .maplayout ul li[data-title="West bengal"] {
    left: 72.5%;
    top: 30%;
  }

  .maplayout ul li[data-title="Bangladesh"] {
    left: 73.2%;
    top: 28%;
  }

  .maplayout ul li[data-title="United States"] {
    left: 20%;
    top: 16%;
  }
}