kotone

<script defer type="ba597b27244da8719d65acba-text/javascript">
{
function tooltip() {
    var title = $(this).attr("title");
    $(this).removeAttr("title");

    this.TooltipMessage = $("<div/>", {class: "tooltipMessage", style: "display: none;"});
    this.TooltipMessage.html("<span>" + title + "</span>");
    $("body").append(this.TooltipMessage);


    if ($(this).hasClass("tooltipLeft")) {
        this.TooltipMessage.addClass("left");
    }

    $(this).hover(tooltipFadeIn, tooltipFadeOut);
    $(this).mousemove(tooltipMousemove);
}

function tooltipFadeIn() {
    this.TooltipMessage.stop(true, false).fadeIn();
}

function tooltipFadeOut() {
    this.TooltipMessage.stop(true, false).fadeOut();
}

function tooltipMousemove(e) {
    var offset = {
        left: e.pageX,
        top: e.pageY + 51
    };

    if (this.TooltipMessage.hasClass("left")) {
        offset.left -= this.TooltipMessage.width() + 10;
    } else {
        offset.left -= 100;

    }
    this.TooltipMessage.offset(offset);
}

$(function (e) {
    $(".tooltip").each(tooltip);
});

};
</script>
<style>
body {background: url(https://i.imgur.com/S1RpiHL.png) #ffd4eb; cursor: url(http://i.imgur.com/pg9xw.png), auto;}

.youre {position: fixed; width: 200px; height: 210px; margin: auto; left: 0px; right: 0px; top: 10px; bottom: 0px; border: 1px solid black;background: white;}
.hopeless {position: absolute; top: 10px; height: 178px; left: 10px; border: 1px solid black; padding: 5px; background: #d43519;}
.hopelessless {position: absolute; top: 10px; height: 178px; right: 10px; border: 1px solid black; padding: 5px; background: #d43519;}
.hopelessless2 {position: absolute; top: 10px; height: 178px; left: 178px; border: 1px solid black; padding: 5px; background: #d43519;}

.give {position: absolute; left: 30px; top: 10px; width: 139px; height: 25px; background: url(https://i.imgur.com/VhT7cRo.jpg) #fff; background-repeat: no-repeat; border: 1px solid black; background-size: 100%; background-position: -5 -30;}
.give2 {position: absolute; right: 30px; top: 10px; width: 160px; height: 25px; background: url(https://i.imgur.com/nWR458g.jpg) #fff; background-repeat: no-repeat; border: 1px solid black; background-size: 100%; background-position: -5 -58;}
.give3 {position: absolute; left: 30px; top: 10px; width: 160px; height: 25px; background: url(https://i.imgur.com/Pe5yfoY.jpg) #fff; background-repeat: no-repeat; border: 1px solid black; background-size: 100%; background-position: -5 -10;}
.up {position: absolute; font-size: x-small; font-family: tahoma; top: 40px; left: 38px; width: 140px; text-align: justify; font-style: italic;}
.now {position: absolute; height: 30px; background: #d43519; width: 138px; border: 1px solid black; top: 167px; left: 30px; font-size: x-small; text-align: center; font-family: tahoma; line-height: 8px;}

.best {position: fixed; width: 200px; height: 210px; margin: auto; left: -410px; right: 0px; top: 10px; bottom: 0px; border: 1px solid black;background: white;}

.monki {position: fixed; width: 200px; height: 210px; margin: auto; left: 410px; right: 0px; top: 10px; bottom: 0px; border: 1px solid black;background: white;}

.queen {position: fixed; width: 610px; height: 200px; margin: auto; left: 0px; right: 0px; top: -410px; bottom: 0px; border: 1px solid black;background: white;}
.queen1 {position: absolute; width: 588px; border: 1px solid black; background: url(https://i.imgur.com/9X7FAGY.jpg); left: 10px; top: 10px; height: 180px; background-position: 0 -100; background-size: 100%; border-radius: 10px;}

.bet {position: fixed; width: 610px; height: 200px; margin: auto; left: 0px; right: 0px; top: 430px; bottom: 0px; border: 1px solid black;background: white;}
.bet1 {position: absolute; width: 588px; border: 1px solid black; background: url(https://i.imgur.com/lH8qMta.jpg); left: 10px; top: 10px; height: 180px; background-position: 0 -240; background-size: 100%; border-radius: 10px;}

.best1 p {height: 133px;overflow: auto;}
.monki1 p {height: 130px;overflow: auto; margin-left: -20px; width: 145px;}

.monki1 hr {margin-left: -40px; border: 0;
    height: 1px;
    background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));}

.queen1 hr {margin-left: -20px; border: 0;
    height: 1px;
    background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));}

::-webkit-scrollbar {
width: 2px; }

::-webkit-scrollbar-thumb:vertical {
background: #FCfcfc;
border-right: 6px solid #fcfcfc;
border-top: 5px solid #fcfcfc;
border-bottom: 5px solid #fcfcfc;}


hr {border: 0;
    height: 1px;
    background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));}

.ree {position: absolute; left: 194px; top: 195px;}

a {text-decoration: none; color: #d43519; font-weight: bold; font-style: italic; cursor: url(http://i.imgur.com/pg9xw.png), auto;}
a:hover {text-shadow: 0px 0px 5px #d43519;
transition:all .7s ease-in-out;
-webkit-transition:all .7s ease-in-out;
-o-transition:all .7s ease-in-out;
-moz-transition:all .7s ease-in-out;}

div.tooltipMessage {
    z-index: 600;
    position: absolute;
    width: 220px;
    font-family: verdana;
    font-size: x-small;
    text-align: justify;
}
div.tooltipMessage > span {width: 300px;
    display: inline-block;
    background: rgba(212,53,25, .8);
    padding: 8px 8px;
    color: #fff;
    border: 3px solid #fff;
div.tooltipMessage.left > span {
    float: right;
}
</style>
</head>
<body>
<div class="youre">
<div class="best"><div class="best1">
<div class="hopeless"></div>
<div class="give3"></div>
<div class="up"><hr></span><p>Name: <span style="float: right;">Words here.</span><br>
Age: <span style="float: right;">Words here.</span><br>
Gender: <span style="float: right;">Words here.</span><br>
Height: <span style="float: right;">Words here.</span><br>
Weight: <span style="float: right;">Words here.</span><br>
Hometown: <span style="float: right;">Words here.</span><br>
Region: <span style="float: right;">Words here.</span><br>
Starter: <span style="float: right;">Words here.</span><br>
Affinity: <span style="float: right;">Words here.</span><br>
---: <span style="float: right;">---.</span><br>
Orientation: <span style="float: right;">Words here.</span><br>
Status: <span style="float: right;">Words here.</span><br></p></div>
</div>
</div>

<div class="monki"><div class="monki1">
<div class="hopelessless"></div>
<div class="give2"></div>
<div class="up"><hr><p>Words here.</p><span style="position: absolute; top: 120px; width: 135px;"><hr></span><span style="position: absolute; top: 38px; left: 2px; width: 135px;"><hr></span>

<span style="position: absolute; top: 135px; left: -32px;"><a class="tooltip" title="<center><i>Fuguri</i> • <i>Female</i> • <i>Calm</i> • <i>Leaf Guard</i> • <i>Miracle Seed</i><br><em>Petal Dance</em> • <em>Magical Leaf</em> • <em>Sweet Scent</em> • <em>Aromatherapy</em><hr></center>My beloved starter. She has been with me through the worst of things and the best of things. I would never let her go. Even if she's not what others consider an 'ideal' Pokémon, she still means the world to me." href="#" target="_blank"><img src="https://i.imgur.com/dMqhg7V.png" alt="" height="25/" /></a>

<a class="tooltip" title="<center><i>Anberlin</i> • <i>Female</i> • <i>Modest</i> • <i>Static</i> • <i>Ampharosite</i><br><em>Thunderbolt</em> • <em>Volt Switch</em> • <em>Signal Beam</em> • <em>Heal Bell</em><hr></center>I met Anberlin as a Flaaffy who was pining after the Ampharos of the Lighthouse in Olivine City. At first I thought I was going to end up doing more harm than good, but this girl loves me a whole lot!" href="#" target="_blank"><img src="https://i.imgur.com/tWtVqAL.png" alt="" height="25/" /></a>

<a class="tooltip" title="<center><i>Trogdore</i> • <i>Male</i> • <i>Quirky</i> • <i>Drizzle</i> • <i>Eject Button</i><br><em>Amnesia</em> • <em>Curse</em> • <em>Hyper Voice</em> • <em>Scald</em><hr></center>This froggo is a troll. He has a tendency to do what he wants when he wants, and it's not because I don't have the badges to control him. He's just a brat. But I love him and I'm happy to have him on my team." href="#" target="_blank"><img src="https://i.imgur.com/wbLXPmT.png" alt="" height="25/" /></a>

<a class="tooltip" title="<center><i>Ludger</i> • <i>Male</i> • <i>Sassy</i> • <i>Serene Grace</i> • <i>Maranga Berry</i><br><em>Roost</em> • <em>Toxic</em> • <em>Protect</em> • <em>Dig</em><hr></center>This lazy little guy is nothing short of cute. He's always tired and has little to no energy, but he's a good tank for the team and I appreciate it whenever he gets up to fight!" href="#" target="_blank"><img src="https://i.imgur.com/zvefb8K.png" alt="" height="25/" /></a>

<a class="tooltip" title="<center><i>Pistachio</i> • <i>Male</i> • <i>Adamant</i> • <i>Quick Feet</i> • <i>Toxic Orb</i><br><em>Facade</em> • <em>Thrash</em> • <em>Charm</em> • <em>Close Combat</em><hr></center>While he's very adept at physical moves, this little guy enjoys cuddling more than battling. This suits me quite well because I adore snuggling him. He more than looks like a teddy bear! He really is one!" href="#" target="_blank"><img src="https://i.imgur.com/aJQqkNN.png" alt="" height="25/" /></a>

<a class="tooltip" title="<center><i>Hikari</i> • <i>Female</i> • <i>Calm</i> • <i>Levitate</i> • <i>Leftovers</i><br><em>Will-o-Wisp</em> • <em>Taunt</em> • <em>Hex</em> • <em>Pain Split</em><hr></center>The way I met this little prankster was through a perilous journey. Said journey involved a courage challenge and me screaming my head off." href="#" target="_blank"><img src="https://i.imgur.com/Pmlp4lN.png" alt="" height="25/" /></a></span></div>
</div>
</div>

<div class="queen"><div class="queen1">
<div class="bet">
<div class="bet1"></div></div>
<div class="ree">
<div class="hopeless"></div>
<div class="hopelessless2"></div>
<div class="give"></div>
<div class="up"><hr><p style="width: 132px; margin-left: -5px;">Words here.</a></p></div>
<div class="now"><hr>. romantique babe .<hr></div></div>
</div>