/* START nav menu */

.navbar-nav li:hover .dropdown-menu {
        display: block;
    }
ul.header-socialmedia {
    display: inline-flex;
    list-style: none;
    margin-bottom: 0px;
  }
  ul.header-socialmedia li{
    margin-right: 25px;
  }
  .header-btn a{
    font-size: 16px;
    line-height: 20.03px;
    color: #fff;
    text-decoration: none;
    border: 1px solid #fff;
    padding: 10px 16px;
    font-weight: 700;
  }
  .header-btn a img{
    margin-right: 5px;
    margin-top: -4px;
  }
  /*nav.navbar{*/
  /*  padding: 15px 0px;*/
  /*}*/
  .header-btn {
    margin-left: 17px;
  }
  /* ul.navbar-nav{
    margin-left: 140px;
  } */

  @media (min-width:1110px){
      
    

    .nav-link.active::after{
     content: "";
  display: block;
  position: absolute;
  left: 0;
  width: 0;
  bottom: 0;
  height: 2px;
  background-color: #fff;
  transition: .3s all;
   width: 100%;
    }
   .sticky .nav-link.active::after{
     content: "";
  display: block;
  position: absolute;
  left: 0;
  width: 0;
  bottom: 0;
  height: 2px;
  background-color: #000;
  transition: .3s all;
   width: 100%;
    } 
    
    
    .navbar .nav-link {
      color: #fff !important;
      transition: color 0.3s;
  }
  }

  
@media (max-width:1100px){
    .dropdown-menu{
        border:0;
        padding-bottom:0px;
        padding-top:20px;
    }
  .navbar-nav li{
    padding-top: 9px;padding-bottom: 15px;border-bottom: 1px solid #e4e0e0;
  }
  nav.navbar {
    background-color: #fff;
    
} 
a.nav-link{
  color: #000!important;
}
}

  @media (max-width: 767px) {
    
    a.nav-link:hover {
      color: #231549 !important;
  }
    ul.navbar-nav{
      margin-left: 15px;
    }
    .navbar-collapse{
      background-color: #fff;
    }
    
  }
  .navbar-toggler:focus {
    text-decoration: none;
    outline: 0;
    box-shadow: 0px 0px 0 0rem!important;
}


  a.nav-link {
    color: #fff;
    font-size: 14px;
    line-height: 17.36px;
    padding: 0px !important;
    margin-right: 45px;
  }
  /*a.nav-link:hover{*/
  /*  text-decoration: underline;*/
  /*}*/
  /* .navbar {
    background-color: transparent;
    transition: background-color 0.3s ease;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1000;
  } */
  .navbar.scrolled {
    background-color: #000;
  }
  a.nav-link:hover{
    font-weight: 500;
  }




/* Initial transparent background */
.navbar {
  transition: background-color 0.3s, top 0.3s;
  background-color: transparent;
}

@media (min-width: 992px) {
    .navbar-expand-lg .navbar-nav .dropdown-menu {
        position: absolute;
        top: 30px;
    border-radius: 4px;padding: 4px 0px 4px 0px;border-top:1px solid #000;
    }
    .dropdown-menu{
        border-top: 1px solid #000;
    }
    .mt-md-2-5{
      margin-top: 0.6rem !important;  
    }
    
    }

.dropdown-item{
    font-size:15px;
}
/* Sticky navbar styles */
@media (min-width: 768px) { /* Only apply sticky styles on desktop */
 
  .bdr-line-rght{
    height: 150px;
    border-right: 1px solid #000;
  }


  .nav-item .navlink{
    padding: 9px 0px !important;
  }  
  .navbar.sticky {
      background-color: #fff;
  }

  /* Logo styling */
  .navbar .logo {
      transition: all 0.3s;
  }

  /* Initial light font color */
  

  /* Dark font color when sticky */
  .navbar.sticky .nav-link {
      color: #000 !important;
  }
}

/* Dark font color when sticky */
.navbar.sticky .nav-link {
    color: #000 !important;
}
  
  /* END :nav menu */
  
  /* START: Home banner video  */
  .video-background-holder {
    position: relative;
    background-color: black;
    height: calc(100vh - 72px);
    min-height: 35rem;
    width: 100%;
    overflow: hidden;
  }
  
  .video-background-holder video {
    position: absolute;
    top: 50%;
    left: 50%;
    /* min-width: 100%; */
    min-height: 100%;
    width: 100%;
    height: auto;
    z-index: 0;
    -ms-transform: translateX(-50%) translateY(-50%);
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
  }
  
  .video-background-content {
    position: relative;
    z-index: 2;
  }
  
  .video-background-overlay {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background-color: black;
    opacity: 0.35;
    z-index: 1;
  }
  
  .text-rainbow-animation {
    background-image: 
      linear-gradient(to right, #73B7FF,#ffffff,#ffffff,#ffffff,#73B7FF,#ffffff,#73B7FF); 
    -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;  
    animation: rainbow-animation 900s linear infinite;
  }
  @keyframes rainbow-animation {
    to {
        background-position: 4500vh;
    }
  }
  .home-banner p{
    color: #fff;
    line-height: normal;
    font-size:18px;
  }

  @media only screen and (min-device-width : 767px) and (max-device-width : 1100px) {
    .video-background-holder video{
      width: 130%!important;
    }
    .video-background-holder{
      height: calc(56vh - 72px)!important;
    }
  }

  @media (max-width: 767px) {
  .video-background-holder video{
    width: auto;
    height: auto;
  }

  }
   /* END: Home banner video  */

   /* Who we are */

   .logo-rotate{
   
    animation: rotation 20s infinite linear;
  }
  
  @keyframes rotation {
    from {
      transform: rotate(0deg);
    }
    to {
      transform: rotate(360deg);
    }
  }

  /* Who we are image box part */
  .image-box-part .image-container {
    position: relative;
    width: 100%;
    margin: auto;
    overflow: hidden;
  }
  .image-box-part .image-door {
    position: absolute;
    width: 50%;
    height: 100%;
    background-color: #fff;
    transition: transform 2s ease-in-out;
    z-index: 10;
  }
  .image-box-part .image-door.left {
    left: 0;
    transform-origin: left;
  }
  .image-box-part .image-door.right {
    right: 0;
    transform-origin: right;
  }
  .image-box-part .image-section {
    opacity: 0;
    transition: opacity 2s ease-out;
  }
  .image-box-part .image-section.in-view .image-door.left {
    transform: rotateY(-90deg);
  }
  .image-box-part .image-section.in-view .image-door.right {
    transform: rotateY(90deg);
  }
  .image-box-part .image-section.in-view {
    opacity: 1;
  }
  .who-we-are .image-section p{margin: 0 auto;
    left: 0;
    top: 70%;
    position: absolute;
    right: 0;}

    .who-we-are .image-section .btn-outline-dark{
      position: absolute;
      left: 45%;
      top: 79%;
    }
    @media (max-width: 767px) {

    .who-we-are .image-section p{margin: 0 auto;
      left: 0;
      top: 55%;
      position: absolute;
      right: 0;}

      .who-we-are .image-section a{
        top: auto;
        bottom: 35px;
        left: 0;
        right: 0;position: absolute;
      }
      .who-we-are .image-section .btn-outline-dark{
        position: unset;
      }
     
    }.who-we-are span{margin-left: 20px;}
  
    .logo-rotate{position: relative;
      right: 106px;}
      @media (max-width: 380px) {

        .who-we-are .image-section p{
          top: 45%;
        }
        }
      @media only screen and (min-device-width : 767px) and (max-device-width : 1100px) {
      .logo-rotate {
        position: relative;
       
    }
    .who-we-are span {
      margin-left: 0px;
  }
    }
   /*END: Who we are image box part */

   .current-factory{
background: url('../images/current-factory-bg.png') no-repeat center center;background-size: cover;
   }
   .current-factory .more-details p{
    font-size: 18px;
   }

   .swiper {
    width: 100%;
    height: 100%;
  }

  .swiper-slide {
    text-align: center;
    font-size: 18px;
    background: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .swiper-slide img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  

   /*hide default arrows*/
 .certificates-sec [class^="swiper-button-"]::after{
    content: "";
}
.certificates-sec .swiper-button-prev, .certificates-sec .swiper-button-next{
    position:absolute;
}
.certificates-sec .swiper-button-next{
    left: 57%;
    top: auto;
    padding-top: 70px;
}
.certificates-sec .swiper-button-prev{left: 41%;top: auto;padding-top: 70px;}
.certificates-sec .swiper-custom-page.swiper-pagination{
    bottom:auto;position: absolute;padding-top: 33px;}
.swiper-pagination-bullet-active{
    background: #000000!important;}

@media (max-width: 767px) {
  .certificates-sec .swiper-button-next{
    left: 54%;
    top: auto;
    padding-top: 70px;
}
.certificates-sec .swiper-button-prev{
  left: 40%;
    top: auto;
    padding-top: 70px;
}
    .swiper-custom-page.swiper-pagination{display: none;}
}
@media only screen and (min-device-width : 767px) and (max-device-width : 1100px) {
    .certificates-sec .swiper-button-prev{left: 33%;}
    .certificates-sec .swiper-button-next{left: 63%;}
 }
@media (min-width: 1660px) {
    .certificates-sec .swiper-button-prev{left: 42%;}
    .certificates-sec .swiper-button-next{left: 56%;}
}
.founder-bg-box{
    background: #EBF0F6;padding-bottom: 40px;padding-top: 50px;border-radius: 32px;margin: 0 auto;
    max-width: 1075px;}


    /* footer */
    @media (min-width: 1200px) {
    .footer-list{display: flex;justify-content: space-between;}
    }
    .footer-list ul, .footer-list ul a{
        list-style: none;
        text-decoration: none;color: #4B5056;padding: 0;
    }
    .ftr-addr:before{ content: url(../images/location.svg);    padding-right: 10px;
        position: relative;
        top: 5px;}
.ftr-phone:before{ content: url(../images/call-icon-1.svg);    padding-right: 10px;
    position: relative;
    top: 5px;}
.ftr-email:before{ content: url(../images/envelope.svg);    padding-right: 10px;
    position: relative;
    top: 5px;}
footer h5{
    color: #0B2E5D;font-weight: 600;padding-bottom: 10px;
}
.ftr-addr{display: flex;padding: 0;list-style: none;color: 
    #4B5056;}
.ftr-phone a, .ftr-email a{text-decoration: none;color: 
    #4B5056;}

    .footer-btm{
        padding: 15px 0;
        border-top: 1px solid;
    }
    .ftr-social{
        padding-top: 20px;
    }
    .ftr-social a{
        padding-right: 5px;
    }
    .footer-list ul li{
        padding-top: 5px;
    }
    .email-form-box{
        background: #EBF0F6;border-radius: 
        10px;padding: 20px;width: 250px;
    }
    
    footer .form-control {
        text-align: center;
        border: 2px solid #00000026;
        padding: .275rem .75rem;
    }
    @media (max-width: 767px) {
      .hover-box {
        margin: 0 auto;
        width: 100% !important;      
      }
      .hover-content img {
        width: 100%;
        height: auto;
        margin-bottom: 10px;
    }

    }
 @media (min-width: 1330px) {
  .hover-box {
    width: 315px!important;
    height: 344px!important;
  }
  
 }

 @media only screen and (min-device-width : 767px) and (max-device-width : 1100px) {
  .hover-box {
    width: 100%!important;
    height: 344px!important;
  }
  .hover-content img {
    width: 100%;
}

 }

 @media (min-width: 767px) {
    .hover-box {
      width: 274px;
    height: 295px;
    position: relative;
    border-radius: 10px;
    overflow: hidden;
    cursor: pointer;
  }
}
.hover-box {
  width: 274px;
height: 295px;
position: relative;
border-radius: 10px;
overflow: hidden;
cursor: pointer;
}
  .hover-content {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      background-color: rgba(0, 0, 0, 0.8);
      color: white;
      opacity: 0;
      transition: opacity 0.3s ease;
      text-align: center;
  }
  
  .hover-box:hover .hover-content {
      opacity: 1;
  }
  
  .hover-content img {
      max-width: 100%;
      height: auto;
      margin-bottom: 10px;
  }
  
  .hover-content p {
    padding: 20px;
    position: absolute;
    color: #fff;
      margin: 0;
  }
  .hover-box .title{
    position: absolute;
    left: 0;
    right: 0;
    bottom: 5px;
    line-height: 30px;
    font-size: 20px;
  }
  .hover-box .number{
    position: absolute;
    left: 20px;
    top: 20px;
    color: #fff;font-size: 40px;
  }

  .our-services{
    background: #F4F3F1;padding-bottom: 130px;
  }

.our-services .swiper-slide img{
    border: 1px solid #D9D9D9;
    border-radius:20px;
}



  @media (max-width: 767px) {
    .our-services .swiper-pagination-service{display: none;}
    .swiper-custom-page.swiper-pagination{display: none;}
}
@media only screen and (min-device-width : 767px) and (max-device-width : 1100px) {
    .our-services .swiper-button-prev{left: 35%;}
    .our-services .swiper-button-next{left: 62%;}
 }


 .our-services .swiper-button-prev, .our-services .swiper-button-next{
  position:absolute;
}
.our-services .swiper-button-next{
  left: 55%;
  top: auto;
  padding-top: 70px;
}
.our-services .swiper-button-prev{left: 43%;top: auto;padding-top: 70px;}
.our-services .swiper-custom-page.swiper-pagination{
  bottom:auto;position: absolute;padding-top: 33px;}

  .certificates-sec [class^="swiper-button-"]::after, .our-services [class^="swiper-button-"]::after, .about-page-sliderservices [class^="swiper-button-"]::after{
    content: "";
}

.our-services h4{
  right: 0;
    left: 0;
    bottom: 20px;
    position: absolute;
    text-align: center;color: #fff;
}
.our-services .swiper-pagination-service{
  bottom: auto!important;
  position: absolute;
  padding-top: 33px;text-align: center;
}

@media (max-width: 767px) {
  .video-cta video{
    width: 100%;
      height: 300px;
      object-fit: cover;
      z-index: -100;border-radius: 20px;
  }
}
@media (min-width: 767px) {
.video-cta video{
  width: 100%;
    height: 500px;
    object-fit: cover;
    z-index: -100;border-radius: 20px;
}
}
.our-services .swiper-slide{background-color: transparent;}


#home-top-video:before {
  content: '';
  position: absolute;
  height: 100%;
  width: 100%;
  background: rgba(255,0,255,0.2); 
}
#home-text {
  position: absolute;
  left: 50%;
  text-align: center;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  color: #fff;
  z-index:1;    top: auto;
  margin-top: -110px;
}
@media (max-width: 767px) {
  .email-form-box {
    background: #EBF0F6;
    border-radius: 10px;
    padding: 20px;
    width: 80%;
}
  #home-text {width: 100%;}
}

/* .navbar-toggler-icon{
  background-image: url('data:image/svg+xml;charset=utf8,%3Csvg xmlns="http://www.w3.org/2000/svg" width="30" height="30" viewBox="0 0 30 30"%3E%3Cpath stroke="white" stroke-width="2" d="M5 7h20M5 15h20M5 23h20"/%3E%3C/svg%3E');
} */
.navbar-toggler.close-icon .navbar-toggler-icon {
  background-image: url('data:image/svg+xml;charset=utf8,%3Csvg xmlns="http://www.w3.org/2000/svg" width="30" height="30" viewBox="0 0 30 30"%3E%3Cpath stroke="black" stroke-width="2" d="M5 5l20 20M5 25l20-20"/%3E%3C/svg%3E');
}




.scroll-top {
  --ghost-accent-color: royalblue;
	position: fixed;
  z-index: 50;
  padding: 0;
	right: 20px;
	bottom: 20px;
	opacity: 0;
	visibility: hidden;
	transform: translateY(15px);    
	height: 46px;
	width: 46px;
	cursor: pointer;
	display: flex;
  align-items: center;
  justify-content: center;
	border-radius: 50%;
  transition: all .4s ease;
  border: none;
  box-shadow: inset 0 0 0 2px #ccc;
  color: #ccc;
  background-color: #fff;
}

.scroll-top.is-active {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.scroll-top .icon-tabler-arrow-up {
  position: absolute;
  stroke-width: 2px;
  stroke: #333;
}

.scroll-top svg path { 
	fill: none; 
}

.scroll-top svg.progress-circle path {
	stroke: #333;
	stroke-width: 4;
  transition: all .4s ease;
}

.scroll-top:hover {
  color: var(--ghost-accent-color);
}

.scroll-top:hover .progress-circle path, .scroll-top:hover .icon-tabler-arrow-up {
  stroke: var(--ghost-accent-color);
}

.content { max-width: 640px; margin: 0 auto; }



@media only screen and (min-device-width : 767px) and (max-device-width : 1100px) {
  .w-md-100{
    width: 100% !important;
  }
.ml-md-20{margin-left: 20px;}
#home-text
{
  margin-top:-145px;
}
}


.swiper-wrapper{
  transition-timing-function: linear;
}


/* CONTACT US PAGE CSS STARTS */
@media (min-width: 768px) {
  .banner-title{
    height: 420px; /* Adjust to your needs */
    display: flex;
    align-items: flex-end; /* Aligns items to the bottom */
  }
.page-banner{
  background-attachment: fixed;
    min-height: 500px;
  }
}
@media (min-width: 1440px) {
  .banner-title{
    height: 640px; /* Adjust to your needs */
    display: flex;
    align-items: flex-end; /* Aligns items to the bottom */
  }
  .page-banner{
    background-attachment: fixed;
    min-height: 700px;
  }
}
@media (max-width: 768px) {
  .banner-title{
    height: 325px; /* Adjust to your needs */
    display: flex;
    align-items: flex-end; /* Aligns items to the bottom */
  }
  .page-banner{
    background-attachment: fixed;
    min-height: 350px;
  }
}


.form-section{
  background: url('../images/contact-us/contact-us-bg.jpg') no-repeat center center;background-size: cover;
}

.form-box, .contact-address-box{
  font-family: poppins;
  padding: 42px 32px 42px 32px;
  box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
  background:#FFFFFF;
}
.form-box p{
  font-size: 14px;
}
.form-box .form-control{
border: 1px solid #A8A5A5;
border-radius: 0px;}
.form-box .btn-primary{
  padding: 7px 100px 7px 100px;
}

.form-box .btn-primary:hover{
  border-color: black;
  color: black;
  background-color: white;
}

/* CONTACT US PAGE CSS END */



/* ABOUT US PAGE CSS START */



.about-page-sliderservices h4{
  bottom: 24px;
  position: absolute;
  left: 0;
  right: 0;
text-align: center;font-weight: 600;
}
.company-mission .img-box{
  width: 100%;
    height: 350px;
    position: relative;
    border-radius: 5px;
    overflow: hidden;
    cursor: pointer;
}

@media (min-width: 1330px) {
  .about.board-of-directors .image-container{
    position: relative;
    width: auto; /* Adjust the width as needed */
  }
}
@media (max-width: 1300px) {
.about.board-of-directors .image-container{
  position: relative;
  width: 270px; /* Adjust the width as needed */
}
}

.about.board-of-directors ::-webkit-scrollbar {
  width: 4px;
}


.about.board-of-directors ::-webkit-scrollbar-track {
  background: #f1f1f1;
}

/* Handle */
.about.board-of-directors ::-webkit-scrollbar-thumb {
  background: rgba(11, 46, 93, 0.8);
}

/* Handle on hover */
.about.board-of-directors ::-webkit-scrollbar-thumb:hover {
  background: rgba(11, 46, 93, 0.8);
}







@media only screen and (min-device-width : 767px) and (max-device-width : 1100px) {
  .about.board-of-directors .image-container {
    position: relative;
    width: auto!important;
}
}

.about.board-of-directors .image-container img {
  width: 100%;
  height: auto;
  display: block;
}

.about.board-of-directors .overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(11, 46, 93, 0.8); /* Adjust the color and opacity as needed */
  color: white;
  display: flex;
  justify-content: center;
  align-items: center;
  opacity: 0;
  transition: opacity 0.3s ease;
}

.about.board-of-directors .image-container:hover .overlay {
  opacity: 1;
}

.about.board-of-directors .content p{
  text-align: center;color:#fff;font-size: 15px;padding:20px;
  height: 250px; 
     overflow-x: auto;
}
.board-of-directors .name{
border-bottom: 1px solid #000000;padding-top: 20px;padding-left: 15px;
}
.board-of-directors .name p{
  color:#0B2E5D;
}
.board-of-directors .name img{
  float: right;
  margin-top: -20px;
}
@media (max-width: 767px) {
  .company-mission .img-box p{
    font-size: 12px;
  }
  .about.board-of-directors .image-container{
    width: 100% !important;
  }
.board-of-directors .name img{
width: 40px!important;
}
}

.board-mobile [class^="swiper-button-"]::after{
  content: "";
}
.board-mobile .name{
  text-align: left;padding-left: 10px;padding-right: 10px;
} 
/* ABOUT US PAGE CSS END */

/* Sustainability PAGE CSS START */
@media (min-width: 767px) {
  .sustainability-sec .inner-box{
    padding: 25px;background:rgba(255, 255, 255, 0.4);border-radius: 
    15px;height: 100%;
  }
  .sustainability-btm-cta .bg-sec{
    height: 500px;
    }
    .sustainability-btm-cta .inner-txt{
      top: 56%;
    }
  }
  
  @media (max-width: 767px) {
    .sustainability-btm-cta .inner-txt{
      top: 23%;
    }
    .sustainability-btm-cta .bg-sec{
      height: 330px;
      }
    .sustainability-sec .inner-box{
      padding: 10px;background:rgba(255, 255, 255, 0.4);border-radius: 
      15px;height: 100%;
    }
    .sustainability-sec .inner-box p{
      color:#fff;font-size: 14px;
    } 
  }
  .sustainability-sec .inner-box p{
    color:#fff;
  }
  .social-sec .grey-box{
    background: #F3F6FA;
  }
  .social-sec .grey-box ul li{
    padding-bottom: 10px;
  }
  .sustainability-btm-cta .inner-txt{
    color: #fff;
  }
  .sustainability-btm-cta .inner-txt{
  position: relative;
      left: 0;
      right: 0;  
  }
  .accordion-item:first-of-type>.accordion-header .accordion-button{
    background-color: aliceblue;border: 0;
  }
  .accordion-header, .accordion-body, .accordion-button{
    border: 0;
    background-color: aliceblue!important;font-family: poppins;
  }
  
  .accordion-button:not(.collapsed)::after{
    background: url('../images/arrow-round-up.svg')!important;width: 40px;
    height: 40px;
  }
  .accordion-button::after{
    background: url('../images/arrow-round-up.svg')!important;width: 40px;
    height: 40px;
  }
  @media (min-width: 767px) {
  .accordion-item .accordion-header button{
    font-size:24px;font-weight: 600;color:#000000;
  }
  .accordion-body{
    color:#4B5056;font-size:16px;
  }
  }
  @media (max-width: 767px) {
    .highlights .row{
      display: flex;
      flex-direction: column-reverse;
    }
    .accordion-item .accordion-header button{
      font-size:20px;font-weight: 600;color:#000000;
    }
    .accordion-body{
      color:#4B5056;font-size:14px;
    }
    }
    .accordion-button:not(.collapsed){
      box-shadow: none;
    }
    .accordion-item{
      border:none;
    }
  
    .practices .buttons {
      top: 50%;
    position: relative;
    z-index: 99;
    bottom: 200px;
    left: 55%;
    }
    .buttons #prev{
      padding-right: 20px;cursor: pointer;
    }
    .buttons #next{
      cursor: pointer;
    }

    .practices #slide{
      width:100%;
      /*margin-top:50px;*/
  }
  .practices .item{
      width:200px;
      height:300px;
      background-position: 50% 50%;
      display: inline-block;
      transition: 2.5s;
      background-size: cover;
      position: absolute;
      z-index: 1;
      top:25%;
      transform: translate(0,0%);
      border-radius: 20px;
      box-shadow:  0 30px 50px #505050;
  }
  .practices .item:nth-child(1),
  .practices .item:nth-child(2){
      left:0;
      top:0;
      transform: translate(0,0);
      border-radius: 0;
      width:100%;
      height:100%;
      box-shadow: none;
  }
  .practices .item:nth-child(3){
      left:50%;
  }
  .practices .item:nth-child(4){
      left:calc(50% + 220px);
  }
  .practices .item:nth-child(5){
      left:calc(50% + 440px);
  }
  .practices .item:nth-child(n+6){
      left:calc(50% + 660px);
      opacity: 0;
  }
  .practices .item .content{
      position: absolute;
      top:66%;
      left:50px;
      width:300px;
      text-align: left;
      padding:0;
      color:#eee;
      transform: translate(0,-50%);
      display: none;
      font-family: system-ui;
  }
  .practices .item:nth-child(2) .content{
      display: block;
      z-index: 11111;
  }
  .practices .item .name{
      font-size: 40px;
      font-weight: bold;
      opacity: 0;
      animation:showcontent 1s ease-in-out 1 forwards
  }
  .practices .item .des{
      margin:20px 0;
      opacity: 0;
      animation:showcontent 1s ease-in-out 0.3s 1 forwards
  }
  .practices .item button{
      padding:10px 20px;
      border:none;
      opacity: 0;
      animation:showcontent 1s ease-in-out 0.6s 1 forwards
  }
  .practices .item .button{
      padding:10px 20px;
      border:none;
      opacity: 0;
      animation:showcontent 1s ease-in-out 0.6s 1 forwards
  }
  @keyframes showcontent{
      from{
          opacity: 0;
          transform: translate(0,100px);
          filter:blur(33px);
      }to{
          opacity: 1;
          transform: translate(0,0);
          filter:blur(0);
      }
  }
  
  
  
  /*.item:nth-child(3) {
      right: 440px;
      left: auto;
  }
  
  .item:nth-child(n+6) {
      right: 0;
      left: auto;
  }
  
  .item:nth-child(5) {
      left: auto;
      right: 0;
  }
  
  .item:nth-child(4) {
      right: 220px;
      left: auto;
  }
  .item button {
      color: #000;
  }*/
  .practices div#slide {
      position: relative;
      height: 700px;
      width: 100%;
      display: inline-block;
  }
  .practices .item:nth-child(5) {
      left: calc(80% + 40px);
  }
  .practices .item:nth-child(4) {
      left: calc(65% + 20px);
  }
  .practices .item:nth-child(3) {
      left: 50%;
  }
  .practices .item {
      width: 15%;
  }
  .practices .item button {
      color: #000;
  }
  .practices .item:nth-child(2):before {
      content: "";
      position: absolute;
      width: 100%;
      height: 100%;
      background-color: rgb(0 0 0 / 24%);
      top: 0;
      left: 0;
  }
  .practices .item:nth-child(1) {
      z-index: 0;
  }
  .practices .item:nth-child(2) {
      z-index: 1;
  }
  .practices .item:nth-child(n+6) {
      z-index: -1;
  }
  @media(max-width: 992px){
    .practices div#slide {
          height: 575px;
      }
  
      .practices .item .content {
          top: 25%;
      }
  
      .practices .item {
          height: 178px;
      }
  
      .practices .item {top: 52%;}
  }
  @media(max-width: 768px){
    .practices .item:nth-child(3) {
          left: calc(50px);
      }
  
      .practices .item:nth-child(4) {
          left: calc(25% + 40px);
      }
  
      .practices .item {
          width: 20%;
      }
  
      .practices .item:nth-child(5) {
          left: calc(50% + 30px);
      }
  }
  
  .practices {
    overflow-x: hidden;
  }
  .practices .static-content{
    z-index: 999;
    position: relative;
    top: 350px;
    left: 50px;
    width: 400px;
    margin-top: -240px;
  }


  @media(min-width: 1330px){

  .practices .item .content{
    
    width:500px!important;
   
  }
  .static-content{
    width:500px!important;
  }
}
.mbl-content, .mbl-content p{
  color: #fff;
}

.mbl-content{
  top: 20%;
  position: absolute;
}


.practice-mtl .swiper-slide img {
  display: block;
  width: 100%;
  height: 550px;
  object-fit: cover;max-width: max-content;
}

@media only screen and (min-device-width : 767px) and (max-device-width : 1100px) {

  .practice-mtl .swiper-slide img {
    padding: 10px;
    display: block;
    width: 100%;
    height: 600px;
    object-fit: cover;
    max-width: max-content;
}
}


@media (min-width: 1200px){
  .navbar .dropdown .dropdown-menu {
    display: block;
    position: absolute;
    left: 5px;
    top: calc(100% + 30px);
    margin: 0;
    padding: 0;
    z-index: 99;
    opacity: 0;
    border: none !important;
    visibility: hidden;
    background: #000 !important;
    box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.25);
    transition: 0.3s;
    border-radius: 0;
}

.dropdown-menu{background-color: #000 !important;}
.navbar .dropdown:hover>.dropdown-menu {
  opacity: 1;
  top: 100%;
  visibility: visible;
}

}



@media (min-width: 1000px) {
    .navbar .navbar-nav li {
        margin: 0 0px!important;
        display: flex!important;
        align-items: center!important;
        padding: 15px 0!important;
    }
    nav .dropdown-item{
        padding: 9px 15px;
    color: #000000;
    white-space: nowrap;
    background-color: #ffffff;
}
nav .dropdown-item:hover{
    color:#fff;
    background-color: #161849;
}
}




/*.navbar a {*/
/*  color: #fff;*/
/*  text-decoration: none;*/
/*  display: inline-block;*/
/*  position: relative;*/
/*}*/
/*.navbar ul li a:after {    */
/*  background: none repeat scroll 0 0 transparent;*/
/*  bottom: 0;*/
/*  content: "";*/
/*  display: block;*/
/*  height: 2px;*/
/*  left: 50%;*/
/*  position: absolute;*/
/*  background: #fff;*/
/*  transition: width 0.3s ease 0s, left 0.3s ease 0s;*/
/*  width: 0;*/
/*}*/
/*.navbar a:hover:after { */
/*  width: 100%; */
/*  left: 0; */
/*}*/


@media (min-width: 1000px) {
.nav__header {
	text-transform: uppercase;
	font-weight: 700;
	margin-bottom: 20px;
  font-size: 20px;
  color: #313131;
}

.nav__list {
	list-style: none;
	padding: 0;
	margin: 0;
}

.nav__link {
	text-decoration: none;
  font-size: 18px;
  color: #4f4f4f;
  box-sizing: border-box;
  padding: 2px 0;
  line-height: 1.3;
  transition: .3s all;
  position: relative;
}

.sticky .nav__link:after {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  width: 0;
  bottom: 0;
  height: 2px;
  background-color: #4f4f4f;
  transition: .3s all;
}

.nav__link:after {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  width: 0;
  bottom: 0;
  height: 2px;
  background-color: #fff;
  transition: .3s all;
}


.nav__link:hover:after {
  width: 100%;
}

}
  /* Sustainability PAGE CSS END */