@import url(https://fonts.googleapis.com/css?family=Nunito:400,600,700);

body {
  background-color: rgb(56, 70, 79);
  background-size: cover;
  background-attachment: fixed;
  background-position: center center;
  background-image: url("../images/back.jpg");
}

#paydetails .collapse {
  overflow: hidden;
}

#paydetails .collapsing {
  position: relative;
  display: block !important;
  height: 0;
  overflow: hidden;
  transition: height 0.28s ease;
  will-change: height;
}

#paydetails .collapse.show {
  display: block;
}

#paydetails .collapse:not(.show):not(.collapsing) {
  display: none;
}

#paydetails canvas {
  display: block;
}

.paid-btn--waiting {
  pointer-events: none;
  opacity: 0.95;
}

.wait-dots {
  display: inline-block;
  margin-left: 4px;
}

.wait-dots span {
  animation: waitDot 1.2s infinite ease-in-out;
  opacity: 0.2;
}

.wait-dots span:nth-child(1) {
  animation-delay: 0s;
}

.wait-dots span:nth-child(2) {
  animation-delay: 0.2s;
}

.wait-dots span:nth-child(3) {
  animation-delay: 0.4s;
}

@keyframes waitDot {
  0%,
  80%,
  100% {
    opacity: 0.2;
  }
  40% {
    opacity: 1;
  }
}