body {
  --cerulean: hsl(192, 100%, 45%);
  --sulu: hsl(93, 86%, 67%);
  --chartreuse: hsl(93, 100%, 51%);
  --limeade: hsl(93, 100%, 39%);
  --turbo: hsl(55, 100%, 50%);
  --razzmatazz: hsl(339, 100%, 48%);
  --brinkPink: hsl(339, 99%, 66%);
  --mineShaft: hsl(0, 1%, 15%);
  --woodSmoke: hsl(180, 2%, 10%);
  --white: hsl(0, 0%, 100%);
  --gallery: hsl(0, 0%, 92%);
}
html {
  font-size: calc(15px + 0.390625vw);
  box-sizing: border-box;
}

.bg-dark {
  background-color: #191a1a !important;
}

.navbar-brand {
  background: linear-gradient(to right, #30cfd0 0%, #0c5eb6 90%);
  background-clip: border-box;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-weight: 600;
}

.nav-link {
  transition: all 0.3s ease;
  border-bottom: 0.1rem solid transparent;
}

.nav-link.chartreuse-link:hover {
  border-color: var(--chartreuse);
}

.nav-link:hover {
  border-bottom-color: var(--cerulean);
}

.navbar-nav {
  flex-direction: row;
  justify-content: space-evenly;
}

.nav-link {
  margin: 0 0.2rem;
}

h2.card-title {
  line-height: 1;
}

.container-register {
  max-width: 800px;
  margin: 0 auto;
  background-color: var(--white);
  border: 2px solid var(--cerulean);
  border-radius: calc(0.375rem - 1px);
  padding: 2rem 3rem;
}

.button {
  margin: 0.2rem;
  padding: 0.4rem;
  font-size: 1rem;
  letter-spacing: 0.05rem;
  font-weight: 600;
  border: 0;
  box-shadow: 0 0.3rem 0.3rem rgba(0, 0, 0, 0.2);
}

.gradient {
  --magic-rainbow-color-0: hsl(192deg, 100%, 45%);
  --magic-rainbow-color-2: hsl(211, 88%, 38%);
  --magic-rainbow-color-1: hsl(298, 84.6%, 59.2%);
  background: linear-gradient(
    170deg,
    var(--magic-rainbow-color-1),
    var(--magic-rainbow-color-2)
  );

  transition: --magic-rainbow-color-1 1000ms linear,
    --magic-rainbow-color-2 1000ms linear, --magic-rainbow-color-3 1000ms linear,
    color 0.5s ease, background 0.5s ease;
}

.button-blue {
  background-color: var(--cerulean);
}

.gradient:hover,
.button-blue:hover,
.button-pink:hover,
.button-yellow:hover {
  background: rgb(16, 26, 37);
}

.form-control {
  padding: 0.2rem;
}

.cluster-map {
  width: 100%;
  height: 440px;
}

.map {
  width: 400px;
  height: 300px;
  border: 2px solid var(--cerulean);
  border-radius: 5px;
}
.alert {
  max-width: 300px;
  position: fixed;
  z-index: 999;
  margin: 2rem;
}

.alert-error {
  max-width: 100%;
}
.alert-danger,
.alert-error {
  background-color: var(--brinkPink);
}
.alert-success {
  background-color: var(--sulu);
}

.button-pink {
  background-color: var(--razzmatazz);
}

.button-yellow {
  background-color: var(--turbo);
}

b {
  color: var(--razzmatazz);
}
.change-page label {
  color: var(--cerulean);
  font-weight: 600;
}

.white-card {
  background-color: white;
  border: 2px solid var(--cerulean);
  border-radius: 5px;
  margin-top: 1rem;
}
.color-blue {
  background: linear-gradient(to right, #30cfd0 0%, #0c5eb6 10%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  line-height: 4rem;
}

h3.color-blue {
  line-height: 2rem;
}

.color-pink {
  color: var(--razzmatazz);
}