Grell

<style>
.pfor{display:none;}
body {background-color: #000000;}
body {background-image:url("http://cdn.wallpapersafari.com/19/36/zMR1F3.jpg"); background-attachment:fixed; background-size:100%;}
#pbox {margin: auto;
width: 600px;
background-color:black;
border-style: solid;
border-width: 2px;
border-color: #333;
padding: 5px;
}
</style>

<style type="text/css">
!-- Copy from here, into the Style section --!
#player{
 position: fixed;
 z-index:2;
 bottom: 230px;
 left: 934px;
 border-radius: 15px;
 width: 32px;
 height: 32px;
 border: 5px solid #D5D5D5;
 box-shadow: 0px 0px 19px #D5D5D5;
 overflow:hidden;}


</style>



<style>
ul {
 list-style-type: none;
 margin: 0;
 padding: 0;
 overflow: hidden;
 background-color: #702727;
}

li {
 float: left;
}

li a {
 display: block;
 color: #FFFFFF;
 text-align: center;
 padding: 14px 16px;
 text-decoration: none;
}

li a:hover {
 background-color: #420F0F;
}
</style>



<ul>
 <li><a href="#one">Stats</a></li>
 <li><a href="#two">Personality</a></li>
 <li><a href="#three">History</a></li>
 <li><a href="#four">OOC</a></li>
 <li><a href="#five">Gallery</a></li>
 <li><a href="#home">Reset</a></li>
</ul>






<style>
img {
 border-radius: 50%;
}

img {
 display: block;
 margin: auto;
 font-size: 18px;
}


.tabs {
float: left;
margin-right: 15px;
margin-bottom: 15px;
width: 54px;
height: 54px;
text-align: left;
}

.info{
position: fixed;
right: 350;
bottom: 95;
margin-top: 234px;
width: 326px;
height: 425px;
padding: 10px;
background: #540F0F;
font-family: Arial Italic;
color: #A02424;
font-size: 14px;
line-height: 15px;
text-align: justify;
border: 2px solid #A02424;
outline-offset: 2px;
opacity: 0;
overflow: auto;
transition: 1s;
}

.info:target{
opacity: 1;
transition: 1s;
z-index: 1;
}


</style>


<div class="info" id="one"><h1>Stats</h1>
<strong>Full Name:</strong> Grell Sutcliff <br><br>
<strong>Age:</strong> 28 <br><br>
<strong>Gender:</strong> Male, get over my bueaty! <br><br>
<strong>Race:</strong> Grim Reaper <br><br>
<strong>Height:</strong> 175cm (5'9") <br><br>
<strong>Alias:</strong> - <br><br>
<strong>Build:</strong> Slender, Feminime <br><br>
<strong>Sexual Orientation:</strong> Hm...do you like me? Is that why you want to know? Sub/Dom: 88/12%<br><br>
<strong>Status:</strong> Single <br> <br>
<strong>Occupation:</strong> Retrieval Division of the Grim Reaper Dispatch </div>

<div class="info" id="two"><h1>Personality</h1>
Grell is over-the-top, flamboyant, and outspoken—they once told Sebastian Michaelis their wish to do some "vigorous exercise" with him, despite the latter's repulsion.[4] They possess a strong predilection for the color red and believe that substances which reflect that color, such as blood, can be used to achieve beauty.[4] They are a ruthless, bloodthirsty individual who is even willing to kill their own comrades once they lose interest in them.[5] Grell is predisposed to resort to violence in order to eliminate whoever annoys or hinders them, and has had numerous clashes with Sebastian; in one instance, upon encountering Sebastian on Campania, Grell immediately expresses their intention to have a "death match" with him and proceeds to attack him.[6]
 <br><br>
In Grell's personal view, human relations are not of great significance, and hence, they do not understand a human's reluctance to kill a person he or she cares about. They despise hesitation in their partners and find that meaningless emotion serve as an impediment to one's goal.[7]
 <br><br>
Grell was, at first, dismissive of the Grim Reaper principles—which include the necessity to be neutral in human affairs—as evidenced by their unlawful partnership with Angelina Dalles. But, after a period of suspension, Grell begins to respect the duties of a Grim Reaper, enough to preach the importance of soul reaping to Ronald Knox at one point.[8] However, due to how naturally impulsive Grell is, their adherence to the Grim Reaper rules remains questionable; for example, on one occasion, Grell was about to slay Aleistor Chamber, ignoring Ronald's cry that killing humans is forbidden.[9]
 <br><br>
Grell is very fond of using double-entendres and incorporating plays into their speech. They often put things in terms of theater, referring to Angelina's death as the "falling of curtains"[5] and comparing their conflicting Grim Reaper and demon relationship with Sebastian to the famous play, Romeo, and Juliet.[10]
 <br><br>
When posing as Angelina Dalles's butler, Grell is shy, awkward, and quite ineffective at their job, ruining even simple things like preparing tea and getting lost while driving a carriage.[11]</div>

<div class="info" id="three"><h1>History</h1>When Angelina Dalles started the Jack the Ripper murders, Grell followed her since she was the reason for the soul retrieval list being so filled. They sympathized with her, since they could relate to her troubles—the inability to give birth—and opted to help her, even though such an action blatantly defies the Grim Reaper's code of neutrality. Grell then disguised themselves as the Burnett family's butler to avoid suspicion.[12]</div>

<div class="info" id="four"><h1>OOC</h1><strong>Pm Friendly<br><br>Rp Friendly<br><br>I will never start if we discuss, I'm horrible at it.<br><br>No limits.<br><br>Please try and start with a post, I accept all RPers until you one-line me<br><br> I used to accept it until I sent a Multi-Para and got a one liner<br><br> I can go from Semi to Multi-Para in a few seconds.<br><br></strong></div>

<div class="info" id="five"><h1>Gallery</h1><style>

div.img {
 margin: 5px;
 border: 1px solid #ccc;
 float: left;
 width: 180px;
}

div.img:hover {
 border: px solid #777;
}

div.img img {
 width: 100%;
 height: 80%;
}

div.desc {
 padding: 15px;
 text-align: center;
}
</style>


<div class="img">
 <a target="_blank" href="http://i.imgur.com/Zh2IaFx.jpg">
 <img src="http://i.imgur.com/Zh2IaFx.jpg" width="300" height="200">
 </a>
</div>

<div class="img">
 <a target="_blank" href="http://i.imgur.com/Ay4cl10.jpg">
 <img src="http://i.imgur.com/Ay4cl10.jpg" width="300" height="200">
 </a>
</div>


<div class="img">
 <a target="_blank" href="http://i.imgur.com/AyoZezv.jpg">
 <img src="http://i.imgur.com/AyoZezv.jpg" width="300" height="200">
 </a>
</div>

<div class="img">
 <a target="_blank" href="http://i.imgur.com/3guDdX7.jpg">
 <img src="http://i.imgur.com/3guDdX7.jpg" width="300" height="200">
 </a>
</div>


<div class="img">
 <a target="_blank" href="http://i.imgur.com/OGqKlZY.png">
 <img src="http://i.imgur.com/OGqKlZY.png" width="300" height="200">
 </a>
</div>

<div class="img">
 <a target="_blank" href="http://i.imgur.com/6sKzkV8.jpg">
 <img src="http://i.imgur.com/6sKzkV8.jpg" width="300" height="200">
 </a>
</div>


<div class="img">
 <a target="_blank" href="http://i.imgur.com/f7hlLKW.jpg">
 <img src="http://i.imgur.com/f7hlLKW.jpg" width="300" height="200">
 </a>
</div>

<div class="img">
 <a target="_blank" href="http://i.imgur.com/arbhFV1.jpg">
 <img src="http://i.imgur.com/arbhFV1.jpg" width="300" height="200">
 </a>
</div>


<div class="img">
 <a target="_blank" href="http://i.imgur.com/PaOrNJO.jpg">
 <img src="http://i.imgur.com/PaOrNJO.jpg" width="300" height="200">
 </a>
</div>

<div class="img">
 <a target="_blank" href="http://i.imgur.com/gIMzcVd.jpg">
 <img src="http://i.imgur.com/gIMzcVd.jpg" width="300" height="200">
 </a>
</div>


<div class="img">
 <a target="_blank" href="http://i.imgur.com/dYFDRF7.jpg">
 <img src="http://i.imgur.com/dYFDRF7.jpg" width="300" height="200">
 </a>
</div>

<div class="img">
 <a target="_blank" href="http://i.imgur.com/bqVyW34.jpg">
 <img src="http://i.imgur.com/bqVyW34.jpg" width="300" height="200">
 </a>
</div>


<div class="img">
 <a target="_blank" href="http://i.imgur.com/gNlU6Ih.jpg">
 <img src="http://i.imgur.com/gNlU6Ih.jpg" width="300" height="200">
 </a>
</div>

<div class="img">
 <a target="_blank" href="http://i.imgur.com/ZFktEEO.jpg">
 <img src="http://i.imgur.com/ZFktEEO.jpg" width="300" height="200">
 </a>
</div>


<div class="img">
 <a target="_blank" href="http://i.imgur.com/iSV6cxf.png">
 <img src="http://i.imgur.com/iSV6cxf.png" width="300" height="200">
 </a>
</div>

<div class="img">
 <a target="_blank" href="http://i.imgur.com/uoST4Ta.jpg">
 <img src="http://i.imgur.com/uoST4Ta.jpg" width="300" height="200">
 </a>
</div>


<div class="img">
 <a target="_blank" href="http://i.imgur.com/0Kg3mo1.jpg">
 <img src="http://i.imgur.com/0Kg3mo1.jpg" width="300" height="200">
 </a>
</div>

<div class="img">
 <a target="_blank" href="http://i.imgur.com/gTjElrA.jpg">
 <img src="http://i.imgur.com/gTjElrA.jpg" width="300" height="200">
 </a>
</div>


</div>

<br>

<div id="player">
<audio controls loop="1"><source src="http://k003.kiwi6.com/hotlink/m67e01vr5h/ESPRIT_-_Esprit.mp3"></audio>
</div>




<style>
img {
 border-radius: 0%;
 display: block;
 margin: auto;
 height:60%;
 width: auto;
}
</style>