✧ * ☾ destinatiia.tumblr.com * ✧
 
you know the drill . don't Move the credit or put it in another page . just don't . don't take fragments from this code and paste it on your own, even if you credit me. it's a no. and yeah just that enjoy !
 
-----
1. COPY THE FOLLOWING CODE AND PASTE IT BEFORE </head>
-----
 
 
<script type="text/javascript">
jQuery(document).ready(function() {
jQuery(".dd").hide();
//toggle the componenet with class msg_body
jQuery(".yeahso").click(function()
{
jQuery(this).next(".dd").slideToggle(500);
});});
 
function showDiv() {
    $('#townmap').show();
    $('#townlistings').hide();
}
 
function showListings() {
    $('#townlistings').show();
    $('#townmap').hide();
}
</script>
 
-----
2. NOW YOU WANNA WRITE THE NEXT CSS SOMEWHERE AFTER <style type="text/css">
-----
 
.dropdown {
    width:241px;
    z-index:99;
    background-color: #ddd;
    height:auto;
    position:static;
    padding:10px;
    font-family:'montserrat', sans serif;
    font-size:11px;
    text-align:center;
    margin-left:30px;
    margin-top:230px;
}
 
.yeahso {
    font-family:'montserrat', sans serif;
    font-size:16px;
}
 
.dd{
    margin-top:5px;
    line-height:150%;
    letter-spacing:5px;
}
 
.dd a:hover{
    background-color:#aaa;
    opacity:0.5;
}
 
-----
3. THE WHOLE STRUCTURE IS DONE ! NOW IT'S TIME TO ADD THE FOLLOWING CODE TO YOUR PAGE, EDIT IT AND YOU'RE DONE !
-----
 
<div style="margin-left: 10px;"><!-- this is the main picture -->
<p><img src="https://66.media.tumblr.com/edf4c4b95a9256a7c635a8dd5cf1cd7f/tumblr_inline_o8h2y7MYwN1rc4obr_540.png" style="width: 100px; border-radius: 100px;" /></p>
<div style="margin-left: 120px; margin-top: -100px;"><!-- here's where the user goes -->
<div style="font-size: 18px; font-family: 'HelveticaNeue-Light', 'Helvetica Neue Light', 'Helvetica Neue'; height: auto; width: auto;">user <em><strong>!</strong></em></div>
<!-- name + lil description/quote/wtv ! -->
<div style="z-index: 99; margin-top: 10px; overflow: auto; font-family: 'HelveticaNeue-Light', 'Helvetica Neue Light', 'Helvetica Neue'; width: 380px; height: 55px; padding-right: 10px;"><strong>name.</strong>&nbsp;put whatever you want here Tbh it overflows so ! blah blah blah blah blah blah<strong><br /></strong></div>
</div>
</div>
<!-- the other insta pics ! -->
<div style="margin-left: 10px; margin-top: 30px;"><img src="https://66.media.tumblr.com/27d471ffbf06bc1d68d08a2136df6e36/tumblr_inline_o8j39fUjOj1rc4obr_540.png" style="width: 90px;" /> &nbsp;<img src="https://66.media.tumblr.com/45da6e588149d2f54230852ed2428659/tumblr_inline_o8h89yjTeF1rc4obr_540.png" style="width: 90px;" /> &nbsp;<img src="https://66.media.tumblr.com/96aff1ab2253d9f1784c0eaa6174d247/tumblr_inline_o8j33mQOGy1rc4obr_540.png" style="width: 90px;" />&nbsp;&nbsp;<img src="https://65.media.tumblr.com/5243985a15ad2caebfc848b9e40b2033/tumblr_inline_o8h2yvW8801rc4obr_540.png" style="width: 90px;" />&nbsp;&nbsp;<img src="https://67.media.tumblr.com/2b9f58bd40f8177a763a1fdeb569f359/tumblr_inline_o8itf31m671rc4obr_540.png" style="width: 90px;" /></div>
<!-- another very brief quote ! -->
<div style="width: auto; padding-bottom: 5px; padding-top: 2px; padding-left: 7px; padding-right: 7px; height: 15px; background: #ddd; margin-top: 20px; text-align: center; overflow: hidden; font-family: 'HelveticaNeue-Light', 'Helvetica Neue Light', 'Helvetica Neue';">some cute quote !</div>
<!-- p self explanatory ! -->
<div style="z-index: -9; margin-left: 10px; width: 340px; padding: 10px; height: 100px; text-align: center; letter-spacing: 1px; overflow: auto; background: #ddd; margin-top: 15px;">muse info here !</div>
<div style="font-family: 'HelveticaNeue-Light', 'Helvetica Neue Light', 'Helvetica Neue'; width: 100px; margin-top: -120px; float: right; margin-right: 15px; height: 120px; text-align: right; overflow: hidden; line-height: 130%; font-weight: bold; font-size: 16px;"><!-- these are the links ! --> <a href="http://YOURLINK" style="border-bottom: 1px solid #ddd;">your link</a><br /><a href="http://YOURLINK" style="border-bottom: 1px solid #ddd;">your link</a><br /><a href="http://YOURLINK" style="border-bottom: 1px solid #ddd;">your link</a><br /><a href="http://YOURLINK" style="border-bottom: 1px solid #ddd;">your link</a><br /><a href="http://YOURLINK" style="border-bottom: 1px solid #ddd;">your link</a><br /><a href="http://YOURLINK" style="border-bottom: 1px solid #ddd;">your link</a></div>
<!-- another quote + the collapsable info -->
<div class="dropdown" style="margin-top: 15px; margin-left: auto; background: #ddd; padding-bottom: 5px; padding-top: 2px; padding-left: 7px; padding-right: 7px; border: none; width: auto;"><a class="yeahso" href="#" style="font-size: 7px; text-transform: uppercase; font-family: calibri;">some cute quote here ! <strong><em>(</em></strong> click&nbsp;<strong><em>)</em></strong></a>
<div class="dd" style="overflow: auto; height: 90px; font-family: calibri; line-height: 130%; font-size: 9px; text-align: center; letter-spacing: 0.7px;">more muse info here !</div>
</div>
<div style="float: right; margin-top: 10px; padding-right: 5px; padding-left: 5px; padding-top: 2px; padding-bottom: 2px; background: #ddd;"><a href="http://destinatiia.tumblr.com" title="code by becca">✰</a></div>