*{
margin:0;
padding:0;
}
html {
background-color:#99d420;
/*background: url("../img/bg.png") repeat scroll 0 0 #fff;*/
color:#000;
font-size: 100%;
}
body{
-x-system-font:none;
font:0.8125em/1.3 Verdana,Avant Garde,sans-serif;
padding:0 2em;
min-width:980px;
}

/* ********** links*/
a,
a:visited,
a.spip_out{
color:#C30080;
font-weight:bold;
text-decoration: none;
}
/*nonbold*/
a.not-bold,
a .not-bold,
.menu .menu a{
font-weight:normal;
}
a:focus,a:hover,a:active{
color:#000;
text-decoration:underline;
}
/*nounderline*/
.pied_drapeau a:hover{
text-decoration:none;
}

/*white*/
#pied a,
#droite div#agenda a,
#entete div#right-head div#liens-secondaires div a{
color:#fff;
}
/*black*/
.noir,
.liens_noirs a,
h3 a:hover,
#droite div#jyetais a,
#gauche .menu a,
#content .syndic ul li li a,
#entete #head-flash a{
color:#000;
}
/*green*/
#gauche div#syndic_membres h3 a{
color:#3A8900;
}
/*underline*/
#entete #head-flash a:hover h5{
text-decoration:underline;
}

a.spip_out{
padding-right:16px;
background:transparent url(../img/sprites.png) no-repeat scroll right -138px;
}
a.spip_out:hover{
background:transparent url(../img/sprites.png) no-repeat scroll right -99px;
}
li.on a, li.on li.on a {
font-weight:normal;
color:#000;
}
li.on li a{
font-weight:bold;
}
a.lireplus{
clear:both;
display:block;
padding-right:60px;
text-align:right;
margin:-5px 0 -10px;
}

/* ********** basics*/
h1, h2, h3, h4, h5, h6{
font-family:Avant Garde,verdana,arial,helvetica,clean,sans-serif;
text-align:left;
}
h2, h2 a, h2 a:focus, h2 a:hover, h2 a:active {
color:#000;
font-weight:bold;
margin-bottom:7px;
}
h2.agenda{
margin-bottom:20px;
}
h3.spip {
margin: 1em 0 0.5em;
text-align:left;
}
#droite h3{
font-size:1.2em;
font-weight:bold;
margin:10px 0 3px;
}
#droite h3.petit{
font-size:1.3em;
}
h4{
font-size:1.1em;
font-weight:bold;
}
h5{
font-size:1.05em;
font-weight:bold;
}
p{
margin-bottom:7px;
}
small{
font-size:.9em;	
	}
hr{
height: 0;
max-height: 0;
font-size: 1px;
line-height: 0;
overflow: visible;
}
ul, ol {
list-style: none outside none;
}
ul.spip{
list-style-type: circle;	
}
ol.spip li{
list-style-type:decimal;
}
ul.spip li,
ol.spip li{
margin:0 0 0.3em 1.5em;
}

.menu {
clear: both;
margin-bottom: 2em;
text-align: left;
}
ul.menu li {
    margin: 0.2em 0;
    padding: 0.2em;
}
ul.menu ul{
list-style-position:inside;
}
.pluspetit{
font-size:0.9em;
}
/* ********** page*/
#page{
margin:60px auto 0;
min-width:960px;
max-width:1270px;
border:3px solid #000;
background-color:#fff;
border-radius: 25px 25px 0 0;
}

/* ********** page elements*/
#entete{
width:auto;
padding:1em;
border:none;
}
#gauche{
float:left;
margin:0 0 5em;
padding:0 10px;
position:relative;
width:230px;
z-index:2;
}
#content{
float:left;
width:100%;
margin:0 -240px 0 -230px;
}
#content #squeeze{
/*-moz-background-clip:border;*/
/*-moz-background-inline-policy:continuous;*/
/*-moz-background-origin:padding;*/
border:1px solid #352d1d;
border-radius: 15px;
position:relative;
margin:0 240px 10px 230px;
}
.page_carte #content #squeeze{
margin:0 30px 10px 230px;
padding:15px 0;
}
#content #squeeze .inner{
padding:0 10px;
margin:5px 0;
}
.page_carte #content #squeeze .inner {
    padding: 0 5px;
}

#droite{
float:left;
margin:0 0 5em;
padding:0 10px;
position:relative;
width:200px;
z-index:2;
}
#pied{
clear:both;
background-color:#000;
color:#fff;
padding:1em;
width:auto;
}

/* ************* entete*/
#entete div#left-head{
float:left;
display:inline;
}
#entete div#left-head img.spip_logos{
margin:-60px 0 0 -35px;
}
#entete div.bouton_wb{
float:right;
height:48px;
margin:15px 0 -20px;
padding:5px 10px 0 0;
width:90px;
position:relative;
}
#entete div.bouton_wb#bouton-bruxelles{
width:44px;
padding:5px 0 0;
}
#entete div.bouton_wb a{
display:block;
text-align:center;
}
#entete div.bouton_wb#bouton-transition21{

}
#entete div#head-flash{
background:transparent url(../img/sprites.png) no-repeat scroll -644px -254px;
float:right;
height:85px;
margin:0 0 -20px;
padding:15px 10px 0;
width:120px;
position:relative;
}
#entete div#head-flash img.vignette{
margin:-5px 0 0 -1px; 
}
#entete div#head-flash #trombone{
background:transparent url(../img/sprites.png) no-repeat scroll -607px -266px;
height:45px;
width:23px;
position:absolute;
top:0;
right:37px;
}
#entete div#head-flash p.titre{
bottom:15px;
margin:0 auto;
position:absolute;
width:120px;
}
#entete div#head-flash a p.titre.blanc{
color:#fff;
}
#entete div#right-head{
float:right;
display:inline;
}
#entete div#right-head div#liens-secondaires{
margin:-15px 0 20px;
}
#entete div#right-head div#liens-secondaires div.bg{
float:right;
display:inline;
background-color:#000;
margin-right:1em;
border-radius: 0 0 1em 1em;
padding:0.2em 0.8em 0.4em;
}
#entete div#right-head .formulaire_recherche {
margin-bottom:0;
background-color:#FFFFFF;
border:1px solid #352D1D;
border-radius:1em;
padding:.4em .8em;
}
#entete div#right-head .formulaire_recherche .inner{
margin:-10px 0;
padding:0 10px;
}
#entete div#right-head .formulaire_recherche input.text {
background:#FFFFFF;
padding-left:0;
width:10em;
border:none;
display:inline;
vertical-align:baseline;
margin:0;
}
#entete div#right-head .formulaire_recherche input.submit{
background:#FFFFFF url(../img/sprites.png) no-repeat scroll right 0;
width:18px;height:18px;
border:none;
margin:-5px 5px 0 0;
}
#entete div#hierarchie{
clear:both;
margin:-20px 0 0;
text-align:right;
}
#entete div#hierarchie img{
vertical-align:bottom;
}

/* ************* content*/
#content h1{
color:#C30080;
font-weight:bold;
}
#content .spip_logos {
border:1px solid #ddd;
margin:5px;
padding:3px;
}
.cartouche .spip_logos {
float: right;
}

#content .date_agenda{
background:transparent url(../img/sprites.png) no-repeat scroll 0 -419px;
float:left;
height:33px;
line-height:0.7;
margin:-7px 10px 0 0;
padding:18px 0 0;
text-align:center;
width:47px;
color:#FFFFFF;
}
body.art #content .date_agenda{
margin:-15px 10px 4px 0;
}
#content ul#agenda li{
border-bottom:2px solid #ddd;
margin-bottom:10px;
padding:7px 0 10px;
}
#content div.chapo{
font-weight:bold;
font-size:1.05em;
color:#000;
}
#content ul{
margin-left:1em;
}
#content .menu ul li {
border:1px solid #ddd;
border-width:0 0 2px;
padding:7px 0 10px;
}
#content .menu ul li li{
border:none;
list-style-type:disc;
padding:2px 0;
}
#content .menu ul#la-une li h3,
#content .menu ul li h3{
background:url(../img/sprites.png) no-repeat 0 -142px;
min-height:20px;
padding-left:27px;
margin-left:-5px;
max-width: 700px;
}
#content h4{
background:url(../img/sprites.png) no-repeat 0 -537px;
min-height:20px;
padding-left:27px;
margin-left:-5px;
}
#content .texte {
line-height:1.3em;
}
body.log .formulaire_login fieldset ul li input.password,
body.log div.choix {
display:inline;
margin:0;
width:11em;
}
body.log .formulaire_spip.formulaire_login{
border-bottom:1px solid #ddd;
}
body.log .formulaire_spip .boutons{
margin:-40px 0 0 300px;
position:absolute;
}
body.log .retour{
text-align:right;
}
#content .spip_documents img{
border:1px solid #DDDDDD;
margin:5px;
padding:3px;
}
#content .spip_documents_left img{
margin:5px 5px 5px 0;
}
#content .spip_documents_right img{
margin:5px 0 5px 5px;
}

.plan{
margin-bottom:15px;
}
.plan h3{
margin-left:.2em;
}
.articles .spip_logos {
    clear: right;
    float: right;

}
#carte_wallonne{
background:transparent url(../img/bg_carte.png) no-repeat scroll;
height:500px;
width:690px;
margin: 1em auto;
position:relative;
}

/* ************* gauche*/
#gauche .menu.rubriques{
border: medium double white;
border-radius: 1em 1em 0 0;
padding: 0.2em 1em;
}
#gauche .menu.rubriques,
#gauche .rubriques ul li{
background-color:#c1e2f7;
}
#gauche ul.menu li ul{
display:none;
}
#gauche ul.menu li.on ul{
display:block;
}
#gauche ul.menu.rubriques li.on a,
#gauche ul.menu.rubriques li.on ul li.on a{
text-decoration:underline;
}
#gauche ul.menu.rubriques li.on ul li a{
text-decoration:none;
}
#gauche ul.menu li ul li{
list-style-type:disc;
font-size:.95em;
}
#gauche ul.menu li{
border:none;
font-size:1.1em;
}
#gauche ul.menu li.element1{
font-size:1.5em;
}
#gauche div#syndic_membres ul li{
border:2px solid #3A8900;
border-width:2px 0 0;
}
#gauche div#syndic_membres ul li.noborder{
border:none;
}

/* ************* droite*/
#droite .menu {
margin-bottom:0;
}
#droite div#meme-rub{
border:1px solid #3A8900;
margin-bottom:20px;
border-radius:1em;
padding: 0.3em 0 1em;
}
#droite div#meme-rub .menu{
padding:0 8px;
margin:-5px 0;
}
#droite .menu.mots_clefs hr{
margin:-5px 0 5px;
}
/*boites agenda & jyetais */
#droite div#agenda,
#droite div#jyetais{
margin-bottom:15px;
background:#C30080 url(../img/sprites.png) no-repeat scroll -98px 0;
border-radius: 1em 1em 0 0;
padding: 7px;
}
#droite div#jyetais{
background:#f89f0e url(../img/sprites.png) no-repeat scroll -360px 4px;
/*color:#fff;*/
}
#droite div.agenda_item{
clear:both;
margin:5px 0;
}
#droite div.agenda_item div.date{
background-color:#fff;
border-radius: 100%;
display: inline;
float: left;
height: 30px;
line-height: 0.8;
margin-right: 5px;
padding: 8px 0 0;
text-align: center;
width: 40px;
}
#droite div#jyetais div.agenda_item div.date{
color:#000;
}
#droite div.agenda_item div.info{
display:inline-block;
width:130px;
color:#fff;
}
#droite div#jyetais div.agenda_item div.info{
color:#000;
}

/* ************* pied*/
#pied div#left{
float:left;
text-align:left;
display:inline;
}
#pied div#right{
float:right;
text-align:right;
display:inline;
}
#pied img{
vertical-align:baseline;
}


div.padding_box{
padding:10px;
margin-top:-15px;
}

#entete div#right-head .formulaire_recherche div{
display:block;
}

.small{
font-size:0.85em;
}
.noshow{
display:none;
visibility:hidden;
}

/*clean default styles*/
ul.menu{
border:none;
list-style: none outside none;
}

.reponse_formulaire_ok {
color:#3A8900;
}

.spip-admin-float{
right:30% !important;
}


/*
--------------------------------
css animation drapeau
--------------------------------
*/
.pied_drapeau{
position:absolute;
background-image: url(../img/sprites_drapeau.png);
background-repeat:no-repeat;
}
.drapeau{
background-image: url(../img/sprites_drapeau.png);
background-repeat:no-repeat;
animation:none;
}

/* drapeau1 = energie */
.drapeau1{
left: 90px;
top: 60px;
height: 54px;
width: 5px;
}
.drapeau1.pied_drapeau{
background-position:-722px 0;
}
.drapeau1 .drapeau{
background-position:0 0;
height: 32px;
width: 65px;
}
.drapeau1 .drapeau:hover{   
    -webkit-animation: flag1 2s steps(6) infinite;
       -moz-animation: flag1 2s steps(6) infinite;
        -ms-animation: flag1 2s steps(6) infinite;
         -o-animation: flag1 2s steps(6) infinite;
            animation: flag1 2s steps(6) infinite;
}
@-webkit-keyframes flag1 {
   from { background-position:    0 0; }
     to { background-position: -419px 0; }
}
@-moz-keyframes flag1 {
   from { background-position:    0 0; }
     to { background-position: -419px 0; }
}
@-ms-keyframes flag1 {
   from { background-position:    0 0; }
     to { background-position: -419px 0; }
}
@-o-keyframes flag1 {
   from { background-position:    0 0; }
     to { background-position: -419px 0; }
}
@keyframes flag1 {
   from { background-position:    0 0; }
     to { background-position: -419px 0; }
}
/* drapeau2 = sante */
.drapeau2{
left: 110px;
top: 133px;
height: 55px;
width: 5px;
}
.drapeau2.pied_drapeau{
background-position:-650px -38px;
}
.drapeau2 .drapeau{
background-position:0 -35px;
height: 29px;
width: 69px;
}
.drapeau2 .drapeau:hover{   
    -webkit-animation: flag2 2s steps(9) infinite;
       -moz-animation: flag2 2s steps(9) infinite;
        -ms-animation: flag2 2s steps(9) infinite;
         -o-animation: flag2 2s steps(9) infinite;
            animation: flag2 2s steps(9) infinite;
}
@-webkit-keyframes flag2 {
   from { background-position: 0 -35px; }
     to { background-position: -630px -35px; }
}
@-moz-keyframes flag2 {
   from { background-position: 0 -35px; }
     to { background-position: -630px -35px; }
}
@-ms-keyframes flag2 {
   from { background-position: 0 -35px; }
     to { background-position: -630px -35px; }
}
@-o-keyframes flag2 {
   from { background-position: 0 -35px; }
     to { background-position: -630px -35px; }
}
@keyframes flag2 {
   from { background-position: 0 -35px; }
     to { background-position: -630px -35px; }
}
/* drapeau3 = habitat */
.drapeau3{
left:295px;
top:135px;
height: 69px;
width: 5px;
}
.drapeau3.pied_drapeau{
background-position:-741px -75px;
}
.drapeau3 .drapeau{
background-position: 0 -65px;
height: 37px;
width: 80px;
margin:-8px 0 0 2px;
}
.drapeau3 .drapeau:hover{   
    -webkit-animation: flag3 2s steps(5) infinite;
       -moz-animation: flag3 2s steps(5) infinite;
        -ms-animation: flag3 2s steps(5) infinite;
         -o-animation: flag3 2s steps(5) infinite;
            animation: flag3 2s steps(5) infinite;
}
@-webkit-keyframes flag3 {
   from { background-position: 0 -65px; }
     to { background-position: -400px -65px; }
}
@-moz-keyframes flag3 {
   from { background-position: 0 -65px; }
     to { background-position: -400px -65px; }
}
@-ms-keyframes flag3 {
   from { background-position: 0 -65px; }
     to { background-position: -400px -65px; }
}
@-o-keyframes flag3 {
   from { background-position: 0 -65px; }
     to { background-position: -400px -65px; }
}
@keyframes flag3 {
   from { background-position: 0 -65px; }
     to { background-position: -400px -65px; }
}
/* drapeau4 = mobilite */
.drapeau4{
left: 445px;
top: 120px;
height: 55px;
width: 5px;
}
.drapeau4.pied_drapeau{
background-position:-612px -107px;
}
.drapeau4 .drapeau{
background-position: 0 -101px;
height: 32px;
width: 72px;
margin:-5px 0 0 1px;
}
.drapeau4 .drapeau:hover{   
    -webkit-animation: flag4 2s steps(5) infinite;
       -moz-animation: flag4 2s steps(5) infinite;
        -ms-animation: flag4 2s steps(5) infinite;
         -o-animation: flag4 2s steps(5) infinite;
            animation: flag4 2s steps(5) infinite;
}
@-webkit-keyframes flag4 {
   from { background-position: 0 -101px; }
     to { background-position: -399px -101px; }
}
@-moz-keyframes flag4 {
   from { background-position: 0 -101px; }
     to { background-position: -399px -101px; }
}
@-ms-keyframes flag4 {
   from { background-position: 0 -101px; }
     to { background-position: -399px -101px; }
}
@-o-keyframes flag4 {
   from { background-position: 0 -101px; }
     to { background-position: -399px -101px; }
}
@keyframes flag4 {
   from { background-position: 0 -101px; }
     to { background-position: -399px -101px; }
}
/* drapeau5 = culture */
.drapeau5{
left: 38px;
top: 270px;
height: 45px;
width: 5px;
}
.drapeau5.pied_drapeau{
background-position:-670px -148px;
}
.drapeau5 .drapeau{
background-position: 0 -135px;
height: 32px;
width: 59px;
margin:-10px 0 0 2px;
}
.drapeau5 .drapeau:hover{   
    -webkit-animation: flag5 2s steps(5) infinite;
       -moz-animation: flag5 2s steps(5) infinite;
        -ms-animation: flag5 2s steps(5) infinite;
         -o-animation: flag5 2s steps(5) infinite;
            animation: flag5 2s steps(5) infinite;
}
@-webkit-keyframes flag5 {
   from { background-position: 0 -135px; }
     to { background-position: -350px -135px; }
}
@-moz-keyframes flag5 {
   from { background-position: 0 -135px; }
     to { background-position: -350px -135px; }
}
@-ms-keyframes flag5 {
   from { background-position: 0 -135px; }
     to { background-position: -350px -135px; }
}
@-o-keyframes flag5 {
   from { background-position: 0 -135px; }
     to { background-position: -350px -135px; }
}
@keyframes flag5 {
   from { background-position: 0 -135px; }
     to { background-position: -350px -135px; }
}
/* drapeau6 = formation-emploi */
.drapeau6{
left: 155px;
top: 245px;
height: 60px;
width: 5px;
}
.drapeau6.pied_drapeau{
background-position:-737px -186px;
}
.drapeau6 .drapeau{
background-position: 0 -172px;
height: 53px;
width: 81px;
margin:-13px 0 0 1px;
}
.drapeau6 .drapeau:hover{   
    -webkit-animation: flag6 2s steps(7) infinite;
       -moz-animation: flag6 2s steps(7) infinite;
        -ms-animation: flag6 2s steps(7) infinite;
         -o-animation: flag6 2s steps(7) infinite;
            animation: flag6 2s steps(7) infinite;
}
@-webkit-keyframes flag6 {
   from { background-position: 0 -172px; }
     to { background-position: -629px -172px; }
}
@-moz-keyframes flag6 {
   from { background-position: 0 -172px; }
     to { background-position: -629px -172px; }
}
@-ms-keyframes flag6 {
   from { background-position: 0 -172px; }
     to { background-position: -629px -172px; }
}
@-o-keyframes flag6 {
   from { background-position: 0 -172px; }
     to { background-position: -629px -172px; }
}
@keyframes flag6 {
   from { background-position: 0 -172px; }
     to { background-position: -629px -172px; }
}
/* drapeau7 = democratie */
.drapeau7{
left: 280px;
top: 215px;
height: 56px;
width: 6px;
}
.drapeau7.pied_drapeau{
background-position:-710px -230px;
}
.drapeau7 .drapeau{
background-position: 0 -226px;
height: 34px;
width: 94px;
margin:-3px 0 0 4px;
}
.drapeau7 .drapeau:hover{   
    -webkit-animation: flag7 2s steps(7) infinite;
       -moz-animation: flag7 2s steps(7) infinite;
        -ms-animation: flag7 2s steps(7) infinite;
         -o-animation: flag7 2s steps(7) infinite;
            animation: flag7 2s steps(7) infinite;
}
@-webkit-keyframes flag7 {
   from { background-position: 0 -226px; }
     to { background-position: -700px -226px; }
}
@-moz-keyframes flag7 {
   from { background-position: 0 -226px; }
     to { background-position: -700px -226px; }
}
@-ms-keyframes flag7 {
   from { background-position: 0 -226px; }
     to { background-position: -700px -226px; }
}
@-o-keyframes flag7 {
   from { background-position: 0 -226px; }
     to { background-position: -700px -226px; }
}
@keyframes flag7 {
   from { background-position: 0 -226px; }
     to { background-position: -700px -226px; }
}
/* drapeau8 = production-consommation */
.drapeau8{
left: 589px;
top: 217px;
height: 59px;
width: 6px;
}
.drapeau8.pied_drapeau{
background-position:-640px -272px;
}
.drapeau8 .drapeau{
background-position: 0 -266px;
height: 46px;
width: 110px;
margin:-6px 0 0 3px;
}
.drapeau8 .drapeau:hover{   
    -webkit-animation: flag8 2s steps(4) infinite;
       -moz-animation: flag8 2s steps(4) infinite;
        -ms-animation: flag8 2s steps(4) infinite;
         -o-animation: flag8 2s steps(4) infinite;
            animation: flag8 2s steps(4) infinite;
}
@-webkit-keyframes flag8 {
   from { background-position: 0 -266px; }
     to { background-position: -440px -266px; }
}
@-moz-keyframes flag8 {
   from { background-position: 0 -266px; }
     to { background-position: -440px -266px; }
}
@-ms-keyframes flag8 {
   from { background-position: 0 -266px; }
     to { background-position: -440px -266px; }
}
@-o-keyframes flag8 {
   from { background-position: 0 -266px; }
     to { background-position: -440px -266px; }
}
@keyframes flag8 {
   from { background-position: 0 -266px; }
     to { background-position: -440px -266px; }	
}
/* drapeau9 = solidarite */
.drapeau9{
left: 235px;
top: 381px;
}
.drapeau9.pied_drapeau{
background-position:-932px -238px;
}
.drapeau9 .drapeau{
background-position: 0 -320px;
height: 39px;
width: 77px;
}
.drapeau9 .drapeau:hover{   
    -webkit-animation: flag9 2s steps(6) infinite;
       -moz-animation: flag9 2s steps(6) infinite;
        -ms-animation: flag9 2s steps(6) infinite;
         -o-animation: flag9 2s steps(6) infinite;
            animation: flag9 2s steps(6) infinite;
}
@-webkit-keyframes flag9 {
   from { background-position: 0 -320px; }
     to { background-position: -480px -320px; }
}
@-moz-keyframes flag9 {
   from { background-position: 0 -320px; }
     to { background-position: -480px -320px; }
}
@-ms-keyframes flag9 {
   from { background-position: 0 -320px; }
     to { background-position: -480px -320px; }
}
@-o-keyframes flag9 {
   from { background-position: 0 -320px; }
     to { background-position: -480px -320px; }
}
@keyframes flag9 {
   from { background-position: 0 -320px; }
     to { background-position: -480px -320px; }	
}
/* drapeau10 = agriculture */
.drapeau10{
left: 453px;
top: 300px;
height: 55px;
width: 5px;
}
.drapeau10.pied_drapeau{
background-position:-511px -334px;
}
.drapeau10 .drapeau{
background-position: 0 -359px;
height: 30px;
width: 91px;
margin:-7px 0 0 1px;
}
.drapeau10 .drapeau:hover{   
    -webkit-animation: flag10 2s steps(5) infinite;
       -moz-animation: flag10 2s steps(5) infinite;
        -ms-animation: flag10 2s steps(5) infinite;
         -o-animation: flag10 2s steps(5) infinite;
            animation: flag10 2s steps(5) infinite;
}
@-webkit-keyframes flag10 {
   from { background-position: 0 -359px; }
     to { background-position: -499px -359px; }
}
@-moz-keyframes flag10 {
   from { background-position: 0 -359px; }
     to { background-position: -499px -359px; }
}
@-ms-keyframes flag10 {
   from { background-position: 0 -359px; }
     to { background-position: -499px -359px; }
}
@-o-keyframes flag10 {
   from { background-position: 0 -359px; }
     to { background-position: -499px -359px; }
}
@keyframes flag10 {
   from { background-position: 0 -359px; }
     to { background-position: -499px -359px; }
}