
      :root {
        --font: calibri;
        --size-pri: 1px;
        --size-sec: 100px;
        --main-clr: #105e9b;
        --white: #fff;
      }

      .btn2 {
        background: none;
        display: flex;
        justify-content: center;
        align-items: center;
        min-width: 120.52px !important;
        /* min-height: 56px; */
        font-family: "Jost", serif !important;
        font-size: 16px;
        border-radius: 10px;
        cursor: pointer;
        font-weight: 400;
        position: relative;
        border: 2px solid var(--main-clr);
        color: var(--main-clr);
        background-color: transparent;
        overflow: hidden;
      }
      
      .blu-diamond-clr{
          color:#105e9b;
      }

      i {
        font-size: 1em;
        padding: 0 10px;
        transition: all 0.5s linear;
      }

      .btn2:hover img {
        transform: translateX(-10px);
      }
      .fw-500{
          font-weight:500;
      }
      
      .josty-font{
        font-family: "Jost", serif !important;
      }

      .btn2::before,
      .btn2::after {
        content: "";
        position: absolute;
        width: 100%;
        height: 100%;
        top: -100%;
        left: 0;
        background-color: var(--main-clr);
        z-index: -1;
        transition: all 400ms ease-in;
      }

      .btn2:hover {
        color: var(--white);
        background-color: var(--main-clr);
      }

      .btn2::before {
        opacity: 0.3;
      }

      .btn2::after {
        transition-delay: 0.3s;
      }

      .btn2:hover::before,
      .btn2:hover::after {
        top: 0;
      }

      .btn {
        background: none;
        display: flex;
        justify-content: center;
        align-items: center;
        min-width: 120.52px !important;
        /* min-height: 56px; */
        font-family: "Jost", serif !important;
        font-size: 16px;
        border-radius: 10px;
        cursor: pointer;
        font-weight: 400;
        position: relative;
        border: 2px solid var(--main-clr);
        color: var(--main-clr);
        background-color: transparent;
        overflow: hidden;
      }

      i {
        font-size: 1em;
        padding: 0 10px;
        transition: all 0.5s linear;
      }

      .btn:hover img {
        transform: translateX(-5px);
      }

      .btn::before,
      .btn::after {
        content: "";
        position: absolute;
        width: 100%;
        height: 100%;
        top: -100%;
        left: 0;
        background-color: var(--main-clr);
        z-index: -1;
        transition: all 400ms ease-in;
      }

      .btn:hover {
        color: #fff;
      }

      .btn::before {
        opacity: 0.3;
      }

      .btn::after {
        transition-delay: 0.3s;
      }

      .btn:hover::before,
      .btn:hover::after {
        top: 0;
      }

      .ht-box-images {
        display: flex;
        flex-direction: column;
        height: 100%;
      }

      .image-box-wrap {
        flex-grow: 1;
        display: flex;
        flex-direction: column;
      }

      .content {
        flex-grow: 1;
      }

      .row {
        align-items: stretch;
      }

      .owl-nav {
        display: block !important;
        opacity: 1 !important;
        visibility: visible !important;
      }

      .categories .categories-item {
        position: relative;
        border: 1px solid #105e9b;
        border-radius: 10px;
        transition: 0.5s;
        height: 150px;
        display: flex;
        align-items: center;
        justify-content: center;
      }

      .categories .categories-item-inner {
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
      }

      .categories .categories-content {
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 15px !important;
      }

      .categories .categories-content img {
        max-width: 100%;
        max-height: 100%;
        object-fit: contain;
      }

      .categories-carousel .owl-nav {
        position: absolute;
        top: 5% !important;
        width: 100%;
        transform: translateY(-50%);
        display: flex;
        justify-content: space-between;
        pointer-events: none;
        padding: 0 -15px;
      }

      .categories-carousel .owl-nav button.owl-prev,
      .categories-carousel .owl-nav button.owl-next {
        pointer-events: auto;
        width: 70px;
        height: 45px;
        background: #105e9b !important;
        border-radius: 15% !important;
        display: flex !important;
        align-items: center;
        justify-content: center;
        position: absolute;
        /* top: 50%; */
        transform: translateY(-50%);
      }

      .categories-carousel .owl-nav button.owl-prev {
        left: -20px;
        border-radius: 15% !important;
      }

      .categories-carousel .owl-nav button.owl-next {
        right: -20px;
      }

      .categories-carousel .owl-nav button i {
        color: white;
        font-size: 20px;
      }

      .categories-carousel .owl-nav button:hover {
        background: linear-gradient(170deg, #1a4682, #105e9b) !important;
      }

      .categories .categories-item-inner:hover {
        box-shadow: 0 0 50px rgba(9, 95, 255, 0.6) !important;
      }
      
      
        ul.custom-list {
    list-style-type: none; 
    padding-left: 0;
  }
  ul.custom-list li {
    position: relative;
    padding-left: 20px;
  }
  ul.custom-list li::before {
    content: "■"; 
    color: #4095d7; 
    position: absolute;
    left: 0;
  }
  
  

  
   .input-item select {
    display: block;
    width: 100%;
    height: 100%;
    border: none;
    font-size: 15px;
    border-bottom: 2px solid rgba(0, 0, 0, 0.12);
    background-color: transparent;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    cursor: pointer;
    outline: none;
  }
  
  /* Add a custom dropdown arrow */
  .input-item {
    position: relative;
  }
  
 .input-item:has(select)::after {
    content: "▼";
    font-size: 12px;
    color: #3498db;
    position: absolute;
    right: 5px;
    top: 5px;
    pointer-events: none;
}
  
  /* Style the focus state */
  .input-item select:focus ~ .input-underline:before,
  .input-item select:valid ~ .input-underline:before {
    transform: scale(1);
  }
  
  /* Handle the label movement */
  .input-item select:focus ~ label,
  .input-item select:valid ~ label {
    transform: translateY(-15px);
    font-size: 14px;
    color: #3498db;
  }


.justify{
    text-align:justify;
}

.border-bot::after {
    content: "";
    display: block;
    width: 50%;
    border-bottom: 2px solid #105e9b;
    margin-top: 5px; 
}

.grayy{
    color:gray;
}

.shadow-box-single{
    box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.2);
    border-radius:15px;
 
}


.image-wrapper {
    position: absolute;
    top: -50px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 2;
}


.image-wrapper-left {
    position: absolute;
    left: -50px; 
    top: 20px; 
    z-index: 2;
}

.mr-cutom{
    margin-left:30px;
}
.mr-cutom2{
    margin-left:40px;
}


  @media (max-width: 576px) {
      .ul-responsive  {
    margin-left:15px !important;
  }
    .ps-responsive{
    padding-left:45px !important;
}
  }
  @media (max-width: 766px) {
      .ul-responsive  {
    margin-left:15px !important;
  }
  
  .ps-responsive{
    padding-left:45px !important;
}

  }
  
  
  
  
  
      .input-row {
      display: flex;
      gap: 20px;
      margin-bottom: 15px;
      flex-wrap: wrap;
    }
    .input-item {
      flex: 1;
      display: flex;
      flex-direction: column;
      position: relative;
    }
    input, textarea, select {
      padding: 10px;
      border: 1px solid #ccc;
      border-radius: 5px;
      outline: none;
    }
    label {
      margin-top: 5px;
      font-size: 14px;
      color: #333;
    }
    .btn2 {
      padding: 10px 20px;
      background: #007BFF;
      color: white;
      border: none;
      border-radius: 5px;
      cursor: pointer;
    }
    .btn2:hover {
      background: #0056b3;
    }

     