@import url("https://fonts.googleapis.com/css2?family=Arimo:wght@400;700&family=Oswald:wght@300;400;500&display=swap");


* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  font-family: "Arimo", sans-serif;
}


section:first-child {
  position: relative;
  height: 100px;
}

section .title {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-family: "Oswald", sans-serif;
  letter-spacing: 10px;
}


.title h1,
.title h2 {
  font-family: "Oswald", sans-serif;
  font-size: 28px;
  font-weight: 400;
  text-transform: uppercase;
}

.title h2 {
  font-size: 20px;
  font-weight: 100;
  letter-spacing: 5px;
  margin-left: 13px;
}

.p-one {
  background-image:
    linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)),
    url("../images/title.png");
}

.p-two {
  background-image:
    linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)),
    url("../images/panic.JPG");
}

.p-three {
  background-image:
    linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)),
    url("../images/calm.JPG");
}

.p-four {
  background-image:
    linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)),
    url("../images/code.JPG");
}

.p-five {
  background-image:
    linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)),
    url("../images/Submit.JPG");
}

.p-six {
  background-image:
    linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)),
    url("../images/game.JPG");
}


.parallax-inner {
  position: relative;
  min-height: 500px;
  background-position: top center;
  background-attachment: fixed;
  background-size: cover;
}

.parallax-inner > h2 {
  color: #fff;
  text-transform: uppercase;
  letter-spacing: 10px;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  width: 100%;
  text-align: center;
}


@font-face {
  font-family: "PapyrusWeb";
  src: url("https://cdn.jsdelivr.net/gh/tsuki-design-beep/web-fonts/Papyrus.ttf")
    format("truetype");
}

.papyrus-jumpscare strong {
  font-family: "PapyrusWeb", serif;
  color: rgb(151, 0, 0);
}


.content-text p {
  padding: 25px 50px;
  font-weight: 400;
  text-align: justify;
  line-height: 35px;
  font-size: 2rem;
}


.red { color: #5e5a58; }
.darkgreen { color: #0d2100; }
.green { color: #6b6837; }
.skyblue { color: #5c9cbf; }


footer {
  width: 100%;
  padding: 0 1.5rem;
}

footer > p {
  text-transform: capitalize;
  width: 460px;
  margin: 0 auto;
  font-size: 27px;
}

@media screen and (max-width: 500px) {
  .parallax-inner {
    min-height: 350px;
    background-size: cover;
  }

  footer {
    padding: 10px;
  }

  footer > p {
    width: 100%;
    font-size: 24px;
  }
}