:root {
  --navy: #2b2d5b;
  --navy-2: #3a3d75;
  --navy-ink: #1b1d45;
  --pink: #ff5b8a;
  --pink-2: #ff7fa2;
  --yellow: #ffb547;
  --teal: #3bb5c9;
  --bg: #f6f8fc;
  --bg-soft: #e9f0f8;
  --ink: #2b2d5b;
  --muted: #6b6e91;
  --line: #e4e8f1;
}

html,
body {
  background: var(--bg);
  color: var(--ink);
  font-family: "Prompt", "Poppins", "Tahoma", sans-serif;
}

a {
  color: var(--navy);
}

a:hover {
  color: var(--pink);
}

.navbar,
.nav-wrap {
  background: #fff;
  border-bottom: 1px solid var(--line);
}

.alert-info {
  background: var(--bg-soft);
  border-color: var(--line);
  color: var(--navy-ink);
}

.btn-primary,
.btn-success,
.btn-warning,
.btn-danger {
  border: 0;
  border-radius: 999px;
  font-weight: 600;
}

.btn-primary {
  background: var(--navy);
}

.btn-primary:hover {
  background: var(--navy-2);
}

.btn-success {
  background: var(--teal);
}

.btn-warning {
  background: var(--yellow);
  color: #fff;
}

.btn-danger {
  background: var(--pink);
}

.panel,
.well,
.table,
.form-control,
.form-select {
  border-color: var(--line);
}

.form-control:focus,
.form-select:focus {
  border-color: var(--pink);
  box-shadow: 0 0 0 .2rem rgba(255, 91, 138, .15);
}

.container,
.container-fluid {
  max-width: 1200px;
}

/* Compatibility aliases for legacy Animate.css 3 class names. */
.animated {
  animation-duration: 1s;
  animation-fill-mode: both;
}

.pulse {
  animation-name: pulse;
}

.bounce {
  animation-name: bounce;
}

.flipInX {
  animation-name: flipInX;
}

.fadeInLeft {
  animation-name: fadeInLeft;
}

.zoomIn {
  animation-name: zoomIn;
}