/* Layout Stylesheet for the CII website */
/* Modified by Jeff Ginger 02.04.2009
/* This goes on top of the ciicommon styles */

/* General styles */

/* Clear, a div (or br or whatever) to clear floats */
.clear{
clear:both;
height:0;
}

/* Primary navigation (drop-downs) */
#links{
height:25px;
background:#004986;
width:990px;
}

	#links ul, #links li{
	/* found in SpyMenuBarHoriztonal.css */
	}

/* Main content beneath the banner and navigation.
Use a 'page' div on the home page or single col pages and 'subpage' on a two col pages */

#page{
background:#FFF;
margin:0;
padding:9px 10px;
}

#subpage{
background:#FFF;
margin:0;
padding:0;
min-height:250px;
}

	#subpage .content{
	float:right;
	padding:16px;
	width:736px;
	}
	
	#subpage .sidebar{
	float:left;
	width:222px;
	background:url(../../CIMA2/pics/sidebar_fade.png) repeat-x bottom #EBF0F6;
	padding:16px 0 20px 0;
	magin:0;
	}
	
		#subpage .sidebar img{
		border:1px solid #004986;
		}
		
		#subpage .sidebar ul{
		margin-right:12px;
		}

/* Feature is the main picture feature that spans the top of the site on the home page. */
#feature{
width:100%;
}

	/* The feature picture.
	Could be a swf, too. */
	#feature .graphic{
	border:0;
	float:left;
	height:200px;
	width:540px;
	}
	
		#feature .graphic img{
		border:0;
		position:absolute;
		}
	
	/* The blue box to the right of the graphic */
	#feature .content{
	float:right;
	width:370px;
	height:180px;
	padding:16px 30px 4px 30px;
	background:#EBEFF6;
	}	
	
		#feature .content ul{
		margin:0 0 0 50px;
		padding:0;
		}
			
	/* The opaque caption box area */
	#feature .caption{
	position:absolute;
	padding:8px 8px 4px 8px;
	height:19px;
	width:524px;
	background:url(../../CIMA2/pics/featurebg.png);
	top: 304px;
	}
	
/* Main is the content area just beneath the big feature on the home page.  
It contains the tabbed event/news box, spotlights and audience direction nav, and misc right col items */
#main{
margin:9px 0 0 0;
min-height:350px;
}

	/* Tabbed box with new, events, feature projects and get involved */
	/* See the rest of the styles in SpryTabbedPanels.css */
	#leftcol{
	width:480px;
	float:left;
	}
	
	/* The dark blue box */	
	#resources, #spotlight{
	margin-left:490px;
	width:240px;
	background:#004986;	
	}

	#resources{
	padding:10px 8px;
	}
		
	#spotlight{
	padding:0 8px 8px 8px;
	}
	
		#spotlight .item{
		border-bottom:1px dotted #EBEFF6;
		height:1px;
		margin-bottom:4px;
		}
		
		#spotlight ul{
		margin:0;
		padding:0 0 0 16px;
		border-top:1px dotted #EBEFF6;
		}
	
	/* Misc right side items */
	#rightcol{
	float:right;
	width:210px;
	padding:10px 4px 10px 0;
	}
		
		#rightcol ul{
		margin:0 24px 16px 70px;
		}
		
		#rightcol li{
		list-style-image:url(../../CIMA2/pics/bullet.png);
		}
		
		#rightcol img{
		border:1px solid #EBEFF6;
		}

/* Secfeature is the orange secondary feature area on the home page. 
It contains links, a preview from CIMA, and whatever else. */
#secfeature{
width:970px;
min-height:191px;
margin-top:9px;
background:url(../../CIMA2/pics/anchorbg.jpg) repeat-x #FEBC17;
}

	/* The quicklink list on the left */
	#secfeature .quicklinks{
	list-style:none;
	float:left;
	margin:8px 0 0 0;
	padding:0 16px;
	width:196px;
	}
		
		#secfeature .quicklinks ul{
		margin:0 0 0 16px;
		padding:0;
		}
		
		#secfeature .quicklinks li{
		padding:0;
		}
	
	#secfeature .CIMA{
	float:left;
	padding:0 0 0 18px;
	margin:8px 0;
	border-left:1px dotted #FFF;
	}
	
	/* Styles for a profile for a person */
	#secfeature .profile{
	margin:8px 0 0 18px;
	padding-left:18px;
	border-left:1px dotted #FFF;
	width:206px;
	float:left;
	}
	
	#secfeature .CIclub{
	margin:8px 0 0 18px;
	padding-left:18px;
	border-left:1px dotted #FFF;
	width:412px;
	float:left;
	}
	
	#secfeature img{
	border:1px solid #004986;
	background:#EBEFF6;
	}