@charset "UTF-8";

html {
	background-color: Black;
    /*background-color:#d1d1d1;*/
}

body {
    width:100%;
}


header.l-header{
    display:none;
    width:inherit;
}

header.pplive #logo {
    display:none;
}


header.pplive {
    width:320px !important;
    height:60px !important;
   background-image: url('../images/Philharmonie-320.png') !important;
	background-repeat: no-repeat;
	background-position: right 0;
    display:block !important;
}


#bgd_body {
	width: 100%;
	height: 500px;
	display: block;
	position:fixed;
	bottom:0;
	z-index: 1;
}

#contexte_03 {
	display:block;
}
#contexte_01, #contexte_02 {
	display:none;
}

#container.home {
	width:320px !important;
	height:auto;
	margin:0 auto;
	position:relative;
	z-index:2;
	color:white;
	overflow:hidden;
}

/* Nav */
nav {
	height:auto;
    margin: 10px 0 0px 5px;
}



nav ul li {
    width:320px;
	display: block;
    float:none;
    border-bottom: 1px solid #000;
}

nav ul li a {
	float:left;
	clear:both;
	border-right: none;
	border-left: none;
}

/* Masque les éléments de menu */
nav.is-closed ul{
    display:none;
}

.l-region--navigation
{
    display:none;
}

/**/
#navMobile
{
    display:none;
    height:60px;
    width:60px;
}

.sticky
{
    display:none;
}

.sticky-block-live
{
    background-color:White;
    display:block !important;
}
/*--------------*/
#banner {
    /* width:320 - (2*34) */
    width:252px;
    /*height:436 - (220+34) = 182 */ 
    height:182px;
    margin:0 5px 0 5px;
    background-color:#B3D6FD;
    background-image:url('../images/banner-320.png');
    background-repeat: no-repeat;
	background-position: left 0;
    padding: 254px 34px 0 34px;
}


#banner div h3, h2, span{
    font-size:10px;
}

#banner div h1 {
    font-size:13px;
    text-transform:uppercase;
}

#selection_banner{
    width:300px;
}

#selection_banner img.s
{
    display:block;
}

#selection_banner img.l
{
    display:none;
}

#selection_banner img.xl
{
    display:none;
}


#video {
    width:310px !important;
    height:208px;
    background-color: #b6ff00;
    float:none;
    /*clear:both;*/
   
}

#spot
{
     width:310px !important;
     height:208px !important;
}

#flash_player_home
{
    width:310px !important;
    height:208px !important;
    /*border:1px solid yellow;*/
}

#flash_player_home #poster
{
    margin:auto;
     width:310px !important;
    height:208px !important;
    /*border:1px solid yellow;*/
}




#lives {
    width:320px !important;
    height:auto;
    /*background-color: #ffd800;*/
}

#vods{
    width:320px;
    height:auto;
    
     display:block;
     margin-bottom:125px !important;
}

#lives .live {
    width:250px !important;
    height:auto;
    /*border:1px dashed red;*/
    padding:20px;
    margin: 0 15px 10px 0px;
    float:left;
}

#lives .live img{
    width:250px !important;
    height:250px !important;
    /*border:1px dashed red;*/
   
}

.live {
    width:250px !important;
    height:auto;
    /*border:1px dashed red;*/
    padding:20px;
    margin: 0 15px 10px 10px;
    float:left;
}

.live img{
   width:250px !important;
   height:auto !important;
}

.live div.bloclive
{
    width:28px !important;
    top:-30px !important;
    left:200px !important;
}

.prom1 div.live
{
    width:250px !important;
    /*height:432px;*/
    /*background-color: #b6ff00;*/
    float:none;
    margin: 0 0px 10px 0px !important;
   
}

.prom1 div.live h3
{
    float:none;
    /*height:432px;*/
    /*background-color: #b6ff00;*/
}

.prom1 div.live img
{
    width:250px !important;
    height:auto !important;
    overflow:hidden;
    /*height:432px;*/
    /*background-color: #b6ff00;*/
    float:none;
}

.prom1 div.live div.bloclive
{
    width:28px   !important;
    top:-125px !important;
    left:20px !important;
}



.prom1 .vod {
 width:250px !important;
}

.prom1 .vod img {
 width:250px !important;
}

.prom1 .vod img.bt_play  
{
    top: 110px !important;
    left: 40px !important;
    width:38px !important;
}

.vod {
    width:250px;
    height:auto;
    border:1px solid #5A5A5A;
    padding:20px;
    margin: 0 15px 10px 0px;
    float:left;
    
}

.vod img{
   width:250px;
   height:140px;
}

#vods .vod img.bt_play  
{
    top: -50px !important;
}



#prom2, #prom3
{
     width:320px !important;
     padding-top:20px;
}

#prom2 h1, #prom3 h1
{
    font-size:16pt;
    margin-bottom:8px;
}

#prom2 hr, #prom3 hr
{
    height:10px;
    margin-right:29px;
    /*width:auto !important;*/
}

#prom2 div.article, #prom3 div.article
{
    width:250px  !important;
    float:left !important;
    padding:20px;
    margin-bottom:10px;
    
}


 #prom3 div.article
 {   
     height:auto;
 }

#prom2 div.article img, #prom3 div.article img {
width: 100% !important;
border: 1px solid #5A5A5A
 /*padding: 0 20px 0 20px;*/
 }

#prom2 div.article h2, #prom3 div.article h2 {
width: auto !important;
padding: 14px 0px 0px;
}

#prom2 div.article h3, #prom3 div.article h3 ,#prom2 div.article h4, #prom3 div.article h4 ,#prom2 div.article p, #prom3 div.article p{
width: auto !important;
padding: 14px 0px 0px;
}


#prom2 div.article hr, #prom3 div.article hr
{
    padding: 6px 0px 0px 0px;
    margin: 0px 0px 0px 0px;
}

#prom3 div.article img
{
    width:245px !important;
    height:auto !important;
}

/**/

#suggestions, #results
{
   /*width:320px;*/
   width:245px;
   padding-top:20px;
   clear:both;
}

#suggestions ul.suggestion{
    background-color:red;

}


#suggestion h1, #results h1
{
    text-transform:uppercase;
    font-size:16pt;
    margin:0 7px 22px 0;
    float:left;
}

#suggestion hr, #results hr
{
    display:block;
    height:12px;
    border-top: 0;
    border-left:0;
    border-right:0;
    border-bottom: 2px solid #FFFFFF;
    margin-right:35px;
}

#suggestions ul.suggestion li, #results ul.results li {
    position:relative;
    float:left;
    width:212px !important;
    height:auto;
    margin:6px 6px 0 0 ;
    /* border: 1px solid #5A5A5A;*/
    /*background-color:#000000;*/
}

#suggestion ul.suggestion li.live, #results ul.results li.live
{
    background-color:#B3D6FC;
    width:245px !important;
    /*position:relative;
float:left;
width:228px;
height:430px;
margin:10px 10px 0 0 ;
 border: 1px solid #5A5A5A;*/
}

#suggestion ul.suggestion li.live span.live, #results ul.results li.live span.live  
{
    
    font-weight: 400;    
    background-color:#FFFFFF;
    color: #000000;
    left: 208px;
    padding: 0px 4px;
    position: absolute;
    text-transform: uppercase;
    top: 238px;
    width:24px !important;
}

#suggestions ul.suggestion li div.imgContainer
{
     /*width:210px;
     height:118px;*/
     /*width:285px;
     height:163px;*/
     background-color:#FFF;
}

#suggestions ul.suggestion li.live div.container
{
     position: relative;
}

#suggestions ul.suggestion li div.block {
   
    width: 285px;
    /*height: 157px; */
    height: 163px;
    /*
    background-color: rgba(0,0,0,0.8);
	opacity: 0.7;
	*/
   
}


#suggestion ul.suggestion li span.extrait, #results ul.results li span.extrait
{
    
font-weight: 400;    
background-color:#FFFFFF;
color: #000000;
left: 208px;
padding: 0px 4px;
position: absolute;
text-transform: uppercase;
top: 160px;
width:auto;
    
}

#suggestion ul.suggestion li.last, #results ul.results li.last {
/*position:relative;
float:left;
width:228px;
height:430px;*/
 width:245px !important;
margin-right:0px;
/*
 border: 1px solid #5A5A5A;*/
}

#suggestion ul.suggestion li img, #results ul.results li img
{
    width:245px !important;
    height:auto !important;
    margin:0 auto 16px auto;
}

#suggestion ul.suggestion li.live img, #results ul.results li.live img
{
    width:245px !important;
    height:245px !important;
    margin:0 0 16px 0;
}


#suggestion ul.suggestion li h2, #results ul.results li h2
{
     font-family: "LinotypeBrewery-Regular";
    color:#FFFFFF;
    font-size:11pt !important;
     width:230px !important;
     height:auto;
     padding:14px 10px 0 17px;
     text-transform:uppercase;
     hyphens: auto;
     -webkit-hyphens: auto;
     -moz-hyphens: auto;
     -ms-hyphens: auto;
     -o-hyphens: auto;
     
}

#suggestion ul.suggestion li h3, #results ul.results li h3
{
    font-size:10pt;
    font-family: "SourceSansPro-Regular";
    padding:0px 17px 0 17px;
    text-transform:uppercase;
    font-weight:700;
}

#suggestion ul.suggestion li hr, #results ul.results li hr
{
    margin:0px 10px 0px 17px;
    display:block;
    width:30px;
    height:13pt;
    border-top: 0;
    border-left:0;
    border-right:0;
    border-bottom: 2px solid #FFFFFF;
}

#main
{
    margin:0px;
   /* width:inherit; */
}

#main h1
{
     font-size:16pt;
}

#main h2, #main h2 span
{
     font-size:11pt;
}

#infos #playlist h3
{
    font-size:12pt;
}

#infos #playlist ul
{
    font-size:12pt;
}



#flash_player
{
    width:320px !important;
    height:192px !important;
    margin:0 !important;
    clear:both;
}


#flash_player, .page, .live_player
{
    margin:0 !important;
    width:320px !important;
    height:192px !important;
}
/*
.live_player .text
{
    margin-top:90px ! important;
    margin-left:40px !important;
}
*/
/*
.live_player .countdown
{
    margin-top:50px ! important;
    margin-left:45px !important;
}
*/

#flash_player
{
    margin-bottom: 10px !important; 
}

#infos
{
    clear:both;
}

.mentions
{
    margin: 20px 0 10px 0px;
}


video#player
{
    width:320px !important;
    height:192px !important; 
}





footer.l-footer{

    display:none !important;
}


.oto__chapterlist {
    margin:20px auto;
}


.oto__agents{
    float:none;
    width:100%;
}