.previewPlayerBar {
    /* Preview Player Bar default size and position */
    z-index:999999;
    position:absolute;
    bottom:0px;
    left:0px;
    width:500px;
    height:250px;
}

.previewPlayerBarContentOuterContainer {
    position:absolute;
    top:39px;
    left:10px;
    bottom:22px;
    right:10px;
    background-color:#CECECE;
    background-image:-moz-linear-gradient(top, #E7E7E7, #CECECE); /* FF3.6 */
    background-image:-webkit-gradient(linear, left top, left bottom, color-stop(0, #E7E7E7), color-stop(1, #CECECE));         /* Saf4+, Chrome */
    filter:progid:DXImageTransform.Microsoft.gradient(gradientType='0', startColorStr='#E4E4E4', EndColorStr='#C9C9C9');       /* IE6,IE7 */
    -ms-filter:"progid:DXImageTransform.Microsoft.gradient(gradientType='0', startColorStr='#E4E4E4', EndColorStr='#C9C9C9')"; /* IE8 */
}

/* START: Preview Player Bar Title */
.previewPlayerBarTitle {
    position:absolute;
    top:10px;
    left:52px;
    right:95px;
    height:27px;
    vertical-align:middle;
    line-height:27px;
    white-space:nowrap;
    font-weight:bold;
    overflow:hidden;
    text-overflow: ellipsis;
}

.previewPlayerBarInfoIcon {
    position:absolute;
    top:15px;
    left:18px;
    width:21px;
    height:21px;
    border:0px;
    padding:0px;
    background-color:transparent;
    background-image:url('[themeFolder]/Images/preview_info_icon_default.png');
    background-repeat:no-repeat;	
}

.previewPlayerBarInfoIcon:hover {
    background-image:url('[themeFolder]/Images/preview_info_icon_hover.png');
    cursor:pointer;
}

.previewPlayerBarTitleSeperatorIcon {
    position:absolute;
    top:16px;
    left:42px;
    width:2px;
    height:15px;
    background-image:url('[themeFolder]/Images/title_seperator.png');
    background-repeat:no-repeat;	
}

.previewPlayerBarHideIcon {
    position:absolute;
    top:15px;
    right:46px;
    width:20px;
    height:20px;
    border:0px;
    padding:0px;
    background-color:transparent;
    background-image:url('[themeFolder]/Images/preview_hide_icon_default.png');
    background-repeat:no-repeat;
}

.previewPlayerBarHideIcon:hover {
    background-image:url('[themeFolder]/Images/preview_hide_icon_hover.png');
    cursor:pointer;
}

.previewPlayerBarHelpIcon {
    position:absolute;
    top:15px;
    right:72px;
    width:20px;
    height:20px;
    border:0px;
    padding:0px;
    background-color:transparent;
    background-image:url('[themeFolder]/Images/preview_help_icon_default.png');
    background-repeat:no-repeat;
}

.previewPlayerBarHelpIcon:hover {
    background-image:url('[themeFolder]/Images/preview_help_icon_hover.png');
    cursor:pointer;
}

.previewPlayerBarCloseIcon {
    position:absolute;
    top:15px;
    right:20px;
    width:20px;
    height:20px;
    border:0px;
    padding:0px;
    background-color:transparent;
    background-image:url('[themeFolder]/Images/preview_close_icon_default.png');
    background-repeat:no-repeat;
}

.previewPlayerBarCloseIcon:hover {
    background-image:url('[themeFolder]/Images/preview_close_icon_hover.png');
    cursor:pointer;
}

/* END: Preview Player Bar Title */


/* START: Preview Player Bar border Styles */
.previewPlayerBarBottomLeftBorder {
    position:absolute;
    bottom:0px;
    left:0px;
}

.previewPlayerBarBottomBorder {
    position:absolute;
    bottom:0px;
    left:22px;
    right:22px;
    height:22px;
    background-image:url('[themeFolder]/Images/instructor_border_bottom.png');
    background-repeat:repeat-x;
}

.previewPlayerBarBottomRightBorder {
    position:absolute;
    bottom:0px;
    right:0px;
}

.previewPlayerBarLeftBorder {
    position:absolute;
    top:44px;
    left:0px;
    width:10px;
    bottom:22px;
    background-image:url('[themeFolder]/Images/instructor_border_left.png');
    background-repeat:repeat-y;
}

.previewPlayerBarRightBorder {
    position:absolute;
    top:44px;
    right:0px;
    width:10px;
    bottom:22px;
    background-image:url('[themeFolder]/Images/instructor_border_right.png');
    background-repeat:repeat-y;
}

.previewPlayerBarTopBorder {
    position:absolute;
    top:0px;
    left:22px;
    right:22px;
    height:44px;
    background-image:url('[themeFolder]/Images/instructor_border_top.png');
    background-repeat:repeat-x;
}

.previewPlayerBarTopLeftBorder {
    position:absolute;
    top:0px;
    left:0px;
}

.previewPlayerBarTopRightBorder {
    position:absolute;
    top:0px;
    right:0px;
}
/* END: Preview Player Bar border Styles */

/* START: Preview Player Bar Progress Bar */

.previewPlayerBarProgressBar {
    position:absolute;
    left:15px;
    right:15px;
    height:25px;
    bottom:4px;
}

.previewPlayerBarProgressBarLeft {
    position:absolute;
    left:0px;
    bottom:0px;
    width:10px;
    height:25px;
    background-image:url('[themeFolder]/Images/preview_progress_bar_background_left.png');
    background-repeat:no-repeat;
}

.previewPlayerBarProgressBarRight {
    position:absolute;
    right:0px;
    bottom:0px;
    width:10px;
    height:25px;
    background-image:url('[themeFolder]/Images/preview_progress_bar_background_right.png');
    background-repeat:no-repeat;
}

.previewPlayerBarProgressBarMiddle {
    position:absolute;
    left:10px;
    right:10px;
    bottom:0px;
    height:25px;
    background-image:url('[themeFolder]/Images/preview_progress_bar_background_middle.png');
    background-repeat:repeat-x;
}

.previewPlayerBarProgressBarBorderRadius {
    -moz-border-radius:6px;        /* FF1+ */
    -webkit-border-radius:6px;     /* Saf3-4 */
    border-radius:6px;             /* Opera 10.5, IE 9, Saf5, Chrome */
}

.previewPlayerBarProgressBarGradient {
    position:absolute;
    visibility:hidden;
    left:0px;
    right:0px;
    bottom:0px;
    top:0px;
    background-color:#609DDA;
    background-image:-moz-linear-gradient(left, #609DDA, #13508E); /* FF3.6 */
    background-image:-webkit-gradient(linear, left top, right bottom, color-stop(0, #609DDA), color-stop(1, #13508E));         /* Saf4+, Chrome */
    filter:progid:DXImageTransform.Microsoft.gradient(gradientType='1', startColorStr='#609DDA', EndColorStr='#13508E');       /* IE6,IE7 */
    -ms-filter:"progid:DXImageTransform.Microsoft.gradient(gradientType='1', startColorStr='#609DDA', EndColorStr='#13508E')"; /* IE8 */
}

.previewPlayerBarProgressBarBackground {
    position:absolute;
    z-index:1; /* The z-index of the 'background' must be greater than the 'gradient' for the progress bar step jump function */
    left:125px;
    right:60px;
    bottom:5px;
    top:6px;
    background-color:#EBEBEB;
    cursor:pointer;
}

.previewPlayerBarProgressBarTransparentBackground {
    position:absolute;
    left:125px;
    right:60px;
    bottom:5px;
    top:6px;
    border:1px solid gray;
    filter:alpha(opacity=50); /* internet explorer */
    -khtml-opacity:0.5;      /* khtml, old safari */
    -moz-opacity:0.5;       /* mozilla, netscape */
    opacity:0.5;           /* fx, safari, opera */
}

.previewPlayerBarPlayIcon {
    position:absolute;
    bottom:0px;
    left:1px;
    width:25px;
    height:25px;
    border:0px;
    padding:0px;
    background-color:transparent;
    background-image:url('[themeFolder]/Images/preview_play_default.png');
    background-repeat:no-repeat;
}

.previewPlayerBarPlayIcon:hover {
    background-image:url('[themeFolder]/Images/preview_play_hover.png');
    cursor:pointer;
}

.previewPlayerBarPauseIcon {
    position:absolute;
    bottom:0px;
    left:1px;
    width:25px;
    height:25px;
    border:0px;
    padding:0px;
    background-color:transparent;
    background-image:url('[themeFolder]/Images/preview_pause_default.png');
    background-repeat:no-repeat;
}

.previewPlayerBarPauseIcon:hover {
    background-image:url('[themeFolder]/Images/preview_pause_hover.png');
    cursor:pointer;
}

.previewPlayerBarIncreaseSpeedIcon {
    position:absolute;
    bottom:0px;
    left:67px;
    width:25px;
    height:25px;
    border:0px;
    padding:0px;
    background-color:transparent;
    background-image:url('[themeFolder]/Images/preview_increase_speed_default.png');
    background-repeat:no-repeat;
}

.previewPlayerBarIncreaseSpeedIcon:hover {
    background-image:url('[themeFolder]/Images/preview_increase_speed_hover.png');
    cursor:pointer;
}

.previewPlayerBarDecreaseSpeedIcon {
    position:absolute;
    bottom:0px;
    left:30px;
    width:25px;
    height:25px;
    border:0px;
    padding:0px;
    background-color:transparent;
    background-image:url('[themeFolder]/Images/preview_decrease_speed_default.png');
    background-repeat:no-repeat;
}

.previewPlayerBarDecreaseSpeedIcon:hover {
    background-image:url('[themeFolder]/Images/preview_decrease_speed_hover.png');
    cursor:pointer;
}

.previewPlayerBarSpeedIndicator {
    position:absolute;
    bottom:0px;
    left:48px;
    width:25px;
    height:25px;
    background-repeat:no-repeat;
}

.previewPlayerBarSpeedIndicatorSlowest {
    background-image:url('[themeFolder]/Images/preview_speed_indicator_very_slow.png');
}

.previewPlayerBarSpeedIndicatorSlow {
    background-image:url('[themeFolder]/Images/preview_speed_indicator_slow.png');
}

.previewPlayerBarSpeedIndicatorMedium {
    background-image:url('[themeFolder]/Images/preview_speed_indicator_medium.png');
}

.previewPlayerBarSpeedIndicatorFast {
    background-image:url('[themeFolder]/Images/preview_speed_indicator_fast.png');
}

.previewPlayerBarSpeedIndicatorFastest {
    background-image:url('[themeFolder]/Images/preview_speed_indicator_very_fast.png');
}

.previewPlayerBarPreviousStepIcon {
    position:absolute;
    bottom:0px;
    left:95px;
    width:25px;
    height:25px;
    border:0px;
    padding:0px;
    background-color:transparent;
    background-image:url('[themeFolder]/Images/preview_previous_step_default.png');
    background-repeat:no-repeat;
}

.previewPlayerBarPreviousStepIcon:hover {
    background-image:url('[themeFolder]/Images/preview_previous_step_hover.png');
    cursor:pointer;
}

.previewPlayerBarNextStepIcon {
    position:absolute;
    bottom:0px;
    right:30px;
    width:25px;
    height:25px;
    border:0px;
    padding:0px;
    background-color:transparent;
    background-image:url('[themeFolder]/Images/preview_next_step_default.png');
    background-repeat:no-repeat;
}

.previewPlayerBarNextStepIcon:hover {
    background-image:url('[themeFolder]/Images/preview_next_step_hover.png');
    cursor:pointer;
}

.previewPlayerBarToggleAudioEnabledIcon {
    position:absolute;
    bottom:0px;
    right:1px;
    width:25px;
    height:25px;
    border:0px;
    padding:0px;
    background-color:transparent;
    background-image:url('[themeFolder]/Images/preview_toggle_audio_enabled_default.png');
    background-repeat:no-repeat;
}

.previewPlayerBarToggleAudioEnabledIcon:hover {
    background-image:url('[themeFolder]/Images/preview_toggle_audio_enabled_hover.png');
    cursor:pointer;
}

.previewPlayerBarToggleAudioDisabledIcon {
    position:absolute;
    bottom:0px;
    right:1px;
    width:25px;
    height:25px;
    border:0px;
    padding:0px;
    background-color:transparent;
    background-image:url('[themeFolder]/Images/preview_toggle_audio_disabled_default.png');
    background-repeat:no-repeat;
}

.previewPlayerBarToggleAudioDisabledIcon:hover {
    background-image:url('[themeFolder]/Images/preview_toggle_audio_disabled_hover.png');
    cursor:pointer;
}

/* END: Preview Player Bar Progress Bar */