Premade Petpage Layouts

All premade layouts, coding, and layout designs provided here are © Nicole (patternmatrix and pinkpanther_a30) unless otherwise stated.

Do not claim my coding as your own or alter the coding and use it for something you made.

Do not redistribute anything from this page. If you want to use a layout design that I have made please ask for my permission, so I do not report you for theft.

There are a few times that I let Neopians use my coding for their layout. You must neomail for my permission before you start. A few people have my permission for this and will have my credit in the proper area.

Neomail me if you would like your site's name added to one of the premade layouts. You do not have to wait until the waiting list is open, since I can add it right away.

Accept? or Decline?

Style 1 - Fullscreen (V: 1 & V: 2)

Version 1 layout is a continuous flow layout where the content box will keep going down when you add all your content in. There may be slight problems in IE (I will fix them the best I can) and the fixed navigation does not work in IE, so you will need "back to the top" buttons.

Version 2 layout is a multi-page anchored layout. This layout has pages set up just like Seraphic's layout is. Works in all browsers just fine and is best viewed in Chrome.

	Version 1 <style> #layoutdesignandcodingbypatternmatrix { } #donotsteal { } .sf, .sf a { display: none; } body { background: #fff; text-align: left; color: #222; font: 8.5pt verdana; line-height: 15px; } table { background: #000; } a:link, a:active, a:visited { text-decoration: none; font-weight: bold; color: #d546a8; } a:hover { color: #509bc4; } a.nav:active, a.nav:visited, a.nav:link { display: block; text-decoration: none; font: 8pt verdana; padding: 4px; margin-bottom: 1px; letter-spacing: 1px; background: transparent; text-align: center; text-transform: uppercase; color: #8777d3; border-right: 10px solid #8777d3; border-left: 10px solid #8777d3; } a.nav:hover { color: #71d6dc; border-right: 10px solid #71d6dc; border-left: 10px solid #71d6dc; } b { color: #0032c7; font-weight: bold; } i { color: #854ab2; } h1 { font: 11pt tahoma; margin: 0px; margin-top: 0px; margin-bottom: 5px; line-height: 20px; color: #ffffff; background: #6587ef; letter-spacing: 3px; font-weight: bold; text-align: left; padding-left: 3px; } h2 { font: 8pt tahoma; margin: 0px; margin-top: 5px; margin-bottom: 5px; line-height: 15px; color: #a07ecc; border-bottom: 3px solid #b096d6; letter-spacing: 3px; font-weight: bold; text-align: right; padding-right: 3px; } h3 { font: 8pt tahoma; margin: 0px; margin-top: 5px; margin-bottom: 5px; line-height: 15px; color: #e27af4; border-bottom: 3px solid #e48cf6; letter-spacing: 3px; font-weight: bold; text-align: left; padding-left: 3px; } #topimage { margin-top: 10px; margin-bottom: 10px; left: 285px; width: 700px; padding: 5px; background: #fff; overflow: auto; } #middle { top: 200px; left: 285px; width: 700px; padding: 5px; background: #fff; overflow: auto; margin-bottom: 10px; } #bigside { width: 150; left: 120px; top: 24px; padding: 5px; background: #fff; } </style> <img style="position: fixed; right: 0px; bottom: 0px; overflow: hidden; z-index: -1; border: 0px;" src="http://img193.imageshack.us/img193/8789/leftb.png"><img style="position: fixed; left: 0px; bottom: 0px; overflow: hidden; z-index: -1; border: 0px;" src="http://img51.imageshack.us/img51/7950/rightbt.png"><div id="bigside" style="position: fixed;"> <a href="/" class="nav">neopets</a> <a href="#one" class="nav">link</a> <a href="#two" class="nav">link</a> <a href="#three" class="nav">link</a> <a href="#credits" class="nav">Credits</a> </div> <div id="topimage" style="position: absolute;"> <a name="top"></a> <img src="http://img201.imageshack.us/img201/6162/bannertopa.png" border="0"> </div> <div id="middle" style="position: absolute;"> <a name="one"></a> <h1> <a href="#top"><img src="http://i42.tinypic.com/x6bjg5.jpg" border="0"></a> header</h1> <b>Lorem</b> ipsum <i>dolor</i> amet, <a href="/">consectetur</a> adipiscing elit. Morbi vitae mi non neque suscipit pretium. Cras felis arcu, tempor et luctus a, sodales a lorem. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Donec vitae purus eu neque scelerisque mattis vitae a enim. Mauris purus nisl, blandit ac porta id, aliquam ac urna. Morbi dolor velit, iaculis non ultrices sit amet, placerat dignissim nulla. In eleifend congue turpis, id tincidunt nunc pharetra in. <p></p> <a name="two"></a> <h2>Header 2</h2> In hac habitasse platea dictumst. Sed tristique purus non ligula commodo non pretium velit venenatis. Praesent massa dolor, malesuada nec sollicitudin ac, porta vulputate metus. Vivamus non nisl at felis porttitor aliquet. Nullam quis volutpat nisl. Praesent venenatis tempor erat, vel pellentesque enim semper volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Proin pellentesque pulvinar aliquam. Nullam cursus lacinia erat, ut venenatis nibh vehicula at. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean lacinia ullamcorper orci, nec fringilla ligula luctus quis. <p></p> <a name="three"></a> <h3>Header 3</h3> Morbi et posuere nunc. Donec rhoncus malesuada accumsan. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Morbi eu justo id lorem luctus fringilla sed nec odio. Praesent volutpat convallis erat, at malesuada libero tincidunt vel. Phasellus sollicitudin mi at nisi elementum euismod at ut purus. Donec volutpat nisl eget nisi aliquet eu luctus urna pretium. <p></p> <center><b>To save please zoom out 2/3 times (ctrl & -) and (ctrl & +) to zoom right back.</b></center> <p></p> <a name="credits"></a> <h1> <a href="#top"><img src="http://i42.tinypic.com/x6bjg5.jpg" border="0"></a> Credits</h1> <center> <a href="/~oppsh"><img src="http://i1252.photobucket.com/albums/hh575/faeriemallowpuffs/ggggggabc.gif"></a> <br>Images by Neopets. <br>Textures/Brushes from dA and <a href="/~liahness">Details</a>. </center> <p></p> <h2>Neopets</h2> <center>NEOPETS and all related indicia are trademarks of <a href="/aboutus.phtml">Neopets, Inc.,</a>© 1999-2011.® denotes Reg. US Pat. & TM Office. All rights reserved. <a href="/privacy.phtml"> PRIVACY POLICY</a> | <a href="/safetytips.phtml">Safety Tips</a> | <a href="/contact.phtml">Contact Us</a> | <a href="/aboutus.phtml">About Us</a> | <a href="/presskit_form.phtml">Press Kit</a> Use of this site signifies your acceptance of the <a href="/terms.phtml">Terms and Conditions</a> </center> <p></p> </div> Version 2 <style> #layoutdesignandcodingbypatternmatrix { } #donotsteal { } .sf, .sf a { display: none; } body { background: #fff; text-align: left; color: #222; font: 8.5pt verdana; line-height: 15px; } table { background: #000; } a:link, a:active, a:visited { text-decoration: none; font-weight: bold; color: #d546a8; } a:hover { color: #509bc4; } a.nav:active, a.nav:visited, a.nav:link { display: block; text-decoration: none; font: 8pt verdana; padding: 4px; margin-bottom: 1px; letter-spacing: 1px; background: transparent; text-align: center; text-transform: uppercase; color: #8777d3; border-right: 10px solid #8777d3; border-left: 10px solid #8777d3; } a.nav:hover { color: #71d6dc; border-right: 10px solid #71d6dc; border-left: 10px solid #71d6dc; } b { color: #0032c7; font-weight: bold; } i { color: #854ab2; } h1 { font: 11pt tahoma; margin: 0px; margin-top: 0px; margin-bottom: 5px; line-height: 20px; color: #ffffff; background: #6587ef; letter-spacing: 3px; font-weight: bold; text-align: left; padding-left: 3px; } h2 { font: 8pt tahoma; margin: 0px; margin-top: 5px; margin-bottom: 5px; line-height: 15px; color: #a07ecc; border-bottom: 3px solid #b096d6; letter-spacing: 3px; font-weight: bold; text-align: right; padding-right: 3px; } h3 { font: 8pt tahoma; margin: 0px; margin-top: 5px; margin-bottom: 5px; line-height: 15px; color: #e27af4; border-bottom: 3px solid #e48cf6; letter-spacing: 3px; font-weight: bold; text-align: left; padding-left: 3px; } #topimage { margin-top: 10px; margin-bottom: 10px; left: 285px; width: 700px; padding: 5px; background: #fff; overflow: auto; } #middle { top: 200px; left: 285px; width: 710px; height: 380px; background: #fff; overflow: hidden; } .page { width: 700px; height: 370px; overflow: auto; padding: 5px; } #bigside { width: 150; left: 120px; top: 24px; padding: 5px; background: #fff; } </style> <img style="position: fixed; right: 0px; bottom: 0px; overflow: hidden; z-index: -1; border: 0px;" src="http://img193.imageshack.us/img193/8789/leftb.png"><img style="position: fixed; left: 0px; bottom: 0px; overflow: hidden; z-index: -1; border: 0px;" src="http://img51.imageshack.us/img51/7950/rightbt.png"><div id="bigside" style="position: absolute;"> <a href="/" class="nav">neopets</a> <a href="#one" class="nav">link</a> <a href="#two" class="nav">link</a> <a href="#three" class="nav">link</a> <a href="#credits" class="nav">Credits</a> </div> <div id="topimage" style="position: absolute;"> <a name="top"></a> <img src="http://img201.imageshack.us/img201/6162/bannertopa.png" border="0"> </div> <div id="middle" style="position: absolute;"> <a name="one"></a> <div class="page"> <h1>header</h1> <b>Lorem</b> ipsum <i>dolor</i> amet, <a href="/">consectetur</a> adipiscing elit. Morbi vitae mi non neque suscipit pretium. Cras felis arcu, tempor et luctus a, sodales a lorem. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Donec vitae purus eu neque scelerisque mattis vitae a enim. Mauris purus nisl, blandit ac porta id, aliquam ac urna. Morbi dolor velit, iaculis non ultrices sit amet, placerat dignissim nulla. In eleifend congue turpis, id tincidunt nunc pharetra in. <p></p> <h2>Header 2</h2> In hac habitasse platea dictumst. Sed tristique purus non ligula commodo non pretium velit venenatis. Praesent massa dolor, malesuada nec sollicitudin ac, porta vulputate metus. Vivamus non nisl at felis porttitor aliquet. Nullam quis volutpat nisl. Praesent venenatis tempor erat, vel pellentesque enim semper volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Proin pellentesque pulvinar aliquam. Nullam cursus lacinia erat, ut venenatis nibh vehicula at. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean lacinia ullamcorper orci, nec fringilla ligula luctus quis. <p></p> <h3>Header 3</h3> Morbi et posuere nunc. Donec rhoncus malesuada accumsan. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Morbi eu justo id lorem luctus fringilla sed nec odio. Praesent volutpat convallis erat, at malesuada libero tincidunt vel. Phasellus sollicitudin mi at nisi elementum euismod at ut purus. Donec volutpat nisl eget nisi aliquet eu luctus urna pretium. <p></p> <center><b>To save please zoom out 2/3 times (ctrl & -) and (ctrl & +) to zoom right back.</b></center> <p></p> </div> <p></p> <a name="two"></a> <div class="page"> <h1>header</h1> <b>Lorem</b> ipsum <i>dolor</i> amet, <a href="/">consectetur</a> adipiscing elit. Morbi vitae mi non neque suscipit pretium. Cras felis arcu, tempor et luctus a, sodales a lorem. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Donec vitae purus eu neque scelerisque mattis vitae a enim. Mauris purus nisl, blandit ac porta id, aliquam ac urna. Morbi dolor velit, iaculis non ultrices sit amet, placerat dignissim nulla. In eleifend congue turpis, id tincidunt nunc pharetra in. <p></p> <h2>Header 2</h2> In hac habitasse platea dictumst. Sed tristique purus non ligula commodo non pretium velit venenatis. Praesent massa dolor, malesuada nec sollicitudin ac, porta vulputate metus. Vivamus non nisl at felis porttitor aliquet. Nullam quis volutpat nisl. Praesent venenatis tempor erat, vel pellentesque enim semper volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Proin pellentesque pulvinar aliquam. Nullam cursus lacinia erat, ut venenatis nibh vehicula at. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean lacinia ullamcorper orci, nec fringilla ligula luctus quis. <p></p> </div> <p></p> <a name="three"></a> <div class="page"> <h1>header</h1> <b>Lorem</b> ipsum <i>dolor</i> amet, <a href="/">consectetur</a> adipiscing elit. Morbi vitae mi non neque suscipit pretium. Cras felis arcu, tempor et luctus a, sodales a lorem. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Donec vitae purus eu neque scelerisque mattis vitae a enim. Mauris purus nisl, blandit ac porta id, aliquam ac urna. Morbi dolor velit, iaculis non ultrices sit amet, placerat dignissim nulla. In eleifend congue turpis, id tincidunt nunc pharetra in. <p></p> <h3>Header 3</h3> Morbi et posuere nunc. Donec rhoncus malesuada accumsan. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Morbi eu justo id lorem luctus fringilla sed nec odio. Praesent volutpat convallis erat, at malesuada libero tincidunt vel. Phasellus sollicitudin mi at nisi elementum euismod at ut purus. Donec volutpat nisl eget nisi aliquet eu luctus urna pretium. <p></p> </div> <p></p> <a name="credits"></a> <div class="page"> <h1>Credits</h1> <center> <a href="/~oppsh"><img src="http://i1252.photobucket.com/albums/hh575/faeriemallowpuffs/ggggggabc.gif"></a> <br>Images by Neopets. <br>Textures/Brushes from dA and <a href="/~liahness">Details</a>. </center> <p></p> <h2>Neopets</h2> <center>NEOPETS and all related indicia are trademarks of <a href="/aboutus.phtml">Neopets, Inc.,</a>© 1999-2011.® denotes Reg. US Pat. & TM Office. All rights reserved. <a href="/privacy.phtml"> PRIVACY POLICY</a> | <a href="/safetytips.phtml">Safety Tips</a> | <a href="/contact.phtml">Contact Us</a> | <a href="/aboutus.phtml">About Us</a> | <a href="/presskit_form.phtml">Press Kit</a> Use of this site signifies your acceptance of the <a href="/terms.phtml">Terms and Conditions</a> </center> <p></p> </div> </div>		Version 1 <style> #layoutdesignandcodingbypatternmatrix { } #donotsteal { } .sf, .sf a { display: none; } body { background: #fff; text-align: left; color: #222; font: 8.5pt verdana; line-height: 15px; } table { background: #000; } a:link, a:active, a:visited { text-decoration: none; font-weight: bold; color: #c83ec0; } a:hover { color: #f6d5e6; } a.nav:active, a.nav:visited, a.nav:link { display: block; text-decoration: none; font: 8pt verdana; padding: 4px; margin-bottom: 1px; letter-spacing: 1px; background: transparent; text-align: center; text-transform: uppercase; color: #bf46ed; border-right: 10px solid #bf46ed; border-left: 10px solid #bf46ed; } a.nav:hover { color: #ef90f8; border-right: 10px solid #ef90f8; border-left: 10px solid #ef90f8; } b { color: #930cca; font-weight: bold; } i { color: #7da3fe; } h1 { font: 11pt tahoma; margin: 0px; margin-top: 0px; margin-bottom: 5px; line-height: 20px; color: #ffffff; background: #d38cfa; border: 1px solid #d38cfa; letter-spacing: 3px; font-weight: bold; text-align: left; padding-left: 3px; } h2 { font: 8pt tahoma; margin: 0px; margin-top: 5px; margin-bottom: 5px; line-height: 15px; color: #e05cea; border-bottom: 3px solid #e05cea; letter-spacing: 3px; font-weight: bold; text-align: right; padding-right: 3px; } h3 { font: 8pt tahoma; margin: 0px; margin-top: 5px; margin-bottom: 5px; line-height: 15px; color: #ed978f; border-bottom: 3px solid #ed978f; letter-spacing: 3px; font-weight: bold; text-align: left; padding-left: 3px; } #topimage { margin-top: 10px; margin-bottom: 10px; left: 285px; width: 700px; padding: 5px; background: #fff; overflow: auto; } #middle { top: 200px; left: 285px; width: 700px; padding: 5px; background: #fff; overflow: auto; margin-bottom: 10px; } #bigside { width: 150; left: 120px; top: 24px; padding: 5px; background: #fff; } </style> <img style="position: fixed; right: 0px; top: 0px; overflow: hidden; z-index: -1; border: 0px;" src="http://img805.imageshack.us/img805/6221/castleleft.png"><img style="position: fixed; left: -50px; top: 0px; overflow: hidden; z-index: -1; border: 0px;" src="http://img585.imageshack.us/img585/4110/castleright.png"><div id="bigside" style="position: fixed;"> <a href="/" class="nav">neopets</a> <a href="#one" class="nav">link</a> <a href="#two" class="nav">link</a> <a href="#three" class="nav">link</a> <a href="#credits" class="nav">Credits</a> </div> <div id="topimage" style="position: absolute;"> <a name="top"></a> <img src="http://img827.imageshack.us/img827/751/castletopa.png" border="0"> </div> <div id="middle" style="position: absolute;"> <a name="one"></a> <h1> <a href="#top"><img src="http://i42.tinypic.com/213kccg.jpg" border="0"></a> header</h1> <b>Lorem</b> ipsum <i>dolor</i> amet, <a href="/">consectetur</a> adipiscing elit. Morbi vitae mi non neque suscipit pretium. Cras felis arcu, tempor et luctus a, sodales a lorem. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Donec vitae purus eu neque scelerisque mattis vitae a enim. Mauris purus nisl, blandit ac porta id, aliquam ac urna. Morbi dolor velit, iaculis non ultrices sit amet, placerat dignissim nulla. In eleifend congue turpis, id tincidunt nunc pharetra in. <p></p> <a name="two"></a> <h2>Header 2</h2> In hac habitasse platea dictumst. Sed tristique purus non ligula commodo non pretium velit venenatis. Praesent massa dolor, malesuada nec sollicitudin ac, porta vulputate metus. Vivamus non nisl at felis porttitor aliquet. Nullam quis volutpat nisl. Praesent venenatis tempor erat, vel pellentesque enim semper volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Proin pellentesque pulvinar aliquam. Nullam cursus lacinia erat, ut venenatis nibh vehicula at. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean lacinia ullamcorper orci, nec fringilla ligula luctus quis. <p></p> <a name="three"></a> <h3>Header 3</h3> Morbi et posuere nunc. Donec rhoncus malesuada accumsan. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Morbi eu justo id lorem luctus fringilla sed nec odio. Praesent volutpat convallis erat, at malesuada libero tincidunt vel. Phasellus sollicitudin mi at nisi elementum euismod at ut purus. Donec volutpat nisl eget nisi aliquet eu luctus urna pretium. <p></p> <center><b>To save please zoom out 2/3 times (ctrl & -) and (ctrl & +) to zoom right back.</b></center> <p></p> <a name="credits"></a> <h1> <a href="#top"><img src="http://i42.tinypic.com/213kccg.jpg" border="0"></a> Credits</h1> <center> <a href="/~oppsh"><img src="http://i1252.photobucket.com/albums/hh575/faeriemallowpuffs/ggggggabc.gif"></a> <br>Images by Neopets. <br>Textures/Brushes from dA and <a href="/~liahness">Details</a>. </center> <p></p> <h2>Neopets</h2> <center>NEOPETS and all related indicia are trademarks of <a href="/aboutus.phtml">Neopets, Inc.,</a>© 1999-2011.® denotes Reg. US Pat. & TM Office. All rights reserved. <a href="/privacy.phtml"> PRIVACY POLICY</a> | <a href="/safetytips.phtml">Safety Tips</a> | <a href="/contact.phtml">Contact Us</a> | <a href="/aboutus.phtml">About Us</a> | <a href="/presskit_form.phtml">Press Kit</a> Use of this site signifies your acceptance of the <a href="/terms.phtml">Terms and Conditions</a> </center> <p></p> </div> Version 2 <style> #layoutdesignandcodingbypatternmatrix { } #donotsteal { } .sf, .sf a { display: none; } body { background: #fff; text-align: left; color: #222; font: 8.5pt verdana; line-height: 15px; } table { background: #000; } a:link, a:active, a:visited { text-decoration: none; font-weight: bold; color: #c83ec0; } a:hover { color: #f6d5e6; } a.nav:active, a.nav:visited, a.nav:link { display: block; text-decoration: none; font: 8pt verdana; padding: 4px; margin-bottom: 1px; letter-spacing: 1px; background: transparent; text-align: center; text-transform: uppercase; color: #bf46ed; border-right: 10px solid #bf46ed; border-left: 10px solid #bf46ed; } a.nav:hover { color: #ef90f8; border-right: 10px solid #ef90f8; border-left: 10px solid #ef90f8; } b { color: #930cca; font-weight: bold; } i { color: #7da3fe; } h1 { font: 11pt tahoma; margin: 0px; margin-top: 0px; margin-bottom: 5px; line-height: 20px; color: #ffffff; background: #d38cfa; border: 1px solid #d38cfa; letter-spacing: 3px; font-weight: bold; text-align: left; padding-left: 3px; } h2 { font: 8pt tahoma; margin: 0px; margin-top: 5px; margin-bottom: 5px; line-height: 15px; color: #e05cea; border-bottom: 3px solid #e05cea; letter-spacing: 3px; font-weight: bold; text-align: right; padding-right: 3px; } h3 { font: 8pt tahoma; margin: 0px; margin-top: 5px; margin-bottom: 5px; line-height: 15px; color: #ed978f; border-bottom: 3px solid #ed978f; letter-spacing: 3px; font-weight: bold; text-align: left; padding-left: 3px; } #topimage { margin-top: 10px; margin-bottom: 10px; left: 285px; width: 700px; padding: 5px; background: #fff; overflow: auto; } #middle { top: 200px; left: 285px; width: 710px; height: 380px; background: #fff; overflow: hidden; } .page { width: 700px; height: 370px; overflow: auto; padding: 5px; } #bigside { width: 150; left: 120px; top: 24px; padding: 5px; background: #fff; } </style> <img style="position: fixed; right: 0px; top: 0px; overflow: hidden; z-index: -1; border: 0px;" src="http://img805.imageshack.us/img805/6221/castleleft.png"><img style="position: fixed; left: -50px; top: 0px; overflow: hidden; z-index: -1; border: 0px;" src="http://img585.imageshack.us/img585/4110/castleright.png"><div id="bigside" style="position: absolute;"> <a href="/" class="nav">neopets</a> <a href="#one" class="nav">link</a> <a href="#two" class="nav">link</a> <a href="#three" class="nav">link</a> <a href="#credits" class="nav">Credits</a> </div> <div id="topimage" style="position: absolute;"> <a name="top"></a> <img src="http://img827.imageshack.us/img827/751/castletopa.png" border="0"> </div> <div id="middle" style="position: absolute;"> <a name="one"></a> <div class="page"> <h1>header</h1> <b>Lorem</b> ipsum <i>dolor</i> amet, <a href="/">consectetur</a> adipiscing elit. Morbi vitae mi non neque suscipit pretium. Cras felis arcu, tempor et luctus a, sodales a lorem. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Donec vitae purus eu neque scelerisque mattis vitae a enim. Mauris purus nisl, blandit ac porta id, aliquam ac urna. Morbi dolor velit, iaculis non ultrices sit amet, placerat dignissim nulla. In eleifend congue turpis, id tincidunt nunc pharetra in. <p></p> <h2>Header 2</h2> In hac habitasse platea dictumst. Sed tristique purus non ligula commodo non pretium velit venenatis. Praesent massa dolor, malesuada nec sollicitudin ac, porta vulputate metus. Vivamus non nisl at felis porttitor aliquet. Nullam quis volutpat nisl. Praesent venenatis tempor erat, vel pellentesque enim semper volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Proin pellentesque pulvinar aliquam. Nullam cursus lacinia erat, ut venenatis nibh vehicula at. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean lacinia ullamcorper orci, nec fringilla ligula luctus quis. <p></p> <h3>Header 3</h3> Morbi et posuere nunc. Donec rhoncus malesuada accumsan. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Morbi eu justo id lorem luctus fringilla sed nec odio. Praesent volutpat convallis erat, at malesuada libero tincidunt vel. Phasellus sollicitudin mi at nisi elementum euismod at ut purus. Donec volutpat nisl eget nisi aliquet eu luctus urna pretium. <p></p> <center><b>To save please zoom out 2/3 times (ctrl & -) and (ctrl & +) to zoom right back.</b></center> <p></p> </div> <p></p> <a name="two"></a> <div class="page"> <h1>header</h1> <b>Lorem</b> ipsum <i>dolor</i> amet, <a href="/">consectetur</a> adipiscing elit. Morbi vitae mi non neque suscipit pretium. Cras felis arcu, tempor et luctus a, sodales a lorem. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Donec vitae purus eu neque scelerisque mattis vitae a enim. Mauris purus nisl, blandit ac porta id, aliquam ac urna. Morbi dolor velit, iaculis non ultrices sit amet, placerat dignissim nulla. In eleifend congue turpis, id tincidunt nunc pharetra in. <p></p> <h2>Header 2</h2> In hac habitasse platea dictumst. Sed tristique purus non ligula commodo non pretium velit venenatis. Praesent massa dolor, malesuada nec sollicitudin ac, porta vulputate metus. Vivamus non nisl at felis porttitor aliquet. Nullam quis volutpat nisl. Praesent venenatis tempor erat, vel pellentesque enim semper volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Proin pellentesque pulvinar aliquam. Nullam cursus lacinia erat, ut venenatis nibh vehicula at. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean lacinia ullamcorper orci, nec fringilla ligula luctus quis. <p></p> </div> <p></p> <a name="three"></a> <div class="page"> <h1>header</h1> <b>Lorem</b> ipsum <i>dolor</i> amet, <a href="/">consectetur</a> adipiscing elit. Morbi vitae mi non neque suscipit pretium. Cras felis arcu, tempor et luctus a, sodales a lorem. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Donec vitae purus eu neque scelerisque mattis vitae a enim. Mauris purus nisl, blandit ac porta id, aliquam ac urna. Morbi dolor velit, iaculis non ultrices sit amet, placerat dignissim nulla. In eleifend congue turpis, id tincidunt nunc pharetra in. <p></p> <h3>Header 3</h3> Morbi et posuere nunc. Donec rhoncus malesuada accumsan. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Morbi eu justo id lorem luctus fringilla sed nec odio. Praesent volutpat convallis erat, at malesuada libero tincidunt vel. Phasellus sollicitudin mi at nisi elementum euismod at ut purus. Donec volutpat nisl eget nisi aliquet eu luctus urna pretium. <p></p> </div> <p></p> <a name="credits"></a> <div class="page"> <h1>Credits</h1> <center> <a href="/~oppsh"><img src="http://i1252.photobucket.com/albums/hh575/faeriemallowpuffs/ggggggabc.gif"></a> <br>Images by Neopets. <br>Textures/Brushes from dA and <a href="/~liahness">Details</a>. </center> <p></p> <h2>Neopets</h2> <center>NEOPETS and all related indicia are trademarks of <a href="/aboutus.phtml">Neopets, Inc.,</a>© 1999-2011.® denotes Reg. US Pat. & TM Office. All rights reserved. <a href="/privacy.phtml"> PRIVACY POLICY</a> | <a href="/safetytips.phtml">Safety Tips</a> | <a href="/contact.phtml">Contact Us</a> | <a href="/aboutus.phtml">About Us</a> | <a href="/presskit_form.phtml">Press Kit</a> Use of this site signifies your acceptance of the <a href="/terms.phtml">Terms and Conditions</a> </center> <p></p> </div> </div>		Version 1 <style> #layoutdesignandcodingbypatternmatrix { } #donotsteal { } .sf, .sf a { display: none; } body { background: #fff; text-align: left; color: #222; font: 8.5pt verdana; line-height: 15px; } table { background: #000; } a:link, a:active, a:visited { text-decoration: none; font-weight: bold; color: #ed49d0; } a:hover { color: #efa1c8; } a.nav:active, a.nav:visited, a.nav:link { display: block; text-decoration: none; font: 8pt verdana; padding: 4px; margin-bottom: 1px; letter-spacing: 1px; background: transparent; text-align: center; text-transform: uppercase; color: #f70f72; border-right: 10px solid #f70f72; border-left: 10px solid #f70f72; } a.nav:hover { color: #fb8bb0; border-right: 10px solid #fb8bb0; border-left: 10px solid #fb8bb0; } b { color: #e20240; font-weight: bold; } i { color: #bd189a; } h1 { font: 11pt tahoma; margin: 0px; margin-top: 0px; margin-bottom: 5px; line-height: 20px; color: #ffffff; background: #ec1899; border: 1px solid #ec1899; letter-spacing: 3px; font-weight: bold; text-align: left; padding-left: 3px; } h2 { font: 8pt tahoma; margin: 0px; margin-top: 5px; margin-bottom: 5px; line-height: 15px; color: #f866de; border-bottom: 3px solid #f866de; letter-spacing: 3px; font-weight: bold; text-align: right; padding-right: 3px; } h3 { font: 8pt tahoma; margin: 0px; margin-top: 5px; margin-bottom: 5px; line-height: 15px; color: #da49d0; border-bottom: 3px solid #da49d0; letter-spacing: 3px; font-weight: bold; text-align: left; padding-left: 3px; } #topimage { margin-top: 10px; margin-bottom: 10px; left: 285px; width: 700px; padding: 5px; background: #fff; overflow: auto; } #middle { top: 200px; left: 285px; width: 700px; padding: 5px; background: #fff; overflow: auto; margin-bottom: 10px; } #bigside { width: 150; left: 120px; top: 24px; padding: 5px; background: #fff; } </style> <img style="position: fixed; right: 0px; bottom: 0px; overflow: hidden; z-index: -1; border: 0px;" src="http://img694.imageshack.us/img694/1227/candylandlefta.png"><img style="position: fixed; left: -50px; bottom: 0px; overflow: hidden; z-index: -1; border: 0px;" src="http://img822.imageshack.us/img822/1374/candylandrighta.png"><div id="bigside" style="position: fixed;"> <a href="/" class="nav">neopets</a> <a href="#one" class="nav">link</a> <a href="#two" class="nav">link</a> <a href="#three" class="nav">link</a> <a href="#credits" class="nav">Credits</a> </div> <div id="topimage" style="position: absolute;"> <a name="top"></a> <img src="http://img96.imageshack.us/img96/1782/candylandtop.png" border="0"> </div> <div id="middle" style="position: absolute;"> <a name="one"></a> <h1> <a href="#top"><img src="http://i42.tinypic.com/213kccg.jpg" border="0"></a> header</h1> <b>Lorem</b> ipsum <i>dolor</i> amet, <a href="/">consectetur</a> adipiscing elit. Morbi vitae mi non neque suscipit pretium. Cras felis arcu, tempor et luctus a, sodales a lorem. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Donec vitae purus eu neque scelerisque mattis vitae a enim. Mauris purus nisl, blandit ac porta id, aliquam ac urna. Morbi dolor velit, iaculis non ultrices sit amet, placerat dignissim nulla. In eleifend congue turpis, id tincidunt nunc pharetra in. <p></p> <a name="two"></a> <h2>Header 2</h2> In hac habitasse platea dictumst. Sed tristique purus non ligula commodo non pretium velit venenatis. Praesent massa dolor, malesuada nec sollicitudin ac, porta vulputate metus. Vivamus non nisl at felis porttitor aliquet. Nullam quis volutpat nisl. Praesent venenatis tempor erat, vel pellentesque enim semper volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Proin pellentesque pulvinar aliquam. Nullam cursus lacinia erat, ut venenatis nibh vehicula at. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean lacinia ullamcorper orci, nec fringilla ligula luctus quis. <p></p> <a name="three"></a> <h3>Header 3</h3> Morbi et posuere nunc. Donec rhoncus malesuada accumsan. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Morbi eu justo id lorem luctus fringilla sed nec odio. Praesent volutpat convallis erat, at malesuada libero tincidunt vel. Phasellus sollicitudin mi at nisi elementum euismod at ut purus. Donec volutpat nisl eget nisi aliquet eu luctus urna pretium. <p></p> <center><b>To save please zoom out 2/3 times (ctrl & -) and (ctrl & +) to zoom right back.</b></center> <p></p> <a name="credits"></a> <h1> <a href="#top"><img src="http://i42.tinypic.com/213kccg.jpg" border="0"></a> Credits</h1> <center> <a href="/~oppsh"><img src="http://i1252.photobucket.com/albums/hh575/faeriemallowpuffs/ggggggabc.gif"></a> <br>Images by Neopets. <br>Textures/Brushes from dA and <a href="/~liahness">Details</a>. </center> <p></p> <h2>Neopets</h2> <center>NEOPETS and all related indicia are trademarks of <a href="/aboutus.phtml">Neopets, Inc.,</a>© 1999-2011.® denotes Reg. US Pat. & TM Office. All rights reserved. <a href="/privacy.phtml"> PRIVACY POLICY</a> | <a href="/safetytips.phtml">Safety Tips</a> | <a href="/contact.phtml">Contact Us</a> | <a href="/aboutus.phtml">About Us</a> | <a href="/presskit_form.phtml">Press Kit</a> Use of this site signifies your acceptance of the <a href="/terms.phtml">Terms and Conditions</a> </center> <p></p> </div> Version 2<style> #layoutdesignandcodingbypatternmatrix { } #donotsteal { } .sf, .sf a { display: none; } body { background: #fff; text-align: left; color: #222; font: 8.5pt verdana; line-height: 15px; } table { background: #000; } a:link, a:active, a:visited { text-decoration: none; font-weight: bold; color: #ed49d0; } a:hover { color: #efa1c8; } a.nav:active, a.nav:visited, a.nav:link { display: block; text-decoration: none; font: 8pt verdana; padding: 4px; margin-bottom: 1px; letter-spacing: 1px; background: transparent; text-align: center; text-transform: uppercase; color: #f70f72; border-right: 10px solid #f70f72; border-left: 10px solid #f70f72; } a.nav:hover { color: #fb8bb0; border-right: 10px solid #fb8bb0; border-left: 10px solid #fb8bb0; } b { color: #e20240; font-weight: bold; } i { color: #bd189a; } h1 { font: 11pt tahoma; margin: 0px; margin-top: 0px; margin-bottom: 5px; line-height: 20px; color: #ffffff; background: #ec1899; border: 1px solid #ec1899; letter-spacing: 3px; font-weight: bold; text-align: left; padding-left: 3px; } h2 { font: 8pt tahoma; margin: 0px; margin-top: 5px; margin-bottom: 5px; line-height: 15px; color: #f866de; border-bottom: 3px solid #f866de; letter-spacing: 3px; font-weight: bold; text-align: right; padding-right: 3px; } h3 { font: 8pt tahoma; margin: 0px; margin-top: 5px; margin-bottom: 5px; line-height: 15px; color: #da49d0; border-bottom: 3px solid #da49d0; letter-spacing: 3px; font-weight: bold; text-align: left; padding-left: 3px; } #topimage { margin-top: 10px; margin-bottom: 10px; left: 285px; width: 700px; padding: 5px; background: #fff; overflow: auto; } #middle { top: 200px; left: 285px; width: 710px; height: 380px; background: #fff; overflow: hidden; } .page { width: 700px; height: 370px; overflow: auto; padding: 5px; } #bigside { width: 150; left: 120px; top: 24px; padding: 5px; background: #fff; } </style> <img style="position: fixed; right: 0px; bottom: 0px; overflow: hidden; z-index: -1; border: 0px;" src="http://img694.imageshack.us/img694/1227/candylandlefta.png"><img style="position: fixed; left: -50px; bottom: 0px; overflow: hidden; z-index: -1; border: 0px;" src="http://img822.imageshack.us/img822/1374/candylandrighta.png"><div id="bigside" style="position: absolute;"> <a href="/" class="nav">neopets</a> <a href="#one" class="nav">link</a> <a href="#two" class="nav">link</a> <a href="#three" class="nav">link</a> <a href="#credits" class="nav">Credits</a> </div> <div id="topimage" style="position: absolute;"> <a name="top"></a> <img src="http://img96.imageshack.us/img96/1782/candylandtop.png" border="0"> </div> <div id="middle" style="position: absolute;"> <a name="one"></a> <div class="page"> <h1>header</h1> <b>Lorem</b> ipsum <i>dolor</i> amet, <a href="/">consectetur</a> adipiscing elit. Morbi vitae mi non neque suscipit pretium. Cras felis arcu, tempor et luctus a, sodales a lorem. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Donec vitae purus eu neque scelerisque mattis vitae a enim. Mauris purus nisl, blandit ac porta id, aliquam ac urna. Morbi dolor velit, iaculis non ultrices sit amet, placerat dignissim nulla. In eleifend congue turpis, id tincidunt nunc pharetra in. <p></p> <h2>Header 2</h2> In hac habitasse platea dictumst. Sed tristique purus non ligula commodo non pretium velit venenatis. Praesent massa dolor, malesuada nec sollicitudin ac, porta vulputate metus. Vivamus non nisl at felis porttitor aliquet. Nullam quis volutpat nisl. Praesent venenatis tempor erat, vel pellentesque enim semper volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Proin pellentesque pulvinar aliquam. Nullam cursus lacinia erat, ut venenatis nibh vehicula at. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean lacinia ullamcorper orci, nec fringilla ligula luctus quis. <p></p> <h3>Header 3</h3> Morbi et posuere nunc. Donec rhoncus malesuada accumsan. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Morbi eu justo id lorem luctus fringilla sed nec odio. Praesent volutpat convallis erat, at malesuada libero tincidunt vel. Phasellus sollicitudin mi at nisi elementum euismod at ut purus. Donec volutpat nisl eget nisi aliquet eu luctus urna pretium. <p></p> <center><b>To save please zoom out 2/3 times (ctrl & -) and (ctrl & +) to zoom right back.</b></center> <p></p> </div> <p></p> <a name="two"></a> <div class="page"> <h1>header</h1> <b>Lorem</b> ipsum <i>dolor</i> amet, <a href="/">consectetur</a> adipiscing elit. Morbi vitae mi non neque suscipit pretium. Cras felis arcu, tempor et luctus a, sodales a lorem. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Donec vitae purus eu neque scelerisque mattis vitae a enim. Mauris purus nisl, blandit ac porta id, aliquam ac urna. Morbi dolor velit, iaculis non ultrices sit amet, placerat dignissim nulla. In eleifend congue turpis, id tincidunt nunc pharetra in. <p></p> <h2>Header 2</h2> In hac habitasse platea dictumst. Sed tristique purus non ligula commodo non pretium velit venenatis. Praesent massa dolor, malesuada nec sollicitudin ac, porta vulputate metus. Vivamus non nisl at felis porttitor aliquet. Nullam quis volutpat nisl. Praesent venenatis tempor erat, vel pellentesque enim semper volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Proin pellentesque pulvinar aliquam. Nullam cursus lacinia erat, ut venenatis nibh vehicula at. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean lacinia ullamcorper orci, nec fringilla ligula luctus quis. <p></p> </div> <p></p> <a name="three"></a> <div class="page"> <h1>header</h1> <b>Lorem</b> ipsum <i>dolor</i> amet, <a href="/">consectetur</a> adipiscing elit. Morbi vitae mi non neque suscipit pretium. Cras felis arcu, tempor et luctus a, sodales a lorem. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Donec vitae purus eu neque scelerisque mattis vitae a enim. Mauris purus nisl, blandit ac porta id, aliquam ac urna. Morbi dolor velit, iaculis non ultrices sit amet, placerat dignissim nulla. In eleifend congue turpis, id tincidunt nunc pharetra in. <p></p> <h3>Header 3</h3> Morbi et posuere nunc. Donec rhoncus malesuada accumsan. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Morbi eu justo id lorem luctus fringilla sed nec odio. Praesent volutpat convallis erat, at malesuada libero tincidunt vel. Phasellus sollicitudin mi at nisi elementum euismod at ut purus. Donec volutpat nisl eget nisi aliquet eu luctus urna pretium. <p></p> </div> <p></p> <a name="credits"></a> <div class="page"> <h1>Credits</h1> <center> <a href="/~oppsh"><img src="http://i1252.photobucket.com/albums/hh575/faeriemallowpuffs/ggggggabc.gif"></a> <br>Images by Neopets. <br>Textures/Brushes from dA and <a href="/~liahness">Details</a>. </center> <p></p> <h2>Neopets</h2> <center>NEOPETS and all related indicia are trademarks of <a href="/aboutus.phtml">Neopets, Inc.,</a>© 1999-2011.® denotes Reg. US Pat. & TM Office. All rights reserved. <a href="/privacy.phtml"> PRIVACY POLICY</a> | <a href="/safetytips.phtml">Safety Tips</a> | <a href="/contact.phtml">Contact Us</a> | <a href="/aboutus.phtml">About Us</a> | <a href="/presskit_form.phtml">Press Kit</a> Use of this site signifies your acceptance of the <a href="/terms.phtml">Terms and Conditions</a> </center> <p></p> </div> </div>
	Version 1 <style> #layoutdesignandcodingbypatternmatrix { } #donotsteal { } .sf, .sf a { display: none; } body { background: #fff; text-align: left; color: #222; font: 8.5pt verdana; line-height: 15px; } table { background: #000; } a:link, a:active, a:visited { text-decoration: none; font-weight: bold; color: #f7a299; } a:hover { color: #f9c683; } a.nav:active, a.nav:visited, a.nav:link { display: block; text-decoration: none; font: 8pt verdana; padding: 4px; margin-bottom: 1px; letter-spacing: 1px; background: transparent; text-align: center; text-transform: uppercase; color: #8a0c7c; border-right: 10px solid #8a0c7c; border-left: 10px solid #8a0c7c; } a.nav:hover { color: #df77db; border-right: 10px solid #df77db; border-left: 10px solid #df77db; } b { color: #ec2480; font-weight: bold; } i { color: #2a036d; } h1 { font: 11pt tahoma; margin: 0px; margin-top: 0px; margin-bottom: 5px; line-height: 20px; color: #ffffff; background: #bc53c5; letter-spacing: 3px; font-weight: bold; text-align: left; padding-left: 3px; } h2 { font: 8pt tahoma; margin: 0px; margin-top: 5px; margin-bottom: 5px; line-height: 15px; color: #ea7196; border-bottom: 3px solid #ea7196; letter-spacing: 3px; font-weight: bold; text-align: right; padding-right: 3px; } h3 { font: 8pt tahoma; margin: 0px; margin-top: 5px; margin-bottom: 5px; line-height: 15px; color: #f9a43c; border-bottom: 3px solid #f9a43c; letter-spacing: 3px; font-weight: bold; text-align: left; padding-left: 3px; } #topimage { margin-top: 10px; margin-bottom: 10px; left: 285px; width: 700px; padding: 5px; background: #fff; overflow: auto; } #middle { top: 200px; left: 285px; width: 700px; padding: 5px; background: #fff; overflow: auto; margin-bottom: 10px; } #bigside { width: 150; left: 120px; top: 24px; padding: 5px; background: #fff; } </style> <img style="position: fixed; right: 0px; top: 0px; overflow: hidden; z-index: -1; border: 0px;" src="http://img521.imageshack.us/img521/1896/crashleft.png"><img style="position: fixed; left: 0px; top: 0px; overflow: hidden; z-index: -1; border: 0px;" src="http://img85.imageshack.us/img85/2580/crashright.png"><div id="bigside" style="position: fixed;"> <a href="/" class="nav">neopets</a> <a href="#one" class="nav">link</a> <a href="#two" class="nav">link</a> <a href="#three" class="nav">link</a> <a href="#credits" class="nav">Credits</a> </div> <div id="topimage" style="position: absolute;"> <a name="top"></a> <img src="http://img85.imageshack.us/img85/3337/crashtop.png" border="0"> </div> <div id="middle" style="position: absolute;"> <a name="one"></a> <h1> <a href="#top"><img src="http://i42.tinypic.com/213kccg.jpg" border="0"></a> header</h1> <b>Lorem</b> ipsum <i>dolor</i> amet, <a href="/">consectetur</a> adipiscing elit. Morbi vitae mi non neque suscipit pretium. Cras felis arcu, tempor et luctus a, sodales a lorem. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Donec vitae purus eu neque scelerisque mattis vitae a enim. Mauris purus nisl, blandit ac porta id, aliquam ac urna. Morbi dolor velit, iaculis non ultrices sit amet, placerat dignissim nulla. In eleifend congue turpis, id tincidunt nunc pharetra in. <p></p> <a name="two"></a> <h2>Header 2</h2> In hac habitasse platea dictumst. Sed tristique purus non ligula commodo non pretium velit venenatis. Praesent massa dolor, malesuada nec sollicitudin ac, porta vulputate metus. Vivamus non nisl at felis porttitor aliquet. Nullam quis volutpat nisl. Praesent venenatis tempor erat, vel pellentesque enim semper volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Proin pellentesque pulvinar aliquam. Nullam cursus lacinia erat, ut venenatis nibh vehicula at. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean lacinia ullamcorper orci, nec fringilla ligula luctus quis. <p></p> <a name="three"></a> <h3>Header 3</h3> Morbi et posuere nunc. Donec rhoncus malesuada accumsan. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Morbi eu justo id lorem luctus fringilla sed nec odio. Praesent volutpat convallis erat, at malesuada libero tincidunt vel. Phasellus sollicitudin mi at nisi elementum euismod at ut purus. Donec volutpat nisl eget nisi aliquet eu luctus urna pretium. <p></p> <center><b>To save please zoom out 2/3 times (ctrl & -) and (ctrl & +) to zoom right back.</b></center> <p></p> <a name="credits"></a> <h1> <a href="#top"><img src="http://i42.tinypic.com/213kccg.jpg" border="0"></a> Credits</h1> <center> <a href="/~oppsh"><img src="http://i1252.photobucket.com/albums/hh575/faeriemallowpuffs/ggggggabc.gif"></a> <br>Images by Neopets. <br>Textures/Brushes from dA and <a href="/~liahness">Details</a>. </center> <p></p> <h2>Neopets</h2> <center>NEOPETS and all related indicia are trademarks of <a href="/aboutus.phtml">Neopets, Inc.,</a>© 1999-2011.® denotes Reg. US Pat. & TM Office. All rights reserved. <a href="/privacy.phtml"> PRIVACY POLICY</a> | <a href="/safetytips.phtml">Safety Tips</a> | <a href="/contact.phtml">Contact Us</a> | <a href="/aboutus.phtml">About Us</a> | <a href="/presskit_form.phtml">Press Kit</a> Use of this site signifies your acceptance of the <a href="/terms.phtml">Terms and Conditions</a> </center> <p></p> </div> Version 2 <style> #layoutdesignandcodingbypatternmatrix { } #donotsteal { } .sf, .sf a { display: none; } body { background: #fff; text-align: left; color: #222; font: 8.5pt verdana; line-height: 15px; } table { background: #000; } a:link, a:active, a:visited { text-decoration: none; font-weight: bold; color: #f7a299; } a:hover { color: #f9c683; } a.nav:active, a.nav:visited, a.nav:link { display: block; text-decoration: none; font: 8pt verdana; padding: 4px; margin-bottom: 1px; letter-spacing: 1px; background: transparent; text-align: center; text-transform: uppercase; color: #8a0c7c; border-right: 10px solid #8a0c7c; border-left: 10px solid #8a0c7c; } a.nav:hover { color: #df77db; border-right: 10px solid #df77db; border-left: 10px solid #df77db; } b { color: #ec2480; font-weight: bold; } i { color: #2a036d; } h1 { font: 11pt tahoma; margin: 0px; margin-top: 0px; margin-bottom: 5px; line-height: 20px; color: #ffffff; background: #bc53c5; letter-spacing: 3px; font-weight: bold; text-align: left; padding-left: 3px; } h2 { font: 8pt tahoma; margin: 0px; margin-top: 5px; margin-bottom: 5px; line-height: 15px; color: #ea7196; border-bottom: 3px solid #ea7196; letter-spacing: 3px; font-weight: bold; text-align: right; padding-right: 3px; } h3 { font: 8pt tahoma; margin: 0px; margin-top: 5px; margin-bottom: 5px; line-height: 15px; color: #f9a43c; border-bottom: 3px solid #f9a43c; letter-spacing: 3px; font-weight: bold; text-align: left; padding-left: 3px; } #topimage { margin-top: 10px; margin-bottom: 10px; left: 285px; width: 700px; padding: 5px; background: #fff; overflow: auto; } #middle { top: 200px; left: 285px; width: 710px; height: 380px; background: #fff; overflow: hidden; } .page { width: 700px; height: 370px; overflow: auto; padding: 5px; } #bigside { width: 150; left: 120px; top: 24px; padding: 5px; background: #fff; } </style> <img style="position: fixed; right: 0px; top: 0px; overflow: hidden; z-index: -1; border: 0px;" src="http://img521.imageshack.us/img521/1896/crashleft.png"><img style="position: fixed; left: 0px; top: 0px; overflow: hidden; z-index: -1; border: 0px;" src="http://img85.imageshack.us/img85/2580/crashright.png"><div id="bigside" style="position: fixed;"> <a href="/" class="nav">neopets</a> <a href="#one" class="nav">link</a> <a href="#two" class="nav">link</a> <a href="#three" class="nav">link</a> <a href="#credits" class="nav">Credits</a> </div> <div id="topimage" style="position: absolute;"> <a name="top"></a> <img src="http://img85.imageshack.us/img85/3337/crashtop.png" border="0"> </div> <div id="middle" style="position: absolute;"> <a name="one"></a> <div class="page"> <h1>header</h1> <b>Lorem</b> ipsum <i>dolor</i> amet, <a href="/">consectetur</a> adipiscing elit. Morbi vitae mi non neque suscipit pretium. Cras felis arcu, tempor et luctus a, sodales a lorem. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Donec vitae purus eu neque scelerisque mattis vitae a enim. Mauris purus nisl, blandit ac porta id, aliquam ac urna. Morbi dolor velit, iaculis non ultrices sit amet, placerat dignissim nulla. In eleifend congue turpis, id tincidunt nunc pharetra in. <p></p> <h2>Header 2</h2> In hac habitasse platea dictumst. Sed tristique purus non ligula commodo non pretium velit venenatis. Praesent massa dolor, malesuada nec sollicitudin ac, porta vulputate metus. Vivamus non nisl at felis porttitor aliquet. Nullam quis volutpat nisl. Praesent venenatis tempor erat, vel pellentesque enim semper volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Proin pellentesque pulvinar aliquam. Nullam cursus lacinia erat, ut venenatis nibh vehicula at. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean lacinia ullamcorper orci, nec fringilla ligula luctus quis. <p></p> <h3>Header 3</h3> Morbi et posuere nunc. Donec rhoncus malesuada accumsan. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Morbi eu justo id lorem luctus fringilla sed nec odio. Praesent volutpat convallis erat, at malesuada libero tincidunt vel. Phasellus sollicitudin mi at nisi elementum euismod at ut purus. Donec volutpat nisl eget nisi aliquet eu luctus urna pretium. <p></p> <center><b>To save please zoom out 2/3 times (ctrl & -) and (ctrl & +) to zoom right back.</b></center> <p></p> </div> <p></p> <a name="two"></a> <div class="page"> <h1>header</h1> <b>Lorem</b> ipsum <i>dolor</i> amet, <a href="/">consectetur</a> adipiscing elit. Morbi vitae mi non neque suscipit pretium. Cras felis arcu, tempor et luctus a, sodales a lorem. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Donec vitae purus eu neque scelerisque mattis vitae a enim. Mauris purus nisl, blandit ac porta id, aliquam ac urna. Morbi dolor velit, iaculis non ultrices sit amet, placerat dignissim nulla. In eleifend congue turpis, id tincidunt nunc pharetra in. <p></p> <h2>Header 2</h2> In hac habitasse platea dictumst. Sed tristique purus non ligula commodo non pretium velit venenatis. Praesent massa dolor, malesuada nec sollicitudin ac, porta vulputate metus. Vivamus non nisl at felis porttitor aliquet. Nullam quis volutpat nisl. Praesent venenatis tempor erat, vel pellentesque enim semper volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Proin pellentesque pulvinar aliquam. Nullam cursus lacinia erat, ut venenatis nibh vehicula at. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean lacinia ullamcorper orci, nec fringilla ligula luctus quis. <p></p> </div> <p></p> <a name="three"></a> <div class="page"> <h1>header</h1> <b>Lorem</b> ipsum <i>dolor</i> amet, <a href="/">consectetur</a> adipiscing elit. Morbi vitae mi non neque suscipit pretium. Cras felis arcu, tempor et luctus a, sodales a lorem. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Donec vitae purus eu neque scelerisque mattis vitae a enim. Mauris purus nisl, blandit ac porta id, aliquam ac urna. Morbi dolor velit, iaculis non ultrices sit amet, placerat dignissim nulla. In eleifend congue turpis, id tincidunt nunc pharetra in. <p></p> <h3>Header 3</h3> Morbi et posuere nunc. Donec rhoncus malesuada accumsan. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Morbi eu justo id lorem luctus fringilla sed nec odio. Praesent volutpat convallis erat, at malesuada libero tincidunt vel. Phasellus sollicitudin mi at nisi elementum euismod at ut purus. Donec volutpat nisl eget nisi aliquet eu luctus urna pretium. <p></p> </div> <p></p> <a name="credits"></a> <div class="page"> <h1>Credits</h1> <center> <a href="/~oppsh"><img src="http://i1252.photobucket.com/albums/hh575/faeriemallowpuffs/ggggggabc.gif"></a> <br>Images by Neopets. <br>Textures/Brushes from dA and <a href="/~liahness">Details</a>. </center> <p></p> <h2>Neopets</h2> <center>NEOPETS and all related indicia are trademarks of <a href="/aboutus.phtml">Neopets, Inc.,</a>© 1999-2011.® denotes Reg. US Pat. & TM Office. All rights reserved. <a href="/privacy.phtml"> PRIVACY POLICY</a> | <a href="/safetytips.phtml">Safety Tips</a> | <a href="/contact.phtml">Contact Us</a> | <a href="/aboutus.phtml">About Us</a> | <a href="/presskit_form.phtml">Press Kit</a> Use of this site signifies your acceptance of the <a href="/terms.phtml">Terms and Conditions</a> </center> <p></p> </div> </div>		Version 1 soon! Version 2 soon!		Version 1 soon! Version 2 soon!

Next Page

Style 2

Round & Curve layouts are fun and appealing. In the recently added section your images will be closer together and you can add more than 6. The candy pieces change to yellow when hover over them. It makes a cool section for up to 18 affies. The button on the right side of the bar is for the sister site or a "vote for me" button.

B-Day Bash <style> #layoutdesignandcodingbypatternmatrix { } #donotsteal { } .sf, .sf a { display: none; } body { background: url("http://img52.imageshack.us/img52/6703/image60.png"); font: 10px verdana; line-height: 12px; color: #333; } table { background: #000; } .table { background: transparent; overflow: hidden; text-align: left; font: 8pt verdana; } b { color: #08b5bd; font-weight: bold; } i { color: #d292da; } h1 { font: 12pt tahoma; margin: 0px; margin-bottom: 5px; line-height: 20px; color: #ffffff; background: #96c765; letter-spacing: 3px; font-weight: bold; text-align: left; text-transform: uppercase; padding-left: 3px; } h2 { font: 8pt tahoma; margin: 0px; margin-bottom: 5px; line-height: 15px; color: #f7aa1c; border-bottom: 3px solid #f7aa1c; letter-spacing: 3px; font-weight: bold; text-align: right; text-transform: lowercase; padding-right: 3px; } h3 { font: 8pt tahoma; margin: 0px; margin-bottom: 5px; line-height: 15px; color: #65a343; border-right: 50px solid #65a343; letter-spacing: 3px; font-weight: bold; text-align: left; text-transform: lowercase; padding-left: 3px; } a:link, a:active, a:visited { text-transform: lowercase; text-decoration: underline; font-weight: bold; color: #f2628a; } a:hover { color: #f8de3d; } a.nav1:link, a.nav1:visited, a.nav1:active { background: url("http://img717.imageshack.us/img717/4025/image63a.png"); display: block; width: 33px; height: 39px; border: none; } a.nav1:hover { background: url("http://img23.imageshack.us/img23/6011/image63b.png"); } a.nav:active, a.nav:visited, a.nav:link { display: inline; text-decoration: none; font: 8pt verdana; padding: 2px; letter-spacing: 1px; background: transparent; text-align: center; text-transform: uppercase; color: #1c7a09; } a.nav:hover { color: #99cd58; } #a { left: 52px; top: 440px; width: 35px; text-align: center; } #b { left: 87px; top: 440px; width: 35px; text-align: center; } #c { left: 122px; top: 440px; width: 35px; text-align: center; } #d { left: 157px; top: 440px; width: 35px; text-align: center; } #e { left: 192px; top: 440px; width: 35px; text-align: center; } #neo { left: 485px; top: 193px; width: 425px; height: 16px; text-align: center; overflow: hidden; } #link { left: 527px; top: 50px; width: 95px; height: 116px; text-align: center; overflow: hidden; } #added { left: 632px; top: 47px; width: 161px; height: 116px; text-align: center; overflow: hidden; } #sister { left: 803px; top: 47px; width: 95px; height: 116px; text-align: center; overflow: hidden; } #pinata { left: 292px; top: 238px; width: 643px; height: 349px; text-align: left; font: 8pt verdana; overflow: hidden; } .bday { width: 643px; height: 349px; overflow: auto; } textarea { border: 1px solid #000; width: 88px; height: 19px; margin-top: 3px; margin-bottom: 3px; } .small { width: 40px; height: 40px; margin: 2px; border: 0px; } img { border: 0px; } </style> <img style="position: absolute; left: 0px; top: 14px; z-index: -1; border: 0px;" src="http://img708.imageshack.us/img708/1838/layout1g.png"><div style="position: absolute;" id="neo"> <a href="#home" class="nav">home</a> <a href="#request" class="nav">request</a> <a href="#pickup" class="nav">pickup</a> <a href="#portfolio" class="nav">portfolio</a> <a href="#sitely" class="nav">sitely</a> <a href="#credits" class="nav">credits</a> <a href="/" class="nav">neo</a> </div> <div style="position: absolute;" id="link"> <a href="/~oppsh"><img src="http://img96.imageshack.us/img96/7029/placeholder.png" border="0"></a><br>textarea here<br><a href="/~oppsh"><img src="http://img96.imageshack.us/img96/7029/placeholder.png" border="0"></a><br>textarea here </div> <div style="position: absolute;" id="added"> <i>Recently Added</i> <br><img src="http://img27.imageshack.us/img27/1839/img1g.png" class="small"><img src="http://img685.imageshack.us/img685/9510/img2nd.png" class="small"><img src="http://img43.imageshack.us/img43/815/img3g.png" class="small"><img src="http://img3.imageshack.us/img3/3056/img4w.png" class="small"><img src="http://img27.imageshack.us/img27/1839/img1g.png" class="small"><img src="http://img685.imageshack.us/img685/9510/img2nd.png" class="small"> </div> <div style="position: absolute;" id="sister"> <a href="/~oppsh"><img src="http://img96.imageshack.us/img96/7029/placeholder.png" border="0"></a><br> Describe your sister site here. Describe your sister site here. Describe your sister site here. </div> <div style="position: absolute;" id="a"> <a href="/" class="nav1"></a> <a href="/" class="nav1"></a> <a href="/" class="nav1"></a> </div> <div style="position: absolute;" id="b"> <a href="/" class="nav1"></a> <a href="/" class="nav1"></a> <a href="/" class="nav1"></a> <a href="/" class="nav1"></a> </div> <div style="position: absolute;" id="c"> <a href="/" class="nav1"></a> <a href="/" class="nav1"></a> <a href="/" class="nav1"></a> <a href="/" class="nav1"></a> </div> <div style="position: absolute;" id="d"> <a href="/" class="nav1"></a> <a href="/" class="nav1"></a> <a href="/" class="nav1"></a> <a href="/" class="nav1"></a> </div> <div style="position: absolute;" id="e"> <a href="/" class="nav1"></a> <a href="/" class="nav1"></a> <a href="/" class="nav1"></a> </div> <div style="position: absolute;" id="pinata"> <a name="home"></a> <div class="bday"> <h1>header</h1> <img src="http://img27.imageshack.us/img27/1839/img1g.png" style="float: right;"><b>Lorem</b> ipsum <i>dolor</i> amet, <a href="/">consectetur</a> adipiscing elit. Morbi vitae mi non neque suscipit pretium. Cras felis arcu, tempor et luctus a, sodales a lorem. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Donec vitae purus eu neque scelerisque mattis vitae a enim. Mauris purus nisl, blandit ac porta id, aliquam ac urna. Morbi dolor velit, iaculis non ultrices sit amet, placerat dignissim nulla. In eleifend congue turpis, id tincidunt nunc pharetra in. <p></p> <h2>Header 2</h2> <img src="http://img3.imageshack.us/img3/3056/img4w.png" style="float: left;">In hac habitasse platea dictumst. Sed tristique purus non ligula commodo non pretium velit venenatis. Praesent massa dolor, malesuada nec sollicitudin ac, porta vulputate metus. Vivamus non nisl at felis porttitor aliquet. Nullam quis volutpat nisl. Praesent venenatis tempor erat, vel pellentesque enim semper volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Proin pellentesque pulvinar aliquam. Nullam cursus lacinia erat, ut venenatis nibh vehicula at. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean lacinia ullamcorper orci, nec fringilla ligula luctus quis. <p></p> <h3>Header 3</h3> <img src="http://img43.imageshack.us/img43/815/img3g.png" style="float: right;"> Morbi et posuere nunc. Donec rhoncus malesuada accumsan. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Morbi eu justo id lorem luctus fringilla sed nec odio. Praesent volutpat convallis erat, at malesuada libero tincidunt vel. Phasellus sollicitudin mi at nisi elementum euismod at ut purus. Donec volutpat nisl eget nisi aliquet eu luctus urna pretium. <p></p> <center><b>To save please zoom out 2/3 times (ctrl & -) and (ctrl & +) to zoom right back.</b></center> </div> <a name="request"></a> <div class="bday"> <h1>header</h1> </div> <a name="pickup"></a> <div class="bday"> <h1>header</h1> </div> <a name="portfolio"></a> <div class="bday"> <h1>header</h1> </div> <a name="sitely"></a> <div class="bday"> <h1>header</h1> </div> <a name="credits"></a> <div class="bday"> <h1>Credits</h1> Layouts Designs/Coding are <a href="/~cheeroh">©</a> <a href="/~oppsh">Seraphic</a>. <br>Images are from Neopets. <br>Textures/Brushes from dA and <a href="/~liahness">NR</a>. <p></p> <h2>Neopets</h2> <center>NEOPETS and all related indicia are trademarks of <a href="/aboutus.phtml">Neopets, Inc.,</a>© 1999-2011.® denotes Reg. US Pat. & TM Office. All rights reserved. <a href="/privacy.phtml"> PRIVACY POLICY</a> | <a href="/safetytips.phtml">Safety Tips</a> | <a href="/contact.phtml">Contact Us</a> | <a href="/aboutus.phtml">About Us</a> | <a href="/presskit_form.phtml">Press Kit</a> Use of this site signifies your acceptance of the <a href="/terms.phtml">Terms and Conditions</a> </center> </div> </div>

Version 1 soon! Version 2 soon!

Version 1 soon! Version 2 soon!

Previous Page or Next Page

Style 3

Simple Wave layouts are very simple. These layouts have different color navigation at the top with the same color hover. For updates, you use the small side and only add the current day's update(s) and add the rest of the updates to another page (hence a read more... link below that). Under that you can add a quick status for your site or a link back button if you one.

Island Wave <style> #layoutdesignandcodingbypatternmatrix { } #donotsteal { } .sf, .sf a { display: none; } table { background: #000; } body { background: url("http://img217.imageshack.us/img217/9606/isleb.png"); } a.nav1:active, a.nav1:visited, a.nav1:link { display: block; width: 100px; text-decoration: none; font: 10pt verdana; margin-right: 3px; margin-left: 3px; letter-spacing: 2px; background: transparent; text-align: center; text-transform: uppercase; border-top: 5px solid #1c63c2; color: #1c63c2; float: left; } a.nav1:hover { color: #749daf; border-top: 5px solid #749daf; } a.nav2:active, a.nav2:visited, a.nav2:link { display: block; width: 100px; text-decoration: none; font: 10pt verdana; margin-right: 3px; margin-left: 3px; letter-spacing: 2px; background: transparent; text-align: center; text-transform: uppercase; border-top: 5px solid #4f1d79; color: #4f1d79; float: left; } a.nav2:hover { color: #749daf; border-top: 5px solid #749daf; } a.nav3:active, a.nav3:visited, a.nav3:link { display: block; width: 100px; text-decoration: none; font: 10pt verdana; margin-right: 3px; margin-left: 3px; letter-spacing: 2px; background: transparent; text-align: center; text-transform: uppercase; border-top: 5px solid #50aa2d; color: #50aa2d; float: left; } a.nav3:hover { color: #749daf; border-top: 5px solid #749daf; } a:active, a:visited, a:link { color: #347f11; text-decoration: underline; font-weight: bold; } a:hover { color: #4ab0c4; } b { color: #1b6fa0; font-weight: bold; } i { color: #8431c9; font-style: italic; } h1 { color: #053967; border-bottom: 2px solid #053967; font: 16pt georgia; font-style: italic; text-transform: lowercase; line-height: 25px; margin-bottom: 6px; margin-top: 0px; } h2 { color: #053967; border-bottom: 2px solid #053967; font: 16pt georgia; font-style: italic; text-transform: lowercase; line-height: 25px; margin-bottom: 6px; margin-top: 0px; text-align: right; } h3, h4 { color: #357a89; font: 12pt tahoma; font-weight: bold; text-transform: lowercase; line-height: 20px; margin-bottom: 6px; margin-top: 0px; } h3 { border-right: 40px solid #357a89; text-align: left; } h4 { border-left: 40px solid #357a89; text-align: right; } h5 { font: 8pt tahoma; margin: 0px; margin-bottom: 5px; line-height: 15px; color: #38bbdc; border-bottom: 3px solid #38bbdc; letter-spacing: 3px; font-weight: bold; text-align: right; text-transform: lowercase; padding-right: 3px; } textarea { width: 88px; height: 30px; border: 1px solid #333; margin-top: 3px; font: 9px verdana; } #mystic, #side, .table { background: transparent; overflow: hidden; text-align: left; color: #000; font: 8pt verdana; } #mystic { left: 128px; top: 81px; width: 525px; height: 315px; z-index: 100; line-height: 12px; } .isle { width: 525px; height: 315px; overflow: auto; } #side { left: 656px; top: 81px; width: 214px; height: 308px; z-index: 100; line-height: 12px; } #links { left: 128px; top: 57px; background: transparent; } </style> <img style="position: absolute; left: 0px; top: 0px; overflow: hidden; z-index: -1; border: 0px;" src="http://img59.imageshack.us/img59/9341/islea.png"><div style="position: absolute;" id="links"> <a href="#home" class="nav1">Home</a> <a href="#request" class="nav2">Request</a> <a href="#pickup" class="nav3">Pick-Up</a> <a href="#portfolio" class="nav1">Portfolio</a> <a href="#extras" class="nav2">Extras</a> <a href="#sitely" class="nav3">Sitely</a> <a href="#credits" class="nav1">Credits</a> </div> <div style="position: absolute;" id="side"> <h2>Header 2</h2> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi eu tristique lorem. Vestibulum in elit tortor, id vehicula ligula. Morbi eu tellus metus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Phasellus fermentum, orci et aliquet faucibus, lectus purus dapibus sapien, ut dignissim dolor elit sed quam. <br><center><a href="#moreupdates">read more...</a></center> <p></p> <h4>Header 4</h4> Nam id lorem leo. Donec lorem nisi, faucibus quis facilisis accumsan, adipiscing condimentum tortor. Suspendisse neque erat, blandit congue euismod rutrum, gravida id turpis. </div> <div style="position: absolute;" id="mystic"> <a name="home"></a> <div class="isle"> <h1>Header 1</h1> <b>This is bold</b>, <i>this is italicized</i>, and <a href="/">this is hyperlinked</a>! Please keep all credits in the credit section at all times. Do not edit the layout, or use the coding and take credit for them as your own. <p></p> <b>Need to save</b>? To save please zoom out 2/3 times (ctrl & -) and (ctrl & +) to zoom right back. <p></p> Do not worry <b>if</b> there is space at the top of this layout when you preview it. The space is there for the neopets bar at the top and it is <i>against the rules</i> to remove it. When you save changes this layout should/will look amazing. This layout should work in <i>all browsers</i>, because it was tested in IE, Mozilla/Firefox, Chrome and Safari. This layout was coded in and looks best in <b>Chrome</b>. <p></p> <h3>Header 3</h3> Sed mollis tempus sodales. Etiam scelerisque lacinia urna et tristique. Donec a pharetra felis. Nullam odio mauris, volutpat a tincidunt et, vulputate eu arcu. Nunc in erat nec dolor consequat tempus sit amet et neque. Nullam nisl tellus, congue at molestie vel, mollis non tellus. Suspendisse pulvinar lectus laoreet massa porttitor id vestibulum est tincidunt. Suspendisse felis justo, sodales sagittis ullamcorper a, vestibulum at quam. Donec ornare sodales consectetur. Duis posuere augue sed mi elementum et ultrices nisl adipiscing. Praesent ipsum neque, adipiscing eu ullamcorper et, auctor id dolor. Donec venenatis mollis faucibus. Etiam faucibus consectetur egestas. </div> <a name="moreupdates"></a> <div class="isle"> <h1>Past Updates</h1> This is the place where you can store your old updates! <p></p> <h5>Month Date, Year {Time}</h5> Nam id lorem leo. Donec lorem nisi, faucibus quis facilisis accumsan, adipiscing condimentum tortor. Suspendisse neque erat, blandit congue euismod rutrum, gravida id turpis. <p></p> <h5>Month Date, Year {Time}</h5> Nam id lorem leo. Donec lorem nisi, faucibus quis facilisis accumsan, adipiscing condimentum tortor. Suspendisse neque erat, blandit congue euismod rutrum, gravida id turpis. </div> <a name="request"></a> <div class="isle"> <h1>header</h1> </div> <a name="pickup"></a> <div class="isle"> <h1>header</h1> </div> <a name="portfolio"></a> <div class="isle"> <h1>header</h1> </div> <a name="extras"></a> <div class="isle"> <h1>header</h1> </div> <a name="sitely"></a> <div class="isle"> <h1>header</h1> </div> <a name="credits"></a> <div class="isle"> <h1>Credits</h1> Layouts Designs/Coding are <a href="/~cheeroh">©</a> <a href="/~oppsh">Seraphic</a>. <br>Images are from Neopets. <br>Textures/Brushes from dA and <a href="/~liahness">NR</a>. <p></p> <h2>Neopets</h2> <center>NEOPETS and all related indicia are trademarks of <a href="/aboutus.phtml">Neopets, Inc.,</a>© 1999-2011.® denotes Reg. US Pat. & TM Office. All rights reserved. <a href="/privacy.phtml"> PRIVACY POLICY</a> | <a href="/safetytips.phtml">Safety Tips</a> | <a href="/contact.phtml">Contact Us</a> | <a href="/aboutus.phtml">About Us</a> | <a href="/presskit_form.phtml">Press Kit</a> Use of this site signifies your acceptance of the <a href="/terms.phtml">Terms and Conditions</a> </center> </div> </div>

Version 1 soon! Version 2 soon!

Version 1 soon! Version 2 soon!

Previous Page or Next Page

Style 4

PNG Portrait layouts are very clean and simple. They have one png as the main focus. There is just one big anchored multi-page content box and side navigation. The overall theme of the layout is based on the png used.

Isca Portrait Coming Soon!

Version 1 soon! Version 2 soon!

Version 1 soon! Version 2 soon!

Previous Page