body,
html {
  height: 100%;
  margin: 0;
  font-family: "Ubuntu", sans-serif;
  line-height: 180%;
  color: #666;
  text-align: center;
}
.parallax1 {
  background-image: url(img/img.jpg);
  min-height: 100%;
}
.parallax2 {
  background-image: url(img/img1.jpg);
  min-height: 60%;
}
.parallax3 {
  background-image: url(img/img2.jpg);
  min-height: 60%;
}
.parallax4 {
  background-image: url(img/img3.jpg);
  min-height: 60%;
}
.parallax5 {
  background-image: url(img/img4.jpg);
  min-height: 60%;
}
.parallax6 {
  background-image: url(img/img5.jpg);
  min-height: 60%;
}
.parallax7 {
  background-image: url(img/img6.jpg);
  min-height: 60%;
}
.parallax8 {
  background-image: url(img/img7.jpg);
  min-height: 60%;
}
.parallax9 {
  background-image: url(img/img8.jpg);
  min-height: 60%;
}
.parallax10 {
  background-image: url(img/img9.jpg);
  min-height: 60%;
}
.parallax11 {
  background-image: url(img/img10.jpg);
  min-height: 60%;
}
.parallax12 {
  background-image: url(img/img11.jpg);
  min-height: 100%;
}

/* Mobile styles (adjust as needed) */
@media (max-width: 768px) {
    .parallax1,
    .parallax12 {
      min-height: 80vh; /* Adjust the value as needed */
    }
  
    .parallax2,
    .parallax3,
    .parallax4,
    .parallax5,
    .parallax6,
    .parallax7,
    .parallax8,
    .parallax9,
    .parallax10,
    .parallax11 {
      min-height: 40vh; /* Adjust the value as needed */
    }
  }

.parallax1,
.parallax2,
.parallax3,
.parallax4,
.parallax5,
.parallax6,
.parallax7,
.parallax8,
.parallax9,
.parallax10,
.parallax11,
.parallax12 {
  position: relative;
  opacity: 0.7;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
}

/* Mobile styles for screens up to 768px (adjust this value as needed) */
@media (max-width: 768px) {
    .parallax1,
    .parallax2,
    .parallax3,
    .parallax4,
    .parallax5,
    .parallax6,
    .parallax7,
    .parallax8,
    .parallax9,
    .parallax10,
    .parallax11,
    .parallax12 {
      background-attachment: scroll; /* Change background attachment to scroll on mobile */
      opacity: 1; /* Increase opacity on mobile for better visibility */
    }
  }

.head {
  position: absolute;
  color: #fff;
  font-size: 500%;
  top: 50%;
  width: 100%;
  text-transform: uppercase;
  letter-spacing: 20px;
  animation: drop 3s ease;
  cursor: pointer;
}

.head:hover {
  color: transparent;
}

section {
  overflow: auto;
  padding: 50px 80px;
}

footer {
  width: 100%;
  background-color: #323232;
  color: #f2f2f2;
  height: 8vh;
  text-align: center;
  padding-top: 5vh;
  padding-bottom: 1vh;
}

@media (max-width: 800px) {
  .head {
    font-size: 200%;
  }
}

@keyframes drop {
  0% {
    opacity: 0;
    transform: translateY(-80px);
  }
  100% {
    opacity: 1;
    transform: translateY(0px);
  }
}

@import url("https://fonts.googleapis.com/css?family=Ubuntu");