html {
  font-size: 16px;
  font-family: sans-serif;
  line-height: 1.5;
  scroll-behavior: smooth;
  background-color: #000000;
}

body {
  margin: 0 auto;
}

h1 {
  font-family: "Lora", sans-serif;
  text-align: center;
  max-width: 100%;
  font-size: 4rem;
  color: White;
  padding: 50px;
}

section {
  margin: 0 auto;
  min-height: 1080px;
}

p {
  background-color: #000000;
  max-width: 100%;
  font-size: 30px;
  margin: 0 auto;
  padding: 20px;
  color: White;
  line-height: 1.5;
}

audio {
  position: absolute;
  right: 1%;
  top: 23%;
}

/*here are all my parallax tags*/
.bar {
  top: 2000px;
  margin: 0 auto;
  padding: 10px;
  border: 2px solid #E72E51;
  border-left: none;
  border-right: none;
  text-align: center;
  color: #4CE710;
}

.parallax {
  background-attachment: fixed;
}

.project-statement {
  top: 2000px;
  margin: 0 auto;
  padding: 10px;
  border: 2px solid #E7C536;
  border-left: none;
  border-right: none;
  border-bottom: none;
  text-align: center;
  color: white;
}

/*all of my image tags are below this comment*/
#bgimg-1 {
  background-image: url("images/frames0001.png");
}

#bgimg-2 {
  background-image: url("images/frames0002.png");
}

#bgimg-3 {
  background-image: url("images/frames0003.png");
}

#bgimg-4 {
  background-image: url("images/frames0004.png");
}

#bgimg-5 {
  background-image: url("images/frames0005.png");
}

#bgimg-6 {
  background-image: url("images/frames0006.png");
}