theme #11

<!DOCTYPE html>
<html lang="en">

<head>
<title>ABOUT</title>
<link rel="shortcut icon" href="{Favicon}" />

<link href='http://fonts.googleapis.com/css?family=Trocchi|Alegreya+SC|Vidaloka' rel='stylesheet' type='text/css'>

</head>
<style type="text/css">

body{
    background-color:white;
    font-family:times, serif;
    color:#333;
    text-align:justify;
    line-height:140%;
    font-size:10px;
    letter-spacing:0px;
}

a, a:visited, a:active{
    color:#73263C; /* LINK COLOUR */
    text-decoration:none;
    -webkit-transition:0.9s ease-in;
}

a:hover{
    color:#f2f2f2;
}

ul li{
    list-style-type:square;
    margin-left:-40px;
}

.top{
    margin:100px auto 30px;
    width:400px;
    position:relative;
}

.border{
    width:400px;
    border-bottom:1px double #f2f2f2;
    float:left;
    margin-top:-27px;
}

.img{
    background-color:white;
    z-index:100;
    border:1px solid #f2f2f2;
    margin:0px auto 0px;
    width:54px;
    height:54px;
}

.img img{
    height:40px;
    border:7px solid white;
    display:block;
}

/* text */

#container{
    width:500px;
    margin:0px auto 40px;
    padding:15px;
    border:1px solid #f2f2f2;
    background-color:white;
}

.s{
    float:left;
    font-size:30px;
    line-height:30px;
    padding:4px 6px 2px;
    background-color:#202020;
    color:white;
    text-transform:uppercase;
    margin-right:6px;
    margin-top:4px;
    font-family:'vidaloka';
}

.back{
    width:400px;
    margin:20px auto 0px;
    opacity:0.7;
    text-align:center;
    font-size:8px;
    font-family:cambria;
    text-transform:uppercase;
}

.back a{
    color:gray;
    padding:5px;
}

.t{
    font-size:8px;
    letter-spacing:1px;
    background-color:#202020;
    color:white;
    text-transform:uppercase;
    font-family:times;
    width:40px;
    text-align:center;
    padding:3px 5px 3px;
}

.links{
    text-transform:uppercase;
    letter-spacing:1px;
    font-size:8px;
    line-height:180%;
    font-family:;
    margin-left:10px;
}

.c{
    margin-top:10px;
    font-size:8px;
    letter-spacing:1px;
    text-transform:uppercase;
}

.currently{
    padding:5px 5px 4px;
    font-style:italic;
    margin-right:10px;
    background-color:#202020;
    color:white;
    width:110px;
    text-align:right;
    margin-top:1px;
}

#theme{
    position:fixed;
    bottom:10px;
    right:10px;
    -webkit-border-radius:100px;
    padding:2px 4px 2px;
    text-transform:uppercase;
    -webkit-transition:0.6s ease-in;
    cursor:default;
    font-size:8px;
}

#theme:hover{
    background-color:black;
    color:white;
}

</style>
<body>

    <div class="top">
    <div class="img"><img src="{PortraitURL-40}" /></div>
    <div class="border"></div>
    </div>

<div id="container">

    <div class="s">A</div> <!-- you can delete this if you want -->
    merican Beauty:
    I had always heard your entire life flashes in front of your eyes the second before you die. First of all, that one second isn't a second at all, it stretches on forever, like an ocean of time... For me, it was lying on my back at Boy Scout camp, watching falling stars... And yellow leaves, from the maple trees, that lined our street... Or my grandmother's hands, and the way her skin seemed like paper... And the first time I saw my cousin Tony's brand new Firebird... And Janie... And Janie... And... Carolyn. I guess I could be pretty pissed off about what happened to me... but it's hard to stay mad, when there's so much beauty in the world. Sometimes I feel like I'm seeing it all at once, and it's too much, my heart fills up like a balloon that's about to burst... And then I remember to relax, and stop trying to hold on to it, and then it flows through me like rain and I can't feel anything but gratitude for every single moment of my stupid little life... You have no idea what I'm talking about, I'm sure. But don't worry... you will someday.

    <br><br>


    <table>
    <tr>
    <td style="background-color:#202020"><div class="t">THINGS I BLOG ABOUT</div></td>

    <td><div class="links">

    in here come the things you want people to easily have access to.

    </div></td>
    </tr>
    </table>


<div class="c">

    <table>
    <tr>
    <td><div class="currently">currently WATCHING:</div></td>
    <td><ul>
        <li>TV SHOW</li>
        <li>etc</li>
        <li>etc</li>
    </ul></td>
    </tr>

    <tr>
    <td><div class="currently">currently READING:</div></td>
    <td><ul>
        <li>BOOK/FANFICTION/WHATEVER</li>
        <li>etc</li>
        <li>etc</li>
    </ul></td>
    </tr>
    </table>

</div>

</div>

<div class="back"><a href="/">back</a></div>

<a href="http://crimical.tumblr.com/"><div id="theme">t.</div></a>

</body>
</html>