/*
    all NON structural markup should go here:
    background colors, font sizes and color...
*/



body {
	font-size:12px;
	font-family: "Lucida Grande", Verdana, Arial, Helvetica, sans-serif;
	color: #444;
	}


a {
	text-decoration: none;
	color:#444;
   }

h1 {font-size:14px;}


#wrapper { background-color: #fafaf9; }

#header {}

#header a {color: #660303;}

#header h1 {
  font-family: "Lucida Grande", Verdana, Arial, Helvetica, sans-serif;
	font-size:20px;
	font-weight:500;
	letter-spacing:8px;
	color: #660303;
	margin-bottom: 12px;
   }

#header h2 a, #header h2{
	font-size:11px;
	font-style:normal; 
	font-weight: normal;
	letter-spacing:5px;
	color: #ccc;
	margin-bottom:0;
   }


#breadcrumbRight{
font-size:9px;
font-weight:bold;
color:#555;
background-color: #CAD0C6;
}

#breadcrumbRight a {
	color: #111;
	padding: 0 5px;
   }
   
#breadcrumbRight a:hover{
	background-color: #aab0a6;
	color: maroon;
   }

/*technique from article at alistapart: taming lists http://www.alistapart.com/articles/taminglists/ */
#breadcrumbRight ul li:before {
/*content: "\00bb \00A0 \00A0 \00A0"; Unicode for >>    ... NOTE- i removed this for now b/c it doesnt show up in IE...*/
color: #fff;
}

#breadcrumbRight ul li.first:before {
content: " ";}


#breadcrumbRight ul {
margin-left: 0;
padding-left: 0;
display: inline;
border: none;
}

#breadcrumbRight ul li {
margin-left: 0;
padding-left: 2px;
border: none;
list-style: none;
display: inline;
}
   

#footer {
	color: #ccc;
	font-size:10px;
	line-height: 15px;
	/*padding: 0 5px;*/
   }

#footer a {
	color: #ccc;
	padding: 0 5px;
	border-bottom: 1px dotted #999;
   }
   
#footer a:hover{
	padding: 0 5px;
	background-color:#555;
	border-bottom: 1px dotted #660303;
   }
	
#left {}



#content { line-height: 140%; color: #333;}

#content p {
	margin: 5px 0 30px 0;
	padding: 0;
	}

#content a {
	color:#9C1200;
	border-bottom: 1px dotted #999;
	padding:2px;
   }
#content .anchor {padding:0; margin:0; border:none;}

#content a:hover{
	color: #dd0000;
	padding:2px;
	border-bottom: 1px dotted /*#660303*/;
	background-color:#f3f3f3;
   }

#content h1, h2, h3, h4, th  {
	color:  #345068/*#03446F #064A02*/;
	font-family: "Lucida Grande", "Lucida Sans Unicode", verdana, lucida, sans-serif;
	font-weight:normal;
}

#content h1 {
	font-size:27px;
	margin: 10px 10px 25px 0;
	padding-bottom:10px;
	line-height: 110%;
}
	
#content h2 {
	font-size:16px;
	margin: 20px 10px 2px 0;
	padding:0;
	}
	
#content h3 {
	font-size:12px;
	margin: 20px 10px 2px 0;
	padding:0;
	font-weight:bold;
	}
	
#content h4 { /*same as h3, but for inline use*/
	font-size:12px;
	font-weight:bold;
	display:inline;
 }
	
#content li {margin-bottom: 5px;}

#content table {border: 0;}
#content tr {}
#content th {border: 1px solid #aaa; background-color: #e9eee9; font-weight:bold;}
#content .center {text-align: center;}
#content td {border: 1px solid #aaa; padding: 0 3px;}

#content img {
	border: 1px solid #ccc;
	padding: 5px;
	}
	
#content .photo {
	border: 1px solid #ccc;
	padding: 5px;}

.logo {
	border: 1px solid #ccc;
	padding: 5px;
}

#content hr {
	height: 1px;
	color: #777;
	background-color: #777;
	border: none;
	text-align: center;
	margin: 20px;
	}
	
#content input, select, textarea {
	background-color: #f3f4f3;
	border: 1px solid #c99;
	padding: 2px 5px;
	}

/*as with most pseudo classes, this doesnt work in IE*/
#content input:focus, 
#content select:focus, 
#content textarea:focus { background-color: #ffffff; border: 1px solid maroon;}


#content .button {
	background-color: #fafafa; 
	font-weight: bold; 
	padding: 0px 25px; 
	cursor:pointer;
}

#content .button:hover{
	background-color: #fff; 
	font-weight: bold; 
	padding: 0px 25px; 
	cursor:pointer;
}



.inline {display:inline;}

.note h3{
	font-size:12px;
	display:inline;
	color: #443617/*#238127*/;
	}

.maroon	{color: #660303 /*#9C1200 #871000*/;}


/*
used in highlighting seleced form lables
from example written by Philip Lindsay
at http://www.xlab.co.uk/weblog/623
*/
.checked { font-weight: bold; }