/* styles.css */
@keyframes moveUpDown {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-10px);
    }
}

@-webkit-keyframes moveUpDown {
    0%, 100% {
        -webkit-transform: translateY(0);
    }
    50% {
        -webkit-transform: translateY(-10px);
    }
}

.animated-arrow {
    animation: moveUpDown 2s infinite;
    -webkit-animation: moveUpDown 2s infinite; /* Webkit Prefix */
}


.animated-element.right {
  opacity: 0;
  transform: translateX(25px);
  transition: opacity 1s, transform 1s;
}

.animated-element.right.active {
  opacity: 1;
  transform: translateX(0);
}
/* styles.css */

.animated-element.top {
  opacity: 0;
  transform: translateY(-25px);
  transition: opacity 1s, transform 1s;
}

.animated-element.top.active {
  opacity: 1;
  transform: translateY(0);
}
/* styles.css */

.animated-element.bottom {
  opacity: 0;
  transform: translateY(25px);
  transition: opacity 1s, transform 1s;
}

.animated-element.bottom.active {
  opacity: 1;
  transform: translateY(0);
}
/* styles.css */

.animated-element.left {
  opacity: 0;
  transform: translateX(-25px);
  transition: opacity 1s, transform 1s;
}

.animated-element.left.active {
  opacity: 1;
  transform: translateX(0);
}
.btn:hover {
	color: var(--bs-btn-hover-color);
	background-color: var(--bs-btn-hover-bg);
	border-color: var(--bs-btn-hover-border-color)
}


.payment-methods {
  display: inline-block;
  white-space: nowrap;
  animation: slide 15s linear infinite;
}

.payment-methods img {
  margin-right: 20px;
  height: 50px; /* Festlegen der Höhe für alle Bilder */
  width: auto; /* Automatische Anpassung der Breite entsprechend der Höhe */
}


@keyframes slide {
  0% {
    transform: translateX(35%);
  }
  100% {
    transform: translateX(-100%);
  }
}