:root {
  --primary: #ee523c;
  --secondary: #f8a846;
  --success: #28a745;
  --danger: #dc3545;
  --warning: #fd7e14;
  --info: #17a2b8;
  --light: #f8f9fa;
  --dark: #343a40;
  --bs-nav-link-color: var(--primary);
  --bs-link-color: var(--primary);
  --bs-link-hover-color: var(--secondary);
}

.btn-primary {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--primary);
  --bs-btn-border-color: var(--primary);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #ee523c;
  --bs-btn-hover-border-color: var(--secondary);
  --bs-btn-focus-shadow-rgb: 49, 132, 253;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #ff8e31;
  --bs-btn-active-border-color: var(--secondary);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: #4f4f4f;
  --bs-btn-disabled-border-color: #343434;
}

.btn-secondary {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--secondary);
  --bs-btn-border-color: var(--secondary);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #ee523c;
  --bs-btn-hover-border-color: var(--secondary);
  --bs-btn-focus-shadow-rgb: 49, 132, 253;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #ff8e31;
  --bs-btn-active-border-color: var(--secondary);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: #4f4f4f;
  --bs-btn-disabled-border-color: #343434;
}

.btn-outline-primary {
  --bs-btn-color: var(--primary);
  --bs-btn-border-color: var(--primary);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--secondary);
  --bs-btn-hover-border-color: var(--primary);
  --bs-btn-focus-shadow-rgb: 13, 110, 253;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--primary);
  --bs-btn-active-border-color: var(--primary);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: var(--primary);
  --bs-btn-disabled-bg: transparent;
  --bs-btn-disabled-border-color: var(--primary);
  --bs-gradient: none;
}

.nav-pills {
  --bs-nav-pills-border-radius: 0.375rem;
  --bs-nav-pills-link-active-color: #fff;
  --bs-nav-pills-link-active-bg: var(--primary);
}
.card-title {
  color: var(--primary);
}

h1,
h2,
h3 {
  font-family: "Space Mono", monospace;
}

h1 {
  color: var(--primary);
}

h2 {
  color: var(--secondary);
}
h3 {
  color: var(--primary);
}

.card-img-top {
  width: 100%;
  height: 15vw;
  object-fit: cover;
}

.card-header {
  font-family: "Space Mono", monospace;
  font-weight: bold;
  font-size: 1rem;
  text-transform: uppercase;
}

.card-header i {
  font-size: 3rem;
}

.card-body ul i {
  color: var(--primary);
}

form i {
  color: var(--primary);
}

.form-signin {
  max-width: 430px;
  padding: 1rem;
}

.form-listing {
  max-width: 700px;
  padding: 1rem;
}

.fade-in {
    opacity: 0;
    transform: translateY(20px);
    animation: fadeIn 1.2s cubic-bezier(0.25,0.1,0.25,1) forwards;
}

@keyframes fadeIn{
    from{
        opacity: 0;
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}