[Page] → About Me #02

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>

<!--
THEME: ABOUT ME PAGE #02
BY: jyuubi.org / manatopia.org

Please do not redistribute or use to make your own!
You may edit whatever you please, but leave credit.

YOU MAY REMOVE MORTGRAPHICS CREDIT IF YOU DO NOT USE THE IMAGE.
BUT KEEP IF YOU DO!

[credit] mortgraphics.livejournal.com
-->

<head>
<link href='http://fonts.googleapis.com/css?family=Felipa' rel='stylesheet' type='text/css'>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>{Title}</title>
<link rel="shortcut icon" href="{Favicon}">

<style type="text/css">
/* BODY */
body {
background-image: url('http://s5.postimage.org/obbpc9fxz/aboutpage02_bg.png');
background-attachment: fixed;
background-color: #f4f3ef;
}

#container {
margin-left: 80px;
margin-top: 50px;
}

/* LEFT IMAGES */
#images {
width: 100px;
position: fixed;
z-index: 999;
}

#images img {
width: 80px;
height: 80px;
border: 10px solid #d0e0e8;
margin-bottom: 10px;
}

/* MAIN HEADER */
#header {
background-color: #eaecef;
position: fixed;
height: 40px;
width: 320px;
padding-right: 10px;
margin-left: 100px;
margin-top: 30px;
font-family: 'Felipa', cursive;
font-size: 16px;
color: #79a58a;
letter-spacing: 2px;
line-height: 40px;
text-align: right;
}

/* INFORMATION */
#info {
width: 290px;
position: fixed;
margin-left: 120px;
margin-top: 90px;
font-family: calibri;
font-size: 10px;
color: #82858a;
letter-spacing: 1px;
text-align: justify;
}

#info b, strong {
color: #c9a2c5;
}

#info i, em {
color: #e2987b;
}

#info a {
color: #7eb0c7;
text-decoration: none;
}

#info h1 {
font-family: consolas;
font-size: 12px;
color: #79a58a;
text-transform: uppercase;
height: 14px;
display: block;
line-height: 15px;
text-align: left;
letter-spacing: 1px;
font-weight: normal;
margin-bottom: 5px;
margin-top: 20px;
}

/* CREDITS */
#credit {
position: fixed;
bottom: 10px;
right: 10px;
font-family: calibri;
font-size: 9px;
text-transform: uppercase;
text-align: right;
letter-spacing: 1px;
}

#credit a {
color: #79a58a;
text-decoration: none;
}
</style>
</head>
<body>

<div id="container">

<!-- THREE IMAGES -->
<div id="images">
<img src="http://s5.postimage.org/r6osj4jxv/aboutpage02_icon1.jpg"><br />
<img src="http://s5.postimage.org/j2goedxir/aboutpage02_icon2.jpg"><br />
<img src="http://s5.postimage.org/5zl1v47ar/aboutpage02_icon3.jpg"><br />
</div>
<!-- THREE IMAGES -->

<!-- HEADER -->
<div id="header">about yours truly</div>
<!-- HEADER -->

<!-- INFORMATION -->
<div id="info">
INFORMATION GOES HERE!
</div>
<!-- INFORMATION -->

</div>

<div id="credit">
<a href="/">Go home?</a><br />
<!-- DO NOT REMOVE OR EDIT -->
<a href="http://jyuubi.org">&copy; jyuubi.org</a><br />
<!-- MORTGRAPHICS CREDIT -->
<a href="http://mortgraphics.livejournal.com">&copy; mortgraphics</a>
</div>

</body>
</html>