Free CSS

So, over the two-ish? Years I've been here, of course you end up collecting lots of old css if you make it yourself! Upon digging through my computer I found a few layouts I decided were alright enough to give away to the public. All of these were made by me, with help from Torn and Brit, though I'm not sure which ones were made /purely/ by me and which I had help for, so, just to be sure, please credit these two. Some of this is so old, I don't know where the old bits came from.

EDIT: since people keep thinking others are ripping my code, if you use it, can ya'll pretty please post down below that you're using the codes? Thanks!

FAQ

Q: I don't know what to do, will you customize this for me?
A: No. I'm just giving these away, not doing CSS requests.

Q: I messed something up, will you help me fix it?
A: No, because chances are I wont be able to fix it. This CSS is old, (or new) But normally if I mess up, I have to start from scratch.

Q: I don't know how to use any of this, but I want to use it! Will you help me?
A: No. I'm just releasing these for people, chances are, I can't help you. There are loads of tutorials floating around, go look some of those up if you find yourself stuck.

Q: I don't see anything here I like!
A: Check back every so often if you get bored, I'll put more and more here once I've decided to be done with it.

Q: Can I pick through the code on these and use what I like?
A: I don't mind at all, but, remember some of this isn't mine at all, as I got lots of help from Brit and Torn. If you do, all I ask is that you credit those two and myself as well.

Q: I know what I'm doing, when I put in the code, something went very wrong, (aka code is missing, cut off, broken or missing divs).
A: I'll supply you with the original code.

PINK BASED CSS

 <center><style>a.info { position:relative; z-index:24; text-decoration:none } a.info:hover { z-index:25;} a.info span { display: none; } a.info:hover span { display:block; position:absolute; top:2em; left:2em; width:100px; color: #EFA08C; border: 4px dotted #AF2124; background-color:#07CFDA; text-align: left; padding: 10px; } </style><style>.sidebar{display:none;}</style></style><style>.sidebar{display:none;}</style>

<center><div style=" margin-left:-100px; background-image:url('http://www.wallsave.com/wallpapers/800x600/pink-stripes/44559/pink-stripes-desktop-backgrounds-puter-44559.jpg'); width: 999px; height: 1400px; overflow: hidden; border: 1px solid #Ab2601; box-shadow: 1px 1px 50px #FFEBA6; color: #A64137;"> 

 <a class="info"><b>Disclaimer and Contract</b><span>Free to use by those that want to. You may edit this as you see fit, but you must give credit to me, I don't care how much you edit this. </a>



<center><div style=" background-color: #EFA08C; width: 819px; height: 1220px; overflow: hidden; border: 1px solid #661601; color: #7DBEB8;"> 

<div align=center><table width="250px"><tr><td> 

<div style="background-image:url('http://www.wallsave.com/wallpapers/800x600/pink-stripes/44559/pink-stripes-desktop-backgrounds-puter-44559.jpg'); width: 300px; height: 320px; border:5px dotted #Ab2601; color: #08E3FF; text-align: center; margin-left:30px; margin-bottom: -20px; overflow: hidden;"> 

<div style="background-color:#F4EEDA; width: 300px; height: 310px; border: none: #08E3FF; Overflow: auto; padding: 25px 8px;"> 

Box one


<br><br>
</div>
</div> 


</td><td> 
<div style="background-image:url('http://www.papermarc.com.au/images/ppd-stripes_yellow-lg.jpg'); width: 300px; height: 320px; border: 7px double #Ab2601; color: #08E3FF; text-align: center; margin-left:70px; overflow: hidden;">   

<div style="background-image:url('http://fc07.deviantart.net/fs70/i/2010/214/3/8/Pink_Stripes_Wallpaper_by_Amaya_Natsuyumi.png'); width: 300px; height: 310px; border: none: #08E3FF; Overflow: auto; padding: 25px 15px;"> 

Box two

<br><br>
</div>

</div> 
</td></tr></table></div>


<div style="background-image:url('http://fc07.deviantart.net/fs70/i/2010/214/3/8/Pink_Stripes_Wallpaper_by_Amaya_Natsuyumi.png'); width: 700px; height: 230px; border: 1px solid #661601; Overflow: hidden; color: #08E3FF;">  
<div style="background-color: #TRANSPARENT; width: 600px; height: 230px; border: none: #08E3FF; Overflow: auto; padding: 25px 15px; color: #DE3100;"> 

Box three
</div>
</div>


<div align=center><table width="250px"><tr><td> 

<div style="background-image:url('http://www.papermarc.com.au/images/ppd-stripes_yellow-lg.jpg'); width: 300px; height: 320px; border: 7px double #Ab2601; color: #08E3FF; text-align: center; margin-left:70px; overflow: hidden;">  

<div style="background-image:url('http://fc07.deviantart.net/fs70/i/2010/214/3/8/Pink_Stripes_Wallpaper_by_Amaya_Natsuyumi.png'); width: 300px; height: 310px; border: none: #08E3FF; Overflow: auto; padding: 25px 15px;"> 


Box four


</div>
</div> 


</td><td> 

<div style="background-image:url('http://www.wallsave.com/wallpapers/800x600/pink-stripes/44559/pink-stripes-desktop-backgrounds-puter-44559.jpg'); width: 300px; height: 320px; border:5px dotted #Ab2601; color: #08E3FF; text-align: center; margin-left:30px; margin-bottom: 10px; overflow: hidden;"> 

<div style="background-color:#F4EEDA; width: 300px; height: 310px; border: none: #08E3FF; Overflow: auto; padding: 25px 5px;"> 

box five
</div>

</div> 
</td></tr></table></div>


</div>
 </div></center></i>


<style>a:link { color: #DE3100; text-decoration:none !important;-webkit-transition: all .2s ease-in-out!important; -moz-transition: all .2s ease-in-out!important; text-shadow: 0px 0px 5px;} a:visited { color: #DE3100; text-decoration:none !important;-webkit-transition: all .2s ease-in-out!important; -moz-transition: all .2s ease-in-out!important; text-shadow: 0px 0px 5px;} a:hover { color: #fc9693; text-decoration:none !important;-webkit-transition: all .2s ease-in-out!important; -moz-transition: all .2s ease-in-out!important; text-shadow: 0px 0px 5px} a:active { color: #08E3FF;-webkit-transition: all .2s ease-in-out!important; -moz-transition: all .2s ease-in-out!important;}

.box{background-color: #463330;border: 3px solid #661601;width: 720px; -moz-border-radius: 15px;border-radius: 15px; border: 3px solid #f4f4f4; border-style: double; margin-right: 100px; margin: 0 auto; text-align: left;} .boxcont{padding: 5px;} #wrapper{width:1000px; margin: 0 auto;} body{background-image: none; font-family: Verdana, Geneva, sans-serif; font-size: 10px; color: #DE3100;}#sidebar-left, #logo{display:none !important; width: 0px !important; }#wrapper #container #center .right-corner .left-corner{background-color: #EFA08C;border: 0px dashed #EFA08C;-moz-border-radius: 15px;border-radius: 15px;}tr.even, .comment.even, .comment.odd, tr.odd{background-color: #F4EEDA;border: 7px double #661601;margin:5px;-moz-border-radius: 15px;border-radius: 15px;}.node{border: 0px;}.breadcrumb, h2, .with-tabs, #header-region{display:none !important;}#tabs-wrapper{border:0px;}.blog_usernames_blog, .statistics_counter{display:none !important;}body{background-color:#EFA08C}h1 {font-family: Tahoma, sans-serif;font-size: 12pt;color: #FFF;border-bottom: 1px solid #4b634f;font-weight:bold;}.links{background: transparent !important;margin-top: -2px !important;font-size: 7.2pt !important;} #header { height: 20px !important;} table {border-collapse: separate; padding: 0px !important; margin: 0px !important; } a.info { position:relative; z-index:24; text-decoration:none; border-bottom: 1px dotted #4b634f; } a.info:hover { z-index:25; background-color: #EFA08C; border-bottom: 1px dotted #4b634f;} a.info span { display: none; border-bottom: 1px dotted #172F45;} a.info:hover span { display:block; position:absolute; top:2em; left:2em; width:130px; color: #CCC; border:1px solid #661601; background-color:#EFA08C; text-align: left; padding: 10px; } a.info2 { position:relative; z-index:24; text-decoration:none; border-bottom: 1px dotted #172F45; } a.info:hover2 { z-index:25; background-color: #EFA08C; border-bottom: 1px dotted #172F45;} a.info2 span { display: none; border-bottom: 1px dotted #172F45;} a.info2:hover span { display:block; position:absolute; top:2em; left:2em; width:200px; color: #CCC; border:1px solid #EFA08C; background-color:#EFA08C; text-align: left; padding: 10px; } #squeeze { margin-left: 240px !important; width: 950px; } .node { margin-left: 0px !important; } .node, .preview { background: transparent; border:0px; } .picture { margin-left: -30px !important; } #comment-form { margin-left: 50px !important; }

</style></center>

TABCSS1


<div style="position:relative; width:1px; height:1px; z-index:3; padding:0px; margin:0px;"><img src="YOUR CHOICE OF IMAGE HERE" style="position:relative; left:550px; bottom:-800px;"></div>

<center><style>a.info { position:relative; z-index:24; text-decoration:none } a.info:hover { z-index:25;} a.info span { display: none; } a.info:hover span { display:block; position:absolute; top:2em; width:100px; color: #FFFFFF; border:1px solid #661601; background-color:#FFFFFF; text-align: center; padding: 10px; } </style><style>.sidebar{display:none;}</style></style><style>.sidebar{display:none;}</style>


<div style="background-image:url('YOUR CHOICE OF IMAGE HERE'); border: none; color: #c67c32; width:1200px;height:1300px; overflow:hidden; position:relative; left:-63px; "> 


<div style="background-color: transparent; border: none; color: #c67c32; width:1100px;height:1200px; overflow:hidden;"> 

<font style="font-size:25pt; font-family:Dawning of a New Day; font-style:normal; color:#ffffff; text-shadow:0px 0px 5px #fdb44d"><a href="http://endlessforest.org/community/tracker">recent posts</a> || <a href="http://endlessforest.org/community/current-map-forest">map</a> || <a href="http://endlessforest.org/community/search">search</a></font>

<div style="background-color: #ffffff; border: 1px solid #c67c32; color: #c67c32; font-size:8pt; font-family:Georgia; font-style:normal; width:900px;height:230px; overflow: hidden;"> <div style="background-color: transparent; border: none; width:850px;height:220px; overflow: hidden; padding: 25px 35px;"> 




</div></div>


<font style="font-size:25pt; font-family:Dawning of a New Day; font-style:normal; color:#ffffff; text-shadow:0px 0px 5px #ffffff">"TEXT HERE"</font>

<div style="width:600px;height:50px;overflow:hidden;background:transparent;padding:10px; Overflow:hidden; margin-right:150px;border: none;">
<font style="font-size:30pt; font-family:Dawning of a New Day; font-style:normal; text-shadow:0px 0px 13px #ff0000; letter-spacing:3px"><a href="#1">Basics</a> • <a href="#2">Facts</a> • <a href="#3">Ties</a> • <a href="#4">Extra</a></Font></div><div style="width:900px;height:550px;overflow:hidden;text-align:left; border-radius:0px;padding:20px; margin-right:20px; border: none;"><table width="250" border="0"><tr><td valign="top"><div style="width:750px;height:450px;overflow:hidden; margin-bottom:240px;">
<a name="1"></a>
<div style="width:700px;height:300px;overflow:hidden;background:#ffffff;padding:20px; Overflow:hidden; border: 1px solid #c67c32;"><div style="width:700px;height:300px;overflow:auto;background:transparent;padding:25px 20px; text-align: center;font-size:8pt; font-family:Georgia; color: #c67c32"> TEXT GOES HERE<div align=center><table width="300px"><tr><td><font style="font-size:20pt; font-family:Dawning of a New Day; font-style:normal; color:#EEA397; text-shadow:0px 0px 5px #fdb44d;"><u>TEXT</u></font><div style="width: 300px; height: 240px; overflow:hidden;"><div style="width: 300px; height: 240px; padding:10px; overflow:auto; text-align:left;"><div style="text-align:left"><center>
 

Hello I am a box





</center><br><br></div>

</td><td> 

</div></div></td><td><center><font style="font-size:20pt; font-family:Dawning of a New Day; font-style:normal; color:#EEA397; text-shadow:0px 0px 5px #fdb44d;"><u>Indepth</u></font></center><div style="width: 250px; height: 290px; overflow:hidden;"><div style="width: 252px; height: 240px; padding:10px; overflow:auto; text-align:left;"><div style="text-align:left"><center>

TEXT GOES HERE


</FONT>

</center>
</div>
</div> 
</td></tr></table>
</div>


</div>
</div>









<a name="2"></a>
<div style="width:700px;height:300px;overflow:hidden;background:#ffffff;padding:20px; Overflow:hidden; border: 1px solid #c67c32;"><center><font style="font-size:20pt; font-family:Dawning of a New Day; font-style:normal; color:#EEA397; text-shadow:0px 0px 5px #fdb44d;"><u>TEXT GOES HERE</u></font></center><div style="width:700px;height:300px;overflow:auto;background:transparent;padding:25px 20px; text-align: center;font-size:8pt; font-family:Georgia; color: #c67c32">
TEXT GOES HERE


TEXT





<br><br></font></div></div>









<a name="3"></a>
<div style="width:700px;height:300px;overflow:hidden;background:#ffffff;padding:20px; Overflow:hidden; border: 1px solid #c67c32;"><center><font style="font-size:20pt; font-family:Dawning of a New Day; font-style:normal; color:#EEA397; text-shadow:0px 0px 5px #fdb44d;"><u>TEXT</u></font></center><div style="width:700px;height:300px;overflow:auto;background:transparent;padding:25px 20px; text-align: center;font-size:8pt; font-family:Georgia; color: #c67c32">


TEXT



<br><br>
</div></div>









<a name="4"></a>
<div style="width:700px;height:300px;overflow:hidden;background:#ffffff;padding:20px; Overflow:hidden; border: 1px solid #c67c32;"><div style="width:700px;height:300px;overflow:auto;background:transparent;padding:25px 20px; text-align: center;font-size:8pt; font-family:Georgia; color: #c67c32">



STUFF



<br><br><br>
</div></div></font></td>
<td valign="top"; margin-top:-300px; margin-right:300px;>


</td>
</tr>
</table> 


</div>

<div style="background-color: #ffffff; border: 1px solid #c67c32; color: #c67c32; font-size:8pt; font-family:Georgia; font-style:normal; width:700px;height:100px; overflow: hidden;"> <div style="background-color: transparent; border: none; width:600px;height:95px; overflow: auto; padding: 15px 60px;"> <u><b>CSS is not for free use.</b></u>
CSS © <a class="info">OrangeJuiceMoon<span>Also known as noshik</a> With help from Torn 
Basic box and table code © <a href="http://endlessforest.org/community/node/80829">Sham</a>
Character © <a class="info">OrangeJuiceMoon<span>Also known as noshik</a>  Art © <a class="info">OrangeJuiceMoon<span>Also known as noshik</a>

DISCLAIMER WILL GO HERE MAYBE IDK


</div></div>


<style>a:link { color:#C67C32; text-decoration:underline !important;-webkit-transition: all .2s ease-in-out!important; -moz-transition: all .2s ease-in-out!important; text-shadow: 0px 0px 5px;} a:visited { color: #C67C32; text-decoration:none !important;-webkit-transition: all .2s ease-in-out!important; -moz-transition: all .2s ease-in-out!important; text-shadow: 0px 0px 5px;} a:hover { color: #ffffff; text-decoration:none !important;-webkit-transition: all .2s ease-in-out!important; -moz-transition: all .2s ease-in-out!important; text-shadow: 0px 0px 5px} a:active { color: #E6A849;-webkit-transition: all .2s ease-in-out!important; -moz-transition: all .2s ease-in-out!important;}

.box{background-color: #ff0000;border: 3px solid #661601;width: 720px; -moz-border-radius: 15px;border-radius: 15px; border: none; border-style: double; margin-right: 100px; margin: 0 auto; text-align: left;} .boxcont{padding: 5px;} #wrapper{width:800px; margin: 0 auto;} body{background-image: none; font-family: Georgia; font-size: 10px; color: #c67c32;}#sidebar-left, #logo{display:none !important; width: 0px !important; }#wrapper #container #center .right-corner .left-corner{background-color:#E5E0D1; border: 1px solid #ffffff;-moz-border-radius: 0px;border-radius: 0px; width:1200px; position:relative; left:-160px;}tr.even, .comment.even, .comment.odd, tr.odd{background-color:#ffffff;border: 1px solid #c67c32;;margin:5px;-moz-border-radius: 0px;border-radius: 0px; margin-left:155px; width:80%; overflow-x:hidden;}.node{border: 0px;}.breadcrumb, h2, .with-tabs, #header-region{display:none !important;}#tabs-wrapper{border:0px;}.blog_usernames_blog, .statistics_counter{display:none !important;}body{background-image:url('YOUR CHOICE OF IMAGE HERE'); background-repeat:repeat}h1 {font-family: Tahoma, sans-serif;font-size: 12pt;color: #FFF;border-bottom: 1px solid #ff0000;font-weight:bold;}.links{background: transparent !important;margin-top: -2px !important;font-size: 7.2pt !important;} #header { height: 20px !important;} table {border-collapse: separate; padding: 0px !important; margin: 0px !important; } a.info { position:relative; z-index:24; text-decoration:none; border-bottom: 1px solid #D79B87; } a.info:hover { z-index:25; background-color: none; border-bottom: 1px dotted #FFFFFF;} a.info span { display: none; border-bottom: 1px dotted #172F45;} a.info:hover span { display:block; position:absolute; top:2em; left:-2em; width:130px; color: #ffffff; border: none; background-color:#CACDC3; text-align: left; padding: 10px; } a.info2 { position:relative; z-index:24; text-decoration:none; border-bottom: 1px dotted #ff0000; } a.info:hover2 { z-index:25; background-color: #ff0000; border-bottom: 1px dotted #ff0000;} a.info2 span { display: none; border-bottom: 1px dotted #ff0000;} a.info2:hover span { display:block; position:absolute; top:2em; left:-5em; width:200px; height:130px; color: #CCC; border:1px solid #0C0C0C; background-color:#0C0C0C; text-align: left; padding: 10px; } #squeeze { margin-left: 60px !important; width: 910px; } .node { margin: 0 auto !important; } .node, .preview { background: transparent; border:0px; } .picture { margin-left: -30px !important; } #comment-form { margin-left: 50px !important; } .comment .picture{opacity:0.2;-moz-transition:opacity 2s;-webkit-transition:opacity 2s;-o-transition:opacity 2s} .comment .picture:hover{opacity:1} .comment .picture img{border-radius:60px} </style>
<style>.node .links, .comment .links{text-align:center}</style>
<style>.comment .clear-block .content .clear-block{display:none}</style>
<style>#comments{margin-left:-130px}</style>
<style>.comment{margin:50px 0px}</style></center>

TABCSS2


<center><style>a.info { position:relative; z-index:24; text-decoration:none } a.info:hover { z-index:25;} a.info span { display: none; } a.info:hover span { display:block; position:absolute; top:2em; width:100px; color: #FFFFFF; border:1px solid #661601; background-color:#FFFFFF; text-align: center; padding: 10px; } </style><style>.sidebar{display:none;}</style></style><style>.sidebar{display:none;}</style>



<div style="background-image:url('YOUR CHOICE OF IMAGE HERE'); border: none; color: #ff0000; width:1100px;height:2400px;overflow:hidden;"> This is a box 


<div style="background-color: transparent; border: none; color: #ff0000; width:1050px;height:2350px;overflow:hidden;"> This is a box 





[img]IMAGE HERE[/img]

<div style="background-image:url('YOUR CHOICE OF IMAGE HERE'); border: 1px solid #c67c32; color: #c67c32; font-size:8pt; font-family:Georgia; font-style:normal; width:950px;height:350px; overflow: hidden;"><div style="background-color: transparent; border: none; width:850px;height:220px; overflow: auto; padding: 25px 65px;"> 

need to add double box tooooo the basics thing



</div></div>


<div align=center><table width="750px"><tr><td> 
<div style="background-color: #4B140E;width:750px;height:500px; border: 1px solid #c67c32; margin:0 auto; text-align: center; margin-left:30px; margin-bottom: -20px; overflow: hidden; color: #c67c32"><div style="width:750px;height:500px;overflow:hidden; margin-left: 0px;">
<a name="1"></a><div style="height:500px;overflow:auto;background-image:url('YOUR CHOICE OF IMAGE HERE');padding:20px;border:1px solid #c67c32;overflow:hidden;"><div style="background-color: transparent;border: none;color: #c67c32;width:650px;height:450px;overflow:auto;padding:20px 50px;"> This is a box 


<div align=center><table width="250px"><tr><td> 
<div style="width: 300px; height: 500px; overflow:hidden;"><div style="width: 302px; height: 500px; padding:10px; overflow:auto; text-align:left; text-align: center;font-size:8pt; font-family:Georgia; color: #c67c32;"><div style="text-align:left"><center>
<font style="font-size:20pt; font-family:Yggdrasil; font-style:normal; color: #ffffff; text-shadow:0px 0px 12px #c67c32;">Basics</font>


 

"On the other hand, we denounce with righteous indignation and dislike men who are so beguiled and demoralized by the charms of pleasure of the moment, so blinded by desire, that they cannot foresee the pain and trouble that are bound to ensue; and equal blame belongs to those who fail in their duty through weakness of will, which is the same as saying through shrinking from toil and pain. These cases are perfectly simple and easy to distinguish. In a free hour, when our power of choice is untrammelled and when nothing prevents our being able to do what we like best, every pleasure is to be welcomed and every pain avoided. But in certain circumstances and owing to the claims of duty or the obligations of business it will frequently occur that pleasures have to be repudiated and annoyances accepted. The wise man therefore always holds in these matters to this principle of selection: he rejects pleasures to secure other greater pleasures, or else he endures pains to avoid worse pains."

"On the other hand, we denounce with righteous indignation and dislike men who are so beguiled and demoralized by the charms of pleasure of the moment, so blinded by desire, that they cannot foresee the pain and trouble that are bound to ensue; and equal blame belongs to those who fail in their duty through weakness of will, which is the same as saying through shrinking from toil and pain. These cases are perfectly simple and easy to distinguish. In a free hour, when our power of choice is untrammelled and when nothing prevents our being able to do what we like best, every pleasure is to be welcomed and every pain avoided. But in certain circumstances and owing to the claims of duty or the obligations of business it will frequently occur that pleasures have to be repudiated and annoyances accepted. The wise man therefore always holds in these matters to this principle of selection: he rejects pleasures to secure other greater pleasures, or else he endures pains to avoid worse pains."




</center>
<br><br></div>

</td><td> 

</div></div></td><td><div style="width: 300px; height: 500px; overflow:hidden;"><div style="width: 302px; height: 500px; padding:10px; overflow:auto; text-align:left; text-align: center;font-size:8pt; font-family:Georgia; color: #c67c32;"><div style="text-align:left"><center>
<font style="font-size:20pt; font-family:Yggdrasil; font-style:normal; color: #ffffff; text-shadow:0px 0px 12px #c67c32;">other important stuff</font>


"On the other hand, we denounce with righteous indignation and dislike men who are so beguiled and demoralized by the charms of pleasure of the moment, so blinded by desire, that they cannot foresee the pain and trouble that are bound to ensue; and equal blame belongs to those who fail in their duty through weakness of will, which is the same as saying through shrinking from toil and pain. These cases are perfectly simple and easy to distinguish. In a free hour, when our power of choice is untrammelled and when nothing prevents our being able to do what we like best, every pleasure is to be welcomed and every pain avoided. But in certain circumstances and owing to the claims of duty or the obligations of business it will frequently occur that pleasures have to be repudiated and annoyances accepted. The wise man therefore always holds in these matters to this principle of selection: he rejects pleasures to secure other greater pleasures, or else he endures pains to avoid worse pains."

"On the other hand, we denounce with righteous indignation and dislike men who are so beguiled and demoralized by the charms of pleasure of the moment, so blinded by desire, that they cannot foresee the pain and trouble that are bound to ensue; and equal blame belongs to those who fail in their duty through weakness of will, which is the same as saying through shrinking from toil and pain. These cases are perfectly simple and easy to distinguish. In a free hour, when our power of choice is untrammelled and when nothing prevents our being able to do what we like best, every pleasure is to be welcomed and every pain avoided. But in certain circumstances and owing to the claims of duty or the obligations of business it will frequently occur that pleasures have to be repudiated and annoyances accepted. The wise man therefore always holds in these matters to this principle of selection: he rejects pleasures to secure other greater pleasures, or else he endures pains to avoid worse pains."



</center></font><br><br>
</div>

</div> 
</td></tr></table></div>

<br><br>
</div></div>





<a name="2"></a>
</a><div style="height:500px;overflow:auto;background-image:url('YOUR CHOICE OF IMAGE HERE');padding:20px;border:1px solid #c67c32;overflow:hidden;"><div style="background-color: transparent;border: none;color: #c67c32;width:650px;height:450px;overflow:auto;padding:20px 50px;"> This is a box 



</div></div>




<a name="3"></a>
</a><div style="height:500px;overflow:auto;background-image:url('YOUR CHOICE OF IMAGE HERE');padding:20px;border:1px solid #c67c32;overflow:hidden;"><div style="background-color: transparent;border: none;color: #c67c32;width:650px;height:450px;overflow:auto;padding:20px 50px;"> This is a box 



</div></div>







<a name="4"></a>
</a><div style="height:500px;overflow:auto;background-image:url('YOUR CHOICE OF IMAGE HERE');padding:20px;border:1px solid #c67c32;overflow:hidden;"><div style="background-color: transparent;border: none;color: #c67c32;width:650px;height:450px;overflow:auto;padding:20px 50px;"> This is a box 



</div></div>



</div>

</div>

</td><td> 
<div style="background-image:url('YOUR CHOICE OF IMAGE HERE'); width: 200px; height: 440px; border: 1px solid #c67c32; text-align: center; margin-left: 25px;"> <div style="background-color: transparent; width: 200px; height: 400px; border: none: #391B03; Overflow: auto; padding: 40px 5px; text-align: center;font-size:8pt; font-family:Georgia; color: #c67c32;"> 

<font style="font-size:20pt; font-family:Yggdrasil; font-style:normal; text-shadow:0px 0px 13px #ff0000; letter-spacing:5px">
<a href="#1">Basics</a>


<a href="#2">Facts</a>  


 <a href="#3">Relations</a>   


<a href="#4">Archives</a>
</font>
</div></div> 
</td></tr></table></div>

<div style="background-color: #4B140E; border: 1px solid #c67c32; color: #c67c32; font-size:8pt; font-family:Georgia; font-style:normal; width:900px;height:230px; overflow: hidden;"> <div style="background-color: transparent; border: none; width:850px;height:220px; overflow: auto; padding: 25px 35px;"> 

helloooo arty shit here

this box needs to be transparent

</div></div>
[img]YOUR CHOICE OF IMAGE HERE[/img]

</div>
</div>
<style>a:link { color:#C67C32; text-decoration:underline !important;-webkit-transition: all .2s ease-in-out!important; -moz-transition: all .2s ease-in-out!important; text-shadow: 0px 0px 5px;} a:visited { color: #C67C32; text-decoration:none !important;-webkit-transition: all .2s ease-in-out!important; -moz-transition: all .2s ease-in-out!important; text-shadow: 0px 0px 5px;} a:hover { color: #ffffff; text-decoration:none !important;-webkit-transition: all .2s ease-in-out!important; -moz-transition: all .2s ease-in-out!important; text-shadow: 0px 0px 5px} a:active { color: #E6A849;-webkit-transition: all .2s ease-in-out!important; -moz-transition: all .2s ease-in-out!important;}

.box{background-color: #ff0000;border: 3px solid #661601;width: 720px; -moz-border-radius: 15px;border-radius: 15px; border: none; border-style: double; margin-right: 100px; margin: 0 auto; text-align: left;} .boxcont{padding: 5px;} #wrapper{width:800px; margin: 0 auto;} body{background-image: none; font-family: Georgia; font-size: 10px; color: #c67c32;}#sidebar-left, #logo{display:none !important; width: 0px !important; }#wrapper #container #center .right-corner .left-corner{background-color:#0C0D0D; border: 3px solid #9D8053;-moz-border-radius: 0px;border-radius: 0px; width:1200px; position:relative; left:-160px;}tr.even, .comment.even, .comment.odd, tr.odd{background-color: #4B140E;border: 1px solid #c67c32;;margin:5px;-moz-border-radius: 0px;border-radius: 0px; margin-left:155px; width:80%; overflow-x:hidden;}.node{border: 0px;}.breadcrumb, h2, .with-tabs, #header-region{display:none !important;}#tabs-wrapper{border:0px;}.blog_usernames_blog, .statistics_counter{display:none !important;}body{background-image:url('http://www.dinpattern.com/tiles/prestige-COD.gif'); background-repeat:repeat}h1 {font-family: Tahoma, sans-serif;font-size: 12pt;color: #FFF;border-bottom: 1px solid #ff0000;font-weight:bold;}.links{background: transparent !important;margin-top: -2px !important;font-size: 7.2pt !important;} #header { height: 20px !important;} table {border-collapse: separate; padding: 0px !important; margin: 0px !important; } a.info { position:relative; z-index:24; text-decoration:none; border-bottom: 1px solid #D79B87; } a.info:hover { z-index:25; background-color: none; border-bottom: 1px dotted #FFFFFF;} a.info span { display: none; border-bottom: 1px dotted #172F45;} a.info:hover span { display:block; position:absolute; top:2em; left:-2em; width:130px; color: #ffffff; border: none; background-color:#CACDC3; text-align: left; padding: 10px; } a.info2 { position:relative; z-index:24; text-decoration:none; border-bottom: 1px dotted #ff0000; } a.info:hover2 { z-index:25; background-color: #ff0000; border-bottom: 1px dotted #ff0000;} a.info2 span { display: none; border-bottom: 1px dotted #ff0000;} a.info2:hover span { display:block; position:absolute; top:2em; left:-5em; width:200px; height:130px; color: #CCC; border:1px solid #0C0C0C; background-color:#0C0C0C; text-align: left; padding: 10px; } #squeeze { margin-left: 60px !important; width: 910px; } .node { margin: 0 auto !important; } .node, .preview { background: transparent; border:0px; } .picture { margin-left: -30px !important; } #comment-form { margin-left: 50px !important; }</style>
<style>.node .links, .comment .links{text-align:center}</style>
<style>.comment .picture{display:none} .comment .content{margin-left:20px}</style>
<style>.comment .clear-block .content .clear-block{display:none}</style>
<style>#comments{margin-left:-130px}</style>
<style>.comment{margin:50px 0px}</style></center>