jem and the holograms

GLOBAL_HEAD<=
<title>title</title>
<link href="https://fonts.googleapis.com/css?family=Raleway" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Roboto:400,500,700" rel="stylesheet">

<style>

/* layout by languages with edits by tentacool - feel free to reach out for assistance */

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

/* default font */
td{font-family:; line-height:11px; letter-spacing:0px; font-size: 10px;}
tr{text-align:justify;}
table{margin-bottom: -5px;}
b{font-weight: normal;}

/* cursor */
body, a {cursor:url(http://i.imgur.com/ONVDMqu.png), default;}
a:hover {cursor:url(http://i.imgur.com/0p9CPwX.png), default;}

/* hides journal title */
table table tr.caption td.caption {line-height: 8px; visibility: hidden;}

/* link effects */
a {color: #00799C; 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: #C4005D; 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;}

/* hides default icon */
.shadowed img {display: none;}

/* hides default namefield */
.shadowed td div {position: absolute; top: 0; visibility: hidden;}

/* hides default userinfo and calendar links */
tr.caption {display: none;}
table table table table .meta {position: absolute; top: 0; visibility: hidden;}

/* sidebar */
#sidebar {margin-right: 309px; position: absolute; right: 50.0%; top: 20px; visibility: visible; width: 83px; z-index: 0;}
#gif {position:absolute; visibility: visible; top:15px; left: 49.5%; margin-left: -240px;}
#frame {visibility: visible; margin-right:-100px;}


/* table spacing */
table {margin-bottom: -4px;}

/* entrybox */
.entrybox{width: 600px; padding: 0px; background: url(http://imgur.com/4WjWzlN.png); box-shadow: 0 0 1px #ccc;}

/* hides privacy icons */
.caption img {display: none;}

/* hides user icons */
.ljuser img {display: none;}

/* changes content before linked usernames */
.ljuser:before {content: "★";}

/* subject lines */
p table table td.caption, .entrybox td.index {font-family: roboto, calibri, monaco; font-weight: 700; font-size: 10px; line-height:9px;  color:#C4005D; letter-spacing:2px; text-shadow:1px 0px 0px #00799C; text-transform:uppercase;
border-width: 0 0 1px 0; border-style: solid;border-image: repeating-linear-gradient(to right, #C4005D, #FFAF00, #00799C, #9AC200) 2;}

/* date & time */
.entrybox td.index, .index3 {display: none; font-size:8px;}

/* mood & music */
.entrybox td.meta {display: none; color:#C4005D; font-size:9px; line-height:9px;}

/* comments */
.comments {font-family: raleway, arial; font-size: 8px;text-transform: uppercase; line-height: 10px; padding:0px; letter-spacing: 1px; text-shadow:0px 1px 1px #a3a3a3;}

/* navigation */
.index, .meta {font-family: raleway, consolas; font-size:7px; text-transform: uppercase; line-height: 7px; padding: 0px; letter-spacing: 1px; color: #9d9996;}
table table table td.meta {font-size:0px;line-height:0px;} table table table td.meta a {font-size:8px;letter-spacing:1px;line-height: 8px;margin-top: -5px;}

/* viewing */
.meta {font-size: 0; line-height: 0; text-align: center;}

/* customizes friend icons */
.index img{height: 60; width: 60;}

/* scrollbar */
::-webkit-scrollbar {background-color: #transparent; width: 6px;}
::-webkit-scrollbar-track {background-color: #transparent; -box-shadow: inset 0 0 0px;}
::-webkit-scrollbar-thumb {background-color: #fcece8; box-shadow: inset 0 0 1px #ccc; }


#stars {
position: relative;
visibility: visible;
z-index: 1; }

#stars img {
display: block;
margin-left: -113px;
margin-top: 17px;

width: 196px; }

#art {
position: absolute;
visibility: visible;
z-index: 2; }

#art img {
border-radius: 100px;
display: block;
margin-left: -78px;
margin-top: 46px;
position: relative;
width: 125px; }

#nav{border-radius: 5px; width: 6px; height: 6px; overflow: hidden; display: inline-block; color: transparent; padding: 1; margin-bottom: 1;font-family: raleway; font-size: 8px; text-transform: uppercase; letter-spacing: 1; line-height: 8px; -webkit-transition: all 0.4s ease-in;} #nav:hover{width: 50px; color: #fff; font-family: raleway; font-size: 8px; text-transform: uppercase; letter-spacing: 1; line-height: 6px; padding-left: 5;padding-top: 1;}
#links {position:fixed; visibility: visible; top:235px; right:50.0%; margin-right: 218px; z-index:0; text-align:justify; width:210px;}
.one{background-color:#C4005D;display: block;}
.two{background-color:#FFAF00; display: block;}
.three{background-color:#00799C; display: block;}
.four{background-color:#9AC200; display: block;}
#lyrics{position:absolute; visibility: visible; top:195px; right: 10px; z-index:0; text-align:justify; width:170px;}
.text {font-family: 'raleway'; arial narrow; font-size: 10px; line-height:10px; letter-spacing:0px; text-transform:uppercase; text-align:justify; color:#444444; text-shadow:#222;}
</style>

<=GLOBAL_HEAD

FRIENDS_WEBSITE<=
<div id="sidebar">
<div id="stars"><img src="https://i.imgur.com/lhluCsE.png"></div>
<div id="art"><img src="https://i.imgur.com/fkfYnlD.png"></div>
<div id="lyrics"><font class="text">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco nisi ut aliquip ex consequat. Duis aute in reprehenderit in dolore eu fugiat nulla pariatur.
<a href="/" class="one" id="nav">entries</a> <a href="/profile" class="two" id="nav">profile</a> <a href="/calendar" class="three" id="nav">calendar</a> <a href="/friends" class="four" id="nav">friends</a><br></font></div></div><br>

<=FRIENDS_WEBSITE

LASTN_OPT_ITEMS=>3

LASTN_WEBSITE<=
<div id="sidebar">
<div id="stars"><img src="https://i.imgur.com/lhluCsE.png"></div>
<div id="art"><img src="https://i.imgur.com/fkfYnlD.png"></div>
<div id="lyrics"><font class="text">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco nisi ut aliquip ex consequat. Duis aute in reprehenderit in dolore eu fugiat nulla pariatur.
<a href="/" class="one" id="nav">entries</a> <a href="/profile" class="two" id="nav">profile</a> <a href="/calendar" class="three" id="nav">calendar</a> <a href="/friends" class="four" id="nav">friends</a><br></font></div></div><br>

<=LASTN_WEBSITE