/* The Facebook Project R2 Styles */

	@font-face {
	font-family:"Calibri";
	src: url(../../fonts/CALIBRI3.eot);
	}

	body{
	background-color:#F8F8F8;
	margin:0 0 0 0.5ex;
	color:#000000;
	font-family:"Calibri", Arial, Helvetica, sans-serif;
	font-size:100%;
	text-align: center; 
	}
	
	/*Non-IE7 browsers will display this*/
	html>/**/body{
	font-family:Arial, Helvetica, sans-serif;
	font-size:90%;
	}
	
	.skiplinks {
	position:absolute;
	left:-2000px;
	}

	.main #container { 
	width: 960px; 
	background: #FFFFFF;
	margin:0 auto 0 auto;
	border-left: 1px solid #000;
	border-right: 1px solid #000;
	text-align: left; /* this overrides the text-align: center on the body element. */
	padding:2px 0 3px 0;
	border-top:10px solid #587BA1;
	border-bottom:10px solid #BCBCBC;
	} 
	
	h1{
	color:#17365d;
	padding-bottom:0.25ex;
	margin:0;
	border-bottom:1px solid #17365d;
	}
	
	h2{
	/*TBA*/
	}

	h3{
	margin-left:-4px;
	padding-left:13px;
	margin-top:-6px;
	padding-top:7px;
	background:url(headerbground.jpg) no-repeat left;
	color:#365f91;
	font-size:120%;
	margin-bottom:0.25ex;
	}
	
	h4{
	text-transform:uppercase;
	color:#46688D;
	margin-bottom:-0.25ex;
	}
	h4.gray{
	color:#666666;
	}
	
	h5{
	color:#666666;
	font-weight:normal;
	margin-top:0.75ex;
	}
	
	p{
	margin-top:0.25ex;
	}
	
	.quote{
	color: #587BA1;
	font-style:italic;
	}
	
/* general page navigation */

	#banner{
	height:60px;
	background:url(facebooklogo.jpg) no-repeat left white;
	margin:3px;
	}
	
	#banner h1{
	position:absolute;
	left:-1000px;
	}
	
	#banner h2{
	position:absolute;
	left:-1000px;
	}
	
	#banner img{
	margin:1ex;
	padding:0;
	border:0;
	}
	
	#banner a{
	border:0;
	}
	
	#banner a:hover{
	cursor:pointer;
	}

	#nav{
	background:#EEE;
	width:960px;
	height:30px;
	font-size:90%;
	}
	
	/* non-IE font-size on drop-downs */	
	html>/**/#nav{
	font-size:80%;
	}
		
	#nav a{
	border:none;
	}
	
	.content{
	margin:3px;
	border:1px solid #365f91;
	padding:1ex;
	font-size:95%;
	}
	
	.content h2{
	margin-top:0;
	}
	
	.content ul{
	list-style:url(custom_bullet.jpg);
	}
	
	.readmore{
	margin:-1ex 1ex 3ex 0ex;
	padding:0;
	}
		
	.homelink{
	width:53px;
	height:53px;
	margin:3px;
	}

	.main a:link, .main a:visited, .content a:link, .content a:visited{text-decoration:none;border-bottom:1px dotted #587BA1;color:#587BA1;}
	.main a:active, .main a:hover, .content a:active, .content a:hover{
	border-bottom:1px solid #587BA1;
	color:#999;
}
	
/* left sidebar stuff */

	.main #leftsidebar {
	float: left; 
	width: 283px; 
	height:481px;
	margin-left:7px;
	}
	
	.main #leftsidebar h2{
	position:absolute;
	left:-2000px;
	}
	
	.main #leftsidebar h3{
	position:absolute;
	left:-2000px;
	}
	
	.main #leftsidebar p{
	position:absolute;
	left:-2000px;
	}
	
/* right sidebar and link stuff */
	
	.main #rightsidebar{
	float: right;
	width: 217px;
	background:white;
	margin-left:3px;
	border-left:1px dotted #587BA1;
	}
	
	.main #rightsidebar h3{
	margin-top:0ex;
	margin-bottom:0.25ex;
	}
	
	.main #rightsidebar .navigation{
	margin:2px 3px 3px 3px;
	border-top:6px solid #587BA1;
	}
	
	.main #rightsidebar .navigation a{border:none;}
	
	.main #rightsidebar .navigation ul{
	margin:0;
	padding:0;
	list-style:none;
	}
	
	.main #rightsidebar .navigation li{
	height:36px;
	background:url(link.jpg) no-repeat;
	margin:1px 0 1px 0;
	}
	
	.main #rightsidebar .navigation li:hover{
	background:url(link_a.jpg) no-repeat;
	}
	
	.main #rightsidebar .navigation img{
	border:0;
	}
	
	.main #rightsidebar .navigation li h4{
	position:absolute;
	right:2000px;
	margin:0;
	padding:0;
	height:1px;
	}
	
	.main #rightsidebar .logo{
	background:url(logo.jpg) no-repeat;
	height:182px;
	width:211px;
	margin:3px;
	}
	
	.main #rightsidebar .logo h1{
	position:absolute;
	right:2000px;
	}
	
	.main #rightsidebar .logo h2{
	position:absolute;
	right:2000px;
	}
	
	.main #rightsidebar .white{
	padding:1ex 1ex 2.5ex 1ex;
	border:1px solid #DDD;
	margin:0 3px 3px 3px;
	background:url(boxfade.jpg) repeat-x bottom white;
	clear:both;
	}
	
	.main #rightsidebar .white p, .main #rightsidebar .gray p{
	margin:0.5ex;
	}
	
	.main #rightsidebar .gray{
	background:#F6F6F6;
	padding:1ex 1ex 2.5ex 1ex;
	border:1px solid #DDD;
	border-top:0;
	margin:-3px 3px 3px 3px;
	clear:both;
	}
	
/* main content and features */
	
	.main #feature{
	height:481px;
	margin:0 222px 0 290px;
	padding:0;
	background:#000000;
	padding:0;
	text-align:left;
	} 
	
	.main #feature h4{
	position:absolute;
	top:-2000px;
	}
	
	.main #page{
	margin:0 220px 0 5px;
	padding:2px;
	}
	
	.main #page .mission{
	background:url(mission_bg_ie.jpg) right top;
	border:1px solid #AAA;
	}
	
	html>/**/.main #page .mission{
	background:url(mission_bg.jpg);
	}
	
	.main #page .mission img{
	border:0;
	margin:0;
	}
	
	.main #page .item{
	padding:1ex;
	border:1px solid #DDD;
	background:url(boxfade.jpg) repeat-x bottom white;
	color:#222222;
	font-size:95%;
	}
	
	.spacedlist{}
	.spacedlist li{padding-bottom:1ex;}
	.spacedlist li ul{padding-bottom:0ex;}
	.spacedlist li ul li{padding-bottom:0;}
	
/* footer styles */
	
	.main #footer{ 
	padding: 1ex 2ex 1ex 2ex; 
	background:#EAEAEA;
	color:#666666;
	font-size:90%;
	margin:0 3px 0 3px;
	} 
	
	.main #footer ul{
	list-style:none;
	float:right;
	margin:0;
	text-align:right;
	}
	
	.main #footer li{
	display:inline;
	margin:0;
	}
	
	.main #footer p{
	margin:0;
	}
	
	.main #footer a:link, .main #footer a:visited{color:#587BA1;text-decoration:none;border:none;}
	.main #footer a:active, .main #footer a:hover{color:black;}

/* page float stuff */

	.dottedblue{
	border-top:1px dotted #587BA1;
	height:3px;
	margin-top:3px;
	}
	
	.fltrt { /* this class can be used to float an element right in the page. */
	float: right;
	margin-left: 8px;
	}
	.fltlft { /* this class can be used to float an element left in your page */
	float: left;
	margin-right: 8px;
	}
	.clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
	}