/*------------------------------------------------------------------
1. Home page
-------------------------------------------------------------------*/
*{
      box-sizing: border-box;
}
.main{
      overflow: hidden;
}

.container{
        width: 100%;
        max-width: 90%;
        margin: 0 auto;
}

.flex{
        display: flex;
        flex-wrap: wrap;
}


/*.header{
      width: 100%;
      max-width: 1450px;
      margin: 0 auto;
      min-height: 120px;
      background-color: #fff;
      -webkit-border-radius: 26px;
      -moz-border-radius: 26px;
      border-radius: 26px;
      position: absolute;
      left: 0;
      right: 0;
      top: 60px;
      padding: 15px 50px;
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      z-index: 9;
}*/

.banner {
      width: 100%;
      height: 100vh;
      position: relative;
      display: flex;
      align-items: center;
}

.banner-text{
        position: absolute;
        margin: auto;
        bottom: 0;
        top: 0;
        width: 100%;
        height:100%;
        background-color: #0000004f;
        display: flex;
        align-items: center;
        flex-direction: column;
        justify-content: center;
}

.banner-text h1{
      font-size: 130px;
        line-height: 150px;
        font-weight: 600;
        color: #fff;
        text-transform: uppercase;
        margin-bottom: 0;
        padding-top: 140px;
}

.banner-text h1 span{
        padding-left: 25%;
}

.banner img{
       width: 100%;
       height: 100%;
       object-fit: cover;
}

.nav ul li+li{
margin-left: 30px;
}

.nav li a{
    font-family: 'clashGrotesk';
    font-weight: 500;
    color: #000;
    font-size: 21px;
    text-transform: uppercase;
    display: inline-block;
     padding: 10px
}
.home-about-section{
         width: 100%;
         padding: 110px 0;
         background-color: #E2E2E4;
}

.home-about-section h2{
        font-size: 45px;
        list-style: 50px;
        font-weight: 500;
        text-align: center;
}

.home-about-second{
      width: 100%;
      margin-top: 80px;
      background-color: #E2E2E4;
}

.home-about-img{
         width: 50%;
         border-radius: 20px;
         -webkit-border-radius: 20px;
         -moz-border-radius: 20px;
         overflow: hidden;
}

.home-about-img img{
      border-radius: 20px;
      -webkit-border-radius: 20px;
      -moz-border-radius: 20px;
}

.home-about-content{
       width: 50%;
       padding-left: 120px;
       text-align: justify;
}

.home-about-img img{
        width: 100%;
}

.main-btn {
      padding: 0 35px;
      line-height: 50px;
      background-color: #284FA9;
      font-size: 18px;
      color: #2EEAFF;
      display: inline-block;
      -webkit-border-radius: 58px;
      -moz-border-radius: 58px;
      border-radius: 58px;
      text-transform: uppercase;
      min-width: 210px;
      text-align: center;
      overflow: hidden;
      -webkit-transition: all 0.3s ease-in-out;
      -moz-transition: all 0.3s ease-in-out;
      transition: all 0.3s ease-in-out;
      position: relative;
      margin-top: 10px;
      
  }

  .main-btn span{
      position: relative;
      z-index: 2;
      letter-spacing: 2px;
  }

  .main-btn::after{
      content: "";
        width: 0;
        height: 100%;
        position: absolute;
        left: 0;
        top:0;
        background-color: #000;
        -webkit-transition: all 0.3s ease-in-out;
        -moz-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out;
        z-index: 1;
  }

  .main-btn:hover::after{
      width: 100%;
  }

  .main-btn:hover{
        color: #fff;
  }

  .home-about-content .main-btn{
         margin-top: 30px;
  }

  .home-green-section{
         width: 100%;
         padding-bottom: 100px;
         background-color: #E2E2E4;
  }

  .home-green-inner{
         width: 100%;
         height: 800px;
         padding: 90px;
         display: flex;
         flex-wrap: wrap;
         align-items: flex-end;
         background-size: cover;
         background-repeat: no-repeat;
         background-position: center;
         border-radius: 25px;
         -webkit-border-radius: 25px;
         -moz-border-radius: 25px;
  }

  .home-green-content h3{
       font-size: 50px;
       line-height: 50px;
       font-weight: 400;
       color: #fff;
  }

  .home-green-content h3 span{
         font-weight: 500;
  }

  .home-green-content{
          width: 100%;
  }

  .home-green-content h4{
       font-size: 105px;
       line-height: 90px;
       color: #fff;
       text-transform: uppercase;
       font-weight: 600;
       margin-top: 20px;
  }

  .home-green-content h4 span{
            color: #6EE2FA;
  }

  .home-green-box-container{
        margin-top: 70px;
        width: 100%;
  }

  .home-green-box-container ul{
         display: grid;
         grid-template-columns: repeat(4, 1fr);
         column-gap: 70px;
      
  }

  .home-green-box-container ul li{
      border: 1px solid #E2E2E4;
       min-height: 240px;
       padding: 20px;
       -webkit-border-radius: 10px;
       -moz-border-radius: 10px;
       border-radius: 10px;
       position: relative;
  }

  .home-green-icon{
        position: absolute;
        bottom: 20px;
        right: 20px;
  }

  .home-green-icon img{
        max-height: 75px;
  }

  .home-green-box-container ul li p{
      font-size: 30px;
      line-height: 40px;
      color: #fff;
      max-width: 200px;
  }

  .home-feature-section{
      padding: 90px 0 120px;
      background-color: #DDDDDD;
  }

  .main-title{
      font-size: 49px;
      line-height: 60px;
        color: #2D2D30;
        text-transform: uppercase;
        font-weight: 500;
        
  }

  .center{
      text-align: center;
  }

  .home-feature-inner{
      margin-top: 130px;
      position: relative;
  }

  .home-feature-inner img{
      margin: 0 auto;
      max-width: 75%;
      width: 100%;
      display: block;
  }

  .home-feature-box{
         position: absolute;
         width: max-content;
         z-index: 99;
         cursor: pointer;
  }

  .home-feature-box.first{
      left: 0;
      top: 0;
  }

  .home-feature-box h3{
      font-size: 39px;
      line-height: 42px;
        font-weight: 600;
        color: #284FA9;
        text-transform: uppercase;
  }

  .home-feature-box.second{
      right: 0;
      top: -50px;
}

.home-feature-box.third{
      right: 0;
      bottom: 0px;
}

.home-application-section{
         width: 100%;
         padding: 100px 0;
         background-color: #2D2D30;
}

.home-application-section .main-title{
        color: #fff;
        margin-bottom: 25px;
}

.home-application-section p{
         color: #fff;
}

.footer{
      padding-top: 50px;
      background-color: #DDDDDD;
}

.footer-address{
        width: 30%;
        padding-right: 10%;
}

.footer-logo{
        max-width: 275px;
}

.footer-address h5{
        margin-top: 30px;
        font-size: 18px;
        font-weight: 500;
}

.footer-nav{
         width: 25%;
         padding-right: 5%;
}

.footer-nav h3{
       font-size: 33px;
       font-weight: 400;
       line-height: 50px;
       margin-bottom: 30px;
}

.footer-nav ul li a{
      font-size: 19px;
      font-weight: 400;
}
.footer-address p {
      font-size: 19px;
} p {
      font-size: 19px;
}
.footer-nav ul li+li{
      margin-top: 15px;
}

.footer-reach{
       width: 20%;
       padding-top:90px;
       display: flex;
       justify-content: right;
       flex-direction: column;
       align-items: end;
}

.footer-reach a{
      font-size: 35px;
      font-weight: 400;
      color: #284FA9;
      display: flex;
      align-items: center;
      align-items: baseline;
}

.footer-reach a img{
    margin-left: 10px;
    width: 25px;
}

.footer-locations{
      padding-top: 25px;
      padding-bottom: 25px;
      width: 100%;
      display: flex;
      flex-wrap: wrap;
}

.foooter-location-inner{
      width: 93%;
}

.foooter-location-inner ul{
     display: flex;
     flex-wrap: wrap;
}

.foooter-location-inner ul li{
        width: 20%;
        padding-right: 20px;
}

.foooter-location-inner ul li a{
      display: block;
      font-size: 18px;
      line-height: 30px;
      width: 100%;
      margin-bottom: 5px;
}

.foooter-location-inner h4{
       font-weight: 500;
       margin-bottom: 10px;
}

.foooter-location-inner p{
      margin-bottom: 0;
}

.footer-social-media{
      display: flex;
      align-items: center;
      justify-content: end;
      width: 7%;
       
}

.footer-social-media ul{
      display: flex;
      column-gap: 15px;
}

.footer-bottom{
        width: 100%;
        display: flex;
        flex-wrap: wrap;
}

.rights-text{
        margin-left: auto;
        width: max-content;
}

.rights-text a{
      font-weight: 500;
}

.home-about-lead-img{
      width: 45%;
      display: flex;
      justify-content: center;
}

.home-about-lead-img img{
         max-width: 280px;
}

.home-about-lead-wrap{
       justify-content: center;
       text-align: center;
}

.home-about-lead-wrap h3{
       font-size: 30px;
       font-weight: 500;
       margin-top: 10px;
       margin-bottom: 0;
}

.home-about-lead-content{
       width: 55%;
       padding-left: 100px;
}

.about-group-section{
          width: 100%;
          padding: 90px 0 70px;
}

.about-group-content{
       width: 100%;
       padding-top: 50px;
       display: flex;
       flex-wrap: wrap;
       justify-content: space-between;
}

.about-group-text{
      width: 44%;
      text-wrap: wrap;
}

.about-group-text p{
      text-align: justify;
}

.about-group-img {
      width: 48%;
}

.about-group-img img{
      width: 100%;
      border-radius: 20px;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
}

.about-conter-wrap{
       width: 100%;
       background-color: #284FA9;
       padding: 35px 0 100px;
}

.about-conter-wrap ul{
        display: flex;
        flex-wrap: wrap;
        padding-top: 100px;
        width: 100%;
}

.about-conter-wrap ul li{
         width: 30%;
         padding-right: 40px;
}

.about-conter-wrap ul li h4{
         font-size: 190px;
         line-height: 150px;
         margin-bottom: 50px;
         font-weight: 500;
         color: #2EEAFF;
}

.about-conter-wrap ul li h5{
         color: #fff;
         font-size: 30px;
         line-height: 30px;
         margin-bottom: 0;
         font-weight: 400;
}

.counter-box{
       width: max-content;
}

.counter-box h5{
      text-align: center;
}

.about-conter-wrap h3 {
      font-size: 40px;
      line-height: 43px;
      font-weight: 500;
      color: #fff;
      text-align: left;
}

.about-conter-title {
      display: flex;
      justify-content: end;
      width: 95%;
}

.banner-text.clients-banner h1 span {
      padding-left: 15%;
  }

  .clients-section{
      padding: 100px 0;
      background-color: #E2E2E4;
  }


  .grid {
      margin-top: 90px;
      padding: 0;
      display: flex;
      flex-wrap: wrap;
      list-style-type: none;
      list-style-type: none;

    }
    .grid > li {
      width: calc(100% / 4 - 30px);
  margin: 0px 15px;
  margin-bottom: 30px;
  overflow: hidden;
  border-radius: 15px;
    }
    .filters {
      display: flex;
      display: -webkit-flex;
      flex-wrap: wrap;
      justify-content: center;
    }
    .grid li img {
      max-width: 100%;
      border-radius: 10px;
    }
    .filters button {
      padding: 15px 25px;
      min-width: 175px;
      height: 60px;
      text-align: center;
      margin: 0px 25px;
      border: none;
      -webkit-border-radius: 69px;
      -moz-border-radius: 69px;
      border-radius: 69px;
      transition: 150ms;
      background-color: #fff;
      color: #2D2D30;
      font-size: 21px;
      line-height: 25px;
      font-weight: 400;
      position: relative;
      outline: none;
      cursor: pointer;
      overflow: hidden;
      border: solid 1px #000;
    }



    .filters button.is-checked {
     
      background-color: #284FA9;
      color: #2EEAFF;
    }
    .element-item > div {
      height: 100%;
      padding: 20px 15px;
      color: #2EEAFF;
      height: 170px;
      display: flex;
      justify-content: center;
      align-items: center;
    }
    .element-item p {
      font-size: 18px;
      line-height: 24px;
      font-family: "Lato", sans-serif;
    }
    

    .banner-text.privacy-banner h1 span {
      padding-left: 30%;
  }

  .privacy-section{
         width: 100%;
         padding: 100px 0;
         background-color: #E2E2E4;
  }

  .accordian-single{
        
        background-color: #EDEDF1;
        border: 1px solid #FFFFFF;
        -webkit-border-radius: 25px;
        -moz-border-radius: 25px;
        border-radius: 25px;
        overflow: hidden;
        padding: 20px 50px;
  }

  .accordian-single+.accordian-single{
      margin-top: 35px;
  }

  .privacy-section .accordion-container .accordion-title{
             background-color: transparent;
             font-size: 30px;
             font-weight: 500;
             color: #2D2D30;
             padding: 20px 0;
  } 

  .privacy-section .accordion-content{
         border: none;
  }

  .privacy-section  .accordion-content{
        padding: 0;
  }


  .privacy-section .accordion-container .accordion-title {
      position: relative;
      padding-right: 40px;
      cursor: pointer;
  }
  
  .privacy-section .accordion-container .accordion-title::before,
  .privacy-section .accordion-container .accordion-title::after {
      content: "";
      position: absolute;
      top: 30%;
      right: 10px;
      width: 28px;
      height: 28px;
      background-color: #2EEAFF;
      border-radius: 50%; 
      display: flex;
      align-items: center;
      justify-content: center;
      transition: all .3s ease-in-out;
      background-size: 50%;
      background-position: center;
      background-repeat: no-repeat;
  }
  
  .privacy-section .accordion-container .accordion-title::before {
      background-image: url('../images/open-icon.svg'); 
  }
  
  .privacy-section .accordion-container .accordion-title.active::after {
      transform: rotate(180deg); 
  }
  
  .privacy-section .accordion-container .accordion-title::after {
      background-image: url('../images/close-icon.svg'); 
  }

  .home-clients-section{
        width: 100%;
        padding: 70px 0;
  }

  .client-slider-wrap{
       padding-top: 50px;
  }

  .client-slider .item{
        display: flex;
        align-items: center;
        justify-content: center;
        height: auto;
      
  }

  .client-slider .owl-stage{
       display: flex;
       align-items: center;
  }


  .client-slider .item img{
        width: auto;
        height: 100px;
        max-height: 150px;
  }

  .home-connect-section{
        width: 100%;
        padding: 60px 0;
        background-color: #284FA9;
  }

  .home-connect-form{
       width: 45%;
  }

  .home-connect-form .main-title{
      color: #fff;
  }

  .home-connect-inner{
        margin-top: 40px;
  }

  .home-connect-inner ul li{
        margin-bottom: 40px;
        position: relative;
  }

  .form-text::placeholder{
      color: #EDEDF1;
  }
  .form-text{
      width: 100%;
      padding: 30px 0;
      padding-right: 35px;
      line-height: 20px;
      line-height: 30px;
      border: none;
      background-color: transparent;
      font-size: 21px;
      color: #EDEDF1;
      border-bottom: 1px solid #EDEDF1;
  }

  .home-connect-form .main-btn{
          background-color: #2EEAFF;
          border: none;
          color: #284FA9;
          font-weight: 500;
          margin-top: 30px;
  }

  .home-connect-form .main-btn:hover{
       color: #fff;
  }

  .star{
       color: #2EEAFF;
       font-size: 51px;
       position: absolute;
       right: 5px;
       top: 20px;
  }

  .home-connect-right{
        width: 55%;
       padding: 120px 0;
       padding-left: 5%;
  }

  .home-connect-inner-wrap{
        width: 100%;
        position: relative;
  }

  .border-top{
        position: absolute;
        top: 0;
        right: 0;
        text-align: right;
  }

  
  .border-bottom{
      position: absolute;
      bottom: 42px;
      right: 0;
}

.home-supplying-section{
         width: 100%;
         padding: 120px 0;
         background-color: #DDDDDD;
}

.home-supplying-map{
        width: 55%;
}

.home-supplying-content{
      width: 45%;
      padding-left: 5%;
}

.home-supplying-map img{
        width: 100%;
}

.supplying-location{
       padding-top: 20px;
}

.supplying-location h5{
        text-align: center;
        font-size: 21px;
        font-weight: 500;
        color: #2D2D30;
}

.supplying-location ul{
      margin-top: 30px;
      display: grid;
      grid-template-columns: repeat(3,1fr);
      gap: 15px;
}

.supplying-location ul li{
        height: 60px;
        width: 100%;
        background-color: #fff;
        -webkit-border-radius: 70px;
        -moz-border-radius: 70px;
        border-radius: 70px;
        background-image: url(../images/plus.png);
        background-repeat: no-repeat;
        background-position: right 25px center;
        -webkit-transition: all 0.3s ease-in-out;
        -moz-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out;
}

.supplying-location ul li:hover{
      background-color: #2EEAFF;
}

.supplying-location ul li a{
      width: 100%;
      display: block;
      line-height: 60px;
      font-size: 21px;
      padding-right: 45px;
}
  

.banner-text.contact-banner h1 span {
      padding-left: 22%;
  }

  .home-application-inner{
         margin-top: 70px;
         justify-content: space-between;
  }

  .home-application-img{
           width: 45%;
  }

  .home-application-img img{
      -webkit-border-radius: 20px;
      -moz-border-radius: 20px;
        border-radius: 20px;
  }

  .home-application-content{
      width: 45%;
  }
  

  
  .slider .swiper-container {
      width: 100%;
      height: 100%;
      overflow: hidden;
    }
    .slider__flex {
      display: flex;
      align-items: flex-start;
    }
    .slider__col {
      display: flex;
      flex-direction: column;
      width: 150px;
      margin-right: 32px;
    }
    .slider__prev,
    .slider__next {
      cursor: pointer;
      text-align: center;
      font-size: 14px;
      height: 48px;
      display: flex;
      align-items: center;
      justify-content: center;
      -webkit-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none;
      user-select: none;
    }
    .slider__prev:focus,
    .slider__next:focus {
      outline: none;
    }
    .slider__thumbs {
      height: calc(400px - 96px);
    }
    .slider__thumbs .slider__image {
      transition: 0.25s;
      -webkit-filter: grayscale(100%);
      filter: grayscale(100%);
      opacity: 0.5;
    }
    .slider__thumbs .slider__image:hover {
      opacity: 1;
    }
    .slider__thumbs .swiper-slide-thumb-active .slider__image {
      -webkit-filter: grayscale(0%);
      filter: grayscale(0%);
      opacity: 1;
    }
    .slider__images {
      height: 400px;
    }
    .slider__images .slider__image img {
      transition: 3s;
    }
    .slider__images .slider__image:hover img {
      transform: scale(1.1);
    }
    .slider__image {
      width: 100%;
      height: 100%;
      border-radius: 30px;
      overflow: hidden;
    }
    .slider__image img {
      display: block;
      width: 100%;
      height: 100%;
      -o-object-fit: cover;
      object-fit: cover;
    }

    .privacy-section .main-title{
      margin-bottom: 80px;
    }

    .banner.content-bottom{
         align-items: flex-end;
    }

    .banner.content-bottom .banner-text{
         top: inherit;
    }

    .banner h3{
          font-size: 50px;
          line-height: 45px;
          text-transform: uppercase;
          margin-bottom: 25px;
          font-weight: 500;
          color: #fff;
    }
 .banner-text.privacy-banner h1{
          font-size: 50px;
          line-height: 45px;
          text-transform: uppercase;
          margin-bottom: 25px;
          font-weight: 500;
          color: #fff;
    }

    .banner p{
      color: #fff;
      font-size: 26px;
      line-height: 36px;
    }

    .advantages-section{
        padding: 80px 0;
    }

    .advantages-listing{
        padding-top: 80px;
    }

    .advantages-listing ul{
         display: grid;
         grid-template-columns: repeat(3, 1fr);
         column-gap: 110px;
         row-gap: 100px;
    }

    .advantages-listing ul li{
            border-top: 1px solid #2D2D30;
            padding-top: 40px;
    }

    .advantages-title{
         width: 100%;
         display: flex;
         flex-wrap: wrap;
         align-items: flex-start;
         min-height:110px;
         position: relative;
    }

    .advantages-title h3{
      width: calc(100% - 65px);
        color: #284FA9;
        font-weight: 500;
        font-size: 30px;
        line-height: 45px;
        margin-bottom: 0;
    }

    .advantages-icon{
      width: 65px;
    }

    .catelouge-section{
          width: 100%;
          min-height: 480px;
          background-image: url(../images/brochure-bg.jpg);
          background-repeat: no-repeat;
          background-size: cover;
          padding: 50px 0;
    }

    .catelouge-section .flex{
      display: flex;
      align-items: center;
    }


    .catelouge-text{
         width: 52%;
    }

    .catelouge-text h4{
      font-size: 38px;
      line-height: 55px;
          color: #fff;
          font-weight: 400;
    }

    .catelouge-img{
      width: 45%;
      margin-left: auto;
 }

 .catelouge-text-btn{
      display: flex;
      flex-wrap: wrap;
      margin-top: 30px;
      width: 100%;
      align-items: center;
 }

 .catelouge-text .main-btn {
      background-color: #2EEAFF;
      border: none;
      color: #284FA9;
      font-weight: 500;
      margin-top: 0;
  }

  .catelouge-text .main-btn:hover{
      color: #fff;
  }

  .catelouge-logo{
        margin-left: 150px; 
  }
  .catelouge-logo img {
      width: 125px;
}
  .banner.content-bottom .banner-text{
      justify-content: flex-end;
  }

  .comparison-section{
      width: 100%;
      height: auto;
      padding: 110px 100px;
      background-color: #E2E2E4;
}

.comparison-section h4{
      font-size: 37px;
      line-height: 45px;
      text-align: center;
      font-weight: 500;
      margin-top: 30px;
}

  
  /*tabs*/

  .comparison-tabs{
      margin-top: 80px;
}

.comparison-tabs ul.tabs {
   display: inline-block;
   vertical-align: top;
   position: relative;
   z-index: 10;
   padding: 0;
   width: 40%;
   list-style: none;
   -ms-transition: all 0.3s ease;
   -webkit-transition: all 0.3s ease;
   transition: all 0.3s ease;
 }
 .comparison-tabs   ul.tabs li {
   width: 85%;
   border-bottom: 1px solid #87878A;
   cursor: pointer;
   padding: 35px 0px;
   line-height: 40px;
   display: flex;
   flex-wrap: wrap;
   align-items: center;
   color: #87878A;
   text-align: left;
   font-weight: 400;
   text-transform: uppercase;
   font-size: 30px;
   background-color: transparent;
   -ms-transition: all 0.3s ease;
   -webkit-transition: all 0.3s ease;
   transition: all 0.3s ease;
 }

 .comparison-icon{
   width: 100px;
 }

 .comparison-tabs   ul.tabs li.active {
   color: #284FA9;
   -ms-transition: all 0.3s ease;
   -webkit-transition: all 0.3s ease;
   transition: all 0.3s ease;
 }
 
 .comparison-tabs   .tab_container {
   display: inline-block;
   vertical-align: top;
   position: relative;
   z-index: 20;
   width: 59%;
   text-align: left;
 }
 
 .comparison-tabs  .tab_content {
   padding: 20px;
   height: 100%;
   display: none;
 }
 
 .comparison-tabs  .tab_drawer_heading {
   display: none;
 }

 .comparison-tabs ul.tabs li.active .svg-img{
   filter: invert(1);
   /* or to blue */
   filter: brightness(0) saturate(100%) invert(24%) sepia(52%) saturate(2311%) hue-rotate(205deg) brightness(93%) contrast(88%);
 }

 .comparison-graph{
       width: 100%;
       height: 570px;
       border-left: 1px solid #2D2D30;
       border-bottom: 1px solid #2D2D30;
       position: relative;
 }

 .graph-title{
      width: 100%;
      position: absolute;
      bottom: -62px;
 }

 .graph-title ul{
       display: flex;
       flex-wrap: wrap;
 }

 .graph-title ul li{
   width: 14%;
   margin-left: 11%;
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
 }

 .graph-title ul li h5{
      font-size: 21px;
      width: 100%;
      line-height: 25px;
      margin-top: 10px;
      font-weight: 500;
      color: #2D2D30;
      text-align: center;
 }

 .graph-round{
    width: 35px;
    height: 35px;
    border: 3px solid #e2e2e4;
    background-color: #284FA9;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
 }

 .graph-box{
       position: absolute;
       height: 110px;
       background-color: #ABB7D3;
       left: 0;
       padding: 15px 20px;
       display: flex;
       align-items: center;
 }

 .graph-box span{
   font-size: 22px;
   line-height: 25px;
   color: #2D2D30;
   font-weight: 500;
 }

 .box1{
     bottom: 12%;
 }

 .box2{
   bottom: 41%;
 }

 .box3{
   bottom: 70%;
 }

 .poor{
   width: 18%;
 }

 .fair{
   width: 43%;
 }

 .good{
   width: 68%;
 }

 .excellent{
   width: 93%;
 }

 @media screen and (max-width: 781px) {
   .comparison-tabs  ul.tabs {
     display: none;
   }
 
   .comparison-tabs   .tab_container {
     display: block;
     margin: 0 auto;
     width: 95%;
     border-top: none;
     border-radius: 0;box-shadow: 0px 0px 10px black;
   }
 
   .comparison-tabs   .tab_drawer_heading {
         border-bottom: 1px solid #87878A;
         cursor: pointer;
         padding: 20px 0px;
         color: #2D2D30;
     margin: 0;
     display: block;
     cursor: pointer;
     -webkit-touch-callout: none;
     -webkit-user-select: none;
     -khtml-user-select: none;
     -moz-user-select: none;
     -ms-user-select: none;
     user-select: none;
     text-align: center;
   }
   .comparison-tabs .tab_drawer_heading:hover {
     background: #ccc;
     color: #2D2D30;
     color: white;
   }
 
   .comparison-tabs   .d_active {
         color: #284FA9;
   }
 }

 .properties-section{
      width: 100%;
      padding-top: 120px;
      background-color: #E2E2E4;
 }

 .properties-img{
   width: 100%;
   max-width: 770px;
   margin: 0 auto;
   margin-top: 70px;
   position: relative;
 }

 .property-icon{
    width: 66px;
    height: 66px;
    padding: 20px;
    position: absolute;
    background-color: #2EEAFF;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
    cursor: pointer;
 }

 .property-icon:before,
 .property-icon:after{
     content: "";
     position: absolute;
     background-color: #284FA9;
     transition: transform 0.25s ease-out;
 }

 /* Vertical line */
 .property-icon:before{
   top: 23%;
   left: 52%;
   width: 4px;
   height: 60%;
   margin-left: -2px;
 }

 /* horizontal line */
 .property-icon:after{
   top: 53%;
   left: 20%;
   width: 63%;
   height: 4px;
   margin-top: -2px;
 }
 
 .property-icon:hover:before{ transform: rotate(90deg); }
 .property-icon:hover:after{ transform: rotate(180deg); }
 

 .property_one{
   left: -2%;
   top: 13%; 
 }

 .property_two{
   left: 29%;
 top: 3%;
 }

 .property_three{
   left: 56%;
   top: 10%;
 }

 .property_four{
   left: 27%;
   top: 20%;
 }

 .property_five{
   left: 89%;
   top: 8%;  
 }

 .property_six{
   left: 48%;
   top: 37%;
}

.property_seven{
   left: 12%;
   top: 45%;
}

.property_eight{
   left: 28%;
   top: 69%;
}

.property_nine{
   left: 50%;
 top: 74%;
}

.property_ten{
   left: 86%;
   top: 51%;
}

.property_content{
      width: 310px;
      border-radius: 10px;
     padding: 30px;
     text-align: center;
     position: absolute;
     left: 32px;
     top: 58px;
     border: 1px solid #2D2D30;
     background-color: #DDDDDD;
     z-index: 2;
     visibility: hidden;
     opacity: 0;
     -webkit-transition: all 0.3s ease-in-out;
     -moz-transition: all 0.3s ease-in-out;
     transition: all 0.3s ease-in-out;
}

.property-icon:hover>.property_content{
   opacity: 1;
   visibility: visible;
}

.property_content h5{
   font-size: 30px;
   line-height: 28px;
   color: #2D2D30;
   font-weight: 400;
}

.property_content h2{
      font-size: 65px;
      line-height: 45px;
   line-height: 60px;
   font-weight: 500;
   color: #284FA9;
   margin-bottom: 0;
   margin-top: 40px;
}
.advantages-listing p {
      text-align: justify;
}
.banner-text.privacy-banner .container {
      padding-bottom: 60px;
}
section.home-clients-section .container {
      max-width: 100%;
}



  

/*slider*/

.slider{
      width: 100%;
      height: 655px;
      overflow: hidden;
}

.slider .swiper-container {
   width: 100%;
   height: 100%;
 }
 .slider__flex {
   display: flex;
   align-items: flex-start;
 }
 .slider__col {
   display: flex;
   flex-direction: column;
   width: 50%;
   padding-left: 120px;
   margin-right: 32px;
 }
 .slider__prev,
 .slider__next {
   cursor: pointer;
   text-align: center;
   font-size: 14px;
   height: 48px;
   display: flex;
   align-items: center;
   justify-content: center;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
   user-select: none;
 }
 .slider__prev:focus,
 .slider__next:focus {
   outline: none;
 }
 .slider__thumbs {
   height: 655px;
 }
 .slider__thumbs .slider__image {
   transition: 0.25s;
   -webkit-filter: grayscale(100%);
   filter: grayscale(100%);
   opacity: 0.5;
 }
 .slider__thumbs .slider__image:hover {
   opacity: 1;
 }
 .slider__thumbs .swiper-slide-thumb-active .slider__image {
   -webkit-filter: grayscale(0%);
   filter: grayscale(0%);
   opacity: 1;
 }
 .slider__images {
   width: 100%;
   height: auto;
 }

 .slider__banner {
      width: 50%;
      height: 940px;
 }

 .slider__banner img{
      height: 640px;
      object-fit: cover;
      object-position: center;
 }

 .slider__banner{
  border-radius: 20px;
  overflow: hidden;
 }
 
 .slider__images .slider__image img {
   transition: 3s;
 }
 .slider__images .slider__image:hover img {
   transform: scale(1.1);
 }
 .slider__image {
   width: 100%;
   height: 100%;

 }
 .slider__image img {
   display: block;
   width: 100%;
   height: 100%;
   border-radius: 20px;
   -o-object-fit: cover;
   object-fit: cover;
 }

.slider__thumbs .swiper-slide h4{
      font-size: 40px;
      line-height: 50px;
      color: #5D5D5F !important;
      font-weight: 400;
}



.slider__thumbs .swiper-slide.swiper-slide-active h4{
  color: #fff !important;
}

.slider__thumbs .swiper-slide{
  border-bottom: 1px solid  #E2E2E4;
  padding: 20px 0;
  padding-left: 50px;
  position: relative;
}

.slider__thumbs .swiper-slide  .swiper-slide-number{
  opacity: 0.4;
}

.slider__thumbs .swiper-slide.swiper-slide-active  .swiper-slide-number{
   opacity: 1;
}

.swiper-slide-number{
      position: absolute;
      top: 30px;
      left: 0;
      font-size: 21px;
      line-height: 25px;
      color: #6EE2FA;
}





 @media (max-width: 767.98px) {
   .slider__flex {
     flex-direction: column-reverse;
   }
   .slider__col {
     flex-direction: row;
     align-items: center;
     margin-right: 0;
     margin-top: 24px;
     width: 100%;
   }
   .slider__images {
     width: 100%;
   }
   .slider__thumbs {
     height: 100px;
     margin: 0 16px;
   }
   .slider__prev,
   .slider__next {
     height: auto;
     width: 32px;
   }
 }
 .border-bottom img {
  width: 100%;
  height: 55px;
}
.border-top img {
  width: 100%;
  height: 55px;
}

.scroll-inner {
  max-height: 210px;
  overflow: hidden;
  padding-right: 5px;
}

.scroll-inner:hover {
  overflow-y: auto;
  scrollbar-width: thin; 
}
::-webkit-scrollbar {
  width: 6px !important;
}

.home-about-section h2::first-letter {
  text-transform: capitalize;
}
.footer-reach ul {
  display: flex;
  gap: 10px;
  padding-top: 30px;
}
.footer-reach ul li img {
  height: 70px;
}
section.clients-section ul.grid{
  width: 75%;
  margin: 0 auto;
  padding-top:40px ;
}
.property_eight .property_content {
  top: -325px;
}
.property-icon.property_nine .property_content {
  top: -200px;}