/* ⏔⏔⏔ ꒰ ᧔ෆ᧓ ꒱ ⏔⏔⏔ */

@font-face{
  font-family:"dogica";
  src:url("./dogica.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}

/* ⏔⏔⏔ ꒰ ᧔ෆ᧓ ꒱ ⏔⏔⏔ */

body {
  background:url("https://i.pinimg.com/736x/41/43/25/4143252d25cb974211876f2e9825389d.jpg");
  background-size: 100%;
  font-family: "dogica";
  letter-spacing:1px;
  line-height: 1.3;
  color: #847164;
  font-size:10px;
  text-indent: 30px;

}

.main{
            width: 60%;
            height: 650px;
            background-color: #fff7fb;
            border-width: 1px;
            border-radius: 0px;
            border-style: solid;
            border-color:rgb(182, 153, 153);
            position: relative;
            top: 30px;
            left: 50%;
            transform: translateX(-50%)
    }

.banner{
  width: 75%;
  height: 30%;
  border-width:1px;
  border-radius: 0px;
  border-style: solid;
  border-color:rgb(182, 153, 153);
  position: fixed;
  left: 25%;
  background-image: url("https://i.pinimg.com/736x/98/67/8a/98678a627e53f385d13810711b56fdd9.jpg");
  background-size: 100%;
}

.banner2{
  width: 75%;
  height: 30%;
  border-width:1px;
  border-radius:0px;
  border-style:solid;
  border-color: rgb(182,153,153);
  position:fixed;
  left:25%;
  background-image:url("https://i.pinimg.com/736x/5e/57/36/5e57365acce63e336bd79c72ab5e46b3.jpg");
  background-size:100%;
}

.banner3{
  background-image: url("https://i.pinimg.com/736x/5d/cc/d1/5dccd19cb6bac82c9d5a7b2a15a93602.jpg");
  background-size:100%;
  width: 75%;
  height: 30%;
  border-width:1px;
  border-radius:0px;
  border-style:solid;
  border-color: rgb(182,153,153);
  position:fixed;
  left:25%;
}

.ushana{
  position: fixed;
  top: 60%;
  left: 70%;
}

.info{
  position: relative;
  right: 200px;
  top: 15px;
}

.info2{
  position: relative;
  left: 230px;
  top: -130px;
  width: 50%;
  height: 50px;
}
.misa2{
  position: fixed;
  top: 60%;
  left:15%;
}
.thingy{
  width: 15%;
  position: fixed;
  left: 75%;
  top: 70%;
}

.top{
  top: 1%;
  position: fixed;
  width: 20%;
  left: 50%;
  transform: translateX(-50%);
  z-index: 4;
}

.misa{
  top: 55%;
  left: 15%;
  position: fixed;
  z-index: 5;

}

.second{
  top: 30%;
  width: 75%;
  height: 70%;
  border-width:1px;
  border-radius: 0px;
  border-style: solid;
  border-color:rgb(182, 153, 153);
  position: fixed;
  left: 25%;
  text-align: center;
  text-indent: 30px;
}

.second2{
  top: 30%;
  width: 75%;
  height: 70%;
  border-width:1px;
  border-radius: 0px;
  border-style: solid;
  border-color:rgb(182, 153, 153);
  position: fixed;
  left: 25%;
  text-align: center;
  text-indent: 0px;
  overflow-y: auto;
  overflow-x: hidden;
  font-size: 10px;
}

.notebook{
  background-image: url("https://i.pinimg.com/1200x/df/23/94/df239402f7e2c7e92b660e3930b8fe74.jpg");
  background-size: 100%;
  position: relative;
}

.dark{
  position: relative;
  width: 50%;
  right: 200px;
  z-index: 5;
}

.musica{
  position: relative;
  width: 10%;
  left: 100px;
  height: 0px;
    border-width:1px;
  border-radius: 0px;
  border-style: solid;
  border-color:rgb(182, 153, 153);
  bottom: 400px;
}
.blog{
  top: 70%;
    width: 50%;
    left: 40%;
  height: 20%;
  border-width:1px;
  border-radius: 0px;
  border-style: solid;
  border-color:rgb(182, 153, 153);
  position: fixed;
  text-indent: 10px;
  background-image: url("https://i.pinimg.com/736x/51/09/c0/5109c02d1cb5a5034cbaba685414a1ab.jpg");
  background-size: 100%;
  overflow-y: auto;
  overflow-x: hidden;
  text-align: left;
  
}

.bow{
  position: fixed;
  left: 20%;
  top: 2%;
}

.bow2{
  position: fixed;
  left: 60%;
  top: 2%;
}

.miku{
  position: fixed;
  left: 77%;
  bottom: -100px;
}

.gal{
  position: fixed;
  left: 100px;
  bottom: 50%;
}
.mezzo{
  position: fixed;
  left: 20%;
  bottom: 15px;
}

.dialogue{
  position: fixed;
  top: 15px;
  left: 100px;

}
.text{
  width: 100%;
  height:100%;
    border-width:1px;
  border-radius: 10px;
  border-style: solid;
  border-color:rgb(182, 153, 153);
  position: relative;
  background-image: url("https://i.pinimg.com/736x/51/09/c0/5109c02d1cb5a5034cbaba685414a1ab.jpg");
  overflow-y: auto;
  overflow-x: hidden;
  font-size: 9px;
  text-align: left;
}

.side{
  width: 25%;
  height: 100%;
  position: fixed;
  margin-top: 50px;
  text-align: center;

}

.about{
  width: 75%;
  height: 100%;
  border-width:1px;
  border-radius: 0px;
  border-style: solid;
  border-color:rgb(182, 153, 153);
  position: fixed;
  left: 25%;
}


/* ⏔⏔⏔ ꒰ ᧔ෆ᧓ ꒱ ⏔⏔⏔ */


::-webkit-scrollbar{
  width: 12px;
}

::-webkit-scrollbar-track{
  background: #ffffff;
  border-radius: 2px;
  border: 1px solid;
  border-color:rgb(182, 153, 153);

}

::-webkit-scrollbar-thumb{
  background-color: rgb(241, 241, 241);
  border-radius: 10px;
  border: 1px solid;
  border-color:rgb(182, 153, 153);
}

::-webkit-scrollbar-thumb:hover {
  opacity: 0.8;
}


/* ⏔⏔⏔ ꒰ ᧔ෆ᧓ ꒱ ⏔⏔⏔ */