/*
Dieses Stylesheet beschreibt das Layout der Demos-Seiten.
*/

body,#topbackground {
	background-image:		url(../../images/Demos/background.gif);
}
@media handheld {
	body {
		background-image:	none;
	}
}

h1,h2,h3,h4,h5,h6,#footer { 
	color:					#1B567B;
}
#footer,table.mmt th {
	border-color:			#1B567B;
}

table.mmt td.note {	
	width:			640px;
}

table.mmt tr.demo {
	background-color: 	#F9F9F9;
margin-top:0px	
}

tr.demo .subtitle {
margin: 5px 0 0 0;
font-size: 85%;
}

table.mmt tr.footer {
	background-color: 	#E9E9E9;	
	font-size: 85%;
}

div.pre {
	border:1px solid #999999;
	margin: 0px;
	padding:0px;
	text-align:center;
    	vertical-align: middle;
}

.demoreel {
	background-color: 	#F9F9F9;
	border-top: 1px #DDD solid;
	border-bottom: 1px #DDD solid;
}

.demoreel .demo {
float:left;
margin:15px 5px 15px 15px;
padding:5px;
border: 1px solid #888888;
box-shadow: 0px 0px 8px 0px #000000;
-moz-box-shadow: 0px 0px 8px 0px #000000;
background-color:#FFFFFF;
width:160px
}

.demoreel .demo p.subtitle {
margin: 5px 0 0 0;
	font-size: 85%;text-align:center
}

.demoreel .footer {
	clear:both;
	background-color: 	#E9E9E9;
	border-top: 1px #DDD solid;
	font-size: 85%;
	padding:5px;
	text-align:justify
}

#youtubeCarousel {

	position:relative;
	background-color: 	#F9F9F9;
	border-top: 1px #DDD solid;
	border-bottom: 1px #DDD solid;
	padding: 5px 10px 5px 5px
}

#youtubeCarousel .video {
	border: 1px solid #888888;
	background-color: white;
	padding: 5px;
	margin: 7px;
	display: block;
	float: left;
width:120px;
box-shadow: 0px 0px 8px 0px #000000;
-moz-box-shadow: 0px 0px 8px 0px #000000;
}

#youtubeCarousel .video p.subtitle {
margin: 5px 0 0 0;
	font-size: 85%;text-align:center
}

#youtubeCarousel #videos_prev {position:absolute;top:50px;left:-10px;opacity:0.5;z-index:5000}
#youtubeCarousel #videos_next {position:absolute;top:50px;right:-10px;opacity:0.5;z-index:5000}
#youtubeCarousel #videos_prev:hover {opacity:1}
#youtubeCarousel #videos_next:hover {opacity:1}

.pagination {
	text-align: center;
}
.pagination a {
	background: url(/global/images/icons/stop_fade.png) no-repeat;
	width: 16px;
	height: 16px;
	margin: 0 5px 0 0;
	display: inline-block;
}
.pagination a.selected {
	background: url(/global/images/icons/stop.png) no-repeat;
	cursor: default;
}
.pagination a span {
	display: none;
}

.clearfix {
    float: none;
    clear: both;
}