html { height: 100%; }

body {
	background: url('background.jpg') center top no-repeat #4a8ac7;
	margin: 0 0 10px 0;
	font-family: Calibri, "Trebuchet MS", Verdana, Arial, sans-serif;
	font-size-adjust: 0.5; /* because Calibri has such a different width from other fonts */
	color: #272d34;

	margin: 0;
	/* min-height: 100%; */
	/* min-height: 610px; */
	min-height: 777px;
	height: auto !important;
	height: 100%;
	min-width: 988px;
}

@media print {
	body {
		background: white;
		color: black;
	}
}


a { color: #272d34; }

a:hover { color: black; }

img {
	display: block;
	border: none;
}

p img,
#documentation li img,
#pageContent.dialogBox li img {
	display: inline;
	vertical-align: middle;
	margin: -3px 0 -2px;
}

input,
button {
	font-family: Calibri, "Trebuchet MS", Verdana, Arial, sans-serif;
	font-size-adjust: 0.5; /* because Calibri has such a different width from other fonts */
	font-size: 14px;
}

strong { color: black; }

#page {
	min-width: 948px;
	/* margin: 0 60px; */
	position: relative;

	/* margin: 0 20px; */
	position: absolute;
	left: 20px;
	right: 20px;
	top: 0;
	bottom: 10px;
	/* min-height: 600px; */
	min-height: 767px;
}

	#header {
	}

		#logo {
			color: #203d85;
			font-weight: bold;
			font-style: italic;
			font-size: 14px;
			float: left;
			width: 405px;
			font-size-adjust: 0.5; /* because Calibri has such a different width from other fonts */
		}

			#logo img {
				float: left;
				margin: 0 10px;
			}

			#logo p {
				margin: 0;
				padding-top: 23px;
			}

		#headerButtons {
			padding: 0;
			margin: 15px 25px 0 0;
			list-style: none;
			color: #494a4c;
			font-weight: bold;
			font-size: 16px;
			font-size-adjust: 0.45; /* because Calibri has such a different width from other fonts */
			float: right;
		}

			#headerButtons li {
				float: left;
				margin: 0 4px;
				padding: 0;
			}

				#headerButtons li a {
					display: inline-block;
					height: 32px;
					color: #494a4c;
					text-decoration: none;
				}

					#headerButtons li a:hover { color: white; }

					#headerButtons li a span {
						height: 20px;
						padding: 6px 5px 6px 14px;
						background: url('headerButtonLeft.png') left top no-repeat;
						/* line-height: 31px; */
						display: -moz-inline-block; /* for Firefox 2 */
						display: inline-block;
					}

					#headerButtons li a img {
						display: inline;
						vertical-align: top;
						height: 32px;
					}


	#tabs {
		color: white;
		clear: both;
		padding: 0 3px;
		margin: 0;
		list-style: none;
		height: 0; /* for IE7 */
	}

		#tabs > li {
			display: block;
			float: left;
			color: #eee;
		}

			#tabs li.selected { color: #494a4c; }

			#tabs #customTourTab {
				float: right;
			}

			#tabs li div.tab,
			#tabs li div.tabEnd {
				float: left;
				height: 48px;
			}

				#tabs li div.tab {
					position: relative;
					padding-left: 14px;
					background: url('tabLeft.png') left top no-repeat;
					line-height: 48px;
					margin-left: -3px;
					font-weight: bold;
					font-size: 16px;
					font-size-adjust: 0.45; /* because Calibri has such a different width from other fonts */
				}

					#tabs li.selected div.tab { background-position: left -48px; }

					#tabs li div.tab img {
						display: inline;
						vertical-align: middle;
						margin-left: 5px;
					}

					#tabs li div.tab label {
						font-style: italic;
						font-size: 12px;
						font-weight: normal;
					}

					#tabs li#searchTab div.tab {
						line-height: 18px;
						padding-top: 6px;
						height: 42px;
						font-size: 14px;
						font-size-adjust: 0.5; /* because Calibri has such a different width from other fonts */
					}

						#tabs li#searchTab div.tab input {
							height: 12px;
							font-size: 12px;
							color: #494a4c;
							vertical-align: middle;
						}

						/*
						#tabs li#searchTab div.tab button {
							font-size: 12px;
							font-weight: bold;
							padding: 0;
							color: #494a4c;
							vertical-align: middle;
							line-height: 14px;
						}
						*/

						#tabs li#searchTab div.tab #clearSearch {
							color: #494a4c;
							display: none;
							height: 12px;
							width: 12px;
							margin-left: 5px;
							opacity: 0.8;
							filter: alpha(opacity=80);
							background-color: #eee;
							border: 2px outset #eee;
							text-align: center;
							vertical-align: middle;
							line-height: 10px;
							font-weight: bold;
							font-size: 10px;
							cursor: pointer;
						}

							#tabs li#searchTab div.tab #clearSearch.show {
								display: -moz-inline-block; /* for Firefox 2 */
								display: inline-block;
							}

					#tabs li#customTourTab div.tab {
						line-height: 18px;
						padding-top: 6px;
						height: 42px;
						font-size: 14px;
						font-size-adjust: 0.5; /* because Calibri has such a different width from other fonts */

						padding-right: 120px; /* for IE7 issue in #customTourTabLocationsDiv below */
					}

						#tabs li#customTourTab div.tab input {
							vertical-align: middle;
							margin: 0 5px 0 0;
							height: 13px;
						}

							#tabs li#customTourTab.selected div.tab input,
							#tabs li#customTourTab.selected div.tab label {
								visibility: hidden;
							}

						#tabs li#customTourTab div.tab #customTourTabLocationsDiv {
							/* float borked in IE7, so moved to absolute positioning */
							/*
							position: relative;
							float: right;
							*/

							position: absolute;
							top: 6px;
							right: 0;

							height: 40px;
							width: 120px;
							overflow: hidden;
							font-size: 11px;
							font-size-adjust: 0.45; /* because Calibri has such a different width from other fonts */
							font-weight: normal;
							line-height: 11px;
						}

							#tabs li#customTourTab div.tab #customTourTabLocationsDiv #listOverlay {
								position: absolute;
								left: 0;
								top: 0;
								width: 100%;
								height: 100%;
								background: url('customTourTabListOverlay.png') left top repeat-x transparent;
								z-index: 2;
								cursor: pointer;
							}

								#tabs li#customTourTab.selected div.tab #customTourTabLocationsDiv #listOverlay {
									background-image: url('customTourTabSelectedListOverlay.png');
								}

							#tabs li#customTourTab div.tab ul#customTourTabLocationsList {
								position: absolute;
								top: 0; /* reduce this value to scroll down */
								right: 0;
								bottom: 0;
								left: 15px;
								padding: 0;
								margin: 0;
								list-style: none;
								z-index: 1;
							}

								#tabs li#customTourTab div.tab ul#customTourTabLocationsList li {
									padding: 0;
									margin: 3px 0;
								}

									#tabs li#customTourTab div.tab ul#customTourTabLocationsList li.new { color: #ffd837; }

										#tabs li#customTourTab.selected div.tab ul#customTourTabLocationsList li.new { color: #d9b82f; }


				#tabs li div.tabEnd {
					position: relative; /* for IE7 */
					width: 14px;
					background: url('tabRight.png') left top no-repeat;
					margin-right: -3px;
				}

					#tabs li.selected div.tabEnd { background-position: left -48px; }

			#tabs li a {
				color: #eee;
				text-decoration: none;
			}

				#tabs li a:hover { text-decoration: underline; }

				#tabs li.selected a { color: #494a4c; }


	#mainPanelTop {
		background: url('shadowTop.png') left bottom repeat-x;
		height: 4px;
		margin: 0 4px;
		padding-top: 44px;
	}

	#mainPanelLeft {
		background: url('shadowLeft.png') left top repeat-y;
		padding-left: 4px;

		position: absolute;
		left: 0;
		top: 137px;
		right: 0;
		bottom: 4px;
	}

	#mainPanelRight {
		background: url('shadowRight.png') right top repeat-y;
		padding-right: 4px;
		height: 100%;
	}

	#mainPanel {
		background-color: #eee;
		color: #272d34;
		font-size: 14px;
		padding: 10px 0;

		position: absolute;
		top: 0;
		bottom: 0;
		left: 4px;
		right: 4px;
	}

		#mainPanel p {
			margin: 0 10px 12px;
		}

		#controlPanel {
			width: 238px;
			/* height: 552px; */
			overflow-y: auto;
			overflow-x: hidden;
			/* float: left; */
			color: #494a4c;

			position: absolute;
			top: 56px;
			left: 0;
			bottom: 80px;
		}

			#controlPanel input[type=checkbox] {
				vertical-align: middle;
				margin: 0 7px 2px 0;
				width: 13px;
				height: 13px;
			}

				#controlPanel input#checkAll {
					margin-left: 18px;
				}

			#controlPanel #accordion {
				background-color: #e8e8e8;
			}

			#controlPanel h3,
			#documentation h3.accordHeader {
				min-height: 25px;
				background: url('listHeaderBG.gif') left top repeat-x #eee;
				font-weight: bold;
				font-size: 15px;
				font-size-adjust: 0.46; /* because Calibri has such a different width from other fonts */
				margin: 0;
				padding: 0 10px;
				cursor: pointer;
				line-height: 23px;
				outline: none;
				border-top: 1px solid #fff;
				border-bottom: 1px solid #ddd;
			}

				#controlPanel h3:hover,
				#documentation h3.accordHeader h3:hover { color: black; }

				#controlPanel h3.accordHeaderEmpty {
					/* padding-left: 29px; */
				}

				#controlPanel h3.ui-state-active,
				.example-ui-state-active {
					color: #eee;
					background-image: url('listHeaderActiveBG.gif');
					border-top-color: #39a84a;
				}

				#controlPanel h3 img,
				#documentation h3.accordHeader img {
					vertical-align: middle;
					margin: 0 5px 0 0;
					display: inline;
					width: 16px;
					height: 19px;
				}

				#controlPanel h3 span.expand,
				#documentation h3.accordHeader span.expand {
					width: 11px;
					height: 10px;
					overflow: hidden; /* for IE6 */
					margin: 7px 7px 7px 0;
					background: url('expandButton.png') left no-repeat transparent;
					display: block;
					float: left;
					position: static;
				}

					#controlPanel h3 span.expand.closed,
					#documentation h3.accordHeader span.expand.closed { background-position: left top; }

					#controlPanel h3 span.expand.open,
					#documentation h3.accordHeader span.expand.open   { background-position: left -10px; }

					#controlPanel h3 span.expand.empty,
					#documentation h3.accordHeader span.expand.empty  { background-position: left -20px; }


			#controlPanel ul li.odd { background-color: #e2e2e2; }
			#controlPanel ul li.even  { background-color: #f3f3f3; }

			#controlPanel ul li img.tour {
				float: right;
				margin-left: 5px;
				cursor: pointer;
			}

			#controlPanel ul img, ul.dropDownMenu img {
				vertical-align: middle;
				margin: 0 5px 0 0;
				display: inline;
				width: 16px;
				height: 19px;
			}

			#controlPanel ul li:hover { color: black; }

			ul.subCats,
			ul.tourList,
			ul.toolList,
			ul.searchResults {
				color: #485360;
				font-size: 12px;
				margin: 0;
				padding: 0;
				list-style: none;
			}

				ul.toolList {
					padding: 10px 0;
					background-color: #e8e8e8;
				}

				ul.subCats li {
					margin: 3px 0;
					padding: 1px 10px 1px 49px;
					zoom: 1; /* for IE7 */
				}

					ul.subCats ul.subCats {
						padding: 0 0 0 21px;
					}

						ul.subCats ul.subCats li {
							padding-left: 0px;
						}

				ul.subCats label {
					cursor: pointer;
				}

				ul.tourList li {
					margin: 0;
					padding: 4px 10px 4px 27px;
				}

					ul.tourList li span,
					ul.tourList li label {
						cursor: pointer;
					}

				ul.searchResults li {
					margin: 0;
					padding: 4px 10px 4px 10px;
				}

					ul.searchResults li span,
					ul.searchResults li label {
						cursor: pointer;
					}

				ul.toolList li {
					margin: 0;
					padding: 0 10px 0 10px;
					cursor: pointer;
					position: relative;
				}

					#accordion ul.toolList > li { padding: 0 10px 0 27px; }

					ul.toolList li ul.dropDownMenu { display: none; }
					ul.toolList li:hover ul.dropDownMenu { display: block; }

					ul.dropDownMenu {
						color: #485360;
						background-color: #cfcfcf;
						font-size: 12px;
						margin: 0;
						padding: 0;
						list-style: none;
						border-right: 1px solid #999;
						border-bottom: 1px solid #999;
						position: absolute;
						top: 0;
						left: 51px;
					}

						#accordion ul.dropDownMenu { left: 27px; }

						ul.dropDownMenu li {
							margin: 0 0 0 16px;
							padding: 2px 10px 2px 5px;
							background-color: #eee;
							cursor: pointer;
						}

							ul.dropDownMenu li:hover {
								background-color: #dbdbdb;
							}

							ul.dropDownMenu li.header {
								margin-left: 0;
								padding: 0 10px 0 0;
								cursor: default;
							}

								ul.dropDownMenu li.header:hover {
									background-color: #eee;
									color: #272d34;
								}


		#map_canvas {
			/* border: 1px solid #272d34; */
			border: 1px solid #888;
			/* min-width: 690px; */

			/* height: 550px; */
			/* margin: 0 10px 0 238px; */

			position: absolute;
			top: 56px;
			bottom: 80px;
			left: 238px;
			right: 10px;

		}

			div.infowindow {
				background-color: white;
				width: 350px;
				padding: 5px 10px;
				font-size: 14px;
				overflow:hidden;
			}

				div.infowindow div.markerIcons {
					float: right;
					margin: 5px 0 5px 10px;
				}

					div.infowindow div.markerIcons img {
						float: left;
					}

				div.infowindow h3 {
					margin: 0;
					font-size: 16px;
					font-size-adjust: 0.45em;
				}

				div.infowindow h4 {
					margin: 0;
					font-size: 14px;
					font-size-adjust: 0.5em;
				}

				div.infowindow div.details {
					/* height: 200px; */
					height: 194px; /* something changed post-launch (in the Maps API?), and 200px was causing nested scrollbars */
					overflow-y: auto;
					margin: 7px 0;
					clear: right;
				}

				div.infowindow span.postalCode,
				div.infowindow span.telephone {
					white-space: nowrap;
				}

				div.infowindow ul.buttonBar {
					font-size: 12px;
					font-size-adjust: 0.5em;
					list-style: none;
					margin: 0 -12px 0 0;
					padding: 0;
					height: 19px;
				}

					div.infowindow ul.buttonBar > li {
						cursor: pointer;
						position: relative;
						margin: 0 12px 0 0;
						padding: 0;
						float: left;
					}

					div.infowindow ul.buttonBar img {
						display: inline;
						height: 19px;
						margin: 0 5px 0 0;
						vertical-align: middle;
						width: 16px;
					}

					div.infowindow ul.buttonBar li ul.dropDownMenu { display: none; }
					div.infowindow ul.buttonBar li:hover ul.dropDownMenu { display: block; }

					div.infowindow ul.dropDownMenu { left: 0; width: 200px; }

				#mainPanel div.infowindow p {
					margin: 0 0 12px 0;
				}

				#mainPanel div.infowindow p.source {
					font-size: 10px;
					font-style: italic;
					margin-top: -8px;
					margin-right: 5px;
					text-align: right;
				}

				div.infowindow div.poiMedia {
					width: 150px;
					float: left;
					margin: 0 10px 10px 0;
				}

					div.infowindow div.poiMedia img.photo {
						width: 150px;
					}

					div.infowindow div.poiMedia div.audioPlayer {
						height: 24px;
						line-height: 24px;
						background: url("listHeaderBG.gif") repeat-x #eee;
						text-align: center;
						cursor: pointer;
					}

						div.infowindow div.poiMedia div.audioPlayer img {
							display: inline;
							vertical-align: middle;
							margin-right: 5px;
						}


		#pageContent {
			position: absolute;
			bottom: 80px;
			top: 57px;
			left: 10px;
			right: 10px;
			overflow: auto;
		}

			#mainPanel #pageContent p {
				margin: 0 0 12px;
			}

			#pageTitle {
				margin: 5px 10px 15px;
				text-align: center;
			}

			#pageContent h1 {
				margin: 15px 0;
			}

			#pageTitle,
			#pageContent h1 {
				font-size: 28px;
				font-weight: bold;
			}

			#pageContent img.blockCenter,
			#pageContent img.blockLeft,
			#pageContent img.blockRight {
				margin: 7px 0;
			}

			#pageContent img.floatLeft {
				margin: 0 10px 7px 0;
			}

			#pageContent img.floatRight {
				margin: 0 0 7px 10px;
			}

			#pageContent img.inline {
				margin: 0 10px;
			}



		#partners {
			padding: 10px 30px 0;
			text-align: center;

			position: absolute;
			bottom: 10px;
			left: 0;
			right: 0;
		}

			#partners div.logos {
				display: inline;
				vertical-align: top;
			}

			#partners img {
				display: inline;
				vertical-align: middle;
				margin-left: 25px;
			}

	#mainPanelBottom {
		background: url('shadowBottom.png') left top repeat-x;
		height: 4px;
		margin: 0 4px;
		position: absolute;
		bottom: 0;
		left: 0;
		right: 0;
	}

		#mainPanelBottomLeft,
		#mainPanelBottomRight {
			position: absolute;
			top: 0;
			width: 4px;
			height: 4px;
		}

		#mainPanelBottomLeft {
			left: -4px;
			background: url('shadowBottomLeft.png') left top no-repeat;
		}

		#mainPanelBottomRight {
			right: -4px;
			background: url('shadowBottomRight.png') left top no-repeat;
		}

	div.mapControlDiv {
		padding: 0 5px 5px 5px;
	}

		div.mapControl {
			/*
			background: white;
			border-style: solid;
			border-width: 1px;
			border-color: black;
			*/
			text-align: center;
		}

			div.mapControlInterior {
				font-family: Arial,sans-serif;
				font-size: 12px;
				color: black;
				cursor: pointer;
				/*
				border-style: solid;
				border-width: 1px;
				border-color: #d0d0d0 #707070 #707070 #d0d0d0;
				padding: 0 4px;
				*/
				/* changed to match Google Maps API update */
				background: #fefefe;
				background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#FEFEFE), to(#F3F3F3));
				background: -moz-linear-gradient(center top , #fefefe, #f3f3f3) repeat scroll 0 0 transparent;
				filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#FEFEFE", endColorstr="#F3F3F3");
				border: 1px solid #A9BBDF;
				border-radius: 0 2px 2px 0;
				box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.35);
				line-height: 160%;
				padding: 0 6px;
			}

				div.mapControlInterior:hover {
					border: 1px solid #678ac7;
				}

#itineraryHeader {
	border-bottom: 1px solid #494a4c;
	margin: 0 20px;
	padding-bottom: 20px;
}

	#itineraryHeader #logo {
		white-space: nowrap;
		width: auto;
	}

	#itineraryHeader h2 {
		margin: 0 20px 0;
		padding-top: 20px;
		font-size: 24px;
		text-align: right;
	}

div.itineraryPOI {
	background-color: white;
	margin: 0 20px;
	padding: 5px 10px;
	font-size: 14px;
	border-bottom: 1px solid #494a4c;
}

	div.itineraryPOI div.markerIcons {
		float: right;
		margin: 5px 0 5px 10px;
	}

		div.itineraryPOI div.markerIcons img {
			float: left;
		}

	div.itineraryPOI h3 {
		margin: 0;
		font-size: 16px;
		font-size-adjust: 0.45em;
	}

	div.itineraryPOI h4 {
		margin: 0;
		font-size: 14px;
		font-size-adjust: 0.5em;
	}

	div.itineraryPOI div.details {
		margin: 7px 0;
	}

	div.itineraryPOI span.postalCode,
	div.itineraryPOI span.telephone {
		white-space: nowrap;
	}

	div.itineraryPOI p {
		margin: 0 0 12px 0;
	}

	div.itineraryPOI img.photo {
		width: 150px;
		float: left;
		margin: 0 10px 10px 0;
	}

#GarminActiveXControl { /* for IE */
	position: absolute;
	top: 0;
	left: 0;
}

.hideEmail {
	display:none;
}

#documentation {
	position: absolute;
	z-index: 100;
	left: 328px;
	right: 100px;
	top: 80px;
	bottom: 104px;
	background-color: #f9f9f9;
	display: none;
}

	body.mobile #documentation {
		left: 20px;
		right: 20px;
		bottom: auto;
		top: 50px;
	}

	#documentation .closeWindow {
		display: block;
		position: absolute;
		top: 5px;
		right: 22px;
		background: url("iw_close.gif") top left no-repeat;
		width: 12px;
		height: 12px;
		z-index: 2;
		cursor: pointer;
	}

		body.mobile #documentation .closeWindow {
			right: 5px;
		}

	#documentation .scrollWrapper {
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		overflow: auto;
	}

	#documentation h3,
	#documentation h4 {
		margin: 15px 10px;
	}

	#documentation ul {
		margin: 0;
		padding: 0 10px 0 40px;
	}

		#documentation ul.ui-accordion-content {
			background-color: #eee;
			padding: 5px 10px 5px 40px;
		}

		#documentation ul li {
			margin: 5px 0;
		}


	#documentation p {
		margin: 0 10px 12px;
	}

div.exampleImage {
	text-align: center;
	margin: 5px 25px 10px;
	background-color: #e2e2e2;
	padding: 5px;
}

	div.exampleImage img {
		display: inline;
	}

	div.exampleImage div.markerExample {
		float: left;
		width: 200px;
	}

		body.mobile div.exampleImage div.markerExample { font-size: 12px; }

		#documentation li div.exampleImage div.markerExample img {
			margin: 5px;
		}

span.menuExample {
	background-color: #e8e8e8;
	color: #485360;
	padding: 0 2px;
	border: 1px solid #ddd;
}

	span.menuExample img {
		vertical-align: middle;
		margin: -2px auto auto !important;
	}

.example-ui-state-active {
	padding: 0 2px;
	font-weight: bold;
}