.navbar-brand {
  font-family: "Mountains of Christmas",serif;
  color: var(--color-christmas-snow);
}

h1 {
  font-family: "Mountains of Christmas",serif;
  color: var(--color-christmas-red);
}

h3 {
  font-family: "Mountains of Christmas",serif;
}

@keyframes snowfall {
  0% { transform: translateX(0) translateY(-20px) rotate(0turn); }

  100% { transform: translateX(var(--snowflake-translation)) translateY(100vh) rotate(var(--snowflake-rotation)); }
}

.snowflake {
  animation-timing-function: linear;
  animation-iteration-count: infinite;
  animation-name: snowfall;
  color: var(--color-christmas-snow);
  position: absolute;
  pointer-events: none;
}

.snow {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  overflow: hidden;
  z-index: 50;
  pointer-events: none;
}

.navbar-brand i {
  display: inline-block;
  color: var(--color-christmas-gold);
}

.row {
  overflow: hidden;
}

.card-image {
  padding-left: 0;
}

.bg-body-tertiary {
  background-color: var(--color-christmas-red);
  background-color: #c0392b !important;
}

.btn-primary {
    --bs-btn-bg: var(--color-christmas-green);
    --bs-btn-border-color: var(--color-christmas-green);
    --bs-btn-active-border-color: var(--color-christmas-gold);
    --bs-btn-active-bg: var(--color-christmas-red);
    --bs-btn-hover-bg: var(--color-christmas-red);
    --bs-btn-hover-border-color: var(--color-christmas-gold);
}

body {
  font-family: "Inter", sans-serif;
  background-color: white;
}

:root {
   --color-christmas-red:   #c0392b;
   --color-christmas-green: #2c7744;
   --color-christmas-gold:  #f1c40f;
   --color-christmas-snow:  #dee6f3;
 }
