about me page 01; by primrosetylers

<!DOCTYPE html>
<html>
<head>
<!---

about me page 01
coded by irma at primrosetylers.tumblr.com
do not steal, redistribute, or remove the credit

-->

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

<link href='http://fonts.googleapis.com/css?family=Carrois+Gothic+SC|Metrophobic' rel='stylesheet' type='text/css'> <!--GOOGLE FONT-->

<style type="text/css">

#everything {
    width:640px;
    margin-left:auto;
    margin-right:auto;
    padding-top:125px;
}


#images {
    margin-bottom:15px;
    text-align:center;
}

#ft {
    margin-top:-67px;
    position:absolute;
    width:0px;
    overflow:hidden;
    height:20px;
    font-family:'Metrophobic'; /*CHANGE THE FONT OF THE LINKS*/
    background-color:#ffff66; /*CHANGE THE COLOR OF THE LINK BACKGROUND*/
    color:transparent;
    text-transform:lowercase;
    opacity:0.8;
    -webkit-transition:0.5s;
    -moz-transition:0.5s;
    -o-transition:0.5s;
    -ms-transition:0.5s;
}

#image:hover #ft {
    width:104px;
    color:#000; /*CHANGE THE COLOR OF THE LINK TEXT*/
    -webkit-transition:0.5s;
    -moz-transition:0.5s;
    -o-transition:0.5s;
    -ms-transition:0.5s;
    opacity:1;
}

#image {
    display:inline-block;
    margin-left:20px;
    margin-right:20px;
}

img {
    height:100px;
    width:100px;
    padding:1px;
    border:1px solid #ffff66; /*CHANGE THE BORDER COLOR AROUND THE IMAGES*/
}

img:hover {
    opacity:0.8;
}

#info {
    margin-top:20px;
}

#title {
    font-size:50px;
    height:45px;
    line-height:58px;
    background-color:#ffff66; /*CHANGE THE COLOR OF THE TITLE BACKROUND*/
    width:425px;
    padding:5px;
    text-align:right;
    font-family:'Carrois Gothic SC';
    font-weight:bold;
}

#text {
    margin-left:10px;
    margin-bottom:10px;
    text-align:left;
    font-family:'Metrophobic'; /*CHANGE THE FONT OF THE TEXT*/
    width:640px;
    font-size:13px;
    line-height:110%;
    height:160px;
    overflow-y:auto;
}

#text a {
    text-decoration:none;
    color:#000; /*CHANGE THE COLOR OF A LINK IN THE TEXT BOX*/
    font-weight:bold;
}

#text a:hover {
    color:#ffff66; /*CHANGE THE COLOR OF A LINK IN THE TEXT BOX WHEN YOU HOVER*/
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

#credit {
    position:fixed;
    right:8px;
    bottom:8px;
}

#credit a {text-decoration:none; color:#000;
    -webkit-transition:0.5s;
    -moz-transition:0.5s;
    -ms-transition:0.5s;
    -o-transition:0.5s;
}
#credit a:hover {color:#ffff66;}


</style>

<body background="https://24.media.tumblr.com/88b9258779eb38d4ded379c50049ed9a/tumblr_n23pvlZnIR1sze9kyo4_r3_1280.png"> <!--if you'd like to change the background image, change what's in the quotes over there-->

<div id="everything">

<div id="images">

<!--FIRST LINK-->
<a href="/"> <!--change where the link leads-->
<div id="image">
<img src="http://25.media.tumblr.com/6f9b3b4f2c052d1bbae16c4d2026454b/tumblr_n1vji6zRR11rjunvyo2_250.gif" /> <!--change the image source-->
<div id="ft">home</div> <!--and change what the text when you hover reads-->
</div>
</a>
<!--FIRST LINK CODE END-->

<!--ANOTHER LINK-->
<a href="/ask"> <!--change the url-->
<div id="image">
<img src="http://25.media.tumblr.com/4db48997745cb3cdfb61f54610296dc4/tumblr_mwrkqfA9mu1srdb0to1_250.gif" />  <!--change the image-->
<div id="ft">ask</div> <!--change the text-->
</div>
</a>
<!--END-->

<!--ANOTHER LINK-->
<a href="http://tumblr.com/dashboard"> <!--change the url-->
<div id="image">
<img src="http://31.media.tumblr.com/c9a5a10a1bd04659758e47f21b884d97/tumblr_mwlglhSOkq1rje0wao3_250.gif" /> <!--change the image-->
<div id="ft">dash</div> <!--change the text-->
</div>
</a>
<!--END-->

<!--if you'd like to add another link, copy&paste the specified link code above here-->
</div>

<div id="info">
<div id="title">About Me</div> <!--your title-->

<div id="text">

<p>Here's where your text goes! Write whatever you want, and as much as you want. A handy-dandy scrollbar, like the one to the right, will appear if you use up your space. Use a p tag or a line break to go onto a new line. So here's a paragraph.</p>
<p>A new paragraph.</p>
<p>Another paragraph with a <br />
single line break here.
</p>
<p>You can also <b>bold,</b> <i>italic,</i> <u>and underline.</u> You can even <a href="http://SOMEURL.com">link!</a> (If you want to change the color of the link, search up "change the color of a link in the text box." If you want to change the look of other things, simply look up "change the" and you should be able to find all sorts of notes for changing colors, images, and fonts. And if you have trouble picking a color, go <a href="http://colorpicker.com">here!</a></p>
<p>Enjoy this page, lovelies. And follow the rules: don't steal, redistribute, or remove the credit. Thanks in advance.</p>

</div>
</div>
</div>

<div id="credit"><a title="credit" href="http://primrosetylers.tumblr.com">✿</a></div>

</body>
</html>