shark in the water

GLOBAL_HEAD<=
<link rel="stylesheet" href="https://fontcity.neocities.org/upon.css">
<link rel="stylesheet" href="https://cdn.linearicons.com/free/1.0.0/icon-font.min.css">

<title>TITLE</title>
<link rel="shortcut icon" href="">

<style>

/* layout by upon with edits 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-color: #;
background-image: url(https://i.imgur.com/HKMu4SJ.jpg);
margin-top: 65px;}

/* main font */
td {
font-family: Arial;
font-size: 8px;
line-height: 10px;
color: #424242;
letter-spacing:1px;
text-transform:uppercase;
text-shadow: 0px 0px 1px #a3a3a3;
}

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

/* cursor */
body, a {cursor:url(https://i.imgur.com/h2zNor5.png), default;}
a:hover {cursor:url(https://i.imgur.com/6GAtOYA.png), default;}

/* links */
a { color: #2790B0; text-decoration: none; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -ms-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease;}
a:hover { color: #94BA65; text-decoration: none; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -ms-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease;}

/* entrybox */
.entrybox{width: 600px;
background-color: rgba(255,255,255,.7);
padding: 3px; border-width: 2px 0 0 0;
border-style: solid;
    -webkit-border-image: -webkit-linear-gradient(left, #94BA65, #2790B0, #2B4E72) 50% 1;
    -moz-border-image: -moz-linear-gradient(left,#94BA65, #2790B0, #2B4E72) 50% 1;
    -o-border-image: -o-linear-gradient(left,#94BA65, #2790B0, #2B4E72) 50% 1;
    border-image: linear-gradient(to left, #94BA65, #2790B0, #2B4E72)) 50% 1;}
table{margin-bottom: -5px;}

/* subject  */
p table table td.caption {
font-family: Times;
font-size:8px;
line-height:8px;
letter-spacing: 2px;
text-transform: uppercase;
color: rgba(103, 102, 102, 1);
text-shadow: 0px 0px 1px rgba(190, 190, 190, 1);
text-indent: 4px; display: block;
}

/* comments */
.comments {font-family: Times; font-size:7px; letter-spacing: 1px; text-transform:uppercase;}

/* navigation and fp text */
.index, .meta {font-family: times; font-size: 7px; text-transform: uppercase; line-height: 7px; padding: 0px; letter-spacing: 1px; }

/* hides viewing & navigation */
.meta {color: transparent; text-shadow:none;}
.index {color: transparent; text-shadow:none;}

/*friends page icons*/
.index img {border-radius:50px; height:55px; width:55px; margin-bottom:5px;}
.index {font-family: times;font-size:6pt; text-transformation: uppercase;  letter-spacing: 1px; line-height:0px;}
.entrybox a.index font {color: #777;}
td{background-color:transparent;}

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

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

/* removes the default icon & top text */
.shadowed img{display: none;} /*icon*/
table table table table .meta {visibility:hidden; position:absolute;} /*links under namefield*/
tr.caption {display:none} /*top left journal name*/
.shadowed td div {visibility:hidden; position:absolute; top:0px} /*namefield*/

/* highlighted text */
::selection {background-color: rgba(254, 253, 253, 0.5); color: #777;}
::-moz-selection {background-color:rgba(254, 253, 253, 0.5); color: #777;}
::-webkit-selection {background-color:rgba(254, 253, 253, 0.5); color: #777;}

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

/* top */
#title { position: absolute;visibility: visible; margin-left: 140px;}
#name { height: 0px; left: 50px; position: relative; top: -10px; width: 600px; visibility: visible; }
.upon {font-family: Upon; font-size: 30px; line-height: px;
text-transform: none; color: #FFF; text-shadow: 2px 2px 0px #2790B0;}


/* side */
#navigation {height: 0px; left: -355px; position: relative; top: -100px; width: 150px; visibility: visible; }

/* stacks them */
#one { position: absolute; visibility: visible; top: 126px; margin-left: 290px;} /* first box */
#two { position: absolute; visibility: visible; top: 165px; margin-left: 290px;} /* second box */
#three { position: absolute; visibility: visible; top: 204px; margin-left: 290px;} /* third box */
#four { position: absolute; visibility: visible; top: 243px; margin-left: 290px;} /* fourth box */

/* controls the border colors */
#i1 { padding: 5px; background: rgba(250, 249, 249, 0.7); border: 2px solid #94BA65;} /* first box */
#i2 { padding: 5px; background: rgba(250, 249, 249, 0.7); border: 2px solid #7b9954;} /* second box */
#i3 { padding: 5px; background: rgba(250, 249, 249, 0.7); border: 2px solid #2790B0;} /* third box */
#i4 { padding: 5px; background: rgba(250, 249, 249, 0.7); border: 2px solid #2B4E72;} /* fourth box */

/* changes the size - same number will change all four boxes*/
.navi a {font-size: 13px; color: #777; display: inline;}

</style>
<=GLOBAL_HEAD

FRIENDS_WEBSITE<=
<div id="name"><a class="upon" href="/profile"><div id="title">hammer time</div></a>
<a href="/profile"><img src="https://i.imgur.com/Da2bHp9.png" style="width: 145px; position:relative; top: -52px; left: 0px; display:inline;"></a></div>

<div id="navigation"><span class="navi">
<a href="/" id="one" title="entries"><span class="lnr lnr-home" id="i1"></span></a>
<a href="/friends" id="two" title="friends"><span class="lnr lnr-heart" id="i2"></span></a>
<a href="LINK" id="three" title="customs"><span class="lnr lnr-lock" id="i3"></span></a>
<a href="LINK" id="four" title="scenes"><span class="lnr lnr-star" id="i4"></span></a>
</span></div>
<=FRIENDS_WEBSITE

LASTN_WEBSITE<=
<div id="name"><a class="upon" href="/profile"><div id="title">hammer time</div></a>
<a href="/profile"><img src="https://i.imgur.com/Da2bHp9.png" style="width: 145px; position:relative; top: -52px; left: 0px; display:inline;"></a></div>

<div id="navigation"><span class="navi">
<a href="/" id="one" title="entries"><span class="lnr lnr-home" id="i1"></span></a>
<a href="/friends" id="two" title="friends"><span class="lnr lnr-heart" id="i2"></span></a>
<a href="LINK" id="three" title="customs"><span class="lnr lnr-lock" id="i3"></span></a>
<a href="LINK" id="four" title="scenes"><span class="lnr lnr-star" id="i4"></span></a>
</span></div>
<=LASTN_WEBSITE