@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

  html {
  position: relative;
  overflow-x: hidden !important;
  font-family: "Poppins";
  }

  .name{
    font-size: 13px !important;
font-weight: 600;
  }
  * {
  box-sizing: border-box;
  }

  body {
      background-color: #d9d8d8;
      font-family: "Poppins" !important;
      color: #333;
      transition: .4s;
    }
    .box-bg {
      background-color: #fff;
      border-radius: 8px;
      box-shadow: rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px;
    }

    .box-bg-dark {
      background-color: #fff;
      border-radius: 8px;
      display: flex;
      align-items: center;
      padding: 0px;
      box-shadow: rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px;
    }

    .box-bg-dark2 {
      background-color: #fff;
      border-radius: 8px;
      display: flex;
      align-items: center;
      padding: 8px;
      box-shadow: rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px;
    }

    .box-bg-dark img {
      width: 48px;
      height: auto;
    }

    .bank-img {
      background-color: #b9b9b9;
      padding: 1em;
      border-top-left-radius: 8px;
      border-bottom-left-radius: 8px;
    }

    .bank-name {
      font-weight: 600;
    }

    .bank-iban {
      font-size: 13px;
    }

    .tr-icon::before {
      content: url(../img/icons/tr.png);
    }

    .en-icon::before {
      content: url(../img/icons/en.png);
    }

    .en-icon {
      display: flex;
    }

    .tr-icon {
      display: block;
    }

    .flag-icon {
      margin-right: 5px;
    }

    .language-btn {
      display: flex;
      align-items: center;
    }

    .flag-icon.selected {
      border: 2px solid #007bff;
      border-radius: 50%;
      padding: 1px;
    }

    .logo-section {
      gap: 8px;
      display: flex;
      height: 84px;
      padding: 4px 8px;
      align-items: center;
      justify-content: space-evenly;
    }

    .logo-section img {
      height: 4em !important;
    }

    .logo-section .profile-img {
      width: 3.5em !important;
      height: 3.5em !important;
    }

    .icon {
      display: flex;
      align-items: center;
      gap: 8px;
      text-decoration: none;
      color: #333;
      cursor: pointer;
      font-size: 14px;
      font-weight: 600;
      padding: 0 8px;
      justify-content: center;
    }

    .icon-col {
      display: flex;
      align-items: center;
      gap: 8px;
      text-decoration: none;
      color: #333;
      cursor: pointer;
      font-size: 14px;
      font-weight: 600;
      padding: 0 8px;
      flex-direction: column;
      justify-content: center;
    }

    .icon-social {
      display: flex;
      align-items: center;
      gap: 8px;
      text-decoration: none;
      color: #333;
      cursor: pointer;
      font-size: 14px;
      font-weight: 600;
      padding: 0 8px;
      flex-direction: column;
      justify-content: center;
    }

    .icon.share::before {
      content: '';
      background-image: url('../img/icons/share-dark.svg');
      background-repeat: no-repeat;
      width: 1.5em;
      height: 1.5em;
      background-size: 1.5em 1.5em;
    }

    .icon.catalog::before {
      content: '';
      background-image: url('../img/icons/catalog-dark.svg');
      background-repeat: no-repeat;
      width: 1.5em;
      height: 1.5em;
      background-size: 1.5em 1.5em;
    }

    .icon-col.bank::before {
      content: '';
      background-image: url('../img/icons/bank-dark.svg');
      background-repeat: no-repeat;
      width: 1.85em;
      height: 1.85em;
      background-size: 1.85em 1.85em;
    }

    .icon-col.video::before{
      content: '';
      background-image: url('../img/icons/video-dark.svg');
      background-repeat: no-repeat;
      width: 1.85em;
      height: 1.85em;
      background-size: 1.75em 1.75em;
    }

    .icon-col.bill::before {
      content: '';
      background-image: url('../img/icons/bill-dark.svg');
      background-repeat: no-repeat;
      width: 1.5em;
      height: 1.5em;
      background-size: 1.5em 1.5em;
    }

    .icon-col.phone::before {
      content: '';
      background-image: url('../img/icons/phone-dark.svg');
      background-repeat: no-repeat;
      width: 1.5em;
      height: 1.5em;
      background-size: 1.5em 1.5em;
    }

    .icon.web::before {
      content: '';
      background-image: url('../img/icons/web-dark.svg');
      background-repeat: no-repeat;
      width: 1.5em;
      height: 1.5em;
      background-size: 1.5em 1.5em;
    }
    .icon.about::before {
      content: '';
      background-image: url('../img/icons/about-dark.svg');
      background-repeat: no-repeat;
      width: 1.5em;
      height: 1.5em;
      background-size: 1.5em 1.5em;
    }
    .icon-social.facebook::before {
      content: '';
      background-image: url('../img/icons/facebook.svg');
      background-repeat: no-repeat;
      width: 1.5em;
      height: 1.5em;
      background-size: 1.5em 1.5em;
    }
    .icon-social.whatsapp::before{
      content: '';
      background-image: url('../img/icons/whatsapp.svg');
      background-repeat: no-repeat;
      width: 1.5em;
      height:1.5em;
      background-size: 1.5em 1.5em;
    }
    .icon-social.instagram::before {
      content: '';
      background-image: url('../img/icons/instagram.svg');
      background-repeat: no-repeat;
      width: 1.5em;
      height: 1.5em;
      background-size: 1.5em 1.5em;
    }

    .icon-col.mail::before {
      content: '';
      background-image: url('../img/icons/mail-dark.svg');
      background-repeat: no-repeat;
      width: 1.5em;
      height: 1.5em;
      background-size: 1.5em 1.5em;
    }
    .icon-col.business::before {
      content: '';
      background-image: url('../img/icons/bussines-dark.svg');
      background-repeat: no-repeat;
      width: 1.75em;
      height: 1.75em;
      background-size: 1.75em 1.75em;
    }

    .icon-col.map::before {
      content: '';
      background-image: url('../img/icons/map-dark.svg');
      background-repeat: no-repeat;
      width: 1.5em;
      height: 1.5em;
      background-size: 1.5em 1.5em;
    }


    .icon-social.linkedin::before {
      content: '';
      background-image: url('../img/icons/linkedn.svg');
      background-repeat: no-repeat;
      width: 1.5em;
      height: 1.5em;
      background-size: 1.5em 1.5em;
    }

    .gap-1 {
      gap: 0.5em;
    }

    .gap-2 {
      gap: 1em;
    }

    .gap-3 {
      gap: 1.5em;
    }

    .gap-4 {
      gap: 2em;
    }
    .shadow{
      box-shadow: rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px;
    }
    .facebook-bg {
      border-radius: 8px;
      background-color: #fff;box-shadow: rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px;
    }

    .instagram-bg {
      border-radius: 8px;
      background-color: #fff;box-shadow: rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px;
    }

    .mail-bg {
      border-radius: 8px;
      background-color: #fff;box-shadow: rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px;
    }

    .linkedin-bg {
      border-radius: 8px;
      background-color: #fff;box-shadow: rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px;
    }

    .vr-line {
      display: flex;
    }

    .vr-line::after {
      content: '';
      display: block;
      width: 1px;
      height: 100%;
      background-color: #333;
      margin-left: 1em;
    }

    .modal-content.shareModal,
    .modal-content.bankModal,
    .modal-content.promotionModal {
      background-color: #d9d8d8;
    }

    .shareModal .btn-close {
      color: #333 !important;
    }

    .social-share button {
      border: 0.1rem solid transparent !important;
      padding: 8px 1em;
      text-align: left;
      border-radius: 4px;
      color: #333;
      font-weight: 600;
      font-size: 1.25em;
    }

    .facebook-link {
      background-color: #1877f2;
    }

    .twitter-link {
      background-color: #1da1f2;
    }

    .link-link {
      background-color: #ffa930;
    }

    .linkedn-link {
      background-color: #364c63;
    }

    small {
      font-size: 0.75em !important;
    }

    .checkbox {
      opacity: 0;
      position: absolute;
    }

    .checkbox-label {
      background-color: #f7f7f7;
      width: 50px;
      height: 26px;
      border-radius: 50px;
      position: relative;
      padding: 5px;
      cursor: pointer;
      display: flex;
      justify-content: space-between;
      align-items: center;
    }

    .fa-moon {
      color: #f1c40f;
    }

    .fa-sun {
      color: #f39c12;
    }

    .checkbox-label .ball {
      background-color: #333;
      width: 22px;
      height: 22px;
      position: absolute;
      left: 2px;
      top: 2px;
      border-radius: 50%;
      transition: transform 0.2s linear;
    }

    .checkbox:checked + .checkbox-label .ball {
      transform: translateX(24px);
    }
    /* Bu kısım, animasyonun tanımını yapar */
@keyframes fade-in {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Bu kısım, sınıfı taşıyan elemanlara animasyonu uygular */
.animate-on-load {
  animation: fade-in 0.5s ease-out;
}
.dropdown-toggle::after{
  color:#282828;
}