/*chaque page à son fichier css(pour l'animation slider) */

#entete
{
        
	background-color:green;	
		/* background-image:url(images/background.jpg); */
	color:white;
	margin:auto;
	width:100%;
	min-width:1200px; 
    height:100px;
	margin:auto;
	/*width:1200px;*/
	position:fixed;
	margin-top:0px;
	display:block;  
	z-index:3;
	/* box-shadow:2px 0px 3px 3px #1e90ff; */
	opacity:1;
	left:0px;
	right:0px;
	top:0px;
	
}



.contact
{
	background:white;
	padding:5px;
}


.barre1entete
{
/* background:#000055; */
text-align:right;
	margin-right:10px;
margin:auto;
}

.barre1enteteElement
{
color:#adff2f;
/* border-left:1px solid #e6e6fa;	 */
/* border-right:1px solid #adff2f;color:#adff2f;margin-left:10px; */
padding:3px;
/* background:#fffff0; */
font-family:Calibri;
/* box-shadow:1px 0px 2px 2px #f0ffff; */


}

.barre1enteteElement1
{
	color:#adff2f;
	/*color:/*#adff2fblack;*/
	font-size:12px;
}



#pied
{
	background-image:url(images/background.jpg);
	margin:auto;
	/*background: #eeeeee;*/
	color:white;
	text-align:center;
	width:100%;
	min-width:100%;
	max-width:100%;
	left:0px;
	right:0px;
	bottom: :0px;
	height: 150px;
	/*min-width:1200px;*/
	
	/* margin-top:30px; */

	 
	margin-bottom:-10px;

}

.pied
{
	/*text-align: left;*/
	padding-top: 10px;
	padding-bottom: 10px;
	margin: auto;
	/*margin-left: 10px;*/

}
.copyright
{
	margin-top: 6px;
}



.erText
{
	padding-left:30px;
	padding-right:80px;
	background:	#fffafa;
	text-align:justify;
	padding-bottom:20px;
	padding-top:10px;
}


#autre
{
	text-align:left;
	 
/* box-shadow:1px 0px 2px 1px lightgreen; */
padding:15px;
width:13%;
/*background:#fffff0;*/

color:black;
font-family:Calibri;
/* border-radius:6px; */
/* margin-right:1%; */
 /* margin-left:0.5%;   */
word-wrap: break-word;
font-size:14px;
/*float:right;
font-size:13px;

/* font-size:100%; */

display: inline-block;
vertical-align:top;
margin-top:-14px;
}

.lienAutre
{
	 color:#fffafa;
	 background-image:url(images/background.jpg);
	 /*background:RGB(0,61,122);*/
	 padding-left:5px;
	 padding:8px;
	 font-size:13px;
	 /* font-size:100%; */
	 
}


.enteteCadre
{
text-align:center;
/* width:100%; */
font-family:Arial;
/* padding-top:8px; */
/* font-weight:bold; */
/* font-size: 20px; */
/* float:left; */
/* margin:0 auto 3em; */
/* margin-bottom:-8px; */
min-width:1200px;
max-width:1200px;
width:1200px;
font-size:13px;
margin:auto;
}

.categories 
{width:55%;
font-family:'Arial',Calibri;
/* margin-right:2%; */
/* float:right; */

/* padding:10px; */
margin:auto;
text-align:center;
/* background:#f0ffff; */
margin-right:0%; 
/*float:right;
/*height:1100px; */
background:#0000;
display: inline-block;
vertical-align:top;
margin-left:10px;
margin-right:5px;
}

.article

{width:79%;
font-family:'Calibri',Arial;
/* margin-right:2%; */
/* float:right; */
box-shadow:1px 0px 2px 2px lightgreen;
/* padding:10px; */
margin:auto;
text-align:center;
/*background:#eeeeee;*/
margin-right:0%; 
/*float:right;
/*height:1100px; */
/*max-height:1000px;*/
display: inline-block;
vertical-align:top;
}

.hp
{
	position: fixed;
   bottom: 5px;
   right: 5px;
}

.ImgCategorie
{border-radius:75%;}

.categor
{
	width:97%;
	margin:px;
	margin:auto;
	text-align:center;
	margin-top: 10px;
}


.categor:hover
{
	width:97%;
	margin:px;
	margin:auto;text-align:center;
	opacity:0.5;
}

td{margin:20px;margin:auto;text-align:center;}
tr{margin:auto;text-align:center;}



.menu
{	
	padding-top:0px;
	width:100%;
	text-align:center;
	margin:auto;
	/* border:2px solid black; */
	background:#fff;
	
	
	/*border-radius:20px;
	/*position:fixed;
	box-shadow:1px 0px 2px 2px lightgreen;
	*/position:relative;
        z-index:1;
		border-bottom:1px solid lightgray;
}

a{text-decoration:none;
color:#006400;
font-size:13px;

}

.info
{
	/* position: fixed; */
  /* float:left; */
  /* max-height:1000px;  */
text-align:justify;

padding-left:5px;
width:19%;
background:;
color:black;
font-family:Calibri;
/* border-radius:6px; */
margin-right:0%;
margin-left:0px;
word-wrap: break-word;
font-size:10px;
overflow: auto;
/*max-height:1000px;*/
height:auto;
display: inline-block;
vertical-align:top;
padding-top:px;
margin-top:-20px;
}

.titre
{
color: #8b0000;
width:100%;
font-family:'Aharoni','bebas','Lucida Sans Unicode', 'Lucida Grande', Impact, Charcoal, sans-serif,calibri;
text-align:center;
font-size : 14px;
padding:2px;
border-radius:20px;
box-shadow:1px 0 2px gray;
background:#dcdcdc;
margin:auto;
line-height:18px;
}

.titre a {color:black;}


.titreBETODES
{
color: #df0a02;
width:98%;
font-family:'Aharoni','bebas','Lucida Sans Unicode', 'Lucida Grande', Impact, Charcoal, sans-serif,calibri;
text-align:left;
font-size:20px;
padding:2px;
border-radius:20px;
box-shadow:1px 0 4px gray;
background:#000000;
padding-left:20px;


}



a:hover{color:orange;
/*text-decoration:underline;*/}



.apropos
{margin-top:10px;
/*box-shadow:1px 0px 2px 1px lightgreen;*/
border-radius:2px;
background:;
font-family:'Times';
word-wrap: initial;
 /* max-height:1000px;  */
 padding-bottom:2px;
 font-size:12px;
 overflow: auto;
 
}
.imgApropos
{
	height: 210px;
	width:81%;
	margin-top: 10px;
}


.article1img

{float:left;
margin-left:6px;}

.article1
{width:100%;
box-shadow:1px 0px 2px 2px lightgreen;
border-radius:6px;
height:200px;
background:#f5f5f5;

/* float:right; */
}


h3, h4
{color:#191970;
text-decoration:;
}

.article1description
{
	color:black;/* height:200px; */
	text-align:justify;
}

.bouton
{
	border-radius:6px;
	background:#228b22;
	color:#f8f8ff;
}

#bouttonCommander input:hover
{
	background:#adff2f;
	color:#228b22;
}



#body
{

/* color:black; */
margin :auto;

text-align:center;
font-size:100%;
font-family:Calibri,'Lucida Sans Unicode', 'Lucida Grande',verdana, sans-serif,"times new roman", times,Agency FB ,'Times',;
/* box-shadow:1px 0px 2px 2px #1e90ff; */
margin:auto;
/* box-shadow:1px 0px 2px 1px lightgreen; */
min-width:1200px;
color:black;
max-width:80%;

/*min-height:90%; */
/*max-height:100%; */
margin-top:150px;
/* margin-right:0.5%;  */
/*
/* border-left:1px solid RGB(0,61,122); */
/* border-right:1px solid RGB(0,61,122); */
}





 #menu, #menu ul /* Liste */     
{
        padding : 0; /* pas de marge intérieure */
        margin-right :; /* ni extérieure */
        list-style : none; /* on supprime le style par défaut de la liste */
         line-height : 20px; /* on définit une hauteur pour chaque élément */ 
        text-align : center; /* on centre le texte qui se trouve dans la liste */
		
}

#menu /* Ensemble du menu */
{border-radius:0px;
	list-style-type : none;
        font-weight : bold; /* on met le texte en gras */
        font-family : Arial; /* on utilise Arial, c'est plus beau ^^ */
         /* hauteur du texte : 12 pixels */
		
/* margin-left:90px; */
text-align:center;
margin:auto;
width:1200px;
margin-bottom:0;
/* margin-top:25px; */
min-width:1200px;
/* border-radius:20px; */
 background:white;/*#daa520; */
/* box-shadow:1px 0px 2px 2px #f0ffff; */
height:32px;

}

#menu a /* Contenu des listes */
		{
			/* box-shadow:1px 0px 2px 2px RGB(0,61,122); */
			margin:auto;
			text-align:center;
			background:white;
			/* #daa520 */
			color:black;
			/* border:1px solid green; */
			margin-left:-2px;
			/* display : block; /* on change le type d'élément, les liens deviennent des balises de type block */ 
			padding : 6px; 
			padding-right :6px;
		    padding-left : 6px;
		  /* aucune marge intérieure */
        /* background :#a52a2a; /* couleur de fond */        
        /* color :white; /* couleur du texte */ 
			text-decoration : none; /* on supprime le style par défaut des liens (la plupart du temps = souligné) */
        /* width :244px; /* largeur */ 
			font-family:Calibri ,AR BONNIE;
			color:green;
			font-size : 13px;
			display: inline-block;/* attribut qui permet de mettre les éléments cote à cote*/
	
		}

#menu li /* Elements des listes */      
{/*float : left;*/
display: inline-block;
         /* /* float : left;   */ 
        /* pour IE qui ne reconnaît pas "transparent" */
        border-right : 1px solid #fff; /* on met une bordure blanche à droite de chaque élément */
		margin:auto;
		background:lightgray;
		
}




 #menuFormation, #menuFormation ul /* Liste */     
{
        padding : 0; /* pas de marge intérieure */
        margin-right :0px; /* ni extérieure */
        list-style : none; /* on supprime le style par défaut de la liste */
          /* line-height : 22px;  on définit une hauteur pour chaque élément */   
        text-align : center; /* on centre le texte qui se trouve dans la liste */
		/* margin-top:-8px; */
		 line-height : 15px;
}

#menuFormation /* Ensemble du menu */
{		margin-right :0px;
        font-weight : bold; /* on met le texte en gras */
        font-family : Arial; /* on utilise Arial, c'est plus beau ^^ */
		/*float : right; */
		text-align : center;
		display: inline-block;
}

#menuFormation a /* Contenu des listes */
{
	/* border:1px solid #228b22; */
        display : block; /* on change le type d'élément, les liens deviennent des balises de type block */
        padding : 6px; /* aucune marge intérieure */
		background:white;
			color:black;
			/*padding-right :5px;
			padding-left : 20px;*/
        text-decoration : none; /* on supprime le style par défaut des liens (la plupart du temps = souligné) */
        width : 190px; /* largeur */
		font-family:Calibri ,AR BONNIE;
		font-size : 14px; /* hauteur du texte : 12 pixels */
	    /* margin-bottom:2px;  */
		border-radius:0px;
		display: inline-block;
		text-align : center; 
		color:green;
		}

#menuFormation li  /* Elements des listes */      
{ 		border-right :0px;
        /* float : right;   */
        /* pour IE qui ne reconnaît pas "transparent" */
       /* border-right : 1px solid #fff; /* on met une bordure blanche à droite de chaque élément */
		text-align : right; 
		/* margin-top:-7px; */
}
#menuFormation li a:hover {text-align : center;}
		/* IE ne reconnaissant pas le sélecteur ">" */
		html>body #menu li
{
       /* border-right: 1px solid transparent ; /* on met une bordure transparente à droite de chaque élément */
}

#menuFormation li ul /* Sous-listes */
{ 
        position: absolute; /* Position absolue */
        width: 170px; /* Largeur des sous-listes */
		text-align : ; 
        left: -1000em; /* Hop, on envoie loin du champ de vision */
		 /* position: relative; */
}




#menu a:hover /* Lorsque la souris passe sur un des liens */    
{
		/* border:1px solid white; */
        color: green; /* On passe le texte en noir... */
		background:#fafafa;
		opacity:0.3px;		/* ... et au contraire, le fond en blanc */
		/*text-decoration:underline;
		/* margin-bottom:2px; */
}

 
 #menu li:hover ul ul, #menu li.sfhover ul ul /* Sous-sous-listes lorsque la souris passe sur un élément de liste */
{
        left: -999em; /* On expédie les sous-sous-listes hors du champ de vision */
		
	
}

#menu li:hover ul, #menu li li:hover ul, #menu li.sfhover ul, #menu li li.sfhover ul  /* Sous-listes lorsque la souris passe sur un élément de liste ET sous-sous-lites lorsque la souris passe sur un élément de sous-liste */
{
        left: auto; /* Repositionnement normal */
        min-height: 0; /* Corrige un bug sous IE */
		/* position:relative;  */
		/* float:right; */
}


#menuFormation a:hover /* Lorsque la souris passe sur un des liens */    
{
		/* border:1px solid white; */
       color: green; /* On passe le texte en noir... */
		background:#fafafa;
		opacity:0.3px;		/* ... et au contraire, le fond en blanc */
		/*text-decoration:underline;
		/* margin:7px; */
		text-align : left; 
}

 
 #menuFormation li:hover ul ul, #menuFormation li.sfhover ul ul /* Sous-sous-listes lorsque la souris passe sur un élément de liste */
{
        left: -999em; /* On expédie les sous-sous-listes hors du champ de vision */
		text-align : left; 
	
}

#menuFormation li:hover ul, #menuFormation li li:hover ul, #menuFormation li.sfhover ul, #menuFormation li li.sfhover ul  /* Sous-listes lorsque la souris passe sur un élément de liste ET sous-sous-lites lorsque la souris passe sur un élément de sous-liste */
{
        left: auto; /* Repositionnement normal */
        min-height: 0; /* Corrige un bug sous IE */
		/* position:relative;  */
		/* float:right; */
		background:#7fffd4;
		/* margin:4px; */
		text-align : left; 
}


.slideshow
{text-align:center;
	max-width:460px;
	width:100%;
	height:360px;
	margin-top:px;
	margin:auto;
	/* margin-bottom:100px; */
	 /* margin-right:2%; */
}
.slideshow ul{
	margin:auto;
	text-align:center;
	width:100%;
	padding-left:1px;
	padding-bottom:0px;
height:360px;
/* border:5px solid hsl(0,0%,100%); */
box-shadow:0 0 5px hsla(0,0%,0%,.5);
overflow:hidden;
/*position:relative*/}
    
   
.slide
{
	height:150px;
width:200px;
text-align:center;
margin:auto;


}

#nosProduits
{
width : 800px; 
margin: 0 auto; 
margin-top:0px;	 
}

#slidAccueil{width : 800pxpx;margin: 0 auto; margin-top:0px;margin-bottom:50px;}


#formationService
{
background:	#fffafa;
}

#lienER
{
	display: inline-block;
	vertical-align:top;
	text-align:left;
}

#nosServices
{
padding-left:20px;
text-align:left;
width:%;	
/* margin:auto; */
display: inline-block;
vertical-align:top;
}
#nosFormations
{
padding-left:20px;
text-align:left;
/*float:right;*/
display:inline-block;
vertical-align:top;
width:%;
/* margin:auto; */
margin-left:10px;		
}



.li , .ul{list-style : none;}

   
.slideshow li{
	text-align:center;
height:360px;
width:460px;
/*position:absolute;*/
opacity:0;
-webkit-mask-image:linear-gradient(hsl(0,0%,0%),hsl(0,0%,0%)),
linear-gradient(hsl(0,0%,0%),hsl(0,0%,0%)),
linear-gradient(hsl(0,0%,0%),hsl(0,0%,0%)),
linear-gradient(hsl(0,0%,0%),hsl(0,0%,0%)),
linear-gradient(hsl(0,0%,0%),hsl(0,0%,0%)),
linear-gradient(hsl(0,0%,0%),hsl(0,0%,0%)),
linear-gradient(hsl(0,0%,0%),hsl(0,0%,0%)),
linear-gradient(hsl(0,0%,0%),hsl(0,0%,0%)),
linear-gradient(hsl(0,0%,0%),hsl(0,0%,0%)),
linear-gradient(hsl(0,0%,0%),hsl(0,0%,0%));
-webkit-mask-repeat:no-repeat;
-webkit-mask-size:100% 100%;
animation:slideshow 100s linear infinite}


.slideshow li:nth-child(2){animation-delay:25s}
.slideshow li:nth-child(3){animation-delay:50s}
.slideshow li:nth-child(4){animation-delay:75s}
.slideshow li:nth-child(5){animation-delay:100s}
    
@keyframes slideshow{
0%{opacity:0}
10%{opacity:1}
20%{opacity:1;
-webkit-mask-position:
0 0, 
60px 0, 
120px 0, 
180px 0, 
240px 0,
300px 0, 
360px 0, 
420px 0, 
480px 0, 
580px 0;
-webkit-mask-size:10% 100%}    
25%{opacity:0;-webkit-mask-size:0% 100%}
100%{opacity:0}}


hr
{
	
	color:#228b22;
}




.diap-print{
	display:block;list-style:none;width:100%;height:100%;position:relative;
margin-left:0px;
color:white;
	margin:1px;
position:relative;
left:38%;
transform:translatex(-50%);
width:380px;
height:320px}
.diap-print li{ list-style : none;display : block;opacity:0}
.diap-print li{position:absolute;opacity:0}
.diap-print li img{margin:left}
.diap-print li:nth-child(1),
.diap-print li:nth-child(2),
.diap-print li:nth-child(3),
.diap-print li:nth-child(4){animation:slide1 20s ease infinite;-webkit-animation:slide1 20s ease infinite}
.diap-print li:nth-child(2){animation-delay:5s;-webkit-animation-delay:5s}
.diap-print li:nth-child(3){animation-delay:10s;-webkit-animation-delay:10s}
.diap-print li:nth-child(4){animation-delay:15s;-webkit-animation-delay:15s}
    
@keyframes slide1{0%{opacity:0}10%{opacity:1}25%{opacity:1}30%{opacity:0}100%{opacity:0}}
@-webkit-keyframes slide1{0%{opacity:0}10%{opacity:1}25%{opacity:1}30%{opacity:0}100%{opacity:0}}