cloudy with moosh header

GLOBAL_HEAD<=
<title></title>
<link rel="shortcut icon" href="">
<link href="https://fonts.googleapis.com/css?family=Roboto:400,500,700" rel="stylesheet">
<link rel="stylesheet" href="https://cdn.linearicons.com/free/1.0.0/icon-font.min.css">

<style>
/* header by moosh and layout by tentacool - feel free to reach out for assistance
   you do not need to rehost any of my fonts unless you choose to */

/* background */
body {background: #C2ABC6;  /* fallback for old browsers */
background: -webkit-linear-gradient(to bottom, #EEA9AE, #FFEFF6);  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to bottom, #EEA9AE, #FFEFF6); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
background-position:top center;
background-repeat:no-repeat;
background-attachment:fixed;}

/* font throughout */
td{ color: font-family: arial; font-size: 11px; line-height: 12px;}

/* aligns text */
tr{text-align:justify;}

/* link effects. */
a {color: #A186A5; text-decoration: none; transition: all 0.6s ease-in-out; -o-transition-transition:  all 0.6s ease-in-out; -webkit-transition: all 0.6s ease-in-out; -moz-transition: all 0.6s ease-in-out;}
a:hover {text-decoration: none; color: transparent; transition: all 0.6s ease-in-out; -o-transition-transition:  all 0.6s ease-in-out; -webkit-transition: all 0.6s ease-in-out; -moz-transition: all 0.6s ease-in-out;}

 /* locks */
.caption img{width: 7px;height: 7px; opacity:0.8;}
.ljuser img {display: none;}
.ljuser:before {content: "★";}

/* removes top things */
.shadowed img{display:none;} /* default icon */
tr.caption {display:none} /* top left namefield */
.shadowed td div {visibility:hidden; position:absolute; top:1px} /* namefield */
table table table table .meta {visibility:hidden; position:absolute; top:1px} /* links under namefield */

/* mood & music - to hide change display:visible to display:none */
.entrybox td.meta {display: visible; font-family: roboto; font-size:7px; line-height:9px; text-transform: uppercase; color:#777}

/* time & date - to hide change display:visible to display:none */
.entrybox td.index {display:visible; font-family: roboto; font-size:7px; line-height:9px; text-transform: uppercase; color:#777}

/* subject */
p table table td.caption{letter-spacing: 1; color:#777; font-size: 8px; font-family: roboto; text-transform: uppercase; font-weight: 500;}

/* entrybox and gradient */
.entrybox {background: url(); background-color:#FBF9F9;
border-left:3px solid; border-right: 0px; border-top: 0px; border-bottom:0pxt; border-image: repeating-linear-gradient(to bottom, #C2ABC6, #A186A5) 3}

/* moves entries closer together */
table{margin-bottom: -5px;}

/*friends page icons*/
.index img {height:70px; width:70px; margin-bottom:7px;}
.index {text-transform:uppercase;font-family: roboto; font-size:5pt; text-transformation: uppercase; letter-spacing: 1px;}
.entrybox a.index font {color: #777;}
td{background-color:transparent;}

/* comments */
.comments {color:#777; letter-spacing: 1; text-transform: uppercase; font-size: 8px; font-family: roboto;}

/* earlier/later */
.meta {font-family: roboto; font-size: 7px; text-transform: uppercase; line-height: 1px; padding: 0px; letter-spacing: 1px; }

/* hides viewing & navigation */
.meta {color: transparent}
.index {color: transparent}

/* highlighted text */
::selection {background-color: #FFEFF6; color: #777;}
::-moz-selection {background-color: #FFEFF6; color: #777;}
::-webkit-selection {background-color: #FFEFF6; color: #777;}

/* sidebar */
.lyrics {font-family: roboto; font-size: 7px; line-height:8px; letter-spacing:1px; text-transform:uppercase; text-align:justify; color:#000; font-weight:500;}
.picture {width:225px; margin-bottom:-45px;}
#side{position:fixed; visibility: visible; top:15px; margin-left: -580px; z-index:0; text-align:justify; width:225px;}

/* top links */
#links {position: absolute; margin-top: 10px; visibility: visible; margin-left:210px;}
.navi a {font-size: 12px; color: #000; display: inline-block; padding: 2px; }




/* top banner & image */
.shadowed {height: 50px; width: 600px; position: relative; left: 3px; margin-bottom: 2px; border: ; border-radius:; background-color: transparent;}

/* the messy stuff */
#bar { position: absolute; visibility: visible; top: 35px; left: 50%; margin-left: -303px; z-index:1; width:600px; height: 19px; background: linear-gradient(to right, #C2ABC6, #A186A5, #C2ABC6); border-radius: 5px 5px 0 0;}

#giff { position: absolute; visibility: visible; top: 11px; left: 50%; margin-left: -19px; z-index:100000;}
.gif { filter: alpha; width:34px; height:34px; background: linear-gradient(to bottom, #C2ABC6, #A186A5);  padding: 2px; border-radius: 100%; float: left;  margin-bottom: 5px;}

#bg {position: absolute; visibility: visible; top: 8px; left: 50%; margin-left: -22px; z-index:10;}
.gifbg {filter: alpha; width:44px; height:44px; background: #fff; background-image: url(https://i.imgur.com/ik9TEw5.png); border-radius: 100%; float: left;}

#nav1 { position: absolute; visibility: visible; top: 38px; left: 50%; margin-left: -303px; z-index:51; margin-top: -7px; }

#nav2 { position: absolute; visibility: visible; top: 38px; right: 50%; margin-right: -303px; z-index:51; margin-top: -7px; }

.one {background: url(https://i.imgur.com/z4AH5ry.gif); opacity: 0.7; padding: 5 15 6; text-align: left; line-height: 10px; letter-spacing: 1px; text-decoration: none; border: 2px solid transparent; width: 99px; overflow: hidden; display: inline-block; font-size: 9px; word-spacing: 10px; color: #000; text-shadow: rgba(48, 157, 201, 0.35) 0px 0px 1px; -webkit-transition: all 0.8s ease-in;}
.one:hover {letter-spacing: 4px; color: #222; -webkit-transition: all 0.8s ease-in;}

.two {background: url(https://i.imgur.com/z4AH5ry.gif); opacity: 0.7; margin-left: -3px; padding: 5 15 6; text-align: left; line-height: 10px; letter-spacing: 1px; text-decoration: none; border: 2px solid transparent; width: 99px; overflow: hidden; display: inline-block; font-size: 9px; word-spacing: 10px; color: #000; text-shadow: rgba(109, 110, 168, 0.35) 0px 0px 1px; -webkit-transition: all 0.8s ease-in;}
.two:hover {letter-spacing: 4px; color: #222; -webkit-transition: all 0.8s ease-in;}

.three {background: url(https://i.imgur.com/z4AH5ry.gif); opacity: 0.7; margin-right: -3px; padding: 5 15 6; text-align: left; line-height: 10px; letter-spacing: 1px; text-decoration: none; border: 2px solid transparent; width: 99px; overflow: hidden; display: inline-block; font-size: 9px; word-spacing: 10px; color: #000; text-shadow: rgba(170, 62, 134, 0.35) 0px 0px 1px; -webkit-transition: all 0.8s ease-in;}
.three:hover {letter-spacing: 4px; color: #222; -webkit-transition: all 0.8s ease-in;}

.four {background: url(https://i.imgur.com/z4AH5ry.gif); opacity: 0.7; padding: 5 15 6; text-align: left; line-height: 10px; letter-spacing: 1px; text-decoration: none; border-radius: 0px 3px 0px 0px; border: 2px solid transparent; width: 99px; overflow: hidden; display: inline-block; font-size: 9px; word-spacing: 10px; color: #000; text-shadow: rgba(231, 15, 101, 0.35) 0px 0px 1px; -webkit-transition: all 0.8s ease-in;}
.four:hover {letter-spacing: 4px; color: #222; -webkit-transition: all 0.8s ease-in;}

</style>

<=GLOBAL_HEAD

FRIENDS_WEBSITE<=
<div id="bar"></div>

<div id="bg"><img src="http://i.imgur.com/H0z463E.png" class="gifbg" style="display:inline;"></div>
<div id="giff"><a href="/"><img src="GIF HERE" class="gif" style="display:inline;"></a></div>


<div id="nav1"><a href="/profile" class="one"><i style="font-size:11px; line-height: 9px;" class="lnr lnr-sun"></i> profile</a>

<a href="/friends" class="two"><i style="font-size:11px;" class="lnr lnr-cloud"></i> friends</a></div>


<div id="nav2"><a href="CUSTOMS LINK" class="three"><i style="font-size:10px;" class="lnr lnr-moon"></i> customs</a>

<a href="SCENES LINK" class="four"><i style="font-size:10px;" class="lnr lnr-star"></i> scenes</a></div>


<div id="side">
<a href="/profile"><img src="https://i.imgur.com/JsWXPli.png" class="picture" style="display:inline;"></a>
<font class="lyrics">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur tincidunt, lectus quis malesuada viverra, erat velit suscipit nibh, in ultricies libero nunc in sem. Nullam a pulvinar nunc. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Cras molestie mauris at ante tincidunt fermentum et condimentum justo.</font></div>
<=FRIENDS_WEBSITE

LASTN_OPT_ITEMS=>3

LASTN_WEBSITE<=
<div id="bar"></div>

<div id="bg"><img src="http://i.imgur.com/H0z463E.png" class="gifbg" style="display:inline;"></div>
<div id="giff"><a href="/"><img src="GIF HERE" class="gif" style="display:inline;"></a></div>


<div id="nav1"><a href="/profile" class="one"><i style="font-size:11px; line-height: 9px;" class="lnr lnr-sun"></i> profile</a>

<a href="/friends" class="two"><i style="font-size:11px;" class="lnr lnr-cloud"></i> friends</a></div>


<div id="nav2"><a href="CUSTOMS LINK" class="three"><i style="font-size:10px;" class="lnr lnr-moon"></i> customs</a>

<a href="SCENES LINK" class="four"><i style="font-size:10px;" class="lnr lnr-star"></i> scenes</a></div>


<div id="side">
<a href="/profile"><img src="https://i.imgur.com/JsWXPli.png" class="picture" style="display:inline;"></a>
<font class="lyrics">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur tincidunt, lectus quis malesuada viverra, erat velit suscipit nibh, in ultricies libero nunc in sem. Nullam a pulvinar nunc. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Cras molestie mauris at ante tincidunt fermentum et condimentum justo.</font></div>
<=LASTN_WEBSITE