@import "reset.css";
@import "lightbox.css";

/* Player */
body {
	font: normal 11px Arial,Helvetica,sans-serif;
	background-color:#F2F2F2;
	padding:10px;
}

a, a:link, a:visited, a:active {
	text-decoration:none;
	color:#556571;
	outline:expression(hideFocus="true");
	outline:none;
}

a:hover {
	text-decoration:underline;
}

h1 {
	font-size: 15px;
	font-weight: bold;
	color: #556571;
}

h2 {
	font-size: 12px;
	font-weight: bold;
	color: #96A5B0;
}

h3 {
	font-size: 12px;
	font-weight: bold;
	color: #CD031C;
}

#container {
	width:100%;
	height: 542px;
	margin-left:auto;
	margin-right:auto;
	margin-top:auto;
	margin-bottom:auto;
	border:1px solid #d6d6dd;
	background-color:#FFFFFF;
}

#header {
	height:80px;
	border-bottom:1px solid #d6d6dd;
	padding-top:10px;
	padding-left:10px;
	padding-right:10px;
	margin-left:15px;
	margin-right:15px;
}

#header-left {
	padding-top:10px;
	height:70px;
	float:left;
	width: 550px;
}

#header-right {
	margin-top:5px;
	float:right;
	width:150px; /* Breite erforderlich, da kein Inhalt aber Hintergrundbild */
	height:70px;
	background:url(../images/logo.gif) no-repeat top right;
}

.leftBox {
	float:left;
	margin: 20px 0 auto 40px;
}

.rightBox {
	margin: 20px 40px auto 0;
	float: right;
}

#chart {
	width:320px;
/*	float:left;
	margin: 20px 0 auto 40px;*/
	height:290px;
	display: inline; /* http://www.positioniseverything.net/explorer/doubled-margin.html */
}

.noslideflow #chart {
	margin-top: 60px;
}

#chartbox {
  clear:both;
  border:1px solid #808080;
  border-bottom:0px;
  width:320px;
  height:240px;
}

#chartbox img {
  border-width:0px;
  width:320px;
  height:240px;
}

#chartcontrol {
  clear:both;
  cursor:default;
  background:#F2F2F2 url(../images/controls/controls-gradient.gif) repeat-x;
  border:1px solid #D6D6DD;
  width:320px;
  height:25px;
}

#chartcontrol .button {
	float: right;
	margin-top:5px;
	cursor: default;
	width: 14px;
	height: 14px;
	margin-right:10px;
	display: inline;
}

#chartcontrol div#chartinfo {
	float:left; 
	/*margin-top: 5px;*/
	padding-top: 5px;
	padding-left:5px; 
	width:100px; 
	font-size:10px; 
	font-weight:bold; 
	color:#556571;
}

#chartcontrol #chartinfo form {
	display:inline; 
	vertical-align:top; 
	color:#556571;
	font-size:10px;
	/*vertical-align: middle;*/
}

#chartcontrol #chartinfo form input {
	font-weight:bold;
	color:#556571;
	display:inline; 
	background-color:transparent;
	border:0px; 
	border-bottom:1px dotted #CD031C; 
	margin:auto 4px;
	width:20px;
	text-align:center;
	font-size:10px;
}

#chartcontrol #chartinfo form input:hover, #chartcontrol #chartinfo form input.hover, #chartcontrol #chartinfo form input:focus {
	background-color:white;
}

div #media {
	width:320px;
	height:290px;
	visibility: visible;
/*	float: right;
	margin: 20px 40px auto 0;*/
	border: 1px;
	padding: 0;
	display: inline; /* http://www.positioniseverything.net/explorer/doubled-margin.html */
}

.noslideflow #media {
	margin-top: 60px;
}

#navigation {
	clear:both;
	border-top:1px solid #d6d6dd;
	margin-left:15px;
	margin-right:15px;
	padding:10px 0px 10px 0px;
	height:120px;
	cursor: default;
}

.noslideflow #navigation {
	display: none;
}

#nav-container {
	width:560px;
	margin-left:auto;
	margin-right:auto;
}

#footer {
	margin-left:5px;
	margin-right:5px;
	padding-top:5px;
	padding-right:0px;
	text-align:right;
	height:15px;
	font-size:10px;
	color:#556571;
}

#footer-left {
	display: inline;
	float: left;
}

#footer-right {
	display: inline;
	float: right;
}

ul#playercontrol {
	list-style-type: none;
}

ul#playercontrol li {
	display:inline; 
	padding-right: 10px;
}

#videobox {
	width: 320px;
	height: 240px;
	border:1px solid #808080;
	border-bottom: none;
}

#videobox p {
	padding: 8px;
	font-size: 9pt;
}

#videobox p.info {
	background:#F8FAFC url(../images/icons/film_error.gif) no-repeat scroll 15px 50%;
	border-bottom:2px solid #B5D4FE;
	border-top:2px solid #B5D4FE;
	padding:5px 20px 5px 45px;
	margin-bottom: 5px;
	font-size: 10pt;
}

.slider {
	-moz-user-select: none;
	-khtml-user-select: none;
	user-select: none;
	border:0; 
}

.slider .sliderbutton {
	margin-top: 0 !important;
}

#videocontrols {
	-moz-user-select: none;
	-khtml-user-select: none;
	user-select: none;
	border:1px solid #d6d6dd;
	background:#F2F2F2 url(../images/controls/controls-gradient.gif) repeat-x;
	width: 320px;
	height: 25px;
	padding: 0;
}

#videocontrols .button {
	float: left;
	margin-top: 6px;
	cursor: default;
	width: 12px;
	height: 13px;
	display: inline;
}

#playbutton, #lb-play-button {
	background: url(../images/controls/play.gif) no-repeat;
	margin-left: 7px;
}

#playbutton:hover, #playbutton.hover, #lb-play-button:hover, #lb-play-button.hover {
	background: url(../images/controls/play-hover.gif) no-repeat;
}

#pausebutton, #lb-pause-button {
	background: url(../images/controls/pause.gif) no-repeat;
	margin-left: 7px;
}

#pausebutton:hover, #pausebutton.hover, #lb-pause-button:hover, #lb-pause-button.hover {
	background: url(../images/controls/pause-hover.gif) no-repeat;
}

#prevbutton, #lb-prev-button {
	background: url(../images/controls/prev.gif) no-repeat;
	margin-left: 10px;
}

#prevbutton:hover, #prevbutton.hover, #lb-prev-button:hover, #lb-prev-button.hover {
	background: url(../images/controls/prev-hover.gif) no-repeat;
}

#nextbutton, #lb-next-button {
	background: url(../images/controls/next.gif) no-repeat;
	margin-left: 5px;
}

#nextbutton:hover, #nextbutton.hover, #lb-next-button:hover, #lb-next-button.hover {
	background: url(../images/controls/next-hover.gif) no-repeat;
}

#stopbutton {
	background: url(../images/controls/stop.gif) no-repeat;
	margin-left: 10px;
}

#stopbutton:hover, #stopbutton.hover {
	background: url(../images/controls/stop-hover.gif) no-repeat;
}

#magnifierbutton {
	background: url(../images/controls/magnifier.gif) no-repeat;
	margin-left: 10px;
}

#magnifierbutton:hover, #magnifierbutton.hover {
	background: url(../images/controls/magnifier-hover.gif) no-repeat;
}

/* Seek slider */
#sl0base {
	margin-top: 10px;
	margin-left: 15px;
	float: left;
	background: url(../images/controls/seekslider-bg.gif) no-repeat;	
}

#sl0slider {
	background: url(../images/controls/seekslider.gif) no-repeat;
}

#sl0slider:hover, #sl0slider.hover {
	background: url(../images/controls/seekslider-hover.gif) no-repeat;
}

/* Volume slider */
#sl1base {
	margin-top: 10px;
	margin-left: 5px;
	float: left;
	background: url(../images/controls/volslider-bg.gif) no-repeat;	
}

#sl1slider {
	background: url(../images/controls/volslider.gif) no-repeat;
}

#sl1slider:hover, #sl1slider.hover {
	background: url(../images/controls/volslider-hover.gif) no-repeat;
}

/* Slideflow slider */
#sl2base {
	background: url(../images/controls/slideflowslider-bg.gif) no-repeat;
	margin-left: auto;
	margin-right: auto;
}

#sl2slider {
	background: url(../images/controls/seekslider.gif) no-repeat;
	margin-top: 6px;
	float :left;
	cursor: default;
}

#sl2slider:hover, #sl2slider.hover {
	background: url(../images/controls/seekslider-hover.gif) no-repeat;
}

#loudspeaker {
	background: url(../images/controls/speaker.gif) no-repeat;
	margin-left: 20px;
}

#loudspeaker:hover, #loudspeaker.hover {
	background: url(../images/controls/speaker-hover.gif) no-repeat;
}

#loudspeakermuted {
	background: url(../images/controls/speaker_muted.gif) no-repeat;
	margin-left: 20px;
}

#loudspeakermuted:hover, #loudspeakermuted.hover {
	background: url(../images/controls/speaker_muted-hover.gif) no-repeat;
}

.download-box {
	width:230px;
	margin: 15px auto 5px auto;
	border: 1px solid #d3d3d3;
}

span.download-text {
	margin-left: 30px;
	padding: 5px;
	display: block;
}

.download-box a:link span.download, .download-box a:visited span.download, .download-box a:hover span.download, .download-box a:active span.download {
	background:transparent url(../images/icons/download.gif) no-repeat scroll left center;
	display:block;
	min-height:50px;
	font-size: 15px;
	margin-left: 5px;
	padding: 10px;
}

.download-box a:link, .download-box a:visited, .download-box a:hover, .download-box a:active {
	color:#1c5489;
	text-decoration:none;
	display: block;
}

.download-box a:hover, .download-box a:active {
	color:#16426b;
	cursor:pointer;
}

.doclink {
	padding: 1px 0px 1px 22px;
	background: transparent url(../images/icons/page_go.gif) no-repeat scroll left center;
	margin-top: 5px;
	display: block;
}

.filmback {
	padding: 0px 0px 1px 22px;
	background: transparent url(../images/icons/film_back.gif) no-repeat scroll left center;
	display: block;
}

#silverlightInplacePlaceholder {
	margin-top: 5px;
}

#silverlightInplacePlaceholder * {
	margin-left: auto;
	margin-right: auto;
}

/* Debug box */
#debugbox{
	position:absolute;
	right:0px;
	top:0px;
	width:300px;
	/*height:150px;*/
	background-color:#EEEEEE;
	border: 1px solid #CCCCCC;
	padding:5px;
	cursor:move;
	font-family:"Lucida Sans", Arial, "sans-serif";
	font-size:10px;
}

#debugbox h1{
	background-color:#CCCCCC;
	width:100%;
	color:#666666;
	font-size:12px;
	margin-bottom:5px;
	padding:2px;
}

#debugbox label{
	width:100px;
	float:left;
}

/* Slideflow */
#slideflow {
	height: 90px;
	position: relative;
	padding-bottom:20px;
}

#slideflow img {
	position:absolute;
	top:0px;
}

#slideflow {
	height: 90px;
	position: relative;
	padding-bottom:20px;
	cursor: default;
}

#slideflow img {
	position:absolute;
	top:0px;
}

.closedHand {
	cursor: url(../images/controls/closedhand.cur), move !important;
}

.openHand {
	cursor: url(../images/controls/openhand.cur), default !important;
}

.selectable {
	cursor: pointer !important;
}


/* System requirements */
.supported {
	background-color:#006600;
	color: #FFFFFF;
	text-align: center;
}

#textbox table {
	border-top: 1px solid #000000;
	border-left: 1px solid #000000;
	margin: 2px;
}

#textbox td,th {
	border-bottom: 1px solid #000000;
	border-right: 1px solid #000000;
	padding: 5px;
	margin: 2px 20px 2px 20px;
}

#textheader {
	margin-left:15px;
	margin-right:15px;
	padding-top:3px;
	padding-right:0px;
	text-align:right;
	height:15px;
	font-size:10px;
	color:#556571;
}

#textbox {
	padding: 15px 15px 0px 15px;
	height: 518px;
	overflow: auto;
}

#textbox p {
	font-size: 12px;
}

/* Lightbox */
#lightbox {
	z-index: 1000;
}

#outerImageContainer {
	background-color: #fcfcfc;
}

#imageContainer {
	padding: 2px;
}

#imageData {
	padding: 0;
}

#overlay {
	background-color: #111;
	z-index: 900;
}
	
#bottomNav {
	background:#F1F1F1 url(../images/controls/controls-gradient.gif) repeat-x top;
	height:25px;
	margin:0px;
	padding:0px;
}

#lightbox #caption {
  visibility:hidden;
  display:none;
}

#lb-media-navigation {
	height:13px;
	width:100px;
	float:left;
	margin-left:284px;
	padding-top:6px;
	display: inline; /* IE6 */
}

#lb-media-navigation .button {
  padding:0px 10px;
  margin:0px;
  float:left;
  width:12px;
  height:13px;
}

#imageData #bottomNavClose { 
	width: 58px; 
	height: 11px;
	margin-top: 6px;
	margin-right:8px;
	cursor:default;
	outline:0;
	background: url(../images/controls/lb-close.gif) center top no-repeat;
	padding: 0 !important;
	display: inline; /* IE6 */
}

#imageData #bottomNavClose:hover, #imageData #bottomNavClose.hover {
	background: url(../images/controls/lb-close-hover.gif) center top no-repeat;
}

/* Help */
#helpoverlay {
	position: absolute;
	top: 10px;
	left: 10px;
	z-index: 10000;
	background: url(../images/controls/help-overlay.png) left top no-repeat;
	width: 782px;
	height: 565px;
}

.noslideflow #helpoverlay {
	background: url(../images/controls/help-overlay-noslideflow.png) left top no-repeat;
}

#helpoverlay.videoLeft {
	background: url(../images/controls/help-overlay-videoleft.png) left top no-repeat;
}
.noslideflow #helpoverlay.videoLeft {
	background: url(../images/controls/help-overlay-videoleft-noslideflow.png) left top no-repeat;
}