/* Begin: Button Style */

.themeBtn {
    background-color: var(--primary);
    font-size: 1.125rem;
    font-weight: 500;
    text-transform: capitalize;
    color: var(--white);
    /* z-index: 2; */
    transition: all 0.4s ease-in-out;
    position: relative;
    padding: 1rem 1.5rem;
    display: inline-block;
    border-radius: 5px;
  }
  
  .themeBtn:before {
    content: "";
    position: absolute;
    inset: 0;
    border: 2px solid var(--primary);
    left: 0.5rem;
    right: -0.5rem;
    top: 0.5rem;
    bottom: -0.5rem;
    z-index: 1;
    transition: all 0.4s ease-in-out;
    border-radius: 5px;
  }
  
  .themeBtn:hover {
    background-color: #fff;
    color: var(--primary);
  }
  
  .themeBtn:hover::before {
    bottom: 0;
    left: 0;
    right: 0;
    top: 0;
  }
  
  .themeBtn2 {
    background: var(--white);
    color: var(--secondry);
  }
  
  .themeBtn2:before {
    border-color: var(--white);
  }
  
  .themeBtn2:hover::before {
    border-color: var(--primary);
  }
  
  .themeBtn-Black {
    background: var(--secondry);
    color: var(--white);
  }
  
  .themeBtn-Black:hover {
    color: var(--secondry);
  }
  
  .themeBtn-Black:before {
    border-color: var(--secondry);
  }
  
  .themeBtn-Black:hover::before {
    border-color: var(--secondry);
  }
  
  /* END: Button Style */
  .slick-dots {
    bottom: -3rem;
    display: flex;
    justify-content: center;
  }
  
  .slick-dots li button {
    width: 0.8rem;
    height: 0.6rem;
    background: var(--primary);
    border-radius: 100px;
    transition: ease all 0.5s;
  }
  
  .slick-dots li.slick-active button {
    width: 6rem;
  }
  
  .slick-dots li {
    width: auto;
  }
  
  .slick-dots li button:before {
    content: none;
  }
  
  .slick-prev:before,
  .slick-next:before {
    content: "\f177";
    color: var(--primary);
    font-family: "Font Awesome 5 Pro";
    font-size: 3rem;
  }
  
  .slick-next:before {
    content: "\f178";
  }
  
  .slick-prev.slick-arrow {
    top: -5rem;
    left: 0;
  }
  
  .slick-next.slick-arrow {
    right: 2rem;
    top: -5rem;
  }
  
  .provideSlider {
    margin-top: 8rem;
  }
  
  .slick-dots {
    bottom: auto;
    top: -7rem;
    display: flex;
    justify-content: center;
  }
  
  .slick-dots li button {
    width: 0.2rem;
    height: 2rem;
    background: var(--secondry);
  }
  
  .slick-dots li.slick-active button {
    width: 0.2rem;
    height: 5rem;
    background: var(--primary);
  }
  
  .reviewSec .slick-next.slick-arrow,
  .reviewSec .slick-prev.slick-arrow {
    top: 3rem;
    z-index: 1111;
  }
  
  .reviewSec .slick-dots {
    top: 3rem;
  }