@import url("https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:wght@200;300;400;500;600;700;800&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Caveat:wght@400;500;600;700&display=swap");
:root {
  --green-color: #97c203;
  --blue-color: #218be5;
}

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  height: 100%;
  font-size: 16px;
}

li {
  list-style: none;
}
a {
  text-decoration: none;
  white-space: nowrap;
}

body {
  height: 100%;
}

#root {
  display: grid;
  grid-template-rows: 5rem auto fit-content(10rem);
  grid-template-areas:
    "header"
    "main"
    "footer";
  height: 100%;
  font-family: "Bricolage Grotesque", sans-serif;
}

main {
  grid-area: main;
}