.aclonica-regular {
  font-family: "Aclonica", sans-serif;
  font-weight: 400;
  font-style: normal;
}


.container {
  display: flex;
  position:relative;
}


 
.welcome {
  position: absolute;
  top: 8px;
  z-index: 2;
  color:rgb(22, 96, 22);
  background-color: lightgreen;
  font-size: 20px;
  font-family: Aclonica, sans-serif; 
  margin-left: 450px;
}

.bg {
  background-image: url("forest-summer.png");
 height: 100%;
 width: 100%;
 position: relative;
 z-index: -1;
}

body, HTML {
  height: 100%;
  cursor: url("Cursor/leaf.png"), auto;
  margin: 0;
}


.about, .shrine, .fashion, .Links, .Buttons, .Creations {
 font-size: 20px;
  font-family: Aclonica, sans-serif;
  border-style: none;
}

.about:hover, .fashion:hover, .shrine:hover, .Links:hover, .Buttons:hover, .Creations:hover {
  text-decoration: underline;
  cursor: url("Cursor/leaf_clicked.png"), auto;
}

.options {
  position: relative;
  z-index: 2;
  bottom: 8px; 
  left: 20px;
}

.fern-icon {
  position: absolute;
  z-index: 3;
  width: 500px; 
  height:700px;
  bottom: -5px; 
  left: -70px;
}

.about {
  position: absolute;
  z-index: 5;
  bottom: 520px;
  left: 200px;
  background:none;
}

.fashion {
  position: absolute;
  z-index: 4;
  bottom:240px;
  left:40px;
  width: 100px;
  background: none;
}

.shrine {
  position: absolute;
  z-index: 6;
  bottom: 415px;
  left: 230px;
  background: none; 
}

.Links {
 position: absolute;
  z-index: 7;
  bottom: 300px;
  left: 230px;
  background: none; 
}

.Buttons {
 position: absolute;
  z-index: 8;
  bottom:420px;
  left:65px;
  background: none; 
}

.Creations{
 position: absolute;
  z-index: 9;
  bottom: 200px;
  left: 210px;
  background: none;   
}