/**
 * Screen Stylesheet
 */

@import url( components.css );

/***********************************************************************************
 * Common Element Styles
 */

/* #search-login-bar -- Comes before the header and holds a search form and quick login bar */
#search-login-bar {
	border-top: 10px solid #ccc;
	background: #f0f0f0;
	overflow: hidden;
	width: 100%;
}
	#search-login-bar #search-form {
		float: left;
		padding: 5px 10px;
	}
		#search-login-bar input { font-size: 0.9em; }

	#search-login-bar #login-form, #search-login-bar #logout-link {
		float: right;
		padding: 5px 10px;
	}
		#logout-link img { vertical-align: middle; }

/* #header -- Contains the top level navigation and the logo */
#header {
	overflow: auto;
	width: 100%;
}
	#header ul#nav {
		float: right;
		list-style: none;
		margin: 30px 0 30px 0;
		padding: 0;
	}
		#header ul#nav li { 
			float: left;
			margin-right: 20px;
		}
			#header ul#nav li a {
				display: block;
				background: #eee;
				padding: 4px 12px;
			}
	
	#header h1#logo { 
		float: left;
		margin: 30px 0 30px 15px;
	}
	
	#header h1#logo a {
		font-size: 2em;
		color: #ccc;
		font-style: italic;
		font-family: Georgia, times, serif;
		display: block;
	} 

/* #container -- Wraps all content after the header and before the footer */
#container {

}

/* #userbar -- Holds the navigation for the logged in user on all internal pages */
#userbar {
	background: #ddd;
}
	
/* #optionsbar -- Holds the navigation for the currently viewed object (user, group, component etc) internal pages */
#optionsbar {
	background: #f0f0f0;
}

	#userbar h3, #optionsbar h3 {
		text-align: center;
		padding: 8px 0 8px 0;
		font-size: 1em;
		font-weight: bold;
		background: #ddd;
	}
		#userbar h3 { background-color: #ccc; }
		
	/* Center align avatars in both user and optionsbar */
	#userbar p, #optionsbar p { text-align: center; }
	#userbar ul, #optionsbar ul { list-style: none; }

/* .content-header -- Comes directly before the content div and can hold page information, or content navigation */
.content-header {
	text-align: center;
	padding: 8px 0 8px 0;
	background: #eee;
	font-size: 1em;
	font-weight: bold;
	min-height: 16px;
}

	/* .content-header-nav -- Navigation items that appear in the content-header are marked with this class. */
	ul.content-header-nav {
		list-style: none;
		margin: 0;
		padding: 0;
	}
		ul.content-header-nav li {
			float: left;
			padding: 8px;
			margin-top: -8px;
		}
			ul.content-header-nav li a {
				font-weight: normal;
				display: block;
				min-height: 16px;
				padding: 8px;
				margin: -8px -8px 0 -8px;
				background: #ccc;
			}
				/* Selected navigation elements include the .current class */
				ul.content-header-nav li.current a {
					background: #aaa;
					color: #fff;
					font-weight: bold;
				}
		

/* #content --  Holds the main content on every page */
#content {
	padding: 20px;
}
	
	/* Left menu within the #content div */
	#content .left-menu {
		float: left;
		width: 165px;
	}
		.left-menu input { width: 80%; }
		.left-menu ul {
			list-style: none;
			margin: 0;
			padding: 0;
		}
		.left-menu h5 { margin: 0; font-size: 1em; }
		
		/* Holds buttons, usually positioned within the content menu */
		div.button-block {
			margin: 20px 0;
		}
	
	/* Main column within the #content div */
	#content .main-column {
		margin-left: 175px;
	}