Kaban

<style>
@import url('https://www.themonster.xyz/styles/fancy-fonts.css');
@import url('https://fonts.googleapis.com/css?family=Baumans|Ceviche+One|Eagle+Lake|Knewave|Londrina+Solid|Oregano|Skranji|Sriracha&display=swap');
@import url('https://fonts.googleapis.com/css?family=Josefin+Sans&display=swap');

::-webkit-scrollbar{width:0.5vh;height:0.1vh;}
 ::-webkit-scrollbar-track{border-radius:0;background:transparent;}
 ::-webkit-scrollbar-thumb{border-radius:0;background:transparent;}

body{
background: linear-gradient(12deg, #fff 70%, #c4eaff);
}

#image{
position: fixed;
left: 5vw;
bottom: 0vh;
}

#image img{
height: 98vh;
}

#title{
 position: fixed;
 z-index: 5;
 text-align: center;
 letter-spacing: 100px;
 height: 20vh;
 width: 50vw;
 top: 20vh;
 right: 2vw;
}

t{
 font-family:'Skranji', cursive;
 font-size: 12vh;
 background: linear-gradient(to right, #38633a, #4e8751, #3b663d);
 -webkit-background-clip: text;
 -webkit-text-fill-color: transparent;
 filter: drop-shadow(0 1vh 1vh #000);
 }

#nav1, #nav2, #nav3, #nav4{
 position: fixed;
 top: 24.5vh;
 transition: 0.3s;
 z-index: 6;
}

#nav1{right: 42vw;}
#nav1 img{height: 6vh;}
#nav1:hover{filter:drop-shadow(0 0 .5vh #4f9fbc);transition: 0.3s;}

#nav2{right: 33vw;}
#nav2 img{height: 6vh;}
#nav2:hover{filter:drop-shadow(0 0 .5vh #4f9fbc);transition: 0.3s;}

#nav3{right: 24vw;}
#nav3 img{height: 6vh;}
#nav3:hover{filter:drop-shadow(0 0 .5vh #4f9fbc);transition: 0.3s;}

#nav4{right: 15vw;}
#nav4 img{height: 6vh;}
#nav4:hover{filter:drop-shadow(0 0 .5vh #4f9fbc);transition: 0.3s;}




#box{
 position: fixed;
 z-index: 4;
 padding: 1%;
 overflow: auto;
 background: linear-gradient(45deg, #548275, #53825a, #678253);
 box-shadow: 0 0 2vh #000;
 height: 40vh;
 width: 50vw;
 bottom: 25vh;
 right: 5.25vh;
 font-family: 'Josefin Sans', sans-serif;
 color: #f9e5e5;
 font-size: 2.35vh;
 text-shadow: 0 .25vh .75vh #000;
}


h1{
 font-family: 'Otsutome';
 font-size: 4vh;
}


 a{
 font-family: 'Candle Mustard';
 text-decoration: none;
 color: #f9e5e5;
 transition: 0.3s;
 }

 a:hover{
 transition: 0.3s;
 color: #f79999;
 }




</style>

<div id="image">
<img src="https://i.imgur.com/RCAwcWJ.jpg">
</div>

<div id="nav1"><a href="#one"><img src="https://i.imgur.com/jP4omhk.png?1"></a></div>
<div id="nav2"><a href="#two"><img src="https://i.imgur.com/jP4omhk.png?1"></a></div>
<div id="nav3"><a href="#three"><img src="https://i.imgur.com/jP4omhk.png?1"></a></div>
<div id="nav4"><a href="#four"><img src="https://i.imgur.com/jP4omhk.png?1"></a></div>


<div id="title"><t>KABAN</t></div>

<div id="box">
 <div style="height: 100%; overflow-y: hidden;">
<a name="four"></a>
<div style="width:100%; height: 100%; overflow: auto; " align="center">
 <h1>Out of Character!</h1>

 <li>This character is not mine!</li>
<li>I made this code. Please do not steal it.</li>
<li>No profile, no roleplay.</li>
<li>IC =/= OOC</li>
<li>Lewds are cool. Story is cooler.</li>
<li><a target="_blank" href="https://imgur.com/a/rqsoEUk">Images!</a></li>

 </div>


 <a name="one"></a>
 <div style="width:100%; height: 100%; overflow: auto; " align="center">
 <h1>Who is she?</h1>
 Name: Kaban<br>
 Age: Early 20s<br>
 Race: Human<br>
 Gender: Female<br>
 Occupation: Adventurer, Park Resident and Keeper.<br>
 Height: 163cm<br>
 Weight: 56kg<br>
 Preference: None<br>
 Status: Wandering.

 </div>

 <a name="two"></a>
 <div style="width:100%; height: 100%; overflow: auto; " align="center">
 <h1>What's her Story?</h1>

<p>When she initially came around to Japari Park, Kaban had no recollection of who, or what, she was. She was simply in posesion of her clothes, her bag, and her hat, which donned a singular feather. But upon meeting a certain Serval shortly after waking up, she embarked on an exapsnive journey to find out what she was, and where she had come from.</p>
<p>She was a human, and had been told that humans had gone extinct a long time ago. But after continuing on her journey, she found this to be untrue. There were more of her people out there, and Kaban was every kind of intent on finding them.</p>
<p>After defeating a giant Cerulean, a creature who simply devours in search of Sandstar, Kaban embarked on her next big journey: To find more humans, crossing a great ocean to the next region over.</p>
<p>And that's where we come to present time. Kaban's found a new home in this next region over, having set up a base of operations with the Professor and her assistant, a Northern White-faced Owl and a Eurasian Eagle Owl, working to research how and why the Ceruleans keep appearing in Japari Park.</p>
 </div>


<a name="three"></a>
 <div style="width:100%; height: 100%; overflow: auto; " align="center">
 <h1>Notes and Headcanons</h1>

 <li>Kaban has a reserved, calm, and caring personality, and tends to think carefully about what to say before saying it, unlike a few of her friends.</li>
<li>Even though Kaban can be brave, she is also very easily scared.</li>
<li>Her choice of music contrasts to her personality, as she tends to enjoy classic rock or metal.</li>
 </div>
</div>