@import url("https://fonts.googleapis.com/css2?family=Finger+Paint&display=swap");
html {
  overscroll-behavior: none;
}
html body {
  background-image: url("./assets/background.jpg");
  background-size: 1000px 1000px;
  background-repeat: repeat;
  font-family: "Finger Paint", sans-serif;
}
html body .hyper-link {
  color: blue;
  text-decoration: none;
}
html body .hyper-link:hover {
  color: darkblue;
}
@media (min-width: 768px) {
  html body .container {
    max-width: 736px;
    margin: 32px auto;
  }
}
@media (max-width: 768px) {
  html body .container {
    margin: 16px;
  }
}
html body #header-container {
  margin: 64px 32px 64px 32px;
  text-align: center;
}
@media (min-width: 768px) {
  html body #header-container {
    transform: rotate(10deg);
  }
}
html body #header-container h1 {
  font-weight: 400;
  font-style: normal;
  font-size: 64px;
  margin: 0;
}
html body #header-container h2 {
  font-weight: 400;
  font-style: normal;
  font-size: 32px;
  margin: 0;
}
html body #header-container #header-image {
  max-width: 300px;
  width: calc(100vw - 84px);
  height: auto;
  margin-top: 24px;
}
@media (min-width: 768px) {
  html body #header-container #header-image {
    transform: rotate(-20deg);
  }
}
html body #about-container h3 {
  font-size: 32px;
  margin: 16px 0;
}
html body #about-container p {
  font-size: 24px;
}
html body #about-container .about-section-container {
  display: grid;
}
@media (min-width: 768px) {
  html body #about-container .about-section-container {
    grid-template-columns: auto auto;
    grid-gap: 32px;
  }
}
@media (max-width: 768px) {
  html body #about-container .about-section-container {
    grid-template-columns: auto;
  }
}
@media (min-width: 768px) {
  html body #about-container #owen-young-computer-img {
    height: 400px;
    width: 300px;
  }
}
@media (max-width: 768px) {
  html body #about-container #owen-young-computer-img {
    width: 80vw;
    margin-left: -4vw;
  }
}
@media (min-width: 768px) {
  html body #about-container #owen-yearbook-img {
    height: 300px;
    width: 400px;
  }
}
@media (max-width: 768px) {
  html body #about-container #owen-yearbook-img {
    width: calc(100vw - 32px);
    margin-left: -8vw;
  }
}
@media (min-width: 768px) {
  html body #about-container #owen-computer-view-img {
    margin: 16px auto;
    height: 300px;
    width: 500px;
  }
}
@media (max-width: 768px) {
  html body #about-container #owen-computer-view-img {
    margin: 8px 0;
    width: calc(100vw - 32px);
    height: auto;
    margin-left: -4.8vw;
  }
}
html body #side-project-container h3 {
  font-size: 32px;
}
html body #side-project-container ul li {
  font-size: 24px;
}
html body #connect-container h3 {
  font-size: 32px;
}
html body #connect-container ul {
  display: flex;
  flex-wrap: wrap;
  padding: 0;
  justify-content: space-around;
}
html body #connect-container ul li {
  list-style-type: none;
}
html body #connect-container ul li img {
  max-width: 256px;
  width: calc(100vw - 84px);
  height: auto;
  margin: 16px;
}
html body footer {
  font-size: 16px;
  margin: 80px auto 24px auto;
  display: flex;
  justify-content: center;
}
html body footer ul {
  padding: 0;
}
html body footer ul li {
  list-style-type: none;
  text-align: center;
}

/*# sourceMappingURL=style.css.map */
