/*  
Theme Name: NorthWood Tools
Theme URI: http:///www.northwoodchurch.org/
Description: 2 Column Layout
Date: May 19, 2009
Version: 1.0
Author: NorthWood Church
Author URI: http:///www.northwoodchurch.org/
*/
/* ================================================================ 
						Basic Page Elements
=================================================================== */
body {
	background: #edecec repeat-x top left;
	color: #53575a;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	margin: 0px auto;
	padding: 0;
}
a, a:visited{
	color: #872905;
	text-decoration: underline;
}
a:hover{
	color: #be3b08;
	text-decoration: none;
}

/* ================================================================ 
						Global Cleanup Settings
=================================================================== */
ol {list-style: decimal;}
ul {list-style-image:none;list-style-position:outside;list-style-type:none;}
h1, h2, h3, h4, h5, h6 {font-weight:normal;}
ul, ol, li, h1, h2, h3, h4, h5, h6, body, html, p, blockquote {margin:0px;padding:0px;}
a img {border: 0px;}
a, a:visited, a:hover { outline: none; }

/* ================================================================ 
						Global Attributes
=================================================================== */
.flash-success {
	display: block;
	border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	-khtml-border-radius: 4px;
	margin-bottom: 2px;
	text-decoration: none;
	background: #d5ed9b url(../imgs/flash-success.png) no-repeat 3px 1px;
	border: 1px solid #b7d07a;
	padding: 4px 4px 4px 26px;
	color: #3a0c0c;
	line-height: normal;
	margin-bottom: 15px;
}
.flash-warning, .flash, .warning {
	display: block;
	border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	-khtml-border-radius: 4px;
	margin-bottom: 2px;
	text-decoration: none;
	background: #f5e27b url(../imgs/flash-warning.png) no-repeat 3px 1px;
	border: 1px solid #e9b35e;
	padding: 4px 4px 4px 26px;
	color: #5b4b17;
	line-height: normal;
	margin-bottom: 15px;
}
.flash-error, .error {
	display: block;
	border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	-khtml-border-radius: 4px;
	margin-bottom: 2px;
	text-decoration: none;
	background: #db8181 url(../imgs/flash-error.png) no-repeat 3px 1px;
	border: 1px solid #c36464;
	padding: 4px 4px 4px 26px;
	color: #3a0c0c;
	line-height: normal;
	margin-bottom: 15px;
}
.float-left {
	float: left;
	margin-right: 5px;
}
.float-right {
	float: right;
	margin-left: 5px;
}
.icon-tray {
	display: block;
	overflow: hidden;
}
	.icon-tray a {
		margin: 2px;
		float: left;
	}
.icon-Denied {
	background: url(../imgs/icons.png) no-repeat;
	background-position: 0px -120px;
	display: block;
	height: 20px;
	text-decoration: none;
	width: 20px;
}
	.icon-Denied:hover, span.icon-Denied {
		background-position: 0px -140px;
	}
.icon-Approved {
	background: url(../imgs/icons.png) no-repeat;
	background-position: 0px -80px;
	display: block;
	height: 20px;
	text-decoration: none;
	width: 20px;
}
	.icon-Approved:hover, span.icon-Approved {
		background-position: 0px -100px;
	}
span.icon-Pending {
	background: url(../imgs/icons.png) no-repeat;
	background-position: 0px -160px;
	display: block;
	height: 20px;
	text-decoration: none;
	width: 20px;
}
.icon-Trash {
	background: url(../imgs/icons.png) no-repeat;
	background-position: 0px -0px;
	display: block;
	height: 20px;
	text-decoration: none;
	width: 20px;
}
	.icon-Trash:hover {
		background-position: 0px -20px;
	}
.icon-Edit {
	background: url(../imgs/icons.png) no-repeat;
	background-position: 0px -40px;
	display: block;
	height: 20px;
	text-decoration: none;
	width: 20px;
}
	.icon-Edit:hover {
		background-position: 0px -60px;
	}
.icon-Close {
	background: url(../imgs/icons.png) no-repeat;
	background-position: 0px -180px;
	display: block;
	height: 20px;
	text-decoration: none;
	width: 20px;
}
	.icon-Close:hover {
		background-position: 0px -200px;
	}
.icon-Calendar, .icon-Calendar:visited {
	background: url(../imgs/icons.png) no-repeat;
	background-position: 0px -220px;
	display: inline-block;
	height: 20px;
	margin-left: 4px;
	text-decoration: none;
	width: 20px;
}
	.icon-Calendar:hover {
		background-position: 0px -240px;
	}
.icon-Draft {
	background: url(../imgs/icons.png) no-repeat;
	background-position: 0px -260px;
	display: block;
	height: 20px;
	text-decoration: none;
	width: 20px;
}
	
/* ================================================================ 
							Page Styling
=================================================================== */
#master-container {
	overflow: hidden;
}
#header {
	height: 100px;
	overflow: hidden;
}
	#logo {
		background: url(../imgs/logo-NWTools.jpg) no-repeat left top;
		display: block;
		float: left;
		height: 98px;
		width: 400px;
	}
	#profile {
		float: right;
		height: 40px;
		margin-right: 90px;
		padding: 60px 0px 0px 0px;
	}
		#profile .button {
			float: left;
		}
		#profile .user {
			color: #000;
			display: block;
			float: left;
			font-size: 12px;
			height: 16px;
			margin: 0px 0px 0px 25px;
			
		}
			#profile .user a, #profile .user a:visited {
				background: url(../imgs/icon-profile.jpg) no-repeat right center;
				color: #000;
				display: block;
				padding: 6px 30px 0px 0px;
				text-decoration: underline;
			}
			#profile .user a:hover {
				text-decoration: none;
			}
	/* IE FireFox FIX for Input Button */
	button::-moz-focus-inner,
	input[type="reset"]::-moz-focus-inner,
	input[type="button"]::-moz-focus-inner,
	input[type="submit"]::-moz-focus-inner,
	input[type="file"] > input[type="button"]::-moz-focus-inner {
	  padding: 0;
	  border: none;
	}
	* html input { overflow: visible; }
	.buttons select {
		cursor: pointer;
		background: url(../imgs/toolbar-bg.jpg) repeat-x left top;
		display: block;
		border: 1px solid #e0e0e0;
		border-collapse: collapse;
		border-radius: 5px;
		-moz-border-radius: 5px;
		-webkit-border-radius: 5px;
		-khtml-border-radius: 5px;
		color: #595858;
		font-size: 12px;
		height: 27px;
		margin: 0px 10px 0px 0px;
		padding: 3px 0px 0px 0px;
	}
	.buttons {
		overflow: hidden;
		margin-bottom: 15px;
	}
		.button input {
			background: none;
			border: 0px;
			border-collapse: collapse;
			border-spacing: 0;
			color: #595858;
			cursor: pointer;
			display: block;
			font-size: 12px;
			margin: 0px;
			height: 25px;
			outline: 0px;
			padding: 0px 10px 0px 10px;
			space: 0px;
			text-decoration: none;
			text-align: center;
		}
		.button {
			display: inline-block;
			cursor: pointer;
			margin-right: 5px;
			text-decoration: none;
		}
		.button:hover a {
			background-position: 0px -20px;
			text-decoration: none;
		}
		.button a, .button a:visited {
			cursor: pointer;
			background: url(../imgs/toolbar-bg.jpg) repeat-x left top;
			border: 1px solid #e0e0e0;
			border-radius: 5px;
			-khtml-border-radius: 5px;
			-moz-border-radius: 5px;
			-webkit-border-radius: 5px;
			display: block;
			text-decoration: none;
		}
		.button a span, .button a span:visited {
			color: #595858;
			cursor: pointer;
			display: block;
			font-size: 12px;
			height: 20px;
			padding: 5px 10px 0px 10px;
			text-align: center;
			text-decoration: none;
		}
		.button a:hover {
			background-position: 0px -20px;
			text-decoration: none;
		}
		.button.on span {
			background: #f1f4f6;
			border: 1px solid #e0e0e0;
			border-radius: 5px;
			-khtml-border-radius: 5px;
			-moz-border-radius: 5px;
			-webkit-border-radius: 5px;
			color: #595858;
			cursor: wait;
			display: block;
			font-size: 12px;
			height: 20px;
			padding: 5px 10px 0px 10px;
			text-align: center;
			text-decoration: none;
		}
		.button.on img {
			float: left;
			margin-right: 5px;
		}
#main-nav {
	display: block;
	height: 30px;
	overflow: hidden;
	padding: 0px 90px 0px 90px;
}
	#main-nav li {
		display: block;
		float: left;
	}
	#main-nav a, #main-nav a:visited {
		display: block;
		font-size: 12px;
		font-weight: bold;
		height: 22px;
		margin-right: 4px;
		padding: 8px 0px 0px 0px;
		text-align: center;
		text-decoration: none;
		width: 104px;
	}
	#main-nav .on a {
		background: url(../imgs/mn-tab.jpg) no-repeat left top;
		color: #de7c4b;
	}
#body-container {
	background-position: right top;
	margin: 90px 90px 20px 90px;
}
	#side-bar {
		float: right;
		width: 200px;
	}	
		#side-bar h2 {
			margin: 0px 0px 0px 20px;
		}
		.feed {
			margin: 0px 0px 30px 20px;
		}
		#sub-nav {
			padding-bottom: 35px;
			margin: 15px 0px 0px 0px;
		}
		#sub-nav .on {
			background: url(../imgs/selector-arrow.jpg) no-repeat 0px 4px;
		}
		#sub-nav li a, #sub-nav li a:visited {
			color: #53575a;
			display: block;
			font-size: 12px;
			height: 18px;
			border-bottom: 1px solid #dddada;
			line-height: 14px;
			padding: 12px 0px 10px 50px;
			text-decoration: none;
		}
		#sub-nav li a:hover {
			color: #872905;
			text-decoration: underline;
		}
		.feed li, #overseeing li {
			margin-bottom: 10px;
		}
		/* ================================================================ 
								Sidebar Icons
		=================================================================== */
		#campus-event a {
			background: url(../imgs/icon-CampusEvent.jpg) no-repeat 20px 10px;
		}
		#off-site a {
			background: url(../imgs/icon-OffSite.jpg) no-repeat 20px 10px;
		}
		#time-off a {
			background: url(../imgs/icon-TimeOff.jpg) no-repeat 20px 10px;
		}
		#bay-table a {
			background: url(../imgs/icon-BayTable.jpg) no-repeat 20px 10px;
		}
		#media-form a {
			background: url(../imgs/icon-MediaForm.jpg) no-repeat 20px 10px;
		}
		#room-availability a {
			background: url(../imgs/icon-RoomAvailability.jpg) no-repeat 20px 10px;
		}
	/* ================================================================ 
							(((Rounded Corners))
	=================================================================== */
	#bg { background: #fff; }
	#edge-top { background: url(../imgs/edge-Top.jpg) repeat-x left top; }
	#edge-left { background: url(../imgs/edge-Left.jpg) repeat-y left top; }
	#edge-right { background: url(../imgs/edge-Right.jpg) repeat-y right top; }
	#edge-bot { background: url(../imgs/edge-Bot.jpg) repeat-x left bottom; 	}
	#corner-topleft { background: url(../imgs/corner-TopLeft.jpg) no-repeat left top; }
	#corner-topright { background: url(../imgs/corner-TopRight.jpg) no-repeat right top; }
	#corner-botleft { background: url(../imgs/corner-BotLeft.jpg) no-repeat left bottom; }
	#corner-botright { background: url(../imgs/corner-BotRight.jpg) no-repeat right bottom; }
	/* ================================================================ 
								Content
	=================================================================== */
	#content-container {
		padding: 22px 22px 22px 22px;
	}
	#content {
		padding: 0px 10px 0px 10px;
	}
	#login {
		width: 630px;
		margin: 0px auto;
		overflow: hidden;
		padding: 220px 22px 22px 220px;
	}
	#login-container {
		padding: 22px 22px 22px 22px;
		text-align: center;
	}
		#login-container #logo {
			float: none;
		}
		#login-container h1{
			font-size: 14px;
			font-weight: bold;
			margin-bottom: 0px;
			padding: 0px 0px 5px 0px;
		}
		#login-container .input-text {
			margin-bottom: 15px;
			font-size: 14px;
			padding: 5px;
			height: 20px;
			width: 280px;
		}
		#login-container hr {
			background: #f8f5f5;
			height: 1px;
			border-collapse: collapse;
			border: 1px solid #f8f5f5;
			padding: 0px;
			margin: 0px 0px 10px 0px;
		}
		/* ================================================================ 
									Toolbar
		=================================================================== */
		.toolbar {
			position:relative; z-index:100;
			background: url(../imgs/toolbar-bg.jpg) repeat-x left top;
			display: block;
			height: 30px;
			border: 1px solid #edecec;
			border-radius: 5px;
			-moz-border-radius: 5px;
			-webkit-border-radius: 5px;
			-khtml-border-radius: 5px;
			margin-bottom: 20px;
		}
			.toolbar ul ul {
				width:162px;
			}
			.toolbar ul li {
				float:left;
				position:relative;
				background: url(../imgs/toolbar-bg.jpg) repeat-x left top;
				border-right: 1px solid #edecec;
				display: block;
				height: 30px;
				font-size: 12px
			}
				.toolbar ul li ul {
					background: #f0efef;
					border-right: 1px solid #dcdbdb;
					border-left: 1px solid #dcdbdb;
					border-bottom: 2px solid #a6a5a5;
				}
				.toolbar ul li ul li {
					float:left;
					position:relative;
					background: none;
					display: block;
					height: 30px;
					font-size: 12px
				}
			.toolbar ul li:hover {
				background-position: 0px -28px;	
			}
			/* style the links for the top level */
			.toolbar a, .toolbar a:visited {
				display: block;
				height: 30px;
				padding: 9px 15px 0px 15px;
				text-decoration: none;
				color: #595858;
			}
			.toolbar ul li span {
				background: url(../imgs/toolbar-bg.jpg) repeat-x left top;
				display: block;
				height: 21px;
				padding: 9px 15px 0px 15px;
				text-decoration: none;
				color: #595858;
				font-weight: bold;
			}
				.toolbar ul li span {
					background: none;
					display: block;
					height: 21px;
					padding: 9px 15px 0px 15px;
					text-decoration: none;
					color: #595858;
					font-weight: bold;
				}
				.toolbar ul li ul li span {
					display: block;
					padding: 2px;
				}
				.toolbar ul li ul li .dropcheck {
					width: 158px;
				}
			.toolbar ul .drop a {
				background: url(../imgs/drop-arrow.gif) no-repeat right 10px;
				padding-right: 30px;
			}
			.toolbar ul .drop ul li a {
				background:  none;
				padding-right: 0px;
			}
				.toolbar ul .on, .toolbar ul .on:visited {
					background-position: 0px -60px;
				}
				.toolbar ul .on:hover {
					background-position: 0px -60px;
				}
			.toolbar ul li:first-child {
					border-top-left-radius: 5px;
					-moz-border-radius-topleft: 5px;
					-webkit-border-top-left-radius: 5px;
					-khtml-border-top-left-radius: 5px;
					border-bottom-left-radius: 5px;
					-moz-border-radius-bottomleft: 5px;
					-webkit-border-bottom-left-radius: 5px;
					-khtml-border-bottom-left-radius: 5px;
			}
			.arrow-left a {
				background: url(../imgs/arrow-left.gif) no-repeat 25px 12px;
				display: block;
				height: 30px;
				width: 35px;
			}
			.arrowdouble-left a {
				background: url(../imgs/arrowdouble-left.gif) no-repeat 25px 12px;
				display: block;
				height: 30px;
				width: 35px;
			}
			.arrow-right a {
				background: url(../imgs/arrow-right.gif) no-repeat 25px 12px;
				display: block;
				height: 30px;
				width: 35px;
			}	
			.arrowdouble-right a {
				background: url(../imgs/arrowdouble-right.gif) no-repeat 25px 12px;
				display: block;
				height: 30px;
				width: 35px;
			}
			* html .toolbar a, * html .toolbar a:visited {width:150px; w\idth:138px;}
			.toolbar ul ul {visibility:hidden;position:absolute;top:31px;left:0;}
			* html .toolbar ul ul {top:30px;t\op:31px;}			
			.toolbar table {position:absolute; top:0; left:0; border-collapse:collapse;;}
			.toolbar ul ul a, .toolbar ul ul a:visited {display: block; background-image: none; width:128px;}
			* html .toolbar ul ul a, * html .toolbar ul ul a:visited {width:150px;w\idth:128px;}
			.toolbar ul li:hover ul,
			.toolbar ul a:hover ul{visibility:visible; }
			.toolbar ul :hover ul ul{visibility:hidden;}
			.toolbar ul :hover ul :hover ul{ visibility:visible;}
			.toolbar .on_campus, .toolbar .on_campus span {
				background: #b7daef;
				color: #147ab2;
			}	
			.toolbar .off_campus, .toolbar .off_campus span {
				background: #147ab2;
				color: #b7daef;
			}	
			.toolbar .time_off, .toolbar .time_off span {
				background: #edecec;
				color: #595858;
			}	
			.toolbar .lead_pastor {
			}
		#content h1, #side-bar h2 {
			border-bottom: 1px solid #dddddd;
			font-size: 12px;
			font-weight: bold;
			margin-bottom: 10px;
			padding: 0px 0px 5px 0px;
		}
		#content h2 {
			color: #1c7eb3;
			font-size: 10px;
			font-weight: bold;
		}
		#content p {
			padding-bottom: 15px;
		}
		table .title, #side-bar .title {
			color: #303339;
			display: block;
			font-weight: bold;
		}
		#content .date, #side-bar .date {
			color: #869098;
		}
		/* ================================================================ 
								Room Reservation/Check Columns
		=================================================================== */
		.columns .roomlist ul li a, .columns .roomlist ul li a:visited {
			border: 1px solid #e0e0e0;
			border-radius: 6px;
			-moz-border-radius: 6px;
			-webkit-border-radius: 6px;
			-khtml-border-radius: 6px;
			color: #2b88bb;
			display: block;
			margin-bottom: 2px;
			padding: 2px 2px 2px 5px;
			text-decoration: none;
		}
		.columns .roomlist ul li a:hover {
			background: #f0f5f8;
		}
		
		.columns .roomlist ul li.on a {
			background: #0371ac;
			border-color: #0371ac;
			color: #fff;
		}
		.columns .column1, .columns .column2, .columns .column3 {
			height: 430px;
			overflow: auto;
		}
		#room-reserve .column1 {
			border-bottom: 5px solid #ebf2f6;
			float: left;
			padding: 0px 10px 10px 0px;
			width: 110px;
		}
		#room-reserve .column2 {
			border-right: 5px solid #ebf2f6;
			border-left: 5px solid #ebf2f6;
			border-bottom: 5px solid #ebf2f6;
			float: left;
			padding: 0px 10px 10px 10px;
			width: 320px;
		}
		#room-reserve .column3 {
			border-bottom: 5px solid #ebf2f6;
			overflow: auto;
			padding: 0px 10px 10px 10px;
		}
			#room-reserve .column3 .bounding-box {
				min-width: 200px;
			}
			#room-reserve .column3 .overflow .bounding-box {
				width: 300px;
			}
			#room-reserve .column3:hover .overflow {
				background: #fff;
				padding-right: 10px;
				position: absolute;
			}
		#room-reserve .column3.title {
			padding: 0px 0px 0px 10px;
		}
			#room-reserve .column3 .constraint {
				width: 310px;
			}
			.columns .column3 ul {
				margin-top: 0px;
			}
			.columns .column3 ul li {
				overflow: hidden;
				padding: 1px 0px 1px 0px;
			}
			.columns .column3 ul li.on {
				background: #f9e4d1;
				border: 1px solid #f1ae3d;
			}
			.columns .column3 ul li.on span {
				display: block;
				float: left;
				padding: 5px;
			}
			.columns .column3 ul li .time {
				background: #dce6ec;
				font-weight: bold;
				width: 50px;
			}				
			.columns .column3 ul li.on .time {
				background: #f1ae3d;
				font-weight: bold;
				width: 50px;
			}
		#room-reserve .title  {
			height: 25px;
			border-bottom: 0px;
			margin-bottom: 0px;
			padding-bottom: 0px;
			overflow: hidden;
		}
		/* ================================================================ 
									Tables
		=================================================================== */
		#content table.table {
			margin-bottom: 25px;
			width: 100%;
		}
			#content table.table a, #content table.table a:visted {
				color: #53575a;
				text-decoration: underline;
			}
				#content table.table a:hover {
					color: #be3b08;
					text-decoration: none;
				}
				#content table.table .button a {
					text-decoration: none;
				}
			#content table.table th {
				color: #147ab2;
				font-size: 12px;
				font-weight: bold;
				text-align: center;
				border-bottom: 2px solid #b7daef;
				padding: 4px;
			}
			#content table.table td {
				padding: 7px;
			}
			/*
			#content table.table .rowa {
				background: #cde9f8 url(../imgs/tr-bg-a.jpg) repeat-x top left;
			}	
			#content table.table .rowb {
				background: #e6eaec url(../imgs/tr-bg-b.jpg) repeat-x top left;
			}
			#content table.table .rowa td, #content table.table .rowa.cell {
				border-left: 1px solid #c4ddf4;
				border-bottom: 1px solid #c4ddf4;
			}
			#content table.table .rowa .last,  #content table.table .rowa.last{
				border-right: 1px solid #c4ddf4;
			}
			#content table.table .rowb td,  #content table.table .rowb.cell {
				border-left: 1px solid #dddddd;
				border-bottom: 1px solid #dddddd;
			}
			#content table.table .rowb .last,  #content table.table .rowb.last {
				border-right: 1px solid #dddddd;
			}
			#content table.table .col1, #content table.table .col2, #content table.table .col3, #content table.table .col4, #content table.table .col5 {
				text-align: left;
			}
				#table-events .col5, #table-events_timeoff th.col5 {
					text-align: center;
				}
			*/
			#content table.table .icon-tray {
				width: 50px;
				margin: 0px auto;
			}
			#content table.table ul {
				padding-left: 20px;
			}
			#content table.table ul li {
				list-style: circle;
				padding-bottom: 10px;
			}
			#table-pending .col6 span, #table-events .col5 span, #table-events .col6 a, #table-events_timeoff .col5 span, #table-events_timeoff .col6 a {
				margin: 0px auto;
			}	
			#table-rooms td ul {
				padding-left: 0px;
			}
			#table-rooms td ul li {
				list-style: none;
				border-bottom: 1px solid #c4ddf4;
				margin-bottom: 3px;
				padding: 10px;
			}		
		/* ================================================================ 
									Forms
		=================================================================== */
		.form {
			background: #f0f5f8;
			border-top: 1px solid #dce6ec;
			border-left: 1px solid #dce6ec;
			border-right: 1px solid #dce6ec;
			margin-bottom: 15px;
			overflow: hidden;
		}
		.form.gray {
			background: #f6f8f9;
			border-top: 1px solid #e8eaeb;
			border-left: 1px solid #e8eaeb;
			border-right: 1px solid #e8eaeb;
		}
		.field-container {
			background: #f0f5f8;
			border-bottom: 1px solid #dce6ec;
			overflow: hidden;
		}
		.form.gray .field-container {
			background: #f6f8f9;
			border-bottom: 1px solid #e8eaeb;
		}
			.field-blank {
				display: block;
				float: left;
				margin: 1px;
				padding: 10px;
				width: 200px;
			}
			.field-name {
				display: block;
				background: #ebf2f6;
				float: left;
				margin: 1px;
				padding: 10px;
				width: 200px;
			}
			.form.gray .field-name {
				background: #edeeef;
			}
				.field-name .title, .field-blank .title {
					color: #0371ac;
					display: block;
					font-size: 12px;
					font-weight: bold;
					text-align: right;
				}
				.form.gray .title, .form.gray .field-blank .title {
					color: #5a5a5a;
				}
				.field-name .subtitle, .field-blank .subtitle {
					color: #869098;
					display: block;
					text-align: right;
				}
			.field-input {
				display: block;
				float: left;
				margin: 2px 2px 0px 0px;
				padding: 10px 10px 10px 10px;
			}
				.input-text {
					border: 2px solid #b7daef;
					border-collapse: collapse;
					font-size: 12px;
					font-weight: bold;
					height: 15px;
					letter-spacing: 1px;
					padding: 3px 2px 3px 2px;
					width: 296px;
				}
				.field-input textarea {
					border-collapse: collapse;
					border: 2px solid #b7daef;
					font-size: 12px;
					font-weight: bold;
					padding: 2px;
					width: 296px;
				}
				.field-input .title {
					display: block;
					font-size: 12px;
					font-weight: bold;
					margin-bottom: 10px;
				}
				.field-input p {
					max-width: 500px;
				}
		.bounding-box {
			background: #f1f4f6;
			border: 1px solid #dddddd;
			padding: 10px;
			margin: 10px 0px 15px 0px;
		}
			#content .bounding-box h1 {
				border-bottom: 10px;
			}
			#content .bounding-box select.repeating {
				clear: both;
			}
			#content .bounding-box h2 {
				color:#333333;
				font-size: 12px;
				margin-top: 15px;
			}
			#content .bounding-box h3 {
				color:#333333;
				font-size: 12px;
				font-weight: bold;
				margin-bottom: 5px;
				margin-top: 5px;
			}
			#content .bounding-box .date {
				margin-bottom: 15px;
			}
			#content .bounding-box hr {
				background: #dddddd;
				border: 0px;
				border-collapse: collapse;
				display: block;
				height: 1px;
				margin-top: 15px;
			}
			#content .bounding-box .button {
				margin-top: 15px;
			}
		.space {
			margin-bottom: 15px;
		}
		.form-compact {
			margin: 10px 0px 15px 0px;
		}
		.form hr {
			background: #dddddd;
			border: 0px solid #dddddd;
			border-collapse: collapse;
			display: block;
			height: 1px;
			padding: 0px;
			margin: 10px 0px 15px 0px;
		}
		/* ================================================================ 
									Calendar
		=================================================================== */
		#calendar-toolbar {
			margin-bottom: 5px;
		}
		#calendar {
			border-collapse: collapse;
		}
		#calendar th {
			height: 25px;
			width: 14%;
			vertical-align: middle;
		}
		#calendar td {
			height: 20%;
			margin: 2px;
			width: 14%;
		}
		#calendar .day-number a {
			color: #2b88bb;
			display: block;
			font-weight: bold;
			text-align: right;
			height: 15px;
			padding-bottom: 0px;
		}
		#calendar .day td {
			background: #e2edf9;
			border-left: 1px solid #c4ddf4;
			border-bottom: 1px solid #c4ddf4;
			height: 100px;
			vertical-align: top;
		}
		#calendar .last {
			border-right: 1px solid #d8e3ec;
		}
		#calendar .overlap .day-number a {
			color: #95a3ad;
		}
		#calendar .day .overlap {
			background: #d7dcdf;
			border-color: #bdc2c5;
		}
		#calendar .on .day-number a {
			color: #53575a;
		}
		#calendar .day .on {
			background: #fff;
		}
		#calendar .day .calendar-content a, #calendar .day .calendar-content a:visited {
			text-decoration: none;
		}
		#calendar .day .calendar-content a span {
			display: block;
			border-radius: 4px;
			-moz-border-radius: 4px;
			-webkit-border-radius: 4px;
			-khtml-border-radius: 4px;
			height: 15px;
			line-height: 16px;
			margin-bottom: 2px;
			overflow: hidden;
			padding: 2px 4px 2px 4px;
			text-decoration: none;
		}
		#calendar .day .on_campus span, #calendar .day .on_campus span:visited {
			background: #b7daef;
			color: #147ab2;
		}
		#calendar .day .off_campus span, #calendar .day .off_campus span:visited {
			background: #147ab2;
			color: #b7daef;
		}
		#calendar .time_off span, #calendar .time_off span:visited {
			background: #edecec;
			border: 1px solid #d8d7d7;
			color: #595858;
		}
			#calendar .day .calendar-content span:hover {
				background: #f2ae3c;
				color: #be3b08;
			}
		.hide_on_campus {
			display:none;
			padding: 0px;
			border: none;
			visibility:hidden;
		}
		.hide_off_campus {
			display:none;
			visibility:hidden;		
		}
		.hide_time_off {
			display:none;
			visibility:hidden;
		}
		.hide_other {
			display:none;
			visibility:hidden;
		}
		/* ================================================================ 
									Date Picker
		=================================================================== */
		/* This is a very basic stylesheet for the date-picker. Feel free to create your own. */

		/* Hide the input by using a className */
		input.fd-hidden-input,
		select.fd-hidden-input
				{
				display:none;
				}
		/* Screen reader class - hides it from the visual display */
		.fd-screen-reader
				{
				position:absolute;
				left:-999em;
				top:0;
				width:1px;
				height:1px;
				overflow:hidden; 
				outline: 0 none;
			-moz-outline: 0 none;
				} 
		/* Disabled datePicker and activation button */
		a.dp-disabled,
		.dp-disabled table
				{
				opacity:.3 !important;           
				filter:alpha(opacity=40);           
				}
		.dp-disabled,
		.dp-disabled td,
		.dp-disabled th,
		.dp-disabled th span
				{
				cursor:default !important;          
				}
		a.date-picker-control:focus,
		div.datePicker table td:focus 
				{
				overflow:hidden;
				outline:0 none;
			-moz-outline: 0 none;
			color:rgb(100,130,170) !important;
				}
		div.datePicker a {
			text-decoration: none;
			color: #53575a;
		}
		.roomsCal a {
			display: block;
			padding: 3px 2px 3px 2px;
		}
		/* The wrapper div */
		div.datePicker
				{
				position:absolute;        
				z-index:9999;
				text-align:center;
		
				/* Change the font-size to suit your design's CSS. The following line is for the demo that has a 12px font-size defined on the body tag */
				font:900 0.8em/1em Verdana, Sans-Serif;
		
				/* For Example: If using the YUI font CSS, uncomment the following line to get a 10px font-size within the datePicker */
				/* font:900 77%/77% Verdana, sans-serif; */
				
				/* Or, if you prefer a pixel precision */
				/* font:900 12px/12px Verdana, sans-serif; */
				
				background:transparent;
		
				/* Mozilla & Webkit extensions to stop text-selection. */
				-moz-user-select:none;
				-khtml-user-select:none;                 
				}  
		/* Styles for the static datePickers */
		div.static-datepicker
				{
				position:relative;        
				top:5px;
				left:0;
				}
		div.datePicker table
				{
				width:auto;
				height:auto;         
				} 
		/* Draggable datepickers */
		div.datePicker tfoot th.drag-enabled,
		div.datePicker thead th.drag-enabled,
		div.datePicker thead th.drag-enabled span
				{
				cursor:move;
				}
		/* The iframe hack to cover selectlists in Internet Explorer <= v6 */
		iframe.iehack
				{
				position:absolute;
				background:#fff;
				z-index:9998;
				padding:0;
				border:0;
				display:none;
				margin:0;
				}
		/* The "button" created beside each input for non-static datePickers */
		a.date-picker-control:link,
		a.date-picker-control:visited
				{
				position:relative;
				/* Moz & FF */
				display: -moz-inline-stack;
				border:0 none;
				padding:0;
				margin:0 0 0 4px;
				background: url(../imgs/icons.png) no-repeat;
				background-position: 0px -220px;
				height: 20px;
				width: 20px;
				line-height:1;
				cursor:pointer;
				visibility:visible;
				text-decoration:none;
				vertical-align:top;         
				}
		a.date-picker-control:hover,
		a.date-picker-control:active,
		a.date-picker-control:focus,
		a.dp-button-active:link,
		a.dp-button-active:visited,
		a.dp-button-active:hover,
		a.dp-button-active:active,
		a.dp-button-active:focus
				{
				background-position: 0px -240px;
				}
		/* Feed IE6 the following rule, IE7 should handle the min-width declared above */
		* html a.date-picker-control
				{
				width:16px;
				}
		/* IE, Safari & Opera. Seperate CSS rule seems to be required. */
		a.date-picker-control
				{
				display:inline-block;
				}
		a.date-picker-control span
				{
				display:block;
				width:16px;
				height:16px;
				margin:auto 0;
				}
		/* Default "button" styles */
		div.datePicker thead th span
				{
				display:block;
				padding:0;
				margin:0;
				text-align:center;
				line-height:1em;
				border:0 none;
				background:transparent;
				font-weight:bold;
				cursor:pointer;
				}
		/* The "month, year" display */
		div.datePicker th span.month-display,
		div.datePicker th span.year-display
				{
				display:inline;
				text-transform:uppercase;
				letter-spacing:1px;
				font:normal 1.2em Verdana, Sans-Serif;
				cursor:default;          
				}
		/* Next & Previous (month, year) buttons */
		div.datePicker th span.prev-but,
		div.datePicker th span.next-but
				{
				font-weight:lighter;
				font-size:2.4em;
				font-family: georgia, times new roman, palatino, times, bookman, serif;
				cursor:pointer !important;
				}
		/* Hover effect for Next & Previous (month, year) buttons */
		div.datePicker th span.prev-but:hover,
		div.datePicker th span.next-but:hover,
		div.datePicker th span.today-but:hover
				{
				color:#a84444;
				}
		/* Today button */
		div.datePicker th span.today-but
				{
				text-align:center;
				margin:0 auto;
				font:normal 1em Verdana, Sans-Serif;
				width:100%;
				text-decoration:none;
				padding-top:0.3em;
				text-transform:uppercase;
				vertical-align:middle;
				cursor:pointer !important          
				}
		/* Disabled buttons */ 
		div.dp-disabled th span.prev-but,
		div.dp-disabled th span.next-but,
		div.dp-disabled th span.today-but,
		div.dp-disabled th span.prev-but:hover,
		div.dp-disabled th span.next-but:hover,
		div.dp-disabled th span.today-but:hover,
		div.datePicker th span.prev-but.fd-disabled:hover,
		div.datePicker th span.next-but.fd-disabled:hover,
		div.datePicker thead th span.fd-disabled,
		div.datePicker th span.fd-disabled:hover
				{
				color:#aaa;
				cursor:default !important;         
				}   
		/* The mon, tue, wed etc day buttons */
		div.datePicker th span.fd-day-header
				{
				text-align:center;
				margin:0 auto;
				font:900 1em Verdana, Sans-Serif;
				text-decoration:none;
				text-transform:lowercase;
				cursor:pointer;          
				}
		/* The table */
		div.datePicker table
				{               
				margin:0;
				padding:0px;
				border:1px solid #ccc;        
				background:#fff url(../media/gradient-e5e5e5-ffffff.gif) repeat-x 0 -20px;
				text-align:center;
				border-spacing:1px;
				padding:0.3em; 
				width:auto;             
				empty-cells:show;               
				-moz-border-radius:0.8em;
				border-radius:0.8em;        
				}
		/* Common TD & TH styling */
		div.datePicker table td,
		div.datePicker table tbody th
				{                 
				border:0 none;
				padding:0;
				text-align:center;
				vertical-align:middle;               
				cursor:pointer;
				background:#fff url(../media/gradient-e5e5e5-ffffff.gif) repeat-x 0 -40px;
				width:2.4em;
				height:2.4em;   
				overflow:hidden;      
				outline:transparent none 0px;        
				border:1px solid #ccc;
				text-transform:none;         
				-moz-border-radius:2px;         
				border-radius:2px;
				}
		div.datePicker table td:focus,
		div.datePicker table td:active
				{
				outline:0 none red;
				}
		div.datePicker table th
				{
				border:0 none;
				padding:0;        
				font-weight:bold;
				color:#222;
				text-align:center;
				vertical-align:middle; 
				text-transform:none;        
				}
		div.datePicker table thead th
				{
				height:auto !important;
				}
		div.datePicker table tbody th
				{                          
				border:1px solid #dcdcdc;        
				}
		/* Week number display */
		div.datePicker table thead th.date-picker-week-header,
		div.datePicker table tbody th.date-picker-week-header
				{
				font-style:oblique;  
				background:transparent;
				cursor:default;         
				}
		div.datePicker table thead th.date-picker-week-header
				{
				cursor:help;
				border:0 none;
				padding:0 0 0.2em 0;
				}
		/* tfoot status bar */
		div.datePicker tfoot th
				{
				cursor:default;
				font-weight:normal;
				text-transform:uppercase;
				letter-spacing:0.1em;
				border:0 none;
				background:#fff;
				height:2.8em;
				}
		/* TD cell that is _not_ used to display a day of the month */
		div.datePicker table tbody td.date-picker-unused
				{
				background:#fff url(../media/backstripes.gif);
				border-color:#dcdcdc;          
				cursor:default !important;
				}
		
		/* The TH cell used to display the "month, year" title */
		div.datePicker table thead th.date-picker-title
				{
				width:auto;
				height:auto;
				padding:0.4em 0;
				}
		/* The "mon tue wed etc" day header styles */
		div.datePicker table thead th.date-picker-day-header
				{
				text-transform:lowercase;
				cursor:help;
				height:auto;
				}
		/* The "todays date" style */
		div.datePicker table tbody td.date-picker-today
				{
				background:#fff url(../media/bullet2.gif) no-repeat 0 0;
				color:rgb(100,100,100) !important;
				}
		
		div.datePicker table tbody td.month-out.date-picker-highlight 
				{
				color:#aa8866 !important;
				}
		/* The "highlight days" style */
		div.datePicker table tbody td.date-picker-highlight,
		div.datePicker table thead th.date-picker-highlight
				{
				color:#a86666 !important;
				}
		/* The "active cursor" style */
		div.datePicker table tbody td.date-picker-hover
				{
				background:#fff url(../media/bg_header.jpg) no-repeat 0 0;
				cursor:pointer;
				border-color:rgb(100,130,170) !important;
				color:rgb(100,130,170); 
				text-shadow: 0px 1px 1px #fff;                
				}
		/* The "disabled days" style */
		div.datePicker table tbody td.day-disabled
				{          
				background:#fff url(../media/backstripes.gif) no-repeat 0 0;
				color:#aaa !important;
				cursor:default;
				text-decoration:line-through;
				} 
		div.datePicker table tbody td.month-out 
				{
				border-color:#ddd;
				color:#aaa !important;
				background:#fff url(../media/gradient-e5e5e5-ffffff.gif) repeat-x 0 -40px;                             
				} 
		/* The "selected date" style */
		div.datePicker table tbody td.date-picker-selected-date
				{
				color:#333 !important;
				border-color:#333 !important;
				}
		/* The date "out of range" style */
		div.datePicker table tbody td.out-of-range,
		div.datePicker table tbody td.not-selectable
				{           
				color:#ccc !important;
				font-style:oblique;
				background:#fcfcfc !important;
				cursor:default !important;              
				} 
		/* Week number "out of range" && "month-out" styles */
		div.datePicker table tbody th.month-out,
		div.datePicker table tbody th.out-of-range
				{
				color:#aaa !important;
				font-style:oblique;
				background:#fcfcfc !important;          
				}
		/* week numbers "out of range" */
		div.datePicker table tbody th.out-of-range
				{
				opacity:0.6;
				filter:alpha(opacity=60);
				}  
		/* Used when the entire grid is full but the next/prev months dates cannot be selected */
		div.datePicker table tbody td.not-selectable
				{         
				opacity:0.8;
				filter:alpha(opacity=80);        
				}
		div.datePicker table tbody tr
				{
				display:table-row;
				}
		div.datePicker table tfoot sup
				{
				font-size:0.86em;
				letter-spacing:normal;
				text-transform:none;
				height: 0;
			line-height: 1;
			position: relative;
			top: -0.2em;	
			vertical-align: baseline !important;
			vertical-align: top;  
				}
		div.datePicker table thead th.date-picker-day-header,
		div.datePicker table thead span.month-display,
		div.datePicker table thead span.year-display
				{            
				text-shadow: 0px 1px 1px #fff;                            
				}
		/* You can add focus effects (for everything but IE6) like so: */
		div.datepicker-focus
				{
				/* Naughty, naughty - but we add a highlight using the table's border colour */
				outline:none;
				}
		div.datepicker-focus table.datePickerTable
				{
				border-color:#999 !important;         
				}
		div.datePicker table tbody tr td:focus 
				{
				overflow:hidden;
				outline:0 none;
			-moz-outline: 0 none;
			color:rgb(100,130,170) !important;	
				}
		/* INTERNET EXPLORER WOES
		   ======================
		   
		   Hover Effects
		   -------------
		   
		   IE cannot deal with :focus on the TR so the datePicker script adds the class "dp-row-highlight" to the
		   row currently being hovered over. This should enable you to add hover effects if desired.
		   
		   e.g. the following rule will highlight the cell borders in another colour when a row is moused over,
		   it looks like crap though so I didn't include the rule within the demo:
		   
		div.datePicker table tbody tr.dp-row-highlight td
				{
				border-color:#aaa;
				}
		*/
		
		/* Remove the images for Internet Explorer <= v6 using the "* html" hack  
		   This is a workaround for a nasty IE6 bug that never caches background images on dynamically created DOM nodes
		   which means that they are downloaded for every cell for every table - nasty! */    
		* html div.datePicker table td
				{
				background-image:none;
				}
		* html div.datePicker table td.date-picker-unused
				{
				background:#f2f2f2;
				}
		/* Chrome has problems with the -webkit-box-shadow and -webkit-border-radius styles together 
		   Remove one or the other to get things looking less ugly */       
		@media screen and (-webkit-min-device-pixel-ratio:0) {
				div.datePicker table
						{
						border-spacing:0.3em;
						/* Naughty, naughty */
						-webkit-box-shadow:0px 0px 5px #aaa;                 
						-webkit-border-radius:0.8em;                
						}          
				div.static-datepicker table
						{
						-webkit-box-shadow:0 0 0 transparent;
						}
				div.static-datepicker:focus table
						{
						-webkit-box-shadow:0px 0px 5px #aaa;
						}
				div.datePicker table td,
				div.datePicker table tbody th
						{
						padding:0.1em;
						-webkit-border-radius:2px;
						}
				div.datePicker table tbody td.date-picker-hover
						{                
						-webkit-box-shadow:0px 0px 1px rgb(100,130,170);
						}       
		}
		/* Untested webkit rules for fading out the disabled buttons - fingers crossed */
		@-webkit-keyframes fadeout {
				to {                           
						opacity: 0.4;                         
				}                 
				from {
						opacity: 1.0;
						color:#222;
				}
		}
		@media screen and (-webkit-min-device-pixel-ratio:0) {
				div.datePicker table thead th span.fd-disabled {                              
						-webkit-animation-name: fadeout;
						-webkit-animation-duration: 3s;
						-webkit-animation-timing-function: ease-in-out;
				}
		} 
		/* ================================================================ 
									Footer
		=================================================================== */
#footer {
	padding: 0px 90px 15px 90px;
}
	#login-footer {
		clear: both;
		margin: 0px auto;
		padding-left: 180px;
		width: 550px;
	}
	#copyright {
		padding: 0px 0px 0px 15px;
	}