body{text-align:center;}

.container {
	width:800px;
	margin:2px auto ; /* To center the div in the viewport, we apply "auto" margins to left and right. To move the div away from the top and bottom of the viewport we use a margin of 10px. */
	background-color: #fff; 
	border: 1px solid gray;
     text-align: left;	

}

.sidebar {
	float:right;
	width:160px;
	margin:0;
	padding:1em;
	background-color: #fff
}


.header {padding: .25em;
	background:#fff url(images/header.jpg) repeat ;  
        width:790px; height:150px;image-float:left;
	border-bottom: 2px solid gray;
	height:8em;
	color:#fff;
	-moz-border-radius-topleft;  -webkit-border-top-left-radius;
	text-align:right  ;}


.header h1 {
padding-top: .3em; padding-right:.1em; margin: 0; /* Browsers add different amounts of padding above an H1, it is easiest to remove all padding and margin from this H1 and let the div provide the padding. This is achieved by using a descendant selector - ".header h1 { padding: 0; margin: 0;}" */
text-align:right;
color: #66ffcc

}

.header h2{
padding-top: .2em; padding-right:.2em; margin: 0; /* Browsers add different amounts of padding above an H1, it is easiest to remove all padding and margin from this H1 and let the div provide the padding. This is achieved by using a descendant selector - ".header h1 { padding: 0; margin: 0;}" */
text-align:right;

}

.content {
     margin-right: 200px;
	 /* The "sidebar" div has been floated, so text from the "content" div will flow down its right edge and then wrap around under it. To make the text appear as it is in a new column, we apply margin-right to the "content" div, making sure that the width is greater than the overall width of the "sidebar" div. In this case, we will use "margin-right: 200px", which will give us 40px margin between the sidebar and the main content.*/
	 border-right: 1px solid gray;
	 
	 /* We will also apply a border to the right of the "content" div. This could be a problem if the "sidebar" div is longer than the main content. If this is the case, the border can be applied to the left side of the "sidebar" div instead of the "content" div. */
	 padding: 1em;
	 background-color:#fff;
	 max-width: 36em;
	 color:#666666;
	 font-family:Arial, Helvetica, sans-serif;
	 text-align:justify;
}

.footer {
clear: both;
margin: 0;
padding: .5em;



/* To style the footer, we first need to set it to "clear: both". This is critical, as it will force the footer below any floated elements above. We then add "padding:.5em" and "margin: 0" */
text-align:center;
color:#000000;
font-family:"Courier New", Courier, monospace;
background-color: #cccc99;
border-top: 1px solid gray;

}


ul.navigation a
{
display: block;
width:80%; 
/*padding: 3px 5px 3px 10px;margin:0;*/
padding:.2em .5em; 
margin:0;
font-family:Arial;
background-color:#00CC99;
text-decoration:none;
font-weight:bold

} 

ul.bullet li{margin:0 auto;} 





a:link ,a:visited
{
color:#000;
}

a:hover 
{
background-color:#88CCAA;
color: #fff;
}

ul.navigation
{
list-style-type:none;
margin:0;
padding:0;

}

li
{
margin:0;
padding:.2em .5em;



}

.imgshow
{
float: left;
width: 60px;
border: 1px solid #999;
margin: 0 15px 5px 0;
padding: 1px 
}

.clearboth { 
clear:right; 
clear:left;
}

.adarea
{
width: 17em;
height: 15em;
border:1px;
border:dotted;
padding:.7em;
margin:.25em;

}

.sidebar p { margin: 0 0 1em 0; } 
.content h2 { margin: 0 0 .5em 0; }
/* To remove the space above content in the "leftnav" and "content" divs, use the following rules: "#leftnav p { margin: 0 0 1em 0; }" and "#content h2 { margin: 0 0 .5em 0; }". */
-->