@charset "UTF-8";

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

body
{
    padding: 0 20px 0 20px !important;
}

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


header.l-header{
    display:none;
}


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

header.pplive #logo 
{
    display:none;
}

header.pplive #Live 
{
    display:none;
}



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

#container {
	width:768px;
	height:auto;
	margin:0 auto;
	position:relative;
	z-index:2;
}

/* Nav */

nav {
    width: 768px;
    height: 50px;
    display: block;
    position: relative;
    margin: 10px 0 10px 0;
    padding: 0;
    list-style: 0;
    /*overflow:hidden;*/
    /*background-color:#0CC;*/
}

    nav ul {
        width: 100%;
    }

        nav ul li {
            /*display: table-cell;*/
            display: inline;
            margin-right: 10px;
            height: 50px;
            width: 115px;
            float: left;
            background-color: #B3D6FC; /*#BFBFBF*/
        }

            nav ul li:last-child {
                /*display: table-cell;*/
                margin-right: 0;
            }

            nav ul li a {
                width: 100%;
                display: block;
                /*display:inline-block;*/
                /*display:inline-table;
	/*
	border: 1px solid #FFF;
	border-right: 1px solid #022777;
	border-bottom: 1px solid #022777;*/
                font-size: 14px;
                line-height: 50px;
                text-transform: uppercase;
                text-align: center;
            }

            nav ul li:first-child a {
            }

            nav ul li:last-child a {
                /*margin-right:0*/
            }

.smenu {
    /*display:none;*/
   /* background-color:aqua;*/
    position:relative;
    /*top: 1px;*/
    /*left:0px;*/
    width: auto;
    height: auto;
    z-index: 1000;
}

    .smenu.masked {
        display: none;
    }

    .smenu.visible {
        display: block;
    }

    .smenu ul {
        width: 600px;
        display: block;
        list-style-position: outside;
        list-style-type: disc;
    }

        .smenu ul li {
            list-style: none outside none;
            font: normal 13px Arial, Helvetica, sans-serif;
            line-height: 22px;
            width: 300px;
            line-height: 22px;
            text-align: left;
            float: left;
        }

            .smenu ul li a {
                font: normal 13px Arial, Helvetica, sans-serif;
                text-transform: none;
                width:auto;
                float:left;
                text-align: left;
                background-color:red;
            }

             .smenu ul li span {
                font: normal 13px Arial, Helvetica, sans-serif;
                text-transform: none;
            }

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

#banner {
    /*width:768px; - marge */
    width:362px;
    height:218px;
    background-color:#B3D6FD;
    background-image:url('../images/banner-384.png');
    background-repeat: no-repeat;
	background-position: left 0;
    padding:12px 0 0 406px;
}


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

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

#video {
    width:768px;
    height:432px;
    background-color: #b6ff00;
    float:none;
    /*clear:both;*/
   
}

#flash_player_home
{
    width:768px;
    height:432px;
    /*border:1px solid yellow;*/
}

#flash_player_home #poster
{
    margin:auto;
    /*border:1px solid yellow;*/
}


#prom1
{
    width:768px;
    height:432px;
    /*background-color: #b6ff00;*/
    float:none;
}

#spot
{
     width:720px;
     height:406px;
}

#lives {
    width:768px;
    height:250px;
    /*background-color: #ffd800;*/
    float:none;
}

#vods
{
    padding-top:30px;
    margin: 30px 0 0 0;
      clear:both;
    width:768px;
/*    height:150px;*/
     display:block;
         float:none;
}

#lives .live {
    width:376px !important;
    /*height:150px;*/
    height:auto;
    /*border:1px dashed red;*/
    float:left;
    margin-right:6px !important;
}

#lives .live img {
    width: 376px !important;
    height: 376px !important;
}

#lives .live:last-child{
    margin-right:0  !important;
}

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

.prom1 
{
    width:100% !important;
    /*height:432px;*/
    background-color: #b6ff00;
    float:none;
}


.prom1 .vod{
     width:100%  !important;
}
.prom1 .vod img
{
    width:100%  !important;
    height:auto !important;
    /*height:432px;*/
    /*background-color: #b6ff00;*/
    float:none;
}
.prom1 .vod a img.bt_play { 
    left: 14px;
    position: absolute;
    top: 300px;
    width:38px !important;
    height:38px !important;
    border:none;
}

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

.direct{
	width:200px;
 	height:24px;
 	font-size:12px;
 	line-height:24px;
 	margin:auto 10px 10px 10px;
 	padding:0 0 0 24px;
 	background-color:#B3D6FC;
 	position:relative;
 	top: -40px;
 	z-index:1000;
 	background-image:url('../images/clock.png');
 	background-position: top left;
 	background-repeat: no-repeat;
 	color:black;

}

.vod 
{
  
    width:378px;
    /*height:120px;*/
    /*border:1px dashed lime;*/
   margin-right:6px !important;
    float:left;
}

.vod img {
   width:374px;
   height:auto;
}

.prom1 .vod img.bt_play  
{
    top: -300px;
}

#lives hr
{
    border:hidden;
    margin:0;
    clear:both;
}

.btLive
{
    /*clear:left;*/
    /*display:none  !important;*/
}

.btVod
{
    clear:right !important; /*display:none  !important;*/
}

#prom2 div.article, #prom3 div.article
{
    width:24%  !important;
      /*width:184px  !important;*/
    float:left !important;
}

#prom3 div.last  
{
    clear:right !important;
    float:left !important;
/*clear: right !important;
float:right !important;*/
    /*margin: 0px 1px 10px 0px !important;*/
}


/*#prom2 div.article img
{
    width:100%  !important;
    height:184px  !important;
    
}
    */

#prom2 div.article img, #prom3 div.article img
{
    width:100%  !important;
    height:auto  !important;
    
}


#prom2 div.article h2, #prom3 div.article h2 
{
    width:150px  !important;
}


footer
{
    visibility:hidden;
    width:768px !important;
    background-color:#000000 !important;
}

#footer
{
    /*background-color:Yellow !important;*/
}

header.l-header
{
    width:768px !important;
}

#banner
{
    display:none;
}

#selection_banner img.s
{
    display:none;
}

#selection_banner img.l
{
    display:block;
}

#selection_banner img.xl
{
    display:none;
}


/*results*/
/* Suggestions / Results */

#suggestion, #results
{
   width:768px;
   clear:both;
}


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

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

#suggestion ul.suggestion, #results ul.results 
{
    clear:both;
}

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

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

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

#suggestion ul.suggestion li img.bt_play, #results ul.results li img.bt_play { 
left: 14px;
position: absolute;
top: 100px;
width:38px !important;
height:38px !important;
}

#suggestion ul.suggestion li, #results ul.results li {
position:relative;
float:left;
width:184px !important;
height:430px;
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;
    /*position:relative;
float:left;
width:228px;
height:430px;
margin:10px 10px 0 0 ;
 border: 1px solid #5A5A5A;*/
}



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


#suggestion ul.suggestion li.live span, #results ul.results li.live span 
{
    font-size:10pt;
    font-family: "SourceSansPro-Regular";
    color:#000000;
    
}

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





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


#suggestion div.article
{
    width:230px; /*230 - (17+17)*/
    height:395px;
    border: 1px solid #5A5A5A;
    margin:0 7px 30px 0;
    float:left;
}

#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;
}



#suggestion ul.suggestion li h2, #results ul.results li h2
{
     font-family: "LinotypeBrewery-Regular";
    color:#FFFFFF;
    font-size:11pt !important;
     width:160px !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:32px 17px 0 17px;
    text-transform:uppercase;
    font-weight:700;
}

#suggestion ul.suggestion li h4, #results ul.results li h4
{
    font-size:10pt;
    padding:16px 17px 0 17px;
    font-weight:700;
    
}
#suggestion ul.suggestion li h4:first-letter, #results ul.results li h4:first-letter {
    text-transform: uppercase;
}

#suggestion ul.suggestion li p, #results ul.results li p
{
    font-size:10pt;
    padding:16px 17px 0 17px;
}

#suggestion ul.suggestion li.live h2, #results ul.results li.live h2
{
    margin:0;
/*    font-family:title2; */
    color:#000000;
    font-size:13pt;
     height:auto;
     padding:0 10px 0 17px;
/*     padding:4px 10px 0 17px;*/
     text-transform:uppercase;
     hyphens: auto;
     -webkit-hyphens: auto;
     -moz-hyphens: auto;
     -ms-hyphens: auto;
     -o-hyphens: auto;     
}


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

#suggestion ul.suggestion li.live h4, #results ul.results li.live h4
{
    color:#000000;
}


.mentions
{
    width:768px;
    margin:0 0 0 0 !important;
}


.ticket
{
    margin:0 48px 10px 23px !important;
}

#charlie
{

    margin:0 0 0 0;
    height:60px !important;
    width:auto;
}
#charlie img
{
    height:60px;
}


#flash_player, .page, .live_player
{
    margin:0 !important;
    width:720px !important;
    height:406px !important;
}

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

/*
.live_player .text
{
    margin-top:260px ! important;
    margin-left:170px !important;
    width:380px !important;
    
}
*/
/*
.live_player .countdown
{
    margin-top:170px ! important;
    margin-left:245px !important;
}
*/

video#player
{
    width:720px;
    height:406px; 
}


footer
{
    clear:both;
}
/*
.page
{
    width:720px !important;
    height:406px !important;
}
.live_player
{
    width:720px !important;
    height:406px !important;
}
*/