

/* STYLE SURCHARGE */
.bbox{ width: auto; }

.mycontent img{ max-width: 100%; }

/* NOUVEAUX STYLES */
.top_top{ margin-bottom: 10px; position: relative; z-index: 2; }
.top_top .top_h1{ 
	font-size: 2.3em; 
	font-weight: normal; line-height: 1.3em;
	background: rgba(255,255,255,0.3); padding: 5px 10px; border-radius: 0 0 3px 3px;
	color: #FFF;
	text-align: center;
}
.top_top.hasImg .top_h1{ padding-left: 80px;}

.top_top.hasBtn .top_h1, .top_top.hasBtn #breadcrumb ul{ padding-right: 42px;}
.top_top .top_h1.r5{ border-radius: 3px; padding-bottom:10px;}
.top_top .ico{ display: block; float: left; margin: 2px 5px 0 5px; width: 40px; height: 40px; z-index: 2; } 

.top_share { position: absolute; right:3px; top: 5px; width: 32px;  }

/* BREADCRUMB */
#breadcrumb { display: block; font-size: 1.05em; background: rgba(0,0,0,.2); border-radius: 3px 3px 0 0; padding: 5px; text-align: center; }
.hasImg #breadcrumb { padding-left: 70px;}
#breadcrumb p, #breadcrumb ul, #breadcrumb ul li { display: inline; color: rgba(255,255,255,.7); }
#breadcrumb ul{ display: block; margin-left:10px; }
#breadcrumb li { padding: 0px 2px 0px 0; position: relative; }
#breadcrumb li:after { content: '»'; font-size: 2em; position: relative; top:3px; opacity: 0.6; line-height:0}
#breadcrumb li:last-child:after { content: ''; }
#breadcrumb a { padding: 0 5px 0 2px; color:rgba(255,255,255,.7) !important; text-decoration: none; }
#breadcrumb a:hover { text-decoration: underline; color: #FFF !important;}
#breadcrumb span { text-decoration: underline; }
#breadcrumb ul.w_img{ /*margin-left: 18px;*/ padding-right: 34px;}
.top_top .under_ariane{ float: left; width: 520px; padding: 10px 0 0 0; }


/* ico 32x32*/
.ico32{ width: 32px; height: 32px; display: inline-block; background: url(/design/normal/v5/ico_32x32.png)}
.ico32.print{ background-position: 0 -64px; } 	.ico32.print:hover{ background-position: -32px -64px; }
.ico32.share{ background-position: 0 -32px;} 	.ico32.share:hover{ background-position: -32px -32px;}

.top_top .img{ display: block; position: absolute; width: 70px; height: 100%; z-index: 2; overflow: hidden; 
	border-radius: 3px 0 0 3px; top:0; left: 0;
	box-shadow: 2px 0 3px rgba(0,0,0,.2);
	background-position: center center;
	background-size: cover
} 
.top_top .img a{display: block; position: relative; width: 100%; height: 100%;}
.top_top .img a em{ width: 100%; height: 15px; position: absolute; bottom:-20px; left: 0px; z-index:2; background: #FFF; text-align: center; color: #333; font-style:normal; text-decoration: none; 
	box-shadow: 0 0 8px rgba(0,0,0,.8);} 
.top_top .img a:hover em{ bottom:0px; text-decoration: none;} 

/* BOUTONS INTERFACE  */
.bouton{ display: block; color: #FFF;  font-size: 18px; padding: 10px; border-radius: 5px; text-decoration: none;
	border-left: 1px solid rgba(255,255,255,.3); border-right: 1px solid rgba(0,0,0,.3); 
	text-shadow: 1px 1px 0 rgba(0,0,0,.2); text-align: center; height: 20px;
	position: relative;  letter-spacing: -0.02em;
	border-bottom: 5px solid rgba(255,255,255,.5);
}
.bouton:hover{ padding: 17px 10px 18px 10px; top: -10px; box-shadow: inset 0 20px 20px rgba(0,0,0,.2); border-bottom: none; }
.bouton.bleu{ background: #26ABDD; }
.bouton.rose{ background: #EA67A1; }
.bouton.violet{ background: #A06C8F; }

/* IMAGES DANS LES TABLEAUX */
#mon_contenu table img{ float: left;}

/* SLIDER SMART POUR YODIBUJO */
#slider_smart{ width: 630px; height: 280px; background: #FFF; border-radius: 5px; padding: 5px; box-shadow: 1px 1px 3px rgba(0,0,0,.5); margin: 5px }

/* BOUTONS AUTOPROMO */
#btn_autopromo{ margin: 0 0 0 0; text-align:center; }

#btn_autopromo>a { margin: 0 0 20px 0; border-radius: 2px; display: block; width: 100%; position:relative; overflow: hidden; text-decoration: none; padding: 0; line-height: 0em;
	box-shadow: 1px 1px 3px rgba(0,0,0,.5);
}
#btn_autopromo>a span{ display: block; background: rgba(0,0,0,.6); color: #FFF; font-size: 1.5em; 
	position: absolute; width: 96%; padding: 2.5%; line-height: 1.3em; bottom:0px; left:-105%; 
	border-radius: 0 0 2px 2px;}
#btn_autopromo>a img{ width: 100%; border-radius:2px;}
#btn_autopromo>a em{ 
	display: block; background: rgba(0,0,0,.5);  color: #DDD; text-align:center; font-size: 1.5em; letter-spacing: -0.02em; 
	position: absolute; width: 90%; padding: 5%; top: -300px; line-height: 1.3em;
	border-radius: 2px 2px 0 0;
	}
#btn_autopromo>a:hover { /*border-radius: 75px ;*/}
#btn_autopromo>a:hover span{  /*padding: 5% 2.5%; */ left: 0; }
#btn_autopromo>a:hover em{  top:0; height: 90%;  }

/* LECTEUR DAILYMOTION / Youtube */
.dmPlayer, .ytPlayer{ line-height:0; }


/* Changement de la couleur blanche sur les fonds foncés */
.dark .top_top .top_h1, 
.dark .form_special_concours_1 .label,
.dark .box,
.dark .top_desc, .dark .top_desc a,
.dark .fiche_texte_jds, .dark .suivant_precedent a, .dark .suivant_precedent a .txt,
.dark #multipage a, .dark #breadcrumb ul li, .dark #breadcrumb ul li a,
.dark .taglist .tag
{ color: rgba(0,0,0,.6) !important; text-shadow: none !important;}
.dark #reviews{ color: #FFF !important;}


/* HACK pub DHTML */
.pub.pubDHTML{ height: 1px; position:relative; margin-top:-1px; z-index:10}

/* ACTU HOME */
.home_actu{
	display:block;
	background: #009CD7;    
	border: 0.1em solid rgba(255,255,255,.4);
	margin-bottom: 10px;
	text-decoration: none;
	color: #FFF; font-size: 1.2em;
	position: relative;
	overflow: hidden;
	padding: 0 20px 0 0;
}
.home_actu:after{ content:''; display: block; clear:both; height: 0px; }

.home_actu em{ 
	left: -200px; display: block; position: absolute; bottom: -50px; font-size: 3em; width: 0px; height: 0px; 
	border: 200px solid transparent; border-left: 200px solid rgba(0,0,0,.3);
}
.home_actu:hover em{ left:-25px; }


.home_actu img{ float: left; margin: 0 20px 0 0; width: 310px; height: 310px; }
.home_actu h2, .home_actu span, .home_actu u{ text-decoration: none; display: block; }
.home_actu u{ padding-top: 20px; text-align: right;}
.home_actu h2{ font-size: 2em; line-height: 1.1em; padding: 20px 0;}
.home_actu:hover{ background: #00729D;}

/* FACEBOOK TWITTER */
.fb_tw{ background: url(/design/normal/v5/fb_tw.png) no-repeat; width: 300px; height: 50px; position:relative; overflow: hidden; margin-top: 10px;}
.fb_tw a{ display: block; position: absolute; background: url(/design/normal/images/spacer.gif); height: 50px; width: 135px; top: 0; left: 5px; opacity: 0.5; padding-top: 50px;}
.fb_tw a.tw{ left: 160px;}


/* BIG ITEMS : bi */
.bi{ width: 100%; /*margin: 1.5%;*/ }
.bi *{ -webkit-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; line-height: 0;}
.bi li{ z-index:1; display: block; float: left; position: relative; width: 33.333%; margin: 0; /*box-shadow:inset 0 0 3px #FFF;*/}
.bi li>img{ width: 100%; }

.bi li a img{ width: 100%; border-radius: 1em; /* empty.gif */}

.bi a, 
.bi em{ display: block; position: absolute; top:0; left:2.5%;  text-decoration: none;  width: 95%; height: 95%; border-radius: 2px;  
}
.bi a{ z-index: 6; box-shadow: 2px 2px 2px rgba(0,0,0,.3)/*, inset 0 0 2px 1px rgba(255,255,255,.5);left: 2.5%;*/}
.bi em { z-index:1; background: #FFF; text-align: center; }
	
.bi em img{ position: relative; width: 100%; border-radius: 2px;  }
.bi a h2{ 
	position: absolute; left: 0px; bottom: 0px;
	border-radius: 0 0 2px 2px;
	display: block; text-align: center; padding: 5px 0;
	width: 100%;  
	text-decoration: none;
	font-weight: normal;
	letter-spacing:-0.02em;
	font-size: 1.1em; line-height:1.1em;
	text-transform: uppercase;
	z-index:3;
	max-height: 38%;
	color: #FFF; background: rgba(0,0,0,.8);
	opacity: 0;
	
}
.bi li>span { 
	display: block;
	position: absolute;
	top:0px; left:2.5%; width: 95%; border-radius: 2px 2px 0 0;
	line-height: 1em;
	background: rgba(0,0,0,.6); text-align: center; padding: 5px 0; font-size: 0.9em; color: #FFF;
	z-index: 4; text-shadow: 1px 1px 1px rgba(0,0,0,.8);
	opacity:0;
}
.computer .bi li:hover span, .computer .bi li.on span  { opacity: 1; }
.computer .bi li:hover, .computer .bi li.on{ z-index:3; transform: scale(1.2); -webkit-transform: scale(1.2); }
.computer .bi li:hover em, .computer .bi li.on em { z-index:2; box-shadow: 0 0 10px rgba(0,0,0,.8); }
.computer .bi li:hover em img, .computer .bi li.on em img{ margin: auto; }
.computer .bi li:hover a h2, .computer .bi li.on a h2{ opacity: 1; }


.bi a.editThumb{display: none; position: absolute; top:30px; left:10% !important; width: 80% !important; height: 10px !important;background: red; text-align:center; padding: 10px; z-index: 50; border-radius: 5px; box-shadow: 0 0 5px rgba(0,0,0,.8);}
.bi li:hover a.editThumb{display: block; }
.bi a.editThumb:hover{background: green; }
.bi #updThb{ position: absolute; top: 0; left: 0; width: 100%; height: 60%; background: rgba(0,0,0,.9); text-align: center; z-index: 51; padding-top: 40%; }
.bi #updThb>*{ transform: scale(0.8); -webkit-transform: scale(0.8); }

.bi a.searchThumb{display: none; position: absolute;  width: 50% !important; height: 25px !important;background: orange; text-align:center; padding: 10px 0; z-index: 50; border-radius: 5px; box-shadow: 0 0 5px rgba(0,0,0,.8); left: 25% !important; top: 120px; line-height: 1em;}
.bi li:hover a.searchThumb{display: block; }
.bi a.searchThumb:hover{background: #F60; }


/* Gros icone 66% */
.bi li.double{ width: 66.66%; }
.bi li.double.fright{ float: right;}
.bi li.cleft{ clear:left;}
.bi li.double a,
.bi li.double em{ width: 98%; height: 98%; left: 1%; }
.bi li.double:hover{ transform: scale(1.05); -webkit-transform: scale(1.05); }

.ar .bi li.double.fright{ float: left;}
.ar .bi li.cleft{ clear:right;}


.w320 .bi li.double{ width:50%;}
.w320 .bi li.cleft{ clear:none;}



/* VIDEO DANS LISTE */
.bi li.video{ width: 413px; height: 413px; float: right; overflow: hidden; background: rgba(255,255,255,.6); border-radius: 5px; position: relative;}
.bi li.video .cadre_blanc{ box-shadow: none; background: none; margin: auto; position: relative; z-index:2;}
.bi li.video a{ position: absolute; bottom: 0; width: 100%; height: 100%; z-index:1;}
.bi li.video a h2{ width: 100%;}
.bi li.video:hover{transform: none; -webkit-transform: none; -o-transform: none; -ms-transform: none; -moz-transform: none; }

/* NEW JDSTV */
.fr .bi li.video{ width: 67%; height: auto; float: right; background: none; position: relative; z-index: 0; overflow:visible}
.fr .bi li.video .cadre_blanc:after{ content:''; width: 413px; height:468px; display: block; position: absolute; top: -35px; background:url(/design/normal/v5/cadre_tv_jds.png); background-size: 100% auto; }
.fr .bi li.video .cadre_blanc{ box-shadow: none; background: none; width: 390px; height: 280px; position: absolute; z-index:2; top: -40px; left:0; }
.fr .bi li.video .cadre_blanc>div{ width: 390px; height: 290px; position: absolute; overflow:hidden; left:17px; top: 86px; background: #000;}
.fr .bi li.video .cadre_blanc>div img{ width: 100% }
.fr .bi li.video a{ display: block; position: absolute; bottom: 0px; width: 100%; height: 40px; text-align: center; z-index: 10; color: #333; background: transparent; padding-top: 323px; padding-bottom: 50px}
.fr .bi li.video a i{ display: block; font-size: 0.7em; font-style: normal;}
.fr .bi li.video:hover a{ color:#000;  }
.fr .bi li.video:hover{transform: none; -webkit-transform: none; -o-transform: none; -ms-transform: none; -moz-transform: none; }
.fr .bi li.video a:before{ content:''; display: block; background: url(/design/normal/v5/btn_video_youtube.png); width: 82px; height: 55px; position: absolute; top: 160px; left:173px; opacity: 0.7}
.fr .bi li.video a:hover:before{ opacity: 1}

.fr .bi li.video .filler{ width: 100%;}

/* Template Affiche Ciné */
.w768 .bi.affiche li{width: 25%; }
.w960 .bi.affiche li{width: 20%; }
.w320 .bi.affiche li{width: 33.3333%; }






/* Block crossing vidéo */
.videoCrossing a.tag{ text-decoration: none; display: block; border-radius: 0 0 5px 5px; font-size: 1.1em; position: relative; top: -10px; padding: 10px;}

/* jdstv */
.jdstv{ display: block; background: #21A3DC/*#493745*/; border: 1px solid rgba(255,255,255,.1); 
	box-shadow: inset 0 10px 0 rgba(255,255,255,.1), 0 0 5px rgba(0,0,0,.5); 
	border-radius: 5px; margin: 20px auto 0 auto; max-width: 300px; text-align: center;text-decoration: none; 
	padding: 10px; position: relative; font-size: 1.3em; color: #FFF; text-shadow: 1px 1px 0px rgba(0,0,0,.5);
}
.jdstv:hover{ background: #E9478D; /*#800040;*/ }

.jdstv span{ display: block; font-size: 0.7em;}
.jdstv:before{content: ''; display: block; width: 56px; height: 48px; position: absolute; top: 3px; left: -65px;
	background-image: url(/design/logo/hktv.png);
}

.synopsis{ margin: 10px auto; background: rgba(255,255,255,.15); padding: 10px; border-radius: 5px; font-size: 1.2em; line-height: 1.2em;}
.synopsis h2{ padding-bottom: 20px; font-family: 'Luckiest guy', cursive; }

.synopsis p{padding: 0 0 15px 0; }
.synopsis a{ color: #FC0; }

.synopsis li{ list-style: inherit; padding-bottom: 10px;  }
.synopsis ul, .synopsis ol{ padding-left: 40px; list-style-position: outside; }
.dark .synopsis{ text-shadow: none; }

#yodiloading{ position: fixed; z-index: 999999999; background: rgba(0,0,0,.8); top:0; left:0; width: 100%; height: 100%; }
#yodiloading>#loading,
.yodiloading
{ position: absolute; top: 48%; left: 48%; display: block;  width: 60px; height: 60px; background: url(http://static.yodicity.com/static/design/loading.gif) no-repeat center center #000; border-radius: 30px; box-shadow: 0 0 20px rgba(255,255,255,.5);
}
#yodiloading #loadingContent{ background: rgba(255,255,255,.2);display: inline-block; /* Pour connaître sa largeur*/ 
	z-index: -1; 
	border-radius: 3px;
	background: linear-gradient(transparent, rgba(255,255,255,.2) )}
#yodiloading #loadingContent h1{ color: #FFF; font-size: 0.9em; font-weight: 300; text-shadow: 1px 1px 1px rgba(0,0,0,.2);}
#loadingContent .msg{ background-color: #FFF; max-width: 300px; padding: 10px; border-radius: 3px; font-size: 1.1em; color: #777}

#loadingContent .msg.audrey{ padding: 10px 10px 10px 130px; background:url(/design/normal/images/audrey_yodimission_special.png) no-repeat top left #FFF;}
#loadingContent .msg p{ padding-top: 10px;}

#loadingContent .msg .btn{ 
	display: inline-block; padding: 5px 10px; border-radius: 5px; color:#FFF; margin: 0 5px 0 0; text-shadow: 1px 1px 1px rgba(0,0,0,.2); cursor:pointer; }
#loadingContent .msg .btn.yes{ background: #85B200; }
#loadingContent .msg .btn.yes:hover{ background: #9BCE00; }
#loadingContent .msg .btn.no{ background: #D93600;}
#loadingContent .msg .btn.no:hover{ background: #FF5F28;}


.bigBtn{ 
	display: inline-block; margin: 10px auto; padding: 0 20px; 
	position: relative; text-decoration: none; 
	background: #129ED5; border-radius: 8px; box-shadow: inset 0 -3px 0 rgba(0,0,0,.1), inset 0 5px 0 rgba(255,255,255,.2);
	border: 1px solid rgba(0,0,0,.1); color: #FFF;
	font-size: 2.4em;
}
.bigBtn:hover{ background: #E7518F; text-shadow: 1px 1px 1px rgba(255,255,255,.5); color: rgba(0,0,0,.7); }
.bigBtn.ico50{ margin-left: 50px; }

.ico50:before{ content: ""; display: block; position: absolute; bottom:0; left:-55px; background: url(/design/normal/v5/ico_50x50.png); width: 50px; height: 50px; }

.ico50.print:before{ background-position: 0 0; }
.ico50.print:hover:before{ background-position: 0 -50px; }

/* bloc theme */
#bloctheme .top_h1{ font-size: 2.2em; background: none; text-align: center;}
#bloctheme a{display: block; text-align: center;}

/* BOITES DE NOTIFICATION */
.message{ display: block; width: 60%; padding: 5%; margin: 10% auto; font-size: 1.5em; text-align: center; border-radius: 0.3em; border: 1px solid #FFF; box-shadow: 1px 1px 5px rgba(0,0,0,.4); 
	color: #FFF; text-shadow: 1px 1px 1px rgba(0,0,0,.4); }
.message span{ font-size: 0.7em; display: block; padding-top: 10px; }
.message.warning{ background: #C00; background: #C00 linear-gradient(to bottom, rgba(0,0,0,0), rgba(0,0,0,.5) ); }



/* footer */
footer{ position: relative; clear: both; width: 100%; border-top: 0.4em solid #FFF; z-index: 3; font-size: 1.1em; }
footer section{ position: relative;}
footer .c{ width: 970px; margin: auto; position: relative; padding: 1.2em 0; max-width: 100%;}
footer .c>div{ float: left; padding: 1.5%; width: 30%;}
footer .t{ display: block; color: #FFF; font-weight: normal; font-size: 1.6em; padding-bottom: 20px; text-align: center;}
footer .top{ background: #81ba28; color: rgba(0,0,0,.6); }
footer hr{ position: absolute; display: block; top:10%; height: 80%; width: 0px; border-right: 1px solid rgba(255,255,255,.3); border-left: 1px solid rgba(0,0,0,.3); left: 31%; background: none;}
footer hr.deux{ left: 69%}
footer .top p{ text-align: justify; position: relative;}
footer .top .c:before{ content:''; display: block; position: absolute; width: 280px; height: 69px; background: url(/design/normal/v5/elts_footer.png) no-repeat -624px -119px; pointer-events: none;
bottom:0; left: 136px; z-index: 5;}
footer .top .c em.hck{ display: block; position: absolute; width: 142px; height: 38px; background: url(/design/normal/v5/elts_footer.png) no-repeat -762px -81px; bottom:69px; left:272px; z-index:7; }
/* Newsletter */
footer .top .nl{  position: relative; padding: 10px; height: 213px; width: 263px !important; margin: 10px 2% 0 0; color: rgba(0,0,0,.75); 
	background: url(/design/normal/v5/elts_footer.png) no-repeat -28px -22px; }
footer .top .nl .t{ color: rgba(0,0,0,.75); font-size: 2em; text-align: left;}
footer .top .nl form{margin-top: 20px;}
footer .top .nl label{display: block; font-size: 1.4em; padding-bottom: 5px;}
footer .top .nl form input{display: block;float: left; margin: 0; height: 28px; /*padding: 2px;*/ }
footer .top .nl form input[type=text]{ width: 79%; padding: 0 2%; border:1px solid #999; border-right:none; background: #DDD;}
footer .top .nl form input[type=submit]{background: rgba(0,0,0,.75); color: #FFF; border: none; padding: 3%; border-radius: 0 5px 5px 0; height: 30px;}
footer .top .nl form input[type=submit]:hover{background: rgba(0,0,0,.9); }
footer .nl:before, footer .nl:after{ content:''; display: block; position: absolute; width: 70px; height: 72px; background: url(/design/normal/v5/elts_footer.png) no-repeat -812px -188px; pointer-events: none;}
footer .nl:before{ top: -27px; right: -27px;}
footer .nl:after{ bottom: -5px; left: -27px; z-index: 0}
/*champs cachés */
footer .top .nl .inscription{  position: absolute; left: -1500px; }

/* texte */
footer .top .txt{ position: relative; width: 35%; z-index:8;}
footer .top .txt a{ color:rgba(0,0,0,.8); text-decoration: none;}
footer .top .txt a:hover{ text-decoration: underline}

/* Exceptions Langues */
.ar footer .top, .pt footer .top{ display: none;}

/* Liens utiles */
footer .linx{ background: #16120D; color: rgba(255,255,255,.7); text-align: center;}

footer .linx ul{ display: inline-block; margin-left: 10px;}
footer .linx li{ display: inline-block; margin: 0 10px 0 10px;}
footer .linx li a{ color: rgba(255,255,255,.8);}
footer .linx li a:hover{ text-decoration: underline;}


/* Liens */
footer .top .lnk{ background: url(/design/normal/v5/elts_footer.png) no-repeat -338px 0px; width: 286px!important; height: 289px; padding:0; position: absolute; right:0; bottom:0; overflow:hidden}
footer .lnk .t{ color: rgba(0,0,0,.8); padding-top: 50px; text-shadow: 0 0 4px #FFF; }
footer .lnk a{ display: block; height: 50px; padding-left: 85px; color: rgba(0,0,0,.8); text-align: left; font-size: 1.1em; text-decoration: none; position: relative;}
footer .lnk a:hover{ text-decoration: underline; }
footer .lnk a:before{ content:''; display: block; height: 55px; width: 47px; position: absolute; top:-17px; left:30px; background: url(/design/normal/v5/elts_footer.png) no-repeat; 
	transition: all 0.3s ease-in-out; 
}
footer .lnk a.app:before{ background-position: -1063px 0; }
footer .lnk a.fb:before{ background-position: -1063px -55px; }
footer .lnk a.tw:before{ background-position: -1063px -110px; }
footer .lnk a:hover:before{ -ms-transform:rotate(-352deg); transform:rotate(-352deg); /* BUG CHROME : Le texte bouge de partout */ }

/* BOTTOM */
footer .bottom{ background: url(/design/normal/v5/elts_footer.png) repeat-x center -299px #2D241A; /*border-top: 0.5em solid rgba(0,0,0,.5);*/ color: #FFF; text-align: center;}

/* lang */
footer .lang ul{ display: table; margin: auto; margin-bottom: 15px;}
footer .lang ul li{ display: block; float: left; overflow: hidden; width: 40px; height: 40px; margin: 3px }
footer .lang a{ display: block; width: 40px; height: 40px; margin: 0; background: url(/design/normal/v5/elts_footer.png) no-repeat; text-decoration: none; text-indent: -1000em;}
footer .lang a.fr{ background-position: -624px 0; }
footer .lang a.fr:hover{ background-position: -624px -41px; }
footer .lang a.en{ background-position: -664px 0; }
footer .lang a.en:hover{ background-position: -664px -41px; }
footer .lang a.es{ background-position: -704px 0; }
footer .lang a.es:hover{ background-position: -704px -41px; }
footer .lang a.cn{ background-position: -744px 0; }
footer .lang a.cn:hover{ background-position: -744px -41px; }
footer .lang a.de{ background-position: -784px 0; }
footer .lang a.de:hover{ background-position: -784px -41px; }
footer .lang a.pt{ background-position: -824px 0; }
footer .lang a.pt:hover{ background-position: -824px -41px; }
footer .lang a.ar{ background-position: -864px 0; }
footer .lang a.ar:hover{ background-position: -864px -41px; }
footer .lang .t{ padding: 0;}

/* yodicity */
footer .yodi .logo{
	display: block; overflow: hidden; text-indent: -1000em; margin: 0 auto 8px auto; 
	width: 157px; height:  64px; background: url(/design/normal/v5/elts_footer.png) no-repeat -904px -166px;
}
footer .yodi .logo:hover{ background-position: -904px -230px; }
/* JeProgresse */
footer .jpg { position: relative; top: -20px;}
footer .jpg .logo{
	display: block; overflow: hidden; text-indent: -1000em; margin: 0 auto 8px auto; 
	width: 159px; height: 83px; background: url(/design/normal/v5/elts_footer.png) no-repeat -904px 0px;
}
footer .jpg .logo:hover{ background-position: -904px -83px; }

/* COBA */
footer .cbl{ display: block; background: #000; overflow: hidden; text-indent: -1000em;height: 33px; }
footer .cbl:before{ content:''; display: block; height: 16px; width: 146px; background: url(/design/normal/v5/elts_footer.png) no-repeat -666px -233px; margin: 10px auto;}

/* NOMBRE DE COLONNES DU FOOTER */
footer section.e1 .c:before{ display: none!important;}
footer section.e1 .hck{ display: none !important;}
footer section.e1>div>div{  padding: 1.5% 0; float: none; margin: auto;}
footer section.top.e1>div>div{ width: 60% !important; }
footer section.e1>div>div{ width: 100% !important; }
footer section.e1 hr{ display: none;}
.w768 footer section.e2 .c>div,
.w960 footer section.e2 .c>div{ width: 47%; float: left !important; clear: none!important;}


/* FULLSCREEN */
#mac{ position: fixed; background: url(/e.gif) #fff; display:none; width:10px; height: 10px; z-index: 100000}	
#mac. iframe{ position: relative;width: 100%; height: 100%; border:0; margin:0; padding:0; overflow:hidden;}	
#mac #close{ position: fixed; top:0; right:0; display: block; width:125px; height:114px; background:url(/templates/coloriages/imgs/fermer.png) no-repeat; text-align:center; color:#FFF; overflow:hidden;z-index: 10; cursor:pointer; }
#mac #close:hover{ color: #FC0; transform:scale(1.1); -webkit-transform:scale(1.1);}
#mac #close a{ display: block; padding-top: 80px; }
#mac #content{ width: 100%; height: 100%; overflow: hidden; position: fixed; z-index:9;}

/* Gestion Pub */
body.nopub .pub{ display: none; }

/* Image de fond animée sur le Body */
body.animBg{
	-webkit-animation: bgImageAppearFromTop 5s ease; /* Chrome, Safari, Opera */
	animation: bgImageAppearFromTop 5s ease;	
}
@-webkit-keyframes bgImageAppearFromTop {
    from {background-position: 50% -100%; }
    to {background-position: 50% 0;}
}

/* Standard syntax */
@keyframes bgImageAppearFromTop {
	from {background-position: 50% -600px;}
	to {background-position: 50% 0;}
}

/* CROSSING VIDEO INLIST */
ul.inlistVideo{ position: relative; }
ul.inlistVideo li:nth-child(8), ul.inlistVideo li:nth-child(9){ clear: both; }
ul.inlistVideo li.vid{ 
	position: absolute; top:437px; right: 17px; height: 421px; width: 421px; cursor: default; 
	background: url(/design/normal/v5/motif.png) no-repeat transparent; 
	overflow: hidden;
}
.ar ul.inlistVideo li.vid{ right: inherit; left: 17px; }
.bi li.vid{ 
	position: relative; width: 100%; cursor: default; 
	/*background: url(/design/normal/v5/motif.png) no-repeat transparent; */
	z-index: 3; clear: both; 
	
}
.bi li.vid:hover{ -webkit-transform: none; transform: none; }


.bi li.vid .top_top{ margin: 0; }
.bi li.vid .top_h1{ padding: 10px !important; background: rgba(0,0,0,.1); text-align: center; margin: 0 10px 0 10px; border-radius: 5px 5px 0 0; }
.bi li.vid .box{ background: none !important; margin: 0; }
.bi li.vid a{ display: block; line-height: 1.2em; width: 100%; padding-left:0; padding-right: 0; left:0}
.bi li.vid section{ }
.bi li.vid section center{ padding: 0 5px 5px 5px !important; }



/* PAS SUR MOBILE */
.w320 ul.inlistVideo li:nth-child(8), .w320 ul.inlistVideo li:nth-child(9),
.w480 ul.inlistVideo li:nth-child(8), .w480 ul.inlistVideo li:nth-child(9){ clear: none; }
.w320 ul.inlistVideo li.vid, .w480 ul.inlistVideo li.vid{ display: none; }

.jdsLecteurVideo *{line-height:0;}
.jdsLecteurVideo>center>div{min-height: 150px !important;}

.jdsLecteurVideo object, .jdsLecteurVideo .JDSwrapper{top:0; left:0;}

/* HrefLang */
#HKhrefLang{ display:none; }
#HKhrefLang.show{ display:block; padding: 2% 2% 0 2%; text-align: right;}
#HKhrefLang.show>a{ display:inline-block; padding: 5px 5px 5px 30px; background: rgba(0,0,0,.15); border-radius: 3px; color: #FFF; text-decoration:none; position:relative; }
#HKhrefLang.show>a:hover{ background: rgba(0,0,0,.3); }
#HKhrefLang.show>a:before{ content:''; display: block; position: absolute; top: 6px; left: 5px; width: 16px; height: 11px; background:url(/design/normal/v5/langues.png) no-repeat; }
#HKhrefLang.show>a:hover:before{ transform:scale(1.3); }
#HKhrefLang.show>a.tofr:before{ background-position: 0 0; }
#HKhrefLang.show>a.toes:before{ background-position: 0 -11px; }
#HKhrefLang.show>a.toen:before{ background-position: 0 -22px; }
#HKhrefLang.show>a.tobr:before{ background-position: 0 -33px; }
#HKhrefLang.show>a.tode:before{ background-position: 0 -44px; }
#HKhrefLang.show>a.toar:before{ background-position: 0 -55px; }

#HKhrefLang.splash{display: block; position:relative; font-size: 2em; text-align: center; padding: 120px 0 0 160px; background: url(/design/normal/images/alert_inf.png) no-repeat top left; 
	width:300px; min-height: 100px; }
#HKhrefLang.splash:before{content: ''; display: block; position: absolute; top: 0; right: 50px; width: 225px; height: 121px; background: url(/design/logo/en.png); transform: scale(0.8);  }

.w480 #HKhrefLang.splash, .w320 #HKhrefLang.splash{ padding: 0; background: none; width:100%; min-height: 100px; }	
.w480 #HKhrefLang.splash:before, .w320 #HKhrefLang.splash:before{position: relative; top: inherit; right: inherit; margin: auto; }


#HKhrefLang.splash>a{ text-decoration: none; color:#333; cursor: pointer;}
#HKhrefLang.splash>a span{ display: block; font-size: 1.2em; margin: 5% 20%; padding: 5px; 
	background: #0799D3; border-radius: 5px; color: #FFF; letter-spacing: -0.02em;
	text-shadow: 1px 1px 1px rgba(0,0,0,.2);
}
#HKhrefLang.splash>a:hover span{ background: #E7518F; }

.taglist{ clear: both; text-align: center; padding: 10px 0 5px 0; margin: 10px 0; border: 1px dotted rgba(255,255,255,.3); border-left: none; border-right: none;}
.taglist a{ text-decoration: none; text-shadow: none; /*padding: 5px 7px;*/ }
.taglist:before{ content: attr(data-legend); padding: 0 10px 0 0; /*text-shadow: 1px 1px 2px rgba(0,0,0,.3);*/ font-family: 'Luckiest guy', cursive; font-size: 1.2em;}

#siteDesc{ background: #81BA28/*#009CD7*/; color: #FFF;  font-size: 1em; clear:both;}
#siteDesc .top_h1{ font-size: 2em; line-height: 1em; text-align: center;  background: rgba(0,0,0,.2);}

#headOfContent{ position: relative; clear:both; margin-bottom: 20px;}
.w960.fullWidthVideo #myMainVideo.carre{ max-width: 60%; background: #000;padding:0 20%;}

/* Liste verticale */
#HKverticalList{ position: relative; float: right; width: 200px;  }
.w320 #HKverticalList{ float: none; width: 100%;  }
.w320 #HKverticalList .bi{ margin: 0; padding-top: 10px; clear: both; }
#HKverticalList .bi li{ width:100%; overflow: hidden;}
#HKverticalList li.contenuVideo>img{ width:60%;}
#HKverticalList li.contenuVideo em{ height:94%;}
#HKverticalList li.contenuVideo h2{ top: 0; background: rgba(0,0,0,.8); padding: 2%; width: 96%;  }
.computer #HKverticalList li.contenuVideo h2{ opacity: 0; }
.computer #HKverticalList li.contenuVideo:hover h2{ opacity: 1; }
li.contenuVideo em{overflow: hidden}

/* PUB QUANTUM ADVERTIZING */
div.pub.quantum{width: 100%; display: block; position: relative; margin: 10px 0;}

li.pub.quantum{width: 100%; display: block; position: relative; margin: 0 0 20px 0; clear: both;}
li.pub.quantum:hover{ -webkit-transform: none; -moz-transform: none; -o-transform: none; -ms-transform: none; transform: none;}
/* A rétablit plus tard (fin de tests) : .pub.quantum:after{ display: none;}*/

.pub.quantum{ min-height: 230px; background: rgba(0,0,0,.1);}
.pub.quantum:before{ content:"QUANTUM NATIVE"; display: block; padding: 20px; color: rgba(255,255,255,.6); text-align: center; }
.pub.quantum:after{ content:""; display: block; position: absolute; width: 100%; height: 100%; top:-1px; left:-1px; border: 1px dashed rgba(255,255,255,.2); padding: 0;} 

#HKoverall{ position: fixed; z-index: 9999999999999999999999; width: 100%; height: 100%; background:rgba(0,0,0,.9); text-align: center; top:0; left:0;}
#HKoverall iframe{ position: relative; width: 90%; margin: 5% auto; border:none; border-radius: 10px; }
#HKoverall iframe.avatar{ max-width: 500px; height: 90%;}

#ads{display: block; width: 2px; height: 2px; background: red; position: fixed; bottom: 0; right:0; z-index: 999999; pointer-events:none;}

/* addon-tagged-page */
#addon-tagged-page{ padding: 10px;  }
#addon-tagged-page img{ max-width: 100%; border-radius: 3px; box-shadow: 1px 1px 2px rgba(0,0,0,.5); }
#addon-tagged-page a:hover{ display: block; transform:scale(0.98); }

.autopromofab{border: none; border-radius: 4px; margin: 1%; clear: both; height: 300px; width: 98%; overflow:hidden; box-shadow: 0 0 1px 0 rgba(255,255,255,.5); }
.w320 .autopromofab, .w480 .autopromofab{margin: 2%; width: 96%; }