/*  

Author: Kya
Contact: kyaish@gmail.com
Collective: http://dazzle.nu
Personal Blog: http://kya.nu
Comments: I have spent many hours working on this layout and playing with the CSS so I appreciate that no one directly takes ALL of the design elements in this file. I can't stop you from taking snippets and I guess that is how many of us learn. So if you are here to see how I have created some effects I hope it can help in some way, as long as it's being taken for the right reasons and not just to simply copy one of my designs. 

*/


/* [ THE BASIC WEBSITE ELEMENTS ]

These are basic elements that are featured throughout my website such as links, bold text, block quotes and the like.  */


body
{	color: #373737;
	font-family: Helvetica, Georgia, "Trebuchet MS", Arial, Tahoma, Verdana;
	font-size: 12pt;
	background: #87bab1 url(back.gif);
	margin: 0px;
	padding: 0px;
        line-height: 25px;
        text-align: justify;}

#bigwrap
{	width: 100%;
	overflow: hidden;
	margin: 0px auto;}

#wrap
{	width: 900px;
	background: #7f8d61;
	border-top: 10px solid #4a7457;
	border-bottom: 3px solid #646f4c;
	overflow: hidden;
	padding: 0px 0px 20px 0px;
	margin: 0px auto 0px auto;}

#menu
{	width: 900px;
	background: #212b30;
	font-family: Helvetica;
	margin: 20px auto 0px auto;
	padding: 25px 0px 25px 0px;
	border-top: 4px solid #020202;
	border-bottom: 2px solid #103537;
	text-align: center;}

#menu a
{	font-size: 16pt;
	font-weight: normal;
	text-decoration: none;
	text-transform: lowercase;
	padding: 30px;
	color: #ffffff;}

#menu a:hover
{	color: #e5bc96;}

#header
{	width: 900px;
	height: 150px;
	background: url(header.jpg);
	margin: 0px auto;}

#title
{	font-size: 50pt;
	padding: 40px 0px 0px 350px;
	color: #e5ce98;}

#stats
{	font-size: 15pt;
	padding: 20px 0px 0px 150px;
	color: #efeed2;}

#sidebar1
{	width: 200px;
	margin: 0px 0px 0px 0px;
	background: #becaa2;
	font-size: 9pt;
	float: left;}

#sidebar1 p
{	padding: 10px 10px 10px 10px;
	margin: 0px;
	border-bottom: 10px solid #4a7457;
	border-left: 10px solid #4a7457;}

#sidebar2
{	width: 200px;
	margin: 0px 0px 0px 0px;
	background: #becaa2;
	font-size: 9pt;
	float: right;}

#sidebar2 p
{	padding: 10px;
	margin: 0px;
	border-bottom: 10px solid #4a7457;
	border-right: 10px solid #4a7457;}


#content
{	width: 458px;
	padding: 0px 20px 25px 20px;
	background: #ffffff url(content.gif);
	border-bottom: 1px solid #4a7457;
	border-right: 1px solid #4a7457;
	border-left: 1px solid #4a7457;
	float: left;}

#footer
{	width: 100%;
	clear: both;
	text-align: center;
	font-size: 9pt;
	padding: 20px 0px 30px 0px;}




/* Basic Style Elements */

a
{	color: #3d7a6b;
	text-decoration: none;}

a:hover
{	color: #9e8d5a;
	text-decoration: underline;}


h2
{	color: #a89f6b;
	font-size: 15pt;
	margin: 25px 0px 0px 0px;
	padding: 0px 0px 0px 0px;}

p
{	25px 0px 0px 0px;
	margin: 0px 0px 25px 0px;}

blockquote
{	font-size: 10pt;
	padding: 0px 25px 0px 25px;
	margin: 0px;
	color: #7b7b7b;}

ul, ol
{	margin: 25px 20px 25px 20px;
	padding: 0px;}

table
{	margin: 0px auto;}

.sweet td
{	border-bottom: 1px dotted #E3E5E2;
	padding: 0px 20px 0px 20px;}

.break
{	clear: both;
	width: 100%;
	height: 10px;}

/* My IDs and Classes */

.pad
{ 	border: 5px solid #abcac2;
	margin: 5px;
	background: #abcac2;}

.codes
{	text-align: center;}

.codes img
{ 	border: 5px solid #93a571;
	margin: 3px;
	background: #93a571;}

.codes a img
{ 	border: 5px solid #93a571; 
	background: #93a571;}

.codes a:hover img
{	border: 5px solid #7b8b5e;
	background: #7b8b5e;}

.sidebarcode
{ 	border: 5px solid #93a571;
	background: #93a571;
	margin: 5px 0px 0px 0px;}


.codesort img
{ 	border: 5px solid #93a571;
	margin: 3px;
	background: #93a571;}

.codesort a img
{ 	border: 5px solid #93a571; 
	background: #93a571;}

.codesort a:hover img
{	border: 5px solid #7b8b5e;
	background: #7b8b5e;}
