/* BSO 2011 */
/*****************/

body{
background:url(/images/bso2011/footer_fond.gif) repeat-x 0 bottom #00a3d8!important;
width:100%;
height:100%;
}

#page-content{
background:#00a3d8;
}

#global-container,
#page-content{
margin-top:0;
margin-left:0;
width:100%;
padding:0;
}

#BSO_2011{
background:url(/images/bso2011/header.gif) no-repeat -2px 0 #00a3d8;
margin: 0 auto;
width: 970px;
padding:0 10px;
}


#BSO_2011 .corps{
padding-bottom: 40px;
}


/**HEADER **/

#BSO_2011 #header{
height:200px;
width:960px;
position:relative;
}



#BSO_2011 a#bandeau span{
display:none;
}


#BSO_2011 a#bandeau{
display:block;
height:200px;
width:960px;
}

#BSO_2011 #menu{
position:absolute;
bottom:0;
width:960px;
}

#BSO_2011 #menu div a{
background:url(/images/bso2011/fond_onglets.gif) repeat-x 0 -43px #00a3d8;
height:45px;
width:200px;
color:#fff;
font-size:1.4em;
text-transform:uppercase;
float:left;
margin-right:15px;
text-align:center;
border:1px solid #158acd;
border-bottom:0;
}

#BSO_2011 #menu div a span{
display:block;
margin:10px;
}

#BSO_2011 #menu div a:hover{
background-position:0 bottom;
text-decoration:none;
}

#BSO_2011 #menu div a.actif{
background:#fff;
color:#005f7e;
border-color:#fff;

}

#BSO_2011 #menu div#accueil a{
width:45px;
height:45px;
background:url(/images/bso2011/accueil.gif) no-repeat 13px 5px ;
border:0;
}


#BSO_2011 #menu div#accueil a:hover,
#BSO_2011 #menu div#accueil a.actif{
background-position:13px -50px;
}

#BSO_2011 #menu div#accueil span{
display:none;
}

/** FOOTER **/

#footer{
float:left;
margin-top:20px;
background:url(/images/bso2011/footer_fond.gif) repeat-x;
height:170px;
text-align:center;
}

#footer-content{
background:url(/images/bso2011/footer.gif) no-repeat ;
height:170px;
width:970px;
padding:0;
}

#footer-content p{
padding:1em;
font-size:1.6em;
line-height:1.4em;
float:left;
}

#footer-content a{
color:#fff;
font-weight:bold;
display:inline;
}

/** PAGE **/

#BSO_2011 #two-zones{
width:960px;
}

#BSO_2011 #two-zones-first{
background:#fff;
min-height:350px;
width:700px;
float:left;
margin-right:20px;
margin-bottom:1em;
}

#BSO_2011 #two-zones-first-content{
margin:20px;
}


#BSO_2011 #two-zones-second{
width:240px;
float:left;
}

#BSO_2011 .corps .legende{
padding-bottom:1em;
}

#fin_contenu{
display:none;
}


/** MENU INTERNE **/

#BSO_2011 .portlet-child_page{
border-bottom:1px solid #ccc;
padding-bottom:10px;
margin-bottom:10px;
}

#BSO_2011 .portlet-child_page ul.navigation li a{
float:left;
display:block;
height:20px;
width:160px;
padding:5px 5px 5px 0;
font-size:1.4em;
}


#BSO_2011 .portlet-child_page ul.menu li{
margin:26px 0 0 0!important;
width:100%; /*IE6*/
float:left;
width:302px;
background:#eee;
padding:10px;
border-bottom:1px solid #ccc;
}


#BSO_2011 .portlet-child_page ul.menu li.pair{
margin:26px 13px 15px 0!important;
clear:left!important;
}

#BSO_2011 .portlet-child_page ul.menu li a{
float:none;
color:#00a3d8;
font-size:1.5em;
width:auto;
height:auto;
line-height:1.2em;
padding:0;
text-transform:uppercase;

}

#BSO_2011 .portlet-child_page ul.menu li p{
font-size:1.1em;
margin-top:.2em;
}

#BSO_2011 .portlet-child_page ul.menu li a.image{
float:left;
height:100px;
width:150px;
margin:0 15px 10px 0;
}

#BSO_2011 .portlet-child_page ul.navigation li.actif a,
#BSO_2011 .portlet-child_page ul.navigation li a:hover{
color:#00a3d8;
}


/** ARTICLE ACCUEIL **/


#BSO_2011 .article_accueil h1{
margin-top:15px;
font-size:2.5em;
}

#BSO_2011 .article_accueil .attention{
background:#fff;
padding:0;
}


#BSO_2011 .article_accueil  #menu_intro{
margin:2em 0;
}

#BSO_2011 .article_accueil  #menu_intro li{
border-bottom:1px solid #ccc;

background:#eee;
margin:1em 0;
background:url(/images/bso2011/fond_onglets.gif) no-repeat 0 0px #eee;
}

#BSO_2011 .article_accueil #menu_intro li p{
padding:10px;

}

#BSO_2011 .article_accueil #menu_intro a{
font-size:1.5em;
}

#BSO_2011 .article_accueil h3{
clear:both;
}



/** PORTLETS COL 2 **/

#BSO_2011 .portlet{
margin-bottom:1em;
}

#BSO_2011 h3.portlet-header{
font-size:1.3em;
color:#fff;
font-weight:bold;
}

/** AGENDA **/

#BSO_2011 .agenda_col2 .portlet-content li{
border-bottom:1px solid #ccc;
}

#BSO_2011 .agenda_col2 .portlet-content p{
background:#fff;
padding:10px 13px;
}

#BSO_2011 .agenda_col2 .portlet-content p strong{
font-size:1.1em;
}

#BSO_2011 .agenda_col2 .portlet-content .date,
#BSO_2011 .agenda_col1 .portlet-content .date{
text-transform:uppercase;
font-weight:bold;
}

#BSO_2011 .agenda_col2 .portlet-content a{
color:#00a3d8;
}

#BSO_2011 .agenda_col1 .portlet-content th,
#BSO_2011 .agenda_col1 .portlet-content td{
width:200px;
padding:5px 0;
border-bottom:1px solid #ccc;
}

#BSO_2011 .agenda_col1 .portlet-content a{
color:#00a3d8;
}

#BSO_2011 .agenda_col2 .portlet-content p.tout{
background-color:#005b26;
}

#BSO_2011 .agenda_col2 .portlet-content p.tout a{
color:#fff;
text-transform:uppercase;
}

#BSO_2011 .agenda_col1 .portlet-content strong{
font-size:1.3em;
}

/** GALERIE ALEATOIRE **/

.pif .portlet-content{
background:#e42722!important;
}

.pif #navigation{
padding:4px;
}

.pif #navigation .liste li{
float:left;
}

.pif #navigation a {
display:block;
background:#fff;
height:17px!important;
width:16px!important;
margin:5px;
background:url('http://www.bobigny.fr/images/bso_sprite.gif') no-repeat -8px -7px ;
}

.pif #navigation a.on,
.pif #navigation a:hover{
background:url('http://www.bobigny.fr/images/bso_sprite.gif') no-repeat -8px -31px ;
}

.pif #navigation a span{
display:none;
}

.pif #affichage {
padding:0!important;
}

.pif #image img {
display:block;
width:100%;
height:auto!important;
}

/** CINOCHE **/

.cinoche li{
clear:both!important;
}

.cinoche li img{
padding-bottom:1em;
}

.cinoche .date{
text-transform:uppercase;
}

.cinoche strong{
font-size:1.2em;
}

/** PLAN PARC **/

#plan_parc #plan{
margin-top:1em;
position:relative;
}

#plan_parc #plan a{
display:block;
position:absolute;
background:#fff;
}

#plan_parc #plan span{
display:none;
}

#plan_parc #legende #close{
position:absolute;
right:10px;
top:10px;
font-size:1.5em;
}

#plan_parc #legende #close:hover{
text-decoration:none;
color:#000;
}

#plan_parc a#bouton_peniche_acc{
bottom:45px;left:110px;
width:60px;height:40px;
}

#plan_parc a#bouton_pergola{
bottom:120px;left:140px;
width:100px;height:35px;
}

#plan_parc a#bouton_criee{
bottom:105px;left:260px;
width:100px;height:58px;
}

#plan_parc a#bouton_peniche{
bottom:55px;left:290px;
width:110px;height:35px;
}

#plan_parc a#bouton_crique{
bottom:85px;left:80px;
width:50px;height:60px;
}

#plan_parc a#bouton_plage{
bottom:90px;right:145px;
width:100px;height:60px;
}

#plan_parc a#bouton_natte{
bottom:165px;left:120px;
width:100px;height:90px;
}

#plan_parc a#bouton_arene{
bottom:100px;right:40px;
width:80px;height:90px;
}

/** MOBILE **/

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

#BSO_2011,
#footer-content,
#BSO_2011 #header,
#BSO_2011 #menu,
#BSO_2011 #two-zones,
#BSO_2011 #two-zones-first,
#BSO_2011 #two-zones-second,
#BSO_2011 #menu div a,
#BSO_2011 .portlet-child_page ul.menu li{
width:100%!important;
}

#BSO_2011 #header{
height:320px;
}

#global-container{
padding:0 10px!important;
margin:0 10px!important;
width:auto!important;
}

#BSO_2011{
padding:0;
}

#BSO_2011 #two-zones-first .float_right{
margin-top:1em;
max-width:50%!important;
}

#BSO_2011 #menu div#accueil a{
background:#00a3d8;
height:auto;
}

#BSO_2011 #menu div#accueil a span{
display:block;
font-weight:bold;
font-size:1.2em;
line-height:1em;
}

#BSO_2011 iframe{
width:100%!important;
}
}