#profile-container {
  background: none;
cursor: url(http://www.cursor.cc/cursor/870/46/cursor.png), progress !important;
}



body{
  background: #333 url("https://i.imgur.com/2W4L4ws.png") repeat;
  overflow:hidden;
@import 'https://fonts.googleapis.com/css?family=Open+Sans:300';

}

::-webkit-scrollbar {
    display: none;
}

.picture{
	position: absolute;
	top: -5px;
    left: 90px;
    width: 460px;
	height: 590px;
	background: url(https://i.imgur.com/nEXRrNx.jpg);
    background-size: 700px;
	border: 1px solid #000;
    background-repeat: none;
    -webkit-user-select: none;
    background-repeat:no-repeat;
    box-shadow: -9px 0 5px -5px #fff inset;;
    background-position:50% 75%;
    z-index: 0;
    border-top-left-radius: 5px;
border-bottom-left-radius: 5px;
}



hr {
  border: 1px solid #ccc;
  width: 300px;
  -webkit-user-select: none;
  box-shadow: 0 0 5px #ccc, 0 0 10px #000;
}

::-webkit-scrollbar {
  width: 1px;
  height: 1px;
}

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

::-webkit-scrollbar-track {

}

  table.center {
    margin-left:auto;
    margin-right:auto;
  }

   table,
   th,
   td {
 font-family: 'Lora';
  font-style: normal;
  font-weight: 400;
     font-size: 14px;
     overflow: auto;
     color: #ccc;
   }

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

   #stats-container{position: absolute; top: 5px; width: 200px;}

.stat{
	position: relative;
    border-right: 1px solid #000;
    border-bottom: 1px solid #000;
    border-top: 1px solid #000;
	margin: 0px 5px 8px 9px;
    left: 542px;
    -webkit-user-select: none;
    border-top-right-radius: 5px;
border-bottom-right-radius: 5px;
    top: -10px;
    overflow: auto;

    z-index: 0;
	width: 85px; height: 20px;
    font-size: 13px; letter-spacing: 0px;
    text-align: center;}

.name{
	position: absolute;
    width: 85px; padding: 1px 0px 1px 0px;
    background: #fff;
    color: #000;
    pointer-events:none;
  font-family: 'Carrois Gothic';
  font-style: normal;
  -webkit-user-select: none;
  font-weight: 400;
  z-index: 5;
  opacity:1;
  line-height: 155%;
    transition: 0.6s ease-in-out;}

.answer{position: absolute;
	width: 85px; padding: 1px 0px 1px 0px;
    background: #fff;
 font-family: 'Carrois Gothic';
  font-style: normal;
  font-weight: 400;
  line-height: 155%;
  font-weight: 400;
  z-index: 0;
    color: #000;}

.stat:hover > .name{margin-left: 0px; opacity: 0;}
.stat:hover > .answer{margin-left: 0px; opacity:1;}

.tabs-container{
	position: absolute;
    left: 34px; right: 4px; top: 47px; bottom: 5px;
    background: #c3c1ce;
    border: 0px solid #212025;
    -webkit-user-select: none;
}

.tab-1, .tab-2{display: none; overflow: auto;
	position: absolute;
    top:0; bottom:0; left: 0; right: 0;
    padding: 10px;
    font-family: calibri; font-size: 11px; letter-spacing: 1px; color: #212025;
    text-align: left;}

.tab-1::first-letter{
	float:left; padding: 10px 4px 7px 8px;
    margin-right: 3px;
    background: #212025;
    border: 4px double #212025; background-clip: padding-box;
    font-family: basic; font-size: 40px; color: #c3c1ce;}

 .Info {
  position: absolute;
  height: 553px;
  box-shadow: 0 0 8px 8px #fff inset;
  width: 426px;
  left: 91px;
  top: -4px;
  background-color: #fff;
  padding-bottom: 21px;
  padding-top: 16px;
  -webkit-user-select: none;
  padding-right: 16px;
  padding-left: 16px;
  z-index: 1;
  margin-bottom: 5px;
  font-family: 'Prociono';
  font-style: normal;
  font-weight: 400;
  font-size: 13px;
  border-top-left-radius: 5px;
border-bottom-left-radius: 5px;
  color: #000;
  opacity: 0;
  -webkit-transition: all 1s ease;
  overflow: Auto;
}

.Info:hover {
  opacity: 0.85;
  -webkit-transition: all 1s ease;
}

hr {
  border: 1px solid #ccc;
  width: 300px;
  box-shadow: 0 0 5px #ccc, 0 0 10px #000;
}

::-webkit-scrollbar {
  width: 1px;
  height: 1px;
}

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

::-webkit-scrollbar-track {

}

  table.center {
    margin-left:auto;
    margin-right:auto;
  }

   table,
   th,
   td {
   font-family: 'Saira';
  font-style: normal;
  font-weight: 400;
     font-size: 15px;
     overflow: auto;
     -webkit-user-select: none;
     color: #ccc;
   }

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

        a:link,
   a:visited,
   a:active {
     text-decoration: none;
     color: #A52A2A;
     z-index: 10;
     -webkit-transition: all .5s ease;

   }

/* latin */
@font-face {
  font-family: 'Carrois Gothic';
  font-style: normal;
  font-weight: 400;
  src: local('Carrois Gothic Regular'), local('CarroisGothic-Regular'), url(https://fonts.gstatic.com/s/carroisgothic/v7/GCgb7bssGpwp7V5ynxmWy-RYAdd4IhfhHjBEc43Trp8.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215;
}

/* latin */
@font-face {
  font-family: 'Prociono';
  font-style: normal;
  font-weight: 400;
  src: local('Prociono'), local('Prociono-Regular'), url(https://fonts.gstatic.com/s/prociono/v7/NzahrnHu7VVvHGo3vxCa9vesZW2xOQ-xsNqO47m55DA.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215;
}

/* latin */
@font-face {
  font-family: 'Cinzel Decorative';
  font-style: normal;
  font-weight: 400;
  src: local('Cinzel Decorative Regular'), local('CinzelDecorative-Regular'), url(https://fonts.gstatic.com/s/cinzeldecorative/v6/daaCSScvJGqLYhG8nNt8KPPswUAPni7TTMw.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

<div class="picture">&nbsp;</div>
<div class="content">
<p style="text-align: center;">&nbsp;</p>
<p style="text-align: center;">&nbsp;&nbsp;</p>
<p style="text-align: center;">&nbsp;</p>
<p style="text-align: center;">&nbsp;</p>
<p style="text-align: center;">&nbsp;</p>
<p style="text-align: center;">&nbsp;</p>
<p style="text-align: center;">&nbsp;</p>
</div>
<div id="stats-container">
<div class="stat">
<div style="text-align: center;" class="name">Name</div>
<div class="answer">Lacus Albrin</div>
</div>
<div class="stat">
<div class="name">Race</div>
<div class="answer">Human</div>
</div>
<div class="stat">
<div class="name">Gender</div>
<div class="answer">Male</div>
</div>
<div class="stat">
<div class="name">Age</div>
<div class="answer">Twenty Five</div>
</div>
<div class="stat">
<div class="name">Occupation</div>
<div class="answer">Soldier</div>
</div>
<div class="stat">
<div class="name">Alignment</div>
<div class="answer">Lawful Good</div>
</div>
<div class="stat">
<div class="name">Affiliation</div>
<div class="answer">Military</div>
</div>
<div class="stat">
<div class="name">Dragon Ally</div>
<div class="answer">Othos</div>
</div>
<div class="stat">
<div class="name">Weaponry</div>
<div class="answer">Sword / Shield</div>
</div>
<div class="stat">
<div class="name">Special Item</div>
<div class="answer">---</div>
</div>
<div class="stat">
<div class="name">Height</div>
<div class="answer">6'2"</div>
</div>
<div class="stat">
<div class="name">Weight</div>
<div class="answer">176lbs</div>
</div>
<div class="stat">
<div class="name">Build</div>
<div class="answer">Athletic</div>
</div>
<div class="stat">
<div class="name">Marital Status</div>
<div class="answer">Single</div>
</div>
<div class="stat">
<div class="name">Orientation</div>
<div class="answer">Heterosexual</div>
</div>
<div class="stat">
<div class="name">Likes</div>
<div class="answer">Apples</div>
</div>
<div class="stat">
<div class="name">Dislikes</div>
<div class="answer">Rain</div>
</div>
<div class="stat">
<div class="name">Theme I</div>
<div class="answer"><a href="https://www.youtube.com/watch?v=t408OV_kX24" target="_blank">Silverbound</a></div>
</div>
<div class="stat">
<div class="name">Theme II</div>
<div class="answer"><a href="https://www.youtube.com/watch?v=D332jqKSNKY" target="_blank">Orion</a></div>
</div>
<div class="stat">
<div class="name">Gallery</div>
<div class="answer">TBA</div>
</div>
</div>
<div class="Info">
<p style="text-align: center;"><span style="font-size: 22pt; font-family: 'Cinzel Decorative';">The Hopeful Recruit</span></p>
<p style="text-align: center;">&nbsp;</p>
<p style="text-align: justify;">Lacus Albrin. A young and kindhearted young man with an iron will hailing from the city of Alstrem. When his desire to help others overcame his desire to follow in the footsteps of his father, and his father before him, by becoming a merchant, the young Lacus ran away from home and lied about his age to become a soldier.</p>
<p style="text-align: justify;">&nbsp;</p>
<p style="text-align: justify;">Naturally skilled with a sword and shield, a fast learner, and excellent at working alongside others, Lacus did extremely well in training but was often reprimanded for his habit of speaking out of turn about the leading figures of his city and the infamous incompetence of the higher ups in the military.&nbsp;</p>
<p style="text-align: justify;">&nbsp;</p>
<p style="text-align: justify;">Once his training was complete, Lacus was assigned to a platoon under Captain Lars, a brave and honest man that not only shared many of Lacus' views, but over the years would help to shape the way the young soldier thought of the world.</p>
<p style="text-align: justify;">&nbsp;</p>
<p style="text-align: justify;">One day, while on patrol, Lacus was separated from his squad and wandered aimlessly for some time before discovering a large cave, seemingly empty at first, but when it began to rain heavily Lacus decided to stay the night in the cave. Exploring deeper within to make sure it definitely was not already inhabitated, he discovered a massive den of some sort, one that, even to a person that had never encountered a dragon, was clearly a dragon's home.&nbsp;</p>
<p style="text-align: justify;">&nbsp;</p>
<p style="text-align: justify;">The den was abandoned however, except for a lone, starving, tiny red dragon that could barely even move, let alone fly and breath fire. Despite not having much in the way of supplies and not knowing if he would find his squad any time soon, Lacus fed the baby dragon his remaining food and drink, and watched over it for the whole night to make sure it would not be harmed by any predator seeking shelter from the rain.</p>
<p style="text-align: justify;">&nbsp;</p>
<p style="text-align: justify;">Once the rain had cleared up, Lacus, doubtful that the baby dragon's parents would return, decided to take it on himself, not as a pet, but as a companion. After an unfortunate incident where Lacus made the mistake of holding the dragon directly above his head, he discovered that it was a male and decided to name him after a legendary, heroic figure he remembered from the stories of his childhood - Othos.</p>
<p style="text-align: justify;">&nbsp;</p>
<p style="text-align: center;"><span style="font-size: 22pt; font-family: 'Cinzel Decorative';">A Soldier Astray</span></p>
<p style="text-align: center;">&nbsp;</p>
<p style="text-align: center;">After Lacus was the only one to survive an ambush by a horde of bandits, he fled into the Cormanthyr woods. Although he was near death, Lacus was rescued and healed by the elven princess <span style="color: #ff99cc;"><a href="http://profiles.rphaven.com/Cyrinn" target="_blank"><span style="color: #f78891;">Cyrinna</span></a></span>, who then offered to help him bring an end to the bandits' hold over the lands.</p>
<p style="text-align: center;">&nbsp;</p>
<p style="text-align: center;">After a brief misunderstanding involving a dagger, Lacus&nbsp; met the Frogman Shaman <span style="color: #808000;"><a href="http://profiles.rphaven.com/Kroak" target="_blank"><span style="color: #808000;">Kroak</span></a></span>. Glad to have met someone as curious as himself, Lacus became fast friends with Kroak and was blessed with Bog Strength that made him slightly stronger and much healthier.</p>
<p style="text-align: center;">&nbsp;</p>
<p style="text-align: center;">Immediately after receiving this blessing, a dungeoneer namd&nbsp;<span style="color: #339966;"><a href="http://profiles.rphaven.com/Talpa" target="_blank"><span style="color: #339966;">Talpa</span></a></span> attempted to settle an issue with Kroak in a very civil manner, which led to a lot of frog screaming, blades being pointed at people, and yelling. Thankfully, nobody died, and Lacus has vowed to keep a close eye on her.</p>
</div>