ABOUT PAGE #5

<!---------------------------------------------------------------------


                ᴀʙᴏᴜᴛ ᴍᴇ ᴘᴀɢᴇ ᴍᴀᴅᴇ ʙʏ .ᴄʜʟᴏᴇ.
                [ʏᴏɴɢ.ᴄᴏ.ᴠᴜ] & [sᴏᴏɴᴊᴜɴs.ᴛᴜᴍʙʟʀ.ᴄᴏᴍ]
                ᴛʜᴇᴍᴇs ᴄᴀɴ ʙᴇ ғᴏᴜɴᴅ ᴀᴛ
                [sᴏᴏɴᴊᴜɴᴛʜᴇᴍᴇs.ᴛᴜᴍʙʟʀ.ᴄᴏᴍ]
                ᴘʟᴇᴀsᴇ ʟᴇᴀᴠᴇ ᴛʜᴇ ᴄʀᴇᴅɪᴛ ᴏɴ ᴛʜᴇ ᴛʜᴇᴍᴇ.
                ɪғ ʏᴏᴜ ʜᴀᴠᴇ ᴀɴʏ ǫᴜᴇsᴛɪᴏɴs ᴄᴏᴍᴇ ᴀsᴋ.


---------------------------------------------------------------------->

<html>
<head>
<title>{Title}</title>
<link rel="shortcut icon" href="{Favicon}">
<link rel="altertnate" type="application/rss+xml" href="{RSS}">
<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="http://static.tumblr.com/7qjmkr5/IUmmdsy41/jquery.style-my-tooltips.js"></script>
<script>
    (function($){
        $(document).ready(function(){
            $("[title]").style_my_tooltips();
        });
    })(jQuery);
</script>

<style type="text/css">

#s-m-t-tooltip {
    display: block;
    background: #111;
    font-size: 8px;
    font-family: calibri;
    letter-spacing: 1px;
    text-transform: uppercase;
    line-height:100%;
    color: #fff;
    text-align: center;
    margin-left: 18px;
    padding:3px;
    min-width: 40px;
    max-width: 200px;
    z-index: 99;}

::-webkit-scrollbar-thumb:vertical{background-color: #f6f6f6;}
::-webkit-scrollbar {width: 7px; background-color:#fff;}

body {background-color: #f6f6f6;margin: 0px;}

a:link, a:visited, a:active {
        text-decoration: none;
        -webkit-transition: all 0.7s ease-in-out;
        -moz-transition: all 0.7s ease-in-out;
        -o-transition: all 0.7s ease-in-out;
        -ms-transition: all 0.7s ease-in-out;
        transition: all 0.7s ease-in-out;}

a:hover {-webkit-transition: all 0.7s ease-in-out;
        -moz-transition: all 0.7s ease-in-out;
        -o-transition: all 0.7s ease-in-out;
        -ms-transition: all 0.7s ease-in-out;
        transition: all 0.7s ease-in-out;}

#box{
    margin-left:auto;
    margin-right:auto;
    margin-top:130px;
    width:430px;
    float:center;
    background:white;
    position:relative;
    text-align:center;}

#picture {
    position:absolute;
    margin-left:0px;
    height: 220px;
    width: 210px;
    /*picture one*/
    background:url('IMG URL');
    background-position:center;
    background-size:cover;
    text-align: center;
    z-index:9;
    -webkit-transition: all 0.9s ease-in-out;
    -moz-transition: all 0.9s ease-in-out;
    -o-transition: all 0.9s ease-in-out;
    -ms-transition: all 0.9s ease-in-out;
    transition: all 0.9s ease-in-out;}

#picture2 {
    margin-left:220px;
    height: 220px;
    width: 210px;
    /*picture two*/
    background:url('IMG URL');
    background-position:center;
    background-size:cover;
    text-align: center;
    z-index:999;
    -webkit-transition: all 0.9s ease-in-out;
    -moz-transition: all 0.9s ease-in-out;
    -o-transition: all 0.9s ease-in-out;
    -ms-transition: all 0.9s ease-in-out;
    transition: all 0.9s ease-in-out;}

#mainpicture {
    position:absolute;
    margin-left:0px;
    opacity:0;
    height: 220px;
    width: 430px;
    /*big picture*/
    background:url('IMG URL');
    background-position:center;
    background-size:cover;
    text-align: center;
    z-index:999;
    -webkit-transition: all 0.9s ease-in-out;
    -moz-transition: all 0.9s ease-in-out;
    -o-transition: all 0.9s ease-in-out;
    -ms-transition: all 0.9s ease-in-out;
    transition: all 0.9s ease-in-out;}

#box:hover #picture {margin-left:220px;}
#box:hover #picture2 {margin-left:0px;}
#box:hover #mainpicture {opacity:1;}

#title {
    margin:auto;
    font:oblique bold 35px arial;
    color: #ffe0c7;
    margin-top: -5px;
    margin-left:0px;
    letter-spacing: 3px;
    width:400px;}

#text {
    font:10px georgia;
    letter-spacing:0px;
    text-align:justify;
    color: #999;
    margin-top: 0px;
    margin-left:0px;
    width:400px;
    height:auto;
    padding:15px;
    background:white;
    overflow:auto;
    border-bottom:1px solid #f4f4f4;}

#box a {
    font: bold oblique 8px arial;
    text-align:center;
    width: 65px;
    margin-bottom:5px;
    display: inline-block;
    padding: 3px 1px 3px 1px;
    color: #777;
    letter-spacing: 1px;}

#picture a:hover {background-color: #333;text-shadow: 1px 1px 0px #777;}

#line {width:430px;margin:auto;background:#feead9;background-position:center;background-size:cover;height:15px;}

#cr {font-size:9px;font-family:arial;text-align:center;padding: 4px;z-index:99999;position:fixed;top:5px;left:5px;color:#888;}
#cr a {color:#333;}

</style>
</head>

<body>
<div id="line"></div>

<div id="box">
<div id="mainpicture"></div>
<div id="picture"></div>
<div id="picture2"></div>
<div id="text">
<!--title--->
<div id="title">TITLE HERE</div>
<!--text--->
TEXT HERE </div>

<!--links--->
<a href="/">home</a>
<a href="/ask">message</a>
<!--extra link--->
<a href="URL">link</a>
</div>


</body>
<div id="cr" title="theme by soonjun"><a href="http://soon-co.tumblr.com/">©</a></div>
</html>