body{
  margin:10;
  background-color : #f2f0f0;
  padding : 2% 2% 2% 2%;
  }
  
h1, h2, h5{
	margin:0;
}


.img3{
  width: 100%;
  height: 100%;

}


h5{
	color: #0000bc;
	 font-family: verdana;
	 width:70%;
	   margin-bottom : 100px;
	   align-items: center;
}


h6{
	color: #0000bc;
	 font-family: verdana;
	   margin-bottom : 0px;
	   align-items: right;
	   line-height : 0;
}


.ligne{
	height: 3px;
  background: linear-gradient(to right, #feaf37, #dd2a60);
  overflow : hidden;
  margin-bottom : 20px;

}


.micro{
	width:10%;
	 float : left ;

}


.conteneur{
  margin-left: 0%;
  margin-right: 0%;
  background-color :#f2f0f0;
  overflow : hidden;
  margin-bottom : 20px;
}

.conteneur2{
	margin-left:0%;
	width:33.33%;
  background-color : ;
  overflow : hidden;
 float: left
}

.conteneur2bis{
	width:40%;
	 overflow : hidden;
 float: left;
 margin-bottom : 40px;

}

.conteneur2bisbis{
	width:50%;
  background-color : white;
  overflow : hidden;
 float: left
}

.conteneur3{
width:33.33%;
  background-color : ;
  margin bottom : 10px;
float : right;

}

.conteneur4{
width:33.33%;
  background-color : ;
  margin bottom : 10px;
margin: 0 auto;

}

.conteneur4bis{
width:60%;
background-color : #ffff;
margin bottom : 10px;
margin: 0 auto;
float : right;
margin-bottom : 40px;
}

.conteneur5{
width:40;
background-color : #ffff;
}


.titre{
margin:0% 0 0% 0%;
font-size : 30px;
font-family: verdana;
color: #0000bc;
 

}

.titrearticle{
margin-left:0%;
  	margin-right: 10%;
  	font-size : 30px;
  	margin-bottom : 1%;
  	font-family: verdana;
  	color: #0000bc;

}

.texte{
	  	margin-bottom : 0%;
	margin-left: 15%;
  	margin-right: 10%;
  	font-family: verdana;
  	 	 	color: #0000bc;
  	font-size: 10pt;
}


.textegauche{
	  	margin-bottom : 0%;
	margin-left: 5%;
  	margin-right: 10%;
  	font-family: verdana;
  	 	 	color: #0000bc;
}

.sous-titre {
  margin:0 0 2% 0%;
  font-size : 20px;
  font-family: verdana;
  color: #0000bc;

}

.sous-sous-titre{
  margin-right: 10%;
  font-size : 20px;
  font-family:'Lato', sans-serif;
  color: #0000bc;

}

.image2{
	position:relative;
	z-index: 1;

 }
 
.image2:hover {
  filter: blur(2px);
  position:relative;
	z-index: 1;
}

.textesurimage{
		width:25%;
	position:absolute;
	z-index: 2;
	margin:0% 0% 0% 0%;
	opacity:0%;
}

.textesurimage:hover {
	position:absolute;
	z-index: 2;
 	margin:-40% 0% 0% 0%;
	opacity:100%;
	font-family:'Lato', sans-serif;
	
}

.imagecaroussel{
 display: flex;
 animation-duration : 15s;
 animation-name : mesImages; 
 animation-iteration-count: infinite;

}

@keyframes mesImages {
	0%{
	transform: translateX(0)
	}
	50%{
	transform: translateX(-100%)
	}
}


.lienindex{
	width:10%;
	  margin-bottom : 15px;

}

.lienindex:hover {
  filter: blur(1px);
  position:relative;
	z-index: 1;
}

.barrenavigation{
	width:30%;
	position : relative;
	display : inline-block;
	float : right;
	margin-top:-8%;	 
	background-color : transparent ;
}

.troisbarre{
	position : relative;
	width:30px;
float : right;

}

.dropdown-menu{
	display : none;
	position : relative;
	min-width : 50px;
	text-align : right;
	color: #0000bc;
	margin-right : 15%;
	margin-top : -4%;
}

a {
	text-decoration: none;
	color: #0000bc;
	font-family: verdana;
}


.dropdown-menu a:hover{
	background-color : #dd2a60;
	color : #0000bc;
	text-decoration: none;

}

.barrenavigation:hover .dropdown-menu{
	display : block;	
}

.barrenavigation:hover .troisbarre{
  position:relative;
	z-index: 1;
	float : right;	
}


.imageclassiqueconteneur5{
	margin:10% 10% 10% 10%;
	margin-bottom : 10%;
}

.texteindex{
		margin-bottom : 0%;
	margin-left: -00%;
  	margin-right: 0%;
 font-family: verdana;
  	 	 	color: #0000bc;
  	 	 	width: 70%;
 
}

@media (min-width: 200px) and (max-width: 900px){
  body {
padding: 2% 2% 2% 2%;
}
.lienindex{
	width:20%;
}
.conteneur2bis{
float:none;
width:100%;
margin-bottom:0;

}

.conteneur4bis{
float:none;
width:100%;
padding-top:1%;
}
.texte{
	margin-left:7.5%;
	margin-right:5%;
}
}