.box-image-banner-login {
    max-width: 100%;
    position: relative;
    border-radius: 32px;
    overflow: hidden;
}

.animated-border {
    position: relative;
    display: inline-block;
    padding: 5px 5px 5px 5px; /* Kenar boşluğu çerçeve için */
    border-radius: 32px; /* İç resimle aynı yarıçap */
    background: linear-gradient(-270deg, transparent,#22D1EE  20%,  #C5FF41  40%, transparent 60%, transparent);
    background-size: 200% 100%;
    animation: animateBorder 3s linear infinite;
}

@keyframes animateBorder {
    0% {
        background-position: 0% 0%;
    }
    100% {
        background-position: 200% 0%;
    }
}

/* CUSTOM SELECTBOX BEGIN */

/* The container must be positioned relative: */
.custom-select {
    position: relative;
  }

  .custom-select select {
    display: none; /*hide original SELECT element: */
    font-size: 22px;
  }

  .select-selected {
    background-color: #FFFFFF;
    height:54px;
    width:100%;
  }

  /* Style the arrow inside the select element: */
  .select-selected:after {
    overflow-y: auto;
    position: absolute;
    content: "";
    top: 14px;
    right: 10px;
    width: 0;
    height: 0;
    border: 6px solid transparent;
    border-color: #fff transparent transparent transparent;
  }

  /* Point the arrow upwards when the select box is open (active): */
  .select-selected.select-arrow-active:after {
    border-color: transparent transparent #fff transparent;
    top: 7px;
  }

  /* style the items (options), including the selected item: */
  .select-items div,.select-selected {
    color: black;
    /* padding: 8px 16px; */
    border: 1px solid transparent;
    border-color: transparent transparent rgba(0, 0, 0, 0.1) transparent;
    cursor: pointer;
    font-size:18px;
  }


  /* Style items (options): */
  .select-items {
    position: absolute;
    background: linear-gradient(236deg, #22D1EE 0%, #C5FF41 100%);
    top: 100%;
    left: 0;
    right: 0;
    z-index: 99;
    max-height: 350px; /* İstediğiniz max yükseklik */
    overflow-y: auto;  /* Dikey kaydırma çubuğunu etkinleştirir */
  }


  /* Webkit tarayıcılar için (Chrome, Safari) */
    .select-items::-webkit-scrollbar {
        width: 12px; /* Kaydırma çubuğu genişliği */
        background: rgba(0, 0, 0, 0.1); /* Kaydırma yolu rengi */
        border-radius: 6px; /* Kaydırma yolu köşeleri */
    }

    .select-items::-webkit-scrollbar-thumb {
        background: #007bff; /* Kaydırma çubuğu rengi */
        border-radius: 6px; /* Kaydırma çubuğu köşeleri */
    }

    .select-items::-webkit-scrollbar-thumb:hover {
        background: #0056b3; /* Üzerine gelince kaydırma çubuğu rengi */
    }

    /* Firefox için */
    .select-items {
        scrollbar-width: thin; /* Kaydırma çubuğu genişliği */
        scrollbar-color: #C5FF41 rgba(0, 0, 0, 0.1); /* Kaydırma çubuğu rengi ve yolu */
    }

  /* Hide the items when the select box is closed: */
  .select-hide {
    display: none;
  }

  .select-items div:hover, .same-as-selected {
    background-color: rgba(0, 0, 0, 0.1);
  }
/* CUSTOM SELECTBOX END */