@import url(reset.css);

body {
	color: #333;
	font-family: Georgia, Times, serif;
	background: url(../media/header-background.png) repeat-x;
	}

a {
	color: #4f0048;
	}

ul, ol {
	list-style-type: none;
	}

.thumbs a img {
	margin-bottom: -3px;
	}

/* Header */

#header {
	position: relative;
	width: 950px;
	height: 180px;
	margin: 0 auto 0 auto;
	z-index: 31;
	}

	h1 {
		position: absolute;
		top: 40px;
		left: -14px;
		width: 136px;
		height: 250px;
		text-indent: -9999px;
		z-index: 30;
		background: url(../media/distinctive-catering.gif) bottom left no-repeat;
		}

		h1 a {
			display: block;
			width: 136px;
			height: 136px;
			background: url(../media/logo.png) no-repeat;
			}

	#navigation {
		position: absolute;
		top: 0;
		right: 0;
		height: 36px;
		font-size: 14px;
		}

		#navigation li {
			float: left;
			height: 36px;
			border-right: 1px solid #590058;
			}

			li#home {
				border-right: none;
				}

			#navigation a {
				display: block;
				float: left; /* Add for IE6 to display buttons in-line */
				color: #fff;
				height: 25px;
				padding: 10px 12px 1px 12px; /* padding-bottom of 1px added; IE cuts of bottom half of text without this */
				text-decoration: none;
				}

				#navigation a:hover,
				#about-page li#about a,
				#weddings-page li#weddings a,
				#corporate-page li#corporate a,
				#social-page li#social a,
				#gallery-page li#gallery a,
				#menus-page li#menus a,
				#venues-page li#venues a,
				#pricing-page li#pricing a,
				#contact-page li#contact a {
					background: url(../media/navigation-hover.png) bottom left repeat-x;
					}

			#navigation #menus { position: relative; }

			#navigation #menus a.holiday-menu {
				position: absolute;
				top: 35px;
				left: 0;
				width: 140px;
				height: 20px;
				margin: 0;
				padding: 0;
				background-image: none;
				background-color: green;
				text-indent: -9999px;
				outline: none;
				background: url(/media/holiday-menu.png) top left no-repeat;
				}

			#navigation #menus a.holiday-menu:hover {
				background-position: bottom left;
				}

		#promotion {
			position: absolute;
			top: 36px;
			right: 0px;
			text-indent: -9999px;
			z-index: 50;
			}
	
			#promotion a {
				display: block;
				width: 215px;
				height: 154px;
				background-image: url(/media/promotions/holiday-promotion.png);
				}

/* Body */

#body {
	position: relative;
	width: 950px;
	margin: 0 auto 0 auto;
	}

	#promotional-video {
		position: absolute;
		top: -75px;
		left: 224px;
		width: 560px;
		height: 353px;
		background: #fff;
		border: 1px solid #000;
		z-index: 1000;
		}

	.home #promotional-video {
		top: 115px;
		left: 50%;
		margin-left: -280px;
		}

		#promotional-video p {
			position: absolute;
			top: -25px;
			right: 7px;
			display: block;
			width: 30px;
			height: 30px;
			margin: 0;
			padding: 0;
			z-index: 200;
			text-transform: uppercase;
			font-size: 12px;
			}

		* html #promotional-video p {
			top: -25px;
			right: 0;
			text-indent: 0;
			text-transform: uppercase;
			font-size: 12px;
			}

			#promotional-video p a {
				position: relative;
				z-index: 300;
				display: block;
				color: #9d6c8c;
				width: 30px;
				height: 30px;
				text-decoration: none;
				}

			* html #promotional-video p a {
				color: #9d6c8c;
				background: none;
				text-decoration: none;
				}

				#promotional-video p a:hover {
					color: #fff;
					text-decoration: underline;
					}

	#gallery-panel {
		position: relative;
		width: 950px;
		height: 300px;
		margin: 0 0 20px 0;
		}

	#gallery-page #gallery-panel {
		height: 340px;
		}

		img#food {
			position: absolute;
			bottom: 80px;
			left: 0;
			width: 950px;
			z-index: 0;
			}

		#gallery-panel blockquote {
			position: absolute;
			bottom: 0;
			left: 0;
			width: 950px;
			height: 37px; /* Total height equals 80px (height + padding-top + padding-bottom + border-top + border-bottom) */
			margin: 0;
			padding: 25px 0 10px 0; /* padding-bottom of 10px added; IE cuts of bottom half of text without this */
			font-size: 32px;
			text-align: center;
			font-style: normal;
			font-weight: 100;
			border-top: 4px double #c7c7c7;
			border-bottom: 4px double #c7c7c7;
			}

		#gallery-panel p {
			position: absolute;
			bottom: 89px;
			right: 0;
			padding: 0 0 1px 0; /* padding-bottom of 10px added; IE cuts of bottom half of text without this */
			color: #ccc;
			font-size: 16px;
			text-align: right;
			}

			#gallery-panel p:hover {
				color: #590058;
				}

			#gallery-panel p a {
				color: #ccc;
				text-decoration: none;
				}

			#gallery-panel p a:hover {
				color: #590058;
				text-decoration: underline;
				}

	#highlights-panel {
		width: 900px;
		min-height: 260px;
		margin: 0 auto 75px auto;
		}

		.highlight {
			position: relative;
			width: 184px;
			height: 175px;
			padding: 0 20px 0 20px;
			float: left;
			border-right: 1px solid #c7c7c7;
			}

		.thumbnail {
			position: relative;
			float: left;
			width: 80px;
			height: 80px;
			padding: 10px;
			}

			.thumbnail.ninth {
				border-right: none;
				}

			.thumbnail img {
				width: 80px;
				height: 80px;
				}

		.highlight#the-educated-sandwich {
			width: 185px;
			border-right: none;
			}

			.highlight h3 {
				font-size: 24px;
				font-weight: 100;
				padding: 0 0 19px 0;
				}

			.highlight#the-educated-sandwich h3 {
				display: block;
				width: 185px;
				height: 142px;
				text-indent: -9999px;
				background: url(../media/the-educated-sandwich.png) no-repeat;
				}

			.highlight p {
				font-size: 14px;
				line-height: 21px;
				}

				.highlight#the-educated-sandwich p {
					position: absolute;
					width: 100px;
					top: 30px;
					left: 100px;
					}


/* Left Column */

	#left-column {
		width: 200px;
		float: left;
		display: inline; /* Makes IE6 use floats properly for columns */
		margin: 0 0 75px 25px;
		_margin: 0 0 75px 20px; /* Boooo to IE6 */
		color: #ccc;
		background: #fff;
		}

		#left-column h2 {
			margin: 0 0 14px 0;
			font-size: 32px;
			font-weight: 100;
			color: #590058;
			}

		#page-detail {
			font-size: 14px;
			line-height: 19px;
			}

		#left-column h3 {
			margin: 38px 0 14px 0;
			font-size: 16px;
			font-weight: 100;
			color: #590058;
			font-style: italic;
			}

		blockquote {
			font-size: 14px;
			line-height: 19px;
			font-style: italic;
			color: #333;
			}

		#left-column #newsletter {
			width: 200px;
			height: 75px;
			margin: 19px 0 19px 0;
			background: #e1d8e5;
			-webkit-border-radius: 5px;
			-moz-border-radius: 5px;
			display: none; /* Add in form */
			}

		#left-column .holiday-menu { margin-top: 20px; }

		#twitter {
			width: 200px;
			height: 75px;
			margin: 19px 0 38px 0; /* 19px top margin added. Once newsletter back on, set back to 0 */
			text-indent: -9999px;
			}

			#twitter a {
				display: block;
				width: 200px;
				height: 75px;
				background: url(../media/twitter.png) no-repeat;
				-webkit-border-radius: 5px;
				-moz-border-radius: 5px;
				}

		#planner {
			width: 200px;
			height: 75px;
			margin: 19px 0 19px 0;
			text-indent: -9999px;
			}

			#weddings-page #planner a {
				display: block;
				width: 200px;
				height: 75px;
				background: url(../media/wedding-planner.png) no-repeat;
				}

			#corporate-page #planner a {
				display: block;
				width: 200px;
				height: 75px;
				background: url(../media/corporate-planner.png) no-repeat;
				}

			#social-page #planner a {
				display: block;
				width: 200px;
				height: 75px;
				background: url(../media/social-planner.png) no-repeat;
				}

		#home-page #twitter {
			position: absolute;
			margin: 0 0 38px 0;
			top: -58px;
			right: 0;
			width: 236px;
			height: 58px;
			}

			#home-page #twitter a {
				width: 236px;
				height: 58px;
				background: url(../media/bird.png) no-repeat;
				-webkit-border-radius: 0;
				-moz-border-radius: 0;
				}

			#mailing-address {
				color: #333;
				font-size: 14px;
				line-height: 19px;
				}

/* Right Column */

	#right-column {
		width: 650px;
		margin: 0 25px 75px 50px;
		float: left;
		display: inline; /* Makes IE6 use floats properly for columns */
		background: #fff;
		}

		#promotional-photos { margin-bottom: 25px; }

			#promotional-photos img { margin-right: 10px; }

		#right-column p, #right-column ul {
			padding: 0 0 24px 0;
			font-size: 16px;
			line-height: 24px;
			}

		#right-column dl {
			padding: 0 0 24px 0;
			}

		#right-column h3 {
			padding: 0 0 24px 0;
			font-size: 16px;
			line-height: 24px;
			font-weight: 100;
			font-style: italic;
			}

		body#menus-page #right-column h3 {
			font-style: normal;
			letter-spacing: 1px;
			text-transform: uppercase;
			color: #590058;
			text-align: left;
			background: url(../media/menu-category-background.png) 0 11px repeat-x;
			}

			body#menus-page #right-column h3 .menu-category {
				background: #fff;
				padding: 0 3px 0 0;
				}

			body#menus-page #right-column p.note {
				font-style: italic;
				}

		body#menus-page #right-column h4 {
			padding: 0 0 24px 0;
			font-size: 14px;
			line-height: 24px;
			font-weight: 100;
			text-transform: uppercase;
			text-decoration: underline;
			text-align: left;
			}

		.menu-item {
			font-size: 14px;
			letter-spacing: 1px;
			text-transform: uppercase;
			}

			em.new {
				font-size: 14px;
				padding: 0 1px 0 1px;
				background: #e1d8e5;
				}

	#about-page #right-column li {
		display: inline-block;
		width: 323px;
		}

		#right-column a {
			color: #333;
			text-decoration: none;
			border-bottom: 1px dotted #999;
			}

			#right-column a:hover {
				color: #590058;
				border-bottom: 1px solid #590058;
				}

		#about-page ul#distinctive-events li {
			width: 214px;
			}

		#corporate-page #right-column li, #social-page #right-column li {
			display: inline-block;
			width: 214px;
			}

		.venues {
			float: left;
			width: 214px;
			}
			
			.venues li { font-size:12px; }

			.venues a {
				color: #333;
				text-decoration: none;
				}

				.venues a:hover {
					color: #590058;
					text-decoration: underline;
					}

			#right-column .venues h3 {
				padding: 0 0 16px 0;
				font-size: 16px;
				line-height: 24px;
				font-weight: 100;
				font-style: normal;
				text-transform: uppercase;
				}

			.venues h4 {
				padding: 0 0 16px 0;
				font-size: 16px;
				line-height: 24px;
				font-weight: 100;
				font-style: italic;
				color: #b3b3b3;
				}

	form label {
		padding: 0 0 5px 0;
		}

		body#home-page form label {
			font-size: 14px;
			padding: 10px 0 10px 0;
			}

	form input {
		margin: 0 0 25px 0;
		}

		body#home-page form input {
			margin: 0 0 10px 0;
			}

	form label, form input {
		display: block;
		}

		form input.text {
			width: 425px;
			padding: 5px;
			}

		body#home-page form input.text {
			width: 160px;
			padding: 3px;
			}

		textarea {
			width: 425px;
			padding: 5px;
			}

		.required {
			color: #b3b3b3;
			font-style: italic;
			}

		input.submit {
			margin: 20px 0 0 0;
			}

		body#home-page input.submit {
			}

/* Footer */

#footer {
	width: 100%;
	margin: 0;
	clear: both;
	color: #fff;
	font-weight: 100;
	background: url(../media/footer-background.png) repeat-x;
	font-size: 12px;
	}

	#footer ul {
		position: relative;
		width: 950px;
		height: 40px;
		margin: 0 auto 0 auto;
		}

		#mbp {
			position: absolute;
			top: 9px;
			left: 0;
			width: 25px;
			height: 25px;
			text-indent: -9999px;
			}

			#mbp a {
				display: block;
				width: 25px;
				height: 25px;
				background: url(../media/mbp.png) no-repeat;
				}

		#twitter {}

		#copyright {
			position: absolute;
			bottom: 11px;
			right: 0;
			padding: 0 0 1px 0; /* padding-bottom of 1px added; IE cuts of bottom half of text without this */
			text-align: right;
			}

		.stay-connected { margin-top: 20px; }

			.stay-connected dt {
				display: block;
				margin-bottom: 7px;
				font-size: 14px;
				font-style: italic;
				}

			.stay-connected dd {
				float: left;
				margin-right: 10px;
				text-indent: -9999px;
				}

				.stay-connected dd a {
					display: block;
					width: 32px;
					height: 32px;
					background: url(/media/stay-connected.png);
					}

				.stay-connected .facebook a { background-position: -32px 0; }

				.stay-connected .youtube a { background-position: -64px 0; }

				.stay-connected dd a:hover { opacity: 0.85; }

/* Menu */

body#menus-page dd {
	font-size: 12px;
	font-style: italic;
	padding-bottom: 12px;
	}

/* Page Navigation Tabs */

#page-navigation {
	text-transform: uppercase;
	}

	#page-navigation li {
		display: inline;
		padding: 0 10px 0 0;
		}

.ui-tabs {
	zoom: 1;
	}

.ui-tabs .ui-tabs-nav {
	}

.ui-tabs .ui-tabs-nav li {
	}

.ui-tabs .ui-tabs-nav li a {
	color: #999 !important;
	text-decoration: none;
	}

.ui-tabs .ui-tabs-nav li a:hover {
	text-decoration: underline;
	}

.ui-tabs .ui-tabs-nav li.ui-tabs-selected {
	}

.ui-tabs .ui-tabs-nav li.ui-tabs-selected a,
.ui-tabs .ui-tabs-nav li.ui-state-disabled a,
.ui-tabs .ui-tabs-nav li.ui-state-processing a {
	cursor: text;
	color: #590058 !important;
	text-decoration: none;
	border-bottom: 1px solid #590058 !important;
	}

.ui-tabs .ui-tabs-nav li a,
.ui-tabs.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-selected a {
	cursor: pointer;
	}

.ui-tabs .ui-tabs-panel {
	}

.ui-tabs .ui-tabs-hide {
	display: none !important;
	}

.more-photos {
	position: absolute;
	width: 250px;
	bottom: 19px;
	*bottom: 23px;
	right: -55px;
	}

	* html .more-photos {
		bottom: 23px;
		}

/* Twitter Feed Update */

.twtr-widget p {
	font-family: Georgia, Times, serif !important;
	font-size: 14px;
	}

.twtr-hd,
.twtr-ft { display: none; }

.twtr-bd { padding: 0 0; !important}

.twtr-tweet-wrap { padding: 6px 0 !important; }

#tweet-id-2 .twtr-tweet-wrap { padding: 0 0 6px 0 !important; }

.twtr-ft div { padding: 10px 0 0 0 !important; }


/* Conditional Items for Forms */

span.onstate-known-event-location,
span.onstate-possible-event-location {
	display: block;
	margin: 25px 0 0 0;
	}

span.onstate-known-event-location label,
span.onstate-possible-event-location label {
	clear: both;
	display: block;
	}

.offstate-known-event-location,
.offstate-possible-event-location { display: none; }

.radio {
	display: block;
	clear: both;
	overflow: hidden;
	}

.radio input,
.radio label {
	float: left;
	display: inline;
	}

.radio input {
	position: relative;
	top: 2px;
	left: 2px;
	margin: 0 10px 0 0;
	}

.message {
	clear: both;
	display: block;
	margin: 25px 0 0 0;
	height: auto;
	}

* html .message {
	margin: 0 0 0 0;
	}

* html .message label {
	margin-top: 25px;
	}

* html label.event-location {
	margin: 25px 0 0 0;
	}

* html .radio.unknown-event-location label {
	margin: 0 0 10px 0;
	}
