/*
:root {
  --bg-dark: hsl(0 0% 96%);
  --bg: hsl(0 0% 98%);
  --bg-light: hsl(214 100% 100%);
  --text: hsl(0, 0%, 0%);
  --text-muted: hsl(214 18% 29%);
  --text-reverse: hsl(214 100% 96%);
  --highlight: hsl(214 100% 100%);
  --border: hsl(214 12% 52%);
  --border-muted: hsl(214 17% 63%);
  --primary: hsl(213 62% 30%);
  --secondary: hsl(40 100% 16%);
  --secondary-light: hsla(40, 100%, 26%, 0.25);
  --danger: hsl(9 21% 41%);
  --warning: hsl(52 23% 34%);
  --success: hsl(147 19% 36%);
  --success-opaque: hsla(147, 19%, 36%, 0.25);
  --info: hsl(217 22% 41%);
}
*/

:root {
  --bg-dark: hsl(80, 53%, 88%);
  --bg: hsl(81, 70%, 92%);
  --bg-light: hsl(214 100% 100%);
  --text: hsl(0, 0%, 0%);
  --text-muted: hsl(214 18% 29%);
  --text-reverse: hsl(214 100% 96%);
  --highlight: hsl(214 100% 100%);
  --border: hsl(214 12% 52%);
  --border-muted: hsl(214 17% 63%);
  --primary: hsl(228, 63%, 51%);
  --primary-dark: hsl(228, 63%, 32%);
  --secondary: hsl(0, 0%, 32%);
  --secondary-hover: hsl(0, 0%, 42%);
  --danger: hsl(0, 69%, 37%);
  --danger-hover: hsl(0, 69%, 50%);
  --warning: hsl(52 23% 34%);
  --success: hsl(147, 63%, 25%);
  --success-hover: hsl(147, 63%, 31%);
  --success-opaque: hsla(147, 63%, 25%, 0.25);
  --info: hsl(217 22% 41%);
}

/* Scroll behavior is smooth by default. There is currently a bug in chrome browsers where smooth scrolling breaks form validation */
html{
    scroll-behavior: auto;
    height: 100%;
}

body{
    background-color: var(--bg-dark);
    color: var(--text);
    scroll-behavior: auto;
}

.text-reverse{
    color: var(--text-reverse);
}

footer{
    flex-shrink:0;
}

.bg{
    background-color: var(--bg);
}

.bg-light{
    background-color: var(--bg-light);
}

.text{
    color: var(--text);
}

.text-muted{
    color: var(--text-muted);
}

.border{
    border-color: var(--border);
}


.border-muted{
    border-color: var(--border-muted);
}

/* Navbar stuff */
body {
  font-family: "Times New Roman", sans-serif;
}

.content{
    flex: 1 0 auto;
}