/* CSS Document */

@charset "utf-8";

/*****************
browsers interpret margin and padding a little differently, 
we'll remove all default padding and margins and
set them later on
******************/
* {
	margin:0;
	padding:0;
}

/*
Set initial font styles
*/
body {
   text-align: justify;
   font-family:Arial, Helvetica, sans-serif;
   font-size: 72.01%;
   line-height: 1em;
}


/*
if img is inside "a" it would have 
borders, we don't want that
*/
img {
   border: 0;
}


/*****************
basic layout 
*****************/
body {
   background-color:#DBDBDB;
   margin:0em;    /* gives some air for the pagewrapper */
}

/* center wrapper, min max width */
div#pagewrapper {
   margin: 0 auto;       /* this centers wrapper */
   margin-top:0px;
   max-width: 800px;
   min-width: 800px;
   border-left:1px dotted #999999;
   border-bottom:1px dotted #999999;
   border-right:1px dotted #999999;
   background-color: #ffffff;
   color: black;
}


/*** header ***
we will hide text and replace it with a image
we need to assign a height for it so that the image wont cut off
*/
div#header {
   height: 60px;  
   background-color:#000000;
   background: #FFFFFF url(../images/layout/header.jpg) no-repeat 0 0px;
}

div#banner {
   height: 198px;  
   background-color:#ffffff;  
   background: url(../images/layout/mainbanner.jpg) no-repeat 0 0px;
}

/* Main top layer links */
div#mainlinks {
   float:right;
   margin-top:19px;
   margin-right:20px;
   padding-top:10px;
   width:500px;
   text-align:right;   
}

/* This is for the | symbols */
div#mainlinks p {
   font-size:12px;
   color:#666666;
   text-decoration:none;
}

div#mainlinks a {
   font-weight:900;
   color:#999999;
   text-decoration:none;
}

div#mainlinks a:hover {
   color:#009933;
}

/** Content **/

div#content {
   overflow:hidden;
   margin: 0.5em auto 2em 0;   /* some air above and under menu and content */
}


div#main {
   margin-left: 210px; /* this will give room for sidebar to be on the left side, make sure this space is bigger than sidebar width */
   margin-right: 30px; /* and some air on the right */
}

div#main-left {
	float:left;
	width:350px;
}

div#main-right {
	float:right;
	width:160px;
	text-align:left;
	padding-left:20px;
	border-left:1px dotted #999999;
}

/* Footer */

div#footer {
   clear: both;       /* keep footer below content and menu */
   background-color:#000000;
}

div#footer p {
   font-size: 0.9em;
   padding: 1.0em; 
   text-align: center;
   color:#ffffff;
   padding-top:5px;
   margin: 0px;
}