older noct

<style>@import url('https://fonts.googleapis.com/css?family=Spectral+SC|Julius+Sans+One');

body{
background-color:#000;
}

::-webkit-scrollbar {
width: 3px;
height: 0px;
background:transparent;
}
::-webkit-scrollbar-thumb {
background-color:rgba(255,255,255,.18);
-webkit-border-radius: 5px;
border-radius: 5px;
}
::selection {
color: #777;
background: #333;
}

.flat{
height:300px;
width:500px;
position:fixed;
left:689px;
bottom:164px;
overflow:hidden;
opacity:1;
background-image:url(https://static.tumblr.com/9951ca2e7e884a48ca5b5269f5514cd6/lycuamb/jw3onle7s/tumblr_static_filename_640_v2.gif);
background-size: 105%;
background-repeat: no-repeat;
filter:hue-rotate(190deg);
background-position:center;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
}

body:hover .flat{
border: 1px solid #111;
outline: 1px solid #1a1a1a;
outline-offset: 3px;
}

.noct{
opacity:0;
height:300px;
width:500px;
position:fixed;
left:691px;
bottom:165px;
overflow:hidden;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
}

body:hover .noct{
opacity:.3;
filter:brightness(100%);
background-image:url(https://m.popkey.co/e952f9/gakkY.gif);
background-repeat:no-repeat;
background-size:100%;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;

}

.center{
width: 480px;
height: 280px;
background-color:rgba(255,255,255,.05);
position: fixed;
left: 690px;
bottom: 165px;
padding:10px;
color:#fff;
font-family: 'Spectral SC', serif;
text-align:center;
font-size:10px;
text-shadow:0px 0px 2px #000;
opacity:0;
z-index:99;
overflow:auto;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
transition: all 1.7s ease-in-out;
}

body:hover .center{
opacity:1;
transition-delay:.8s;
}

.triage{
position:fixed;
margin:auto;
left:910px;
bottom:122px;
width:48px;
height:48px;
opacity:1;
transform:rotate(45deg);
border:10px solid #326fd1;
z-index:999;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
}

body:hover .triage{
transform:rotate(135deg);
filter: brightness(30%);
opacity:1;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
}

.square{
position:fixed;
margin:auto;
left:925px;
bottom:137px;
width:38px;
height:38px;
opacity:1;
transform:rotate(45deg);
background-color:#222;
z-index:999;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
}

body:hover .square{
transform:rotate(135deg);
filter: brightness(100%);
opacity:1;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
transition: all .8s ease-in-out;
}


.text1{
color:#fefefe; font-family: 'Julius Sans One', sans-serif; font-size:47px; position:fixed; left:682px; bottom:125px; z-index:1001;
text-shadow:-1px 0 #000, 0 1px #000, 1px 0 #000, 0 -1px #000;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
transition: all 1.8s ease-in-out;
}

body:hover .text1{
color:#ccc;
text-shadow:-1px 0 #4d8ff9, 0 1px #4d8ff9, 1px 0 #4d8ff9, 0 -1px #4d8ff9;
bottom:465px;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
transition: all 1.4s ease-in-out;
}
</style><div style="position:fixed; bottom:0px; left:290px;"><img src="http://i.picpar.com/QPGd.png"></div>

<div class="text1">Noctis Lucis Caelum</div>

<div class="center">
"Heir apparent to the Lucian throne, Noctis's trials begin when he sets forth from the crown city in order to wed Lunafreya Nox Fleuret. In combat, he wields spectral weapons which he forges from thin air, a power possessed by those of his royal line."<br><br><br>[Background]<br><br>

The Path of Noctis Caelum has taken many twists and turns, some that would break a normal man not of royal heritage. Not even as his journey began, his Kingdom was lost, how quickly the situation escalated from Peace Talks to war. He was left without home, but he was not left to rot. He now had new purpose, to seek power, and become the True King of Light.<br><br>

Trials were set before him, the bastard Arydn created setback after setback. He watched Lunafreya die before his eyes, which shattered his heart. His retainer was blinded and weakened, which shattered is courage. He pushed his best friend from a moving train, which shattered his hope. For a time, hidden under the vestige of silent contemplation and stern looks, his mind was in shambles. Small victories seemed only dents. His spirit was crushed.<br><br>

A decision was made by this Prince, his journey did not end with the Crystal. Fate was not to drag him away. With pieces of his mind he could hold to, he broke away from the Chocobros, to seek aid, to become stronger for them, who gave their lives to make sure he made it to this point. His trials would never end until the fateful end, yet, for the sake of himself, and all of Lucii, he was going to become a King.<br><br>

[Previous Events]<br><br>

Noctis has enlisted the help of Commodore Aranea Highwind, a long-standing ally of the four, to accompany him on his quest for knowledge and stength. Not only is she to be serving as his temporary retainer during his travels, she also teaches him in an art without the use of his Armiger, the path of the Dragoon. His blood might carry powerful magic, but in light of Niflheim's ability to nullify the Magic of the Glaives, he needs to learn a better means to protect himself.<br><br>

During his travels, he has discovered that, Lunafreya has not perished. Rather, she seemed to have survived, as broken and tattered as himself. Both in shock, both in a weak place, neither seem to realize that the other exist. And yet, Noctis is relieved, yet also weary to signs of a trap, a surely Luna herself is as well. It will be a long road for the two, but will they recovering? Will it be the same as before?<br><br>

[Current Events]<br><br>

To be Updated<br><br>

[OOC]<br>

PM Friendly. One-liner to multi-para. Snowballs mostly.<br><br>



</div>
<div class="flat"></div>
<div class="noct"></div>

<div class="triage"></div><div class="square"></div>
<div class="center" style="position:fixed; bottom:15px; height:80px; border: 1px solid #111; outline: 1px solid #1a1a1a;outline-offset: 3px; padding-top:40px">[ friends / party list ]<br><br>

[Current Party]<br><br>
<span title="Commadore Highwind. A Powerful Ally, a strong teacher. She might not know of Royalty, but she knows of being a leader."><a target="_blank" href="https://roleplay.chat/profile.php?user=Commodore%20Highwind"><img src="https://78.media.tumblr.com/17fb8dd2d96d3ed8b765f7f16ce5baa8/tumblr_ortz0kWZmY1vrhk2qo3_540.gif" style="float: center; height: %; width: 30%;"/></span></a>
<span title="Lunafreya Nox Fleuret. Love lost, in her passing, he had learned to place walls of his feelings. Yet now she walks among the world again. They are both lost, but with hands intertwined. Attempting to repair the past."<a target="_blank" href="https://roleplay.chat/profile.php?user=The%20Oracle"><img src="https://i.pinimg.com/originals/7e/d3/fc/7ed3fc5034f51c5ee394a5352c55d2b3.gif" style="float: center; height: %; width: 23%;"/></a> <br><br>
[Allies/Enemies]</span><br>

<span title="Gladiolus Amicitia. His Shield. He will return stronger, to show the Shield he is worth protecting. Wishes the best for their wedding."><a target="_blank" href="https://roleplay.chat/profile.php?user=Gladdy+Daddy"><img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcR4JIZQ3ApD6Wg7nVlxvaOmWjIhf2tZJLsoc4s2QbeDpU17nb_e" style="float: center; height: %; width: 20%;"/></span></a>
<span title="Ignis Scientia. His Retainer. Was once blind, but light restored his vision. Still, he will return to see a King. Well wishes for the two of them."><a target="_blank" href="https://roleplay.chat/profile.php?user=Ignis+Scientia"><img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSQlOuCscO5pIlb6lxDzciU3hcZqHdjknv_YK_LVxcRhPFyI0hQ" style="float: center; height: %; width: 20%;"/></span></a>
<span title="Prompto Argentum. His loyal glaive, unquestioning in his devotion, and his best friend. Will return to him, as a King worth following."><a target="_blank" href="https://roleplay.chat/profile.php?user=Prompto%20Argentum"><img src="https://i.pinimg.com/736x/ef/42/25/ef4225c82fa832d1909ea7be5ba6c3c5--prompto-argentum-final-fantasy-.jpg" style="float: center; height: %; width: 22%;"/></span></a>

</div>