HTML
<style>
body {
background: url("http://i.imgur.com/fG78fNt.png") no-repeat;
cursor: crosshair;
}
table {
background-color: transparent;
}
table a img {
display: none;
}
.sf {
display: none;
}
#content {
left: 42px;
top: 178px;
background: transparent;
width: 530px;
height: 450px;
text-align: justify;
overflow: hidden;
}
#scroll {
width: auto;
height: 440px;
overflow: auto;
padding: 8px;
}
#menu {
text-align: center;
left: 595px;
top: 320px;
height: 240px;
width: 120px;
overflow: hidden;
z-index: 1;
background: transparent;
}
.menu {
height: 240px;
}
p, .medText, font, body, div, tr, td, table {
text-decoration: none;
color: #888;
font: 10pt tahoma;
text-transform: none;
line-height: 13px;
text-align: justify;
cursor: crosshair;
}
a:link, a:visited {
font: 8pt century gothic;
text-transform: uppercase;
font-weight: bold;
text-decoration: none;
color: #2d9bf2;
cursor: sw-resize;
}
a:hover {
text-decoration: none;
color: #7ed0fb;
}
b {
font: 8pt georgia;
text-transform: lowercase;
font-style: italic;
letter-spacing: 1px;
text-decoration: none;
color: #c355c3;
font-weight: bold;
}
i {
font: 8pt century gothic;
color: #04479e;
text-transform: uppercase;
line-height: 16px;
padding-left: 2px;
padding-right: 2px;
}
strong {
font: 8pt century gothic;
color: #fff;
text-transform: uppercase;
line-height: 16px;
background: url("http://i.imgur.com/LNo2l1Y.png");
padding-left: 2px;
padding-right: 2px;
}
A.men {
display: block;
text-align: center;
text-transform: uppercase;
font: 8pt century gothic;
letter-spacing: 1px;
width: auto;
line-height: 22px;
height: 22px;
background: transparent;
color: #8a8ec4 !important;
margin: 3px;
border: none;
text-decoration: none;
}
a.men:hover {
background: transparent;
color: #2b5685 !important;
font: 12pt century gothic;
text-transform: uppercase;
line-height: 22px;
}
A.men2 {
display: block;
text-align: center;
text-transform: uppercase;
font: 8pt century gothic;
letter-spacing: 1px;
width: auto;
line-height: 16px;
height: 16px;
background: transparent;
color: #8a8ec4 !important;
margin: 3px;
border: 2px solid transparent;
text-decoration: none;
}
a.men2:hover {
background: transparent;
color: #2b5685 !important;
font: 10pt century gothic;
text-transform: uppercase;
line-height: 16px;
border: 2px solid #fff;
}
h1 {
text-align: left;
letter-spacing: 3pt;
color: #a0acdc;
font: 16pt impact;
text-transform: uppercase;
height: 18px;
line-height: 18px;
padding-left: 10px;
}
.jewlz {
letter-spacing: 3pt;
color: #bbc9ef;
font: 16pt impact;
text-transform: uppercase;
height: 18px;
line-height: 18px;
}
h2 {
font: 14pt georgia;
color: #ac25df;
font-weight: bold;
text-align: center;
letter-spacing: 3px;
text-transform: lowercase;
font-style: italic;
line-height: 20px;
background: transparent;
}
h3 {
font: 10pt century gothic;
color: #fff;
text-transform: uppercase;
padding-left: 8px;
line-height: 16px;
background: url("http://i.imgur.com/LNo2l1Y.png");
}
li {
list-style-image: url("http://i.imgur.com/yVG9Xr4.png");
color: #ac25df;
font: 10pt tahoma;
font-variant: small-caps;
text-align: left;
font-style: italic;
padding-left: 20px;
padding-right: 20px;
}
textarea {
width: 88px;
height: 20px;
font: 52pt georgia;
letter-spacing: -3px;
font-style: italic;
line-height: 0.2em;
overflow: hidden;
color: #1874bc;
background: url("http://i.imgur.com/CuXYeHL.png");
border: none;
margin: 1px;
}
textarea:hover {
font: 70pt georgia;
letter-spacing: -5px;
line-height: 0.2em;
font-style: italic;
color: #a8acdc;
border: 2px solid #fff;
}
#update {
width: 90%;
height: 100px;
text-align: justify;
background: url("http://i.imgur.com/CuXYeHL.png");
border: 2px solid transparent;
padding: 3px;
overflow: auto;
margin: 6px;
}
#update:hover {
border: 2px solid #fff;
}
.column {
float: left;
width: 48%;
text-align: center;
margin: 2px;
}
.jewel {
width: 100px;
border-left: none;
border-right: none;
border-top: 4px solid #4a91e9;
border-bottom: 4px solid #4a91e9;
margin: 5px;
}
.jewel:hover {
border-bottom: 2px solid #9e219d;
border-top: 2px solid #9e219d;
border-left: none;
border-right: none;
}
#title {
left: 10px;
top: 93px;
font: 80px georgia;
color: #218acb;
font-weight: bold;
font-style: italic;
letter-spacing: 2px;
text-transform: lowercase;
}
.sub {
color: #04479e;
font: 40px tahoma;
text-transform: uppercase;
font-weight: bold;
letter-spacing: -1px;
margin-left: -10px;
}
</style><div id="title" style="position: absolute;">
MARIAH's<font class="sub"> Portfolio</font>
</div>
<div id="menu" style="position: absolute;">
<div class="menu" id="home1">
<a href="#home" class="men">Home</a>
<a href="#page1" class="men">My Pets</a>
<a href="#list" class="men">Goals</a>
<a href="#page2" class="men">Amicus</a>
<a href="#page3" class="men">Wishlist</a>
<a href="#sitely" class="men">Sitely</a>
</div>
<div class="menu" id="list">
<a href="#home" class="men">Home</a>
<a href="#home1" class="men">Go Back</a>
<a href="#one" class="men2" style="border-radius: 5em;">Avatars</a>
<a href="#two" class="men2" style="border-radius: 5em;">Pet goals</a>
<a href="#three" class="men2" style="border-radius: 5em;">Site Goals</a>
</div>
</div>
<div id="content" style="position: absolute;">
<div id="home">
<a name="home"></a>
<div id="scroll">
<h1>About <font class="jewlz">Me</font></h1>
Hello! My name is Mariah and I am 21 years old. I used to play neopets a lot when I was like 8 but stopped a few years after. I decided a few months ago to give it another go to see how much it has chnaged. I find myself getting back into the routine just as I did when I was younger. I am currently trying gain as many avatars as I can. I also enjoy playing games and trying to get trophies. I try to restock but I'm not the best at it.
<br><b>Likes:</b>
<br>Music, sleeping in late, harry potter, movies, coffee, shopping, makeup, and wasting my time on the internet
<br><b>Dislikes:</b>
Early mornings, studying, not getting enough sleep, running, loud chewing, and a lot of other stuff honestly
<br><center>
<div id="update">
<h3>Updates</h3>
<li><strong>23.05.2017</strong><br> \ Recieved the The Wheel of Monotony avatar finally!</li>
<li><strong>22.05.2017</strong><br> \Finally got around to making this portfolio page! Also started working on my patrack avatar :)</li>
</div></center>
<br><h2>Top Current Goals</h2>
<br><img src="http://images.neopets.com/neoboards/avatars/sdb.gif" style="border-radius: 1em;"> Get the packrat avatar
<br><br><img src="http://images.neopets.com/neoboards/avatars/faeriebubbles.gif"> Get Faerie Bubbles avatar
<br><br><img src="http://images.neopets.com/items/babypaintbrush.gif"> Save up for a baby paint brush
</div>
</div>
<div id="page1">
<a name="page1"></a>
<div id="scroll">
<h1>My Pets</h1>
<div class="column">
</div>
</center>
<h2>Calum20</h2>
<br><a href="http://www.neopets.com/petlookup.phtml?pet=calum20"><img src="http://pets.neopets.com/cp/z32tgzbc/1/2.png" class="jewel" style="border-radius: 99em;"></a>
<br><i>He was my first pet I made on this account and is named after Calum Hood. He is currently working on training to a higher level.</i>
<br><h2>undercover_martyn24</h2>
<br><a href="http://www.neopets.com/petlookup.phtml?pet=undercover_martyn24"><img src="http://pets.neopets.com/cp/xfjn4fvs/1/2.png" class="jewel" style="border-radius: 99em;"></a>
<br><i>This is undercover_martyn24. She is named after a Two Door Cinema Club song.She is currently my gourmet eater.</i>
</div>
</div>
<div id="page2">
<a name="page2"></a>
<div id="scroll">
<center><h1>Amicus</h1>
I am a part of a wonderful guild called Amicus! It is a very friendly guild that promotes support and encouragement for each member! It is a great way too meet other neo users and make friendships!
Check us out <a href="http://www.neopets.com/guilds/guild.phtml?id=4176258">here!</a> </center>
</div>
</div>
<div id="page3">
<a name="page3"></a>
<div id="scroll">
<h1>Wishlist</h1>
Here is a list of items I would like to obtain :)
<br><img src="http://images.neopets.com/items/mfo_draikiceegg.gif"><img src="http://images.neopets.com/items/babypaintbrush.gif"><img src="http://images.neopets.com/items/cloudpntbrush.gif"><img src="http://images.neopets.com/items/sta_faerie_dark.gif">
</div>
</div>
<div id="one">
<a name="one"></a>
<div id="scroll">
<h1>Avatars</h1>
<br><strong>Most Wanted</strong>
<br><img src="http://images.neopets.com/neoboards/avatars/kadoatery.gif"> <img src="http://images.neopets.com/neoboards/avatars/tdmbgpop.gif"> <img src="http://images.neopets.com/neoboards/avatars/snowager.gif"> <img src="http://images.neopets.com/neoboards/avatars/kikopop.gif"> <img src="http://images.neopets.com/neoboards/avatars/icecreammachine.gif"><img src="http://images.neopets.com/neoboards/avatars/stampsfaerieland87393.gif"><img src=http://images.neopets.com/neoboards/avatars/neodaqtick.gif><img src="http://images.neopets.com/neoboards/avatars/topgamer.gif"><img src="http://images.neopets.com/neoboards/avatars/gloomy.gif"><img src="http://images.neopets.com/neoboards/avatars/myncispike.gif"><img src="http://images.neopets.com/neoboards/avatars/snowroller.gif"><img src="http://images.neopets.com/neoboards/avatars/snowwocky.gif"><img src="http://images.neopets.com/neoboards/avatars/leverofdoom.gif"><img src="http://images.neopets.com/neoboards/avatars/randomcontest.gif"><img src="http://images.neopets.com/neoboards/avatars/hatpc.gif"><img src="http://images.neopets.com/neoboards/avatars/meercachase.gif"><img src="http://images.neopets.com/neoboards/avatars/luckyblumaroo.gif"><img src="http://images.neopets.com/neoboards/avatars/mediocrity.gif"><img src="http://images.neopets.com/neoboards/avatars/jetsamchomp.gif"><img src="http://images.neopets.com/neoboards/avatars/codestones.gif"><img src="http://images.neopets.com/neoboards/avatars/spacefaerie.gif"><img src="http://images.neopets.com/neoboards/avatars/wheelofexcitement.gif"><img src="http://images.neopets.com/neoboards/avatars/mathsbabaa.gif"><img src="http://images.neopets.com/neoboards/avatars/luckystreak.gif"><img src="http://images.neopets.com/neoboards/avatars/evilcoconut.gif"><img src="http://images.neopets.com/neoboards/avatars/avatarcollector.gif"><img src="http://images.neopets.com/neoboards/avatars/petpetlabray.gif"><img src="http://images.neopets.com/neoboards/avatars/toothfaerie.gif"><img src="http://images.neopets.com/neoboards/avatars/kioskwocky.gif">
</div>
</div>
<div id="two">
<a name="two"></a>
<div id="scroll">
<h1>Pet Goals</h1>
<h3>Training Calum20</h3>
<br><style>
li {
list-style-image: url("http://i.imgur.com/QUc3GZ5.png");
}
</style><li>Level 10</li>
<style>
li {
list-style-image: url("http://i.imgur.com/QUc3GZ5.png");
}
</style><li>Level 15</li>
<style>
li {
list-style-image: url("http://i.imgur.com/QUc3GZ5.png");
}
</style><li>Level 20</li>
<style>
li {
list-style-image: url("http://i.imgur.com/QUc3GZ5.png");
}
</style><li>Level 25</li>
<style>
li {
list-style-image: url("http://i.imgur.com/QUc3GZ5.png");
}
</style><li>Level 30</li>
<style>
li {
list-style-image: url("http://i.imgur.com/QUc3GZ5.png");
}
</style><li>Level 35</li>
<style>
li {
list-style-image: url("http://i.imgur.com/QUc3GZ5.png");
}
</style><li>Level 40</li>
<h3>Paint Undercover_martyn24</h3>
<h3>Read Calum20 booktastic books</h3>
</div>
</div>
<div id="three">
<a name="one"></a>
<div id="scroll">
<h1>Site Goals</h1>
<h3>Reach 1 million nps (186,703/1,000,000)</h3>
<h3>Feed 75 Kadoaties(1/75)</h3>
<h3>Collect 100 avatars (52/100)</h3>
<h3>Collect 25 stamps (2/25)</h3>
<h3></h3>
</div>
<div id="sitely">
<a name="sitely"></a>
<div id="scroll">
<h1>Link Back</h1>
<center>
<div class="column">
<a href="/~drelda"><img src="http://i.imgur.com/6RpH5s4.png" border="0" style="padding: 1px;"></a><a href="/~drelda"><img src="http://i.imgur.com/6RpH5s4.png" border="0" style="padding: 1px;"></a><a href="/~drelda"><img src="http://i.imgur.com/6RpH5s4.png" border="0" style="padding: 1px;"></a><a href="/~drelda"><img src="http://i.imgur.com/6RpH5s4.png" border="0" style="padding: 1px;"></a><a href="/~drelda"><img src="http://i.imgur.com/6RpH5s4.png" border="0" style="padding: 1px;"></a><a href="/~drelda"><img src="http://i.imgur.com/6RpH5s4.png" border="0" style="padding: 1px;"></a><a href="/~drelda"><img src="http://i.imgur.com/6RpH5s4.png" border="0" style="padding: 1px;"></a><a href="/~drelda"><img src="http://i.imgur.com/6RpH5s4.png" border="0" style="padding: 1px;"></a>
</div>
<div class="column">
</div>
</center>
<br><br><br><br><br><br><br><br><br><br><br><h2>Site Credit</h2>
<center>
Layout and coding made by <a href="/userlookup.phtml?user=cheese_louise">Jewlz</a> at
<br><a href="/~Drelda"><img src="http://i1354.photobucket.com/albums/q698/haybales56/jewl22ani22233_zps356d1c6f.gif" border="0" style="padding: 2px;"></a>
<br><li>Content © <a href="/userlookup.phtml?user=username">Your Name</a>.</li>
<li>Textures from <a href="/~liahness">details</a>, <i>Sosuftw</i>, <i>rememberus</i> & <i>deadlydoll</i>. Elephante PNG from <a href="/~liahness">Details</a>. Polka dot texture from <a href="/~folios">Crumble</a>. Brushes by <i>faeriepuffs</i>.</li>
<li>Bullets, signs and placeholders from <a href="/~drelda">Bejeweled</a>.</li>
<br><br><i><b>NEOPETS</b>, characters, logos, names and all related indicia are trademarks of <a href="/">Neopets, Inc.</a>, © 1999-2015.</i>
</center>
</div>
</div>
</div>
