/* ===[ Surround div around player. Is optional ]=== */

.youtubeplayer {
    margin-left: auto;
    margin-right: auto;
    max-width: 1400px;
}

.my-thumbnail {
	background-position:center center;
	background-size:auto;
	background-repeat:no-repeat;
	height:60px;
	background-size:300px;
	border-radius:5px;
	transition:all 0.4s ;
    -webkit-transition:all 0.4s ;
    -o-transition:all 0.4s ;
    -moz-transition:all 0.4s ;
}

.my-thumbnail:hover {

	background-size:200px;
	transition:all 0.2s ;
    -webkit-transition:all 0.2s ;
    -o-transition:all 0.2s ;
    -moz-transition:all 0.2s ;
	
}

#ytvideo4 {
	background-position:bottom center;
	background-repeat:repeat-x;
	margin:0px 0 40px 0;
}

/* END
   ================================================== */

/* youtube css (needed)  */

/** Now set by the js adjustHeight
 *  Player Iframe and player version 3
 * #ytvideo {
 * height:366px;
 * }
 * /* Use this is you use the player version 2
 * Also play with this height isf you use autoHide playerbar
 * #ytvideo2 {
 * height:385px;
 * }
 */

/** Only set for the page startup height
#ytvideo, #ytvideo2, #ytvideo3, #ytvideo4 {
  height:366px;
}*/

.videoyou {
	height:auto;
	overflow:auto;
}

div.youplayer p {
	position:relative;
	clear:both;
    height: 14px;
    width: 100%;
    margin: 0px;
    padding: 0;
    font-size: 13px;
    color: #dedede;
    z-index: 999;
	opacity: 0;
    filter:alpha(opacity=0);
	overflow:hidden;
	cursor:default;
}

div.youplayer li:hover p {
	opacity: 1 ;
    filter:alpha(opacity=1);
	transition:all 0.6s ;
    -webkit-transition:all 0.6s ;
    -o-transition:all 0.6s ;
    -moz-transition:all 0.6s ;
}

div.youplayer ul.videoyou {
    margin: 0;
    padding: 0;
    width: 100%;
}

div.youplayer ul.videoyou li {
    list-style-type: none;
    width: 10%;
    margin: 6px 7px 6px 7px;
    padding: 0px;
	display:-moz-inline-stack;
	display:inline-block;
	zoom:1;
	*display:inline;
}

@media only screen and (max-width: 1400px) {
div.youplayer ul.videoyou li {
    width: 150px;
}
}

@media only screen and (max-width: 854px) {

.youplayer {
	zoom:80%;
}

#ytvideo4 {
	background-image:none;
	margin:0px 0 0px 0;
}

div.youplayer ul.videoyou li {
    list-style-type: none;
    width: 100px;
    margin: 3px 4px 3px 4px;
    padding: 0px;
	display:-moz-inline-stack;
	display:inline-block;
	zoom:1;
	*display:inline;
}

div.youplayer ul.videoyou li img {
    width: 100%;
    margin: 0;
    border: none;
}

div.youplayer ul.videoyou li a {
    position: relative;
    display: block;
    outline: none;
    margin: 0;
    padding:0;
    text-align: left;
    text-decoration: none;
    color: #dedede;
	line-height:0;
	
}

div.youplayer ul.videoyou li a.currentvideo {
    background: #aaa !important;
    color: #dedede;
	border-radius:5px;
}

div.youplayer ul.videoyou li a:hover {
	border-radius:5px;
}

}

@media only screen and (max-width: 400px) {
.videoyou {
	height:526px;
	overflow:hidden;
}
}

/* footer  
div.ytfooter {
	background: url("footer.png") no-repeat scroll center bottom transparent;
	margin-left: -85px;
	margin-top: 10px;
	min-height: 43px;
	min-width: 819px;
	position: absolute;
	z-index: -1;
}*/

/* social icons  */
div.yfacebook {
    background: transparent url(facebook.png) no-repeat;
    border: none;
    float: left;
    padding: 0;
    margin: 60px 0 0 1px;
    height: 32px;
    width: 32px;
    cursor: pointer;
    position: absolute;
    z-index: 9999;
    display: none;
    outline: none;
}
div.ytwitter {
    background: transparent url(twitter.png) no-repeat;
    border: none;
    float: left;
    padding: 0;
    margin: 100px 0 0 1px;
    height: 32px;
    width: 32px;
    cursor: pointer;
    position: absolute;
    z-index: 9999;
    display: none;
    outline: none;
}
div.ytpin {
    background: transparent url(pinterest.png) no-repeat;
    border: none;
    float: left;
    padding: 0;
    margin: 140px 0 0 1px;
    height: 32px;
    width: 32px;
    cursor: pointer;
    position: absolute;
    z-index: 9999;
    display: none;
    outline: none;
}

/* up down buttons  */
div.you_up {
    border: 0px;
    float: left;
    padding: 0;
    margin: -13px 0 0 -17px;
    height: 24px;
    width: 24px;
    cursor: pointer;
    position: absolute;
    z-index: 999;
    display: none;
}

div.you_down {
    border: 0px;
    float: left;
    padding: 0;
    margin: -13px 0 0 -17px;
    height: 24px;
    width: 24px;
    cursor: pointer;
    position: absolute;
    z-index: 999;
    display: none;
}

/* === Custom scrollbars IE === */
div.youplayer {
	scrollbar-arrow-color: #000;
	scrollbar-base-color: #000000;
	scrollbar-dark-shadow-color: #111;
	scrollbar-track-color: #000000;
	scrollbar-face-color: #111;
	scrollbar-shadow-color: #111;
	scrollbar-highlight-color: #111;
	scrollbar-3d-light-color: #000000;
}
/* === END === */

/* === Custom scrollbars Webkit === */
.videoyou::-webkit-scrollbar {
	width: 14px;
	height: 14px;
}

.videoyou::-webkit-scrollbar-thumb{
	background-color:#111;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	}
	
.videoyou::-webkit-scrollbar-thumb:hover{
	background-color:#222;
	}

.videoyou::-webkit-scrollbar-thumb:vertical {
	background-color: #666;
}

/* === END === */

/* youtube css END  */

/* for the search form  */

form#quick-search {
    padding: 0;
    margin: 10px 0 0 10px;
    width: 270px;
    height: 33px;
    background: #fff url(header-search.gif) no-repeat;
    border: none;
}

form#quick-search p {
    margin: 0;
    padding: 0;
    border: none;
}

form#quick-search input {
    border: none;
    background: transparent;
    color: #666666;
    margin: 0;
    padding: 3px;
    font-size: 1.2em;
    float: left;
}

form#quick-search .tbox {
    margin: 6px 0 0 5px;
    width: 230px;
    display: inline;
}

form#quick-search .btn {
    width: 24px;
    height: 24px;
    margin: 5px 0 0 0;
    padding: 0;
}

form#quick-search label {
	display: none;
}

/* search END  */