/************************* CSS pre-parsed by easydb ************************/


/* root element should be positioned relatively so that
	child elements can be positioned absolutely */
div.easFlvPlayerControls {
	position:relative;
	height: 20px;
	color: black;
	width: 100%;
    background: #999999
}

/* state buttons */
/* TODO: for the sake of simplicity these should have the "button" class attached */
div.easFlvPlayerControls a.play,
div.easFlvPlayerControls a.pause,
div.easFlvPlayerControls a.mute,
div.easFlvPlayerControls a.unmute,
div.easFlvPlayerControls div.playhead {
    height: 20px;
    line-height: 20px;
    background: #5f8c2a;
    text-align:center;
	cursor:pointer;
    color: #ffffff;
    font-weight: bold;
}
div.easFlvPlayerControls a.play:hover,
div.easFlvPlayerControls a.mute:hover,
div.easFlvPlayerControls a.unmute:hover,
div.easFlvPlayerControls a.pause:hover,
div.easFlvPlayerControls div.playhead:hover {
    background: #70A531;
    text-decoration: none;
}
/* play/pause button addtions */
div.easFlvPlayerControls a.play,
div.easFlvPlayerControls a.pause {
	position:absolute;
	width: 10%;
	display:block;
	border-right:1px solid #000;
}
/* mute/unmute button addtions */
div.easFlvPlayerControls a.mute,
div.easFlvPlayerControls a.unmute {
	position:absolute;
	left: 90%;
	width: 10%;
}


/* the timeline (or "scrubber")  */
div.easFlvPlayerControls div.track {
	position: absolute;
	left: 10%;
	width: 60%;
	height: 20px;
	cursor:pointer;
	border-left:1px solid #999;
    /*background: #999999;*/
}

/* the draggable playhead */
div.easFlvPlayerControls div.playhead {
    position:absolute;
	/*position:absolute;
	cursor:pointer;
	background-color:#ff0000;*/
	width:20px;
	/*height:20px;
	border-right:1px solid #444;*/
    border-left:1px solid #333333;
    border-right:1px solid #333333;
}

/* buffer- and progress bars. upon runtime the width of these elements grows */
div.easFlvPlayerControls div.progress,
div.easFlvPlayerControls div.buffer {
	position:absolute;
	background: #BFE097;
	width:0px;
	height:20px;
}
div.easFlvPlayerControls div.buffer {
	background-color: #3b561a;
}

/* time display */
div.easFlvPlayerControls div.time {
	position:absolute;
	left: 70%;
	width: 20%;
    height: 20px;
    line-height: 20px;
	text-align:center;
	border: 1px solid #333333;
    border-top: none;
    border-bottom: none;
	font-size:12px;
    background: #999999;
}
/* current position */
div.easFlvPlayerControls div.time span {
	color:#ffffff;
    border-right: solid 1px #333333;
    padding-right: 5px;
    margin-right: 5px;
}
/* total duration in time display */
div.easFlvPlayerControls div.time strong {
	color: #000000;
}


/**
* VideoController styling (the new flowplayer controls).
*/

.VideoController {
    /*position:absolute;
    left:3%;
    bottom:30px;*/
    width:94%;
    height:30px;
}

.VideoController .background {
    position:relative;
    width:100%;
    height:100%;
    background:#000000;
    opacity:0.7;
    -ms-opacity: 0.7;
    filter: Alpha(opacity=70);
}

.VideoController .content {
    position:absolute;
    top:0px;
    left:0px;
    width:100%;
    height:100%;
    line-height:30px;
}

.VideoController .content .control {
    float:left;
    margin-left: 5px;
    color:#ffffff;
    cursor:pointer;
    font-size:0px;
    width:16px;
    height:16px;
    margin-top:6px;
}

/* play/pause buttons */
.VideoController .content .control.play {
    background: url(img/flowplayer/play.gif);
}
.VideoController.playing .content .control.play {
    background: url(img/flowplayer/pause.gif);
}

/* mute/unmute buttons */
.VideoController .content .control.mute {
    background: url(img/flowplayer/mute.gif);
}
.VideoController.muted .content .control.mute {
    background: url(img/flowplayer/unmute.gif);
}

.VideoController .content .track {
    float:left;
    width:60%;
    height: 10px;
    margin: 10px 0px 0px 10px;
    background: #666666;
}

.VideoController .content .track .progress {
    height: 100%;
    background: #ffffff;
}

.VideoController .content .time {
    float:left;
    width:20%;
    height: 30px;
    line-height: 30px;
    margin-left: 10px;
    color: #ffffff;
}