main {
  background-color: #e0eff6;
}
.page-banner {
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  background-color: #bfe7e7;
  color: #279e9b;
  height: 200px;
}
.page-banner h1 {
  font-size: 2rem;
}
.page-content {
  /* background-color: var(--colour-1); */
  color: var(--colour-2);
  padding-bottom: 100px;
}
.page-content .faq-div1,
.page-content .faq-div2,
.page-content .faq-div3,
.page-content .faq-div4,
.page-content .faq-div5,
.page-content .faq-div6,
.page-content .faq-div7,
.page-content .faq-div8 {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: min(5vw, 20px);
  margin: auto;
}
.page-content .faq-div1 .button,
.page-content .faq-div2 .button,
.page-content .faq-div3 .button,
.page-content .faq-div4 .button,
.page-content .faq-div5 .button,
.page-content .faq-div6 .button,
.page-content .faq-div7 .button,
.page-content .faq-div8 .button       {
  background-color: unset;
  border: none;
  border-bottom: 3px solid var(--colour-3);
  text-align: left;
  padding-left: 10px;
  position: relative;
  cursor: pointer;
}
.page-content .faq-div1 .button:after,
.page-content .faq-div2 .button:after,
.page-content .faq-div3 .button:after,
.page-content .faq-div4 .button:after,
.page-content .faq-div5 .button:after,
.page-content .faq-div6 .button:after,
.page-content .faq-div7 .button:after,
.page-content .faq-div8 .button:after  {
  content: '\002B'; /* Unicode character for "plus" sign (+) */
  font-size: 2rem;
  color: var(--colour-3);
  position: absolute;
  right: 0;
  top: 50%;
  transform: translate(0, -50%);
}
.page-content .faq-div1 .button.active:after,
.page-content .faq-div2 .button.active:after,
.page-content .faq-div3 .button.active:after,
.page-content .faq-div4 .button.active:after,
.page-content .faq-div5 .button.active:after,
.page-content .faq-div6 .button.active:after,
.page-content .faq-div7 .button.active:after,
.page-content .faq-div8 .button.active:after {
  content: "\2212"; /* Unicode character for "minus" sign (-) */
}

.page-content .faq-div1 div,
.page-content .faq-div2 div,
.page-content .faq-div3 div,
.page-content .faq-div4 div,
.page-content .faq-div5 div,
.page-content .faq-div6 div,
.page-content .faq-div7 div,
.page-content .faq-div8 div {
  padding: 0 20px;
  /* max-height: 0; */
  /* overflow: hidden; */
  /* transition: max-height 0.2s ease-out; */
  transition: 0.5s;
}
.page-content h2,
.page-content h3,
.page-content h4 {
  color: var(--colour-3);
  line-height: 2rem;
}
.page-content a {
  color: var(--colour-3);
}
.page-content ul {
  list-style-type: none;
}
.page-content li {
  font-family: 'League Spartan', sans-serif;
  font-size: 1.3rem;
  line-height: 1.5em;
}

@media screen and (min-width: 425px) {

}
@media screen and (min-width: 769px) {
  .page-banner h1 {
    font-size: 3rem;
  }
  .page-content .faq-div1,
  .page-content .faq-div2,
  .page-content .faq-div3,
  .page-content .faq-div4,
  .page-content .faq-div5,
  .page-content .faq-div6,
  .page-content .faq-div7,
  .page-content .faq-div8 {
    text-align: justify;
    width: min(100%, 800px);
  }
}
@media screen and (min-width: 1024px) {
  /* Main */
}