Joyrider -【 PAGE 7 by Anomaly ☽】

<!DOCTYPE html>
<head>

<!--

PAGE #7 by Anomaly ☾ tumblr user xollyx ☽ : JOYRIDER !!

            - i made the base code
            - please abide by all the rules

 【 All themes and pages can be found here : http://xollyx.tumblr.com/thm 】

Thank you for using! Or just looking at the code. Whatever you're here for. Either way, it's appreciated!
Feel free to message me if you need any help, my ask box is always open!

-->

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
<script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>

<script>
(function($){
$(document).ready(function(){
$("a[title]").style_my_tooltips({
tip_follows_cursor:true,
tip_delay_time:90,
tip_fade_speed:600,
attribute:"title"
});
});
})(jQuery);
</script>

<title>{Title}</title>

<link rel="shortcut icon" href="{URL HERE}">
<link rel="alternate" type="application/rss+xml" href="{RSS}">
{block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}

<style type="text/css">

@font-face { font-family: "street gathering"; src: url('https://dl.dropboxusercontent.com/s/c2bdidfzvdo23yy/Street%20Gathering.ttf?dl=0'); format("truetype");}

@font-face { font-family:"nishuki"; src: url('https://dl.dropboxusercontent.com/s/cj2vk6rxyk8pqhh/nishuki_pixels.ttf?dl=1'); format(“truetype”);}

::-webkit-scrollbar {
width: 9px;
height: 4px;
background:#ccc;
border:4px solid #fff;
}

::-webkit-scrollbar-thumb {
background-color:#ccc;
border-radius:5px;
}

#s-m-t-tooltip {
max-width:300px;
margin:10px 0px 0px 10px;
background-color:#000;
font-family:nishuki;
font-size:8px;
padding:3px;
color:#fff;
z-index:999999999999999999999999999999999999;
}

#s-m-t-tooltip:after {
position: absolute;
display: block; content: "";
border-color: transparent #000 transparent transparent ;
border-style: solid;
border-width: 5px;
height:0;
width:0;
position:absolute;
top:3px;
left:-10px;
}

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

::-moz-selection {
background: #000;
color: #fff;
}

::-webkit-selection {
background: #000;
color: #fff;
}

{block:ifcursor}body, a, a:hover {cursor: url('CURSOR URL HERE'), progress;}{/block:ifcursor}

body {
background:#091C58;
background-image:url('{URL HERE}');
background-attachment:fixed;
{block:ifbgcover}
    background-repeat:no-repeat;
    background-size:cover;
{/block:ifbgcover}
color:#000;
font-family:consolas;
font-size:11px;
}

a {
color:#555;
text-decoration:none;
}

a:hover {
color:#ccc;
     -webkit-transition: all 0.7s ease;
    -moz-transition: all 0.7s ease;
    -o-transition: all 0.7s ease;
    transition: all 0.7s ease;
}

#title {
position:fixed;
top:calc(7% - 65px);
left:30%;
font-family:street gathering;
font-size:120px;
font-style:italic;
text-shadow: -1px 0 #fff, 0 1px #fff, 1px 0 #fff, 0 -1px #fff;
}

#subtitle {
position:fixed;
top:calc(7% + 5px);
left:calc(30% + 200px);
font-family:street gathering;
font-size:50px;
text-shadow: -1px 0 #fff, 0 1px #fff, 1px 0 #fff, 0 -1px #fff;
}

#box {
position:fixed;
top:15%;
left:30%;
padding:10px;
width:500px;
background-color:#fff;
border:1px solid #000;
outline:1px solid #000;
outline-offset:-5px;
z-index:9999;
}

#sidebarimg {
position:fixed;
top:15%;
left:calc(30% - 210px);
background-color:#fff;
border:1px solid #000;
outline:1px solid #000;
outline-offset:-5px;
padding:10px;
}

#links {
position:fixed;
text-align:center;
width:175px;
left:calc(30% - 210px);
top:calc(15% + 312px);
background-color:#fff;
border:1px solid #000;
outline:1px solid #000;
outline-offset:-5px;
padding:10px;
}

#sidelinks {
position:fixed;
top:15%;
left:calc(30% + 530px);
line-height:25px;
}

#sidelinks a {
position:fixed;
width:20px;
height:20px;
border-radius:100%;
background:#000;
border:1px solid #eee;
}

.credit {
position:fixed;
bottom:4px;
left:8px;
font: 9px consolas;
text-transform:uppercase;
letter-spacing: 0px;
padding: 2px;
}

</style>
<body>

<div id="title">title here</div>
<div id="subtitle">- subtitle here</div>

<div id="sidebarimg">
<img style="width:175px;" src="{URL HERE}">
</div>

<div id="links">
content here
</div>

<div id="box">
content here
</div>

<div id="sidelinks">
<a style="opacity:1;" href="/" title="back home"></a><br>
<a style="opacity:.8;" href="/ask" title="ask"></a><br>
<a style="opacity:.6;" href="/submit" title="submit"></a><br>
<a style="opacity:.4;" href="/abt" title="about"></a><br>
<a style="opacity:.2;" href="" title="other links"></a>
</div>


{block:ifrender}<div style="position:fixed; left:{text:render left}px; bottom:{text:render bottom}px; z-index:1;"><img src="{image:render}" width="{text:render width}"></div>{/block:ifrender}

<div class="credit"><a href="http://xollyx.tumblr.com/" title="theme"><img src="http://orig04.deviantart.net/151c/f/2015/334/6/e/tumblr_inline_mij52fv1gc1qz4rgp_by_kittystuff-d9il7w5.gif" /></a></div>

</body>
</html>