:root {
  font-size: 60%;

  --color-background: #F0F0F7;
  --color-primary-lighter: #b1d34b;
  --color-primary-light: #00995d;
  --color-primary: #0a5f55;
  --color-primary-dark: #0a5f55;
  --color-primary-darker: #00401a;
  --color-secundary: #411564;
  --color-secundary-dark: #411564;
  --color-title-in-primary: #FFFFFF;
  --color-text-in-primary: #222;
  --color-text-title: #32264D;
  --color-text-complement: #5b5c65;
  --color-text-base: #c4cbcf;
  --color-line-in-white: #E6E6F0;
  --color-input-background: #F8F8FC;
  --color-button-text: #FFFFFF;
  --color-box-base: #FFFFFF;
  --color-box-footer: #FAFAFC;
}

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

html, body, #root {
  height: 100vh;
}

body {
  background: var(--color-background);
}

#root {
  display: flex;
  align-items: center;
  justify-content: center;
}

body, input, button, textarea {
  font: 500 1.6rem Poppins;
  font-weight: 300;
}

@media (min-width: 700px) {
  :root {
    font-size: 62.5%;
  }
}

a {
  text-decoration: none;
  color: #fff;
}

ul {
  list-style: none;
}

button {
  cursor: pointer;
}