body {
  background-color: black;
}

.envelope {
  z-index: 10;
}

.name {
  color: red;
  left: auto;
  top: 200px;
  font-size: 90px;
  font-family: "Helvetica", sans-serif;
  letter-spacing: 0.02px;
  position: absolute;
  z-index: 10;
}

.nameone {
  color: red;
  left: 20px;
  top: 240px;
  font-size: 90px;
  font-family: "Helvetica", sans-serif;
  letter-spacing: 0.02px;
  position: absolute;
  z-index: 10;
}

.nametwo {
  color: red;
  left: auto;
  top: 300px;
  font-size: 90px;
  font-family: "Helvetica", sans-serif;
  letter-spacing: 0.02px;
  position: absolute;
  z-index: 10;
}

.namethree {
  color: red;
  left: auto;
  top: 350px;
  font-size: 90px;
  font-family: "Helvetica", sans-serif;
  letter-spacing: 0.02px;
  position: absolute;
  z-index: 10;
}

.namefour {
  color: red;
  left: auto;
  top: 370px;
  font-size: 90px;
  font-family: "Helvetica", sans-serif;
  letter-spacing: 0.02px;
  position: absolute;
  z-index: 10;
}

.namefive {
  color: red;
  left: auto;
  top: 400px;
  font-size: 90px;
  font-family: "Helvetica", sans-serif;
  letter-spacing: 0.02px;
  position: absolute;
}

.namesix {
  color: red;
  left: auto;
  top: 650px;
  font-size: 90px;
  font-family: "Helvetica", sans-serif;
  letter-spacing: 0.02px;
  position: absolute;
}

.nameseven {
  color: red;
  left: auto;
  top: 670px;
  font-size: 90px;
  font-family: "Helvetica", sans-serif;
  letter-spacing: 0.02px;
  position: absolute;
}
.nameeight {
  color: red;
  left: 20px;
  top: 710px;
  font-size: 90px;
  font-family: "Helvetica", sans-serif;
  letter-spacing: 0.02px;
  position: absolute;
}

/* .namenine{
    color: red;
	left: 1000px;
	top: 200px;
	font-size: 90px;
    font-family: "Helvetica", sans-serif;
    letter-spacing: .02px;
    position: absolute;
  }
   */
.nameten {
  color: red;
  left: 1000px;
  top: 260px;
  font-size: 90px;
  font-family: "Helvetica", sans-serif;
  letter-spacing: 0.02px;
  position: absolute;
}

.nameeleven {
  color: red;
  left: 1000px;
  top: 300px;
  font-size: 90px;
  font-family: "Helvetica", sans-serif;
  letter-spacing: 0.02px;
  position: absolute;
  z-index: 10;
}

.nametwelve {
  color: red;
  left: 950px;
  top: 350px;
  font-size: 90px;
  font-family: "Helvetica", sans-serif;
  letter-spacing: 0.02px;
  position: absolute;
  z-index: 10;
}

.namethirteen {
  color: red;
  left: 950px;
  top: 400px;
  font-size: 90px;
  font-family: "Helvetica", sans-serif;
  letter-spacing: 0.02px;
  position: absolute;
  z-index: 10;
}

.namefourteen {
  color: red;
  left: 980px;
  top: 420px;
  font-size: 90px;
  font-family: "Helvetica", sans-serif;
  letter-spacing: 0.02px;
  position: absolute;
}

.namefifteen {
  color: red;
  left: 1000px;
  top: 430px;
  font-size: 90px;
  font-family: "Helvetica", sans-serif;
  letter-spacing: 0.02px;
  position: absolute;
}

.namesixteen {
  color: red;
  left: 950px;
  top: 600px;
  font-size: 90px;
  font-family: "Helvetica", sans-serif;
  letter-spacing: 0.02px;
  position: absolute;
}
.nameseventeen {
  color: red;
  left: 1000px;
  top: 640px;
  font-size: 90px;
  font-family: "Helvetica", sans-serif;
  letter-spacing: 0.02px;
  position: absolute;
}

.work {
  color: snow;
  left: 500px;
  top: 500px;
  font-size: 50px;
  font-family: "Helvetica", sans-serif;
  position: absolute;
}
/* Dropdown Button */
.dropbtn {
  background-color: #f5faf6;
  color: rgb(7, 7, 7);
  padding: 50px;
  font-size: 16px;
  border: none;
}

/* The container <div> - needed to position the dropdown content */
.dropdown {
  position: relative;
  display: inline-block;
  z-index: 5;
  left: 500px;
  top: 300px;
}

/* Dropdown Content (Hidden by Default) */
.dropdown-content {
  display: none;
  position: absolute;
  background-color: black;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
  z-index: 5;
}

/* Links inside the dropdown */
.dropdown-content a {
  color: rgb(180, 28, 28);
  padding: 12px 16px;
  text-decoration: none;
  display: block;
}

/* Change color of dropdown links on hover */
.dropdown-content a:hover {
  background-color: rgb(248, 246, 246);
}

/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content {
  display: block;
}

/* Change the background color of the dropdown button when the dropdown content is shown */
.dropdown:hover .dropbtn {
  background-color: #f50a0a;
}

.studioprojectone {
  /* color: snow; */
  /* left: 2200px; */
  top: 1800px;
  font-size: 25px;
  font-family: "Helvetica", sans-serif;
  position: absolute;
  z-index: 20;
}
.studioprojectoneagain {
  /* color: snow; */
  /* left: 2200px; */
  top: 1900px;
  font-size: 25px;
  font-family: "Helvetica", sans-serif;
  position: absolute;
  z-index: 20;
}

.studioprojectoneagainn {
  /* color: snow; */
  /* left: 2200px; */
  top: 2000px;
  font-size: 25px;
  font-family: "Helvetica", sans-serif;
  position: absolute;
  z-index: 20;
}
.studioprojectoneagainnn {
  top: 2100px;
  font-size: 25px;
  font-family: "Helvetica", sans-serif;
  position: absolute;
  z-index: 20;
}

.fifteenminute {
  /* color: snow; */
  /* left: 2200px; */
  top: 2200px;
  font-size: 25px;
  font-family: "Helvetica", sans-serif;
  position: absolute;
  z-index: 20;
}
.fifteenminuteboxes {
  /* color: snow; */
  /* left: 2200px; */
  top: 2300px;
  font-size: 25px;
  font-family: "Helvetica", sans-serif;
  position: absolute;
  z-index: 20;
}

.greenbottle {
  z-index: -5;
  height: 700px;
  width: 300px;
  top: 20px;
  left: 1400px;
  position: absolute;
}

.border {
  /* left: 10px; */
  position: absolute;
  /* z-index: -5; */
  top: 1050px;
}
.border:hover {
  /* left: 10px; */
  position: absolute;
  /* z-index: -5; */
  top: 1050px;
  opacity: 70%;
}

.head {
  top: 20px;
  position: absolute;
}

.soju {
  position: absolute;
  left: 1400px;
  top: 300px;
  transform: rotate(20deg);
}
.soju:hover {
  position: absolute;
  left: 1400px;
  top: 300px;
  transform: rotate(20deg);
  opacity: 50%;
}
.sojutwo {
  position: absolute;
  left: 1400px;
  top: 100px;
  transform: rotate(60deg);
}
.sojutwo:hover {
  position: absolute;
  left: 1400px;
  top: 100px;
  transform: rotate(60deg);
  opacity: 70%;
}

.skull {
  position: absolute;
  left: 1400px;
  top: 500px;
  z-index: -3;
}
.skull:hover {
  position: absolute;
  left: 1400px;
  top: 500px;
  z-index: -3;
  opacity: 50%;
}

.simpsons {
  position: absolute;
  left: 1000px;
  top: 10px;
}

.tv {
  position: absolute;
  left: 1400px;
  top: 800px;
  z-index: -5;
}
.tv:hover {
  position: absolute;
  left: 1400px;
  top: 800px;
  z-index: -5;
  opacity: 50%;
}

.deepdownlow {
  position: absolute;
  left: 400px;
  top: 850px;
  z-index: 5;
}

.spiral {
  position: absolute;
  top: 200px;
  left: 1700px;
  z-index: -5;
}

.desert {
  position: absolute;
  top: 850px;
}
.desert:hover {
  position: absolute;
  top: 850px;
  opacity: 50%;
}

.thankyou {
  position: absolute;
  left: 1200px;
  top: 800px;
  transform: rotate(-10deg);
}
.thankyou:hover {
  position: absolute;
  left: 1200px;
  top: 800px;
  transform: rotate(-10deg);
  opacity: 50%;
}

.landscape {
  position: absolute;
  left: 1600px;
  top: 10px;
}
.butterfly {
  position: absolute;
  left: 1600px;
  top: 600px;
}

.butterfly:hover {
  position: absolute;
  left: 1600px;
  top: 600px;
  opacity: 50%;
}
.hands {
  position: absolute;
  top: 300px;
  left: 1600px;
  transform: rotate(270deg);
  z-index: -5;
}
.music {
  position: absolute;
  top: 100px;
  left: 1600px;
}
