/*** headings ***/
	tr .heading, tr.headings td, .exampleSectionHeading {
		color:#fff;
		background:#000 url(../images/button-bg.gif) left top repeat-x;
		text-align:center;
		border:1px solid #444;
	}
	.exampleSectionHeading {
		font-size:11px;
		padding:2px 0;
		letter-spacing:3px;
		margin:10px 0;
		text-transform:uppercase;
	}
	.fancyHeading {
		color:#000;
		background:#adbebf url(../images/Brushedmetal-Final.jpg) repeat-x left top;
		font-size:12px;
		text-align:center;
		letter-spacing:3px;
		text-transform:uppercase;
		padding:8px 12px;
		text-shadow:1px 1px 1px #fff, 1px 0 1px #fff;
		border-left:1px solid #fff;
		border-top:1px solid #666;
		border-right:1px solid #000;
		border-radius-topleft:10px;
		-moz-border-radius-topleft:10px;
		-webkit-border-radius-topleft:10px;
		border-radius-topright:10px;
		-moz-border-radius-topright:10px;
		-webkit-border-radius-topright:10px;
	}

/*** explanation ***/
	.explanation {
		position:relative;
		background:#1e252e url(../images/page-contents-bg.gif) repeat-x left top;
		padding:3px 3px 3px 10px;
		margin:0 10px 17px 10px;
		border-radius:10px;
		-moz-border-radius:10px;
		-webkit-border-radius:10px;
		box-shadow:8px 8px 20px rgba(0,0,0,.6);
		-moz-box-shadow:8px 8px 20px rgba(0,0,0,.6);
		-webkit-box-shadow:8px 8px 20px rgba(0,0,0,.6);
	}
	.explanation p {
		margin:5px 4px;
		color:#eee;
	}

/*** programmatic interface block ***/
	.programmaticInterface {
		padding:10px;
		padding-right:3px;
		margin:0 10px 0 10px;
		background:#000 url(../images/title-bg.gif) repeat-x left top;
		border-radius:10px;
		-moz-border-radius:10px;
		-webkit-border-radius:10px;
	}
	.programmaticInterface p {
		margin:5px;
	}
	.programmaticInterface > ul {
		padding-left:0;
		margin:0;
	}
	.programmaticInterface ul li {
		font-size:10px;
		line-height:14px;
		margin:0;
	}
	.programmaticInterface > ul li {
		list-style-type:none;
	}

	/*** JavaScript links ***/
		.programmaticInterface a,
		.programmaticInterface a:link,
		.programmaticInterface a:visited,
		.programmaticInterface a:hover,
		.programmaticInterface a:active {
			white-space:nowrap;
		}

/*** data table ***/
	table.data {
		border-collapse:collapse;
		background:#33363f;
	}
	table.data tr td {
		border:1px solid #555;
		text-align:center;
	}
	table.data tr.title td, table.data tr.heading td {
		color:#fff;
		background:#000 url(../images/button-bg.gif) left top repeat-x;
		text-align:center;
	}
	table.data tr.title td {
		font-size:12px;
		text-transform:uppercase;
		letter-spacing:4px;
		border-top:1px solid #555;
		border-bottom:1px solid #ffa200;
		padding:3px 0 4px 0;
	}
	table.data tr.heading td {
		font-size:11px;
		padding:1px 8px;
		text-transform:uppercase;
	}
	/*** column heading highlight states ***/
		table.data tr td.headingOver, table.data tr td.headingLit {
			color:#000;
			cursor:pointer;
		}
		table.data tr td.headingOver {
			background:#999;
		}
		table.data tr td.headingLit {
			background:#ccc;
		}
		table.data tr.rowOver td {
			background:#345;
		}

	table.data tr.sectionSeparator td {
		background:#000;
		font-size:1px;
		line-height:3px;
	}
	table.data tr.rowSeparator td {
		background:#444;
		font-size:0;
		line-height:1px;
	}

/*** examples tour styling ***/
	/*** navigation buttons ***/
		.tourButton, .tourButton:link, .tourButton:visited, .tourButton:hover, .tourButton:active {
			display:block;
			position:fixed;
			top:255px;
			width:45px;
			height:77px;
			border:none;
			opacity:.5;
			filter:alpha(opacity=50);
		}
		.tourButton:hover, .tourButton:active {
			opacity:1;
			filter:alpha(opacity=100);
		}

		/*** previous button ***/
			.tourButtonPrevious {
				left:35px;
				background:url(../examples/images/tour-arrow-previous.gif) no-repeat right top;
			}
			.tourButtonPrevious:active {
				background-position:left top;
			}

		/*** next button ***/
			.tourButtonNext {
				right:35px;
				background:url(../examples/images/tour-arrow-next.gif) no-repeat left top;
			}
			.tourButtonNext:active {
				background-position:right top;
			}

	/*** tour pages ***/
		.tourPages {
			position:fixed;
			border-collapse:collapse;
			width:100%;
			height:10px;
			left:0;
			top:48px;
		}
		.tourPages td {
			padding:0;
		}
		.tourPage, .tourPage:link, .tourPage:visited, .tourPage:hover, .tourPage:active {
			display:block;
			height:10px;
			width:100%;
			background:url(../examples/images/tour-page.gif) repeat-x left top;
			border:none;
		}
		.tourPage:hover {
			background-position:left -10px;
		}
		.tourPage:active,
		.tourCurrentPage,
		.tourCurrentPage:link,
		.tourCurrentPage:visited,
		.tourCurrentPage:hover,
		.tourCurrentPage:active {
			background-position:left -20px;
		}

	/*** tour page info tooltip ***/
		.tourPageTooltip {
			display:none;
			font-size:11px;
			padding:0;
			width:186px;
			border:1px solid #556;
			border-color:#556 #333 #333 #556;
			background:#000;
		}
		/*** annotations ***/
			.tourPageTooltip .tourPageTitle {
				font-size:10px;
				color:#ddd;
				padding:3px 5px 5px 5px;
				width:176;
				text-align:center;
				background:#000 url(../images/button-bg.gif) left top repeat-x;
			}
			.tourPageTooltip .tourPageDescription, .tourPageTooltip .tourPageKeywords {
				margin:5px;
				margin-top:0;
				padding:5px;
			}
			.tourPageTooltip .tourPageDescription {
				color:#245;
				border:1px solid #fff;
				background:#1e252e url(../images/tree-menu-bg.gif) repeat-x left top;
				margin-bottom:0;
			}
			.tourPageTooltip .tourPageKeywords {
				color:#bbccd7;
				border:1px solid #678;
				border-top:1px solid #000;
				background:#345;
				padding:1px 5px;
			}


