body, html {
	color: #333; 
	font-family: Arial, Verdana, Tahoma, sans-serif;
	font-size: 12px;
	line-height: 1.5;
	text-align: center;
}

body {
	padding: 0;
	margin: 0;
	font-size: 100%;
	background: #FFF2BE url(images/bg.jpg) repeat-x;
}

#header {
	padding: 0;
	margin: 0 auto;  /*** Centers the design ***/
	width: 800px;
	height: 100px;
	color: #333;
	text-align: left;
}
#main {
    width: 800px;
    margin: 0 auto; /*** Centers the design ***/
	padding: 0;
	text-align: left;
	display: block;
	background-color: #A5CD38;
}


#content { /*** content section ***/
	margin: 12px;
	padding: 0;
	width: 776px;
	text-align: left;
}



/*** -----------------Top navigation-------------------- ***/	
#nav  {
	height: 15px;
	padding: 10px 10px 5px;

}

#nav li 
{
    background-image: url('none');
    font-size: 11px;
	font-family: Arial, Verdana, Tahoma, sans-serif;
	font-weight:bold;
	float: right;
	margin: 0;
	padding: 0;
}
#nav a {
	color: #fff;
	display: block;
	margin: 0;
	padding: 3px 8px;
	text-decoration: none;
}
#nav a:hover {
	background-color: #D2E69B;
	color: #333;
	padding-bottom: 3px;
}
	


/*** ---------------- Columns ----------------- ***/
	
#left {
	float: left;
	width: 200px;
	padding: 0px 5px 0px 5px; 
	margin: 0;   
}
#center {
    margin: 0 auto;
    width: 420px;
}
#right {
    float: right;
	width: 200px;
	padding: 0px 5px 0px 5px; 
	margin: 0;
}


/*** ---------------- End Columns ----------------- ***/	
a {
	color: #666;
	text-decoration: none;
}
a:hover{
	color: #666;
	text-decoration: underline;
}
a.con {
	color: #00BFF3;
	text-decoration: none;
}
a.con:hover{
	color: #00BFF3;
	text-decoration: underline;
}

h1 {
	font-size: 18px; 
	font-weight: normal;
	padding: 10px;
	color: #7EB43A;
	text-align: right;
	
}
h2 {
	font-size: 14px;
	font-weight: normal;
	color: #7EB43A;
	padding: 3px 0px 3px;
	border-bottom:1px dotted #ccc;
}
h3 {
	font-weight: normal;
	font-size: 16px;
	color: #FF2400;
	padding-bottom: 3px;
}
ul {
	list-style-type: none;
	padding-left: 5px;
	margin-left: 15px;
	}
li {
	background: url('images/bullet.gif') no-repeat left top;
	padding-left: 25px;
	margin-bottom: 5px
	}
	
hr {
	font-size: 9px; 
	noshade: noshade;
	color: #ccc;
	border-style: dashed;
	}

/*** ------------------Tables------------------------ ***/	

.fine {
border-style: solid;
border-width: 1px;
border-color: #333;
background: #000 url(images/bg_table.jpg) no-repeat;
margin-top: 3px; margin-bottom: 3px;
padding: 3px 8px 3px 8px;
overflow:hidden;
}

.solid {
border-style: solid;
border-width: 1px;
border-color: #333;
background-color: #333;
margin: 3px 0px 3px 0px;
padding: 3px 8px 3px 8px;
overflow:hidden;
}

.frame {
border-style: solid;
border-width: 1px;
border-color: #333;
background-color: #000;
margin: 1px;
padding: 5px;
}
	

/*** ------------------End Tables------------------------ ***/	

select, input, menu, list, textarea {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #333;
	margin: 0 auto;
	padding: 2px;
}	
.clear { clear: both;
         display: block;     
         height: 0;          
         visibility: hidden; }


/*** ------------------ Footer ---------------------- ***/	
#footer 
{
    clear: both;
	width: 800px;
	height: 30px; /*** The drawback with this solution is that the height of the footer can't be flexible. If you add so much content to the footer that it extends 30px, you will get a vertical scrollbar and the content will overflow the footer if you don't set overflow to hidden ***/
	margin: 0 auto;
	margin-top: 30px;
	text-align: center;
    color: #333;
}