@import url(variables.css);
@import url(header.css);
@import url(footer.css);
@import url(projects.css);
@import url(about.css);

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

body {
  box-sizing: border-box;
  min-height: 100vh;
  margin: 0;
  width: 100%;
  background-color: var(--bg-color);
  position: relative;
  padding-bottom: 8rem;
  line-height: 1.6;
}
main {
  max-width: 1400px;
  margin: 1rem auto;
  padding-top: 6rem;
}
h1,
h2,
h3,
h4,
h5,
h6,
li,
a {
  font-family: var(--ff-headings);
  color: var(--highlight-color);
}
p {
  font-family: var(--ff-paragraphs);
  color: var(--highlight-color);
}
@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

main section {
  animation: fadeIn 1s ease-in-out;
}