@charset "UTF-8";
/* CSS Document */



body
{
margin:0;
}



/* -----------------------------  HEADER : LOGO + NAV  ---------------------------- */


/* ---------------header----------- */


#header
{
z-index: 2;
position: absolute;
width:100%;
}


/* -------------logo KALYTA---------- */



#icon-menu-mobile

{
	display:none;
}



#boite-logo-kalyta
{
width:100%;
	height:195px;
	margin:0;
	text-align: center;
	top:0;

}


#logo-kalyta
{
	width:360px;
	height:150px;
	margin-top:0px;
	margin-left:auto;
	margin-right:auto;
	margin-bottom:20px;
	padding-top:25px; 
}



/* ---------------NAV------------ */

nav
{

	width:100%;
	height:25px;

	margin-left:auto;
	margin-right:auto;

}



#menu
{
	width:900px;
	height:100%;
	margin-left:auto;
	margin-right:auto;

}




nav ul
{
	
height: 25px;
list-style-type: none;
margin-bottom: 0px;
margin-left: 0px;
margin-right:0px;
margin-top: 0px;
width: 900px;
margin-top:0px;
text-align:center;

}



nav li
{
	display:inline-block;
	height:100%;
	width:auto;
	padding-right:6px;
	font-family:'Noto Sans', sans-serif;
	font-weight:500;
	text-transform:none;
	color:#585858;
	font-size:17px;
	text-decoration:none;
	letter-spacing:-0.25px;
	
}




nav li a
{ 
	display:block;
	font-family:'Noto Sans', sans-serif;
	font-weight:500;
	text-transform:none;
	color:#585858;
	font-size:17px;
	text-decoration:none;
	letter-spacing:-0.25px;

}



nav li a:hover

{ 
	color:#000;

}




.actif
{
	display:inline-block;
	height:100%;
	width:auto;
	
	font-family:'Noto Sans', sans-serif;
	font-weight:700;
	text-transform:none;
	color:#333;
	font-size:17px;
	text-decoration:none;
	letter-spacing:-0.25px;
	
}



.separateur-vertical
{ 
font-family:'roboto', sans-serif;
	font-weight:300;
	color:#ccc ;
}



.anglais-francais
{  
	
	font-family:'Noto Sans', sans-serif;
	font-weight:700;
	text-transform:none;
	font-size:17px;
	text-decoration:none;
	color:#923463;
	

}

/* ---------------NAV mobile------------ */


#menu-mobile
{
width:100%;
	height:195px;
	margin:0;
	top:0;
	margin-left: auto;
	margin-right: auto;
	display:none;

}




/* --------------------------------------------- FORMATAGE DU TEXTE ------------------------------------------------------- */




/* ----------  grand titre de partie --------------- */


h1
{
	font-family:'Noto serif', serif;
	font-weight:700;
	font-size:30px;
	color:#933663; 
	text-decoration:none;
	margin-top:0px;
	margin-bottom:25px;
	letter-spacing: 0.2px;
	text-align: center;
}

/* petit filet rose sous grand titre H1 */

hr
{
	height:1px;
	border:0;
	background-color:#933663;;
	width:50px;
	margin-left:auto;
	margin-right:auto;
	margin-top:0px;
	margin-bottom:50px;
}	

/* filet gris clair */

.separateur 
{
	height:1px;
	border:0;
	background-color:#ddd;;
	width:500px;
	margin-left:auto;
	margin-right:auto;
	margin-top:10px;
	margin-bottom:60px;
}

.space
{
	height:1px;
	border:0;
	background-color:#fff;;
	width:500px;
	margin-left:auto;
	margin-right:auto;
	margin-top:10px;
	margin-bottom:60px;
	display: none;
}
.space2
{
	height:1px;
	border:0;
	background-color:#fff;;
	width:500px;
	margin-left:auto;
	margin-right:auto;
	margin-top:10px;
	margin-bottom:60px;
	display: none;
}



/* -------------sous titre 1 - exemple : notre philosophie ----------- */

h2
{
	font-family:'Noto Sans', sans-serif;
	font-weight:700;
	font-size:20px;
	color:#3C3C3B;
	text-decoration:none;
	margin-top:20px;
	margin-bottom:10px;
	text-align:center;
	display: block;
	padding-bottom: 10px;
	width:500px;
	margin-left:auto;
	margin-right:auto;
}

h2 a
{
	font-family:'Noto Sans', sans-serif;
	font-weight:700;
	font-size:20px;
	color:#3C3C3B;
	text-decoration:none;
	margin-top:20px;
	
	text-align:center;
	display: block;
	
}




/* ------------------ texte courant ------------------------------------*/	
	
p
{
	font-family:'Noto Serif', serif;
	font-weight:300;
	font-size:17px;
	color:#4a484c;
	text-decoration:none;
	line-height:28px;
	margin-top:10px;
	margin-bottom:20px;
	text-align:justify;
		 -webkit-hyphens: auto;

 -moz-hyphens: auto;

 -ms-hyphens: auto;

 -o-hyphens: auto;

 hyphens: auto;
	
	
}

p a
{
	font-family:'Noto Serif', serif;
	font-weight:400;
	font-size:16px;
	color:#4a484c;
	text-decoration:none;
	text-align:center;
	margin:auto;
	

}

/* ------------------ adresse mail ------------------------------------*/	



h3
{
	font-family:'Noto Serif', serif;
	font-weight:400;
	font-size:16px;
	color:#933663;
	text-decoration:none;
	line-height:24px;
	margin-top:0px;
	margin-bottom:20px;
	text-align:center;
	display: block;
	padding-bottom: 65px;
	
}

h3 a
{
	font-family:'Noto Serif', serif;
	font-weight:400;
	font-size:16px;
	color:#933663;
	text-decoration:none;
	

	
	
}





/* ------------------ texte dans footer ------------------------------------*/	




h5
{
	display:block;
	font-family:'Noto Sans', sans-serif;
	font-weight:400;
	font-size:12px;
	color:#933663;
	text-decoration:none;
	line-height:17px;
	margin-top:0px;
	width:100%;
	height:20px;
	margin-left:auto;
	margin-right:auto;
	margin-bottom:10px;
	text-align:center;
	opacity: 0.7;
	
	
	
}	


h5 a
{
	color:#933663;
	text-decoration:none;
	opacity: 0.9;
	
}	







/* --------------------------------------------------------- QUI SOMMES NOUS ------------------------------------------------ */



/* -------------------- image sous le header --------------- */




#image-1

{
	z-index: 1;
    width:100%;
	height:900px;
	background-image:url(images/image-1.jpg);
	
	background-repeat:no-repeat;
	background-position:50% 50%;
	margin:0;
	background-color:#faf3f3;
}





#histoire
{

	width:670px;
	margin-left:auto;
	margin-right:auto;	
	background-color:#ffffff;
	margin-top:0px;
	margin-bottom:0px;
	padding-top:90px;
	padding-bottom:110px;
	
}





#axes-intervention
{

	width:670px;
	margin-left:auto;
	margin-right:auto;	
	background-color:#ffffff;
	margin-top:0px;
	margin-bottom:0;
	padding-top:90px;
	padding-bottom:0px;
	margin-left:auto;
	margin-right:auto;
	
}

#domaines-intervention
{

	width:670px;
	margin-left:auto;
	margin-right:auto;	
	background-color:#ffffff;
	margin-top:0px;
	margin-bottom:0;
	padding-top:50px;
	padding-bottom:110px;
	margin-left:auto;
	margin-right:auto;
	
}




/* ----------------  bandes images 2 et 3 ----------------   */



#bande-image-1

{
	margin-left:auto;
	margin-right:auto;
	text-align:center;
	background-color:#fff;
}


#bande-image img
{
max-width: 100%;
}


#image-a
{
	display:inline-block
}


#image-b
{
	display:inline-block;
	margin-bottom:50px;
}


#petite-image img
{

	width:600px;
	height:auto;
	
}

#bande-image-2

{
	margin-left:auto;
	margin-right:auto;
	text-align:center;
	background-color:#fff;
}


#bande-image img
{
max-width: 100%;
}


#image-a
{
	display:inline-block
}


#image-b
{
	display:inline-block;
	margin-bottom:50px;
}


#petite-image img
{

	width:600px;
	height:auto;
	
}



/* -------------------------------------------------------    NOS SERVICES ET METIERS    ------------------------------------------------ */


#intro
{
width:670px;
	margin-left:auto;
	margin-right:auto;
	padding-top:60px;
	padding-bottom:80px;

}

#services
{

	width:100%;
	margin-left:auto;
	margin-right:auto;	
	background-color:#f9f0f1;
	margin-top:0px;
	margin-bottom:0px;
	padding-top:20px;
	padding-bottom:10px;
	
}


#sous-nav
{

	width:700px;
	margin-left:auto;
	margin-right:auto;	
	background-color:#ffffff;
	padding-top:10px;
}


/* ----------------  sous nav nos métiers et services ----------------   */

h6
{
	font-family:'Noto Serif', serif;
	font-weight:700;
	font-size:15px;
	color:#333;
	margin-top:0px;
	margin-bottom:8px;
	

	text-align:left;
	
	
}

h6 a
{
	font-family:'Noto Serif', serif;
	font-weight:700;
	font-size:14px;
	color:#333;
	text-decoration:italic;
	text-align:center;
	text-decoration:none;
	margin:auto;
	
	

}

.fleche
{
	font-family:'Noto Serif', serif;
	font-weight:700;
	font-size:16px;
	color:#933663;
	text-decoration:italic;
	text-align:center;
	text-decoration:none;
	
	
	display:block;
	float:left;

	
	

}




/* -----------  Missions ---------- */



#petite-photo-services
{


	margin-left:auto;
	margin-right:auto;
	margin-top:	0px;
	margin-bottom: 20px;
	text-align:center;
}


#petite-photo-services img
{

	width:600px;
	height:auto;
	
}







#numero
{

	width:40px;
	height:40px;
	margin-left:auto;
	margin-right:auto;
	padding-top:20px;
	margin-top:30px;
	
}





.separateur2 
{
	height:2.5px;
	border:0;
	background-color:#333;;
	width:90px;
	margin-left:auto;
	margin-right:auto;
	margin-top:15px;
	margin-bottom:60px;
}







h4
{
	font-family:'Noto Serif', serif;
	font-weight:300;
	font-size:15px;
	color:#444;
	text-decoration:none;
	line-height:20px;
	margin-top:30px;
	margin-bottom:17px;
	text-align:justify;
	display:block;
	width:600px;
	letter-spacing:0.4px;
		 -webkit-hyphens: auto;

 -moz-hyphens: auto;

 -ms-hyphens: auto;

 -o-hyphens: auto;

 hyphens: auto;
 margin-left:52px;
}




.partenaires
{
	display:block;
    font-family:'roboto', sans-serif;
	font-weight:500;
	font-size:15px;
	color:#923463;
	margin-top:10px;
	font-style: italic;
	
	}
	
	
	.partenaires a
{
	display:block;
    font-family:'roboto', sans-serif;
	font-weight:500;
	font-size:14px;
	color:#333;
	margin-top:6px;
	margin-bottom: 2px;
	font-style: italic;
	text-decoration:none;
	
	}
	
	
	
	
.separateur3 
{
	height:1px;
	border:0;
	background-color:#933663;
	width:50px;
	margin-bottom:45px;
	margin-left:52px;
}


	
	
	
	
	

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







#competence-1

{
    
	width:700px;
	margin-left:auto;
	margin-right:auto;	
	


	
	text-align:center;
	margin-bottom:40px;
	margin-top:50px;

	
	
}









#competence-2

{
    
	width:700px;
	margin-left:auto;
	margin-right:auto;	
	
	margin-top:0px;
	margin-bottom:0px;

	margin-top:20px;
	margin-bottom:40px;
	padding-top:0px;
	text-align:center;

	
}


#competence-3

{
    
	width:700px;
	margin-left:auto;
	margin-right:auto;	
	
margin-top:20px;
	margin-bottom:0px;

	margin-top:0px;
		margin-bottom:40px;
	
	text-align:center;
	
}


#competence-4

{
    
	width:700px;
	margin-left:auto;
	margin-right:auto;	
	
	margin-top:20px;
	margin-bottom:0px;

	margin-top:0px;
		margin-bottom:40px;

	text-align:center;
}



#competence-5

{
    
	width:700px;
	margin-left:auto;
	margin-right:auto;	
	
	margin-top:20px;
	margin-bottom:0px;

	margin-top:0px;
		margin-bottom:40px;

	text-align:center;
	
}



#competence-6

{
    
	width:700px;
	margin-left:auto;
	margin-right:auto;	
	
margin-top:20px;
	margin-bottom:0px;

	margin-top:0px;
		margin-bottom:70px;

	text-align:center;
	
}









/* ----------------------------------------- NOTRE EQUIPE ---------------------------------------------------------- */


#grande-photo

{
	margin-left:auto;
	margin-right:auto;
	text-align:center;
	padding-top:280px; 
	background-color:#fff;
}


#grande-photo img
{
max-width: 100%;
}
	
	

#portrait
{
width:100%;
height:150px;
padding-bottom:0px;
margin-top:10px;
	margin-bottom: 0px;

	text-align: center;


}



#bio
{
	display:block;
	width:670px;
    height:165px;
	padding-top:0px;
	padding-left:0px;
	padding-bottom:0px;
	text-align:justify;

}



#fondateurs
{

	width:670px;
	margin-left:auto;
	margin-right:auto;	
	background-color:#fff;
	margin-top:0px;
	margin-bottom:0px;
	padding-top:60px;
	padding-bottom:0px;
	
}




#evri
{

	width:670px;
	height:400px;
	margin-left:auto;
	margin-right:auto;	
	background-color:#ffffff;
	margin-top:0px;
	margin-bottom:20px;
	padding-top:20px;
	
}


#thi
{

	width:670px;
	height:375px;
	margin-left:auto;
	margin-right:auto;	
	background-color:#ffffff;
	margin-top:0px;
	margin-bottom:20px;
	padding-top:20px;
	
}

#rodica
{

	width:670px;
	height:400px;
	margin-left:auto;
	margin-right:auto;	
	background-color:#ffffff;
	margin-top:0px;
	margin-bottom:20px;
	padding-top:20px;
	
}


#valerie
{

	width:670px;
	height:430px;
	margin-left:auto;
	margin-right:auto;	
	background-color:#ffffff;
	margin-top:0px;
	margin-bottom:20px;
	padding-top:20px;
	
	
}

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



#consultants
{

	width:100%;
	margin-left:auto;
	margin-right:auto;	
	background-color:#f9f0f1;
	margin-top:40px;
	margin-bottom:0px;
	padding-top:90px;
	padding-bottom:0px;
	
}




#lise
{

	width:670px;
	height:400px;
	margin-left:auto;
	margin-right:auto;	
	
	margin-top:0px;
	margin-bottom:150px;
	padding-top:20px;
	
}


#philippe
{

	width:670px;
	height:400px;
	margin-left:auto;
	margin-right:auto;	
	
	margin-top:40px;
	margin-bottom:110px;
	
}


#arcadius
{

	width:670px;
	height:370px;
	margin-left:auto;
	margin-right:auto;	
	
	margin-top:40px;
	margin-bottom:80px;
	
}



#guillaume
{

	width:670px;
	height:400px;
	margin-left:auto;
	margin-right:auto;	
	
	margin-top:40px;
	margin-bottom:80px;
	
}

#charlot
{

	width:670px;
	height:490px;
	margin-left:auto;
	margin-right:auto;	
	
	margin-top:0px;
	margin-bottom:20px;
	
}



#moussa
{

	width:670px;
	height:370px;
	margin-left:auto;
	margin-right:auto;	
	
	margin-top:40px;
	margin-bottom:80px;
	
}








/* --------------------------------------------------------- PARTENAIRES ------------------------------------------------ */



#partenaires
{

	width:800px;
	height:1100px;
	margin-left:auto;
	margin-right:auto;	
	background-color:#ffffff;
	margin-top:0px;
	margin-bottom:0px;
	padding-top:60px;
	margin-bottom:0px;

 
	
}

/* --------------  ligne 1 ----------------------- */

#ligne-logo-1
{

	width:800px;
	height:200px;
	margin-left:auto;
	margin-right:auto;	
	background-color:#ffffff;
	padding-top: 30px;
}



#logo-adieinternational
{
width:175px;
height:175px;
margin-right:auto;
	margin-left: auto;
padding-bottom:0px;
margin-top:10px;
margin-bottom:50px;
	float: left;
	margin-left:15px;
		
}



#logo-adie
{
width:175px;
height:auto;
margin-right:auto;
	margin-left: auto;
padding-bottom:0px;
margin-top:20px;
margin-bottom:50px;
	float: left;
	margin-left: 170px;
		
}


#logo-adie img
{
width:90px;
height:auto;
		
}





#logo-proparco
{
width:175px;
height:auto;
margin-right:auto;
	margin-left: auto;
padding-bottom:0px;
margin-top:10px;
margin-bottom:50px;
	float: left;
	margin-left: 80px;
	padding-top: 50px;
		
}


#logo-proparco img
{
width:185px;
height:auto;

		
}


/* --------------  ligne 2 ----------------------- */


#ligne-logo-2
{

	width:800px;
	height:200px;
	margin-left:auto;
	margin-right:auto;	
	background-color:#fff;
	float: left;

}



#logo-trickle-up
{
width:175px;
height:auto;
margin-right:auto;
	margin-left: auto;
padding-bottom:0px;

margin-bottom:0px;
	float: left;
	padding-top:40px;
	margin-right: 135px;
	
		
}

#logo-trickle-up img
{
width:160px;
height:auto;
		
}

#logo-omoana
{
width:175px;
height:auto;
margin-right:auto;
	margin-left: auto;
padding-bottom:0px;

margin-bottom:50px;
	float: left;
	margin-left: 20px;
	padding-top:30px; 
	margin-right: 110px;
	
		
}


#logo-omoana img
{
width:170px;
height:auto;
		
}





#logo-acme
{
width:170px;
height:auto;
margin-right:auto;
	margin-left: auto;
padding-bottom:0px;

margin-bottom:50px;
	float: left;
	margin-left: 15px;


		
}



#logo-acme img
{
width:170px;
height:auto;
		
}



/* --------------  ligne 3  ----------------------- */


#ligne-logo-3
{

	width:800px;
	height:200px;
	margin-left:auto;
	margin-right:auto;	
	background-color:#fff;
	float: left;

}



#logo-f3e
{
width:175px;
height:auto;
margin-right:auto;
	margin-left: auto;
padding-bottom:0px;

margin-bottom:0px;
	float: left;
	padding-top:40px;
	margin-right: 135px;
	
		
}

#logo-f3e img
{
width:150px;
height:auto;
		
}

#logo-crg
{
width:175px;
height:auto;
margin-right:auto;
	margin-left: auto;
padding-bottom:0px;

margin-bottom:50px;
	float: left;
	margin-left: 20px;
	padding-top:30px; 
	margin-right: 100px;
	padding-left:20px;
	
		
}


#logo-crg img
{
width:120px;
height:auto;
		
}





#logo-sidi
{
width:170px;
height:auto;
margin-right:auto;
	margin-left: auto;
padding-bottom:0px;

margin-bottom:50px;
	float: left;
	
	padding-top:20px;
	padding-left:5px;


		
}



#logo-sidi img
{
width:135px;
height:auto;
		
}





/* --------------  ligne 4  ----------------------- */


#ligne-logo-4
{

	width:800px;
	height:200px;
	margin-left:auto;
	margin-right:auto;	
	background-color:#fff;
	float: left;
	

}



#logo-vahatra
{
width:175px;
height:auto;
margin-right:auto;
	margin-left: auto;
padding-bottom:0px;

margin-bottom:0px;
	float: left;
	padding-top:80px;
	margin-right: 135px;
	
		
}

#logo-vahatra img
{
width:120px;
height:auto;
padding-left:20px;
		
}

#logo-fonkoze
{
width:175px;
height:auto;
margin-right:auto;
	margin-left: auto;
padding-bottom:0px;

margin-bottom:50px;
	float: left;
	margin-left: 20px;
	padding-top:90px; 
	margin-right: 60px;
	padding-left:10px;
	
		
}


#logo-fonkoze img
{
width:130px;
height:auto;
		
}






#logo-atia
{
width:175px;
height:auto;
margin-right:auto;
	margin-left: auto;
padding-bottom:0px;

margin-bottom:50px;
	float: left;
	margin-left: 20px;
	padding-top:110px; 
	margin-right: 0px;
	padding-left:30px;
	
		
}


#logo-atia img
{
width:130px;
height:auto;
		
}











/* ------------------------------------------------------------------------------- CONTACT ---------------------------------------------------- */




#contact
{

	width:800px;
	height:740px;
	margin-left:auto;
	margin-right:auto;	

	margin-top:0px;
	margin-bottom:0px;
	padding-top:60px;
	margin-bottom:0px;
	
}







form {
    /* Pour le centrer dans la page */
    margin: 0 auto;
    width: 500px;
    /* Pour voir les limites du formulaire */
	padding-top:30px;
    border: 0px solid #CCC;
}



form div + div {
    margin-top: 25px;
}


label {
    /* Afin de s'assurer que toutes les étiquettes aient la même dimension et soient alignées correctement */
    display: block;
    width: 120px;
    text-align: left;
	font-family:'Noto Sans', sans-serif;
	font-size:14px;
	padding-right:15px;
	padding-bottom:10px;
	color:#555;
}




input, textarea {
    /* Afin de s'assurer que tous les champs textuels utilisent la même police
       Par défaut, textarea utilise une police à espacement constant */
    font: 1em sans-serif;

    /* Pour donner la même dimension à tous les champs textuels */
    width: 500px;
	height:35px;
    -moz-box-sizing: border-box;
    box-sizing: border-box;

    /* Pour harmoniser l'apparence des bordures des champs textuels */
    border: 0px solid #eee;
	background-color:#eee;
	padding:10px;
}



input:focus, textarea:focus {
    /* Afin de rehausser les éléments actifs */
    border-color: #eee;
}



textarea {
    /* Pour aligner correctement les champs multilignes et leurs étiquettes */
    vertical-align: top;

    /* Pour donner assez d'espace pour entrer du texte */
    height: 10em;

    /* Pour permettre aux utilisateurs de redimensionner un champ textuel horizontalement
       Cela ne marche pas avec tous les navigateurs  */
    resize: vertical;
}


.button {
    /* Pour positionner les boutons de la même manière que les champs textuels */
    padding-left: Opx; /* même dimension que les étiquettes */
	 margin-left:auto;
	margin-right:auto;

	
}

button {
    /* Cette marge représente approximativement le même espace
       que celui entre les étiquettes et les champs textuels */
    margin-left:auto;
	margin-right:auto;
	background-color:#933663;
	height:35px;
	width:220px;
	margin-top:20px;
	font-size:15px;
	color:#FFF;
	padding-bottom:5px;
	font-family:'Noto Sans', sans-serif;
	letter-spacing:0.5px;
	border:0px;

}



.success_message {
	padding-top: 50px;
	color: #fff;
	font-size: 20px;
	font-weight: 300;
	
}

.error_message {
	padding-top: 50px;
	color: #fff;
	font-size: 20px;
	font-weight: 300;
	
}







/* --------------------------------------------------------------------------------  FOOTER ------------------------------------------------------- */







#footer
{

	width:100%;
	margin-left:auto;
	margin-right:auto;	
	background-color:#e8d7d9;
	padding-top:15px;
	padding-bottom:15px;
	margin-left:auto;
	margin-right:auto;
	
}



#lien-page-suivante
{

	width:700px;
	margin-left:auto;
	margin-right:auto;	
	
	margin-top:0px;
	margin-bottom:0;
	padding-top:5px;
	padding-bottom:20px;
	margin-left:auto;
	margin-right:auto;
	
	
}

#lien-page-suivante-service
{

	width:700px;
	height: 50px;
	margin-left:auto;
	margin-right:auto;	
	
	margin-top:0px;
	margin-bottom:50px;
	padding-top:5px;
	padding-bottom:40px;
	margin-left:auto;
	margin-right:auto;
	
	
}




#logo-kalyta-footer
{
	width:213px;
	height:75px;
	margin-left:auto;
	margin-right:auto;
	padding-bottom:35px;
	margin-top:10px;

}


#boite-retour
{

	width:100%;
	height:100px;
	margin:0;
	margin-top:30px;

}




.retour
{
display:block;
font-family:'Roboto',sans serif;  
	font-weight:300;
	color:#999;
	
	font-size:14px;
	text-align:center;
	padding-top:0px;
	padding-bottom:40px;
	text-decoration:none;
}




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




/* selection du texte */
::selection

{
	background-color:#DDD;
	color:black;
}

/* Firefox */

::-moz-selection 
{
	background-color:#CCC;
	color:black;

}