.hide {
  display: none !important;
}

.bg {
  background-color: #3a0b51;
  width: 100%;
  height: 45%;

  position: fixed;
  top: 0;

  z-index: -1;

  margin: 0 !important;
  padding: 0 !important;
}

.bg-card {
  background-color: #3a0b51 !important;
}

.container,
.container-small,
.container-large {
  /* opacity: 0.91; */
}

.btn-naval {
  background-color: #2e2e9c !important;
  color: #ffffff !important;

  font-weight: 200;
}

@media (max-width: 512px) {
  .container-small,
  .container-large {
    max-width: 90% !important;
  }
}

.container {
  background-color: #ffffff;
  margin-top: 45px;
}

.container-small,
.container-large {
  max-width: 500px;
  margin: 45px auto 0;

  margin-bottom: 100px;

  background-color: #ffffff;
  margin-top: 45px;
}

.loader-div {
  position: fixed;
  top: 0;
  left: 0;
  background-color: #ffffff;
  height: 100vh;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.loader {
  position: relative;
  width: 10vw;
  height: 5vw;
  padding: 1.5vw;
  display: flex;
  align-items: center;
  justify-content: center;
}

.loader span {
  position: absolute;
  height: 0.8vw;
  width: 0.8vw;
  border-radius: 50%;
  background-color: #2e2e9c;
}

.loader span:nth-child(1) {
  animation: loading-dotsA 0.5s infinite linear;
}

.loader span:nth-child(2) {
  animation: loading-dotsB 0.5s infinite linear;
}

@keyframes loading-dotsA {
  0% {
    transform: none;
  }

  25% {
    transform: translateX(2vw);
  }

  50% {
    transform: none;
  }

  75% {
    transform: translateY(2vw);
  }

  100% {
    transform: none;
  }
}

@keyframes loading-dotsB {
  0% {
    transform: none;
  }

  25% {
    transform: translateX(-2vw);
  }

  50% {
    transform: none;
  }

  75% {
    transform: translateY(-2vw);
  }

  100% {
    transform: none;
  }
}