erq

<style>@import url('https://fonts.googleapis.com/css?family=Questrial');
@import url('https://fonts.googleapis.com/css?family=Abel');
@import url(https://fonts.googleapis.com/css?family=Montserrat:100,300,400,700,900);
@import url('https://fonts.googleapis.com/css?family=Playfair Display SC');
/*968583*/

/*coded by [punpun]. do not steal the characters. do not remove this. do not remove the credits.*/


 body {
 /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#c9bebd+0,cab3b1+40,936661+100 */
background: #EFEFEF;
 overflow-y:hidden;
overflow-x:hidden;}



::-webkit-scrollbar-thumb {
 width: 3px;
 background-color: #trans;}
::-webkit-scrollbar {
 width: 3px;
 background-color: transparent;}
::-webkit-scrollbar {
width: 5px;
}

::-webkit-scrollbar-track {
background-color: transparent;
}



::-webkit-scrollbar-thumb {
background-color: #000;
border: 1px solid #000;
}

audio::-webkit-media-controls-play-button { height:100%;
width: 100%; }
audio::-webkit-media-controls-panel { height: 50px;
width: 17%;
opacity: 0; }


a {
 color: #000;
 text-decoration: none;
 background-color: #F73B4A;
 transition: all 0.4s ease-in-out;
 -moz-transition: all 0.4s ease-in-out;
 -webkit-transition: all 0.4s ease-in-out;}
a:hover {
 color: #F73B4A;
 background-color: #000;
 text-decoration: none;
 transition: all 0.4s ease-in-out;
 -moz-transition: all 0.4s ease-in-out;
 -webkit-transition: all 0.4s ease-in-out;}
a.tab:active, a.tab:link, a.tab:visited {
 background-color: #450303;
 border: 4px double #968583;
 border-radius: 0px;
 display: inline-flex;
 height: 10px;
 text-decoration: none;
 width:15px;
-webkit-transition: all 0.4s ease-in;
-moz-transition: all 0.4s ease-in;
-ms-transition: all 0.4s ease-in;
-o-transition: all 0.4s ease-in;
transition: all 0.4s ease-in;
}
a.tab:hover {
 background-color: #D68472;
 border: 4px double #333333;
}
a.tooltip {outline:none; text-decoration: none; cursor: url(), auto;}
a.tooltip strong {line-height:30px;}
a.tooltip:hover {text-decoration:none; }
a.tooltip span {
 z-index:100;display:none; padding:15px 20px;
 bottom: 98;right: 657;
 width:230px; line-height:16px;
height: 220px;
}
a.tooltip span img { height: 64px;
width: 64px;
padding: 0.5%; }
a.tooltip:hover span{
 display:inline; position:fixed; color:#F73B4A;
 border:3px solid #000; background:#trans; opacity: 1; }

#left {
 position: fixed;
 right: 385;
 bottom: 140;
 width: 2px;
height: 0;
 background-color: #F73B4A;
 border: 0px solid #968583;
 z-index: 10;
 opacity: 1;
-webkit-transition: all 0.6s ease-out;
-moz-transition: all 1.3s ease-out;
-ms-transition: all 1.3s ease-out;
-o-transition: all 1.3s ease-out;
 transition: all 1.3s ease-out;}


body:hover #left{height: 120;
 opacity: 1;
-webkit-transition-delay: 2.4s ;
-moz-transition-delay: 2.4s;
-ms-transition-delay: 2.4s ;
-o-transition-delay: 2.4s ;
 transition-delay: 2.4s ;
}

#right {
 position: fixed;
right: 613px;
 bottom: 140;
 width: 2px;
height: 1;
 background-color: #F73B4A;
 border: 0px solid #968583;
 z-index: 20;
 opacity: 1;-webkit-transition: all 0.6s ease-out;
-moz-transition: all 1.3s ease-out;
-ms-transition: all 1.3s ease-out;
-o-transition: all 1.3s ease-out;
 transition: all 1.3s ease-out;}

body:hover #right{height: 120;
 opacity: 1;
-webkit-transition-delay: 2.4s ;
-moz-transition-delay: 2.4s;
-ms-transition-delay: 2.4s ;
-o-transition-delay: 2.4s ;
 transition-delay: 2.4s ;
}
#bottom{
 position: fixed;
 right: 428px;
 bottom: 108;
 width: 1;
height: 1;
 background-color: #4A0000;
 border: 0px solid #968583;
 z-index: 20;
 opacity: 1;
-webkit-transition: all 0.6s ease-out;
-moz-transition: all 1.3s ease-out;
-ms-transition: all 1.3s ease-out;
-o-transition: all 1.3s ease-out;
 transition: all 1.3s ease-out;}

body:hover #bottom{width:140px;
 opacity: 1;
-webkit-transition-delay: 2.4s ;
-moz-transition-delay: 2.4s;
-ms-transition-delay: 2.4s ;
-o-transition-delay: 2.4s ;
 transition-delay: 2.4s ;
}

/*968583*/

 .be{
margin-top: 5px;
height: 115px;
width: 70px;
margin-right: 1px;
border: #D68472 2px solid;
-webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
-o-filter: grayscale(100%);
filter: grayscale(100%);
-webkit-transition: all 0.6s ease-out;
-moz-transition: all 0.6s ease-out;
-ms-transition: all 0.6s ease-out;
-o-transition: all 0.6s ease-out;}

.be:hover {border: #000 2px solid;
-webkit-filter: grayscale(0%);
-moz-filter: grayscale(0%);
-o-filter: grayscale(0%);
filter: grayscale(0%);}


 #ufuk2 {position: fixed;right: -2%;bottom: 0%;z-index:-10; opacity: 1;}
 #ufuk2 img {width: auto;height: 80%;}

/*frist things first*/

 .head {
 position: fixed;
 right: 369;
 bottom: 305;
 color: #F73B4A;
 font-family: Playfair Display SC;
 font-size: 30px;opacity: 0;
-webkit-transition: all 0.6s ease-out;
-moz-transition: all 0.6s ease-out;
-ms-transition: all 0.6s ease-out;
-o-transition: all 0.6s ease-out;
 transition: all 0.6s ease-out;}


body:hover .head{opacity: 1;
-webkit-transition-delay: 1.6s ;
-moz-transition-delay: 1.6s ;
-ms-transition-delay: 1.6s ;
-o-transition-delay: 1.6s ;
 transition-delay: 1.6s ;
}
 .head2 {
 position: fixed;
 right: 445;
 bottom: 305;
 color: #F73B4A;
 font-family: Questrial;opacity: 0;
 font-size: 20px;
-webkit-transition: all 0.6s ease-out;
-moz-transition: all 0.6s ease-out;
-ms-transition: all 0.6s ease-out;
-o-transition: all 0.6s ease-out;
 transition: all 0.6s ease-out;}

body:hover .head2{
 bottom: 285;opacity: 1;
-webkit-transition-delay: 2.4s ;
-moz-transition-delay: 2.4s;
-ms-transition-delay: 2.4s ;
-o-transition-delay: 2.4s ;
 transition-delay: 2.4s ;
}

 #botline {
 width: 1px;height: 7px;
 background: #000;
 position: fixed;
 bottom: 306;right: 373;
 display:block;
-webkit-transition: all 1.6s ease-out;
-moz-transition: all 1.6s ease-out;
-ms-transition: all 1.6s ease-out;
-o-transition: all 1.6s ease-out;
 transition: all 1.6s ease-out;}
body:hover #botline{
 width: 248px;
}

#sprite { position: absolute;
top: 5px;
right: 5px;
background: url(https://img.pokemondb.net/sprites/black-white/anim/normal/loudred.gif) no-repeat;
background-size: contain;
width: 45px;
height: 45px;
-webkit-transition: all 1.6s ease-out;
-moz-transition: all 1.6s ease-out;
-ms-transition: all 1.6s ease-out;
-o-transition: all 1.6s ease-out;
 transition: all 1.6s ease-out;
opacity: 0; }
body:hover #sprite { transition-delay: 0.55s;
opacity: 0.85; }

.player { height: 100%;
width: 100%;
opacity: 0; }


/*boxes*/

.box {
 position: fixed;
right: 390px;
 bottom: 120px;
 height: 140;
 width: 190;
 background-color: #transparent;
border-bottom: #000000 10px solid;
border-right: #000000 10px solid;
border-left: #F73B4A 10px solid;
border-top: #F73B4A 10px solid;
 box-shadow: #000000 0px 0px 0px 0px;
 background-image:url("");
 z-index: 5;
 color: #F73B4A;
    font-family: Palatino Linotype;
    font-style: normal;
    font-variant: ;
    font-weight: 400;
 text-align: justify;
 overflow-x: hidden;
 overflow-y: auto;
 font-size: 11px;
 padding: 5px;
-webkit-transition: all 0.4s ease-out;
-moz-transition: all 0.4s ease-out;
-ms-transition: all 0.4s ease-out;
-o-transition: all 0.4s ease-out;
 transition: all 0.4s ease-out;
opacity: 0;
filter:alpha(opacity=75);
}
body:hover .box{
opacity: 1;
-webkit-transition-delay: 3.6s;
-moz-transition-delay: 3.6s;
-ms-transition-delay: 3.6s;
-o-transition-delay: 3.6s;
 transition-delay: 3.6s ;


</style>

<a href="profile.php?user=Punpun" title="Coded by Punpun" target="_blank"><img src="http://i.imgur.com/acD32sR.png" style="position:fixed; right:10; bottom:0;width:25;z-index:999;"></a>



<div id="left"></div><div id="right"></div><div id="bottom"></div>

<div class="head"><i>THE TRAINER.</i></div><div id="topline"></div><div id="botline"></div>
<div class="head2">Katsuyori Shibata.</div>

<div id="ufuk2"><img src="http://i.picpar.com/CkVc.jpg"></div>

<div class="box">
Name <font style="float:right"><a class="tooltip">Katsuyori Shibata<span>No frills. No nonsense. Shibata believes in the fundamentals.
Some Pokemon didn't respect their trainers. Some had trainers who were too lenient. Shibata changed these disobedient and rowdy Pokemon. Eventually, he was dubbed "the Trainer" after training dozens of Pokemon to become reliable and efficient. He didn't have an affinity for any particular type of Pokemon. He often saw people align with the types they identified with--aesthetically and personality-wise, and he disliked that. Shibata viewed normal-types as the most efficient and pragmatic. He wanted to avoid the pitfall of eccentricity that others fell into.
</span></a></font><br>

Nicknamed <font style="float:right;">The Trainer


</font><br>

Personality <font style="float:right;"><a class="tooltip">Pragmatic, assertive

<span><font style="color:#E3CFB3;"><i> identify the essential. eliminate the rest. √</I></font> Shibata values simplicity, productivity, and pragmatism above all. He values self-improvement through self-reflection, which often results in him getting rid of what he finds superfluous in life. This includes belongings, Pokemon, and people. The transient nature of life as a traveler meant that Shibata had few connections, so he rarely got attached and often stopped associating with people. He is a natural leader; Shibata's leadership skills were groomed in sports and community roles since he was young. He sometimes comes across as insensitive and tactless in his speech.</span></a></font><br>

Age <font style="float:right;">20</font><br>
Occupation <font style="float:right;"><a class="tooltip">Trainer, athlete <span>Shibata is currently traveling from town to town to battle Pokemon and to train the disobedient. He finds adventuring rewarding and a good way of living a simple lifestyle. // When he was younger, he had an affinity for sports and was locally renown for his skill in baseball. He opted out of seeking a professional career, citing fame as being off-putting. He still participates in amateur sports and has a slight sense of kinship with fighting-type Pokemon and their trainers, primarily for their emphasis on athleticism.</span></a></font><br>
Height/Weight <font style="float:right;">6'0 - 175 lbs</font><br>
Type<font style="float:right;"><a class="tooltip">Normal <span><img src="http://orig13.deviantart.net/22a1/f/2010/067/7/b/staraptor_by_kwsmithjr.png">
<img src="https://img.pokemondb.net/sprites/heartgold-soulsilver/shiny/persian.png">
<img src="https://img.pokemondb.net/sprites/platinum/normal/kecleon.png">
<img src="http://pldh.net/media/pokemon/gen4/dp/143.png">
<img src="http://2.bp.blogspot.com/_v9trPFVh9B8/SZN1Gw2xXOI/AAAAAAAAABI/KyukpLfPdO8/s400/Pidgeotto.gif"><br>
<img src="https://img.pokemondb.net/sprites/black-white/anim/normal/loudred.gif">

</span></a></font><br>
Orientation <font style="float:right;">Heterosexual<br></font><br>
Remain<font style="float:right;"><a class="tooltip">Abstinent.<span><font style="color:#E3CFB3;">This is<br>
the<br>
ooc<br>
section<br>
ya</font>
</span></a></font><br></div>