Lil Red Basic

<style>
/*
PLEASE DO NOT REMOVE THIS CREDIT
DO NOT REMOVE THE CREDIT AT THE BOTTOM EITHER!
CREATOR: BLINKY// HAKUNO KISHINAMI
There is a Javascript at the base that prevents right click. Do not remove it. If you do not have Java you don't need to worry about it. But please do not remove it. You'll break the code.


*/


@import 'https://fonts.googleapis.com/css?family=Pacifico|Oswald:700';


body {
 background-color: #708090;
 background-repeat: repeat;
 background-size: 100% 100%;
 background-position: bottom right;
 width: 100%;
 height: 100%;
 margin: 0px;
 overflow: hidden;
}
 #credit {
position: fixed;
bottom: 20px;
leftt: 20px;
background-color: transparent;
}


#words{
pointer-events:none;
 position:absolute;
font-family:'Pacifico', cursive;
 font-size: 65px;
 bottom: 20%;
 left: 24%;
 height: 120px;
 background: #transparent;
 background: url(https://i.imgur.com/4VyuY2i.gif) -20px -20px repeat;
 -webkit-text-fill-color: transparent;
 -webkit-background-clip: text;
z-index: 100;
-ms-transform: rotate(12deg);
-webkit-transform: rotate(12deg);
transform: rotate(12deg);
}

#words4{
 font-family:'Pacifico', cursive;
 font-size: 60px;
 height: 60px;
 background: #transparent;
 background: url(https://i.imgur.com/4VyuY2i.gif) -30px -30px repeat;
 -webkit-text-fill-color: transparent;
 -webkit-background-clip: text;}


h1{
font-family:'Pacifico', cursive;
font-style:italic;
color: #ffffff;
font-size:20px;
line-height:27px;
padding: 0px 3px 0px 0px;
border-bottom: 1px solid #ffffff;
}

 .right{
position:absolute;
top:-22px;
left:140px;
font-family: 'Oswald', sans-serif;
text-transform: uppercase;
text-decoration: none;
font-size: 24px;
line-height: 24px;
letter-spacing: -1px;
color: #ffe650;
}

 .spooky{
position:absolute;
top:30px;
left:60px;
width:330px;
height: 250px;
overflow:hidden;
z-index:20;
}

 .far{
width:330px;
height: 300px;
overflow:auto;
}

 .tell{
color:#dfeff1;
font-size:14px;
text-align:justify;
line-height:14px;
font-family:cambria;
letter-spacing:0.3px;
margin: 5px;
}
a.gone:link, a.gone:active, a.gone:visited{
font-family: 'Oswald', sans-serif;
text-transform: uppercase;
text-decoration: none;
font-size: 24px;
line-height: 24px;
letter-spacing: -1px;
color: #f77481;
margin-right:12px;
z-index:10;
}

a.gone:hover{
text-shadow:-4px 0px 0px #ffe650;
}

b {
color: #cf9f48;
font-weight:bold;
letter-spacing: 1px;
}

i{
color:#ffffff;
font-style:italic;
}

u{
font-style:italic;
text-decoration:noneunderline;
}

a:active, a:link, a:visited{
color:#fff;
text-decoration:none;
}
a:hover{
cursor:all-scroll;
color:#4e3f64;
text-decoration:line-through;
}



::-webkit-scrollbar {width: 3px;}
::-webkit-scrollbar-thumb:vertical {
height: 10px;background-color: #D98878;}
::-webkit-scrollbar-thumb:horizontal {
height: 10px;background-color: #D98878;border: 0px ;width: 15px;}


#sparkle{
width:700px;
height: 400px;
background:#a70000;
border-radius: 50px 100px 100px 50px;
z-index: 4;
opacity: 0.70;
filter: alpha(opacity=70);
}


 .brightly{
margin: auto;
position: absolute;
top: 0; left: 0; bottom: 0; right: 0;


}


.lovely {
pointer-events:none;
position: absolute;
bottom: 0px;
right: 24%;
z-index: 6;

}

.lovely2 {
position: absolute;
bottom: -50px;
left: 10%;
z-index: 6;
opacity: .80;
filter: alpha(opacity=80);
}



.you{
position:absolute;
margin:auto;
top: -2%;
left: -2%;
width: 100px;
height: 100px;
-ms-transform: rotate(45deg);
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
z-index: 97;
}

a.dream:link, a.dream:active, a.dream:visited{
display: block;
float: left;
width: 35px;
height: 35px;
margin: 1px;
background-color: #ffb6c1;
-webkit-transition: all 0.6s ease-out;
-moz-transition: all 0.6s ease-out;
}

a.dream:hover{
background-color:#FFFDCD;
box-shadow: 0px 0px 5px #999;
}

.floating3{
 float: bottom-left;
 -webkit-animation-name: Floatingx;
 -webkit-animation-duration: 2s;
 -webkit-animation-iteration-count: infinite;
 -webkit-animation-timing-function: ease-in-out;
 -moz-animation-name: Floating;
 -moz-animation-duration: 0.5s;
 -moz-animation-iteration-count: infinite;
 -moz-animation-timing-function: ease-in-out;
 margin-right: 0px;
 margin-bottom: 100px;
 z-index:343;

}

@-webkit-keyframes Floatingx{
 from {-webkit-transform:translate(0, 0px);}
 65% {-webkit-transform:translate(0, 15px);}
 to {-webkit-transform: translate(0, -0px); }
}

table {
 margin-top:-9px;
 width: 100%;
 margin-left:-2px;
 background-color: transparent;
 border-collapse: collapse;}

td {
 font-size: 11px;
 letter-spacing: 1px;
 height: 100px;
 overflow: auto;}

#rel img {
 margin:8px;
 border:5px solid #fff; /* relationships icon border color */
 width:50px;
 height:50px;
 padding:4px;
 -webkit-transition:all 0.3s ease-out;
 -moz-transition:all 0.3s ease-out;
 transition:all 0.3s ease-out;}

#rel:hover img {
 border:5px solid #529ecc; /* relationships icon border hover color */
 -webkit-transition:all 0.3s ease-out;
 -moz-transition:all 0.3s ease-out;
 transition:all 0.3s ease-out;}

::-webkit-scrollbar {width: 5px;}
::-webkit-scrollbar-thumb:vertical {
height: 10px;background-color: #ffe763;}
::-webkit-scrollbar-thumb:horizontal {
height: 10px;background-color: #ffe763;border: 0px ;width: 12px;}
 </style>

<body>
<script src="jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
 //Disable full page
 $("body").on("contextmenu",function(e){
 return false;
 });

 //Disable part of page
 $("#id").on("contextmenu",function(e){
 return false;
 });
});
</script>
<script type="text/javascript">
$(document).ready(function () {
 //Disable cut copy paste
 $('body').bind('cut copy paste', function (e) {
 e.preventDefault();
 });

 //Disable mouse right click
 $("body").on("contextmenu",function(e){
 return false;
 });
});
</script>



<div id="container"></div>

 <div class="lovely">
<img src="https://pre00.deviantart.net/b7c3/th/pre/f/2018/252/f/c/abby_colored_no_background_by_blinkyiris-db2nzoh.png" width="350px" class="floating3"></div>



<div id="sparkle" class="brightly">

<div class="you">
<a href="#we" class="dream"></a>
<a href="#have" class="dream"></a>
<a href="#noticed" class="dream"></a>
<a href="#youtoo" class="dream"></a>
</div>
<div class="spooky">
<div id="we" class="far"><div class="tell">

<h1>Stats</h1>


<font style="float:left"><b>➽Stat</b></font>
<font style="float:right">Abigail Scarlet Hunt</font><br>
<font style="float:left"><b>➽Stat</b></font>
<font style="float:right">Abby, Lil Red</font><br>
<font style="float:left"><b>➽Age</b></font>
<font style="float:right">20</font><br>
<font style="float:left"><b>➽Gender</b></font>
<font style="float:right">Female</font><br>
<font style="float:left"><b>➽Hair</b></font>
<font style="float:right">Short bob, brown</font><br>
<font style="float:left"><b>➽Eyes</b></font>
<font style="float:right">Red</font><br>
<font style="float:left"><b>➽Height + Weight</b></font>
<font style="float:right">5'1"・114lbs</font><br>
<font style="float:left"><b>➽Occupation</b></font>
<font style="float:right">Book store Clerk//College student</font><br>
<font style="float:left"><b>➽Origin</b></font>
<font style="float:right">Red Riding Hood </font><br>
<font style="float:left"><b>➽Orientation</b></font>
<font style="float:right">Bisexual</font><br>
<font style="float:left"><b>➽Martial Status</b></font>
<font style="float:right">Single</font><br>
<h1>Personality</h1>



<p>She had always been fairly quick-witted and clever. But despite this when it comes to certain people, she is still a somewhat awkward young woman. She finds it hard to relate to others on a personal level most of the time. Abigail is also the type of person to act on instinct and intuition. it can even be the driving force for some of her actions. She's more of an emotionally driven person then logically driven. And this can end up getting her in trouble from time to time. </p>

<p>Her dedication and persistence can also add fuel to that fire as well. Not knowing when to call it quits. She's stupidly stubborn as well and can have a short fuse. And being an emotionally driven person, this just makes it even worse. </p>



<BR><br><br>

</div></div>
<div id="have" class="far"><div class="tell">
<h1>About</h1><br>
<p>Growing up Abigail had a fairly normal childhood. Her parents were both hard working middle class citizens a No means model, and no means anything that would stick out. Well maybe aside from her's and her father's interest in archery. Her father was a retired professional, who mostly just offered lessons and ran a range, and hunting shop along side her mother. She lived a pretty good life. Never really the target for bullying, excellent marks in science and math. Average in other's. Little bit below in things like history though. </p>

<p>But shortly after entering her first year of highschool her life life took a bit of a sharp traumatic turn. Coming home late one day form school, she would find her home, torn apart. The place was in shambles. There she'd found the body of her father. And a few moments later her mother, who was still alive but barely. One could say having your mother die in your arms and giving you a warning to avoid the 'Blanche' would be rather horrific for any child to expierence.... And they would be entirely right. </p>

<p>After that though, her life turned upside down. She moved in with her aunt and uncle, her father's sister and her husband. For some time she grieved and mourned... She was catatonic to most. Even during the burial. When the time finally came for the headstone reveal, she met someone.... Someone she never expected and probably never would want to meet if she looked back. The richest man in the city and the local Crime Lord.... Sylvain Blanche.</p>

<p>Her mother's warning clicked instantly in her head... it made sense... At the time she didn't think of the Blanche as the Blanche Family. But the Blanche family was also not only one of the wealthiest in the city but one of the most influential in the country. They had their fingers in so many things. Politics, the military, local law enforcement, even the film industry. Quite a bit was not left untouched. But why did they do that to her family? Did her family do something? Did they owe money? Didn't it make sense? Until it was ousted during the memorial... That this man? The man who headed one of the largest pharmaceutical corporations in the world was... her uncle. He was her mother's younger brother. And he wanted to take custody of her from her aunt and uncle... Why? Why was he so obsessed with taking her in? Her mother died... and it was his fault? What was the hell going on? </p>
<p>Abigail fell into a depression even further. Confused and scared, this neurotic obsessed man wanted to take her away... And she didn't know why. Given he said it was to get to know the child of his estranged niece. Cooing about how she looked so much like her mother. He wasn't right in the head, yet when it came to business he ... carried himself rather well.</p>

<p>Despite his 'off' and 'kind' gestures, towards the woman... she wanted to prove he had something to do with the murders. He was aknown crime lord, the empire had been around even before him.... but no one could ever pin the crimes on any one in the family. Often evidence went missing or... all ends were so tightly shut and neat it was impossible to trace back to him. </p>

<p>This made Abigail want to be noisy and want to get involved herself. Of course... Abigail wanted revenge... and has a hatred... This bright eyes young woman went rogue... Going as far as to break into several facilities her family owned. Trying to find some proof... Something. </p>

<p>She was one of the founding members of the Gryphons..... Using her skills there to help keep both sides of major criminal orginzations from having their way in the city of Grimm Well.</p>

<p>Despite her better judgement she finds herself on a some what okay terms with both of her cousins. Matches, and Simon. But Simon seems to be more on her side in regards to her stand against his father. </p>
<br><br>
</div></div>
<div id="noticed" class="far"><div class="tell">
<h1>Combat</h1>

Bow and Arrows<br>
<h2>Artillery</h2>
A metal rod that extends and retracts that also becomes her bow when strung.<br>
Ice Arrow heads.(Carried in a special quiver that is actually a cooler. )<br>
Arrows<br>
Gadgets and utility arrows. Often nets or explosives.<br>
<br>
 <br><br>


</div></div>




<div id="youtoo" class="far"><div class="tell">
<h1>Rules</h1>
▪OOC<Br>
▪OOC<Br>
▪OOC<Br>
▪OOC<Br>
▪OOC<Br>
▪THIS CODE WAS CREATED BY GREEN BEAN. DO NOT STEAL OR REMOVE CREDIT <Br>
<Br><br><Br>
</div></div></div>

<div id="words4" class="lovely2">
<a target="_blank" href="https://sta.sh/01uudl3murf0" target="_blank" title="Old costume">◐</a>
<a target="_blank" href="https://sta.sh/03tw84t4a4q" target="_blank" title="New costume">◉</a>
<a target="_blank" href="https://i.imgur.com/BwFgTUM.png" target="_blank" title=" .">◉</a>
<a target="_blank" href="https://i.imgur.com/53nxRXY.png" target="_blank" title="Cosplay">◉</a>
<a target="_blank" href="https://orig00.deviantart.net/3a61/f/2018/252/b/a/proportions_by_blinkyiris-db2nzo5.png" target="_blank" title="Propotions and model made in Artefical Academy 2">◉</a>
<a target="_blank" href="https://pre00.deviantart.net/391e/th/pre/f/2018/252/d/2/abby_colors_alt_by_blinkyiris-db2nzom.jpg" target="_blank" title="Drawing done by akaimeganekiki on Deviantart">◉</a>
<a target="_blank" href="https://i.imgur.com/6fZlteS.png" target="_blank" title="Nerf this!- Piece commissioned from explodokillz on Deviantart.">◑</a>

</div>
</div>
<div id="words">
◀Lil Red►
</div>
</div>


<div id="credit">
<a target="_blank" href="https://roleplay.chat/profile.php?user=Green+Bean" target="_blank" title="Code was created by Green Bean Do NOT touch, this Please! If you want a code just mail Green Bean directly. She will gladly hook you up. With some freebies or cheapo comissions."><img src="https://i.imgur.com/uP9E5Pz.png" height="90px"></a></div>
</body>