ABOUT PAGE #6

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


                ᴀʙᴏᴜᴛ ᴍᴇ ᴘᴀɢᴇ ᴍᴀᴅᴇ ʙʏ .ᴄʜʟᴏᴇ.
                [ʏᴏɴɢ.ᴄᴏ.ᴠᴜ] & [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: 1px; background-color:#fff;}

body {margin: 0px;overflow-x:hidden;}

a, a:link, a:visited, a:active {
        text-decoration: none;
        color:#777;
        -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:30px;
    width:590px;
    background:#f5f5f5;
    padding:20px 20px 15px 20px;
    float:center;
    position:relative;
    text-align:center;}

/*FIRST PICTURE*/

#firstpicture {
    position:absolute;
    margin-left:0px;
    height: 350px;
    width: 150px;
    border:2px solid #fff;
    /**********FIRST PICTURE***********/
    background:url('FIRST PICTURE 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;}

#titleabout {
    margin:auto;
    position:absolute;
    font:oblique bold 25px arial;
    color: #bfcdb9;
    margin-top: -100px;
    margin-left:0px;
    letter-spacing: 3px;
    width:430px;
    margin-left:610px;}

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

/*SECOND PICTURE*/

#ndpicture {
    margin-left:406px;
    height: 164px;
    width: 180px;
    border:2px solid #fff;
    margin-top:4px;
    /**********SECOND PICTURE***********/
    background:url('SECOND PICTURE 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;}

#ndtext {
    position:absolute;
    font:10px arial;
    letter-spacing:0px;
    text-align:justify;
    color: #999;
    margin-top: 4px;
    margin-left:158px;
    width:212px;
    height:137px;
    padding:15px;
    background:white;
    overflow:auto;
    border:1px solid #f4f4f4;}


#ndtitle {
    margin:auto;
    position:absolute;
    font:oblique bold 25px arial;
    color: #7598ab;
    margin-top: -60px;
    letter-spacing: 3px;
    width:390px;
    margin-left:-440px;}

#navbox {
    text-align:center;
    color: #999;
    margin-top: 4px;
    margin-left:0px;
    width:568px;
    height:65px;
    padding:10px;
    background:white;
    overflow:auto;
    border:1px solid #f4f4f4;}

#nav {width:560px;}
#nav a{
    font: bold oblique 8px arial;
    text-align:center;
    width: 75px;
    display: inline-block;
    padding: 2px 6px 2px 6px;
    color:#555;
    letter-spacing: 1px;
    background:#f5f5f5;}

#lasttitle {
    margin:auto;
    position:absolute;
    font:oblique bold 25px arial;
    color: #ffcc99;
    margin-top: -65px;
    margin-left:0px;
    letter-spacing: 3px;
    width:390px;
    margin-left:610px;}

#picrow {width:600px;margin-left:0px;}
#picrow img{
    display:inline-block;
    margin-right:10px;
    margin-top:5px;
    height: 105px;
    width: 106px;
    border:2px solid #fff;
    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;}

#links a {
    font: bold oblique 8px arial;
    text-align:center;
    width: 65px;
    margin-bottom:-10px;
    margin-top:10px;
    display: inline-block;
    padding: 3px 1px 3px 1px;
    color:#555;
    letter-spacing: 1px;
    background:#fff;}

#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="box">

<div id="firstpicture"></div>

<div id="firsttext">
<!--first text--->
TEXT HERE
</div>
<!--first title (for text)--->
<div id="titleabout">TITLE HERE
<div style="border-top:3px solid #f5f5f5;width:120px;margin-top:-15px;"></div></div>

<!---------------------------------------------------------------------->

<div id="ndtext">
<!--second text--->
TEXT HERE
</div>

<div id="ndpicture"></div>

<!---------------------------------------------------------------------->

<div id="navbox"><div id="nav">
<!--------CHANGE COLORS OF LINKS HERE--------->
<a href="/" style="background:#ddddcc">link</a>
<a href="/" style="background:#feebce">link</a>
<a href="/" style="background:#c6d7e1">link</a>
<a href="/" style="background:#ddddcc">link</a>
<a href="/" style="background:#feebce">link</a>
<a href="/" style="background:#c6d7e1">link</a>
<a href="/" style="background:#ddddcc">link</a>
<a href="/" style="background:#feebce">link</a>
<a href="/" style="background:#c6d7e1">link</a>
<a href="/" style="background:#ddddcc">link</a>
<a href="/" style="background:#feebce">link</a>
<a href="/" style="background:#c6d7e1">link</a>
<a href="/" style="background:#ddddcc">link</a>
<a href="/" style="background:#feebce">link</a>
<a href="/" style="background:#c6d7e1">link</a>
<a href="/" style="background:#ddddcc">link</a>
<a href="/" style="background:#feebce">link</a>
<a href="/" style="background:#c6d7e1">link</a>
</div></div>

<!--second title (for navi)--->
<div id="ndtitle">TITLE HERE
<div style="border-top:3px solid #f5f5f5;width:120px;margin-top:-15px;margin-left:300px;"></div></div>

<!---------------------------------------------------------------------->

<div id="picrow">
<img src="IMG ONE URL"><img src="IMG TWO URL"><img src="IMAGE THREE URL"><img src="IMG FOUR URL"><img src="IMG FIVE URL"></div>

<!--third title (for pictures)--->
 <div id="lasttitle">TITLE HERE
 <div style="border-top:3px solid #f5f5f5;width:120px;margin-top:-15px;"></div></div>

<!---------------------------------------------------------------------->

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

</div>

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