Hello, and welcome to B&G Art Dump! This is Bingo's page for art, premades and generally all things I make (with a little help from Ghenghi, of course). :D It is still ~~and most probably permanently~~ under construction, but even so I'm very proud to say it's up and running!

Scrolling down a little bit you'll find a few premade layouts I've made -- such as petpages, lookups and shop/gallery layouts. There is also a short profile section for Ghenghi (after all, this is his petpage!), and soon-to-be-added are also a few adoptables and some artwork of mine (and by others, specially of Ghenghi)!

There are always new things being added, so please look forward to them and come back whenever you can! :3

My inbox is always open to questions, critiques or rants (or even if you're up to chat! lol), so feel free to contact me about anything~ Send me a neomail!

About Ghenghi

Back to top

Name: Ghenghi (GAHN-fee)
Species: Baby Chomby
Birthday: 7th of Running, Y9 (Age 15)
Zodiac: The Ascender
Blood Type: AB
Height: 132 cm

Sed consequat magna nisl, ut accumsan nisl. Mauris rhoncus blandit rutrum. Fusce sed leo ligula. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae;

Sed consequat magna nisl, ut accumsan nisl. Mauris rhoncus blandit rutrum. Fusce sed leo ligula. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Maecenas sodales sollicitudin ipsum in ornare. Pellentesque lobortis augue in diam fringilla ut tincidunt mauris pharetra. Aliquam congue turpis ut dui lacinia laoreet.

Art of Ghenghi
hover over each of the images for credits	•	drag them to your navigation bar for full sizes!

F.A.Q.

Back to top

How do I use base codes?

⇢ You should mostly look out for images (which usually end in .jpg or .png and are either hosted in tinypic or dropbox) and colours (in the form of hex codes, preceeded by a hash symbol #).

⇢ You can basically do anything to the codes, as long as you keep my credits visible and clear!

⇢ For further help, you should neomail me! :) But in case you'd like to sort things out yourself, there are great guides such as CSS Guide, CSS for you, Filter Tips and Neocolors to help you out!

If you can't find your question above (or in case you need help with anything), feel free to neomail me! I promise to reply as soon as I can. :D

Premade Layouts

Back to top

In case you'd rather make your own design, grab a base code — they are almost fully customisable!

You may change all you want from these codes, but please do not take off my credits, yes?
^ This includes base codes, of course, as the coding was also completely done by me. (:

Drag the pictures to your browser's navigation bar to see them in full-size! :D
Petpage Layouts

Style 01: Base Code

<style> body { background-color: #ddd; background: url("http://dl.dropbox.com/u/78448039/premade/letbg.png"); font-family: verdana; font-size: 10px; color: #666; line-height: 18px; margin-top: -14px; overflow: hidden; } #container { width: 702px; background: url("http://dl.dropbox.com/u/78448039/premade/let.png"); margin: 30px auto; border: 5px solid #888; height: 502px; padding: 0px; overflow: hidden; } .container { margin: 0px; width: 700px; height: 500px; overflow: hidden; } #box { width: 400px; background-color: #eee; margin: 10px auto auto 10px; border: 1px solid #999; overflow: hidden; height: 438px; } .box { width: 380px !important; background: none; overflow: auto; height: 418px; padding: 10px; text-align: justify; } #navigation { width: 400px; margin: 10px auto auto 10px; background: #ddd; border: 1px solid #999; height: 30px; text-align: center; } #navigation a { display: inline-block; background: #ddd; height: 30px; line-height: 30px; text-transform: uppercase; letter-spacing: 2px; color: #888; text-align: center; padding: 0px; margin: 0px; width: 80px; font-size: 8px; } #navigation a:hover { color: #fff; background: #aaa; } #wish table { margin: 0 auto; width: auto; } #wish td { vertical-align: top; text-align: center; font-size: 8px; text-transform: uppercase; width: 20%; } #wish td img { width: 50px; height: 50px; border: 1px solid #ccc; margin-bottom: 3px; background: white; } #cred { color: #888 !important; margin-top: -25px; margin-left: 0px; margin-right: 0px; width: auto; background: none; text-align: center; font-size: 9px; text-transform: lowercase; letter-spacing: 1px; } #cred a { font-weight: normal; color: #333; } #cred a:hover { color: #999; background: none; } h1 { color: #444; padding-bottom: 2px; font-family: georgia; font-style: italic; letter-spacing: 1px; font-size: 20px; width: auto; margin: 0px; margin-bottom: 10px; text-align: center; line-height: 5px; background: #ccc; } h2 { width: auto; color: #aaa; padding: 0 0 0 5px; font-size: 8px; letter-spacing: 2px; text-transform: uppercase; height: 12px; line-height: 14px; border: 1px solid #ccc; margin: 0px; margin-bottom: 5px; font-weight: normal; text-align: left; background: #e0e0e0; } h3 { width: auto; color: #aaa; padding: 0 5px 0 0; font-size: 8px; letter-spacing: 2px; text-transform: uppercase; height: 12px; line-height: 14px; border: 1px solid #ccc; margin: 0px; margin-bottom: 5px; font-weight: normal; text-align: right; background: #e0e0e0; } .sf { display: none; } p { margin: 0 0 8px 0; text-align: justify !important; } center { margin: 0px; } b { color: #bbb; } i { color: #999; } strike { color: #999; } a { color: #ccc; text-decoration: none; } a:hover { color: #999; background: #ddd; } ul { list-style-type: none; padding: 0px; margin: 0 0 10px 0; } li { background: url("http://i54.tinypic.com/27xpe1l.png") left top no-repeat; background-position: 0px 5px; padding-left: 12px; } </style> <div id="container"> <div class="container"> <div id="box"> <a name="0"></a> <div class="box"> <h1>Welcome to my page!</h1> <p><b>Bold</b> <i>Italic</i> <strike>Striked out</strike> <a href="/">Link</a> <strong>Strong</strong> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut at dolor ut nisl luctus euismod. Pellentesque mattis sem in justo luctus nec commodo orci rutrum. Donec cursus aliquam dolor quis dictum. Phasellus bibendum volutpat ullamcorper. Vivamus ut lorem sed augue cursus hendrerit. Proin cursus laoreet lacus. Morbi tellus sem, eleifend id pellentesque eu, consequat ut est. In hac habitasse platea dictumst.</p> <center>Random centred text haha</center> <br><p>Sed consequat magna nisl, ut accumsan nisl. Mauris rhoncus blandit rutrum. Fusce sed leo ligula. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Maecenas sodales sollicitudin ipsum in ornare. Pellentesque lobortis augue in diam fringilla ut tincidunt mauris pharetra. Aliquam congue turpis ut dui lacinia laoreet.</p> </div> <a name="1"></a> <div class="box"> <h1>Page 1</h1> <h2>Random Text</h2> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras in est pellentesque nisi malesuada venenatis. Duis dignissim sagittis dui, quis placerat dolor pretium in. Ut ut neque et purus vulputate molestie. Donec ipsum erat, condimentum sed porta eget, convallis et diam. Nulla laoreet odio et nunc sodales condimentum. Nullam nec lorem tellus. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Integer convallis lobortis enim ac dignissim. Pellentesque consectetur odio quis lectus interdum placerat.</p> <h3>List Example</h3> <ul> <li>Unachieved #1</li> <li>Unachieved #2</li> <li><strike>Achieved #1</strike></li> <li>Unachieved #3</li> <li><strike>Achieved #2</strike></li> </ul> </div> <a name="2"></a> <div class="box"> <h1>Page 2</h1> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras in est pellentesque nisi malesuada venenatis. Duis dignissim sagittis dui, quis placerat dolor pretium in. Ut ut neque et purus vulputate molestie. Donec ipsum erat, condimentum sed porta eget, convallis et diam. Nulla laoreet odio et nunc sodales condimentum. Nullam nec lorem tellus. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Integer convallis lobortis enim ac dignissim. Pellentesque consectetur odio quis lectus interdum placerat.</p> </div> <a name="3"></a> <div class="box" id="wish"> <h1>Page 3</h1> <h2>NP Wishlist (Example)</h2> <table cellspacing="10"> <tr> <td> <img src="http://images.neopets.com/items/toy_garin_plushie.gif"><br>Garin Plushie</td> <td> <img src="http://images.neopets.com/items/pot_chomby_baby.gif"><br>Baby Chomby Morphing Potion</td> <td> <img src="http://images.neopets.com/items/mag_mystery_swirly.gif"><br>Mysterious Swirly Potion</td> <td> <img src="http://images.neopets.com/items/pixel_black.gif"><br>Escaped Pixel</td> <td> <img src="http://images.neopets.com/items/boo_naturalwonders_neopia.gif"><br>Natural Wonders of Neopia: Shenkuu</td> </tr> <tr> <td> <img src="http://images.neopets.com/items/plu_korbat_rainbow.gif"><br>Rainbow Korbat Plushie</td> <td> <img src="http://images.neopets.com/items/ffo_twinkling_icecream.gif"><br>Twinkling Ice Cream</td> <td> <img src="http://images.neopets.com/items/plu_shoyru_resewn.gif"><br>Resewn Shoyru Plushie</td> <td> <img src="http://images.neopets.com/items/plu_acara_grey.gif"><br>Grey Acara Plushie</td> <td> <img src="http://images.neopets.com/items/bak_meringue_strawberry.gif"><br>Strawberry Usul Meringue</td> </tr> </table> <h3>NC Wishlist (Example)</h3> <table cellspacing="10"> <tr> <td> <img src="http://images.neopets.com/items/mall_kq_goldkyrii.gif"><br>Limited Edition Gold Kyrii Key Quest Token</td> <td> <img src="http://images.neopets.com/items/mall_armoury_bk.gif"><br>Armoury Background</td> <td> <img src="http://images.neopets.com/items/mall_dd2011_myncicontacts.gif"><br>Zenco the Magnificent Contacts</td> <td> <img src="http://images.neopets.com/items/mall_cheerleader_dress.gif"><br>Altador Cup Cheerleader Dress</td> <td> <img src="http://images.neopets.com/items/mall_wig_starryauburn.gif"><br>Starry Auburn Wig</td> </tr> <tr> <td> <img src="http://images.neopets.com/items/mall_gashapon_brightvale.gif"><br>Brightvale Mystery Capsule</td> <td> <img src="http://images.neopets.com/items/mall_wig_garin.gif"><br>Garin Wig</td> <td> <img src="http://images.neopets.com/items/mall_cape_king.gif"><br>Kings Cape</td> <td> <img src="http://images.neopets.com/items/mall_bg_autumnwoodland.gif"><br>Breezy Autumn Path Background</td> <td> <img src="http://images.neopets.com/items/mall_trink_ladderjars.gif"><br>Flower Arrangement Foreground</td> </tr> </table> </div> <a name="4"></a> <div class="box"> <h1>Page 4</h1> <h2>More random text</h2> <p>Cras ipsum ligula, posuere id rhoncus id, congue id felis. Nullam hendrerit, sapien ut sollicitudin rutrum, nisl eros laoreet est, a mollis est ante vitae sem. Sed elementum est vitae neque adipiscing elementum. Curabitur venenatis erat eu mauris tincidunt in fringilla lectus pulvinar. Praesent viverra, dui scelerisque interdum bibendum, ipsum dui rutrum arcu, in imperdiet magna nisl et nisi. Nullam varius pellentesque sapien, quis fermentum felis convallis condimentum. Phasellus nec dolor quis libero blandit semper nec et dui. Nulla facilisi. Donec massa nisi, placerat quis imperdiet in, pulvinar eget nibh. Mauris nec lectus urna, id egestas nisl. Donec suscipit, ante a porttitor lobortis, nisl nibh tempus odio, eu dictum est enim nec turpis.</p> </div> </div> <div id="navigation"> <a href="#0">Index</a><a href="#1">Page 1</a><a href="#2">Page 2</a><a href="#3">Page 3</a><a href="#4">Page 4</a> </div> </div> </div> <div id="cred">© <a href="/~Ghenghi">B&G premades</a> </div>
Style 01: #1 Straw Hat

<style> body { background-color: #5c7533; background: url("http://i48.tinypic.com/34ewbhw.jpg"); font-family: verdana; font-size: 10px; color: #705721; line-height: 18px; margin-top: -14px; overflow: hidden; } #container { width: 702px; background: url("http://i48.tinypic.com/v30mlf.jpg"); margin: 30px auto; border: 5px solid #705721; height: 502px; padding: 0px; overflow: hidden; } .container { margin: 0px; width: 700px; height: 500px; overflow: hidden; } #box { width: 400px; background: url("http://dl.dropbox.com/u/78448039/premade/Style01/01_strawhat_tbg1.png"); margin: 10px auto auto 10px; border: 1px solid #82a24a; overflow: hidden; height: 438px; } .box { width: 380px !important; background: none; overflow: auto; height: 418px; padding: 10px; text-align: justify; } #navigation { width: 400px; margin: 10px auto auto 10px; background: none; border: 1px solid #5c7533; height: 30px; text-align: center; } #navigation a { display: inline-block; background: url("http://dl.dropbox.com/u/78448039/premade/Style01/01_strawhat_tbg2.png"); height: 30px; line-height: 30px; text-transform: uppercase; letter-spacing: 2px; color: #2c4108; text-align: center; padding: 0px; margin: 0px; width: 80px; font-size: 8px; } #navigation a:hover { color: #fff; background: url("http://dl.dropbox.com/u/78448039/premade/Style01/01_strawhat_tbg3.png"); } #wish table { margin: 0 auto; width: auto; } #wish td { vertical-align: top; text-align: center; font-size: 8px; text-transform: uppercase; width: 20%; } #wish td img { width: 50px; height: 50px; border: 1px solid #5d6f7a; margin-bottom: 3px; background: white; } #cred { color: #c77a00 !important; margin-top: -25px; margin-left: 0px; margin-right: 0px; width: auto; background: none; text-align: center; font-size: 9px; text-transform: lowercase; letter-spacing: 1px; } #cred a { font-weight: normal; color: #995800; } #cred a:hover { color: #ceb92c; background: none; } h1 { color: #496022; padding-bottom: 2px; font-family: georgia; font-style: italic; letter-spacing: 1px; font-size: 20px; width: auto; margin: 0px; margin-bottom: 10px; text-align: center; line-height: 5px; background: url("http://dl.dropbox.com/u/78448039/premade/Style01/01_strawhat_tbg3.png"); } h2, h3 { width: auto; color: #496022; font-size: 8px; letter-spacing: 2px; text-transform: uppercase; height: 12px; line-height: 14px; border: 1px solid #82a24a; margin: 0px; margin-bottom: 5px; font-weight: normal; background: url("http://dl.dropbox.com/u/78448039/premade/Style01/01_strawhat_tbg2.png"); } h2 { text-align: left; padding: 0 0 0 5px; } h3 { text-align: right; padding: 0 5px 0 0; } .sf { display: none; } p { margin: 0 0 8px 0; text-align: justify !important; } center { margin: 0px; } b { color: #5d6f7a; } i { color: #b95545; } strike { color: #5c7533; } a { color: #c77a00; text-decoration: none; } a:hover { color: #995800; background: #ceb92c; } ul { list-style-type: none; padding: 0px; margin: 0 0 10px 0; } li { background: url("http://dl.dropbox.com/u/78448039/premade/Style01/01_strawhat_arrow.png") left top no-repeat; background-position: 0px 5px; padding-left: 12px; } </style> <div id="container"> <div class="container"> <div id="box"> <a name="0"></a> <div class="box"> <h1>Welcome to my page!</h1> <p><b>Bold</b> <i>Italic</i> <strike>Striked out</strike> <a href="/">Link</a> <strong>Strong</strong> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut at dolor ut nisl luctus euismod. Pellentesque mattis sem in justo luctus nec commodo orci rutrum. Donec cursus aliquam dolor quis dictum. Phasellus bibendum volutpat ullamcorper. Vivamus ut lorem sed augue cursus hendrerit. Proin cursus laoreet lacus. Morbi tellus sem, eleifend id pellentesque eu, consequat ut est. In hac habitasse platea dictumst.</p> <center>Random centred text haha</center> <br><p>Sed consequat magna nisl, ut accumsan nisl. Mauris rhoncus blandit rutrum. Fusce sed leo ligula. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Maecenas sodales sollicitudin ipsum in ornare. Pellentesque lobortis augue in diam fringilla ut tincidunt mauris pharetra. Aliquam congue turpis ut dui lacinia laoreet.</p> </div> <a name="1"></a> <div class="box"> <h1>Page 1</h1> <h2>Random Text</h2> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras in est pellentesque nisi malesuada venenatis. Duis dignissim sagittis dui, quis placerat dolor pretium in. Ut ut neque et purus vulputate molestie. Donec ipsum erat, condimentum sed porta eget, convallis et diam. Nulla laoreet odio et nunc sodales condimentum. Nullam nec lorem tellus. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Integer convallis lobortis enim ac dignissim. Pellentesque consectetur odio quis lectus interdum placerat.</p> <h3>List Example</h3> <ul> <li>Unachieved #1</li> <li>Unachieved #2</li> <li><strike>Achieved #1</strike></li> <li>Unachieved #3</li> <li><strike>Achieved #2</strike></li> </ul> </div> <a name="2"></a> <div class="box"> <h1>Page 2</h1> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras in est pellentesque nisi malesuada venenatis. Duis dignissim sagittis dui, quis placerat dolor pretium in. Ut ut neque et purus vulputate molestie. Donec ipsum erat, condimentum sed porta eget, convallis et diam. Nulla laoreet odio et nunc sodales condimentum. Nullam nec lorem tellus. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Integer convallis lobortis enim ac dignissim. Pellentesque consectetur odio quis lectus interdum placerat.</p> </div> <a name="3"></a> <div class="box" id="wish"> <h1>Page 3</h1> <h2>NP Wishlist (Example)</h2> <table cellspacing="10"> <tr> <td> <img src="http://images.neopets.com/items/toy_garin_plushie.gif"><br>Garin Plushie</td> <td> <img src="http://images.neopets.com/items/pot_chomby_baby.gif"><br>Baby Chomby Morphing Potion</td> <td> <img src="http://images.neopets.com/items/mag_mystery_swirly.gif"><br>Mysterious Swirly Potion</td> <td> <img src="http://images.neopets.com/items/pixel_black.gif"><br>Escaped Pixel</td> <td> <img src="http://images.neopets.com/items/boo_naturalwonders_neopia.gif"><br>Natural Wonders of Neopia: Shenkuu</td> </tr> <tr> <td> <img src="http://images.neopets.com/items/plu_korbat_rainbow.gif"><br>Rainbow Korbat Plushie</td> <td> <img src="http://images.neopets.com/items/ffo_twinkling_icecream.gif"><br>Twinkling Ice Cream</td> <td> <img src="http://images.neopets.com/items/plu_shoyru_resewn.gif"><br>Resewn Shoyru Plushie</td> <td> <img src="http://images.neopets.com/items/plu_acara_grey.gif"><br>Grey Acara Plushie</td> <td> <img src="http://images.neopets.com/items/bak_meringue_strawberry.gif"><br>Strawberry Usul Meringue</td> </tr> </table> <h3>NC Wishlist (Example)</h3> <table cellspacing="10"> <tr> <td> <img src="http://images.neopets.com/items/mall_kq_goldkyrii.gif"><br>Limited Edition Gold Kyrii Key Quest Token</td> <td> <img src="http://images.neopets.com/items/mall_armoury_bk.gif"><br>Armoury Background</td> <td> <img src="http://images.neopets.com/items/mall_dd2011_myncicontacts.gif"><br>Zenco the Magnificent Contacts</td> <td> <img src="http://images.neopets.com/items/mall_cheerleader_dress.gif"><br>Altador Cup Cheerleader Dress</td> <td> <img src="http://images.neopets.com/items/mall_wig_starryauburn.gif"><br>Starry Auburn Wig</td> </tr> <tr> <td> <img src="http://images.neopets.com/items/mall_gashapon_brightvale.gif"><br>Brightvale Mystery Capsule</td> <td> <img src="http://images.neopets.com/items/mall_wig_garin.gif"><br>Garin Wig</td> <td> <img src="http://images.neopets.com/items/mall_cape_king.gif"><br>Kings Cape</td> <td> <img src="http://images.neopets.com/items/mall_bg_autumnwoodland.gif"><br>Breezy Autumn Path Background</td> <td> <img src="http://images.neopets.com/items/mall_trink_ladderjars.gif"><br>Flower Arrangement Foreground</td> </tr> </table> </div> <a name="4"></a> <div class="box"> <h1>Page 4</h1> <h2>More random text</h2> <p>Cras ipsum ligula, posuere id rhoncus id, congue id felis. Nullam hendrerit, sapien ut sollicitudin rutrum, nisl eros laoreet est, a mollis est ante vitae sem. Sed elementum est vitae neque adipiscing elementum. Curabitur venenatis erat eu mauris tincidunt in fringilla lectus pulvinar. Praesent viverra, dui scelerisque interdum bibendum, ipsum dui rutrum arcu, in imperdiet magna nisl et nisi. Nullam varius pellentesque sapien, quis fermentum felis convallis condimentum. Phasellus nec dolor quis libero blandit semper nec et dui. Nulla facilisi. Donec massa nisi, placerat quis imperdiet in, pulvinar eget nibh. Mauris nec lectus urna, id egestas nisl. Donec suscipit, ante a porttitor lobortis, nisl nibh tempus odio, eu dictum est enim nec turpis.</p> </div> </div> <div id="navigation"> <a href="#0">Index</a><a href="#1">Page 1</a><a href="#2">Page 2</a><a href="#3">Page 3</a><a href="#4">Page 4</a> </div> </div> </div> <div id="cred">© <a href="/~Ghenghi">B&G premades</a> </div>
Style 01: #2 Hammock

<style> body { background-color: #5c7533; background: url("http://i46.tinypic.com/34q5yco.jpg"); font-family: verdana; font-size: 10px; color: #5c5d3c; line-height: 18px; margin-top: -14px; overflow: hidden; } #container { width: 702px; background: url("http://i45.tinypic.com/scs5lw.jpg"); margin: 30px auto; border: 5px solid #2a4720; height: 502px; padding: 0px; overflow: hidden; } .container { margin: 0px; width: 700px; height: 500px; overflow: hidden; } #box { width: 400px; background: url("http://dl.dropbox.com/u/78448039/premade/Style01/02_hammock_tbg1.png"); margin: 10px auto auto 10px; border: 1px solid #aeb393; overflow: hidden; height: 438px; } .box { width: 380px !important; background: none; overflow: auto; height: 418px; padding: 10px; text-align: justify; } #navigation { width: 400px; margin: 10px auto auto 10px; background: none; border: 1px solid #b4911f; height: 30px; text-align: center; } #navigation a { display: inline-block; background: url("http://dl.dropbox.com/u/78448039/premade/Style01/02_hammock_tbg2.png"); height: 30px; line-height: 30px; text-transform: uppercase; letter-spacing: 2px; color: #77620d; text-align: center; padding: 0px; margin: 0px; width: 80px; font-size: 8px; } #navigation a:hover { color: #fff; background: url("http://dl.dropbox.com/u/78448039/premade/Style01/02_hammock_tbg3.png"); } #wish table { margin: 0 auto; width: auto; } #wish td { vertical-align: top; text-align: center; font-size: 8px; text-transform: uppercase; width: 20%; } #wish td img { width: 50px; height: 50px; border: 1px solid #8b8c6c; margin-bottom: 3px; background: white; } #cred { color: #61a2a1 !important; margin-top: -25px; margin-left: 0px; margin-right: 0px; width: auto; background: none; text-align: center; font-size: 9px; text-transform: lowercase; letter-spacing: 1px; } #cred a { font-weight: normal; color: #1f6c6b; } #cred a:hover { color: #2f8a89; background: none; } h1 { color: #77620d; padding-bottom: 2px; font-family: georgia; font-style: italic; letter-spacing: 1px; font-size: 20px; width: auto; margin: 0px; margin-bottom: 10px; text-align: center; line-height: 5px; background: url("http://dl.dropbox.com/u/78448039/premade/Style01/02_hammock_tbg3.png"); } h2, h3 { width: auto; color: #877926; font-size: 8px; letter-spacing: 2px; text-transform: uppercase; height: 12px; line-height: 14px; border: 1px solid #b0a146; margin: 0px; margin-bottom: 5px; font-weight: normal; background: url("http://dl.dropbox.com/u/78448039/premade/Style01/02_hammock_tbg2.png"); } h2 { text-align: left; padding: 0 0 0 5px; } h3 { text-align: right; padding: 0 5px 0 0; } .sf { display: none; } p { margin: 0 0 8px 0; text-align: justify !important; } center { margin: 0px; } b { color: #44a004; } i { color: #2f8a89; } strike { color: #8b8c6c; } a { color: #87672a; text-decoration: none; } a:hover { color: #3a3222; background: #bea983; } ul { list-style-type: none; padding: 0px; margin: 0 0 10px 0; } li { background: url("http://dl.dropbox.com/u/78448039/premade/Style01/02_hammock_arrow.png") left top no-repeat; background-position: 0px 5px; padding-left: 12px; } </style> <div id="container"> <div class="container"> <div id="box"> <a name="0"></a> <div class="box"> <h1>Welcome to my page!</h1> <p><b>Bold</b> <i>Italic</i> <strike>Striked out</strike> <a href="/">Link</a> <strong>Strong</strong> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut at dolor ut nisl luctus euismod. Pellentesque mattis sem in justo luctus nec commodo orci rutrum. Donec cursus aliquam dolor quis dictum. Phasellus bibendum volutpat ullamcorper. Vivamus ut lorem sed augue cursus hendrerit. Proin cursus laoreet lacus. Morbi tellus sem, eleifend id pellentesque eu, consequat ut est. In hac habitasse platea dictumst.</p> <center>Random centred text haha</center> <br><p>Sed consequat magna nisl, ut accumsan nisl. Mauris rhoncus blandit rutrum. Fusce sed leo ligula. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Maecenas sodales sollicitudin ipsum in ornare. Pellentesque lobortis augue in diam fringilla ut tincidunt mauris pharetra. Aliquam congue turpis ut dui lacinia laoreet.</p> </div> <a name="1"></a> <div class="box"> <h1>Page 1</h1> <h2>Random Text</h2> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras in est pellentesque nisi malesuada venenatis. Duis dignissim sagittis dui, quis placerat dolor pretium in. Ut ut neque et purus vulputate molestie. Donec ipsum erat, condimentum sed porta eget, convallis et diam. Nulla laoreet odio et nunc sodales condimentum. Nullam nec lorem tellus. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Integer convallis lobortis enim ac dignissim. Pellentesque consectetur odio quis lectus interdum placerat.</p> <h3>List Example</h3> <ul> <li>Unachieved #1</li> <li>Unachieved #2</li> <li><strike>Achieved #1</strike></li> <li>Unachieved #3</li> <li><strike>Achieved #2</strike></li> </ul> </div> <a name="2"></a> <div class="box"> <h1>Page 2</h1> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras in est pellentesque nisi malesuada venenatis. Duis dignissim sagittis dui, quis placerat dolor pretium in. Ut ut neque et purus vulputate molestie. Donec ipsum erat, condimentum sed porta eget, convallis et diam. Nulla laoreet odio et nunc sodales condimentum. Nullam nec lorem tellus. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Integer convallis lobortis enim ac dignissim. Pellentesque consectetur odio quis lectus interdum placerat.</p> </div> <a name="3"></a> <div class="box" id="wish"> <h1>Page 3</h1> <h2>NP Wishlist (Example)</h2> <table cellspacing="10"> <tr> <td> <img src="http://images.neopets.com/items/toy_garin_plushie.gif"><br>Garin Plushie</td> <td> <img src="http://images.neopets.com/items/pot_chomby_baby.gif"><br>Baby Chomby Morphing Potion</td> <td> <img src="http://images.neopets.com/items/mag_mystery_swirly.gif"><br>Mysterious Swirly Potion</td> <td> <img src="http://images.neopets.com/items/pixel_black.gif"><br>Escaped Pixel</td> <td> <img src="http://images.neopets.com/items/boo_naturalwonders_neopia.gif"><br>Natural Wonders of Neopia: Shenkuu</td> </tr> <tr> <td> <img src="http://images.neopets.com/items/plu_korbat_rainbow.gif"><br>Rainbow Korbat Plushie</td> <td> <img src="http://images.neopets.com/items/ffo_twinkling_icecream.gif"><br>Twinkling Ice Cream</td> <td> <img src="http://images.neopets.com/items/plu_shoyru_resewn.gif"><br>Resewn Shoyru Plushie</td> <td> <img src="http://images.neopets.com/items/plu_acara_grey.gif"><br>Grey Acara Plushie</td> <td> <img src="http://images.neopets.com/items/bak_meringue_strawberry.gif"><br>Strawberry Usul Meringue</td> </tr> </table> <h3>NC Wishlist (Example)</h3> <table cellspacing="10"> <tr> <td> <img src="http://images.neopets.com/items/mall_kq_goldkyrii.gif"><br>Limited Edition Gold Kyrii Key Quest Token</td> <td> <img src="http://images.neopets.com/items/mall_armoury_bk.gif"><br>Armoury Background</td> <td> <img src="http://images.neopets.com/items/mall_dd2011_myncicontacts.gif"><br>Zenco the Magnificent Contacts</td> <td> <img src="http://images.neopets.com/items/mall_cheerleader_dress.gif"><br>Altador Cup Cheerleader Dress</td> <td> <img src="http://images.neopets.com/items/mall_wig_starryauburn.gif"><br>Starry Auburn Wig</td> </tr> <tr> <td> <img src="http://images.neopets.com/items/mall_gashapon_brightvale.gif"><br>Brightvale Mystery Capsule</td> <td> <img src="http://images.neopets.com/items/mall_wig_garin.gif"><br>Garin Wig</td> <td> <img src="http://images.neopets.com/items/mall_cape_king.gif"><br>Kings Cape</td> <td> <img src="http://images.neopets.com/items/mall_bg_autumnwoodland.gif"><br>Breezy Autumn Path Background</td> <td> <img src="http://images.neopets.com/items/mall_trink_ladderjars.gif"><br>Flower Arrangement Foreground</td> </tr> </table> </div> <a name="4"></a> <div class="box"> <h1>Page 4</h1> <h2>More random text</h2> <p>Cras ipsum ligula, posuere id rhoncus id, congue id felis. Nullam hendrerit, sapien ut sollicitudin rutrum, nisl eros laoreet est, a mollis est ante vitae sem. Sed elementum est vitae neque adipiscing elementum. Curabitur venenatis erat eu mauris tincidunt in fringilla lectus pulvinar. Praesent viverra, dui scelerisque interdum bibendum, ipsum dui rutrum arcu, in imperdiet magna nisl et nisi. Nullam varius pellentesque sapien, quis fermentum felis convallis condimentum. Phasellus nec dolor quis libero blandit semper nec et dui. Nulla facilisi. Donec massa nisi, placerat quis imperdiet in, pulvinar eget nibh. Mauris nec lectus urna, id egestas nisl. Donec suscipit, ante a porttitor lobortis, nisl nibh tempus odio, eu dictum est enim nec turpis.</p> </div> </div> <div id="navigation"> <a href="#0">Index</a><a href="#1">Page 1</a><a href="#2">Page 2</a><a href="#3">Page 3</a><a href="#4">Page 4</a> </div> </div> </div> <div id="cred">© <a href="/~Ghenghi">B&G premades</a> </div>

Petlookups

Placeholder

placeholder
Placeholder

placeholder
Placeholder

placeholder

Userlookups

Obelisk War: Thieves Guild

<style> body { background: #93a4ac url("http://i47.tinypic.com/2ugcmd5.jpg") fixed; } #ncmall, #habitarium, #userneohome, #usershop, hr, #footer, #header, .adBox2, .ad_wrapper_fixed, #ban_bottom, #ban, .slug, .brand-mamabar { display: none; } #usertrophies td { font-size: 9px; } body, p, td, .medText { font: 10px verdana; color: #000; } .contentModule, .contentModuleTable, .contentModuleContent table table { border: none !important; } #main, #content { width: 600px; border: 3px solid #5e667d; margin-top: 30px; border-bottom: 0px; } #content { border: 0px; padding-top: 40px; } #usertrophies { width: 585px !important; height: auto !important; overflow: auto; } #usertrophies img, #usercollections img { width: 40px; height: auto; } #userneopets { width: 585px; } #userneopets img { margin-top: -30px; margin-left: -7px; width: 150px; height: 150px; } #userneopets a { display: block; overflow: hidden; width: 136px; height: 70px; } #userinfo { width: 300px; margin-right: 5px; } #usercollections { width: 280px; } .contentModuleHeader, .contentModuleHeaderAlt { color: #85998e; font: 12px Cambria !important; text-transform: uppercase; background: #d9e0dc; height: 10px; text-align: center; border-top: 1px solid #a2b8ac; border-bottom: 1px dashed #a2b8ac; letter-spacing: 2px; } #banner { width: 980px; height: 133px; background: url("http://i45.tinypic.com/qmx1c0.jpg") no-repeat; margin-left: -190px; margin-top: -138px; z-index: 99; line-height: 100px; color: white; font-size: 20px; } #krk { width: 309px; height: 494px; z-index: 2; bottom: 0px; left: 0px; background: url("http://i45.tinypic.com/2rg1jtg.jpg") no-repeat; } .inf { background: #d7caa9; border: 1px solid #9b7e44; padding: 0 8px 0 8px; text-align: justify; height: 150px !important; overflow: auto; } b { color: #2b2446; } a, a:link, a:active, a:visited, a b { color: #894343; } a:hover, strong { color: #0b5860; } .pic { background: #fff; padding: 3px; border: 1px solid black; height: 150px !important; width: 150px !important; } a.bgn { vertical-align: middle; color: #fff; text-transform: uppercase; font-size: 8px; font-weight: normal; letter-spacing: 2px; display: block; background: #8c7f5f; margin-bottom: 4px; padding: 3px 4px 3px 4px; } a:hover.bgn { background: #894343; } td { vertical-align: top; } </style> <div id="banner" style="position: fixed;"><img src="http://i46.tinypic.com/2yw7443.jpg"></div> <div id="krk" style="position: fixed;"></div> <table style="width: 100%; margin-left: -10px;" cellspacing="5"><tr> <td class="pic"><img src="http://images.neopets.com/images/frontpage/hic_11b_xkd8ansy.gif" height="150"></td> <td class="inf"> <p><strong>Thank you for using one of my premades! :D</strong> Feel free to change colours and images to your liking, but <b>please don't take off my credits</b>~ This is all my hard work. (:</p> <p>Also, please don't add too many links to the div on the right *points*, cause that would mess up the layout! (I mean, unless you can fix it yourself afterwards :B)</p> <p>DON'T FORGET TO ADD YOUR OWN TEXT TO THIS BOX! :DD It would be silly to have my instructions on your lookup, haha. Enjoy! And don't hesitate to come to <a href="/userlookup.phtml?user=clarafpantoja">me</a> for help!</p> </td> <td> <a class="bgn" href="/browseshop.phtml?owner=USERNAME">SHOP</a> <a class="bgn" href="/gallery/?gu=USERNAME">GALLERY</a> <a class="bgn" href="/neohome.phtml?owner=USERNAME">NEOHOME</a> <a class="bgn" href="/">link 4</a> <a class="bgn" href="/">link 5</a> <a class="bgn" href="/">link 6</a> <a class="bgn" href="/">link 7</a> <a class="bgn" style="margin: 0px;" href="/~Ghenghi">CSS</a> </td> </tr></table>
Placeholder

placeholder
Placeholder

placeholder

Shop/Gallery Layouts

Style 01: Field of Daisies

<style> #header { background-image: url("http://i46.tinypic.com/5nj5zp.jpg"); border-bottom: 3px solid #73af6f; } #footer { background-image: url("http://i45.tinypic.com/dcuqb.jpg"); } #ban { background-image: url("http://i49.tinypic.com/2iaxtee.jpg"); } .content td a img { float: left; width: 65px; height: 65px; border: 0px; padding: 5px 10px 5px 0px; } .content td { text-align: left; width: 290px; text-transform: uppercase; font-size: 8px; line-height: 12px; } .content td b { letter-spacing: -1px; color: #73af6f; } .contentModule { border: 1px solid #D4D4D4; padding: 2px; } .contentModuleTable { border: none; } p, td, body, table, tr, font, .medText { font-family: verdana; color: #777; font-size: 7.5pt; text-transform: none; } body { background: #fdd74e url("http://dl.dropbox.com/u/78448039/neo/sunflowerbg.png") fixed; } #main { border-left: 3px solid #3f5058; border-right: 3px solid #3f5058; } hr { width: 100%; background: url("http://i46.tinypic.com/2vcx24n.jpg"); border: 1px solid #666; height: 10px; } b { color: #3f5058; } a:link, a:active, a:visited, a, a b { color: #73af6f; } a:hover b, a:hover { color: #ffad09; } #usershop a { font-size: 18px; font-family: century gothic; } .sidebarModule, .sidebarTable { background-color: #F3F5F5; } .sidebarHeader, .sidebarHeaderAlt { font-size: 7.5pt !important; font-weight: bold; color: #fff; border-bottom: 4px solid #3f5058; text-align: left; vertical-align: top; background-color: #0b908f; padding-bottom: 0px; height: 15px; text-transform: none; } .sidebarHeader a, .sidebarHeader a:active, .sidebarHeader a:link, .sidebarHeader a:visited, .sidebarHeader a b { color: #fff; font-size: 7.5pt !important; } .user, .user b, #footer b { color: #fff !important; } .user a, .user a:link, .user a:active, .user a:visited { color: #ecd75a; } .user a:hover { color: #ffad09; } .vend { width: 220px; border: 1px solid #bbb; background: #e0e0e0; padding: 5px; } .vend b, .vend strong { padding-left: 10px; font-size: 18px; line-height: 20px; } .vend strong { color: #0b908f; } .vend img { height: 50px; width: 50px; float: left; border: 1px solid #bbb; } </style> <center style="line-height: 18px;"> <strong>Here's your welcoming message!</strong><br>You should edit this text and type up a kind welcoming to your customers. (:<br><br><div class="vend"> <b>Shop size:</b> <strong>01/000</strong><br> Currently holds up to 5 items~</div> <br><font style="font: 8px verdana; letter-spacing: 1px; line-height: 1px;">SHOP LAYOUT @ <a href="/~Ghenghi">B&G PREMADES</a></font> </center> <br><hr><style> .brand-mamabar { display: none; } #header { background-image: url("http://i46.tinypic.com/5nj5zp.jpg"); border-bottom: 3px solid #73af6f; } #footer { background-image: url("http://i45.tinypic.com/dcuqb.jpg"); } #ban { background-image: url("http://i49.tinypic.com/2iaxtee.jpg"); } .content td a img { float: left; width: 65px; height: 65px; border: 0px; padding: 5px 10px 5px 0px; } .content td { text-align: left; width: 290px; text-transform: uppercase; font-size: 8px; line-height: 12px; } .content td b { letter-spacing: -1px; color: #73af6f; } .contentModule { border: 1px solid #D4D4D4; padding: 2px; } .contentModuleTable { border: none; } p, td, body, table, tr, font, .medText { font-family: verdana; color: #777; font-size: 7.5pt; text-transform: none; } body { background: #fdd74e url("http://dl.dropbox.com/u/78448039/neo/sunflowerbg.png") fixed; } #main { border-left: 3px solid #3f5058; border-right: 3px solid #3f5058; } hr { width: 100%; background: url("http://i46.tinypic.com/2vcx24n.jpg"); border: 1px solid #666; height: 10px; } b { color: #3f5058; } a:link, a:active, a:visited, a, a b { color: #73af6f; } a:hover b, a:hover { color: #ffad09; } #usershop a { font-size: 18px; font-family: century gothic; } .sidebarModule, .sidebarTable { background-color: #F3F5F5; } .sidebarHeader, .sidebarHeaderAlt { font-size: 7.5pt !important; font-weight: bold; color: #fff; border-bottom: 4px solid #3f5058; text-align: left; vertical-align: top; background-color: #0b908f; padding-bottom: 0px; height: 15px; text-transform: none; } .sidebarHeader a, .sidebarHeader a:active, .sidebarHeader a:link, .sidebarHeader a:visited, .sidebarHeader a b { color: #fff; font-size: 7.5pt !important; } .user, .user b, #footer b { color: #fff !important; } .user a, .user a:link, .user a:active, .user a:visited { color: #ecd75a; } .user a:hover { color: #ffad09; } .vend { width: 240px; border: 1px solid #bbb; background: #e0e0e0; padding: 5px; } .vend b, .vend strong { padding-left: 10px; font-size: 18px; line-height: 20px; } .vend strong { color: #0b908f; } .vend img { height: 50px; width: 50px; float: left; border: 1px solid #bbb; } </style> <center style="line-height: 18px;"> <strong>Here's your welcoming message!</strong><br>You should edit this text and type up a kind welcoming to your customers. (:<br><br><div class="vend"> <b>Gallery size:</b> <strong>01/000</strong><br> Currently holds up to 5 items~ </div> <br><font style="font: 8px verdana; letter-spacing: 1px; line-height: 1px;">LAYOUT CREDITS @ <a href="/~Ghenghi">B&G PREMADES</a></font> </center>
Style 02: Autumn

<style> #header { background: url("http://i47.tinypic.com/qn03k3.jpg"); border-bottom: 3px solid #f89b0f; } #ban { background: url("http://i49.tinypic.com/ad0whf.jpg"); } #footer { background: url("http://i48.tinypic.com/kbod8m.jpg"); } #main, #ban, #header, #footer, #content, .content { width: 780px; } #main { border-right: 3px solid #4a2e19; border-left: 3px solid #4a2e19; } li.nav_image img { height: 35px; width: auto; } li.nav_image { margin-left: -5px; } .user.medText { color: #fff !important; } .user.medText a:link, .user.medText a:visited, .user.medText a:active, .user.medText a { color: #fed74e !important; } .user.medText a:hover { color: #ffb41d !important; } .brand-mamabar, #pushdown_banner, #ad-slug-wrapper, #ad-table { display: none !important; } .footerNifty { margin-left: -230px; } body { background: url("http://dl.dropbox.com/u/78448039/neo/autumnbg.png"); background-attachment: fixed; } .content, .content td { font-family: verdana; color: #666; font-size: 7pt; line-height: 16px; } .content a:link, .content a:active, .content a:visited { color: #f89b0f !important; } .content a:hover { color: #e26e01 !important; } ul.dropdown { border: 1px solid #f89b0f; background-color: #ffedb5; } LI:hover UL.dropdown A, LI.over UL.dropdown A { color: #e36d01; } LI:hover UL.dropdown AHover, LI.over UL.dropdown A:hover { color: #77ba1d; } .sidebar, .brand-mamabar, #nst { display: none; } .content td img { padding: 3px; border: 1px solid #c1977c; background: #dbcabe; } .content td img:hover { border: 1px solid #fcb51d; background: #f7e1b4; } .keep { width: 350px; background: #e0e0e0; border: 1px solid #bbb; padding: 5px; text-align: justify; overflow: -blocked-; height: 102px; margin-bottom: 5px; } .kimg { width: 100px !important; height: 100px !important; float: left; margin: 0 5px 5px 0; padding: 0px !important; background: #fff !important; border: 1px solid #bbb !important; } hr { width: 747px; background: url("http://i45.tinypic.com/2vayur6.jpg"); border: 1px solid #666; height: 10px; margin: -15px auto 15px auto; } .cat { width: 372px; background: none; } .cat a:link, .cat a:active, .cat a:visited { width: 68px; margin: 0 0px 0 0px; padding: 2px 0 2px 0; background: #f0f0f0; border: 1px solid #ddd; display: inline-block; height: 10px; line-height: 10px; text-transform: uppercase; font-size: 8px; color: #bbb !important; letter-spacing: 1px; margin-bottom: 3px; } .cat a:hover { background: #d0d0d0; color: #fff !important; border: 1px solid #bbb; } </style> <center style="margin: 0px;"> <div class="cat"> <a href="http://www.neopets.com/gallery/?gu=clarafpantoja&user_cat_g=CATEGORY1">CATEGORY1</a> <a href="http://www.neopets.com/gallery/?gu=clarafpantoja&user_cat_g=CATEGORY2">CATEGORY2</a> <a href="http://www.neopets.com/gallery/?gu=clarafpantoja&user_cat_g=CATEGORY3">CATEGORY3</a> <a href="http://www.neopets.com/gallery/?gu=clarafpantoja&user_cat_g=CATEGORY4">CATEGORY4</a> <a href="http://www.neopets.com/gallery/?gu=clarafpantoja&user_cat_g=CATEGORY5">CATEGORY5</a> </div> <div class="keep"> <img src="http://images.neopets.com/new_shopkeepers/2170.gif" class="kimg"><div style="height: 102px; overflow: auto; padding-right: 5px;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras varius vestibulum justo tincidunt gravida. Praesent aliquam, magna eu ultricies mattis, quam magna mattis massa, nec elementum neque neque eu quam. Integer at eros id lectus consectetur eleifend eu sed tellus. Vestibulum non elit ut lorem porta consectetur et id mauris. Vivamus ut purus nec sapien adipiscing eleifend. Morbi et metus vel odio molestie condimentum id pellentesque ipsum.</div> </div> <font style="text-transform: uppercase; font-size: 8px; color: #aaa; letter-spacing: 1px; line-height: 8px;">LAYOUT CREDITS @ <a href="http://neopets.com/~Ghenghi">B&G PREMADES</a></font> </center>
Placeholder

placeholder

Credits & Linking out

Back to top

Like Button by pianite
Total hits counter from Boingdragon
Online visitor counter from Whos.amung.us
Background from Subtle Patterns
Images from Neopets.com

Others' art are all properly credited!
hover over images to see their usernames
(Please contact me if I've miscredited anything!)

Everything else was made by me!
And I wouldn't like to see any of it used without proper permission and credits. (:

Affiliates / Linking out

I'm open to affiliates and all that stuff, so if you have a site and would like me to link to it here (and if you'd be willing to link to B&G on there as well :D), I'd be more than willing to place your button on this page! Just neomail me and we're set. ^^

Some other pages by me Bingo's Personal Page
Key Quest Log

About Ghenghi

Back to top

F.A.Q.

Back to top

How do I use base codes?

Premade Layouts

Back to top

Petpage Layouts

Style 01: Base Code

Style 01: #1 Straw Hat

Style 01: #2 Hammock

Petlookups

Placeholder

Placeholder

Placeholder

Userlookups

Obelisk War: Thieves Guild

Placeholder

Placeholder

Shop/Gallery Layouts

Style 01: Field of Daisies

Style 02: Autumn

Placeholder

Credits & Linking out

Back to top