/*
Title:      screen.css
Author:     Christopher Thomas! [iam.christopher.thomas@gmail.com]
Updated:    October 31, 2008 -- BOO!
*/

body {
	font: 62.5% Arial, sans-serif;
	background: #e4edf2 url(img/body-bg.png) left top repeat-x;
	text-align: left;
	color: #000;
}

.cleary {
	clear: both;
}

	hr.cleary {
		visibility: hidden;
		margin: 0 0 -2px;
		padding: 0;
	}
	
.right { float: right; }

.left { float: left; }

a, a:link, a:visited, a:hover, a:active {
	text-decoration: none;
	border: none;
}
	
strong, b { font-weight: bold; }

italic, i { font-style: italic; }
	
div#header {
	margin: 0 auto -110px;
	background: transparent url(img/header-bg.png) left top no-repeat;
	height: 212px;
	width: 800px;
	padding: 0 60px;
}

	div#header ul#info {
		float: right;
		margin-top: 20px;
	}
	
		ul#info li {
			text-align: right;
			font-size: 1.2em;
			letter-spacing: 1px;
		}
		
		ul#info li.small {
			font-size: 1.0em;
		}
	
	div#header ul#social {
		margin: 8px 0 -8px;
	}
		
		div#header ul#social li {
			display: inline;
			width: 80px;
			margin-left: 10px;
		}
		
div#container {
	background: #fff url(img/container-bg.png) left top no-repeat;
	border: 1px solid #bdc8cc;
	width: 800px;
	margin: 0 auto;
	z-index: 500;
}

	div#container ul#navigation {
		background: transparent url(img/nav-bg.png) left top repeat-x;
		width: 100%;
		border-bottom: 1px solid #bdc8cc;
		margin-bottom: 1.5em;
		height: 39px;
	}
	
		ul#navigation li.topLevel {
			position: relative;
			background: transparent url(img/navItem-bg.png) left top no-repeat;
			float: left;
			font-size: 13px;
			margin-bottom: -3px;
			text-transform: uppercase;
			height: 39px;
		}

			ul#navigation li.topLevel a,
			ul#navigation li.topLevel a:link,
			ul#navigation li.topLevel a:visited,
			ul#navigation li.topLevel a:active {
				display: block;
				color: #324243;
				height: 25px;
				padding: 14px 15px 0;
				float: left;
			}
			
			ul#navigation li.topLevel#contact a,
			ul#navigation li.topLevel#contact a:link,
			ul#navigation li.topLevel#contact a:visited,
			ul#navigation li.topLevel#contact a:active {
				padding: 14px 13px 0 14px;
			}

			ul#navigation li.topLevel a:hover {
				color: #000;
			}

				ul#navigation li.topLevel ul.subNav {
					position: absolute;
					top: 39px;
					left: 0;
					display: none;
					background: transparent url(img/subNav-bg.png) left top repeat;
				}
				
					ul#navigation li.topLevel ul.subNav#about {	width: 215px; }				
					ul#navigation li.topLevel ul.subNav#resources { width: 150px; }
					ul#navigation li.topLevel ul.subNav#services { width: 190px; }
					ul#navigation li.topLevel ul.subNav#programs { width: 215px; }
					ul#navigation li.topLevel ul.subNav#facility { width: 135px; }
				
				
				ul#navigation li.topLevel:hover ul.subNav,
				ul#navigation li.topLevel.over ul.subNav {
					display: block;
				}
				
					ul#navigation li.topLevel ul.subNav li {
						display: block;
						font-size: 12px;
						color: #3e4d4e;
						height: 26px;
						text-transform: none;
						letter-spacing: 1px;
						overflow: hidden;
					}
					
						ul#navigation li ul.subNav li a,
						ul#navigation li ul.subNav li a:link,
						ul#navigation li ul.subNav li a:visited,
						ul#navigation li ul.subNav li a:active {
							display: block;
							background-image: none;
							height: 15px;
							width: 100%;
							text-indent: 25px;
							color: #3e4d4e;
							padding: 7px 25px 4px 0;
							margin-right: -25px;
						}
						
						ul#navigation li ul.subNav li a:hover {
							background-color: #afc5c6;
							color: #000;
						} 

			ul#navigation li#home {
				background: none;
			}
			
			ul#navigation li#home.topLevel a,
			ul#navigation li#home.topLevel a:link,
			ul#navigation li#home.topLevel a:visited,
			ul#navigation li#home.topLevel a:active {
				height: 39px;
				padding: 0 14px 0 13px;
			}			
			
			ul#navigation li#home.topLevel a,
			ul#navigation li#home.topLevel a:link,
			ul#navigation li#home.topLevel a:visited,
			ul#navigation li#home.topLevel a:active {
				height: 39px;
				padding-top: 0;
			}
	
		div#container p {
			font-size: 1.2em;
			margin-bottom: 1.0em;
		}
		
		div#container p a,
		div#container p a:link,
		div#container p a:visited,
		div#container p a:active {
			color: #9c2325;
			text-decoration: underline;
		}
		
		div#container p a:hover {
			color: #c92d30;
			text-decoration: none;
		}
		
		div#container h2 {
			font-size: 1.8em;
			margin-bottom: 15px;
			font-weight: bold;
		}
		
		div#container h3 {
			font-size: 1.3em;
			margin: 7px 0 10px;
			font-weight: bold;
		}
		
	div#container div.contentBox {
		background: transparent url(img/contentBox-bg.jpg) left top repeat-x;
		border: 1px solid #bdc8cc;
		width: 750px;
		margin: 0 10px 10px;
		padding: 15px;
	}	
	
		div#container div.contentBox img {
			border: 3px solid #bdc8cc;
			margin: 0 25px 10px;
		}	
		
			div#container div.contentBox img.left {
				margin-left: 0;
			}
			
			div#container div.contentBox img.right {
				margin-right: 0;
			}

	div#container div#frontContentBox {
		background: transparent url(../../09website/include/stylesheets/img/welcomeBox-bg.jpg) left top no-repeat;
		width: 780px;
		margin: 0 10px 10px;
	}
	
		div#frontContentBox div#welcomeBox {
			background: transparent url(img/contentBox-bg.jpg) left top repeat-x;
			border: 1px solid #bdc8cc;
			width: 535px;
			padding: 11px 10px 11px;
			float: left;
		}
		
		div#welcomeBox img {
			border: 3px solid #bdc8cc;
			margin-right: 15px;
		}
		
			div#welcomeBox p span {
				font-size: 1.2em;
			}
		
		div#frontContentBox ul#badgeBox {
			float: right;
			width: 210px;
		}
		
			div#frontContentBox ul#badgeBox li.taste {
				display: inline;
				float: left;
			}
			
			div#frontContentBox ul#badgeBox li.artisan {
				display: inline;
				float: right;
			}
			
		div#frontContentBox ul#socialLinks {
			float: right;
			width: 210px;
			display:inline;
		}
		
		div#frontContentBox ul#socialLinks li {
			float:left;
			display:inline;
			width:30px;
			margin:15px 10px 0;
		}
		div#frontContentBox ul#socialLinks li a{
		
		}
			
		
	div#container div#featuredEvents {
		background: transparent url(img/featuredEvents-bg.png) left top no-repeat;
		width: 800px;
	}

		div#featuredEvents a, 
		div#featuredEvents a:link, 
		div#featuredEvents a:visited,
		div#featuredEvents a:active {
			font-weight: bold;
			color: #0a87c1;
		}
		
		div#featuredEvents a:hover {
			color: #064f71;
		}
		
		div#featuredEvents div#featuredHeader {
			height: 37px;
			width: 800px;
		}

			div#featuredHeader span {
				visibility: hidden;
			}
		
			div#featuredEvents div#featuredHeader a {
				font-size: 1.4em;
				display: block;
				text-transform: uppercase;
				margin-right: 15px;
				float: right;
				font-weight: normal;
				letter-spacing: 1px;
			}
			
		div#featuredEvents div.row {	
			border-top: 1px solid #bdc8cc;
		}
			
		div#featuredEvents div.featured {
			background: transparent url(img/contentBox-bg.jpg) left top repeat-x;
			width: 380px;
			height: 120px;
			padding: 10px;
		}
		
			div#featuredEvents div.featured.left {
				border-right: 1px solid #bdc8cc;
				width: 379px;
			}
		
			div#featuredEvents div.featured img.eventImage {
				width: 147px;
				height:	110px;
				border: 3px solid #bdc8cc;
				float: left;
				margin-right: 10px;
			}
			
			div#featuredEvents div.featured ul {
				width: 215px;
				float: left;
			}
			
				div#featuredEvents div.featured ul li.title,
				div#featuredEvents div.featured ul li.date,
				div#featuredEvents div.featured ul li.moreLink {
					font-size: 1.4em;
					font-weight: bold;
				}
				
				div#featuredEvents div.featured ul li.description {
					font-size: 1.2em;
					border-bottom: 1px solid #bdc8cc;
					padding: 0.6em 0;
					margin-bottom: 0.6em;
				}

div#footer {
	background: transparent url(img/footer-bg.png) left top no-repeat;
	width: 800px;
	margin: -290px auto 5.0em;
	padding: 300px 9px 0;
}
	
	div#footer p {
		font-size: 1.2em;
		color: #5b6064;
		letter-spacing: 1px;
	}
	
		div#footer p a,
		div#footer p a:link,
		div#footer p a:visited,
		div#footer p a:hover {
			color: #5b6064;
			text-decoration: underline;
		}