O6. Jake's profile for Xayah

<style>

</style>
</head>
<body>
<style>
@import url('https://fonts.googleapis.com/css?family=Marcellus+SC|Kaushan+Script|Exo');
 body { background: url('http://i.imgur.com/yA0bES9.jpg'); background-size: 100% 100%; animation: pulse 5s infinite; }
 @keyframes pulse {
 0% { opacity: 0.8; }
 50% { opacity: 1; }
 100% { opacity: 0.8; }
 }
 html { overflow: hidden; }
 body:hover #sheet { opacity: 0; transition-duration: 3s; }
 body:hover .ln { width: 5px; transition-duration: 1s; transition-delay: 2s; opacity: 0.6; height: 100%; }
body:hover .bx { left: -120px; transition-duration: 1s; opacity: 1; transition-delay: 1.5s; }
body:hover .t { top: 40%; transition-duration: 1s; opacity: 0.9; transition-delay: 1.5s; }
body:hover .c { left: 28%; opacity: 0.9; transition-duration: 1s; transition-delay: 1.6s; }
 body:hover .bx2 { left:560px; top: 140%; transition-duration: 1s; opacity: 1; transition-delay: 1.5s; }
body:hover .t2 { top: 11.5%; transition-duration: 1s; opacity: 0.9; transition-delay: 1.5s; }
body:hover .c2 { right: 28%; top: 90px; opacity: 0.4; transition-duration: 1s; transition-delay: 1.6s; }
 #center {
 margin: 0px auto;
 width: 100px;
 height: 100%;
 }

 #sheet {
 position: absolute;
 bottom: 0px;
 left: 0px;
 height: 100%;
 width: 100%;
 background: black;
 opacity: 1;
 z-index: 5;
 transition-duration: 5s;
 }

 .ln {
 position: absolute;
 top: 0px;
 left: 50%;
 height: 0%;
 width: 3px;
 background: url('http://puu.sh/v9wxM.png');
 opacity: 0.1;
 transition-duration: 1s;
 }

 #cont {
 position: absolute;
 bottom: 0px;
 left: 0px;
 height: 100%;
 width: 100%;
 }

 .c {
 position: relative;
 top: 36%;
 left: 29%;
 font-family: 'Marcellus SC';
 font-size: 22px;
 color: rgba(0,0,0,0.6);
 text-shadow: 0px 0px 5px rgba(0,0,0,0.8);
 letter-spacing: 5px;
 opacity: 0.3;
 transition-duration: 1s;
 }

 .t {
 position: relative;
 top: 39%;
 left: 15%;
 font-family: 'Kaushan Script';
 font-size: 132px;
 color: rgba(144,35,127,0.5);
 text-shadow: 0px 0px 5px rgba(0,0,0,0.8);
 opacity: 0.2;
 transition-duration: 1s;
 }

 .bx {
 position: relative;
 bottom: -15px;
 left: -130px;
 height: 80px;
 width: 380px;
 border-radius: 3px;
 background: rgba(13,14,16,0.7);
 padding: 10px;
 font-family: 'Exo';
 color: rgba(255,255,255,0.4);
 font-size: 9px;
 letter-spacing: 2px;
 text-transform: uppercase;
 opacity: 0;
 transition-duration: 1s;
 }


 .c2 {
 position: relative;
 top: 7.8%;
 right: 29%;
 font-family: 'Marcellus SC';
 font-size: 22px;
 color: rgba(203,179,179,1);
 text-shadow: 0px 0px 5px rgba(0,0,0,0.2);
 letter-spacing: 5px;
 opacity: 0.4;
 display:block;
 -moz-transform: scale(-1, 1);
-webkit-transform: scale(-1, 1);
-o-transform: scale(-1, 1);
-ms-transform: scale(-1, 1);
transform: scale(-1, 1);
 transition-duration: 1s;
 }

 .t2 {
 position: relative;
 top: 10.9%;
 right: 15%;
 font-family: 'Kaushan Script';
 font-size: 132px;
 color: rgba(132,42,66,0.5);
 text-shadow: 0px 0px 5px rgba(0,0,0,0.8);
 opacity: 0.2;
 display:block;
 -moz-transform: scale(-1, 1);
-webkit-transform: scale(-1, 1);
-o-transform: scale(-1, 1);
-ms-transform: scale(-1, 1);
transform: scale(-1, 1);
transition-duration: 1s;
 }


 .mirror {
 display: block;
 transform: scale(-1, 1);
 -moz-transform: scale(-1, 1);
-webkit-transform: scale(-1, 1);
-o-transform: scale(-1, 1);
-ms-transform: scale(-1, 1);
}
 a {
 color: inherit;
 display: block;
 text-decoration: none;
 }

 .ps {
position: absolute;
bottom: 0px;
right: 0px;
height: 100%;
width: 50%;
z-index: 20;
}


 </style>

 <a target="_blank" href="https://roleplay.chat/profile.php?user=Battledancer" target="_blank"><div class="ps"></div></a>


 <div id="center">
 <div class="ln"></div>
 </div>

 <div id="sheet"></div>


 <div id="cont">

 <div class="t">
 Xayah-
 </div>

 <div class="c">
 the rebel

 <div class="bx"><font style="color: rgba(132,42,66,0.8);">></font> . . _ you don't have to tell me twice. each enemy is just another
 target to sew together into the tapestry of our making. it's all for the greater--,
 a will to live and survive amongst our flourishing yet desolate life. you make fights worth every single
 wasted feather, every last beat of wing and charm of foe. no other shall claim my heart as thee.. . ' -- Daily log::
 <font style="color: #221133;">#</font>
 <font style="color: #552244;">0</font>
 <font style="color: #bb4444;">Z</font>
 <font style="color: #eeaa88;">8</font>
 <font style="color: #ee8855;">6</font>
 <font style="color: #996666;">H</font>
 <font style="color: #553344;">4</font>
 <font style="color: #221122;">'</font>

 </div>
 </div>

 <div class="t2">
 Rakan-
 </div>

 <div class="c2">
 the charmer
</body>
</html>