/* ---------------------
basic layout
--------------------- */

* {
	font-family: Arial, Helvetica, sans-serif;
}

.pinstripe {
	background:#CCCCCC url(images/stripebg.gif) repeat left top;
	margin:0;
	color:#333333;
}

div,
td,
p {
	font-size:12px;
	line-height:18px;
	color:#333333;
}

a,
a:link,
a:active,
a:visited {
	text-decoration:underline;
	color:#336666;
}

a:hover {
	text-decoration:underline;
	color:#3973AC;
}

ul {
	margin: 5px;
	padding: 5px;
	list-style: none;
	list-style-type: square;
}

li {
	line-height: 18px;
	padding-left: 5px;
	padding-top: 0px;
	list-style-position: inside;
}

/** clear the banner to make it sit in the bottom **/
.clear {
	clear:both;
}

/* ---------------------
template layout
--------------------- */

/** wrapper to make the page center **/
#container {
	width:90%;
	margin: 55px auto;
	padding:0;
	text-align: left;
}

/**
hold background, it should be float:left
that's way we can not put it in #container
**/
#containerbg {
	position:relative;
	width: 100%;
	float:left;
	top:0;
	left:0;
}

#outer {
	position:relative;
	float:left;
	clear:left;
	width:100%;
	
}


#logo {
	position:relative;
	width:100%;
	height:70px;
	float:left;
	color: #faf4f0;
}
#bluerule {
	position:relative;
	width:100%;
	height: 20px;
	background:url(images/bluerule.gif) repeat-x left top;
	z-index: 9;
	bottom: 0px;
}

#box-decor {
	position:relative;
	right: 0px;
	bottom: 20px;
	width:20px;
	height:20px;
	float:right;
	background-color:#336666;
	z-index: 10;
}

#container_inner {
	position:relative;
	top:0px;
	clear:both;
	width:96%;
	margin: auto;
	background-color:#faf4f0;
	padding: 2%;
}

#content_main {
	position:relative;
	background-color:#faf4f0;
	margin: auto 20px;
	z-index:11;


}

.header {
	color:#faf4f0;
	font-size:40px;
	line-height: 42px;
}

.bluegreen {
	color:#336666;
	font-weight: bold;
}