
/* Cookie */
.cookies-card {
    width: 520px;
    padding: 30px;
    color: #002046;
    position: fixed;
    left: 10px;
    bottom: 10px;
    z-index: 11;
    background-color: #343a50;
  }

  .radius--10px {
    border-radius: 10px;
  }

  .cookies-card.bg--default {
    background-color: #eadfd8;
  }

  .cookies-card__icon {
    width: 55px;
    height: 55px;
    border-radius: 50%;
    background-color: #ded4cd;
    font-size: 32px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
  }

  .cookies-card__content {
    margin-bottom: 0;
  }

  .cookies-btn {
    color: #fff;
    text-decoration: none;
    padding: 10px 25px;
    margin: 3px 5px;
    display: inline-block;
    border-radius: 45px;
    border: none;
  }

  .cookies-btn:hover {
    background-color: #fff;
    color: #363636;
  }

  .cookies-card.style--lg,
  .cookies-card.style--full {
    width: 1200px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
  }

  .cookies-card.style--lg .cookies-card__content,
  .cookies-card.style--full .cookies-card__content {
    width: calc(100% - (55px + 220px));
    padding: 0 25px;
  }

  .cookies-card.style--lg .cookies-card__btn,
  .cookies-card.style--full .cookies-card__btn {
    width: 220px;
  }

  .cookies-card.style--full {
    width: 100%;
  }

  .cookies-card.cookies--dark {
    color: #eadfd8;
    background-color: #ececec;
    z-index: 99999;
  }

  .cookies-card.cookies--dark .cookies-btn {
    color: #fff;
  }

  .cookies-card.cookies--dark .cookies-btn:hover {
    background-color: #343a50;
    color: #fff;
  }

  .cookies-card.cookies--dark .cookies-card__icon {
    background-color: #10163a;
    color: #fff;
  }

  @media (max-width: 1399px) {
    .cookies-card.style--lg,
    .cookies-card {
      width: 100%;
    }
  }

  @media (max-width: 767px) {
    .cookies-card.style--lg,
    .cookies-card.style--full {
      display: block;
    }

    .cookies-card.style--lg .cookies-card__content,
    .cookies-card.style--full .cookies-card__content {
      width: 100%;
      padding: 0;
      margin-top: 25px;
    }

    .cookies-card.style--lg .cookies-card__btn,
    .cookies-card.style--full .cookies-card__btn {
      width: 100%;
      margin-top: 20px;
    }
  }




  @-webkit-keyframes mainAnimation {
    0% {
      width: 50px;
      transform: translateX(0px) translateY(0px) rotate(0deg);
    }

    20% {
      width: 50px;
      transform: translateX(0px) translateY(0px) rotate(0deg);
    }

    40% {
      width: 150px;
      transform: translateX(-50px) translateY(0px) rotate(0deg);
    }

    60% {
      width: 150px;
      transform-origin: bottom right;
      transform: translateX(-150px) translateY(0px) rotate(90deg);
    }

    80% {
      width: 50px;
      transform: translateX(-25px) translateY(0px) rotate(90deg);
    }

    100% {
      width: 50px;
      transform: translateX(-50px) translateY(0px) rotate(90deg);
    }
  }

  @keyframes mainAnimation {
    0% {
      width: 50px;
      transform: translateX(0px) translateY(0px) rotate(0deg);
    }

    20% {
      width: 50px;
      transform: translateX(0px) translateY(0px) rotate(0deg);
    }

    40% {
      width: 150px;
      transform: translateX(-50px) translateY(0px) rotate(0deg);
    }

    60% {
      width: 150px;
      transform-origin: bottom right;
      transform: translateX(-150px) translateY(0px) rotate(90deg);
    }

    80% {
      width: 50px;
      transform: translateX(-25px) translateY(0px) rotate(90deg);
    }

    100% {
      width: 50px;
      transform: translateX(-50px) translateY(0px) rotate(90deg);
    }
  }

  @-webkit-keyframes secundaryAnimation {
    0% {
      transform: translateX(0px) translateY(0px) rotate(0deg);
    }

    20% {
      transform: translateX(0px) translateY(0px) rotate(180deg);
    }

    40% {
      transform: translateX(0px) translateY(0px) rotate(180deg);
    }

    60% {
      transform: translateX(0px) translateY(0px) rotate(0deg);
    }

    80% {
      transform: translateX(0px) translateY(0px) rotate(0deg);
    }

    100% {
      transform: translateX(0px) translateY(0px) rotate(180deg);
    }
  }

  @keyframes secundaryAnimation {
    0% {
      transform: translateX(0px) translateY(0px) rotate(0deg);
    }

    20% {
      transform: translateX(0px) translateY(0px) rotate(180deg);
    }

    40% {
      transform: translateX(0px) translateY(0px) rotate(180deg);
    }

    60% {
      transform: translateX(0px) translateY(0px) rotate(0deg);
    }

    80% {
      transform: translateX(0px) translateY(0px) rotate(0deg);
    }

    100% {
      transform: translateX(0px) translateY(0px) rotate(180deg);
    }
  }

  @-webkit-keyframes shadowAnimation {
    0% {
      width: 150px;
      transform: translateX(-25px) translateY(0px) rotate(0deg);
    }

    20% {
      width: 75px;
      transform: translateX(37.5px) translateY(0px) rotate(0deg);
    }

    40% {
      width: 200px;
      transform: translateX(-25px) translateY(0px) rotate(0deg);
    }

    60% {
      width: 75px;
      transform: translateX(37.5px) translateY(0px) rotate(0deg);
    }

    80% {
      width: 75px;
      transform: translateX(37.5px) translateY(0px) rotate(0deg);
    }

    100% {
      width: 150px;
      transform: translateX(-25px) translateY(0px) rotate(0deg);
    }
  }

  @keyframes shadowAnimation {
    0% {
      width: 150px;
      transform: translateX(-25px) translateY(0px) rotate(0deg);
    }

    20% {
      width: 75px;
      transform: translateX(37.5px) translateY(0px) rotate(0deg);
    }

    40% {
      width: 200px;
      transform: translateX(-25px) translateY(0px) rotate(0deg);
    }

    60% {
      width: 75px;
      transform: translateX(37.5px) translateY(0px) rotate(0deg);
    }

    80% {
      width: 75px;
      transform: translateX(37.5px) translateY(0px) rotate(0deg);
    }

    100% {
      width: 150px;
      transform: translateX(-25px) translateY(0px) rotate(0deg);
    }
  }

  @-webkit-keyframes float {
    0% {
      top: 50%;
    }

    50% {
      top: 51%;
    }

    100% {
      top: 50%;
    }
  }

  @keyframes float {
    0% {
      top: 50%;
    }

    50% {
      top: 51%;
    }

    100% {
      top: 50%;
    }
  }

  .preloader {
    position: fixed;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: 99999;
    background: #fff;
  }

  .loader-bg {
    width: 100%;
    height: 100%;
    background: #ffffff;
    position: fixed;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999999999;
  }

  .loader-bg h3 {
    position: fixed;
    color: #ff5e31;
    font-size: 24px;
  }

  .loader-inner {
    width: 4em;
    height: 4em;
    font-size: 22px;
    box-sizing: border-box;
    border-top: 0.3em solid #ff9613;
    border-radius: 50%;
    position: relative;
    animation: rotating 2s ease-in-out infinite;
    --direction: 1;
  }

  .loader-inner span {
    position: absolute;
    color: #ff5e31;
    width: inherit;
    height: inherit;
    text-align: center;
    line-height: 10em;
    font-family: sans-serif;
    animation: rotating 2s linear infinite;
  }

  .loader-inner::before,
  .loader-inner::after {
    content: "";
    position: absolute;
    width: inherit;
    height: inherit;
    border-radius: 50%;
    box-sizing: border-box;
    top: -0.2em;
  }

  .loader-inner::before {
    border-top: 0.3em solid dodgerblue;
    transform: rotate(120deg);
  }

  .loader-inner::after {
    border-top: 0.3em solid #ff5e31;
    transform: rotate(240deg);
  }

  @keyframes rotating {
    50% {
      transform: rotate(calc(180deg));
    }

    100% {
      transform: rotate(calc(360deg));
    }
  }



.cart-wrapper {
    gap: 12px;
  }

  .cart--btn {
    width: 35px;
    height: 35px;
    line-height: 35px;
    font-size: 20px;
    text-align: center;
    color:#363636;
    position: relative;
  }

  .cart--btn .qty {
    position: absolute;
    width: 20px;
    height: 20px;
    top: -3px;
    right: -6px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #AE1C9A;
    font-size: 12px;
    color: #ffffff;
    font-weight: 600;
  }

  .cart--btn:hover {
    color:#363636;
  }
