/**
 * VideoJS Moonify CSS Skin (dubcanada) originally by (http://jlofstedt.com)
 * Version 1.2
 */
 
 
/* Turn off captions, live-controls and subtitles */
.moo-css .vjs-control-bar .vjs-captions-button ,
.moo-css .vjs-control-bar .vjs-live-controls,
.moo-css .vjs-control-bar .vjs-subtitles-button {
	display: none;
}

/* Hide font based widgets in latest video.js */
.moo-css .vjs-big-play-button:before,
.moo-css .vjs-control-bar *:before{
	content: "";
	display: none;
}

/* Reset background color and effects on big-play-button */
.moo-css .vjs-default-skin .vjs-big-play-button:focus,
.moo-css .vjs-default-skin:hover .vjs-big-play-button {
    border-color: inherit;
    background-color: transparent;
    box-shadow: inherit;
    transition: inherit;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    -webkit-transition: none;
    -moz-transition: none;
    -o-transition: none;
    transition: none;
}

.moo-css .vjs-control-bar {
    -moz-border-radius: 0 0 0 0;
    -moz-box-shadow: none;
    -webkit-border-radius: 0 0 0 0;
    -webkit-box-shadow: none;
    border-radius: 0 0 0 0;
    box-shadow: none;
    background: none;
    padding: 0;
    text-align: center;
    bottom: 3px;
    border: 0;
    border: 0px;
	
	color: #FFFFFF;
    height: 43px;
    opacity: 1;
    width: 90%;
    margin: 0 auto;
	background: url("images/sprite_repeat.png") repeat-x 0 0;
	
}

    .moo-css .vjs-control-bar > div {
        -moz-border-radius: 0 0 0 0;
        -moz-box-shadow: none;
        -webkit-border-radius: 0 0 0 0;
        -webkit-box-shadow: none;
        border-radius: 0 0 0 0;
        box-shadow: none;
        height: 40px;
        padding: 0;
        text-align: center;
        bottom: 0;
        border: 0px;
    }

/* ===[ Placement of Control Items ]=== */

    .moo-css .vjs-control-bar > div.vjs-play-control {
        width: 43px;
    }

    .moo-css .vjs-control-bar > div.vjs-progress-control {
		width: 200px;
		position: relative;
    }

    .moo-css .vjs-control-bar > div.vjs-current-time {
        width: 52px;
    }

    .moo-css .vjs-control-bar > div.vjs-remaining-time {
        width: 67px;
    }
    
	.moo-css .vjs-control-bar > div.vjs-volume-control {
        width: 52px;
		float: right;
    }
	
    .moo-css .vjs-control-bar > div.vjs-separator {
        width: 12px;
    }

    .moo-css .vjs-control-bar > div.vjs-fullscreen-control {
        width: 43px;
		float: right;
    }

	.moo-css .vjs-control-bar > div.vjs-mute-control { 
		float: right;
	}

/** Play/Pause
 * --------------------------------------------------------------------------------
 */

.moo-css .vjs-play-control {
    top: 0;
    margin: 0;
    height: 40px;
    background: url("images/sprite_norepeat.png") no-repeat 0 -191px;
    border: 0px;
}

.moo-css .vjs-play-control:active { background: url("images/sprite_norepeat.png") no-repeat 0 -231px }

.vjs-default-skin.vjs-paused .vjs-play-control div {
    border: 0;
    height: 40px;
    margin: 0;
    width: 43px;
    background: url("images/sprite_norepeat.png") no-repeat -69px -257px;
}

.moo-css .vjs-control-bar > div.vjs-mute-control div { 
    border: 0;
    height: 40px;
    margin: 0;
    width: 43px;
	background: url("images/sprite_norepeat.png") no-repeat -70px -312px;
}

.moo-css .vjs-control-bar > div.vjs-mute-control.vjs-vol-0 div { 
	opacity: 0.1;
}







.vjs-default-skin.vjs-playing .vjs-play-control div {
    border: 0;
    height: 40px;
    margin: 0;
    width: 43px;
    background: url("images/sprite_norepeat.png") no-repeat -72px -203px;
}

/** Progress
 * --------------------------------------------------------------------------------
 */

.moo-css div.vjs-progress-control {
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    height: 40px;
    top: 0;
    border: 0px;
}

.moo-css .vjs-progress-control .vjs-progress-holder {
    border: 0;
    height: 40px;
    margin: 0;
    padding: 0;
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    overflow: visible;
    z-index: 1000;
    background: none;
}

.moo-css .vjs-progress-control .vjs-play-progress {
    height: 40px;
    background: url("images/sprite_repeat.png") repeat-x 0 -180px;
    overflow: visible !important;
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    filter: none;
}

.moo-css .vjs-progress-control .vjs-seek-handle {
    height: 17px;
    width: 17px;
    background: url("images/sprite_norepeat.png") no-repeat -81px -380px;
    display: block;
    position: relative;
    left: -9px;
    top: 12px;
    -mox-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    border-radius: none;
    -moz-box-radius: none;
    -webkit-box-radius: none;
}

.moo-css .vjs-progress-control .vjs-load-progress {
    height: 40px;
    background: url("images/sprite_repeat.png") repeat-x 0 -120px;
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
}

/** Time Display
 * --------------------------------------------------------------------------------
 */

.moo-css .vjs-control-bar .vjs-time-controls {
    top: 0;
    background: none;
    border: 0px;
    height: 40px;
}

.moo-css .vjs-control-bar .vjs-current-time,
.moo-css .vjs-control-bar .vjs-time-divider,
.moo-css .vjs-control-bar .vjs-duration {
    cursor: default;
    text-align: center;
    height: 40px;
    line-height: 40px;
}

.moo-css .vjs-control-bar .vjs-remaining-time {
    cursor: default;
    text-align: center;
}

    .moo-css .vjs-control-bar .vjs-remaining-time .vjs-remaining-time-display {
        background: url("images/sprite_norepeat.png") no-repeat -37px -312px;
        nowhitespace: afterproperty;
        cursor: default;
        display: block;
        height: 40px;
        line-height: 40px;
        padding: 0 0 0 13px;
        text-align: left;
        /* Centering vertically */
    }

/** Volume
 * --------------------------------------------------------------------------------
 */

.moo-css .vjs-volume-control {
    cursor: default;
    float: left;
    height: 22px;
    padding: 18px 0 0;
    width: 40px;
}

    .moo-css .vjs-volume-control .vjs-volume-bar {
        width: 40px;
        margin: 0px;
        top: 18px;
        height: 5px;
        background: #2d2e2f;
        -webkit-transition: all 100ms linear;
        -moz-transition: all 100ms linear;
        cursor: pointer !important;
        border: 0;
        border-radius: 0;
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
    }

        .moo-css .vjs-volume-control .vjs-volume-bar .vjs-volume-level {
            background: url("images/sprite_repeat.png") repeat-x 0 -240px;
            border-radius: 0;
            -webkit-border-radius: 0;
            -moz-border-radius: 0;
        }

        .moo-css .vjs-volume-control .vjs-volume-bar .vjs-volume-handle { display: none }
/** Fullscreen
 * --------------------------------------------------------------------------------
 */

.moo-css .vjs-fullscreen-control {
    height: 40px;
    background: url("images/sprite_norepeat.png") no-repeat 0 -103px;
    width: 43px;
    margin: 0;
}

.moo-css.fullscreen .vjs-fullscreen-control { background: url("images/sprite_norepeat.png") no-repeat 0 -143px }


/* ===[ Making default fullscreen icon smaller ]=== */

.moo-css .vjs-fullscreen-control div {
    border: 0;
    height: 40px;
    margin: 0;
    width: 43px;
    background: url("images/sprite_norepeat.png") no-repeat -67px -148px;
}

.moo-css.vjs-fullscreen .vjs-fullscreen-control div {
    border: 0;
    height: 40px;
    margin: 0;
    width: 43px;
    background: url("images/sprite_norepeat.png") no-repeat -67px -91px;
}

/** Big Play Button (at start)
 * ---------------------------------------------------------
 */

.moo-css div.vjs-big-play-button {
    z-index: 2;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 98px;
    height: 96px;
    margin: -43px 0 0 -43px;
    text-align: center;
    vertical-align: center;
    cursor: pointer !important;
    border: 0px;
    border-radius: 0px;
    box-shadow: none;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    opacity: 0.9;
    background: url("images/sprite_norepeat.png") no-repeat 0 0;
}

.moo-css div.vjs-big-play-button:hover {
    border: 0px;
    border-radius: 0px;
    box-shadow: none;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    opacity: 1;
}

.moo-css div.vjs-big-play-button span { display: none }

.moo-css div.vjs-big-play-button:active { margin: -42px 0 0 -43px }
