:root{
  --dark:#000000;
  --brand-light:#81a69b;
  --brand-extra-light:#afd2c8;
  --white:#FFFFFF;
  --font-poppins:"Poppins", sans-serif;
}

.bg-brand {
	background-color: #2a5750!important;
}

.btn-outline-brand:hover {
	color: #fff !important;
	background-color: #2a5750;
	border-color: #5d72a57508ff;
}
 /* base styles */
 button:focus{outline: none;}
 input:focus{outline: none}
 a{cursor:  pointer;}
 .gap-10{
  gap: 10px;
 }

      /* text */
      .text--dark{color: var(--dark);opacity: 0.90;}
      .text--dark-body{color: var(--dark);opacity: 0.80;}

      .opacity-90{opacity: 0.90;}
      .opacity-80{opacity: 0.80;}
      .opacity-30{opacity: 0.30;}
  

    
      .z-index-123{z-index: 118;}


      .text-62{font-size: 62px;font-weight: 400;}
      .text-44{font-size: 44px;font-weight: 400;}
      .text-42{font-size: 42px;font-weight: 400;}
      .text-40{font-size: 40px;font-weight: 400;}
      .text-38{font-size: 38px;font-weight: 400;}
      .text-32{font-size: 32px;font-weight: 400;}
      .text-28{font-size: 28px;font-weight: 400;}
      .text-26{font-size: 26px;font-weight: 400;}
      .text-24{font-size: 24px;font-weight: 400;}
      .text-20{font-size: 20px;font-weight: 400;}
      .text-18{font-size: 18px;font-weight: 400;}
      .text-16{font-size: 16px;font-weight: 400;}

     
  
 
      .fw-900{font-weight: 900;}
      .fw-800{font-weight: 800;}
      .fw-700{font-weight: 700;}
      .fw-600{font-weight: 600;}
      .fw-500{font-weight: 500;}
      .fw-400{font-weight: 400;}
      .fw-300{font-weight: 300;}

      .rounded-20{border-radius: 20px;}
      .rounded-15{border-radius: 15px;}


      .letter-spacing-0{letter-spacing: 0%;}
      .letter-spacing-2{letter-spacing: -2%;}
      .letter-spacing-4{letter-spacing: -4%;}
      
      .lh-100{line-height: 100% !important;}
      .ls-4{letter-spacing: -4px;}
      
     
      

       .btn--outline-dark{
        background: transparent;
        color: var(--dark);
        border-radius: 50px;
        padding: 12px 24px;
        border: 1px solid var(--dark);
        transition: all ease 0.3s;
        margin-right: 10px;
        margin-bottom: 10px;
      }
      .btn--outline-dark:hover{
        transition: all ease 0.3s;
        background-color: var(--dark);
        color:var(--white) ;

      }
         .btn--white{
        background: var(--white);
        color: var(--dark);
        border-radius: 50px;
        padding: 12px 24px;
        border: 1px solid var(--white);
        transition: all ease 0.3s;
        margin-right: 10px;
        margin-bottom: 10px;
      }
      .btn--white:hover{
        transition: all ease 0.3s;
        background-color: var(--white);
        color:var(--dark) ;
        border: 1px solid var(--dark);

      }
  

      .splide__arrow{
        background: #000000bd !important;
        border: 1px solid black !important;
        padding: 13px !important;
        width: 40px !important;
        height: 40px !important;
      }
      .splide__slide{height: unset !important;}
      .splide__arrow svg{ fill:#FFFFFF !important}
      .owl-theme .owl-nav .disabled {opacity: .3 !important;}
      .splide__pagination__page.is-active {background: #000 !important;}
      .splide__pagination__page {border-radius: 5px !important;height: 6px !important;width: 18px !important;}

      html{
        overflow: scroll;
        scrollbar-color: var(--brand-light) var(--brand-extra-light);
        scrollbar-width: thin;
      }
      /* width */
::-webkit-scrollbar {
  width: 10px;
}

/* Track */
::-webkit-scrollbar-track {
  box-shadow: inset 0 0 5px grey; 
  border-radius: 10px;
}
 
/* Handle */
::-webkit-scrollbar-thumb {
  background: var(--brand-extra-light); 
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: var(--brand); 
}
      @media(max-width:1199.98px){
          .text-62{font-size: 55px;}
      }
      @media(max-width:992px){
          .text-62{font-size: 45px;}
          .text-44{font-size: 40px;}
          .text-42{font-size: 38px;}
          .text-40{font-size: 36px;}
          .text-38{font-size: 34px;}
      }
      @media(max-width:576px){
      .text-62{font-size: 35px;}
      .text-44{font-size: 36px;}
      .text-42{font-size: 34px;}
      .text-40{font-size: 32px;}
      .text-38{font-size: 30px;}
      .text-32{font-size: 28px;}
      .text-28{font-size: 22px;}
      .text-26{font-size: 20px;}
      .text-24{font-size: 18px;}
      .text-18{font-size: 16px;}
      }