CSS

#profile-container {
  background: none;
}

body {
  background: #000;
}

body,
a:hover {
  cursor: url(http://i.imgur.com/cd7ZHDh.png), progress !important;
}

@font-face {
  font-family: text;
  src: url(https://dl.dropbox.com/s/e66og7xmtaxtacm/SourceCodePro-Regular.ttf?dl=0);
}

@font-face {
  font-family: name;
  src: url(https://dl.dropbox.com/s/4rgugoflu9yic2f/Inversionz.otf?dl=0);
}

.pic {
  z-index: 3;
  position: absolute;
  border: 3px solid #8A2FDE;
  top: 65px;
  left: 215px;
  width: 324px;
  height: 424px;
  background: url(https://i.imgur.com/rR6w8hr.jpg) center;
  background-size: 100%;
}

.namebox {
  z-index: 2;
  position: absolute;
  border: 1px solid #8A2FDE;
  padding: 5px;
  background: #222;
  width: 250px;
  text-align: center;
  height: 20px;
  font-size: 27px;
  font-family: name;
  text-transform: uppercase;
  left: 250px;
  top: 13px;
}

.back {
  z-index: 2;
  position: absolute;
  border: 5px solid #7025B6;
  background: #222;
  width: 350px;
  left: 200px;
  top: 50px;
  height: 450px;
}

.square {
  z-index: 1;
  position: absolute;
  border: 2px solid #8A2FDE;
  width: 398px;
  left: 180px;
  top: 30px;
  height: 498px;
}

.tabs {
  position: absolute;
  margin: 25px 0px;
}

.tab label {
  top: 490px;
  left: 236px;
  height: 20px;
  float: left;
  margin-left: 14px;
  background: #222;
  width: 20px;
  padding: 5px;
  position: relative;
  z-index: 400;
  color: #000;
  border: 1px solid #8A2FDE;
  font-size: 12;
  text-align: center;
  font-family: comic sans serif;
  cursor: url(https://i.imgur.com/SAa1psh.gif), progress !important;
  -webkit-transition: all .5s ease;
}

.tab label:hover {
  background: #111;
  -webkit-transition: all .5s ease;
}

.content {
  position: absolute;
  top: 40px;
  left: 215px;
  width: 314px;
  height: 414px;
  background: #111;
  padding: 5px;
  color: #cfcfcf;
  border: 3px solid #8A2FDE;
  font-family: text;
  font-size: 13px;
  overflow: auto;
  z-index: 20;
  opacity: 0;
  text-align: justify;
  -webkit-transition: all .5s ease;
}

[type=radio]:checked ~ label {
  -webkit-transition: all .5s ease;
}

[type=radio]:checked ~ label ~ .content {
  z-index: 30;
  opacity: 1;
  -webkit-transition: all .5s ease;
}

.tab [type=radio] {
  display: none;
}

table,
th,
td {
  font-family: text;
  font-size: 13px;
  padding: 3px;
  padding-bottom: 9px;
  padding-top: 9px;
}

td:nth-child(odd) {
  color: #999;
}

td:nth-child(even) {
  color: #cfcfcf;
}

hr {
  height: 1px;
  border: none;
  background: #fff;
  width: 240px;
}

a:link,
a:visited,
a:active {
  text-decoration: none;
  color: #999;
  -webkit-transition: all .5s ease;
}

a:hover {
  cursor: url(https://i.imgur.com/SAa1psh.gif), progress !important;
  color: #cfcfcf;
  text-shadow: 0 0 2px #000, 0 0 5px #fff;
  -webkit-transition: all .5s ease;
  cursor: url(https://i.imgur.com/SAa1psh.gif), progress !important;
}

::-webkit-scrollbar {
  width: 9px;
  height: 5px;
}

::-webkit-scrollbar-thumb {
  background: #fff;
  border: 3px solid #111;
}

::-webkit-scrollbar-track {
  background: #transparent;
}

.Credit {
  z-index: 0;
  position: fixed;
  right: 50px;
  bottom: 50px;
  width: 20px;
  height: 20px;
  border-radius: 20px;
  border-color: #fff;
  border-style: dotted;
  border-width: 2px;
  background: #000;
  -webkit-transition: all 1s ease;
}

.Credit:hover {
  background: #fff;
  border-color: #000;
}


HTML

<div class="pic">
<p>&nbsp;</p>
</div>
<div class="namebox">
<p><span style="color: #7025b6;">Raven</span></p>
</div>
<div class="back">
<p>&nbsp;</p>
</div>
<div class="square">
<p>&nbsp;</p>
</div>
<div class="tabs">
<div class="tab">
<div class="tab"><input id="tab-6" name="tab-group-2" type="radio" /> <label for="tab-6">&nbsp;</label>
<div class="content">
<p style="text-align: center;">Stats</p>
<hr />
<table border="0" cellspacing="0" width="313" height="231">
<tbody>
<tr>
<td style="text-align: left;">Name</td>
<td style="text-align: right;">Rachel Roth</td>
</tr>
<tr>
<td style="text-align: left;">Alias</td>
<td style="text-align: right;">Raven</td>
</tr>
<tr>
<td style="text-align: left;">Age</td>
<td style="text-align: right;">16</td>
</tr>
<tr>
<td style="text-align: left;">Gender</td>
<td style="text-align: right;">Female</td>
</tr>
<tr>
<td style="text-align: left;">Species</td>
<td style="text-align: right;">Half-Azarathian, half-demon</td>
</tr>
<tr>
<td style="text-align: left;">Height</td>
<td style="text-align: right;">5'11"</td>
</tr>
<tr>
<td style="text-align: left;">Weight</td>
<td style="text-align: right;">139</td>
</tr>
<tr>
<td style="text-align: left;">Sexuality</td>
<td style="text-align: right;">Here</td>
</tr>
<tr>
<td style="text-align: left;">Status</td>
<td style="text-align: right;">Here</td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="tab"><input id="tab-5" name="tab-group-2" type="radio" /> <label for="tab-5">&nbsp;</label>
<div class="content">
<p style="text-align: center;">Personality</p>
<hr />Raven is one of the most mysterious characters throughout the series. She is quiet, seemingly emotionless, intelligent, studious, and sarcastic. She can always come up with a smart remark, specifically in reply to most of the Teen Titans' antics and attempts at humor. Her appearance and attitudeappears to be that of a typical modern goth female. However, as much as she may seem slightly distant and anti-social, producer Sam Register describes her as a "...dark character, but a character everyone can relate to. She's a recluse and sort of to herself. We thought that would be a good dynamic with the rest of the team. She does have a dark background in the comic." Robin also said that she is "the most hopeful person he has ever known."
<p>&nbsp;</p>
Raven is often portrayed as the most mature member of the group, often giving her own advice to the others about various subjects, and generally staying cool and calm, even in desperate situations. She is, however, also the most emotionally-restrained of the Titans, appearing secretive and distant; she initially does not allow any of her fellow Titans into her room and spends most of her time by herself, usually meditating or reading one of her numerous books. Even though she is serious and cautious about her emotions, just like she was trying to tell Doctor Light saying, "Don't come any closer." The reason for her emotional restraint is due to the adverse effects her emotions have on her powers. If her emotions become out of control, her powers can become erratic and spontaneous, becoming active without her will. In the course of the series, however, she gradually, if only slightly, seems to warm up to her teammates. As shown through her quick suspicion of Terra, it is difficult for Raven to build trust for anyone, and even more difficult to truly forgive if that trust was to be broken. Eventually, she was able to forgive Terra.
<p>&nbsp;</p>
In several instances throughout the show, contrary to her usual behavior, she does show more emotion such as making "heart eyes" along with Starfire at the appearance of Aqualad in Deep Six (though this is mostly used for comedic effect). She also does ease up to have some fun on a few occasions, such as forcing Cyborg to go through 'initiation' again with Beast Boy and Robin in the episode Deception. Furthermore, Raven is known to sometimes be shocked at trivial things. One occasion in which this occurs is in "Overdrive", when Cyborg defeats Raven in a game of chess after installing the Maximum 7 in his brain. At thisoccasion her entire face and outfitturns white (also probably for comedic effect). In "Revved Up", she is also shocked at the sudden drop-in of Red X on the bus she is driving but quickly regains her monotone and determined stature when she realizes who it is. Another instance is when Raven, while playing a game of cards, comically gasps at the impressive sets of cards the rest of the Titans have at their disposal during "Winner Take All". She can lose her temper easily, and most of the time with Beast Boy.
<p>&nbsp;</p>
Raven is often shown to make sarcastic remarksto almost everything and can be seen as rather rude at times, but there is a slight chance thispersonality wasn't always who she was. When the Titans first met, Raven appeared to be more innocent and insecure. She declined Beast Boy's offer to get pizza, probably because she's afraid that he wouldn't like her, and because of him, feels as if she does not fit in with the others. Both Cyborg and Robin were not hesitant to accept her as a friend, even when she wasn't so sure herself. She was the first one to verbally recognize the others as friends, and even openly admits to Beast Boy being funny, which no sooner than a moment later, seems to regret making that statement. Her pessimistic and sarcastic attitude is then likely derived from having to put up with Beast Boy's constant corny jokes and immaturity.
<p>&nbsp;</p>
Despite her seemingly unfriendly attitude, Raven does indeed care greatly about the people she is attached to, as prominently displayed when she is put in charge of three children. Initially having little or no patience with Melvin, Timmy Tantrum, and Teether, Raven grows to love (or at least, enjoy) them, risking her own life to protect them from the Brotherhood of Evil, even calling them her kids. She also comes to regard the rest of the Titans as her closest friends and family. When the day she is destined to end the world finally came, she wanted nothing more than to ensure her friends' last day on Earth was perfect. This shows that despite everything that has ever happened, she truly cares about her friends and their interests. Finally, there are many instances where Raven is portrayed as the most understanding friend among the Titans. While seemingly uninterested towards Cyborg's T-Car, Raven is ultimately the only one who approaches and comforts him, even going as far as to assist in rebuilding the destroyed car. Overall, Raven is not cold-hearted, merely introverted, caring deeply about those close to her. While Raven seems to not care one bit about their hobbies and personalities, she does show her friends that she does care about them and values their friendship when it mattered most.
<p>&nbsp;</p>
Raven is often portrayed as the most pessimistic and insensitive member of the Titans, and she generally regards everything in a "black and white" manner. For example, when Beast Boy desperately asks Raven for words of comfort after their crushing defeat against the members of the H.I.V.E Academy, Raven tersely states that the Titans have to accept the situation, no matter how grave it is. She also reacts to Cyborg'sleaving of the Titans with little to no resentment, stating that people come and go by. When Raven surrenders herself in to her demonic father Trigon in order to fulfill the prophecy that she thought she had no way to prevent, however, Raven also appeared to still have retained hope to a certain degree that the lord of evil could be stopped, as she forcibly injected each of her friends with a portion of her own power to shield them and give them one last chance to save the world. It is then ironic that it was what had motivated her to surrender nearly all hope that ultimately destroyed Trigon.
<p>&nbsp;</p>
After banishing away Trigon from her soul and the Earth, Raven's personality seems to change for the better, as she grows to be less pessimistic and less anti-social. However, she still despises Beast Boy's corny jokes and enjoys reading in solitude, implying that her personality was not significantly affected by her semi-demonic origin.</div>
</div>
<div class="tab"><input id="tab-4" name="tab-group-2" type="radio" /> <label for="tab-4">&nbsp;</label>
<div class="content">
<p style="text-align: center;">History</p>
<hr />Arella, Raven's mother, was chosen to become the bride of the demonic Trigon, Abandoned by the demon, Arella was bent on suicide (while carrying Raven) when she was taken in by the pacifist disciples of Temple Azarath, a group who had centuries earlier forsaken life on Earth to pursue their own nonviolent lifestyle. In their inter-dimensional world, Raven, Arella's daughter by Trigon, was born. Fearing that the child would bring evil among them, Juris, a magistrate of Azarath, attempted to cast the infant Raven into Limbo, only to be destroyed himself. Azar, the spiritual leader of the temple, then took the young Raven under her personal tutelage, instructing her in the truth of her parentage, and in pacifism, meditation, and the submergence of her emotions to resist Trigon&rsquo;s influence, while perfecting her powers of teleportation, astral projection, and empathic healing. Later, after Azar&rsquo;s death (in which she entered another plane of existence), when Raven was plagued by prophetic dreams of Trigon and, defying her teachers, she confronted her demon father in Limbo at his bidding. Trigon spared her and Arella after satisfying himself that, upon his return when she reached adulthood, he could seduce Raven into becoming his ally. When Raven turned sixteen, she sensed Trigon's power returning and fled to Earth.
<p>&nbsp;</p>
Raven arrived at Jump City, where she met several super-powered youths fighting a rampaging alien girl. Raven managed to discern the girl's true reason for her demolition work and convinced the others into a more peaceful approach, which won them the alien's friendship. Despite Raven's obvious insecurity, the others invited her to join them in defeating the truly hostile aliens the Gordanians, who had attempted to enslave the girl and her presence proved ultimately essential to the motley crew's triumph over the Gordanians. Afterward, the group decided to stay together and formed the original Teen Titans. Though Raven, still feeling alienated from her new friends, remained distant to them, the other Titans soon came to learn more about her origins. First, Beast Boy and Cyborg inadvertently ended up stranded inside Raven's own mind, where they met the personifications of her separated emotional aspects and also encountered and fought the manifestation of Trigon's heritage inside her. Soon afterward, a backfired plot by the Puppet King left Raven and Starfire stuck in each other's body, creating a new sense of empathy between the girls. Finally, when Robin was haunted by a drug-induced hallucination of his enemy Slade, Raven linked with his mind and saw glimpses of Robin's past, including his initiation by Batman and the death of his parents.
<p>&nbsp;</p>
Raven helped the Titans for years, working alongside the other four to protect Jump City from villainous menaces. She was consistently invaluable to their success. Eventually, however, Raven's past caught up with her: On her birthday, Slade (who had been presumed dead) reappeared, wielding new powers and marked with a symbol which Raven could not fail to recognize. Slade deliberately led the Titans to the place where Raven's true destiny was to be fulfilled to serve as a living portal for Trigon to conquer Earth. Seeing no other choice, Raven finally told her teammates the truth about her past &mdash; but instead of being rejected, the other Titans remained with her and took the greatest pains to prevent this from happening.
<p>&nbsp;</p>
Slade and an army of Trigon's fire demons attacked Titans Tower to fetch Raven. The Titans decided to fight him, but Raven, unwilling to see her dearest friends hurt on her behalf, knocked them out of the fight and secretly imbued them with some of her powers to protect them from the apocalypse to come. When the portal was opened with her powers, Raven was apparently consumed, but in fact, her human half remained alive in Trigon's domain, regressed to childhood and left powerless.
<p>&nbsp;</p>
Left in a world turned into a living horror, the Titans still refused to give up without a fight. With some help from Slade, (who had been betrayed by Trigon) Robin made his way to Trigon's underworld, found Raven and took her back to the surface, even though she was spiritually shattered by her role in the shaping of events. Finally, the Titans and Slade faced Trigon in a final onslaught. But even as they were struck down, Raven realized that all was not hopeless, and this realization sparked a new hope within her soul, allowing her to regain full maturity along with her powers. Under a righteous wrath, she used the sum of her powers to destroy Trigon, reverting Earth back to the way it was and finally ridding herself from the last vestiges of her dreaded heritage.</div>
</div>
<div class="tab"><input id="tab-3" name="tab-group-2" type="radio" /> <label for="tab-3">&nbsp;</label>
<div class="content">
<p style="text-align: center;">Friends</p>
<hr />
<p><a href="profile.php?userid=411980" target="_blank">Beast Boy</a>&nbsp;-&nbsp;<span>A close friend and love interest, though she seems annoyed by his flirting and is highly likely to admit that she reciprocates his feelings.</span></p>
<p style="text-align: left;">&nbsp;</p>
<p><span><span><a href="LINK HERE" target="_blank">Friend Name</a>&nbsp;-&nbsp;</span><span>Lorem ipsum dolor sit amet, natum accusam has ne. Inani summo mei cu, aliquip inermis principes ea qui.</span></span></p>
</div>
</div>
<div class="tab"><input id="tab-2" name="tab-group-2" type="radio" /> <label for="tab-2">&nbsp;</label>
<div class="content">
<p style="text-align: center;">OOC</p>
<hr />
<p>Please know the difference between IC/OOC. I default to OOC in PMS.</p>
<p>&nbsp;</p>
<p>I have a family so if I disappear, please understand that, and I'm not looking for a relationship.</p>
<p>&nbsp;</p>
<p>I have the right to decline RP for any reason</p>
<p>&nbsp;</p>
<p>Extremely picky about smut.</p>
</div>
</div>
<div class="tab"><input id="tab-1" checked="checked" name="tab-group-2" type="radio" /> <label for="tab-1">&nbsp;</label></div>
<div class="content">
<p style="text-align: left;">&nbsp;</p>
</div>
</div>
</div>
<div class="Credit">
<p style="text-align: center;"><a href="https://rphprofilecodes.tumblr.com/" target="_blank">&spades;</a></p>
</div>