/* src/styles.css */
:root {
  --white: #DFD7CD;
  --light: #DFD7CD;
  --content: #2E5C6E;
  --background: #bddcdf;
  --dark: #336666;
}
.farmers {
  --background: #BDDCDF;
  --content: #258D9D;
  --light: #258D9D;
  --dark: #077C8E;
  --extra-light: #57A6B2;
}
.beakers {
  --background: #CACCE9;
  --content: #211E55;
  --light: #8E8CB8;
  --dark: #336666;
}
.hose {
  --background: #D9CD90;
  --content: #6E552F;
  --light: #B68E55;
  --dark: #336666;
}
.tides {
  --background: #ECB88A;
  --content: #724938;
  --light: #CA7853;
}
.orbit {
  --background: #D1E3F2;
  --content: #124882;
  --light: #5285BC;
}
.prediction {
  --background: #CACCE9;
  --content: #211E55;
  --light: #8E8CB8;
}
.matching {
  --background: #D7C4BB;
  --content: #86473F;
  --light: #9E7A7A;
}
html body {
  margin: 0;
  padding: 0;
  height: 100%;
  background-color: var(--background);
  transition: background-color 2s ease, color 2s ease;
}
div p {
  transition: background-color 2s ease, color 2s ease;
}
h2 {
  font-family: "Roboto", sans-serif;
  font-weight: 600;
  font-size: 20px;
}
p {
  font-family: "Exo", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  color: var(--content);
  font-size: 23px;
}
li {
  font-family: "Roboto", sans-serif;
  font-weight: 400;
  font-size: 18px;
}
p.bubble {
  font-family: "Hubballi", sans-serif;
  font-weight: 400;
  font-size: 23px;
  font-style: normal;
}
input[type=number]::-webkit-outer-spin-button,
input[type=number]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.material-symbols-outlined {
  font-size: 3.5vh;
  font-variation-settings:
    "FILL" 0,
    "wght" 400,
    "GRAD" 0,
    "opsz" 24;
  color: darkslategray;
}
.material-icons {
  transition: color .5s;
  color: darkslategray;
  font-size: 3.5vh;
  padding: 0 .4vw;
  z-index: 100;
  cursor: pointer;
}

/* angular:styles/global:styles */
/*# sourceMappingURL=styles.css.map */