#overlay
{
    position:absolute;
    top:0px;
    left:0px;
    background-color:#000;
    z-index:1000;
}



#videoPage
{
    float:left;
    width:330px;
    height:335px;
    position:absolute;
}
.videoPageSmall
{
    width:330px;
    height:auto;
    z-index:1;
    top:178px;
    right:24px;
}
.videoPageLarge
{
    position:absolute;
    z-index:1001;
    top:-172px;
    left:-170px;
    background-color:#142046;
    border:solid 2px #363543;
}
.videoPageSmall #videoPlayer
{
    position:absolute;
}
#videoPlayer
{
    width:330px;
    height:280px;
    margin:0px 0 0;
}
.videoPageSmall span
{
    position:absolute;
    color:#fff;
    top:110px;
    left:120px;
}
.videoPageLarge span
{
    display:none;
}
#video-mask
{
    background-image:url(../images/gmp/video-mask.png);
    width:330px;
    top:0;
    left:0;
    height:249px;
}
/* playlist control buttons */
#btnPrev,#btnMore
{
    display:block;
    background-color:#0397d6; 
    color:#fff;
    font-weight:bold;
    border:solid 1px #fff;
    width:70px;
    padding:6px 4px;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    border-radius:5px;
    text-align:center;
    margin:9px 5px 0;
    cursor:pointer;
    font-family:Trebuchet,Arial,Helvetica,sans-serif;
    font-size:1.1em;
    height:16px;
}
#btnPrev
{
    float:left;
}
#btnMore
{
    float:right;
}
#btnPrev:hover,#btnMore:hover
{
    text-decoration:none;
    font-size:1.2em;
    padding-top:5px;
    height:17px;
}
#btnPrev.disabled,#btnMore.disabled,
#btnPrev.disabled:hover,#btnMore.disabled:hover
{
    display:none;
    cursor:default;
}


/* Playlist */
#playlist-wrapper 
{
    z-index:2;
    margin-top:104px;
	display:block;
	float:left;
	width:264px;
	height:364px;
	position:absolute;
	left:17px;
	overflow:hidden;
}
#playlist
{
	position:absolute;
	top:0;
	left:0;
}
#playlist, #playlist li
{
    list-style:none;
    padding:0;
	margin:0;
	width:264px;
} 
#playlist li
{
    margin-bottom:-4px;
}
#playlist li a
{
	color:#fff;
	height:80px;
	width:171px;
	padding:5px 10px 10px 83px;
	background-position:left top;
	background-image:url(../images/gmp/video-list-item-bg.png);
	display:block;
	text-decoration:none;
	cursor:pointer;
	position:relative;
}
#playlist li a:hover
{
    background-position:left bottom;
}
#playlist li.on a:hover,
#playlist li.on a
{
    background-position:left bottom;
}
#playlist li a span
{
    font-weight:bold;
    padding:8px 0 2px;
    display:block;    
}
#playlist li a span.video-img-mask,
#playlist li img 
{
    padding:0;
    position:absolute;
    top:11px;
    left:12px;
    width:66px;
    height:66px;
}
#playlist li a span.video-img-mask
{
    background-image:url(../images/gmp/video-img-mask.png);
    background-position:left top;
}
#playlist li.on a span.video-img-mask,
#playlist li a:hover span.video-img-mask
{
    background-position:left bottom;
}

#playlist-bottom 
{
    height:47px;
    position:absolute;
    left:18px;
    top:530px;
    width:262px;
    /*background-image:url(../images/gmp/video-list-bottom.png);*/
}

	
#controls
{
    height:63px;    
}
.videoPageSmall #controls
{
    position:absolute;
    top:275px;
}
/* controls */
#scrubberWrap
{    
    height:15px;
    background-image:url(../images/gmp/scrubberBG.gif);
    background-position:left 4px;
    background-repeat:repeat-x;
    position:relative;
}
#scrubberBGL,#scrubberBGR
{    
    position:absolute;
    height:15px;
    width:4px;
    background-image:url(../images/gmp/scrubberL.gif);
    background-position:left 4px;
    background-repeat:no-repeat;
}
#scrubberBGL
{
    left:-3px;
}
#scrubberBGR
{
    right:-3px;
    width:3px;
    background-repeat:no-repeat;
    background-image:url(../images/gmp/scrubberBGR.gif);
}
.videoPageSmall #scrubberWrap
{
    width:309px;
}
.videoPageLarge #scrubberWrap
{
    width:auto;
    margin:10px 130px 0;
}
#scrubber
{
    width:6px;
    height:15px;
    background-image:url(../images/gmp/scrubber.gif);
    background-position:left 4px;
    background-repeat:repeat-x;
    position:relative;
}
#scrubberL
{
    left:0px;
}
#scrubberL,#scrubberR
{       
    height:7px;
    width:3px;
    background-image:url(../images/gmp/scrubberL.gif);
    position:absolute;
    top:4px;
}
#scrubberR
{
    background-image:url(../images/gmp/scrubberR.png);
    position:absolute;
    right:-3px;
}
#scrubberDrag
{
    height:15px;
    width:16px;
    background-image:url(../images/gmp/scrubber.png);
    position:absolute;
    left:0px;
    top:0px;
    cursor:pointer;
}


#controlsWrap
{
    position:relative;
}
.videoPageSmall #controlsWrap
{
    width:auto;
    margin:-22px 0 0 10px;
}
.videoPageLarge #controlsWrap
{
    width:auto;
    margin:10px 130px 0;
}
#play, #pause, #reset
{
    background-image:url(../images/gmp/playpause.png);
	background-position:left top;
	cursor:pointer;
	display:block;
	height:52px;
	left:60px;
	position:absolute;
	top:24px;
	width:52px;
}
#play:hover { background-position:left -53px; }
#pause { background-position:left -106px; }
#pause:hover { background-position:left -159px; }

#reset {
	background-image:url(../images/gmp/reset.png);
	left:0;
	height:52px;
}
#reset:hover {background-position:left 53px;}

#volumeWrap
{
    position:absolute;
    width:103px;
    height:30px;
    left:121px;
    top:35px;
    background-image:url(../images/gmp/volumeBG.png);
    background-position:left 11px;
    background-repeat:no-repeat;
}
#volume
{
    height:7px;
    width:6px;
    background-image:url(../images/gmp/scrubber.gif);
    background-repeat:repeat-x;
    position:relative;
    margin-top:11px;
}
#volumeL
{
    left:0px;
}
#volumeL,#volumeR
{       
    height:7px;
    width:3px;
    background-image:url(../images/gmp/scrubberL.gif);
    position:absolute;
}
#volumeR
{
    background-image:url(../images/gmp/scrubberR.png);
    position:absolute;
    right:-1px;
}
#volumeDrag
{
    height:30px;
    width:30px;
    background-image:url(../images/gmp/volume.png);
    position:absolute;
    left:0px;
    top:0px;
    cursor:pointer;
}
.videoPageLarge #title
{
    top:10px;
    left:240px;
}
.videoPageSmall #title
{
    top:60px
}
#title
{
    font-family:Arial, Sans-Serif;
    font-size:12px;
    position:absolute;    
}
#bigger
{
    left:232px;
}
#smaller
{
    right:0px;
}
#bigger, 
#smaller
{
    position:absolute;
    height:35px;
    width:77px;
    background-image:url(../images/gmp/bigger.png);
    display:block;
    cursor:pointer;
    background-position:left top;    
    top:34px;
}
#smaller
{
    background-image:url(../images/gmp/smaller.png);
    display:none;
}
#bigger:hover { background-position:left -35px; }
#smaller:hover { background-position:left -35px; }

/*// abc page */
#abc
{
    display:block;
	float:left;
	width:275px;
	height:400px;
	position:relative;
}
#abc a img
{
    border:none;
}
#abc a
{
    position:absolute;
}
#abc #a
{
    top:0px;
    left:100px;
}
#abc #b
{
    top:30px;
    left:100px;
}
#abc #c
{
    top:60px;
    left:100px;
}
#abc #d
{
    top:100px;
    left:100px;
}