peach code

<style>
@import url('https://fonts.googleapis.com/css2?family=Courgette&family=Homemade+Apple&family=Leckerli+One&family=Niconne&family=Pacifico&display=swap');

::-webkit-scrollbar {
 width: .1px;
}

::-webkit-scrollbar-track {
 box-shadow: inset 0 0 5px grey;
 border-radius: 10px;
}

::-webkit-scrollbar-thumb {
 background: #b95595;
 border-radius: 10px;
}
::-webkit-scrollbar-thumb:hover {
 background: #b95591;
}
body {
	background-color: #fff3f7;
	background-image: url('PNG IMAGE WORKS BEST') ;
	background-position: fixed;
 background-size: 35%;
	background-repeat:no-repeat;
	background-position: right bottom;
}

h1 {
color: #FF8B62;
border-bottom: 1px solid #FF8B62;
font-family: 'Leckerli One', cursive;
font-size: 50px;
text-align: center;
font-weight: bold;
padding: 5px;
}

.peachmiddle{
 position: fixed;
 bottom: 5.5vw;
 left: 36vw;
 z-index: 2;

}


.peachleft{
 position: fixed;
 bottom: 0vw;
 left: -3vw;
filter: brightness(.);
 z-index: -1;
}

.peachright{
 position: fixed;
 bottom: 12vw;
 left: 80vw;
opacity: .7;
filter: brightness(1);
 z-index: -1;
}

.peachtitletop{
 position: fixed;
 bottom: 37vw;
 left: 33vw;
filter: brightness(.);
 z-index: 2;
}

.peachtitlebottom{
 position: fixed;
 bottom: -2vw;
 left: 34vw;
filter: brightness(.);
 z-index: 2;
}

.petals1{
 position: fixed;
 top: 0vw;
 left: 0vw;
filter: brightness(.);
 z-index:- 1;
}

.petals2{
 position: fixed;
 top: 0vw;
 left: 33vw;
filter: brightness(.);
 z-index: -1;
}

.petals3{
 position: fixed;
 top: 0vw;
 left: 60vw;
filter: brightness(.);
 z-index: -1;
}


#navi1 {position: fixed;
 left: 32vw;
 bottom: 27vw;
 z-index: 2;
vertical-align: top;
}

#navi1 a {

font-family: 'Lovers Quarrel', cursive;
background-image: url('https://pa1.narvii.com/6091/e91c4f0d0ae10356b5f1528a1808d57ee1b27435_hq.gif') ;
 background-size: 100%;
	background-repeat:no-repeat;
	background-position: center;
display: inline-block;
opacity: 1;
height: 75px;
width: 75px;
transition: .8s;
}

#navi1 a:hover {
display: inline-block;
}

#navi2 {position: fixed;
 left: 32vw;
 bottom: 21vw;
 z-index: 2;
vertical-align: top;
}

#navi2 a {
font-family: 'Lovers Quarrel', cursive;
background-image: url('https://pa1.narvii.com/6091/e91c4f0d0ae10356b5f1528a1808d57ee1b27435_hq.gif') ;
 background-size: 100%;
	background-repeat:no-repeat;
	background-position: center;
display: inline-block;
opacity: 1;
height: 75px;
width: 75px;
transition: .8s;
}

#navi2 a:hover {
display: inline-block;
}

#navi3 {position: fixed;
 left: 32vw;
 bottom: 15vw;
 z-index: 2;
vertical-align: top;
}

#navi3 a {
font-family: 'Lovers Quarrel', cursive;
background-image: url('http://pa1.narvii.com/6634/503663566f842de85c07679209db2a5f6153d7f6_00.gif') ;
 background-size: 100%;
	background-repeat:no-repeat;
	background-position: center;
display: inline-block;
opacity: 1;
height: 75px;
width: 75px;
transition: .8s;
}

#navi3 a:hover {
color: #27233C;
filter: grayscale(0.0);
text-shadow:0px 0px 3px #FC7C81;
display: inline-block;
}

#navi4 {position: fixed;
 left: 64vw;
 bottom: 27vw;
 z-index: 2;
vertical-align: top;
}

#navi4 a {
font-family: 'Lovers Quarrel', cursive;
background-image: url('https://pa1.narvii.com/6091/e91c4f0d0ae10356b5f1528a1808d57ee1b27435_hq.gif') ;
 background-size: 100%;
	background-repeat:no-repeat;
	background-position: center;
display: inline-block;
opacity: 1;
height: 75px;
width: 75px;
transition: .8s;
}

#navi4 a:hover {
color: #27233C;
filter: grayscale(0.0);
text-shadow:0px 0px 3px #FC7C81;
display: inline-block;
}

#navi5 {position: fixed;
 left: 64vw;
 bottom: 21vw;
 z-index: 0;
vertical-align: top;
}

#navi5 a {
font-family: 'Lovers Quarrel', cursive;
background-image: url('https://pa1.narvii.com/6091/e91c4f0d0ae10356b5f1528a1808d57ee1b27435_hq.gif') ;
 background-size: 100%;
	background-repeat:no-repeat;
	background-position: center;
display: inline-block;
opacity: 1;
height: 75px;
width: 75px;
transition: .8s;
}

#navi5 a:hover {
color: #27233C;
filter: grayscale(0.0);
text-shadow:0px 0px 3px #FC7C81;
display: inline-block;
}

#navi6 {position: fixed;
 left: 64vw;
 bottom: 15vw;
 z-index: 2;
vertical-align: top;
}

#navi6 a {
font-family: 'Lovers Quarrel', cursive;
background-image: url('http://pa1.narvii.com/6634/503663566f842de85c07679209db2a5f6153d7f6_00.gif') ;
 background-size: 100%;
	background-repeat:no-repeat;
	background-position: center;
display: inline-block;
opacity: 1;
height: 75px;
width: 75px;
transition: .8s;
}

#navi6 a:hover {
color: #27233C;
filter: grayscale(0.0);
text-shadow:0px 0px 3px #FC7C81;
display: inline-block;
}

.content{
position: fixed;
bottom: 150vw;
left: 2vw;
z-index: 1;
opacity: 1;
transition: .8s;
-moz-transition: .8s;
webkit-transition: .8s;
-o-transition: .8s;
}

.content:target{
bottom: 46vw;
left: 2vw;
z-index: 0;
opacity: 1;
}

.content2{
position: fixed;
bottom: 150vw;
left: 70vw;
z-index: 1;
opacity: 1;
transition: .8s;
-moz-transition: .8s;
webkit-transition: .8s;
-o-transition: .8s;
}

.content2:target{
bottom: 46vw;
left: 70vw;
z-index: 0;
opacity: 1;
}

.contentbox{
background-color: #;
background-image: url('https://i.ibb.co/fD7SYFf/peachtextbox.png') ;
 background-size: 100%;
	background-repeat:repeat;
	background-position: center;
font-family: 'Courgette', cursive;
font-size:20px;
color: #4A96BA;
border-style: dotted;
border-width: 5px;
border-color: #fff;
border-radius: 5px;
letter-spacing: 0px;
width: 400px;
height: 600px;
text-align: center;
z-index: 0;
overflow-y: scroll;
position: fixed;
opacity: 1;
}

</style>
<body>

<div class="petals1">
<img src="https://i.pinimg.com/originals/ca/2c/b6/ca2cb65c5e194793ea50ee3fc21328ed.gif" width="" height="">
</div>

<div class="petals2">
<img src="https://i.pinimg.com/originals/ca/2c/b6/ca2cb65c5e194793ea50ee3fc21328ed.gif" width="" height="">
</div>

<div class="petals3">
<img src="https://i.pinimg.com/originals/ca/2c/b6/ca2cb65c5e194793ea50ee3fc21328ed.gif" width="" height="">
</div>

<div class="peachmiddle">
<img src="https://i.ibb.co/hM8v9f4/peach-middle-1.png" width="" height="500">
</div>

<div class="peachleft">
<img src="https://i.pinimg.com/originals/e8/51/97/e85197b1783ada2d8889a06152204c22.gif" width="" height="500">
</div>

<div class="peachright">
<img src="https://cdn.discordapp.com/attachments/649485777893326869/829560754759532544/8d7e8473499e94f729885acaf3a263af.png" width="" height="500">
</div>

<div class="peachtitletop">
<img src="https://i.ibb.co/5BqdPmL/peachtoptext1.png" width="" height="150">
</div>

<div class="peachtitlebottom">
<img src="https://i.ibb.co/ypkxFTN/peachbottomtext1.png" width="" height="150">
</div>

<div id="navi1"><a href="#one"></a></div></div>
<div id="navi2"><a href="#two"></a></div></div>
<div id="navi3"><a href="#"></a></div></div>
<div id="navi4"><a href="#three"></a></div></div>
<div id="navi5"><a href="#four"></a></div></div>
<div id="navi6"><a href="#"></a></div></div>


 <div id="one" class="content"><div class="contentbox">
<h1>💟Stats💟</h1>
<span style="float:left;"><b>Name</b></span><span style="float:right;">Peach</span><br>
<span style="float:left;"><b>Nickname</b></span><span style="float:right;">N/a</span><br>
<span style="float:left;"><b>Gender</b></span><span style="float:right;">Female</span><br>
<span style="float:left;"><b>Race</b></span><span style="float:right;">Human</span><br>
<span style="float:left;"><b>Height</b></span><span style="float:right;">6'</span><br>
<span style="float:left;"><b>Weight</b></span><span style="float:right;">150lbs</span><br>
<span style="float:left;"><b>Eyes</b></span><span style="float:right;">Blue</span><br>
<span style="float:left;"><b>Hair</b></span><span style="float:right;">Blonde</span><br>
<span style="float:left;"><b>Orientation</b></span><span style="float:right;">Straight</span><br>
<span style="float:left;"><b>Relationship</b></span><span style="float:right;"><a target="_blank" href="">---</a></span><br>
<span style="float:left;"><b>Affiliation</b></span><span style="float:right;">Princess of the Mushroom Kingdom</span><br>


</div>
</div>

 <div id="two" class="content"><div class="contentbox">

<h1>💟Headcanons💟</h1>
HEADCANONS GO HERE
</div>
</div>

 <div id="three" class="content2"><div class="contentbox">
<h1>💟Background💟</h1>
STORY GOES HERE

</div>
</div>

 <div id="four" class="content2"><div class="contentbox">
<h1>💟OOC💟</h1>
THIS IS THE ACTUAL OOC

</div>
</div>

</body>
</body>