changes

<style>
/*
INVISIBLE CREDIT; PLEASE DON'T REMOVE

Author: Elle
For: Ryujin Shimada [RPC Profile]
Text type: CSS/HTML
*/

@import url('https://fonts.googleapis.com/css?family=Audiowide|Glass+Antiqua|Gruppo|IM+Fell+English+SC|Josefin+Slab|Kumar+One|Megrim|Righteous|Unica+One');
::-webkit-scrollbar {width: 0.3vw; height: 0.3vh;}
::-webkit-scrollbar-track {border-radius: 0px; background: transparent;}
::-webkit-scrollbar-thumb {border-radius: 0px; background: #aaa;}

body{
 overflow:hidden;
 background: black;
}

* {
 cursor: url('http://cur.cursors-4u.net/cursors/cur-7/cur641.cur'), progress !important;
 cursor:pointer url('http://cur.cursors-4u.net/cursors/cur-7/cur638.cur'), progress !important;}
 }

 img {
 user-drag: none;
 user-select: none;
 -moz-user-select: none;
 -webkit-user-select: none;
 -webkit-user-drag: none;
 -ms-user-select: none;
 }

#pic {
 position: fixed;
 height:100%;
 width: 43%;
 background: transparent;
 top: -2%;
 right: 0%;
 z-index: -1;
}

#content{
 position: fixed;
 height: 100%;
 width: 60%;
 background: transparent;
 top: 0%;
 left: 0;
}

#name{
 position: absolute;
 height: 8%;
 width: 100%;
 top: 12%;
 font-family: 'Audiowide';
 font-size: 7vh;
color: #64377a;
 animation: pulse 2.5s 1;
 -webkit-animation: pulse 2.5s 1;
 animation-iteration-count: infinite;
 animation-direction: alternate;
}

@keyframes pulse{
 from{opacity:1;}
 to{opacity:0.4;}
}

@-webkit-keyframes pulse{
 from{opacity:1;}
 to{opacity:0.4;}
}

#nav{
 position: absolute;
 height: 50%;
 width: 10%;
 background: transparent;
 top: 25%;
 right: 7%;
}

.nav1 {
 position: absolute;
 height: 7%;
 width:31%;
 background: #bbb;
 border: 5px solid;
 border-color: #5e5e5e;
 top: 20%;
 transition-duration: 0.4s;
}

.nav1:hover{
 transition-duration: 0.8s;
 transform: rotate(360deg);
 border-radius: 100%;
 border-color: #cdcdcd;
 background: #cdcdcd;
}

.nav2 {
 position: absolute;
 height: 7%;
 width:31%;
 background: #bbb;
 border: 5px solid;
 border-color: #5e5e5e;
 top: 35%;
 transition-duration: 0.4s;
}

.nav2:hover{
 transition-duration: 0.8s;
 transform: rotate(360deg);
 border-radius: 100%;
 border-color: #cdcdcd;
 background: #cdcdcd;
}

.nav3 {
 position: absolute;
 height: 7%;
 width:31%;
 background: #bbb;
 border: 5px solid;
 border-color: #5e5e5e;
 top: 50%;
 transition-duration: 0.4s;
}

.nav3:hover{
 transition-duration: 0.8s;
 transform: rotate(360deg);
 border-radius: 100%;
 border-color: #cdcdcd;
 background: #cdcdcd;
}

.nav4 {
 position: absolute;
 height: 7%;
 width:31%;
 background: #bbb;
 border: 5px solid;
 border-color: #5e5e5e;
 top: 65%;
 transition-duration: 0.4s;
}

.nav4:hover{
 transition-duration: 0.4s;
 transform: rotate(360deg);
 border-radius: 100%;
 border-color: #cdcdcd;
 background: #cdcdcd;
}

#box{
 position: absolute;
 height: 50%;
 width: 75%;
background: #60367d59;
 top: 25%;
 left: 2%;
 border-radius: 15px;
 padding: 15px;
 font-family: 'Unica One';
 color: #ccc;
 font-size: 2.3vh;
}

#host {height: 100%; width: 100%; overflow: hidden;}

#one, #two, #three, #four {height: 100%; width: 100%; overflow: auto;}

#one:target, #two:target, #three:target, #four:target {animation: appear 1.5s 1;-webkit-animation: appear 1.5s 1;}

@keyframes appear{
from{opacity:0;}
to{opacity:1;}
}

@-webkit-keyframes appear{
from{opacity:0;}
to{opacity:1;}
}

h1 {
 font-family: 'Righteous';
 font-size: 3vh;
}

.r {float: right;}

b {color: #db8e5c; font-weight: bold;}

/* please don't remove the credit! I worked hard on this, fam :c */

#credit {
 position: absolute;
background: rgba(33, 18, 43,0.5);
 border-left: 5px solid;
 border-color: rgba(0,0,0,0.6);
 bottom: 6%;
 left:20%;
 font-family: 'Gruppo';
 font-weight: bold;
 color: #000;
 padding: 3px;
 font-size: 2.2vh;
}

a {text-decoration: none; color: #7a0051; transition-duration: 0.5s;}
a:hover {font-size: 2.7vh; transition-duration: 0.5s;}

</style>
<div id="pic">
 <img src="https://i.imgur.com/PBdxzwk.jpg" style="height: 110%;width:auto;">
 <div id="credit">
 © <a target="_blank" href="https://roleplay.chat/profile.php?user=Elsie">Elle</a>. Get the code <a target="_blank" href="http://pastebin.com/srfAqZQC">here.</a>
 </div>
</div>
<div id="content">
 <center><div id="name">Bae</div></center>
 <div id="nav">
 <a href="#one"><div class="nav1"></div></a>
 <a href="#two"><div class="nav2"></div></a>
 <a href="#three"><div class="nav3"></div></a>
 <a href="#four"><div class="nav4"></div></a>
 </div>
 <div id="box">
 <div id="host">
 <div id="one">
 <center><h1>Stats</h1></center>
 <br><br>
 <b>Name</b> <div class="r">Bae Anderson</div><br>
 <b>Nickname</b> <div class="r">Bo, Baeby</div><br>
 <b>Gender</b> <div class="r">Female</div><br>
 <b>Hair</b> <div class="r">Green/Teal</div><br>
 <b>Eyes</b> <div class="r">Pink with a hint of yellow</div><br>
 <b>Species</b> <div class="r">Rabbit</div><br>
 <b>Orientation</b> <div class="r">Straight</div><br>
 <b>Health Status</b> <div class="r">Pregnant</div><br>
 <b>Marital Status</b> <div class="r"> <a href="profile.php?user=Lys" target="_blank">My Detective</a>. </div><br>
 </div>
 <div id="two">
 <center><h1>Biography</h1></center>
 <center>Info here<br>Work In Progress<br>
 </div>
 <div id="three">
 <center><h1>Connections</h1></center><br>
 <center><a href="profile.php?user=Bellus"a target="_blank" href="Bellus"><img src="http://i.imgur.com/HTIbmHO.jpg" height="75" width="75" align="left" border="3" border-color="#000"></a></center>
 <center><b>Bell</b><br> <i>Bun Buddy</i><br>Bun Butt Wiggler</center><br><br>
 </div>
 <div id="four">
 <center><h1>OOC</h1></center>
 <br>
 <b>☯</b> No OOC Drama <br>
 <b>☯</b> Taken IRL <br>
 <b>☯</b> Fuck if I want <br>
 <b>☯</b> I own the art, Don't steal. <br>
<b>☯</b> Not my code. <br>
<b>☯</b> I'll decide If I give you another way to contact me.<br>
 <br>
 <center><h1>Typist Info</h1></center>
 <b>☯</b> I don't do one liners. They're boring. <br>
<b>☯</b> You can attempt starting with a post. Whether I reply is if you're boring or not.
</div>
</div>
</div>

</div>