@import "fonts.css";

:root {
    --font-sans: Overused Grotesk, -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif;
}

html,body{
  height: 100%;
  width: 100%;
}
.grid-wrapper{
  /*layout*/
  display: grid;
  grid-template-columns: 50px 50px auto 50px 50px;
  grid-template-rows: 100px auto 50px;
  justify-content: center;
  height:100%;
}
.grid-button {
  /*layout*/
  grid-column: 3;
  grid-row: 2;
}
button {
  background-color: #16971ad2; /* Green */
  border-radius: 10%;
  color: white;
  text-align: center;
  font-size: 24px;
  width: 100px;
  height: 50px;
}
button:active{
  background-color: #106d13d2;
}
.text-wrapper{
  /*text formatting*/
  max-width: 75ch;

  grid-column: 3;
  grid-row: 2;
}
h1, h2 {
  font-family: sans-serif;
  font-weight: 900;
}
p {
  font-family: sans-serif;
  font-size: 18px;
  line-height: 28px;
  margin: 30px;
}