Gleeful P

<html>
<head>
<META NAME="ROBOTS" CONTENT="NOINDEX, NOFOLLOW">
<script src="//ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/dat-gui/0.6.5/dat.gui.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/prefixfree/1.0.7/prefixfree.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/4.11.0/d3.min.js"></script>
<script src="https://roleplay.chat/jquery.tooltipster.js?v=8"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/1.20.3/TweenMax.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/87/three.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/7.0.0/normalize.min.css">
<link href="https://roleplay.chat/tooltipster.css" rel="stylesheet" type="text/css">
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous">
<script defer>
window.onload = function() {

};
</script>
<style>
  @import url("https://fonts.googleapis.com/css?family=Voltaire|Abel");
::-webkit-scrollbar {
  width: 0.3vw;
  height: 0.3vw;
}
::-webkit-scrollbar-track {
  border-radius: 0px;
  background-color: transparent;
}
::-webkit-scrollbar-thumb {
  border-radius: 0px;
  background-color: transparent;
}
body{background: #000;
background-image: url('http://www.texasmusicpickers.com/wp-content/uploads/2015/11/Spotlight.jpg');
background-size: cover;}
.doors {
  box-sizing: border-box;
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
 }

.doors .key {
  position: absolute;
  top: 0%;
  width: 100%;
  color: yellow;
  z-index: 10;
  text-align: center;
  font-size: 48px;
  font-family: "Trebuchet MS";
  text-transform: uppercase;
  text-shadow: 5px 0 2px #000;
  transition: transform 2s ease-in-out;
}

.doors:hover .key {
  transform: scale(0);
}

.doors .left {
  display: inline-block;
  position: absolute;
  top: 0;
  left: 0;
  width: 50%;
  height: 100%;
  box-shadow: 3px 0 4px #111;
  background-image: url("https://i.imgur.com/c3Je2XE.png");
  background-size: cover;
  background-repeat: no-repeat;
  transition: width 2s ease-in-out;
}
.doors .right {
  display: inline-block;
  position: absolute;
  top: 0;
  right: 0;
  width: 50%;
  height: 100%;
  box-shadow: 3px 0 4px #111;
  background-image: url("https://i.imgur.com/c3Je2XE.png");
  background-size: cover;
  background-repeat: no-repeat;
  transform: scaleX(-1);
  transition: width 2s ease-in-out;
}

.doors:hover .left, .doors:hover .right {
  width: 5%;
}

.inner {
  width: 100%;
  height: 100%;
}

.image {
  border-radius: 50%;
  -webkit-transition: -webkit-transform .8s ease-in-out;
          transition:         transform .8s ease-in-out;
}
.image:hover {
  -webkit-transform: rotate(360deg);
          transform: rotate(360deg);
}


#content {
  position: fixed;
  width: 100%;
  height: 70%;
  background: transparent;
  top: 15%;
  left: 0%;
  transition-duration: 1s;
}


@keyframes whoosh {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes whoosh {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}


#pluto {
  position: fixed;
  height: 96%;
  width: 25%;
  background: transparent;
  left: 36.7%;
  transition-duration: 1s;
}

#content:hover #garnet {
  opacity: 1;
  left: 6%;
  transition-duration: 1.5s;
}

#content:hover #guarding {
  opacity: 1;
  right: 6%;
  transition-duration: 1.5s;
}

#garnet {
  position: absolute;
  overflow: auto;
  height: 92.5%;
  width: 25%;
  background: #161616;
  border-radius: 10px;
  border: 3px solid;
  border-color: #42d1f4;
  left: 35%;
  padding: 15px;
  opacity: 0;
  transition-duration: 1s;
  font-family: "Forum";
  font-size: 2.3vh;
  color: #eee;

}

#guarding {
  position: absolute;
  overflow: auto;
  height: 92.5%;
  width: 25%;
  background: #161616;
  border-radius: 10px;
  border: 3px solid;
  border-color: #42d1f4;
  right: 35%;
  padding: 15px;
  opacity: 0;
  transition-duration: 1s;
  font-family: "Forum";
  font-size: 2.3vh;
  color: #eee;
}

#gate,
#time {
  width: 100%;
  height: 100%;
  position: relative;
  overflow: hidden;

}

#leftbox,
#right {
  width: 100%;
  height: 100%;
  overflow: auto;

}
}

#leftbox:target,
#rightbox:target {
  animation: appear 1.5s 1;
  -webkit-animation: appear 1.5s 1;
}

@keyframes appear {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@-webkit-keyframes appear {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

h1 {
font-family: century;
font-weight: normal;
line-height: 9px;
text-transform: uppercase;
text-align: center;
}

a {
  font-family: 'Voltaire', sans-serif;
  color: #42d1f4;
  text-decoration: none;
}

a:hover {
  color: #eee;
}

.hue {
  float: right;
}
</style>
</head>
<body>
<div class="doors">
 <div class="key"><img src="https://i.imgur.com/MQfyM4n.png" height="500px" class="image"></div>
 <div class="left"></div>
 <div class="inner">
<div id="sheet"></div>
<div id="content">
 <div id="pluto">

 </div>

 <div id="garnet">
 <div id="gate">
 <div id="leftbox">
<center><h1>Stats</h1></center>
 <a>Name</a> <div class="hue">Madison Gleeful</div><br>
 <a>Alias</a> <div class="hue">Dipper</font></div><br>
 <a>Age</a> <div class="hue">18</font></div><br>
 <a>Height + Weight</a> <div class="hue">5'4" // 112lbs</div><br>
 <a>Birthday</a> <div class="hue">August 31 1999</div><br>
 <a>Species</a> <div class="hue">Human</div><br>
 <a>Gender</a> <div class="hue">Female</div><br>
 <a>Hair</a> <div class="hue">Long + Straight//Brown</div><br>
 <a>Eyes</a> <div class="hue">Deep Blue</div><br>
 <a>Occupation</a> <div class="hue">Performer</div><br>
 <a>Sexual Orientation</a> <div class="hue">Bisexual</div><br>
 <a>Status</a> <div class="hue">Singular</div><br>
 <a>Origin</a> <div class="hue"><font size="-2px">Reverse Falls//Gender Swap//Identical Twin AU</font></div><br>
<audio controls><source src="http://k003.kiwi6.com/hotlink/79wxioe871/Open_Up_Your_Eyes.mp3" type="audio/mpeg"></audio>

<h1>Relationships</h1><Br>
<a target="_blank" href="https://roleplay.chat/profile.php?user=Gleeful+star">'Lovely' Assistant/Sister</a>


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


 <div id="guarding">
 <div id="time">
 <div id="rightbox">
<Center><h1>Personality</h1></center>
<font size="-2px">
<p>Like her sister, Dipper has a lust for power and enjoys the pain of others. She is often seen to be either cold and unfeeling or simply disgusted by the affection or caring of others. Seemingly, the only person she shows any sign of actual care for is her sister and partner Mabel Gleeful, but even that has its limits.</p>

<p>Dipper is extremely intelligent and sly, being able to fool the town into believing him to be a kind and benevolent young woman. She has little trouble manipulating others into doing or getting what she wants. This makes him a great threat, with or without her amulet.</p>

<p>However, unlike her sister, Dipper is seen to be slightly more stoic, serious and more disgusted by those she deems pathetic or weak, instead of sinisterly amused like Mabel is shown to be.</p>

<p>Both Dipper and Mabel are obsessed with magic, specifically black magic, and will use their shows as means to continue their studies about the magic and anomalies in Gravity Falls. It can be assumed that Dipper as well as her sister are sociopathic and have some levels of emotional detachment as, with her sister, they will secretly kill and/or use the people who 'volunteer' during one of their shows. The one who volunteers will be given a challenge. While the audience is still watching, Dipper and Mabel will use their powers to make the volunteer look 'alive' by making them move even when they are already dead. This can also imply that they are quick-thinking and cunning, as they never get caught After the show, when the audience is gone, she and Mabel will secretly hide the volunteer's body to later use in magical practices and experiments.</p>
</font>

<center><h1>Rules/OOC</h1></center>
<font size="-4px">
✦ PM friendly.<br>
✧ IC=/= OOC. <br>
✦ Semi to Novella. I mirror.<br>
✧ Identical Twin!Fem!Reverse!Dipper, so Fem!Rev!Dipper and Mabel's identical twin. <br>
✦ Story > Sex <br>
✧ Once I get a better grasp on the personality and it's more cemented then I'll right my own personality section. <br>
✦ None of the art is mine. And I shall remove them upon request.<br>
✧ Code belongs to me! Do not snatch. You can ask. I don't bite.<Br>

</font>
 </div>

 </div>
 </div>
</div>
<img src="https://i.imgur.com/7IDtObZ.png" Width="200px" style="float:center; margin-left:575px; margin-top: 200px">


 <div class="right"></div>
</div>


</body>
</html>