O5. Belle's profile for Arianna

<style type="text/css">
@import url(https://fonts.googleapis.com/css?family=Josefin+Sans:100,700);
@import url(https://fonts.googleapis.com/css?family=Lora:400,400italic,700,700italic);


::-webkit-scrollbar-thumb:vertical {
background-color: #BB90A8;
}

::-webkit-scrollbar {
width: 5px;
background-color: transparent;
}

body {
background: url(http://static.tumblr.com/fd25cf263f97e81a3b403a06dae0013e/fecg7oi/2L7n85q3k/tumblr_static_6juq17iajdwkgs00cwcw4s0cs.png) repeat fixed;
font:10px lora, serif;
color:#573B2B;
}

a, body, span {
cursor:default;
}

span {
border-bottom:1px #796BAE dotted;
color:#796BAE;
}

.ion {
position:absolute;
left:45px;
bottom:15px;
padding:15px;
background-color:#fff;
width:120px;
}

.short {
position:absolute;
left:205px;
height:37px;
padding:10px;
width:140px;
bottom:15px;
text-align:center;
background-color:#fff;
}

.pr {
position:absolute;
left:205px;
bottom:72px;
letter-spacing:-2px;
font:22px josefin sans, sans-serif;
color:#000;
font-weight:100;

}

b {
color:#6C5C7A;
text-transform:uppercase;
font:bold 12px corbel, sans-serif;
line-height:11px;
}

i {
color:#BE6D84;
}

strike {
color:#796BAE;
}

.navs {
position:absolute;
left:205px;
bottom:105px;
width:190px;
text-align:left;
z-index:99
}

.navo {
display:inline-block;
background-color:#B2A2C7;
padding:13 28 13 22;
margin:1 1 0 1;
}

.navo:hover {
background-color:#8D4585;
}

.op {
-webkit-transition:all 0.6s ease-out;
-moz-transition:all 0.6s ease-out;
-ms-transition:all 0.6s ease-out;
-o-transition:all 0.6s ease-out;
}

.holds {
position:absolute;
top:275px;
left:45px;
height:333px;
text-align:justify;
opacity:0.0;
background-color:#fff;
padding:10px;
overflow:auto;
width:300px;
}

.holds:target {
opacity:1.0;
z-index:7;
}

h2 {
font:italic 12px josefin sans, sans-serif;
text-transform:uppercase;
text-align:center;
padding-bottom:5px;
margin:0 0 10 0;
border-bottom:1px #999 dashed;
}

.al {
padding:2 5 2 2;
text-align:right;
font:10px lora, serif;
}
.ar {
padding:2 2 2 5;
text-align:left;
font:10px lora, serif;
}

#enco img {
width:90px;
padding:3px;
}

#enco img:hover {
opacity:0.5;
}

.cred a {
text-decoration:none;
color:#573B2B;
}

.cred a:hover {
color:#573B2B;
 text-shadow: 4px -2px #FFD9E0;
}

.whats {
position:absolute;
bottom:0px;
left:0px;
}

audio {
position:absolute;
left:15px;
width:45px;
z-index:2;
margin:-8px 0px 0px -15px;
opacity:0.0;
z-index:599;
}

.cover {
position:absolute;
top:6px;
left:143px;
width:45px;
height:20px;
}

.cred {
border:1px #999 solid;
padding:5px;
background-color:#fff;
position:absolute;
top:4px;
width:10px;
right:4px;
height:10px;
overflow:hidden;
text-align:left;
}

.cred a {
text-decoration:none;
color:#999;
font-style:italic;
}


.cred:hover {
width:90px;
}


.c {
margin:-12px 0 0 20px;
}

.cred img {
width:10px;
opacity:0.8;
}


</style>

<a href="#"><img src="https://68.media.tumblr.com/2909495b52dc5489a44ce85a256c070c/tumblr_ocijg09DFl1vuhalio2_250.png" class="ion"></a>
<div class="short"><b>ARIANNA</b>. 18. <br>daughter of aphrodite.<br>freshman @ u of olympia</div>
</div>
<div class="pr">HEARTBREAKER

<div class="cover"><img src="http://66.media.tumblr.com/tumblr_m7w2izzY0j1r6o8v2.gif"><audio controls>
 <source src="MP3URL">
</audio>
</div>


</div>

<div class="navs">
<a href="#stat" class="op navo"></a>
<a href="#pers" class="op navo"></a>
<a href="#abil" class="op navo"></a><br>
<a href="#hist" class="op navo"></a>
<a href="#enco" class="op navo"></a>
<a href="#ooc" class="op navo"></a>

</div>





<div class="holds op" id="stat">
<h2>rule number one is that you gotta have fun</h2>

<table width="300" >
<tr>
<th class="ar"><b>name</b></th>
<th class="al">arianna grande or something idk</th>
</tr>
<tr>
<th class="ar"><b>date of birth</b></th>
<th class="al">whenever i tell you it is</th>
</tr>
<tr>
<th class="ar"><b>gender</b></th>
<th class="al">female</th>
</tr>
<tr>
<th class="ar"><b>occupation</b></th>
<th class="al">student</th>
</tr>
<tr>
<th class="ar"><b>from</b></th>
<th class="al">me mum</th>
</tr>
<tr>
<th class="ar"><b>height</b></th>
<th class="al">2cute4u.</th>
</tr>
<tr>
<th class="ar"><b>marital</b></th>
<th class="al">no strings attached</th>
</tr>
<tr>
<th class="ar"><b>classification</b></th>
<th class="al">demi-god; daughter of aphrodite</th>
</tr>

<tr>
<th class="ar"><b>copy</b></th>
<th class="al">this stat for more stats</th>
</tr>


</table>
</div>


<div class="holds op" id="abil">
<h2>this is how to be a heartbreaker</h2>
<b>ability</b> <br>
description<br><br>
</div>

<div class="holds op" id="pers">
<h2>i love you — at least i think i do</h2>
personality of a bubblegum bitch
</div>

<div class="holds op" id="hist">
<h2>boys, they like the look of danger</h2>
your history here, yo<Br><br>

</div>

<div class="holds op" id="enco">
<h2>we'll get them fallin' for a stranger, a player</h2>
<a target="_blank" href="https://roleplay.chat/profile.php?user=Evangeline"><img class="op" src="http://media.tumblr.com/22eefaac78bfdfbe6dc6468da81aba44/tumblr_inline_moc9xbwazh1qz4rgp.png" title="evangeline kwon; best friend, despite how much we fight."></a>
<a target="_blank" href="https://roleplay.chat/profile.php?user=Maja"><img class="op" src="https://s-media-cache-ak0.pinimg.com/236x/d3/ac/11/d3ac1164fbf8241ec026bc4e49187a00.jpg" title="maja belmonte; sister from another mister - literally. another daughter of aphrodite."></a>
<br>
use square images <b>only</b> or i'll cry very hard
</div>

<div class="holds op" id="ooc">

<b><i>001</i></b> coded by cindy. you're not allowed to use this for yourself.<br>
<b><i>002</i></b> admin of the greek university room.<br>
<b><i>003</i></b> if you wish to join, send me a PM/mail.<br>
<b><i>004</i></b> fc is zendaya coleman.<br><br><br>

all boxes will scroll; looks ugly. don't recommend it. but they will if you need them to<br>
if you don't use square images in the friends section i will never stop screaming
(not that i stop anyway but this time i'll be screaming at you)<br>
i'm taking up space<br>
i'm very tired, i want cereal and more apple toast and can you tell i'm considering bringing back my majamonster<br>
<i>considering:</i> see i'm <b>gonna</b> #857289
</div>


<div class="cred op">
<a target="_blank" href="https://roleplay.chat/profile.php?user=Cindy Moon" class="op"><img src="http://i.picpar.com/0lVb.png"><p class="c">codes by cindy!</p></a>
</div>