007 WINDOWDIPPER - 3rd All in One Page

<!--                           ≧◠ᴥ◠≦
                        ᴡɪɴᴅᴏᴡᴅɪᴘᴘᴇʀ ʙʏ ʏᴏᴏɴᴏʀᴀ
                          3ʀᴅ ᴀʟʟ ɪɴ ᴏɴᴇ ᴘᴀɢᴇ

                          ʟᴇᴛs ᴋᴇᴇᴘ ɪᴛ sɪᴍᴘʟᴇ.

               ᴅᴏ ɴ̲ᴏ̲ᴛ̲ sᴛᴇᴀʟ ᴀɴʏᴛʜɪɴɢ ғʀᴏᴍ ᴛʜᴇ ᴄᴏᴅᴇ. Iғ ʏᴏᴜ
               ᴀʀᴇ ᴄᴜʀɪᴏᴜs ɪɴ ʜᴏᴡ sᴏᴍᴇᴛʜɪɴɢ ᴡᴏʀᴋs, ᴊᴜsᴛ ɢᴏ
                             ᴀɴᴅ ᴀsᴋ ᴍᴇ.

                       ᴅᴏ ɴ̲ᴏ̲ᴛ̲ ᴄʟᴀɪᴍ ɪᴛ ᴀs ʏᴏᴜʀs.
                       ᴅᴏ ɴ̲ᴏ̲ᴛ̲ ʀᴇᴍᴏᴠᴇ ᴛʜᴇ ᴄʀᴇᴅɪᴛ.
                        ᴅᴏ ɴ̲ᴏ̲ᴛ̲ ᴜsᴇ ɪᴛ ᴀs ᴀ ʙᴀsᴇ
                           ᴛʜᴀɴᴋs ≧◠ᴥ◠≦

         ――――――――――――ɴᴏᴡ ᴄᴏɴᴛɪɴᴜᴇ ᴇɴᴊᴏʏɪɴɢ ᴍʏ ᴘᴀɢᴇ――――――――――――

-->
<html><head>
<title>—{name}'s about—</title>
<link rel="shortcut icon" href="http://media.tumblr.com/5e80f3d03645344fe772486f120d4685/tumblr_inline_mzexh1gW011r9aaeq.png">


<link href="http://static.tumblr.com/gwqfuw7/F7wnjxtat/w.css" rel="stylesheet">

<link href="http://static.tumblr.com/l9mi3bq/7F5njbhlz/a.css"rel="stylesheet">
<link href="http://static.tumblr.com/l9mi3bq/pnNnjbe16/d.css" rel="stylesheet">

<script type="text/javascript" src="http://static.tumblr.com/d0qlne1/DiAl6ekb7/jquery-1.4.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>

<script type="text/javascript">
function GetClock(){
var d=new Date();
var nhour=d.getHours(),nmin=d.getMinutes(),ap;
     if(nhour==0){ap=" AM";nhour=12;}
else if(nhour<12){ap=" AM";}
else if(nhour==12){ap=" PM";}
else if(nhour>12){ap=" PM";nhour-=12;}

if(nmin<=9) nmin="0"+nmin;

document.getElementById('clockbox').innerHTML=""+nhour+":"+nmin+ap+"";
}

window.onload=function(){
GetClock();
setInterval(GetClock,1000);
}
</script>

<script src="http://code.jquery.com/jquery-1.10.0.min.js">
</script>
<script>
$(document).ready(function(){

 $(".one").click(function(){
  $(".1").fadeIn();
    $(".2,.3,.4,.5").fadeOut();
 });

  $(".two").click(function(){
    $(".2").fadeIn();
    $(".1,.3,.4,.5").fadeOut();
  });
  $(".three").click(function(){
    $(".3").fadeIn();
    $(".1,.2,.4,.5").fadeOut();
  });
  $(".four").click(function(){
    $(".4").fadeIn();
    $(".1,.2,.3,.5").fadeOut();
  });
  $(".five").click(function(){
    $(".5").fadeIn();
    $(".1,.2,.3,.4").fadeOut();
  });
});
</script>

<style type="text/css">

::-webkit-scrollbar-thumb:vertical {
background-color:#6792ea;
border: 2px solid #fefefe;
}

::-webkit-scrollbar {
background:#69c8bc;
border: 4.5px solid #fefefe;
}

#s-m-t-tooltip {
color:#00aa93;
background-color:#fefefe;
border:1px solid #ff277a;
}

body {
background:#fefefe url('https://31.media.tumblr.com/5735ea8964a1d4542dd3233f9535036e/tumblr_inline_nhev61eXnN1sk4wb3.png') repeat fixed;
}

/*--This is where you change the appearance of the links--*/
a {
color:#69c8bc;
font-family:courier;
font-size:10px;
}


/*---
     MAIN MENU
---*/

/*---THIS IS YOUR BOTTOM BAR WHERE THE CLOCK IS---*/

.bottom_bar{
background:#fafafa;
border-color:#acdada; /*---THE COLOR FOR THE BORDER SHOULD BE THE SAME AS THE BACKGROUND OF THE #clock FOR IT TO LOOK LIKE IF IT'S CONNECTED---*/
}

#clock{
background:#acdada; /*--THIS SHOULD BE THE SAME COLOR AS THE "border-color" ABOVE --*/
color:#b5ced2;
}

#v{
background:#fff;/*---BACKGROUND COLOR OF THE CLOCK---*/
}

#link_one, #link_two{
border-color:#f997a4; /*--BORDER COLOR OF THE LITTLE LINK CIRCLES--*/
background:#fefefe;/*--BACKGROUND COLOR OF THE LITTLE LINK CIRCLES----*/
}


/*--THIS IS THE BACKGROUND WHEN YOU CLICK ON THE RECTANGLES, YOU CAN LEAVE IT LIKE THAT, OR DELETE THE LINK AND PUT YOUR OWN BACKGROUND, IF YOU DON'T WANT AN IMAGE, DELETE THE LINK AND TYPE THE HEX COLOR OF YOUR LIKING :)--*/
#a{
background:#fefefe url('https://31.media.tumblr.com/be6ef1afcf92ce3a9a46c2eb4e2faf4a/tumblr_inline_nj9zqrz0pv1sk4wb3.png');
}

/*---THIS IS THE BOTTOM BAR WHEN YOU CLICK ON THE BUTTONS---*/

#bottoms{
background:#fafafa; /*--BACKGROUND COLOR OF THE RECTANGLE--*/
border-color:#acdada; /*--BORDER COLOR OF THE BOTTOM RECTANGLE--*/
}

#bottoms a{
background:#fff; /*--BACKGROUND COLOR OF THE BOTTOM LINK--*/
border-color:#f28aa4;/*--BORDER COLOR OF THE BOTTOM LINK--*/
}

/*--
    FLOATING RECTANGLES
--*/

/*--THIS IS WHERE YOU EDIT THE RECTANGLES THAT CONTAIN THE IMAGES--*/

#tiny_box{
border:7px solid #fcdfd9;/*--BORDER COLOR OF THE RECTANGLE--*/
}

#inside{
color:#f997a4; /*--COLOR OF THE FIRST WORD: EXAMPLE: ABOUT--*/
}
#inside i{
color:#acdada;/*--COLOR OF THE SECOND WORD: EXAMPLE: ME--*/
}


/*--
     ABOUT
--*/

#about{
background:#fefefe; /*--BACKGROUND COLOR OF THE ABOUT BOX--*/
border-color:#f28aa4;/*--BORDER COLOR OF THE ABOUT BOX--*/
}

#side_title a{
color:#69c8bc;/*--COLOR OF THE SIDETITLE--*/
}

#sideb{
border-color:#bddcdb;/*--border color of the icon/ little box--*/
background:#fefefe;/*--background color of the icon/ little box--*/
}
#sideb img{
border-color:#6792ea;/*--border color of the icon image--*/
}

#si_de b{
background:#bddcdb;/*--background color of the name/age/location/likes--*/
}

#si_de code{
background:#e6d581;/*--background color of the : --*/
}

#si_de i{
background:#9393d7;/*--background color of the response to the age/location--*/
}

#tiny_links{
background:#f28aa4;/*--background color of the container of the links--*/
}


#tiny_links a{
color:#000;/*--color of the tiny links--*/
background:#fff;
}

a.before:before,a.after:after{
background:#b0d2b7;/*--color of the borders when you hover over the tiny links--*/
}

#sq_s{
border-color:#e6d581;/*--border color of the little side image on the top right corner--*/
}


/*--
      TAGLIST
--*/

#taglist{
background:#fff;
border-color:#b0e1db;/*--border color of the taglist container--*/
}

#tags a{
background:#fff;/*--background of the tag--*/
color:#000;/*--text color of the tag--*/
border-color:#b2aee0;/*--border color of the tag--*/
}

#tags a:hover{
background:#f3f8ff;/*--background color when you hover over the tag--*/
}

.tag_title{
color:#fff;/*--text color of the tag title--*/
background:#f2dce8;/*--background color of the tag title--*/
}

/*--
     BLOGROLL
--*/

#blogroll{
background:#fff;/*--background color of the blogroll container where the people that you follow appears--*/
border-color#9393d7;/*--border color of the blogroll container--*/
}

/*--tip:
the circle that is inside in the blogroll, is the icon of the blog that you follow--*/

#box{
border-color:#69c8bc;/*--border color of the circle in the blogroll--*/
background:#fff;/*--background of the circle in the blogroll--*/
}

#link a{
color:#000;/*--text color of the circle when you hover over the icon--*/
background:#ecb78b;/*--background color of the circle when you hover--*/
}

/*--SECOND PART OF THE BLOGROLL EDITING--*/

#fri{
background:#fff;/*--background of the container of the bias/friends--*/
border-color:#FDC68A;/*---border color of the container-*/
}

/*--for this, the only thing you need to do is to change both of the background colors to give it the effect :> --*/

li:nth-child(odd) {
background:#ECCDFA;/*--background color of one of the friends/bias--*/
}
 li:nth-child(even) {
background:#CDFAEC;/*--background color of the second container of the friends/bias--*/
}

#friend{
border-color:000;/*--this is the border color of the friends/bias--*/
}

#friend a{
color:#000;/*--color of the text/link of your friend or bias--*/
}

/*--THIRD PART OF THE BLOGROLL EDITING--*/

/*--for this to have that effect that it shows, you need to change the borders to the colors of the containers, for example, the "border-right" is actually the color to match the "#fri", and the "border-left" matches the "#blogroll"
it is not necessary but it has a nice effect :>
--*/

#bl_ico{
border-top:5px solid #ffc4cc;
border-right:5px solid #FDC68A;
border-left:5px solid #9393d7;
}

/*--this for it to have the effect, you just have to put the same color as "border-top" which is above--*/

#bl_ico img{
background:#fff;/*--background of the image-icon--*/
border:5px solid #ffc4cc;
}

/*--
     ASK + FAQ
--*/

/*--You're almost done! Wonderful! Now for this last part of the page, there's nothing especial to it, just editing colors, however, when you see the ask and it says that "there's nothing here," don't worry, it does work and you do not need to change anything :> --*/

#f{
border-color:#fcdfd9;/*--border color of the sidebar--*/
}

#faq{
background:#fff;/*--background color of the FAQ container--*/
border-color:#ecb78b;/*--border color of the FAQ--*/
}

/*--To not raise confusion, the "#faq h8" is the question and the "#faq h9"
is the answer--*/

#faq h8{
background:#f28aa4;/*--background color of the question--*/
border-left:10px solid #69c8bc;/*--color of the little box on the left--*/
}

#faq h9{
background:#e6d581;/*--background color of the answer--*/
border-right:10px solid #9393d7;/*--color of the little box on the right--*/
}

#askbox{
background:#fff;/*--background color of the askbox--*/
border-color:#9393d7;/*--border color of the askbox--*/
}

/*--You're done! Congrats!! This was a big page to edit and you've done it!
╭ (oㅇ‿ o#)ᕗ
--*/

/*----*/
</style>
</head>
<body onkeydown="return false">

<!--DO NOT MESS WITH THE THINGS BELOW -->
<div id="w"></div>
<div class="bottom_bar">
<div id="clock"><div id="v"><div id="clockbox"></div></div></div>
<a href="/"><span id="link_one">
<img src="https://31.media.tumblr.com/62e54dd8858773d6f72d73fcebb56bec/tumblr_inline_nj9r1ph9kV1sk4wb3.png"></span></a>
<a href="/ask"><span id="link_two">
<img src="https://31.media.tumblr.com/ae6f893ff334255b34b1df467fb60fe7/tumblr_inline_nj9r21ItKX1sk4wb3.png"></span></a>
</div>
<!--DO NOT MESS WITH THE THINGS ABOVE -->

<!---->
<div class="5"style="display:block;">
<div id="menu">

<!--   PART 1/5

    Hello! This is going to be a tough page to edit, so that's
    why I am here for. To change the images of the rectangles,
    you need just to delete the link that is between the
    parenthesis, example:

background-image:url('http://40.media.tumblr.com/b4dd9a1c3452642fa1eff745191c044d/tumblr_nd0mv3kurv1rppazbo2_1280.jpg');

     ↓↓↓↓↓↓

background-image:url('');

   !!! be sure to not delete the ' ' or when you put the image
   that you want, it will not work. !!!

   Now with that, you should do the thing with every number,
   as you can see, they are numbered, so it will be easier for
   you to track, good luck! :>

-->

<!--this rectangle is the one in the top-left corner-->
<a class="one" href="#">
<div style="background-image:url('http://40.media.tumblr.com/b4dd9a1c3452642fa1eff745191c044d/tumblr_nd0mv3kurv1rppazbo2_1280.jpg');" id="tiny_box">
<div id="inside">about <br><i>me</i> </div>
</div></a>

<!--this rectangle is on the top-right corner-->
<a class="two" href="#">
<div style="background-image:url('http://40.media.tumblr.com/aa7f037362f035f9e046bd72e2b11c00/tumblr_nd0mv3kurv1rppazbo1_1280.jpg');"id="tiny_box">
<div id="inside">tag <br><i>list</i> </div>
</div></a>

<!--this rectangle is on the bottom-left corner-->
<a class="three" href="#">
<div style="background-image:url('http://40.media.tumblr.com/b6469ea763d43628029a65dfc6527cc3/tumblr_nfizfsbPIU1rppazbo3_1280.jpg');" id="tiny_box">
<div id="inside">blog <br><i>roll</i> </div>
</div></a>

<!--this rectangle is on the bottom-right corner-->
<a class="four" href="#">
<div style="background-image:url('http://40.media.tumblr.com/bc740694811900cea8a05073cf02baaa/tumblr_newn8tiHcR1rppazbo2_1280.jpg');"id="tiny_box">
<div id="inside">ask <br><i>box</i> </div>
</div></a>

</div></div>

<!--You have finished part 1 of the page! Congrats! Now take a little
break and continue later with part 2! ヾ（ ❀◕◡◕ฺฺ ）ノ->


<!--   PART 2/5

    Please follow instructions below for better understanding ↓↓↓↓↓↓

    ****Everytime you see this: "<div class="1" style="display:none;">,
    the display will always say "none" however if you want to see what
    you are editing without having to click the link each time you
    update the preview, be sure to change the "none" to "block"

    !!!!HOWEVER!!!! BE SURE TO CHANGE IT BACK TO "none" OR THE PAGE WILL
    STAY LIKE THAT AND YOU WILL NOT BE ABLE TO CLICK THROUGH THE PARTS.
    This is really important!! Be sure not to forget :>

-->

<div class="1"style="display:none;">

<!--DO NOT DELETE/ALTER-->
<div id="a"></div>
<div id="bottoms">
<a class="five" href="#">main menu</a><a class="two" href="#">next</a></div>
<!--DO NOT DELETE/ALTER-->


<div id="ab">

<!--This is where you change the sidebar image of your about page-->
<div id="sq_s"style="background-image:url('http://41.media.tumblr.com/f30b7ab7005fa6998d3b2b58ff15611d/tumblr_nclfkxmd2s1rppazbo4_1280.jpg');"></div>

<!--Here is where you change the title-->
<div id="side_title"><a href="/">Tired of waiting</a></div>

<div id="sideb">

<!--This is a really tricky part, so be sure to follow the instructions below
******To change your name/age/location/likes just delete the text that
is spaced, for example, delete the text "dolce" and "17" and just
replace it with your own.

!!!!!!!IN THE LIKES, be sure to not write a lot!! Even if you are really
cute and cool, there will be no space :c
-->

<div id="si_de">
<b>name</b><code>:</code><i>   dolce    </i><br>
<b>age</b><code>:</code><i>   17    </i><br>
<b>location</b><code>:</code><i>  usa   </i><br>
<b>likes</b><code>:</code><i>    gummy candy, and kpop   </i>
</div>
<img src="{PortraitURL-128}"></div>


<!--This is the little links on the side of the about, be sure to not
have long links or it will look odd
-->
<div id="tiny_links">
<a class="eigth before after"href="/">link 1</a>

<a class="eigth before after"href="/">link 2</a>
</div>


<div id="about">
<p>All art displayed in this page was made by tumblr user <a href="http://milkyema.tumblr.com/"target="_blank">milkyema</a>.</p>
<p>Far far away, behind the word mountains, far from the countries Vokalia and Consonantia, there live the blind texts. Separated they live in Bookmarksgrove right at the coast of the Semantics, a large language ocean. </p>

<p>A small river named Duden flows by their place and supplies it with the necessary regelialia. It is a paradisematic country, in which roasted parts of sentences fly into your mouth. Even the all-powerful Pointing has no control about the blind texts it is an almost unorthographic life One day however a small line of blind text by the name of Lorem Ipsum decided to leave for the far World of Grammar. The Big Oxmox advised her not to do so, because there were thousands of bad Commas, wild Question Marks and devious Semikoli, but the Little Blind Text didn’t listen. </p>

<p>She packed her seven versalia, put her initial into the belt and made herself on the way. When she reached the first hills of the Italic Mountains, she had a last view back on the skyline of her hometown Bookmarksgrove, the headline of Alphabet Village and the subline of her own road, the Line Lane. Pityful a rethoric question ran over her cheek, then she continued her way. On her way she met a copy. The copy warned the Little Blind Text, that where it came from it would have been rewritten a thousand times and everything that was left from its origin would be the word "and" and the Little Blind Text should turn around and return to its own, safe country. </p>

<p>But nothing the copy said could convince her and so it didn’t take long until a few insidious Copy Writers ambushed her, made her drunk with Longe and Parole and dragged her into their agency, where they abused her for their projects again and again. And if she hasn’t been rewritten, then they are still using her.Far far away, behind the word mountains, far from the countries Vokalia and Consonantia, there live the blind texts. Separated they live in Bookmarksgrove right at the coast of the Semantics, a large language ocean. A small river named Duden flows by their place and supplies it with the necessary regelialia. It is a paradisematic country, in which roasted parts of sentences fly into your mouth. Even the all-powerful Pointing has no control about the blind texts it is an almost unorthographic life One</p>
</div></div>
</div>


<!--You have finished part 2 of the page! Congrats! Now take a little
break and continue later with part 3! ヾ（*⌒ヮ⌒*）ゞ-->


<!--   PART 3/5

   For this part you don't really need to do much since is just the
   taglist, but I need to repeat some of the essential instructions:

   be sure to change the "display:none;" to "display:block;"
   for you to see the taglist and for you to edit it, just be sure
   to change it back to "display:none;" when you finish or you
   will not be able to click through the parts.

   Now continue with the part 3, good luck! :>

-->

<div class="2"style="display:none;">

<!--DO NOT DELETE/ALTER-->
<div id="a"></div>
<div id="bottoms">
<a class="five" href="#">main menu</a><a class="three" href="#">next</a></div>
<!--DO NOT DELETE/ALTER-->


<div id="taglist">
<center>

<div id="tags">
<div class="tag_title">tag title</div>
<li><a href="/tagged/"target="_blank">tag</a></li>
<li><a href="/tagged/"target="_blank">tag</a></li>
<li><a href="/tagged/"target="_blank">tag</a></li>
<li><a href="/tagged/"target="_blank">tag</a></li>
<li><a href="/tagged/"target="_blank">tag</a></li>
<li><a href="/tagged/"target="_blank">tag</a></li>
<li><a href="/tagged/"target="_blank">tag</a></li>
<li><a href="/tagged/"target="_blank">tag</a></li>
</div>


<div id="tags">
<div class="tag_title">tag title</div>
<li><a href="/tagged/"target="_blank">tag</a></li>
<li><a href="/tagged/"target="_blank">tag</a></li>
<li><a href="/tagged/"target="_blank">tag</a></li>
<li><a href="/tagged/"target="_blank">tag</a></li>
</div>

<div id="tags">
<div class="tag_title">tag title</div>
<li><a href="/tagged/"target="_blank">tag</a></li>
<li><a href="/tagged/"target="_blank">tag</a></li>
<li><a href="/tagged/"target="_blank">tag</a></li>
<li><a href="/tagged/"target="_blank">tag</a></li>
<li><a href="/tagged/"target="_blank">tag</a></li>
<li><a href="/tagged/"target="_blank">tag</a></li>
<li><a href="/tagged/"target="_blank">tag</a></li>
<li><a href="/tagged/"target="_blank">tag</a></li>
<li><a href="/tagged/"target="_blank">tag</a></li>
<li><a href="/tagged/"target="_blank">tag</a></li>
<li><a href="/tagged/"target="_blank">tag</a></li>
<li><a href="/tagged/"target="_blank">tag</a></li>
<li><a href="/tagged/"target="_blank">tag</a></li>
</div>

<div id="tags">
<div class="tag_title">tag title</div>
<li><a href="/tagged/"target="_blank">tag</a></li>
<li><a href="/tagged/"target="_blank">tag</a></li>
<li><a href="/tagged/"target="_blank">tag</a></li>
<li><a href="/tagged/"target="_blank">tag</a></li>
<li><a href="/tagged/"target="_blank">tag</a></li>
<li><a href="/tagged/"target="_blank">tag</a></li>
<li><a href="/tagged/"target="_blank">tag</a></li>
<li><a href="/tagged/"target="_blank">tag</a></li>
<li><a href="/tagged/"target="_blank">tag</a></li>
</div>
</center>
</div>
</div>

<!--You have finished part 3 of the page! Congrats!You are almost done!
Be strong! Now continue with part 4! o͡͡͡͡͡͡͡͡͡͡͡͡͡͡╮(｡❛ᴗ❛｡)╭o͡͡͡͡͡͡͡͡͡͡͡͡͡͡-->

<!--    PART 4/5

    This part is one of the most stressful parts of the page,
    but I will help you go through it.

    For this, the only thing that you will be editing, will
    be the friends/bias. The good thing about this, is that
    you can add as much boxes as you wish, or you can delete
    some boxes that you don't need, just be sure to delete
    the right box or something will go wrong.

    Probably you already know about the "display", and if
    not go back to part 2, which I explain how the thing
    works.

    Now, good luck! :>

-->

<div class="3"style="display:none;">

<!--DO NOT DELETE/ALTER-->
<div id="a"></div>
<div id="bottoms">
<a class="five" href="#">main menu</a><a class="four" href="#">next</a></div>
<!--DO NOT DELETE/ALTER-->

<div id="bl">
<div id="bl_ico"><img src="{PortraitURL-128}"></div>
<div id="fri">
<ul>

<!--The basic instructions for the below boxes, are just to change
    the image link to your desired image, it will automatically
    change to 50px. I cannot make it bigger, so I am sorry :c

    Now the next thing is pretty self explanatory :>

    But if you want to add more boxes, be sure to include the
    <li> or something weird will happen. If you wanna see what
    will happen, feel free to delete it, but I assure you it's
    not going to be cute.

    If you want to delete boxes, be sure to delete the <li> and
    </li>. Just be sure to delete all the content that <li> has
    inside. :)
-->

<li><div id="friend">
<img align="left" src="https://31.media.tumblr.com/8fd2f46c7c5ebbc15dae5d1018a1f674/tumblr_inline_njbioagYZV1sk4wb3.png">
<a href="">friend name/ or bias</a><br>
here you can put a little tiny description about your dear friend
</div></li>


<li><div id="friend">
<img align="left" src="https://31.media.tumblr.com/faaf1b5af2b2896e6d1a725af28a82f5/tumblr_inline_njbiouj6Cz1sk4wb3.png">
<a href="">friend name/ or bias</a><br>
here you can put a little tiny description about your dear friend
</div></li>


<li><div id="friend">
<img align="left" src="https://31.media.tumblr.com/1794d9788e35ff810c88e89cdde1c159/tumblr_inline_njbip0t5ql1sk4wb3.png">
<a href="">friend name/ or bias</a><br>
here you can put a little tiny description about your dear friend
</div></li>


<li><div id="friend">
<img align="left" src="https://31.media.tumblr.com/a8cf734df4f67eb010775c4eb3c157f7/tumblr_inline_njbip51S8A1sk4wb3.png">
<a href="">friend name/ or bias</a><br>
here you can put a little tiny description about your dear friend
</div></li>


<li><div id="friend">
<img align="left" src="https://31.media.tumblr.com/8fd2f46c7c5ebbc15dae5d1018a1f674/tumblr_inline_njbioagYZV1sk4wb3.png">
<a href="">friend name/ or bias</a><br>
here you can put a little tiny description about your dear friend
</div></li>


<li><div id="friend">
<img align="left" src="https://31.media.tumblr.com/faaf1b5af2b2896e6d1a725af28a82f5/tumblr_inline_njbiouj6Cz1sk4wb3.png">
<a href="">friend name/ or bias</a><br>
here you can put a little tiny description about your dear friend
</div></li>


<li><div id="friend">
<img align="left" src="https://31.media.tumblr.com/1794d9788e35ff810c88e89cdde1c159/tumblr_inline_njbip0t5ql1sk4wb3.png">
<a href="">friend name/ or bias</a><br>
here you can put a little tiny description about your dear friend
</div></li>


<li><div id="friend">
<img align="left" src="https://31.media.tumblr.com/a8cf734df4f67eb010775c4eb3c157f7/tumblr_inline_njbip51S8A1sk4wb3.png">
<a href="">friend name/ or bias</a><br>
here you can put a little tiny description about your dear friend
</div></li>


</ul>
</div>

<div id="blogroll">
{block:Following}{block:Followed}
<a href="{FollowedURL}"target="_blank">
<div id="box">
<div id="link">{FollowedName}</a></div>
<img src="{FollowedPortraitURL-128}" align="left">
</div>
{/block:Followed}{/block:Following}
</div></div></div>


<!--You have finished part 4 of the page! You are so close to finish!
The freedom is waiting! Now give it all you got (୨୧ ❛ᴗ❛)✧-->

<!--    PART 5/5

    For the last part of this page, you don't really need
    to edit that much (thankfully), but there's some stuff
    that you need to know before you go and edit:

    The way the boxes work is with the headers, if you
    delete the <h8> or </h8> the boxes will not appear and
    that would suck, so be sure to not delete either one.
    The answers work the same way, just be sure to not delete
    the header thing.

    You can add or delete as much as you wish, the scrollbar
    will help you with that.

    For the askbox, I am aware that when editing a page,
    certain things don't show, so don't worry if in the box
    it says that there's an error, or something, when you save
    the page and go there, you will see it working.

    Now, good luck! :>

-->

<div class="4"style="display:none;">

<div id="a"></div>
<div id="bottoms"><a class="five" href="#">main menu</a></div>

<div class="ask">

<!---->
<div id="f"style="background-image:url('http://41.media.tumblr.com/bd9a0da3511e4731c156d5601040b777/tumblr_nccjfgdOT41rppazbo4_1280.jpg');"></div>

<div id="faq">

<h8>question #1</h8>
<h9>answer to the question</h9>


<h8>question #2</h8>
<h9>answer to the question</h9>


<h8>question #3</h8>
<h9>answer to the question</h9>


<h8>question #4</h8>
<h9>answer to the question</h9>


<h8>question #5</h8>
<h9>answer to the question</h9>

<h8>question #6</h8>
<h9>answer to the question</h9>

</div>

<div id="askbox">
<iframe frameborder="0" height="100%" id="ask_form" scrolling="yes" src="http://www.tumblr.com/ask_form/{name}.tumblr.com" width="100%"></iframe>
</div>
</div></div>

</div></div>

<!--Please do not delete this ༼ ༎ຶ ෴ ༎ຶ༽  -->

<div class="yoonora"><a href="http://aoonis.tumblr.com/"target="_blank">
<div id="bora">Made by Yoonora</div></a></div>
</body>
</html>