/* Gracias a este vídeo tutorial por existir https://www.youtube.com/watch?v=NXiFWpTB2Ug*/

body {
  background: #031634;
  font-family: "Rubik", sans-serif;
}

.container-fluid {
  background-image: linear-gradient(#031634, #033649);
  position: fixed;
  inset: 0;
}

.space {
    width: var(--size);
    height: var(--size);
    background: #fff;
    border-radius: 50%;
    box-shadow: var(--space-layer);
    position: absolute;
    top: 0;
    left: 0;
    opacity: 75%;
    animation: moveStars var(--duration) linear infinite;
}

@keyframes moveStars {
    from { transform: translateY(0); }
    to {transform: translateY(-100vh);}
}

h1 {
  color: #e8ddcb;
  text-shadow: 0 0 4px #cdb380, 0 0 8px #cdb380;
  animation: glow 4s infinite alternate ease-in-out;
}

p {
  color: #cdb380;
}

a.btn-primary {
  background-color: #036564;
  border-color: #033649;
  box-shadow: 0 0 8px #036564;
  transition: background-color 0.7s ease;
  color: #e8ddcb;
  text-decoration: none;
}

a.btn-primary:hover {
  background-color: #033649;
  box-shadow: 0 0 12px #033649;
  color: #e8ddcb;
  text-decoration: none;
}

a.btn-secondary {
  background-color: #e8ddcb;
  border-color: #cdb380;
  box-shadow: 0 0 8px #e8ddcb;
  transition: background-color 0.7s ease;
  color: #031634;
  text-decoration: none;
}

a.btn-secondary:hover {
  background-color: #cdb380;
  box-shadow: 0 0 12px #cdb380;
  color: #031634;
  text-decoration: none;
}