*, *:before, *:after {
  box-sizing: border-box;
}

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

body {
  padding: 10rem 0 0 0;
  color: #333333;
  font-family: 'EB Garamond', serif;
  font-weight: 400;
  font-size: 1.2rem;
  background-color: #ffffff;
  margin: 0;
  min-height: 100%;
}

h1 {
  font-size: 1.6rem;
  font-style: italic;
  font-weight: 300;
  line-height: 1.2em;
}

.sans {
  font-family: 'Work Sans', sans-serif;
  font-size: 1.9rem;
  font-style: normal;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.center {
  text-align: center;
}

a {
  text-decoration: underline;
  color: #FF6C63;
  text-underline-offset: 0.2em;
  text-decoration-thickness: 0.05em; 
}

a:hover {
  color: #B24B45;
}


@media (min-width: 768px) {

  html {
    font-size: 20px;
  }

  body {
    font-size: 1rem;
  }

  h1 {
  font-size: 1.5rem;
  }

}