body{
	font-family: Verdana, Calibri, sans-serif;
	font-size: 18px;
	margin: 0px;
	padding:0px;
	background-color: #DCDCDC;
}

#contenu {
    margin: 40px;
}


h3 {
    text-decoration: underline;
}

h2 {
    /*background-color: rgba(50,50,50,0.4);*/
    padding: 5px 15px;
    margin: 0px;
}

p {
    text-align: justify;
	line-height: 2;
 }   
 
img {
    height: 250px;
   } 

/* Menu déroulant */
#menu, #menu ul {
	text-align: center;
    padding: 0;
    margin: 0;
    list-style: none;
}

#menu{
	width: 100%;
	position: absolute;
	background-color: #424053;
	/* position: absolute; */
}

#menu li {
	display: inline;
	list-style: none;
	padding: 0 0.5em;
	width:200px;
	float: left;
	padding: 10px 15px;
}

#menuAccueil{
	width: 400px !important;
}	

.submenu li {
	display: inline;
	list-style: none;
	padding: 0 0.5em;
	float: left;
	background-color: #424053;
	width: 200px !important; /*Largueur des sous menus*/
}

#menu li a {
	color: #FFF;
	text-decoration: none;
}	

#menu li:hover {
	background-color: #CDC0B0;
	color: black;
	position: relative;
}

#menu li a:hover {
	color: green;
}	

#menu ul li {
/* on enlève ce comportement pour les liens du sous menu */
    display: inherit;
}

#menu ul {
    position: absolute;
/* on cache les sous menus complètement sur la gauche */
    left: -999em;
    text-align: left;
    z-index: 1000;
}

#menu li:hover ul {
/* Au survol des li du menu on replace les sous menus */
    left: 0em;
	top: 100%;
	display: inline-block;
}

#menuAccueil {
	padding-top: 3px; /* Placement du logo avec le lien pour la page d'accueil avec une marge de 3 au dessus */
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
}	
  
/* Fin menu déroulant */ 






/*Menu déroulant page d'accueil*/
#menuPageAccueil, #menuPageAccueil ul {
    padding: 0;
    margin: 0;
    list-style: none;
}

#menuPageAccueil {
	width: 100%;
	background-color: #424053;
}

#menuPageAccueil li {
	display: inline;
	list-style: none;
	padding: 0 0.5em;
	float: left;
	padding: 10px 30px;
}

#menuPageAccueil > li > a {
	text-decoration: none;
	color: #FFF;
}

#menuPageAccueil ul li {
/* on enlève ce comportement pour les liens du sous menu */
    display: inherit;
}

#menuPageAccueil ul {
    position: absolute;
/* on cache les sous menus complètement sur la gauche */
    left: -999em;
    z-index: 1000;
	background-color: #424053;
}

#menuPageAccueil li:hover{
	position: relative;
	background-color: #CDC0B0;
	opacity: 1 !important;
}

#menuPageAccueil li a:hover{
	color: green;
}

#menuPageAccueil li:hover ul {
/* Au survol des li du menu on replace les sous menus */
    left: 0em;
	top: 100%;
	display: inline-block;
}

#menuAccueil {
	padding-top: 3px; /* Placement du logo avec le lien pour la page d'accueil avec une marge de 3 au dessus */
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
}

.submenu li {
	display: inline;
	list-style: none;
	padding: 0 0.5em;
	float: left;
	background-color: #424053;
	width: 200px !important; /*Largueur des sous menus*/
}

.submenu li a {
	/*padding: 15px 30px;*/
	font-size: 10px;
	z-index: 1000;
	text-decoration: none;
	color: #FFF;
	/*text-align: left;*/
}
/*Fin menu page d'accueil*/




/* placement logo et menu */
li {
	display: inline;
}

#menuAccueil > img {
	//height: 60px;
	padding-top: 4px; /* Placement du logo de la page d'accueil avec une marge de 3 au dessus */
	//padding-right: 0px;
	//padding-bottom: 0px;
	//padding-left: 0px;
	width: 380px;
}

#menuAccueil > a > img {
	height: 60px;
}

/*fin placement menu et logo */



/* placement banner page acceuil */
#banner{
	background-size: cover;
	background-position: bottom center;
	width: 100%;
}

#imgBanner > img {
	width: 100%;
	height: 800px;
	}

.logo{
	position: absolute;
	z-index: 2;
	left: 40%;
	top: 150px;
	border: 3px solid green;
	margin: 0px;
	padding-bottom:0px;
	padding-left: 4px;
	padding-right: 4px;
	padding-top: 4px;
	width: 20%;
}

.logo > img {
	width: 290px;
	height: auto;
}
/* fin placement banner */




/* En tête pages autres que l'accueil */
#banner{
	background-size: cover;
	background-position: bottom center;
	width: 100%;
}

.imgBanner > img {
	width: 100%;
	opacity: 0.75;
}

.imgBanner > a > img {
	width: 100%;
	opacity: 0.75;
}
/*Fin en tête pages autres */




/* Placement texte page d'accueil*/
.content > p, .presentation > p, .content > h1, .content > h2{
	text-align: center;
}

.contenu {
	float: both;
	position: absolute;
	top: -700px;
	background-color: white;
	opacity: 0.75;
	border: 4px dotted green;
	margin: 30px 30px;
	padding: 5px 10px;
	width: 90%;
	max-height: 400px;
	overflow: auto;
}
/* Fin placement texte parge d'accueil */





/* Galerie page accueil*/
#gal {
	width: 100%;
	position: relative;
	bottom: 25px;
}	

div.gal {
   /*border: 1px solid #DCDCDC;*/
    float: left;
    width: 7.6%;
}

.gal img:hover {
	opacity: 1;
}

div.gal img {
    width: 100%;
    height: auto;
	opacity: 0.70;
}
/*Galerie page accueil*/






/* pied de page Footer */
footer {
	text-align: right;
	position: relative;
	top: 110px;
	background-color: #CDC0B0;
	height: 40px;
}

footer > ul > li > a {
	color: #FFF;}

footer a {
	text-decoration: none;
	font-size: 15px;
	background-color: #424053;
	border: 2px solid #424053;
	border-radius: 4px;
	padding: 0px 15px;
}

#link > li {	
	background-color: none;
}

#footer a:hover {
	background-color: #FFF;
	border: 2px solid #FFF;
	color: black;
}

#footerBoutons {
    position: relative;
    bottom: 113px;
    }
   
.partage > a {
    background-color: transparent;
    border: none;
    }    

.partage > a > img {
    height: 35px;
   } 

/* Fin pied de page */







/* Style des sommaires de pages*/
nav > ol > li > a {
	display: block;
	color: black;
	width:400px;
	border: 1px solid #DCDCDC;
	border-radius: 3px;
	text-decoration: none;
	padding: 5px 10px;
}

nav > ol > li > a:hover {
	border: 1px solid black;
	border-radius: 3px;
	background-color: grey;
	text-decoration: underline;
}
#contenu {
	position: relative;
	top: 100px;
}

#sommaire > h1 {
	width: 100%;
}

nav > ol > h1 {
	border-bottom: 3px solid black
}
/*Fin style sommaires des pages*/




		
			/*Page l'association*/
.imgAssoc {
    height: 250px;
    float: left;
    border: gray solid 1px; 
    }
    
.Assoc > p {
    height: 250px;
    width: 950px;
    float: right;
    border: 1px solid black;
    background-color: lightgray;
    }
    
.Assoc > p, .Assoc > img {
    margin: 20px 0px;
    padding: 15px;
    }        

.AdamDelma > img {
	float: left;
	top: 80%;
	right: 10%;
	width: 200px;
	height: 200px;
	border: 1px solid grey;
	margin-right: 20px;
}


.membres {
    margin-left: 30px;
    margin-right: 5px;
}

.pqAfrique {
    /*margin-right: 30px;*/
    margin-left: 5px;
}

.pqAfrique, .membres {
    background-color: #FFFAFA;
    display: inline-block;
    width: 43%;
    border: 4px solid #8B7D6B;
    border-radius: 5px;
    margin-top: 20px; 
	margin-bottom: 20px;
	padding: 20px 20px;
	height: 650px;
	vertical-align: top;
}


/*Style du tableau*/
#TabMembres {
    border-collapse: collapse;
    border: 2px solid black;
}

#TabMembres td {
    padding: 5px 15px;
    background-color: #BC8F8F;
} 
/*Fin style tableau*/


#carateristiques {
    border: 1px solid black;
    line-height: 40px;
    margin-top: 90px;
    width: 700px;
}

.strong {
    text-decoration: underline bold;
    
} 

#carte {
    float: right;
    width: 600px;
    height: auto;
    border: 1px solid black;
    margin-bottom: 20px;
}

#historique {
    clear: both;
} 

    
#image {
    border: 1px solid black;
    float: left;
    width: 250px;
    margin-right: 20px;
    margin-top: 20px;
    margin-bottom: 20px;
    }  
    
#image > img {
    width: 250px;
    border-bottom: 1px solid black;
    }      
    
#image > p {
    text-align: center;
    }   

#centre, #chateauEau {
    background-color: #FFFAFA;
    display: inline-block;
    width: 46%;
    border: 4px solid #8B7D6B;
    border-radius: 5px;
    margin-top: 20px; 
	margin-bottom: 20px;
	padding: 20px 20px;
	height: 650px;
	vertical-align: top;
    }

#chateauEau > img, #centre > img {
    width: 48%;
    border: 1px solid black;
    }
    
#centre > ul > li {
	display: inline-block;
    }	
			/*Fin Page l'association*/



            /* Page Action Afrique */
.imgVoyage, .imgconteneur {
    height: 250px;
    }            




			/*Contenu page Fonds Association */
/* Style slogan */
#slogan {
	text-align: center;
}

#slogan > img {
	width: 80%;
	position: center;
	opacity: 0.5;
}

#slogan > p {
	position: relative;
	bottom: 150px;
	color: black;
	font-size: 25px;
	text-align: center;
	font-weight: bold;
	text-shadow: 1px 1px 1px white;
}
/* Fin style slogan */

/*Galerie images magasin Fougère association*/
#galerieMagasin {
	width: 92%;
	position: relative;
	left: 6%;
}	

.galmagasin {
    float: left;
    width: 16%;
}

.galmagasin img:hover {
	border: 1px solid black;
}

div.galmagasin img {
    width: 100%;
    height: auto;
    border: 1px solid #DCDCDC; 
}
/*Fin galerie images magasin Fougère association*/

#horaires {
    text-align: center;
    display: inline-block;
    border: 4px dotted brown;
    border-radius: 4px;
    background-color: grey;
    width: 80%;
    position: relative;
    left: 10%;
}

#horaires > p {
	text-align: center;
}

#TabHoraires {
	margin: auto;
	border-collapse: collapse;
	border: 2px solid;
}

#TabHoraires > tbody > tr > td {
	background-color: #DCDCDC;
	opacity: 0.7;
	padding: 10px;
	margin: 5px;
	border: 2px solid;
}

.imgtabFonds {
    height: 350px;
    display: block;
    left: 10%;
	margin: auto;
}

#TabFonds {
	border-collapse: collapse;
	border: 2px solid black;
}

#TabFonds > tbody > tr > td {
	background-color: rgba(250, 250, 250, 0.5);
	padding: 15px;
	text-align: justify;
	}
	
	
	



/* Infos Burkina avec carte */
.Burkina > ul > li {
	display: block;
	list-style-type: disc;
}
/* Fin infos Burkina */





			/*page Galerie*/
/* Galerie*/
#galerie {
	margin: 50px;
}

div.gallery {
    margin: 5px;
    border: 1px solid #ccc;
    float: left;
    width: 17%;
}

div.gallery:hover {
    border: 1px solid #777;
}

div.gallery img {
    width: 100%;
    height: auto;
}

div.desc {
    padding: 15px;
    text-align: center;
	font-size: 14px;
	background-color: white;
	opacity: 0.70;
}

.sousgalerie {
    display: inline-block;
}
/*Fin Galerie*/
            /*Fin Page Galerie*/



/* Page contacter */
#map {
    width: 100%;
    height: 450px;
    background-color: grey;
    border:0; 
}

#imageMap {
    height: 335px;
    }
/* Fin page contacter */    



/*****carrousel 3d avec navigation*****/
/*.caroussel_diapo1 input{display:none}
    
.caroussel_diapo1{	
position:relative;
text-align:center;
margin:0 auto;
}


.contenu_carou1 {
text-align:left;	
width:900px;
height:732px;
margin:10px auto 40px auto;
/*-webkit-perspective:4000px;
perspective: 4000px;*/
}

/*.caroussel1{
-webkit-transform-style:preserve-3d;
transform-style:preserve-3d;
position:relative;
width:900px;
height:732px;
transition:1s;
}*/

/*.caroussel1 img {
position:absolute;
/*outline:1px solid transparent;*/
/*-webkit-backface-visibility:hidden;
backface-visibility:hidden;
transition:1s;
width: 500px;
}*/

/*.caroussel1 img{filter:blur(3px);-webkit-filter:blur(3px);opacity:.8}	
.caroussel1 img:nth-child(1){-webkit-transform:translate3d(0,0,540px) scale(.8);transform:translate3d(0,0,540px) scale(.8)}
.caroussel1 img:nth-child(2){-webkit-transform:rotateY(45deg) translateZ(540px) scale(.8);transform:rotateY(45deg) translateZ(540px) scale(.8)}
.caroussel1 img:nth-child(3){-webkit-transform:rotateY(90deg) translateZ(540px) scale(.8);transform:rotateY(90deg) translateZ(540px) scale(.8)}
.caroussel1 img:nth-child(4){-webkit-transform:rotateY(135deg) translateZ(540px) scale(.8);transform:rotateY(135deg) translateZ(540px) scale(.8)}
.caroussel1 img:nth-child(5){-webkit-transform:rotateY(180deg) translateZ(540px) scale(.8);transform:rotateY(180deg) translateZ(540px) scale(.8)}
/*.caroussel1 img:nth-child(6){-webkit-transform:rotateY(225deg) translateZ(540px) scale(.8);transform:rotateY(225deg) translateZ(540px) scale(.8)}
.caroussel1 img:nth-child(7){-webkit-transform:rotateY(270deg) translateZ(540px) scale(.8);transform:rotateY(270deg) translateZ(540px) scale(.8)}
.caroussel1 img:nth-child(8){-webkit-transform:rotateY(315deg) translateZ(540px) scale(.8);transform:rotateY(315deg) translateZ(540px) scale(.8)}
*/

/*.caroussel_diapo1 input[type=radio] + label {
cursor:pointer;
background:hsl(203,77%,81%);
display:inline-block;
width:20px;
border-radius:50%;
height:20px;
}*/
	
/*.caroussel_diapo1 input[type=radio]:checked + label{background:hsl(203,77%,61%)}

.caroussel_diapo1 label{background:hsl(203,77%,61%)}


.caroussel_diapo1 input[name="rotation"]:checked ~ .contenu_carou1 .caroussel1 img:nth-child(n){filter:drop-shadow(12px 12px 7px hsla(0,0%,0%,.5))}	

/*gauche*/
/*.caroussel_diapo1 #carou_un:checked ~ .contenu_carou1 .caroussel1{-webkit-transform:translateZ(-540px);transform:translateZ(-540px)}
.caroussel_diapo1 #carou_deux:checked ~ .contenu_carou1 .caroussel1{-webkit-transform:translateZ(-540px) rotateY(-45deg);transform:translateZ(-540px) rotateY(-45deg)}
.caroussel_diapo1 #carou_trois:checked ~ .contenu_carou1 .caroussel1{-webkit-transform:translateZ(-540px) rotateY(-90deg);transform:translateZ(-540px) rotateY(-90deg)}
.caroussel_diapo1 #carou_quatre:checked ~ .contenu_carou1 .caroussel1{-webkit-transform:translateZ(-540px) rotateY(-135deg);transform:translateZ(-540px) rotateY(-135deg)}
.caroussel_diapo1 #carou_cinq:checked ~ .contenu_carou1 .caroussel1{-webkit-transform:translateZ(-540px) rotateY(-180deg);transform:translateZ(-540px) rotateY(-180deg)}
/*.caroussel_diapo1 #carou_six:checked ~ .contenu_carou1 .caroussel1{-webkit-transform:translateZ(-540px) rotateY(-225deg);transform:translateZ(-540px) rotateY(-225deg)}
.caroussel_diapo1 #carou_sept:checked ~ .contenu_carou1 .caroussel1{-webkit-transform:translateZ(-540px) rotateY(-270deg);transform:translateZ(-540px) rotateY(-270deg)}
.caroussel_diapo1 #carou_huit:checked ~ .contenu_carou1 .caroussel1{-webkit-transform:translateZ(-540px) rotateY(-315deg);transform:translateZ(-540px) rotateY(-315deg)}
*/

/*droite*/
/*.caroussel_diapo1 #carou_un:checked ~ .contenu_carou1 .caroussel1 img:nth-child(1){-webkit-transform:translateZ(540px) scale(1);transform:translateZ(540px) scale(1);opacity:1}
.caroussel_diapo1 #carou_deux:checked ~ .contenu_carou1 .caroussel1 img:nth-child(2){-webkit-transform:rotateY(45deg) translateZ(540px) scale(1);transform:rotateY(45deg) translateZ(540px) scale(1);opacity:1}
.caroussel_diapo1 #carou_trois:checked ~ .contenu_carou1 .caroussel1 img:nth-child(3){-webkit-transform:rotateY(90deg) translateZ(540px) scale(1);transform:rotateY(90deg) translateZ(540px) scale(1);opacity:1}
.caroussel_diapo1 #carou_quatre:checked ~ .contenu_carou1 .caroussel1 img:nth-child(4){-webkit-transform:rotateY(135deg) translateZ(540px) scale(1);transform:rotateY(135deg) translateZ(540px) scale(1);opacity:1}
.caroussel_diapo1 #carou_cinq:checked ~ .contenu_carou1 .caroussel1 img:nth-child(5){-webkit-transform:rotateY(180deg) translateZ(540px) scale(1);transform:rotateY(180deg) translateZ(540px) scale(1);opacity:1}
/*.caroussel_diapo1 #carou_six:checked ~ .contenu_carou1 .caroussel1 img:nth-child(6){-webkit-transform:rotateY(225deg) translateZ(540px) scale(1);transform:rotateY(225deg) translateZ(540px) scale(1);opacity:1}
.caroussel_diapo1 #carou_sept:checked ~ .contenu_carou1 .caroussel1 img:nth-child(7){-webkit-transform:rotateY(270deg) translateZ(540px) scale(1);transform:rotateY(270deg) translateZ(540px) scale(1);opacity:1}
.caroussel_diapo1 #carou_huit:checked ~ .contenu_carou1 .caroussel1 img:nth-child(8){-webkit-transform:rotateY(315deg) translateZ(540px) scale(1);transform:rotateY(315deg) translateZ(540px) scale(1);opacity:1}
*/
/*****Fin Caroussel ****/