body{
	background: #999;
}

* {
    margin: 0;
    padding: 0;
}
a img {
    border: 0 none;
}

/* Grundstruktur */
#pagelayout {
	position: absolute;			/* standard konforme horizontale und vertikale zentrierung */
	top: 0;
	left: 0;
	width: 750px;
	height: 450px;
	background: #999;
}

/*
#pagelayout {
	position: absolute;			
	top: 50%;
	left: 50%;
    margin: -220px 0 0 -375px;  
	width: 700px; 
	height: 424px;
    background: #999;
    border-top: 25px solid #999;
    border-left: 25px solid #999;
    border-right: 25px solid #999;
    border-bottom: none;
  
}

*/ 

#player { 
    /* player dimension */ 
    position:absolute; 
    left: 25px; 
    top: 25px;     
    width:700px; 
    height: 394px; 
    display: block;     
}



/* Styles für den Videoplayer */

/* root element should be positioned relatively so that 
    child elements can be positioned absolutely */

div.controls { 
    position: relative;
    margin: 0;
    padding: 0;
	height: 30px;
	width: 700px;

}


/* when play button toggles between play/pause class 
    we move it's background image */
div.controls div.play, 
div.controls div.pause { 
    position:relative;
    width:  50px;
    height: 17px;
	left: 325px;
	top: 5px;
  text-indent:-999em;
    cursor:pointer;
    overflow:hidden;
/*    background:url(/design/controls/startstop.png) center top no-repeat #cc9966;*/
    background:url(/design/controls/play_pause.png) center top no-repeat #cc9966;

}

div.controls div.play:hover {
    background-position: center -34px;
    background-color: #630;
}

div.controls div.pause:hover {
    background-position: center -51px;
    background-color: #630;
}

div.controls div.pause { 
    background-position:center -17px;
}

/* the track or "scrubber"  */
div.controls div.track { 

    position:absolute;
    top: 0;   
    height:17px;
    left:79px;
    background: #cc9966;
    text-align:left;
    cursor:pointer;
    width: 380px; 
    border-right: 1px solid #FFF;
    border-top: 1px solid #FFF;
}

/* the draggable playhead */
div.controls div.playhead { 
    position:absolute;  
    height:12px;
    background:url(/design/controls/playhead.png) no-repeat;
    cursor:pointer;
    top:0px;
    margin: 3px 0 2px 0;
    width:3px;
}

/* buffer and controls are automatically resized, their initial width should be 0 */
div.controls div.progress {     
    background-color:#fff;
    height: 3px;
    margin: 8px 0;
    width: 0px;
    position:absolute;
    top: 0;
    font-size:0px;  
}

div.controls div.close {
    background:url(/design/controls/close.png) center top no-repeat #cc9966;
    border-top: 1px solid #FFF;   
    height: 17px;
    width: 80px;
    position: absolute;
    left: 460px;
    top: 0;
}

div.controls div.close:hover {
    background-color: #630;
    background-position: center -17px;
}