1. DO NOT under any circumstance remove the credit. *You can however remove it as long as you keep the last link, normally labeled "css", in the navigation bar. Otherwise, if you remove all the credit that is considered stealing and I WILL report you if you do not put it back.
2. You are free to edit the coding as much as you desire, but please keep the credit.
3. Do not claim my stuff as your own
4. Proceed to enjoy your new css.

<style> table { background-color: transparent; z-index: -99; } table a img { display: none; z-index: -98; } .sf { display: none; } body { background-color: #2a1916; } b { color: #2a1916; } i { color: #6a5d52; } .u { border-bottom: 2px double #928577; } strike { color: #2a1916; } a:link, a:active, a:visited { color: #2a1916; background-color: #b9af9c; text-decoration: none; text-align: center; padding: 2px; } a:hover { color: #6a5d52; border: 1px solid #2a1916; } a.b:link, a.b:active, a.b:visited { display: block; width: 200px; color: #ddd7c6; background-color: #6a5d52; font-family: tahoma; font-size: 15; font-weight: bold; letter-spacing: 1px; text-align: center; text-decoration: none; padding-left: 2px; padding-top: 15px; padding-bottom: 15px; margin: 1px; border: 0px dashed #2a1916; } a.b:hover { margin: 3px; } h1 { color: #2a1916; background-color: COLOR; font-family: century gothic; font-size: 32; letter-spacing: 1px; line-height: 17px; text-align: right; padding: 0px; } h2 { color: #6a5d52; background-color: COLOR; font-family: tahoma; font-size: 18; font-style: italic; letter-spacing: 1px; line-height: -blocked-; text-align: center; padding: 0px; border-top: 1px dashed #6a5d52; } textarea { background-color: #fff; border: 1px solid #000; color: #000; overflow: hidden; width: 150px; height: 20px; } #Content { width: 500px; height: 700px; overflow: auto; top: 30; left: 300; font: 8pt verdana; text-align: justify; background-color: #ddd7c6; color: color; padding: 5px; border-left: 90px solid #b9af9c; border-right: 5px solid #b9af9c; border-top: 5px solid #b9af9c; border-bottom: 5px solid #b9af9c; } #Links { top: 50; left: 30; } </style> <div id="Links" style="position: absolute;"> <a href="/" class="b">Un</a> <a href="/" class="b">Deux</a> <a href="/" class="b">Trois</a> <a href="/" class="b">Quatre</a> <a href="/~Hyperlinked" class="b">Css</a> </div> <div id="Content" style="position: absolute;"> <h1>You don't want to hurt me</h1> <h2>Let's see how deep the bullet lies</h2>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur? Quis autem vel eum iure reprehenderit qui in ea voluptate velit esse quam nihil molestiae consequatur, vel illum qui dolorem eum fugiat quo voluptas nulla pariatur?" <p> <b>Boldness is Bold</b><br><i>italicness is Italic</i><br><font class="u">Underlinedness is, well, underlined</font><br><strike>Strikeness is striking</strike><br><br><a href="/~hyperlinked">Normal link here</a> </p> <h1>Unaware that I'm tearing you asunder</h1> <h2>There's a thunder in our hearts, baby.</h2>But I must explain to you how all this mistaken idea of denouncing pleasure and praising pain was born and I will give you a complete account of the system, and expound the actual teachings of the great explorer of the truth, the master-builder of human happiness. No one rejects, dislikes, or avoids pleasure itself, because it is pleasure, but because those who do not know how to pursue pleasure rationally encounter consequences that are extremely painful. Nor again is there anyone who loves or pursues or desires to obtain pain of itself, because it is pain, but because occasionally circumstances occur in which toil and pain can procure him some great pleasure. To take a trivial example, which of us ever undertakes laborious physical exercise, except to obtain some advantage from it? But who has any right to find fault with a man who chooses to enjoy a pleasure that has no annoying consequences, or one who avoids a pain that produces no resultant pleasure?" <h2>Credit</h2> <center> Css by Rhea (apparency) <p> </p> </center> </div> .11
Browsers:
-Firefox
-Google Chrome
-Internet Explorer

Lyrics featured:
Running Up That Hill by Placebo

Color Palette:
B l i n d * by sugar! on Colourlovers

<style> table { background-color: transparent; z-index: -99; } table a img { display: none; z-index: -98; } .sf { display: none; } body { background-color: #378482; } b { color: #2a1916; } i { color: #6a5d52; } u { border-bottom: 2px double #928577; } strike { color: #2a1916; } a:link, a:active, a:visited { color: #2a1916; background-color: #b9af9c; text-decoration: none; text-align: center; padding: 2px; } a:hover { border-top: 5px solid #6a5d52; } a.b:link, a.b:active, a.b:visited { color: #a8b078; background-color: #e5eacf; font-family: tahoma; font-size: 15; font-weight: bold; letter-spacing: 1px; text-align: center; text-decoration: none; padding-left: 20px; padding-right: 20px; padding-top: 15px; padding-bottom: 15px; margin: 1px; border-top: 5px solid #6a5d52; border-bottom: 5px solid #6a5d52; } a.b:hover { border-top: 5px solid #7ba689; border-bottom: 5px solid #7ba689; } h1 { color: #473d35; background-color: COLOR; font-family: georgia; font-size: 24; letter-spacing: 1px; line-height: 24px; padding: 0px; } h2 { color: #80827e; background-color: #fff; font-family: arial; font-size: 15; font-style: italic; letter-spacing: 1px; line-height: 15px; text-align: center; padding: 0px; border-bottom: 2px solid #6a5d52; } h3 { color: #80827e; background-color: #fff; font-family: arial; font-size: 15; font-style: italic; letter-spacing: 1px; line-height: -blocked-; text-align: center; padding: 0px; border-top: 2px solid #6a5d52; } textarea { background-color: #fff; border: 1px solid #000; color: #000; overflow: hidden; width: 150px; height: 20px; } #Content { width: 300px; height: 400px; overflow: auto; top: 30; left: 30; font: 8pt verdana; text-align: justify; background-color: #e5eacf; padding: 5px; border: 10px solid #bec890; } #Content2 { width: 300px; height: 400px; overflow: auto; top: 30; left: 650; font: 8pt verdana; text-align: justify; background-color: #e5eacf; padding: 5px; border: 10px solid #7ba689; } #Links { width: 250; top: 30; left: 380; line-height: 60px; text-align: center; } </style> <div id="Links" style="position: absolute;"> <a href="/" class="b">Un</a> <a href="/" class="b">Deux</a> <a href="/" class="b">Trois</a> <a href="/" class="b">Quatre</a> <a href="/" class="b">Cinq</a> <a href="/~Hyperlinked" class="b">Css</a> </div> <div id="Content" style="position: absolute;"> <h1>[All around me are familiar faces]</h1> <h2>Worn out places, worn out faces</h2>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur? Quis autem vel eum iure reprehenderit qui in ea voluptate velit esse quam nihil molestiae consequatur, vel illum qui dolorem eum fugiat quo voluptas nulla pariatur?" <p> <b>Boldness is Bold</b><br><i>italicness is Italic</i><br> Underlinedness is, well, underlined<br><strike>Strikeness is striking</strike><br><br><a href="/~hyperlinked">Normal link here</a> </p> <h2>Credit</h2> <center> Css by Rhea (apparency) <p> </p> </center> </div> <div id="Content2" style="position: absolute;"> <h1>[Bright and early for their daily races]</h1> <h3>going no where, going no where</h3> texthere texthere </div> .10
Browsers:
-Firefox
-Google Chrome
-Internet Explorer*

Lyrics featured:
Mad World by Gary Jules

Color Palette:
h a l t * by sugar! on Colourlovers

<style> table { background-color: transparent; z-index: -99; } table a img { display: none; z-index: -98; } .sf { display: none; } body { background-color: #a7191b; } b { color: #a7191b; background-color: #c0c0c0; padding: 2px; } i { color: #202020; } .u { font-family: none; font-size: 11; font-weight: bold; text-decoration: none; border-bottom: 2px solid #a7191b; } strike { color: #9e4648; } a:link, a:active, a:visited { color: #9e4648; letter-spacing: 1px; text-decoration: none; } a:hover { color: #000; } h1 { color: #000; background-color: #fff; font-family: courier new; font-size: 18; text-transform: uppercase; line-height: 5px; letter-spacing: 1px; text-align: left; } h2 { color: #fff; background-color: #a7191b; font-family: tahoma; font-size: 12; font-weight: bold; letter-spacing: 3px; text-align: center; padding: 0px; } textarea { background-color: #fff; border: 1px solid #000; color: #000; overflow: hidden; width: 150px; height: 20px; } #Content { width: 350px; height: 350px; overflow: auto; top: 250px; left: 300px; font: 8pt verdana; text-align: justify; background-color: #e2e2e2; padding: 5px; border: 20px solid #c0c0c0; } #Neck { width: 40px; height: 30px; top: 200px; left: 460px; background-color: #e2e2e2; color: #e2e2e2; border: 20px solid #c0c0c0; } #Face { width: 200px; height: 150px; top: 40px; left: 380px; background-color: #e2e2e2; color: #e2e2e2; border: 20px solid #c0c0c0; } #Thingy { top: -300px; left: 385px; color: #bc0011; font-size: 500; } #Thingy2 { top: -300px; left: 490px; color: #bc0011; font-size: 500; } #hp { top: -690px; left: 240px; color: #000; font-size: 900; font-family: century gothic; } #hp2 { top: -690px; left: 487px; color: #000; font-size: 900; font-family: century gothic; } #hp3 { width: 300px; height: 100px; top: 10px; left: 350px; font: 8pt verdana; text-align: center; background-color: #000; color: #808080; } </style> <div id="hp" style="position: absolute;">.</div> <div id="hp2" style="position: absolute;">.</div> <div id="hp3" style="position: absolute;"><p>CSS by Rhea (apparency)</p></div> <div id="Neck" style="position: absolute;">.</div> <div id="Face" style="position: absolute;">.</div> <div id="Thingy" style="position: absolute;">.</div> <div id="Thingy2" style="position: absolute;">.</div> <div id="Content" style="position: absolute;"> <center> <a href="/">On</a> | <a href="/">Off</a> | <a href="/">Restart</a> | <a href="/">Hibernate</a> | <a href="/~Hyperlinked">Css</a> </center> <h1>I want it all, give it to me</h1> <h2>Your love is a dose of eSTaCy.</h2> Etiam orci erat, consectetur vel aliquam scelerisque, vestibulum eu diam. Morbi ipsum lorem, suscipit a porttitor ac, tincidunt tincidunt diam. Fusce blandit adipiscing sapien non commodo. Lum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Proin euismod nisi et massa tempus sit amet molestie nibh porttitor. Nulla consectetur eleifend mattis. <p> <b>Boldness is Bold</b><br><i>italicness is Italic</i><br><font class="u">Underlinedness is, well, underlined</font><br><strike>Strikeness is striking</strike><br><br><a href="/~hyperlinked">Normal link here</a> </p> </div> .09
Browsers:
-Firefox
-Google Chrome

Lyrics featured:
Just Can't Get Enough by Black Eyed Peas

Color Palette:
None.

<style> table { background-color: transparent; z-index: -99; } table a img { display: none; z-index: -98; } .sf { display: none; } body { background-color: #27081d; } b { color: #66997b; } i { color: #6f4d55; } .u { font-family: tahoma; text-decoration: none; border-bottom: 2px double #47232c; } strike { font-family: georgia; } a:link, a:active, a:visited { color: #47232c; font-family: tahoma; font-size: 13; font-weight: bold; text-decoration: none; } a:hover { color: #47232c; background-color: #a4ca8b; } a.b:link, a.b:active, a.b:visited { color: #d2e7aa; background-color: #66997b; font-family: tahoma; font-size: 15; font-weight: bold; letter-spacing: 1px; text-align: center; padding: 2px; margin: 2px; text-decoration: none; padding-left: 25px; padding-right: 25px; padding-top: 7px; padding-bottom: 7px; } a.b:hover { background-color: #47232c; font-family: none; font-weight: bold; text-transform: uppercase; letter-spacing: 1px; text-align: center; padding-left: 25px; padding-right: 25px; padding-top: 7px; padding-bottom: 0px; } h1 { color: #47232c; font-family: georgia; font-size: 18; font-weight: bold; text-transform: uppercase; letter-spacing: 4px; text-align: right; padding-right: 5px; border-right: 7px solid #47232c; } h2 { color: #27081d; background-color: #66997b; border-bottom: 2px solid #a4ca8b; font-family: georgia; font-size: 14; font-weight: bold; letter-spacing: 1px; line-height: 2px; } textarea { background-color: #fff; border: 1px solid #000; color: #000; overflow: hidden; width: 150px; height: 20px; } #Content { width: 500px; height: 150px; overflow: auto; top: 30; left: 300; font: 8pt verdana; text-align: justify; background-color: #d2e7aa; padding: 5px; border: 10px solid #a4ca8b; } #box2 { width: 530px; height: 180px; overflow: auto; top: 15; left: 285; font: 8pt verdana; text-align: justify; background-color: #66997b; color: #66997b; padding: 5px; border: 10px solid #47232c; } #Content2 { width: 500px; height: 300px; overflow: auto; top: 320; left: 300; font: 8pt verdana; text-align: justify; background-color: #d2e7aa; color: color; padding: 5px; border: 10px solid #a4ca8b; } #box { width: 530px; height: 330px; overflow: auto; top: 305; left: 285; font: 8pt verdana; text-align: justify; background-color: #66997b; color: #66997b; padding: 5px; border: 10px solid #47232c; } #Header { width: 530px; text-align: right; font-family: tahoma; font-size: 44; color: #a4ca8b; line-height: 15px; background-color: #47232c; top: 250; left: 300; } #Links { top: 296; left: 320; } </style> <div id="box" style="position: absolute;">.</div> <div id="box2" style="position: absolute;">.</div> <div id="Header" style="position: absolute;">{ breathless }</div> <div id="Links" style="position: absolute;"> <a href="/" class="b">Un</a> <a href="/" class="b">Deux</a> <a href="/" class="b">Trois</a> <a href="/~Hyperlinked" class="b">Css</a> </div> <div id="Content" style="position: absolute;"> <h1>The scars of your love </h1> <h2>they leave me</h2>Neque porro quisquam est qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit...<p>There is no one who loves pain itself, who seeks after it and wants to have it, simply because it is pain... </p> </div> <div id="Content2" style="position: absolute;"> <h1>I can't help feeling</h1> <h2>we could've had it all </h2> Mauris vel est ac ipsum rhoncus rutrum in sit amet libero. Ut vel iaculis mi. Duis mattis urna sed nulla dictum at ultrices elit convallis. Quisque a tellus est, id aliquet elit. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Sed mollis placerat mauris, vel consectetur purus rutrum a. <p> <b>Boldness is Bold</b><br><i>italicness is Italic</i><br><font class="u">Underlinedness is, well, underlined</font><br><strike>Stikeness is striking</strike> <br><br><a href="/~hyperlinked">Normal link here</a> </p> <h2>Credit</h2> Css by Rhea (apparency) </div> .08
Browsers:
-Firefox
-Google Chrome
-Internet Explorer*

Lyrics featured:
Rolling in the Deep by Adele

Color Palette:
August 2008 by angelafaye on Colourlovers

<style> table { background-color: transparent; z-index: -99; } table a img { display: none; z-index: -98; } .sf { display: none; } body { background: url("http://i224.photobucket.com/albums/dd44/polarbomb/midnight.png"); background-attachment: fixed; background-repeat: no-repeat; } b { background-color: #e2e2e2; color: #5a5d6c; padding: 2px; } i { color: #61698f; } .u { text-decoration: none; border-bottom: 2px solid #20274c; } a:link, a:active, a:visited { color: #5a5d6c; font-weight: bold; text-decoration: none; } a:hover { color: #20274c; letter-spacing: 3px; } h1 { color: #fff; font-family: century gothic; font-size: 17; border-top: 2px solid #5a5d6c; line-height: 5px; } h2 { color: #000; font-family: verdana; font-size: 14; background-color: #e2e2e2; border-right: 9px solid #5a5d6c; } a.b:link, a.b:active, a.b:visited { display: block; width: 195px; font-family: century gothic; font-size: 15; text-align: center; letter-spacing: 4px; padding-bottom: 9px; padding-top: 9px; margin: 2px; color: #000; background-color: #2d343f; text-decoration: none; } a.b:hover { display: block; width: 195px; text-align: center; padding-bottom: 9px; padding-top: 9px; margin: 2px; color: #fff; background-color: #20274c; text-decoration: none; } #Content { width: 200px; height: 300px; overflow: auto; top: 300px; left: 130px; text-align: justify; font: 8pt verdana; color: #e2e2e2; background-color: #131519; padding: 5px; } #Content2 { width: 200px; height: 400px; overflow: auto; top: 200px; left: 370px; text-align: justify; font: 8pt verdana; color: #e2e2e2; background-color: #131519; padding: 5px; } #Content3 { width: 200px; height: 350px; overflow: auto; top: 250px; left: 610px; text-align: justify; font: 8pt verdana; color: #e2e2e2; background-color: #131519; padding: 5px; } #Links { width: 200px; height: 250px; top: 350px; left: 850px; color: #fff; text-align: justify; background-color: #131519; padding: 5px; } #Block { width: 925px; height: 50px; top: 609px; left: 130px; font: 8pt verdana; color: #2d343f; background-color: #131519; border-bottom: 15px solid #2d343f; padding-left: 5px; padding-top: 5px; } #Moon { top: -2130px; left: 480px; font-size: 2500; font-family: century gothic; color: #fff; } </style> <div id="Moon" style="position: absolute;">.</div> <div id="Block" style="position: absolute;">CSS by Rhea (apparency)</div> <div id="Content" style="position: absolute;"> <h1>One hand in the air</h1> <h2>for the big city</h2> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam tincidunt, elit in accumsan semper, enim felis vulputate odio, varius sodales purus erat nec ligula. Nullam ipsum lectus, accumsan in vehicula vel, dapibus eu metus. Aenean dignissim pretium diam, non porta massa bibendum vitae. </div> <div id="Content2" style="position: absolute;"> <h1>Street lights Big dreams</h1> <h2>all looking pretty</h2> Mauris vel est ac ipsum rhoncus rutrum in sit amet libero. Ut vel iaculis mi. Duis mattis urna sed nulla dictum at ultrices elit convallis. Quisque a tellus est, id aliquet elit. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Sed mollis placerat mauris, vel consectetur purus rutrum a. <p> <b>Boldness is Bold</b><br><i>italicness is Italic</i><br><font class="u">Underlinedness is, well, underlined<br><br><a href="/~hyperlinked">Normal link here</a> </font></p> </div> <div id="Content3" style="position: absolute;"> <h1>No place in the world</h1> <h2>that can compare</h2> Donec mollis urna id ligula molestie tincidunt. Pellentesque pellentesque malesuada iaculis. Vestibulum tempus dui et tortor convallis nec sollicitudin massa bibendum. Suspendisse nibh diam, dictum et eleifend eu, dignissim vel urna. </div> <div id="Links" style="position: absolute;"> <a href="/" class="b">Un</a> <a href="/" class="b">Deux</a> <a href="/" class="b">Trois</a> <a href="/" class="b">Quatre</a> <a href="/" class="b">Cinq</a> <a href="/~hyperlinked" class="b">Css</a> </div> .07
Browsers:
-Firefox*
-Google Chrome
-Internet Explorer*

Lyrics featured:
Empire State of Mind by Jay-Z

Color Palette:
None.

<style> table { background-color: transparent; z-index: -99; } table a img { display: none; z-index: -98; } .sf { display: none; } body { background-color: #cbe86b; } b { color: #94ba0c; letter-spacing: 1px; } i { color: #404040; } .u { font-weight: bold; text-decoration: none; border-bottom: 3px solid #cbe86b; } a:link, a:active, a:visited { color: #000; text-decoration: none; letter-spacing: 1px; } a:hover { color: #000; font-weight: bold; border-bottom: 1px solid #cbe86b; } a.b:link, a.b:active, a.b:visited { display: block; width: 100px; color: #fff; background-color: #1c140d; font-family: tahoma; font-size: 12; font-weight: bold; text-transform: uppercase; text-decoration: none; letter-spacing: 1px; text-align: right; padding: 2px; margin: 2px; border: 1px solid #1c140d; } a.b:hover { color: #fff; background-color: #cbe86b; font-family: tahoma; font-size: 12; font-weight: bold; letter-spacing: 1px; padding: 2px; margin: 2px; border: 1px solid #1c140d; } h1 { color: #1c140d; background-color: #cbe86b; font-family: tahoma; font-size: 14; letter-spacing: 3px; text-transform: uppercase; text-align: center; padding: 2px; border-left: 10px double #1c140d; border-right: 10px double #1c140d; } h2 { color: #cbe86b; font-family: tahoma; font-size: 11; font-style: italic; letter-spacing: 6px; text-align: center; } textarea { background-color: #fff; border: 1px solid #000; color: #000; overflow: hidden; width: 150px; height: 20px; } #block { width: 1200px; height: 347px; overflow: auto; top: 300px; left: 0px; font: 32pt tahoma; text-align: right; background-color: #fff; color: #cbe86b; border-bottom: 10px solid #f2e9e1; } #Content { width: 300px; height: 400px; overflow: auto; top: 200px; left: 300px; font: 8pt verdana; text-align: justify; background-color: #fff; color: #000; padding: 5px; border-top: 8px solid #1c140d; } #Header { top: 250px; left: 630px; font: 40pt tahoma; color: #fff; } #Links { top: 450px; left: 190px; font: 8pt verdana; } </style> <div id="Header" style="position: absolute;">I can't take back</div> <div id="Block" style="position: absolute;">the words I never said</div> <div id="Links" style="position: absolute;"> <a href="/" class="b">Un</a> <a href="/" class="b">Deux</a> <a href="/" class="b">Trois</a> <a href="/" class="b">Quatre</a> <a href="/~Hyperlinked" class="b">Css</a> CSS by apparency </div> <div id="Content" style="position: absolute;"> <h1>As I drown</h1> <h2>In my regrets</h2> <b>Boldness is Bold</b><br><i>italicness is Italic</i><br><font class="u">Underlinedness is, well, underlined</font><br><br><a href="/~hyperlinked">Normal link here</a> <p> Vivamus hendrerit ultricies nibh, at viverra ante molestie quis. In in lorem magna, a posuere ipsum. Donec auctor quam eget magna elementum semper. Nunc iaculis pretium mollis. Nam molestie nunc nec tortor hendrerit lacinia. Aenean vulputate leo in est porttitor vulputate. Nulla accumsan tempus tortor eget auctor. Ut quis leo nisi. Ut non laoreet orci. Proin vel mi non leo adipiscing suscipit ut non orci. Nunc quam dui, aliquam et euismod at, porta sit amet eros. Praesent at tellus placerat leo convallis dapibus quis id odio. Sed non purus a erat congue laoreet placerat aliquet nulla. Pellentesque molestie lobortis egestas. Vivamus scelerisque faucibus dictum. Curabitur ac libero ut magna luctus condimentum. Proin euismod nisi et massa tempus sit amet molestie nibh porttitor. Nulla consectetur eleifend mattis. </p> </div> .06
Browsers:
-Firefox
-Google Chrome
-Internet Explorer*

Lyrics featured:
Words I never said by Lupe Fiasco

Color Palette:
W o r d l e s s . by COPASO on Colourlovers

<style> table { background-color: transparent; z-index: -99; } table a img { display: none; z-index: -98; } .sf { display: none; } body { background-color: #0e1425; } b { color: #334048; } i { color: #404040; } .u { text-decoration: none; border-bottom: 3px double #8b9883; } a:link, a:active, a:visited { color: #000; letter-spacing: 2px; font-weight: bold; text-decoration: none; } a:hover { color: #334048; } h1 { color: #334048; font-family: arial; font-size: 18; text-align: center; line-height: 11px; border-left: 5px solid #0e1425; border-right: 5px solid #0e1425; } h2 { color: #0e1425; font-family: arial; font-size: 10; text-align: right; border-bottom: 3px solid #8b9883; } a.b:link, a.b:active, a.b:visited { color: #0e1425; background-color: #bfbd9d; text-decoration: none; font-family: verdana; font-size: 12; letter-spacing: 1px; padding: 3px; } a.b:hover { color: #fff; background-color: #bfbd9d; text-decoration: none; font-family: verdana; font-size: 12; letter-spacing: 1px; padding: 3px; } #Content { width: 300px; height: 200px; top: 100px; left: 450px; overflow: auto; font: 8pt verdana; background-color: #ddd5b3; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; border-bottom: 10px solid #bfbd9d; border-top: 3px solid #bfbd9d; } #a { top: 350px; left: 350px; font-family: ar bonnie; font-size: 34; color: #ddd5b3; background-color: #334048; letter-spacing: 2px; padding: 2px; } #b { top: 400px; left: 300px; font-family: ar bonnie; font-size: 34; color: #ddd5b3; background-color: #334048; letter-spacing: 2px; padding: 2px; } #c { top: 450px; left: 160px; font-family: ar bonnie; font-size: 34; color: #ddd5b3; background-color: #334048; letter-spacing: 2px; padding: 2px; } #PThingy { top: 296px; left: 159px; font-size: 144; color: #8b9883; } #Thingy { top: 290px; left: 165px; font-size: 144; color: #ddd5b3; } </style> <div id="PThingy" style="position: absolute;">&</div> <div id="Thingy" style="position: absolute;">&</div> <div id="a" style="position: absolute;">Give me envy</div> <div id="b" style="position: absolute;">Give me malice</div> <div id="c" style="position: absolute;">Baby, give me a break!</div> <div id="Content" style="position: absolute;"> <a href="/" class="b">One</a> <a href="/" class="b">Two</a> <a href="/" class="b">Three</a> <a href="/" class="b">Four</a> <a href="/~Hyperlinked" class="b">Css</a> <br><p> </p> <h1>You're pulling the trigger</h1> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam tincidunt, elit in accumsan semper, enim felis vulputate odio, varius sodales purus erat nec ligula. Nullam ipsum lectus, accumsan in vehicula vel, dapibus eu metus. Aenean dignissim pretium diam, non porta massa bibendum vitae. <p> <b>Boldness is Bold</b><br><i>italicness is Italic</i><br><font class="u">Underlinedness is, well, underlined</font><br><br><a href="/~hyperlinked">Normal link here</a> </p> <h2>Pulling the trigger all wrong</h2> Mauris vel est ac ipsum rhoncus rutrum in sit amet libero. Ut vel iaculis mi. Duis mattis urna sed nulla dictum at ultrices elit convallis. <h2>Credit</h2> Css by Rhea (apparency) </div> .05
Browsers:
-Firefox
-Google Chrome
-Internet Explorer

Lyrics featured:
Time to Dance by Panic at the Disco

Color Palette:
s t a r l i g h t * by sugar! on Colourlovers

<style> table { background-color: transparent; z-index: -99; } table a img { display: none; z-index: -98; } .sf { display: none; } body { background-color: #f4fad2; } b { color: #ff4242; } i { color: #a2b822; } .u { border-bottom: 1pt solid #000000; } a:link, a:active, a:visited { color: #000000; background-color: #e1edb9; text-decoration: none; } a:hover { color: #6c7466; background-color: #e1edb9; font-weight: bold; text-decoration: none; } h1 { color: #6c7466; font-family: courier new; font-size: 24; line-height: 11px; text-transform: lowercase; letter-spacing: 1px; text-align: center; } h2 { color: #ff4242; background-color: #fff; font-family: courier new; font-size: 11; text-transform: lowercase; letter-spacing: 1px; text-align: center; } h3 { color: #a2b822; background-color: #fff; font-family: courier new; font-size: 11; text-transform: lowercase; letter-spacing: 1px; text-align: center; } a.b:link, a.b:active, a.b:visited { display: block; background-color: #ff4242; color: #fff; width: 141; text-align: center; font-family: tahoma; font-size: 14; letter-spacing: 2px; text-decoration: none; padding: 2px; margin: 6px; } a.b:hover { display: block; background-color: #ff4242; color: #fff; width: 140; text-align: left; letter-spacing: 3px; font-family: tahoma; font-size: 18; text-decoration: none; padding: 2px; margin: 6px; } a.d:link, a.d:active, a.d:visited { display: block; background-color: #ff4242; color: #fff; width: 141; text-align: center; font-family: tahoma; font-size: 14; letter-spacing: 2px; text-decoration: none; padding: 2px; margin: 6px; } a.d:hover { display: block; background-color: #ff4242; color: #fff; width: 140; text-align: right; letter-spacing: 3px; font-family: tahoma; font-size: 18; text-decoration: none; padding: 2px; margin: 6px; } a.c:link, a.c:active, a.c:visited { display: block; background-color: #d4ee5e; color: #000; width: 140; text-align: center; font-family: tahoma; font-size: 14; letter-spacing: 2px; text-decoration: none; padding: 2px; margin: 6px; } a.c:hover { display: block; background-color: #d4ee5e; color: #000; width: 140; text-align: left; letter-spacing: 3px; font-family: tahoma; font-size: 18; text-decoration: none; padding: 2px; margin: 6px; } #Content { width: 400px; height: 500px; overflow: auto; top: 50px; left: 70px; font: 8pt verdana; text-align: justify; background-color: #f0f2eb; padding: 5px; border: 10px solid #e1edb9; } #Content2 { width: 300px; height: 400px; overflow: auto; top: 150px; left: 850px; font: 8pt verdana; text-align: justify; background-color: #f0f2eb; padding: 5px; border: 10px solid #e1edb9; } #pole { width: 20px; height: 380px; top: 200px; left: 660px; font: 13pt arial; color: #6c7466; background-color: #6c7466; } #footer { width: 1102px; height: 50px; top: 580px; left: 70px; font: 8pt verdana; padding-left: 8px; color: #6c7466; background-color: #e1edb9; border-bottom: 20px solid #d4ee5e; } #Links { width: 150px; height: 380px; top: 200px; left: 510px; } #Links2 { width: 150px; height: 380px; top: 50px; left: 164px; } </style> <div id="pole" style="position: absolute;">- - - - - - -</div> <div id="footer" style="position: absolute;"><p>CSS by Rhea (apparency) </p></div> <div id="Content" style="position: absolute;"> <h1>I walk this empty street</h1> <h3>Along the Boulevard of Broken Dreams</h3> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam tincidunt, elit in accumsan semper, enim felis vulputate odio, varius sodales purus erat nec ligula. Nullam ipsum lectus, accumsan in vehicula vel, dapibus eu metus. Aenean dignissim pretium diam, non porta massa bibendum vitae. Mauris vel est ac ipsum rhoncus rutrum in sit amet libero. Ut vel iaculis mi. Duis mattis urna sed nulla dictum at ultrices elit convallis. Quisque a tellus est, id aliquet elit. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Sed mollis placerat mauris, vel consectetur purus rutrum a. Donec mollis urna id ligula molestie tincidunt. Pellentesque pellentesque malesuada iaculis. Vestibulum tempus dui et tortor convallis nec sollicitudin massa bibendum. Suspendisse nibh diam, dictum et eleifend eu, dignissim vel urna. <p> <b>Boldness is Bold</b><br><i>italicness is Italic</i><br><font class="u">Underlinedness is, well, underlined</font><br><br><a href="/~hyperlinked">Normal link here</a> </p> </div> <div id="Content2" style="position: absolute;"> <h1>Where the city sleeps</h1> <h2>And I'm the only one and I walk alone</h2> Maecenas vel urna non arcu vestibulum commodo. Maecenas vitae tellus nunc, pellentesque rutrum odio. Curabitur suscipit interdum diam id egestas. Curabitur sollicitudin mi vitae mauris porttitor lacinia. Nam condimentum est at nulla consectetur non porttitor risus suscipit. Maecenas laoreet fringilla lacinia. Suspendisse ut diam ac purus ultrices tempus. Morbi iaculis, felis fringilla fringilla aliquet, nulla dolor posuere lectus, id porta tortor erat eget lorem. Morbi commodo diam a dolor rhoncus in varius urna ullamcorper. </div> <div id="Links" style="position: absolute;"> <a href="/" class="b">Un</a> <a href="/" class="c">Deux</a> <br><p> <br><a href="/~hyperlinked" class="c">Css</a> </p> <div id="Links2" style="position: absolute;"> <a href="/" class="d">Trois</a> <a href="/" class="d">Quatre</a> </div> </div> .04
Browsers:
-Firefox
-Google Chrome
-Internet Explorer*

Lyrics featured:
Boulevard of Broken Dreams

Color Palette:
By Miaka on Colourlovers

<style> table { background-color: transparent; z-index: -99; } table a img { display: none; z-index: -98; } .sf { display: none; } body { background-color: #0b326f; } a:link, a:visited, a:active { color: #e7cb6b; text-decoration: none; } a:hover { color: #f1c83b; } a.b:link, a.b:active, a.b:visited { color: #061e42; background-color: #0d3875; display: block; text-decoration: none; width: 100px; text-align: center; padding: 2px; margin: 3px; } a.b:hover { color: #e7cb6b; background-color: #0d3875; display: block; text-decoration: none; width: 200px; text-align: center; padding: 2px; margin: 3px; } h1 { color: #ffffff; padding-left: 5px; font-size: 25px; } b { color: #f1c83b; letter-spacing: 2px; text-transform: lowercase; } i { color: #fff; text-transform: lowercase; } .u { color: #000000; border-bottom: 1px solid #e7cb6b; } #Header { width: 700px; height: 500px; overflow: auto; top: 30px; left: 10px; font: 44pt century gothic; color: #f1c83b; text-align: justify; } #Content { width: 700px; height: 300px; overflow: auto; top: 100px; left: 0px; font: 8pt verdana; text-align: justify; background-color: #144386; padding-left: 5px; padding-right: 5px; border-right: 20px solid #0d3875; padding-top: 5px; border-top: 20px solid #0d3875; padding-bottom: 5px; border-bottom: 20px solid #0d3875; } #Header2 { top: 480px; left: 0px; font: 18pt georgia; color: #e7cb6b; text-align: justify; background-color: #0d3875; padding-left: 5px; padding-right: 10px; padding-top: 10px; padding-bottom: 10px; } #Header3 { top: 540px; left: 0px; font: 18pt georgia; color: #e7cb6b; text-align: justify; background-color: #0d3875; padding-left: 5px; padding-right: 10px; padding-top: 10px; padding-bottom: 10px; } #Links { top: 115px; left: 725px; font: 18pt arial; color: #000; text-align: justify; } </style> <div id="Header" style="position: absolute;"> Written in the stars* </div> <div id="Header2" style="position: absolute;"> A message to the main </div> <div id="Header3" style="position: absolute;"> Seasons come and go, but I will never change </div> <div id="Content" style="position: absolute;"> <h1>A million miles away</h1> Aenean consectetur ligula bibendum massa iaculis nec pretium velit sodales. In urna sem, lacinia sed cursus a, posuere sit amet turpis. Integer auctor commodo porta. Donec euismod cursus neque, non tristique felis malesuada at. Sed hendrerit luctus orci ut sagittis. Phasellus rhoncus pretium turpis sed lobortis. Morbi congue enim vitae justo lacinia porta. Nulla in ultrices orci. In eleifend cursus metus, sit amet lacinia mi dictum sit amet. Mauris scelerisque vestibulum mi ac ullamcorper. Duis et urna vel eros facilisis malesuada ac adipiscing ante. Donec lacinia lacus tempor urna suscipit eget laoreet enim fermentum. <p> <b>Boldness is Bold</b><br><i>italicness is Italic</i><br><font class="u">Underlinedness is, well, underlined</font><br><strike>Strikeness is striking</strike><br><br><a href="/~hyperlinked">Normal link here</a> </p> <h1>Credit</h1> CSS by Rhea (apparency) </div> <div id="Links" style="position: absolute;"> <a href="/~hyperlinked" class="b">Un</a> <br><a href="/" class="b">Deux</a> <br><a href="/" class="b">Trois</a> <br><a href="/" class="b">Quatre</a> <br><a href="/~hyperlinked" class="b">Css</a> <br> </div> .03
Browsers:
-Firefox
-Google Chrome
-Internet Explorer*

Lyrics featured:
Written in the Stars by Tinie Tempah

Color Palette:
None.

<style> table { background-color: transparent; z-index: -99; } table a img { display: none; z-index: -98; } .sf { display: none; } body { background-color: #ded4d4; } b { background-color: #272121; color: #fff; padding: 2px; } i { color: #be7678; } .u { color: #000; border-bottom: 1px solid #000; } a:link, a:active, a:visited { color: #000; font-weight: bold; text-decoration: none; } a:hover { color: #be7678; } a.b:link, a.b:active, a.b:visited { color: #fff; background-color: #ddb5b5; padding-left: 25px; padding-top: 10px; padding-bottom: 10px; padding-right: 25px; letter-spacing: 2px; text-align: center; text-decoration: none; text-transform: lowercase; } a.b:hover { color: #ddb5b5; background-color: #272121; padding-left: 25px; padding-top: 10px; padding-bottom: 10px; padding-right: 25px; letter-spacing: 2px; text-align: center; text-decoration: none; text-transform: uppercase; } h1 { color: #ddb5b5; font-family: Georgia; font-size: 24; text-align: right; line-height: 15px; } h2 { color: #605858; font-family: Georgia; font-size: 14; letter-spacing: 2px; } #Content { color: #000; width: 400px; height: 300px; overflow: auto; top: 125px; left: 250px; font: 8pt verdana; text-align: justify; background-color: #fff; padding: 5px; } #Links { color: #000; width: 400px; top: 445px; left: 250px; text-align: center; line-height: 25px; } #PQuote { color: #000; top: 78px; left: 117px; font: 175pt wingdings; } #Quote { color: #272121; top: 70px; left: 130px; font: 175pt wingdings; } #PQuote2 { color: #000; top: 348px; left: 667px; font: 175pt wingdings; } #Quote2 { color: #272121; top: 340px; left: 657px; font: 175pt wingdings; } </style> <div id="PQuote" style="position: absolute;">}</div> <div id="Quote" style="position: absolute;">}</div> <div id="PQuote2" style="position: absolute;">~</div> <div id="Quote2" style="position: absolute;">~</div> <div id="Content" style="position: absolute;"> <h1>She said what are you waiting for?</h1> Nam orci dolor, eleifend sit amet varius sed, adipiscing et diam. Pellentesque ligula augue, <i>eleifend</i> sed ultrices sit amet, interdum id turpis. Pellentesque sit amet ultrices tellus. Ut tincidunt adipiscing adipiscing. Duis a orci mi. <h2>Kiss her, Kiss her.</h2> Maecenas pellentesque magna et nisl elementum quis interdum orci mattis. Curabitur quis lectus sed purus viverra molestie nec et lorem. Morbi porta, neque non molestie faucibus, lacus dolor tincidunt ante, vel gravida enim ante quis mauris. <p> <b>Boldness is Bold</b><br><i>italicness is Italic</i><br><font class="u">Underlinedness is, well, underlined</font><br><br><a href="/~hyperlinked">Normal link here</a> </p> <h2>Credit</h2> CSS by Rhea (apparency) </div> <div id="Links" style="position: absolute;"> <a href="/" class="b">Un</a> <a href="/" class="b">Deux</a> <a href="/" class="b">Trois</a> <br><a href="/" class="b">Quatre</a> <a href="/~Hyperlinked" class="b">Css</a> </div> .02
Browsers:
-Google Chrome
-Internet Explorer

Lyrics featured:
A Little Less Than Sixteen Candles... by Panic At the Disco

Color Palette:
None.

<style> table { background-color: transparent; z-index: -99; } table a img { display: none; z-index: -98; } .sf { display: none; } body { background-color: #F9CDAD; } b { color: #83af9b; } i { color: #fe4365; } .u { color: #000; border-bottom: 1px solid #fc9d9d; } a:link, a:active, a:visited { color: #404040; font-weight: bold; font-size: 12; font-family: verdana; text-decoration: none; } a:hover { color: #c8c8a9; } a.b:link, a.b:active, a.b:visited { color: #83AF9B; font-size: 35; font-weight: normal; font-family: verdana; border-left: solid 15px #83AF9B; padding-left: 35px; text-transform: lowercase; text-decoration: none; } a.b:hover { color: #FC9D9A; font-size: 40; font-family: arial; border-left: solid 15px #83AF9B; padding-left: 35px; text-transform: lowercase; text-decoration: none; } h1 { color: #FE4365; font-family: arial; font-size: 48; font-style: italic; text-transform: lowercase; } h2 { color: #FC9D9A; font-family: arial; text-align: right; font-size: 24; } h3 { color: #83AF9B; line-height: 0px; font-family: verdana; font-size: 15; } h4 { color: #C8C8A9; line-height: 0px; font-family: verdana; text-align: right; font-size: 15; } #Content { width: 500px; height: 300px; overflow: auto; top: 150px; left: 200px; font: 8pt arial; text-align: justify; background-color: #ffffff; padding: 8px; } #Header { width: 500; top: 40px; left: 200px; } #Header2 { width: 800; top: 100px; left: 1px; text-align: justify; } #Thingy { line-height: 0px; top: 65px; font: 250pt verdana; left: 10px; text-align: justify; } #Links { width: 200px; height: 300px; overflow: auto; top: 150px; left: 720px; text-align: justify; } </style> <div id="Thingy" style="position: absolute;">{</div> <div id="Header" style="position: absolute;"><h1>Up On Melancholy Hill</h1></div> <div id="Header2" style="position: absolute;"><h2>There's a plastic tree are you here with me?</h2></div> <div id="Content" style="position: absolute;"> <h3>Just looking out for the day...</h3> Sed nec mi elit, eget egestas enim. Quisque faucibus enim nec dolor vulputate ullamcorper. Integer sed lorem sit amet nibh dictum mollis ac non est. Proin a nibh vitae dui consequat scelerisque nec vitae lorem. Nulla facilisi. Sed metus sapien, volutpat eget sollicitudin in, euismod vel magna. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; <p> <b>Boldness is Bold</b><br><i>italicness is Italic</i><br><font class="u">Underlinedness is, well, underlined</font><br><strike>Strikeness is striking</strike><br><br><a href="/~hyperlinked">Normal link here</a> </p> <h4>When you're close to me.</h4> Pellentesque congue tellus et justo dignissim sit amet rhoncus est egestas. Etiam vel nisl nulla, a vehicula magna. Integer varius vehicula venenatis. Etiam ac nibh magna, non sollicitudin massa. Sed sem nunc, iaculis sed sagittis ut, fermentum non mi. Curabitur ligula eros, interdum quis porttitor id, tempor non turpis. <h3>Credit</h3> CSS by Rhea(apparency) <p> </p> </div> <div id="Links" style="position: absolute;"> <p> </p> <p> <a href="/" class="b">Un</a><br><a href="/" class="b">Deux</a><br><a href="/" class="b">Trois</a><br><a href="/" class="b">Quatre</a><br><a href="/" class="b">Cinq</a><br><a href="/~Hyperlinked" class="b">Css</a> </p> </div> .01
Browsers:
-Firefox
-Google Chrome
-Internet Explorer

Lyrics featured:
Melancholy Hill by Gorillaz

Color Palette:
(???) by sugar! on Colourlovers