New Toriel

<style>body {background-color: #000000;}
p {padding:2; margin:0;}
@keyframes marquee {
 0% { top: -100%; }
 99% { top: 40%; }
 100% { top: 100%}}
.marquee {
 height: 10000px;
 width: 420px;
 overflow: hidden;
 position: relative;}
.marquee div {
 height: 10000px;
 position: relative;
 overflow: hidden;
 animation: marquee 25s linear infinite;}
a:link {color:#000000; text-shadow: none;}
a:hover {Color:#ffffff; text-shadow: 0px 0px 2px #5A4183; text-decoration: none;}
a:active {color:#ffffff; text-shadow: 0px 0px 10px #5A4183; text-decoration: none;}
 ::-webkit-scrollbar {width: 4px; }
 ::-webkit-scrollbar-thumb:vertical {
 background: #ffffff; border-radius: 25px;}
#profile1 {
 position: fixed;
 left: 30%; top: 15%;
 width: 40%; height: 50%;
 z-index: 2; opacity:.0;
 font-family: Courier New;
 color: #ffffff;
 font-size: 12px;
 padding: 15px 0px 10px 0px;
 transition-delay: 99999s;}

#content:hover #profile1 {
 position: fixed; opacity:1; top: 25%;
 transition: all 1s ease-in;
 -moz-transition: all 1s ease-in;
 -webkit-transition: all 1s ease-in;
 transition-delay: 4.5s;}

#profile2 {
 position: fixed;
 left: 0%; top: 0%;
 line-height: 100%;
 display: flex;
 justify-content: center;
 align-items: center;
 width: 100%;
 height: 100%;
 z-index: 1;
 transition-delay: 99999s;}

#content:hover #profile2 {opacity:0;
 transition: all 1.5s ease-out;
 -moz-transition: all 1.5s ease-out;
 -webkit-transition: all 1.5s ease-out;}


#content:hover #profile3 {
 position: fixed;
 left: 20%; top: 22%;
 width: 60%; height: 1px;
 z-index: 3; opacity:1;
 background-color:ffffff;
 transition: all 1.5s ease-out;
 -moz-transition: all 1.5s ease-out;
 -webkit-transition: all 1.5s ease-out;
 transition-delay: 1.5s;}

#content:hover #profile4 {
 position: fixed;
 left: 20%; bottom: 20%;
 width: 60%; height: 1px;
 z-index: 3; opacity:1;
 background-color:ffffff;
 transition: all 1.5s ease-out;
 -moz-transition: all 1.5s ease-out;
 -webkit-transition: all 1.5s ease-out;
 transition-delay: 1.5s;}


#content:hover #profile5 {
 position: fixed;
 left: 22%; top: 20%;
 width: 1px; height: 62%;
 z-index: 3; opacity:1;
 background-color:ffffff;
 transition: all 1.5s ease-out;
 -moz-transition: all 1.5s ease-out;
 -webkit-transition: all 1.5s ease-out;
 transition-delay: 3s;}

#content:hover #profile6 {
 position: fixed;
 right: 22%; top: 20%;
 width: 1px; height: 62%;
 z-index: 3; opacity:1;
 background-color:ffffff;
 transition: all 1.5s ease-out;
 -moz-transition: all 1.5s ease-out;
 -webkit-transition: all 1.5s ease-out;
 transition-delay: 3s;}


#profile3 {
 position: fixed;
 left: -60%; top: 22%;
 width: 60%; height: 1px;
 z-index: 3; opacity:1;
 background-color:ffffff;
 transition-delay: 99999s;}

#profile4 {
 position: fixed;
 left: -60%; bottom: 20%;
 width: 60%; height: 1px;
 z-index: 3; opacity:1;
 background-color:ffffff;
 transition-delay: 99999s;}


#profile5 {
 position: fixed;
 left: 22%; top: -62%;
 width: 1px; height: 62%;
 z-index: 3; opacity:1;
 background-color:ffffff;
 transition-delay: 99999s;}

#profile6 {
 position: fixed;
 right: 22%; top: -62%;
 width: 1px; height: 62%;
 z-index: 3; opacity:1;
 background-color:ffffff;
 transition-delay: 99999s;}

#profile7 {
 position: fixed; overflow: hidden;
 left: -12%; top: 8%; width: 10%;
 height: 80%; z-index: 5;
 border-color: #ffffff;
 border-width: 1px;
 font-family: century gothic;
 font-variant: small-caps;
 border-style: Solid;
 background-color: #000000;
 font-size: 12px;
 padding: 10px 5px;
 transition-delay: 99999s;}
#profile8 {
 position: relative;
 overflow: hidden;
 width: 100%;
 height: 300%;}

#content:hover #profile7 {
 left:2%;
 transition: all 1.5s ease-out;
 -moz-transition: all 1.5s ease-out;
 -webkit-transition: all 1.5s ease-out;
 transition-delay: 4.5s;}

#profile10 {
 position: fixed; overflow: hidden;
 right: -12%; top: 8%; width: 10%;
 height: 80%; z-index: 5;
 border-color: #ffffff;
 border-width: 1px;
 font-family: century gothic;
 font-variant: small-caps;
 border-style: Solid;
 background-color: #000000;
 font-size: 12px;
 padding: 10px 5px;
 transition-delay: 99999s;}
#profile11 {
 position: relative;
 overflow: hidden;
 width: 100%;
 height: 300%;}

#content:hover #profile10 {
 right:2%;
 transition: all 1.5s ease-out;
 -moz-transition: all 1.5s ease-out;
 -webkit-transition: all 1.5s ease-out;
 transition-delay: 4.5s;}

</style><div id=content>


<div id=profile1><div style="width:100%; height: 100%; top: 100px; overflow: auto;" align="center"><font size=3>
Some title here or something</font><hr color>
<p>
<span style="float:left;">stat name</span><span style="float:right;">stat value</span><br><br>
<span style="float:left;">stat name</span><span style="float:right;">stat value</span><br><br>
<span style="float:left;">stat name</span><span style="float:right;">stat value</span><br><br>
<span style="float:left;">stat name</span><span style="float:right;">stat value</span><br><br>
<span style="float:left;">stat name</span><span style="float:right;">stat value</span><br><br>
<span style="float:left;">stat name</span><span style="float:right;">stat value</span><br><br>

<hr color><p><br>

Character Info / backstory / etc.

<br><br><hr color>OOC<hr color><br><p>

OOC stuff here

<br><br><audio controls>
 <source src="">
</audio>
</div></div>
<div id=profile3></div><div id=profile4></div><div id=profile5></div><div id=profile6></div>
<div id=profile2><img src="http://orig11.deviantart.net/c1f2/f/2015/330/4/4/toriel___undertale_by_yukipyro-d9i45u1.jpg" class="image" width="500px;" height="auto;"></div>

<div id="profile7"><div id="profile8" class="marquee"><div style="width:100%; height: 100%; top: 100px; overflow: hidden; display:inline-block;" align="center">

<a target="_blank" href="PROFILE ADRESS OF FRIEND" target="_blank"><img style="position: inherit; width: 100%;" src="IMAGE OF FRIEND" title="RELATIONSHIP WITH FRIEND" alt="" /></a>
<a target="_blank" href="PROFILE ADRESS OF FRIEND" target="_blank"><img style="position: inherit; width: 100%;" src="IMAGE OF FRIEND" title="RELATIONSHIP WITH FRIEND" alt="" /></a>
<a target="_blank" href="PROFILE ADRESS OF FRIEND" target="_blank"><img style="position: inherit; width: 100%;" src="IMAGE OF FRIEND" title="RELATIONSHIP WITH FRIEND" alt="" /></a>
<a target="_blank" href="PROFILE ADRESS OF FRIEND" target="_blank"><img style="position: inherit; width: 100%;" src="IMAGE OF FRIEND" title="RELATIONSHIP WITH FRIEND" alt="" /></a>
<a target="_blank" href="PROFILE ADRESS OF FRIEND" target="_blank"><img style="position: inherit; width: 100%;" src="IMAGE OF FRIEND" title="RELATIONSHIP WITH FRIEND" alt="" /></a>
<a target="_blank" href="PROFILE ADRESS OF FRIEND" target="_blank"><img style="position: inherit; width: 100%;" src="IMAGE OF FRIEND" title="RELATIONSHIP WITH FRIEND" alt="" /></a>
<a target="_blank" href="PROFILE ADRESS OF FRIEND" target="_blank"><img style="position: inherit; width: 100%;" src="IMAGE OF FRIEND" title="RELATIONSHIP WITH FRIEND" alt="" /></a>
<a target="_blank" href="PROFILE ADRESS OF FRIEND" target="_blank"><img style="position: inherit; width: 100%;" src="IMAGE OF FRIEND" title="RELATIONSHIP WITH FRIEND" alt="" /></a>
<a target="_blank" href="PROFILE ADRESS OF FRIEND" target="_blank"><img style="position: inherit; width: 100%;" src="IMAGE OF FRIEND" title="RELATIONSHIP WITH FRIEND" alt="" /></a>
<a target="_blank" href="PROFILE ADRESS OF FRIEND" target="_blank"><img style="position: inherit; width: 100%;" src="IMAGE OF FRIEND" title="RELATIONSHIP WITH FRIEND" alt="" /></a>
<a target="_blank" href="PROFILE ADRESS OF FRIEND" target="_blank"><img style="position: inherit; width: 100%;" src="IMAGE OF FRIEND" title="RELATIONSHIP WITH FRIEND" alt="" /></a>
<a target="_blank" href="PROFILE ADRESS OF FRIEND" target="_blank"><img style="position: inherit; width: 100%;" src="IMAGE OF FRIEND" title="RELATIONSHIP WITH FRIEND" alt="" /></a>
<a target="_blank" href="PROFILE ADRESS OF FRIEND" target="_blank"><img style="position: inherit; width: 100%;" src="IMAGE OF FRIEND" title="RELATIONSHIP WITH FRIEND" alt="" /></a>


</div></div></div>

<div id="profile10"><div id="profile11" class="marquee"><div style="width:100%; height: 100%; top: 100px; overflow: hidden; display:inline-block;" align="center">

<a target="_blank" href="IMAGE LINK" target="_blank"><img style="position: inherit; width: 100%;" src="SAME IMAGE LINK" alt="" /></a>
<a target="_blank" href="IMAGE LINK" target="_blank"><img style="position: inherit; width: 100%;" src="SAME IMAGE LINK" alt="" /></a>
<a target="_blank" href="IMAGE LINK" target="_blank"><img style="position: inherit; width: 100%;" src="SAME IMAGE LINK" alt="" /></a>
<a target="_blank" href="IMAGE LINK" target="_blank"><img style="position: inherit; width: 100%;" src="SAME IMAGE LINK" alt="" /></a>
<a target="_blank" href="IMAGE LINK" target="_blank"><img style="position: inherit; width: 100%;" src="SAME IMAGE LINK" alt="" /></a>
<a target="_blank" href="IMAGE LINK" target="_blank"><img style="position: inherit; width: 100%;" src="SAME IMAGE LINK" alt="" /></a>
<a target="_blank" href="IMAGE LINK" target="_blank"><img style="position: inherit; width: 100%;" src="SAME IMAGE LINK" alt="" /></a>
<a target="_blank" href="IMAGE LINK" target="_blank"><img style="position: inherit; width: 100%;" src="SAME IMAGE LINK" alt="" /></a>
<a target="_blank" href="IMAGE LINK" target="_blank"><img style="position: inherit; width: 100%;" src="SAME IMAGE LINK" alt="" /></a>
<a target="_blank" href="IMAGE LINK" target="_blank"><img style="position: inherit; width: 100%;" src="SAME IMAGE LINK" alt="" /></a>
<a target="_blank" href="IMAGE LINK" target="_blank"><img style="position: inherit; width: 100%;" src="SAME IMAGE LINK" alt="" /></a>
<a target="_blank" href="IMAGE LINK" target="_blank"><img style="position: inherit; width: 100%;" src="SAME IMAGE LINK" alt="" /></a>
<a target="_blank" href="IMAGE LINK" target="_blank"><img style="position: inherit; width: 100%;" src="SAME IMAGE LINK" alt="" /></a>

</div></div></div></div>