Lia Briggs - Code

<style>
@import url('https://fonts.googleapis.com/css?family=Kaushan+Script');


::-webkit-scrollbar {
 width: 8px;
 border-radius:0px;
 background: #fff; }

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

body {
 margin:0px;
 background:#27022b;
 background-image:url('https://www.transparenttextures.com/patterns/black-felt.png');
 background-attachment:fixed;
background-position: bottom left;
background-size: -100%;
 background-repeat:;
 font-family:'Kaushan Script', cursive;
 line-height: 140%;
 font-size: 12px;
 color: #aaa;
}

p{
 margin:0 0 10px 0;
 padding:0;}

pre {
 white-space: pre-wrap;
 white-space: -moz-pre-wrap;
 white-space: -pre-wrap;
 white-space: -o-pre-wrap;
 word-wrap: break-word;}

a{
 color:#009bda ;
 text-decoration:none;
 -moz-transition: all .2s ease-in;
 -o-transition: all .2s ease-in;
 -webkit-transition: all .2s ease-in;
 transition: all .2s ease-in;
 text-shadow: 3px 1px 1px rgba(150, 150, 150, 0.25);}

a:hover{
 text-decoration:none;
 text-shadow: 5px 2px 1px rgba(150, 150, 150, 0.5);}

h2 {
height: 10px;
text-align: center;
font-family: 'Kaushan Script', cursive;
color: #009bda;
font-size: 30px;
line-height: 6px;
letter-spacing: 0px;
text-transform: lowercase;
margin-top: 5px;
margin-bottom: 15px;
border-top: 3px dotted #731573;
border-bottom: 3px dotted #731573;
text-shadow: 5px 0px 0px #27022b;}

li{
 margin-left:-15px;}

#wrapper{
 width:600px;
 margin:50px auto;}

#sidebar{

 left:50%;
 top:50%;
 border-radius:8px;
 margin-top:-175px;
 width:200px;
 position:fixed;}


#sidebar2{

 left:50%;
 top:50%;
 border-radius:8px;
 margin-top:60px;
 margin-left:355px;
 width:200px;
 position:fixed;}


#sidebar img{
 background:#27022b;
 border:6px solid #731573;
 outline:2px solid #fff;
 outline-offset:-20px;
 padding:8px;
 width:180px;
 height:180px;
 border-radius:8px;
 overflow:hidden;
 -webkit-box-shadow: 10px 10px 5px 0px rgba(150,122,119,0.15);
-moz-box-shadow: 10px 10px 5px 0px rgba(150,122,119,0.15);
box-shadow: 10px 10px 5px 0px rgba(150,122,119,0.15);}

.gif1{ position: absolute; border: px solid; left: 140px; right: 0px; top: 10px; bottom: 353px; background: url(https://66.media.tumblr.com/cf9d9f65c616fce999f4a242df515d52/tumblr_nl0k3qTC4A1qkz0a3o9_r1_250.gif); z-index:7;
 background:#27022b;
 border:6px solid #731573;
 outline:2px solid #fff;
 outline-offset:-20px;
 padding:8px;
 width:180px;
 height:180px;
 border-radius:8px;
 overflow:hidden;
 -webkit-box-shadow: 10px 10px 5px 0px rgba(150,122,119,0.15);
-moz-box-shadow: 10px 10px 5px 0px rgba(150,122,119,0.15);
box-shadow: 10px 10px 5px 0px rgba(150,122,119,0.15);}


#desc{
 z-index:9999;
 height:172px;
 width:300px;
 overflow:hidden;
 font-size:9px;
 margin-top:-207px;
 text-align:left;
 margin-left:225px;
 padding:12px;
 outline:2px solid #ccc;
 outline-offset:-8px;
 border:6px double #731573;
 border-radius:6px;
 background-color:#27022b;
 text-transform:uppercase;
 color:#999999;
 -webkit-transition:all 0.2s ease-in-out;
 -moz-transition:all 0.2s ease-in-out;
 transition:all 0.2s ease-in-out;
 -webkit-box-shadow: 10px 10px 5px 0px rgba(150,122,119,0.15);
 -moz-box-shadow: 10px 10px 5px 0px rgba(150,122,119,0.15);
 box-shadow: 10px 10px 5px 0px rgba(150,122,119,0.15);}

#desc2{
 z-index:9999;
 height:172px;
 width:300px;
 overflow:hidden;
 font-size:9px;
 margin-top: 25px;
 text-align:left;
 margin-left:0%;
 padding:12px;
 outline:2px solid #ccc;
 outline-offset:-8px;
 border:6px double #731573;
 border-radius:6px;
 background-color:#27022b;
 text-transform:uppercase;
 color:#999999;
 -webkit-transition:all 0.2s ease-in-out;
 -moz-transition:all 0.2s ease-in-out;
 transition:all 0.2s ease-in-out;
 -webkit-box-shadow: 10px 10px 5px 0px rgba(150,122,119,0.15);
 -moz-box-shadow: 10px 10px 5px 0px rgba(150,122,119,0.15);
 box-shadow: 10px 10px 5px 0px rgba(150,122,119,0.15);}

#left {
 width:3px;
 height:100%;
 background-color:#731573 ;
 z-index:999;
 left:40%;
 top:0;
 position:fixed;}

#leftsm {
 width:2px;
 height:100%;
 background-color:#009bda ;
 z-index:999;
 left:41.25%;
 top:0;
 position:fixed;}


#tri{
 position:fixed;
 right:0;
top:0;
 width: 0;
 height: 0;
 border-style: solid;
 border-width: 0 500px 250px 0;
 border-color: transparent #731573 transparent transparent;}

.title {
position: absolute;
font-family: 'Kaushan Script', cursive;
color: #009bda;
font-size: 60px;
letter-spacing: 3px;
text-transform: uppercase;
font-weight: bold;
bottom: 375%;
left: 110%;
margin-left: -580px;
margin-bottom: -310px;
text-shadow: -5px 2px 0px #731573;}



</style>

<body>

<div id="wrapper">

<div id="sidebar">

 <div id="sidebar img">
 <img src="https://i.imgur.com/HtqUvnS.gif">
 </div>


<div id="desc">
<h2>beauty and brains</h2>
<font style=float:left><span>Name:</span></font> <font style=float:right>Emily Briggs</font><br>
<font style=float:left><span>Aliases:</span></font> <font style=float:right>Lia, Legs, Red</font><br>
<font style=float:left><span>Age:</span></font> <font style=float:right>Appears Early-Twenties</font><br>
<font style=float:left><span>Occupation:</span></font> <font style=float:right>Model, Vigilante</font><br>
<font style=float:left><span>Affiliation:</span></font> <font style=float:right>---</font><br>
<font style=float:left><span>Status:</span></font> <font style=float:right><a target="_blank" href="https://www.youtube.com/watch?v=PLolag3YSYU">On the hunt</a></font><br>
<font style=float:left><span>Sexuality:</span></font> <font style=float:right>Bisexual</font><br>
<font style=float:left><span>Species:</span></font> <font style=float:right>Vampire</font><br></div>

<div id="desc2">
<h2>out of charm</h2>
🦇 Code done by <b><a target="_blank" href="https://4.roleplay.chat/profile.php?user=Batgirl">Batgirl</a></b>. Please don't steal!<br>
🦇 DC Comics preferred. Others accepted. Mildly divergent.<br>
🦇 Snowball, one-liners, third-person, etc.<br>
🦇 Flirty but #loyalto<b><a target="_blank" href="https://www.youtube.com/watch?v=P_SlAzsXa7E">THECAUSE</a></b>! 💋<br>
🦇 Discord and other OOC details earned.<br>

</div>

<div id="sidebar2">

 <div id="sidebar2 img">
 <img src="https://i.imgur.com/oyJdM2L.gif">
 </div>

<div class="title">Looker</div>

</div>

</div>
</div>

<div id="tri"></div>


<div id="left"></div>
<div id="leftsm"></div>




<div id="content">




</div>









</div>
</body>