/*-----------------------------------------
Feuille de style Puzzle par Vincent G
-----------------------------------------*/




/*----------------------------------------
Formatage des styles prédéfinis
----------------------------------------*/
*{
   padding:0;
   margin:0;
   font-family: arial;
   background-repeat: no-repeat;
}
ul{
    list-style: none;
}

p{
    padding:0 0 20px 0;
}
html, body, #all{
    height:100%;
    width:100%;
}

.violet{
  color:#794D78
}

body{
    font-size: 12px;
    color:#7a7a7a;
    background: url(images/site/background-repeat.jpg) repeat-x #f3f3f3;
    /*hack ie6 pour les hover (li)*/
    behavior:url("/puzzle/csshover.htc");

}
a{
    color:#794d78;
    text-decoration:none;
}
a:hover{
  text-decoration:underline;
}

.clearer{
  font-size:0px;
  height:10px;
  clear:both;
  float:left;
}


/*----------------------------------------
Structure du site
----------------------------------------*/
#all{
    background: url(images/site/background.jpg) no-repeat top center scroll;
}
#site{
    width:919px;
    margin:0 auto;
}
#header{
    height:215px;
    position:relative;
}
#content{
   background: url(images/site/bg-content.jpg) repeat-y;
   padding:10px 40px 30px 40px;
   margin-left:3px
}

* html #content{
 margin-left:3px
}
#footer{
    background: url(images/site/footer.jpg) no-repeat bottom;
    height:161px;
    position:relative;
   /* border:1px solid red;*/
}
#footer ul li{
  float:left;
}
#footer ul li ul{display:none;}
#footer, #footer *{
  color:#a7a09d;
  font-size:11px
}
#menu-footer{
  position:absolute;
  right:25px;
  top:40px;
}
#menu-footer .menuactive{
  text-decoration:underline;
}

#partenaires{
  clear:both;
}

/*----------------------------------------
Colonne dans la zone de contenu 
----------------------------------------*/
.row2col,.row2col50{
  clear:both;
  width:100%;
  float:left;
  margin:0 0 25px 0
}
.row2col .col1{
  float:left;
  width:550px;
}
.row2col .col2{
  float:right;
  width:250px;
  font-size:11px;
}

.row2col .col2 h2{
  font-size:14px;
  color:#694633;
  font-weight:bold;
  font-family:arial;
  padding:0 0 10px 0
}


.row2col50 .col1{
  float:left;
  width:430px;
  padding:0 0 10px 0;
  margin:0 0 10px 0;
  border-right:1px solid #d2d2d2
}
.row2col50 .col2{
  float:right;
  width:390px;
  
}



/*----------------------------------------
Logo 
----------------------------------------*/


#header h1, #header h1 a{
    float:left;
    display:block;
    width:225px;
    height:160px;
}
#header h1{
    position:absolute;
    top:10px;
    left:10px;
}
   
#header h1 span{display:none}





/*----------------------------------------
Menu du site
----------------------------------------*/
#menu{
    position:absolute;
    bottom:0;
    left:8px;
}
#menu ul,#menu, #menu li, #menu a{
    z-index:999
    
}
dfn{display:none}
#menu ul ul{
    display:none
}
#menu ul li{position:relative;          }


#menu ul li ul{
    position:absolute;
    top:49px;
    padding:10px;
    width:185px;
    left:0;
    background:#5f365e;
}  
#menu a{
   display:block;
   height:100%;
   width:100%;
   text-decoration: none;
}
#menu ul li span{display:none}
#menu ul li li span{display:block}

#menu ul li li a, #menu ul li li h3{
    float:none;
    padding:5px
}
#menu li:hover ul{display:block}

#menu ul li{float:left; display:block;height:49px; cursor:pointer}
#menu ul li li{height:auto; width:100%}


#menu ul li.presentation{
    background-image: url(images/menu/menu-none_presentation.gif);
    width:111px;  
}
#menu ul li.presentation:hover{background-image: url(images/menu/menu-rollover_presentation.gif);}
#menu ul li.presentation_is_active,#menu ul li.presentation_is_active:hover{background-image: url(images/menu/menu-active_presentation.gif) }


#menu ul li.ateliers-et-seances{
   background-image: url(images/menu/menu-none_ateliersetseances.gif);
   width:136px;
}
#menu ul li.ateliers-et-seances:hover{ background-image: url(images/menu/menu-rollover_ateliersetseances.gif);}
#menu ul li.ateliers-et-seances_is_active,#menu ul li.ateliers-et-seances_is_active:hover{ background-image: url(images/menu/menu-active_ateliersetseances.gif);}


#menu ul li.section-d-etudes{
   background-image: url(images/menu/menu-none_sectiondetudes.gif);
   width:121px;
}
#menu ul li.section-d-etudes:hover{background-image: url(images/menu/menu-rollover_sectiondetudes.gif);}
#menu ul li.section-d-etudes_is_active,#menu ul li.section-d-etudes_is_active:hover{background-image: url(images/menu/menu-active_sectiondetudes.gif);}*


#menu ul li.formation-qualifiante{
   background-image: url(images/menu/menu-none_formationqualifiante.gif);
   width:156px;
}
#menu ul li.formation-qualifiante:hover{background-image: url(images/menu/menu-rollover_formationqualifiante.gif);}
#menu ul li.formation-qualifiante_is_active,#menu ul li.formation-qualifiante_is_active:hover{background-image: url(images/menu/menu-active_formationqualifiante.gif);}


#menu ul li.stages-et-modules{
    background-image: url(images/menu/menu-none_stagesetmodules.gif);
    width:128px;
}
#menu ul li.stages-et-modules:hover{background-image: url(images/menu/menu-rollover_stagesetmodules.gif);}
#menu ul li.stages-et-modules_is_active,#menu ul li.stages-et-modules_is_active:hover{background-image: url(images/menu/menu-active_stagesetmodules.gif);}


#menu ul li.adhesion-et-inscription{
   background-image: url(images/menu/menu-none_adhesionetinscriptions.gif);
   width:167px;
}
#menu ul li.adhesion-et-inscription:hover{background-image: url(images/menu/menu-rollover_adhesionetinscriptions.gif);}
#menu ul li.adhesion-et-inscription_is_active,#menu ul li.adhesion-et-inscription_is_active:hover{background-image: url(images/menu/menu-active_adhesionetinscriptions.gif);}


#menu ul li.contact-2{
   background-image: url(images/menu/menu-none_contact.gif);
   width:83px;
}
#menu ul li.contact-2:hover{background-image: url(images/menu/menu-rollover_contact.gif);}
#menu ul li.contact-2_is_active,#menu ul li.contact-2_is_active:hover{background-image: url(images/menu/menu-active_contact.gif);}



#menu ul li ul a, #menu ul li ul h3{color:#fff; font-size:11px;}
#menu ul li ul li:hover,#menu ul li ul li h3{
  background-color:#462945;
  font-weight:normal;
}

/*-------------------------------------------
Menu secondaire
-------------------------------------------*/
#menu-secondaire{
    font-size:10px;
    position: absolute;
    top:5px;
    right: 27px;
}
#menu-secondaire li{float:left;}
#menu-secondaire .menuactive{text-decoration:underline}
#menu-secondaire li ul{display:none}

/*-------------------------------------------
Formauliare de recherche
-------------------------------------------*/
#recherche{
    position:absolute;
    right:23px;
    top:144px;
}

#recherche .search-input{
    width:125px;
    margin:0 5px 0 0;
    font-size:11px;
    background: none;
    border:none;
}
#recherche label{display:none}
#recherche .search-button{
    background: url(images/boutons/btn-ok.gif) no-repeat;
    height:21px;
    width:21px;
    color:#fff;
    font-size:10px;
    border:none;
    cursor:pointer;
}
/*-------------------------------------------
Ariane
-------------------------------------------*/
#ariane, #ariane *{
    font-size:11px
}
#ariane{margin:0 0 15px 0; color:#000}

/*----------------------------------------
Page plan du site
----------------------------------------*/
#plandusite ul{
  padding: 0 0 0px 0
}
#plandusite li{
  padding:0 0 15px 0;
}

#plandusite li li{
  padding: 3px 15px
}



/*-------------------------------------------
Sous menu (pour silmplifier la navigation))
-------------------------------------------*/
#sous-menu{
  padding:15px;
  border:double  #d4d4d4;
  background-color:#f5f5f5
}

#sous-menu li{
  display:block;
  padding:5px;
  border-bottom:1px dotted #c9c9c9
}

#sous-menu li a{
  padding:0 0 0 10px;
  background: url(images/puces/marron.jpg) no-repeat  0px 5px;
}

#sous-menu li a.currentpage{text-decoration:underline}

/*-------------------------------------------
Page d'accueil
-------------------------------------------*/
#box-accueil{
  margin:0 auto;
  width:835px;
  height:270px;
  margin:0 0 25px 0;
  background:url(images/site/video-actualites-evenements.jpg) no-repeat;
}
#video, #actualites{
  float:left;
}
#video{
  width:420px;
}
#actualites{
  width:385px;
  height:199px;
  margin:45px 0 0 0;
  padding:0px 15px 15px 15px;
  position:relative;
}

#actualites .NewsSummaryPostdate{
  font-size:32px;
  color:#5c375b;
  padding:0 0 10px 0;
}
#actualites .NewsSummaryLink a{
  font-size:21px;
  color:#424242;
}

#actualites .NewsSummarySummary, #actualites .NewsSummarySummary *{
  color:#6a6a6a;
  font-size:11px;
  line-height:18px;
}
#actualites .NewsSummarySummary p{
  padding:0 0 5px 0
}
#actualites .NewsSummaryMorelink{
  text-align:right;
  padding:10px 0 0 0;
  font-size:11px;
  position:absolute;
  bottom:5px;
  right:10px;
}
#actualites .NewsSummaryMorelink a{
  font-weight:bold;
}
#NewsPostDetailSummary,#NewsPostDetailReturnLin, #NewsPostDetailContent{
  margin-bottom:15px
}



/*-------------------------------------------
titre de la page
-------------------------------------------*/
h1{
    font-size:24px;
    color:#794d78;
    font-weight:normal;
    padding:0 0 10px 0;
    font-family:trebuchet MS;
}
h2{
    font-size:24px;
    color:#794d78;
    font-weight:normal;
    padding:0 0 15px 0;
    font-family:trebuchet MS;
}
h3{
    font-size:17px; 
    color:#794d78;
    font-weight:normal;
    padding:0 0 10px 0;
    font-family:trebuchet MS;
    
}
h3 a{
font-size:17px; 
    color:#794d78;
    font-weight:normal;
    font-family:trebuchet MS;
}
h4{
   font-size:16px;
  font-weight:bold;
  font-family:trebuchet MS;
}
/*-------------------------------------------
Formulaire de contact 
-------------------------------------------*/
.contactform{
  clear:both;
  margin-top:15px;
}
.contactform div{
  clear:both;
  margin:0 0 15px 0;
}
.contactform div div{
    margin:0 0 0 150px;
    float:left
    
}
.contactform label{
  display:block;
  float:left;
  width:120px;
  font-weight:bold;
}
.contactform div div label{
    width:100px;
}
#m5fbrp__31_0 , #m5fbrp__31_1{
    width:10px;
    float:left;
}
.contactform input{
  width:270px;
}
.contactform textarea{
  width:390px;
  height:140px;
  overflow:auto;
}
.contactform input, .contactform textarea{
  font-size:11px;
  padding:1px 2px;
  border:1px solid #a5acb2
}
.contactform .fbsubmit{
  margin-left:313px;
  height:27px;
  width:84px;
  border:none;
  color:#fff;
  text-transform: uppercase;
  cursor:pointer;
  background-image:url(images/boutons/envoyer.jpg);
}

.invalidInput, p.error,input.invalidInput, textarea.invalidInput{
 border:1px solid #5d355a;
 color:#5d355a;
 background-color:#e2d0e1
}
p.error{
 width:395px;
 display:none;
 padding:10px;
 margin:0 0 15px 0;
}
.gmapSidebar{display:none;}

#m5fbrp__24{
  width:290px;
  height:100px;
    
}

/*-------------------------------------------
Formulaire d'adhesion 
-------------------------------------------*/



/*-------------------------------------------
contenu 
-------------------------------------------*/
#content{
  font-size:12px;
}
#content p{
     line-height:18px;
}
#content a.lien-icone{
    width:116px;
    display: block;
    height:22px;
    background:url(images/boutons/ensavoirplus.jpg);
    color:#fff;
    text-transform: uppercase;
    font-size:10px;
    padding:5px 0 0 0;
    text-align: center;
}
#content hr{
  background:url(images/site/separation-contenu.jpg) no-repeat center;
  height:30px;
  font-size:0px;
  border:1px solid  #fff;
  margin:20px 0;
  clear:both;
  width:100%;
  display:block;
}

#content .row2col .col1 hr{
  background:url(images/site/separation-contenu-petit.jpg) no-repeat center;
}


#content ul{
  padding:0 0 15px 25px;
}
#content ul li{
  padding:0 0 3px 10px;
  background: url(images/puces/marron.jpg) no-repeat  0px 5px;
}
#content #sous-menu ul{
  margin:0;
  padding:0
}
#content #sous-menu li{
background:none;
display:block;
  padding:5px;
  border-bottom:1px dotted #c9c9c9
}
#partenaires img, #partenaires a{
  border:none;
  text-decoration:none;
}

#content td{
    padding:5px;
    vertical-align:top;
    
}
#content .col1 a{text-decoration:underline}
#content .col1 a:hover{text-decoration:none}

#content #actualites ul{
    list-style:none;
    padding:0;
    margin:0;
}
 #actualites ul li{
    padding:0;
    background: none;
}
#reseaux-part img, #reseaux-part a{
    text-decoration:none;
    border:none;
}