<style type="text/css">

/* Profile was created by Alcyone for Skiitariik, so please refrain from stealing it. If you are interested in commissioning a profile, go ahead and leave her some mail. */

@font-face {
 font-family: 'Skiit';
 src: url('https://dl.dropboxusercontent.com/s/bdt6k3q3ctrry3r/Cyberverse%20Condensed%20Bold%20Italic.ttf');}


::-webkit-scrollbar {progress; width: 0px;}
::-webkit-scrollbar-thumb:vertical {
 background-color: #669bad;
 border: 0px solid transparent;
 -webkit-border-radius: 0px;
 box-shadow: 0 0 3px transparent, inset 0 0 6px transparent;
 -moz-transition:all 0.3s ease-in-out;
 -webkit-transition:all 0.3s ease-in-out;}

::-webkit-scrollbar-thumb:vertical:hover,
::-webkit-scrollbar-button:start:decrement:hover,
::-webkit-scrollbar-button:end:increment:hover
{border-color:transparent;box-shadow: 0 0 12px transparent, inset 0 0 16px transparent;}

::selection {background: #dbdbdb; color:#000}

a {color:#fff;
text-shadow:
#ef3336 -2px 0px,
#ef3336 0px 1px,
#ef3336 1px 0px,
#ef3336 0px -1px;
text-decoration: none;}

b {color: #000;
text-shadow:
#b59156 -2px 0px,
#b59156 0px 2px,
#b59156 2px 0px,
#b59156 0px -2px;
text-decoration: none;}

i {color: #e4e4e4;
text-shadow:
#b59156 -2px 0px,
#b59156 0px 2px,
#b59156 1px 0px,
#b59156 0px -1px;}

u {color: #b85153;
text-decoration-style: wavy;}

h1 {font-family: 'Arima Madurai';
font-size:24px;
letter-spacing: 2px;
color:#000;
text-align: center;
text-shadow:
#968a80 -2px 0px,
#fff 0px 2px,
#ccc 1px 0px,
#ccc 0px -1px;}

body {background: url('http://i59.tinypic.com/29c5a84.jpg');
background-repeat: repeat;
background-color: #000;}

.bg {position: fixed;
background: none;
margin: auto;
top: 0px;
bottom: 0px;
left: 0px;
right: 0px;
width: 1275px;
height: 660px;
text-align: center;
border: 0px solid #fff;}

.mainimg {background: none;
background:url('http://i.picpar.com/DfAc.png')
center center no-repeat;
position: absolute;
top: 0px;
left: 855px;
width: 400px;
height: 600px;
text-align: center;
border: 0px solid #ccc;}

.title {position: absolute;
font-family: 'Skiit';
color: #000;
font-size: 90px;
position: absolute;
top: 99px;
left: 80px;
width: 500px;
height: 105px;
border: 0px solid #fff;
text-align: left;
text-shadow:
#968a80 -3px 0px,
#968a80 0px 3px,
#ccc 2px 0px,
#ccc 0px -2px;}

.title1 { background: none;
background:url('https://78.media.tumblr.com/d6068982055b21d7fec97f173b89a2a6/tumblr_oy7rocCZTg1tjryj4o1_500.gif')
left center repeat;
position: absolute;
font-size: 90px;
top: 99px;
left: 80px;
width: 500px;
height: 105px;
text-align: left;
font-family: 'Skiit';
-webkit-text-fill-color: transparent;
-webkit-background-clip: text; }

.box {background: #575C69;
background:url('http://i.imgur.com/T3bfXOV.gif')
center center repeat;
position: absolute;
width: 1100px;
height: 400px;
top: 200px;
left: 85px;
border: 1px solid #9696965;
transform: skew(20deg);
overflow: auto;
animation:pulse 1.5s infinite alternate;}

@keyframes pulse {
 from { box-shadow:0px 0px 10px 3px #D6D2A9; }
 to { box-shadow:0px 0px 20px 5px #D6D2A9; }}

.innerbox {background: #575C69;
position: absolute;
opacity:.9;
width: 1000px;
height: 360px;
top: 220px;
left: 105px;
border: 1px solid #9696965;
overflow: auto;
transform: skew(20deg);}

.img1 {background: none;
background:url('http://i.picpar.com/zgAc.png')
center center no-repeat;
position: absolute;
top: 230px;
left: 200px;
width: 240px;
height: 340px;
text-align: center;
border: 0px solid #ccc;}

a.navi1, a.navi2, a.navi3, a.navi4, a.navi5 {position: absolute;top: 602px;}

a.navi1, a.navi2, a.navi3, a.navi4, a.navi5 {background-color: transparent;
font-family: 'Skiit';
display: inline-block;
line-height: 150%;
font-size: 20px;
color: #000;
height: 30px;
width: 120px;
text-shadow:
#968a80 -3px 0px,
#968a80 0px 3px,
#ccc 2px 0px,
#ccc 0px -2px;
transform: skew(25deg);
border-style: solid;
 border-top-color: transparent;
border-style: solid;
 border-bottom-color: #969696;
border-style: solid;
 border-right-color: transparent;
border-style: solid;
 border-left-color: #969696;
-webkit-transition:opacity 1s linear;
-webkit-transition:all 1s ease-in-out;
-moz-transition:all 1s ease-in-out;transition:all 1s ease-in-out;}

a.navi1:hover, a.navi2:hover, a.navi3:hover, a.navi4:hover, a.navi5:hover {
background-color: #ccc;
line-height: 150%;
box-shadow: 0px 0px 55px 5px #D6D2A9;
transform: skew(0deg);
border-style: solid;
 border-right-color: #969696;
-webkit-transition:opacity 1s linear;
-webkit-transition:all 1s ease-in-out;
-moz-transition:all 1s ease-in-out;transition:all 1s ease-in-out;}

#navi5:target .mainbox {z-index: 99; opacity: 0;}

/* ---------- */
/* ---------- */
/* I searched through hell for this and modified it to work on RPC.
If you're going to take and use, at least credit me(Alcyone) for it. */
.text {
background-image: -webkit-linear-gradient(left, #575C69, #968A80, #D6D2A9);
background-image: -ms-linear-gradient(left, #575C69, #968A80, #D6D2A9);
background-image: -o-linear-gradient(left, #575C69, #968A80, #D6D2A9);
background-image: linear-gradient(to right, #575C69, #968A80, #D6D2A9);
color:transparent;
-webkit-background-clip: text;
background-clip: text;
overflow: auto;
padding:0px 5px 0px 2px;
position: absolute;}
/* ---------- */
/* ---------- */

.chitter1 {position: absolute;
font-family: 'Skiit';
color: #000;
font-size: 30px;
position: absolute;
top: 320px;
left: 450px;
width: 150px;
border: 0px solid #000;
text-align: center;
transform: rotate(-20deg);
text-shadow:
#fff -1px 0px,
#fff 0px 1px,
#fff 1px 0px,
#fff 0px -1px;}

.chitter2 {position: absolute;
font-family: 'Skiit';
color: #000;
font-size: 30px;
position: absolute;
top: 440px;
left: 450px;
width: 250px;
border: 0px solid #000;
text-align: center;
transform: rotate(10deg);
text-shadow:
#fff -1px 0px,
#fff 0px 1px,
#fff 1px 0px,
#fff 0px -1px;}

.chitter3 {position: absolute;
font-family: 'Skiit';
color: #000;
font-size: 30px;
position: absolute;
top: 380px;
left: 520px;
width: 250px;
border: 0px solid #000;
text-align: center;
text-shadow:
#fff -1px 0px,
#fff 0px 1px,
#fff 1px 0px,
#fff 0px -1px;}

.mainbox { position: absolute;
background: #968A80;
width: 700px;
height: 340px;
top: 230px;
left: 175px;
opacity: 0;}

.mainbox:target {
top: 230px;
left: 175px;
opacity: 1;}

.info {background: #000;
opacity:1;
color: #e4e4e4;
font-size:16px;
font-family: 'Skiit';
position: absolute;
text-align: left;
width: 690px;
height: 330px;
left: 0px;
top: 0px;
border: 0px solid #fff;
padding:5px 5px 5px 5px;
overflow: auto;
z-index:1;}

.info:target{z-index:10;}

.line1 {background: #fff;
position: absolute;
width: 420px;
height: 2px;
top: 150px;
left: 50px;
text-align: center;
box-shadow:0px 0px 20px 5px #D6D2A9;
border: 0px solid #000;}

.line2 {background: #fff;
position: absolute;
width: 420px;
height: 2px;
top: 160px;
left: 50px;
text-align: center;
box-shadow:0px 0px 20px 5px #D6D2A9;
border: 0px solid #000;}

.line3 {background: #fff;
position: absolute;
width: 420px;
height: 2px;
top: 170px;
left: 50px;
text-align: center;
box-shadow:0px 0px 20px 5px #D6D2A9;
border: 0px solid #000;}

audio {
 position: absolute;
 transform: translate(-50%);
 left: 1105px;
 top: 570px;
 pointer-events: all;
 filter: brightness(10) drop-shadow(0 0 5px #D6D2A9) drop-shadow(0 0 2px #D6D2A9); }

audio::-webkit-media-controls-panel {background: none}
audio::-webkit-media-controls-current-time-display {display: none;}
audio::-webkit-media-controls-time-remaining-display{display: none;}
audio::-webkit-media-controls-mute-button {display: none;}
audio::-webkit-media-controls-volume-slider {display: none;}
</style>

<div class="bg">

<a class="navi1" href="#1" style="left: 180px;">Statisitcs</a>
<a class="navi2" href="#2" style="left: 330px;">Biography</a>
<a class="navi3" href="#3" style="left: 480px;">Augments</a>
<a class="navi4" href="#4" style="left: 630px;">OOC</a>
<a class="navi5" href="#5" style="left: 780px;">Reset</a>

<div class="box"></div>
<div class="innerbox"></div>
<div class="mainimg"></div>
<div class="line1"></div>
<div class="line2"></div>
<div class="line3"></div>
<div class="title">Skiitariik</div>
<div class="title1">Skiitariik</div>

<audio controls><source src="http://k003.kiwi6.com/hotlink/2npkckml58/Chrispy_-_Predator_Cyberoptix_Remix_HD_.mp3="audio/mpeg"></audio>

<div class="img1"></div>

<div class="chitter1">-- chitter</div>
<div class="chitter2">-- chitter, chitter</div>
<div class="chitter3">-- chit chit . . .</div>

<div id="1" class="mainbox">
<div class="info">

<h1>Statistics</h1>

<font style=float:left><b>Name</b></font> <font style=float:right><i>Skiitariik Ja'aak Ra'Qiir</i></font><br>
<font style=float:left><b>Alias</b></font> <font style=float:right><i>Skii, Tariik, Bug, Commander.</i></font><br>
<font style=float:left><b>Rank</b></font> <font style=float:right><i>Imperial Commander</i></font><br>
<font style=float:left><b>Height</b></font> <font style=float:right><i>5'8"</i></font><br>
<font style=float:left><b>Weight</b></font> <font style=float:right><i>640 lbs</i></font><br>
<font style=float:left><b>Race</b></font> <font style=float:right><i>Ja'aak Saakeeth. (The Advent)</i></font><br>
<font style=float:left><b>Age</b></font> <font style=float:right><i>34 Ja'aak Cycles. 98 Terran Cycles</i></font><br>
<font style=float:left><b>Affiliation</b></font> <font style=float:right><i>The Imperial Navy</i></font><br>
<font style=float:left><b>Exoskeleton Integrity</b></font> <font style=float:right><i>96%</i></font><br>
<font style=float:left><b>Mutation Progress</b></font> <font style=float:right><i>23%</i></font><br>

</div></div>

<div id="2" class="mainbox">
<div class="info">

<h1>Biography</h1>

<span class="text">

<b>Bold</b>, <i>Italics</i>, <u>underline</u>, <a target="_blank" href="LINK" title="">Link</a>
<br>
<br>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</span>

</div></div>

<div id="3" class="mainbox">
<div class="info">

<h1>Augments</h1>

<span class="text">

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</span>

</div></div>

<div id="4" class="mainbox">
<div class="info">

<h1>Out of Character</h1>

<span class="text">


<b>00</b>. Profile was <u>commissioned</u> specifically for Skiitariik by <a target="_blank" href="https://roleplay.chat/profile.php?user=Alcyone" title="">Alcyone</a>. Do <i>not</i> steal to use. If you are interested in commissioning a profile, go ahead and pm her on Discord/RPC or leave mail.<br>
<b>01</b>. OOC Rule Here.<br>

</span>

</div></div>