/*
 * Please feel free to edit this style sheet to fit your needs. Keep in mind that 
 * when you upgrade the plugin this will be reset to the new settings. To combat this
 * simply add the changes to your theme's stylesheet sheet instead. 
*/

/*The margin's above and below the player.*/
.wd-player {
	margin-top: 0;
	margin-bottom: 1em;
}


/*The gap between the video player and the list of thumbnails*/
.wd-thumb-tray {
	margin-top: 0;
}

/*The background color of the thumb tray*/
.wd-thumb-tray {
    background-color: #373636;
}

/*The height of the thumbnails */
.wd-thumb {
	height: 60px;
}

/*The height and width of the and next/prev buttons. In most cases you'd want this the same as the thumbnail height*/
.wd-nav-prev, .wd-nav-next {
	height: 64px;
	width: 30px;
	background-color: #373636;
}

ul.wd-thumb-list {
	padding-left: 32px;
	padding-right: 22px; 
}

/*The border that the selected thumbnail gets*/
ul.wd-thumb-list .wd-active  {
	border: 1px solid white;
}

/*The button that slides the thumb tray down */
.wd-thumb-dropdown {
    background-image: url(../images/player_icon_down.png);
    height: 16px;
    width: 22px;
}
/*The button that slides the thumb tray up */
.wd-thumb-dropdown.wd-up-arrow {
    background-image: url(../images/player_icon_up.png);
}
/*The gap between the thumb list and the credit block*/
.wd-credits-container {
	margin-top: 0;
	height: 45px;
	-moz-border-radius: 0 0 3px 3px;
    border-radius: 0 0 3px 3px;
}

/*The color of the credit block when the tray is down*/
.wd-credits-container, .wd-player {
    line-height: 40px;
}

/*The title of the video you are watching. Leaving this empty will use the default styls of your theme.*/
.wd-title {
	text-transform: none;
	padding: 0;
	margin: 0;
	color: white;
}

/*The credit of the video you are watching. Leaving this empty will use the default styls of your theme.*/
.wd-credit {
	text-transform: none;
	padding: 0;
	margin: 0;
}
/*This is the error message that gets shown if the feed is invalid for whatever reason.*/
.wd-error {
	background: #F7F7F7;
	border: 1px solid #DDDDDD;
	display: block;
	margin: 1em 0;
	padding: 20px 5px;
	color: #aa0000;
}


/*You should not edit anything below this, unless you know what you are doing.
 *---------------------------------------------------------
 */


.wd-player {
	overflow: hidden;
	line-height: 0;
}

.wd-player a {
    outline: none;
}

.wd-stage img, .wd-thumb-list img, img.wd-thumb {
	border: 0;
	padding: 0;
	margin: 0;
}
.wd-stage {
	position: relative;
}
.wd-stage video {
	margin: 0 auto;
}

/* Thumbnails */
.wd-thumb-dropdown {
    float: right;
}
.wd-thumb-tray {
    position: relative;
}
.wd-thumb-list-container {
	width: 100%;
	overflow: hidden;
	position: relative;
}
ul.wd-thumb-list {
	list-style: none;
	margin: 0;
	overflow: hidden;
	width: 9999%;
	padding-top: 0;
	padding-bottom: 0;
	line-height: 0;
}
ul.wd-thumb-list li {
    float: left;
	padding: 2px;
	text-align: center;
}
ul.wd-thumb-list li a {
    display: block;
}

/* Buttons */
.wd-nav-prev, .wd-nav-next {
	position: absolute;
	cursor: pointer;
	top: 0;
    z-index: 10;
    text-align: center;
}
.wd-nav-prev {
	left: 0;
}
.wd-nav-next {
	right: 0;
}
.wd-thumb-dropdown {
    position: absolute;
    right: 6px;
    top: 16px;
    display: none; /*This is hidden by default*/
}
.wd-thumb-dropdown:hover {
    cursor: pointer;
}
.wd-right-arrow, .wd-left-arrow {
    border-style:solid;
    border-width:10px;
    width:0;
    height:0;
    display: inline-block;
    position: relative;
    top: 25px;
}
.wd-left-arrow {
    border-color: transparent #EAEAEA transparent transparent;
    margin-left: -10px;
}
.wd-right-arrow {
    border-color: transparent transparent transparent #EAEAEA;
    margin-right: -10px;
}

/* Credits */
.wd-credits-container {
	position: relative;
	z-index: 20;
	padding: 0 5px;
}
/* Flash Fallback */
.wd-player #no-flash-content {
	line-height: 1;
	text-align: center;
	padding: 10px;
	color: white;
}
.wd-player #no-flash-content a {
    text-decoration: none;
}
.wd-player #no-flash-content p {
	text-align: left;
}
.wdp-chrome img, .wdp-flash img {
	display: inline;
	background: none;
	margin: 0 20px;
}

/* Special stuff to deal with hiding the thumb tray */
.hide-thumbs .wd-thumb-tray {
    height: 0;
    visibility: hidden;
}
.wd-player.hide-thumbs .wd-thumb-dropdown {
    display: block;
}

/* Slideshow Specfic Styles */
.wd-player.slideshow .wd-slideshow-wrapper {
    position: absolute;
    top: 0;
    left: 0;
}
.wd-slideshow-image {
    position: absolute;
    left: 50%;
    top: 50%;
    /* Starts hidden, is resized in jQuery and then displayed */
    display: none;
    z-index: 20;
}

/* Start the first grid slideshow image hidden, turn it on in JavaScript when it's ready */
.wd-player.grid .wd-slideshow-image {
    visibility: hidden;
}

.mobile .wd-play-next, .mobile .wd-play-prev, .not-slideshow .wd-play-next, .not-slideshow .wd-play-prev {
    display: none;
}
.wd-play-next, .wd-play-prev {
    position: relative;
    height: 100%;
    width: 40%;
    z-index: 30;
    cursor: pointer;
}
.wd-play-next {
    float: right;
}
.wd-play-prev {
    float: left;

}
.wd-play-next.wd-active, .wd-play-prev.wd-active {
    cursor: pointer;
}

/* This overrides some of the theme styles that the defualt 
 * WordPress theme ships with.  
 *---------------------------------------------------------
 */
#content img.wd-thumb {
    height: 60px;
}

#content .grid img.wd-thumb {
    height: auto;
}

#content ul.wd-thumb-list {
    margin-bottom: 0; 
}

/* 
 * grid Player Overides.
 */

/* Wiredrive grid Styles */
    /* Hiding things */    
        .wd-player.grid {
            width: auto !important;
            height: auto;
        }
        .wd-player.grid .wd-nav-prev, .wd-player.grid .wd-nav-next {
            display: none;
        }
        .wd-player.grid.hide-thumbs .wd-thumb-tray {
            height: auto;
            visibility: visible;
        }
        .wd-player.grid .wd-thumb-tray {
            background: none;
        }
        .wd-player.grid .wd-credits-container {
            display: none;
        }
        
    
    /* Correcting Widths and Postioning */
        .wd-player.grid .wd-video-player {
            margin-bottom: 0;
        }
        .wd-player.grid ul.wd-thumb-list {
            padding: 0;
            width: 110% !important;
        }
        .wd-player.grid .wd-thumb-list li {
            margin: 0 5px 5px 0;
            padding: 0;
            position: relative;
            line-height: 0;
            width: 180px;
            display: inline-block;
            float: none;
            /* IE Inline Block Fix */
            zoom: 1;
            *float: inline;

        }
        .wd-player.grid .wd-thumb {
            height: auto;
        }
        .wd-player.grid .wd-thumb-list .wd-active {
            border: none;
        
        }   
        .wd-player.grid .wd-stage {
            position: fixed;
            top: -999%;
            left: -999%;
            z-index: 100;
        }
/*
        html .zero {
            height: 1px !important;
            width: 1px !important;
            opacity: 0;
        }
*/
        .wd-player.grid.ipad .wd-stage {
            display: none;
        }
    
    /* Credit Overlay and grid Credits */            
        .wd-player.grid .wd-title, .wd-player.grid .wd-credit {
            color: white;
            font-weight: bold;
            line-height: 1.2;
            word-wrap: break-word;
        }
        .grid .hover-credits {
            padding: 5px;
            text-align: left;
            width: 170px;
        }
        .grid-credits {
            position: absolute;
            line-height: 1;
            left: 0;
            padding: 0 5px;
            width: 90%;
            bottom: auto;
            top: 100%;
        }
        .grid-credits .wd-title, .grid-credits .wd-credit {
            clear: left;
            float: left; 
            padding: 5px;
        }
        .grid-credits .wd-credit {
            padding: 0 5px 5px 5px;
        }
        .wd-thumb-list a {
            position: relative;
            text-decoration: none;
            overflow: hidden;
        }
        .wd-thumb-list li .hover-credits {
            position: absolute;
            background: black;
            opacity: 0.85;
            bottom: 0;
            left: 0;
        }

/* grid Overlay Styles */
    #fade { /*--Transparent background layer--*/
    	display: none; /*--hidden by default--*/
    	background: black;
    	position: fixed; 
    	left: 0; 
    	top: 0;
    	width: 100%; 
    	height: 100%;
    	opacity: .75;
    	z-index: 50;
    }
    a.close {
        position: absolute;
    	height: 30px;
    	width: 30px;
    	display: block;
    	line-height: 30px;
    	font-size: 30px;
    	color: white;
    	text-align: right;
    	text-decoration: none;
        right: 0;
        padding: 5px 0 0;
        top: 100%;        
    }
    .wd-player.grid.slideshow .wd-stage {
        background: transparent;
    }
    .wd-player.grid .wd-play-prev, 
    .wd-player.grid .wd-play-next {
        height: 61px;
        width: 41px;
        position: absolute;
        top: 50%;
        margin-top: -30px;
        display: block !important;
        opacity: 0.2;
        cursor: default;
    }
    .wd-player.slideshow .wd-play-prev, 
    .wd-player.slideshow .wd-play-next {
        cursor: default;
    }
    .wd-player.grid .wd-play-prev.wd-active, 
    .wd-player.grid .wd-play-next.wd-active, 
    .wd-player.slideshow .wd-play-prev.wd-active, 
    .wd-player.slideshow .wd-play-next.wd-active {
        opacity: 1;
        cursor: pointer;        
    }
    .wd-player.grid .wd-play-prev {
        left: -150px;
        background: url(../images/player_icon_prev.png);

    }
    .wd-player.grid .wd-play-next {
        right: -150px;
        background: url(../images/player_icon_next.png);        
    }
    .wd-player.grid.slideshow .wd-play-prev {
        left: -10%;
    }
    .wd-player.grid.slideshow .wd-play-next {
        right: -10%;
    }
    
/* Box Thumb Option */
.box-thumbs .wd-thumb-list li a {
    width: 180px;
    height: 180px;
    text-align: center;
}


/* Disable Thumbnail & Credits Options */
.wd-player.disablethumbs .wd-thumb-tray, .wd-player.disablethumbs .wd-credits-container, .wd-player.disablethumbs.grid .hover-credits {
    display: none;
}
.wd-player.box-thumbs.grid .wd-thumb-tray {
    display: block;
}
.wd-player.disablethumbs.grid .wd-thumb-tray {
    display: block;
}