ABOUT PAGE #4 - BLIZZARD

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">


<!--

ABOUT PAGE #4 'blizzard' -  BY PROTECTMCCALL (http://protectmccall.tumblr.com)
-DONT USE AS BASE OR STEAL THE BITS OR REMOVE CREDIT P PLEASE
-ASK ME FOR HELP IF U STRUGGLE
-HOPE U HAVE A GREAT DAY TODAY BUTTERCUP ♥

-->


<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
<title>About.</title>
<link rel="shortcut icon" href="{Favicon}">
<link rel="alternate" type="application/rss+xml" href="{RSS}">
<!----jquery----->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
<!----google fonts---->
<link href='http://fonts.googleapis.com/css?family=Cousine:400,700' rel='stylesheet' type='text/css'>
<!---tooltip--->
<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:300,
tip_fade_speed:300,
attribute:"title"
});
});
})(jQuery);
</script>


<style type="text/css">

body {

    background: #fff; /*background color*/
    background-image:url();
    background-attachment: fixed;
    background-repeat: repeat; /* if you dont want the pic repeated change 'repeat' to 'no-repeat'*/
    font-size: 10px;
    line-height:110%;
}

a {
    color: #000000; /*link colour*/
    text-decoration: none;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    transition: all 0.5s ease;
}


#s-m-t-tooltip { /* tooltip is what styles the hover title="" of the link */
    margin-top:20px;
    background-color:#ffffff;
    font-family:Helvetica;
    font-size:8px;
    color:#333333;
    letter-spacing:1px;
    text-transform:lowercase;
    padding:5px;
    padding-bottom:3px;
    z-index:999999999999999999999999999999999999;
    border-bottom: 9px double #dfe9ed ; /* colour of the on-hover lines under the text */
    font-weight:500;
}


#container {
    width: 650px;
    position:absolute;
    left:50%;
    top:50%;
    margin-left:-315px;
    margin-top:-250px;

}

#links {
    margin-left:472px;
    margin-top:290px;
    display:inline;
    position: fixed;
    font-size:16px;
}

  #links a {
      display:inline;
      color: #fff; /* colour of the link circles */
      -webkit-transition: all 0.5s ease-in-out;
      -moz-transition: all 0.5s ease-in-out;
      transition: all 0.5s ease-in-out;

}

#links a:hover {
    opacity:0.0;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
}


#intro {
    color: #000; /*title font color*/
    font-size: 39px;
    margin-top:-470px;
    margin-left:433px;
    font-family: Times;
    text-align: center;
    line-height: 70%;
    z-index:999;
    opacity:1;
    padding-bottom: 5px;
    padding-top:10px;
    width: 110px;
    border-bottom: 2px solid black;
}


#banner {
    height: 500px;
    width: 650px;
    background-image:url(http://static.tumblr.com/nc6lhz2/F24ny7uuu/winter__s_treetops_by_awaro__.png); /*background picture*/
    background-repeat: repeat; /* if you dont want the pic repeated change 'repeat' to 'no-repeat'*/
}


#filter {
    height: 500px;
    width: 325px;
    background-color:#a9c1b3; /*colour of the filter*/
    opacity:0.4;  /* the opacity of the colour filter (make it "1" for full density it looks great either way~)*/
    margin-left:325px;

}


#description {
    opacity:1;
    margin-left:320px;
    width: 275px;
    height: auto;
    position: absolute;
    text-align: center;
    font-family: Times;
    padding: 0px 30px 20px 30px;
    line-height: 20px;
    font-size: 11px; /* description font size*/
    color: #fff; /* description font colour*/
}

#quote {
    color: #000; /*quote font color*/
    font-family: Times;
    font-style: italic;
    margin-left:370px;
    font-size: 15px;
    margin-top:20px;
    text-align: center;
    width:230px;
}


 #credit {
position:fixed;
font-size:14px;
letter-spacing:1px;
right:10px;
bottom:15px;
}
#credit a {
padding:3px;
color:#000;
background-color:#ffffff;
}
#credit a:hover {
color:#ffffff;
background-color:#000;
}


</style>
</head>
<body>

<div id="container">

<div id="banner">

<div id="filter">

</div>

<div id="intro">INTR<br>
    ODUC<br>
     TION.
</div>
<div id="quote">Nicole. 20. Canada. Gryffindor</div>
<div id="description">

<!-- start of description -->

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque ut dui faucibus, tempor justo sit amet, convallis est. Vestibulum maximus blandit odio, eu porttitor justo accumsan nec. Vestibulum convallis arcu non malesuada suscipit. Integer varius nunc vitae ex imperdiet, id laoreet quam semper. Proin in cursus risus, vestibulum . Praesent vestibulum erat et fringilla gravida. Pelentesque ge lacus. why does maggie stiefvater postpone the release of the raven king ?? what have we done wrong i dont even sin that much </p>

</div>


  <div id="links">
        <a href="/" title="back to blog" class="link">●</a>
        <a href="/ask" title="ask" class="link">●</a>
       <a href="/tagged/TAG" title="a link to the artistic art aka ur selfies" class="link">●</a>
    </div>

</div>


</div>

<div id="credit"><a href="http://protectmccall.tumblr.com" title="code by protectmccall">©</a></div> <!--DONT TOUCH THIS BROS-->

</body>
</html>