@charset "utf-8";


/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
/*b, u, i,*/
center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
em{font-style:normal;}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
	overflow:hidden;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}



/* --- HTML ---*/
/* -------------*/

body {
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
}

/*fix HTML5 marging under img*/
img{vertical-align:middle;}


/* --- SPRITE ---*/
/* --------------*/

#preloadPlayer .icon-timer,
#preloadPlayer .thumbs div:after,
#preloadPlayer:hover .thumbs div:after,
#preloadPlayer .ac_logo {
	background-image:url(../../../skin_v7/player_embed/img/sprite_player_embed.png);
	background-repeat:no-repeat;
}



/* ---------------------*/

#preloadPlayer{
	position:relative;
	overflow:hidden;
	color:#fff;
}

#preloadPlayer:hover{
	cursor:pointer;
}

#preloadPlayer .ac_logo {
	position:absolute;
	top:15px;
	right:15px;
	z-index:2;
	width:76px;
	height:13px;
	background-position:0 0;
	text-indent:-9999px;
}

#preloadPlayer .ac_logo:hover {
	background-position:0 -15px;
}

#preloadPlayer .ac_logo:hover + .media-meta .thumbs div:after{
	background-position:-49px -31px;
}


#preloadPlayer .thumbs{
	position:relative;
	background:#000;
}

#preloadPlayer .thumbs div {
	display:block;
	overflow:hidden;
}

#preloadPlayer .thumbs div:after{
	content:'';
	display:block;
	width:45px;
	height:60px;
	position:absolute;
	z-index:2;
	top:50%;
	left:50%;
	margin:-30px 0 0 -23px;
	background-position:-49px -31px;

	-webkit-transform:scale(.75);
	-moz-transform:scale(.75);
	-o-transform:scale(.75);
	transform:scale(.75);
}

#preloadPlayer.small .thumbs div:after{
	-webkit-transform:scale(.66);
	-moz-transform:scale(.66);
	-o-transform:scale(.66);
	transform:scale(.66);
}

#preloadPlayer.medium .thumbs div:after{
	-webkit-transform:scale(.75);
	-moz-transform:scale(.75);
	-o-transform:scale(.75);
	transform:scale(.75);
}

#preloadPlayer.large .thumbs div:after{
	-webkit-transform:scale(1);
	-moz-transform:scale(1);
	-o-transform:scale(1);
	transform:scale(1);
}


#preloadPlayer:hover .thumbs div:after{
	background-position:0px -31px;
}



#preloadPlayer .thumbs img{
	width:100%;
	height:auto;
	
	opacity:0;
	filter: alpha(opacity=0);
	
	-webkit-transition: opacity 1s ease;
	-moz-transition: opacity 1s ease;
	-ms-transition: opacity 1s ease;
	-o-transition: opacity 1s ease;
	transition: opacity 1s ease;
}

#preloadPlayer .thumbs img.ready {
	opacity:1;
	filter: alpha(opacity=100);
}




#preloadPlayer .titlebar{
	background:#000;
	background:rgba(0,0,0,.5);
	position:absolute;	
	right:0;
	bottom:0;
	left:0;
	padding: 15px 75px 15px 15px;
	
	-webkit-transition: background 0.5s ease, padding-top 0.5s ease;
	-moz-transition: background 0.5s ease, padding-top 0.5s ease;
	-ms-transition: background 0.5s ease, padding-top 0.5s ease;
	-o-transition: background 0.5s ease, padding-top 0.5s ease;
	transition: background 0.5s ease, padding-top 0.5s ease;
}

#preloadPlayer:hover .titlebar{
	background:rgba(0,0,0,.66);
}

#preloadPlayer.small:hover .titlebar{padding-top:16px;}
#preloadPlayer.medium:hover .titlebar{padding-top:18px;}
#preloadPlayer.large:hover .titlebar{padding-top:20px;}




#preloadPlayer.medium .titlebar,
#preloadPlayer.large .titlebar {padding-right:15px;}

#preloadPlayer .titlebar:after{
	display:block;
	content:'';
	clear:both;
	overflow:hidden;
}

#preloadPlayer .titlebar .title{
	color:#fff;
	font-size:15px;
	font-weight:300;
	
	line-height:1;
}

#preloadPlayer.medium .titlebar .title,
#preloadPlayer.large .titlebar .title {margin-bottom:28px;}

#preloadPlayer.small .titlebar .title {font-size:13px; float:left;}
#preloadPlayer.medium .titlebar .title {font-size:16px;}
#preloadPlayer.large .titlebar .title {font-size:20px;line-height:24px;}
#preloadPlayer.large .titlebar .title.fs16 {font-size:16px;line-height:20px;}
#preloadPlayer.large .titlebar .poster + .title {margin-left:85px;}

/*
#preloadPlayer .title:hover,
#preloadPlayer .poster:hover + .title {color:#ffcc00;}
*/

#preloadPlayer .title a{text-decoration:none;}

#preloadPlayer .poster {
	position:absolute;
	bottom:15px;
	left:15px;
}

#preloadPlayer.small .poster,
#preloadPlayer.medium .poster,
#preloadPlayer.small .info .channel {
	display:none;
}


#preloadPlayer .titlebar .channel {
	position:absolute;
	bottom:15px;
	left:15px;
	font-weight:bold;
}

#preloadPlayer.large .poster + .title + .info .channel {left:100px;}


#preloadPlayer .time{
	position:absolute;
	bottom:12px;
	right:12px;
	padding:4px;
	background:#2a2a2a;
	font-size:11px;
	font-weight:700;
	color:#fff;

	-webkit-border-radius: 3px;
    border-radius: 3px;

	z-index:1;
}

#preloadPlayer .icon-timer{
	display: inline-block;
	vertical-align:bottom;

	width:12px;
	height:12px;
	
	background-position:-80px 0px;
	opacity:0.6;
	filter: alpha(opacity=60);
}


/* --- Dimensionnement --- */
html,
body,
#preloadPlayer,
#preloadPlayer .media-meta,
#preloadPlayer .media-meta .thumbs,
#preloadPlayer .media-meta .thumbs div
{width:100%; height:100%;}

#preloadPlayer .thumbs img.visu_w_100 {width:100%; height:auto;}
#preloadPlayer .thumbs img.visu_h_100 {width:auto;	height:100%;}
#preloadPlayer .thumbs img.visu_wh_100 {width:100%;	height:100%;}


/*ERROR LOAD VIDEO*/
.errorVideo{position:relative;}
.errorVideo .msg{position:absolute; top:36%; left:0; right:0;padding:0 40px;text-align:center; font-size: 14px;color:#fff;text-align:center;}
.errorVideo img{width:100%;}

.hide{display:none!important;}



@media only screen 
and (max-width : 320px) 
and (max-height : 250px)
{
	
	#preloadPlayer.small .titlebar {
		padding: 15px 65px 15px 15px;
	}

	#preloadPlayer.small .titlebar .title {
		display:block;
		box-sizing:border-box;
		width:100%;
		overflow:hidden;
		white-space:nowrap;
		text-overflow:ellipsis;

	}
}


/* -- ADDITIONAL DUE TO NEW AD FORMATS -- */