*{
	margin:0px;
	padding:0px;
}
body{
	width :100%;
	/*margin:0px;
	padding:0px;*/
	font-family: Arial,Helvetica,sans-serif;
	background: url(images/Filigrane.png);
	background-size: contain;
}

.etiquette{
	text-align:left;
	line-height:150%;
	padding:3px;
	margin:3px;
	font-size: 1rem;
	font-weight: 600;
	color:white;
	background-color: #3094b3;
}
h1{
	text-align:center;
	margin-top:20px;
	margin-bottom:20px;
	font-size: 1.3rem;
	font-weight: 800;
	color:#3094b3;
	/*background-color: white;*/
}
h2{
	text-align:center;
	margin-top:10px;
	margin-bottom:10px;
	font-size: 1.2rem;
	font-weight: 700;
	color:white;
	background-color: #3094b3;
}
h3{
	text-align:center;
	margin-top:5px;
	margin-bottom:3px;
	color:#3094b3;
	font-size: 1.1rem;
	font-weight: 900;
}
img{
	max-width:100%;
	vertical-align:top;
}
.h4{
	text-align:left;
	vertical-align:middle;
	color:white;
	font-size:0.8rem;
	height:45px;
}
.zone_inter{
	text-align:left;
	/*margin-top:40px;
	margin-bottom:40px;*/
	line-height:150%;
}
/*header{
	width :100%;
	Color:white;
	background :#3094b3;
}*/
.global{
	width :100%;
	max-width:1200px;
	margin:auto;
	color:black;
	
}
.image-align-right{
  float : right;
}
/* A mettre sur le parent pour éviter tout débordement de l'effet float */
.float-content:before,
.float-content:after{
	content:"";
	display:block;
	clear:both;
}
.box{
	max-width:1200px;
	margin-top:auto;
	margin-bottom:auto;
	margin-left:5px;
	margin-right:auto;
	display: flex;
	flex-flow: row wrap;
}
/*Quand l'affichage est large*/
.div_gauche{
	width :47%;
	float :left;
	text-align:center;
	margin-top:5px;
	margin-bottom:5px;
	margin-left:auto;
	margin-right:auto;
}
.div_droit{
	width :47%;
	float :left;
	text-align:center;
	margin-top:5px;
	margin-bottom:5px;
	margin-left:auto;
	margin-right:auto;
}
.div_milieu{
	width :100%;
	float :left;
	text-align:center;
	margin-top:5px;
	margin-bottom:5px;
}
.div_news{
	width :100%;
	float :left;
	text-align:center;
	margin-top:5px;
	margin-bottom:5px;
	color:white;
}
.taille_image{
	width:300px;
	float : left;
	margin-right:10px;
}
.taille_image2{
	width:120px;
	float : left;
	margin-right:5px;
}
.taille_image3{
	width:40px;
	float : left;
	margin-right:5px;
}
.taille_image4{
	width:100px;
	float : left;
	margin-right:5px;
	margin-bottom:10px;
}
.taille_news{
	width:300px;
	float : center;
	margin-right:10px;
}
.titre{
	text-align:center;
	vertical-align:middle;
	align-items:middle;
	margin-top:20px;
	font-size: 1.2rem;
	font-weight: 900;
	color:white;
	width:100%;
}
.icone_head{
	height:80px;
	align-items:middle;
	vertical-align:middle;
}

/*Quand l'affichage est moyen*/
@media(min-width: 768px) and (max-width: 1388px){
	/*.global{
		width :100%;
		padding :0px;
	}*/
	.div_gauche{
		width :47%; 
		text-align:center;
		margin-top:5px;
		margin-bottom:5px;
		margin-left:auto;
		margin-right:auto;
	}
	.div_droit{
		width :47%;
		text-align:center;
		margin-top:5px;
		margin-bottom:5px;
		margin-left:auto;
		margin-right:auto;
	}
	.div_milieu{
		width :100%;
		text-align:center;
		margin-top:5px;
		margin-bottom:5px;
	}
	.div_news{
		width :100%;
		text-align:center;
		margin-top:5px;
		margin-bottom:5px;
		color:white;
	}	
	.taille_image{
		width:300px;
		float : left;
		margin-right:10px;
	}
	.taille_image2{
		width:100px;
		float : left;
		margin-right:5px;
	}
	.taille_image3{
		width:40px;
		float : left;
		margin-right:5px;
	}
	.taille_image4{
		width:90px;
		float : left;
		margin-right:5px;
		margin-bottom:10px;
	}
	.taille_news{
		width:300px;
		float : center;
		margin-right:10px;
	}	
	.titre{
		text-align:center;
		vertical-align:middle;
		align-items:middle;
		margin-top:20px;
		font-size: 1.2rem;
		font-weight: 900;
		color:white;
		width:100%;
	}
	.icone_head{
		height:80px;
		align-items:middle;
		vertical-align:middle;
	}
}

@media(max-width: 767px){ 
	/*.global{
		width :100%;
		padding :0px;
	}*/
	.div_gauche{
		width :100%;
		text-align:center;
		margin-top:5px;
		margin-bottom:5px;
	}
	.div_droit{
		width :100%;
		text-align:center;
		margin-top:5px;
		margin-bottom:5px;
	}
	.div_milieu{
		width :100%;
		text-align:center;
		margin-top:5px;
		margin-bottom:5px;
	}
	.div_news{
		width :100%;
		text-align:center;
		margin-top:5px;
		margin-bottom:5px;
		color:white;
	}
	.taille_image{
		width:180px;
		float : left;
		margin-right:10px;
	}
	.taille_image2{
		width:80px;
		float : left;
		margin-right:5px;
	}
	.taille_image3{
		width:35px;
		float : left;
		margin-right:5px;
	}
	.taille_image4{
		width:80px;
		float : left;
		margin-right:5px;
		margin-bottom:10px;
	}
	.taille_news{
		width:180px;
		float : center;
		margin-right:10px;
	}	
	.titre{
		text-align:center;
		vertical-align:middle;
		align-items:middle;
		margin-top:8px;
		font-size: 1.2rem;
		font-weight: 900;
		color:white;
		width:100%;
	}
	.icone_head{
		width:200px;
		height:80px;
		align-items:middle;
		vertical-align:middle;
	}
}
.footer{
	width :100%;
	height:100px;
	display: flex;
	justify-content: center;
	align-items:center;
	padding: 0px;
	margin:0px;
	color: black;
	background-image: url(images/Fondcomplet.jpg);
	background-size: cover;
}

.foot_centre{
	width :100%;
	float :left;
}
.icone_centre{
	width:45px;
	height:45px;
	align-items:middle;
	vertical-align:middle;
}
.logo_centre{
	width:80px;
	align-items:middle;
	vertical-align:middle;
}
.logosuite{
	width:80px;
	background-color:white;
}

/*.main{
	background:#FFFFFF;
	overflow:scroll;
}*/
/*.menu{
	background:#3094b3;
	overflow:auto;
	height:40px;
	top:35px;
}
.menu ul li{
	float:left;
	list-style:none;
}
.menu ul li a{
	line-height:20px;
	display:block;
	padding:0 10px;
	font-size:1rem;
	font-weight: 900;
}*/
nav{
	width: 100%;
	margin: 0 auto;
	position: sticky;
	top: 0px;
	border: none;
}
nav ul{
	list-style-type: none;
	/*background-color: #3094b3;*/
	background-image: url(images/Fondcomplet.jpg);
	background-size: cover;
}
nav ul li{
	float: left;
	width: auto;
	text-align: center;
	position: relative;
	/*background-color: #3094b3;*/
	border: 0px;
}
nav ul::after{
	content: "";
	display: table;
	clear: both;
}
a.menu:link{
	font-size: 0.8rem;
	width:140px;
	color: white;
	text-decoration: none;
	background-color: #3094b300;
	/*background-image: url(images/Fondcomplet.jpg)*/
}
a.menu:visited {
	font-size: 0.8rem;
	width:140px;
	color: white;
	text-decoration: none;
	background-color: #3094b300;
	/*background-image: url(images/Fondcomplet.jpg)*/
}
a.menu:hover {
	font-size: 0.8rem;
	width:140px;
	color: black; 
	background-color: white;
	text-decoration: none;
}
a.deroul:link{
	font-size: 0.8rem;
	width:240px;
	color: white;
	text-decoration: none;
	background-color: #3094b300;
	/*background-image: url(images/Fondcomplet.jpg)*/
}
a.deroul:visited {
	font-size: 0.8rem;
	width:240px;
	color: white;
	text-decoration: none;
	background-color: #3094b300;
	/*background-image: url(images/Fondcomplet.jpg)*/
}
a.deroul:hover {
	font-size: 0.8rem;
	width:240px;
	color: black; 
	background-color: white;
	text-decoration: none;
}
nav a{
	display: block;
	text-decoration: underline;
	color: white;
	background-color: #3094b3;
	border-bottom: none;
	padding: 10px 0px;
}
nav a:visited{
	display: block;
	text-decoration: underline;
	color: white;
	background-color: #3094b3;
	border-bottom: none;
	padding: 10px 0px;
}
nav a:hover{
	color: black;
	background-color: white;
}
nav > ul li:hover .sous{
	display: block;
}
.sous{
	display: none;
	/*box-shadow: 0px 1px 2px #CCC;*/
	color:white;
	background-color: white;
	position: absolute;
	width: 260px;
	z-index: 1000;
}
.sous li{
	float: none;
	width: 100%;
	text-align: left;
}
.sous a{
	padding: 10px;
	border-bottom: none;
	color: white;
	background-color: #3094b3;
}
.sous a:hover{
	border-bottom: none;
	color: #3094b3;
	background-color: white;
}
.container{
	display:flex;
	flex-wrap:wrap;
}
.container>* {
  margin: 0 10px;
  flex: 1 1 200px;
}
a:link {
	color: white;
	background-color: #3094b3;
	text-decoration: none;
}
a:visited {
	color: white;
	background-color: #3094b3;
	text-decoration: none;
}
a:active {
	color: red;
	background-color: #3094b3;
	text-decoration: none;
}
a:hover {
	color: #3094b3; 
	background-color: white;
	text-decoration: none;
}
a.td:link {
	color: white;
	background-color: #3094b3;
	text-decoration: none;
	padding:5px;
	margin:5px;
	border-radius : 5px;
	box-shadow: 5px 2px 2px gray;
	text-align:center;
}
a.td:visited {
	color: white;
	background-color: #3094b3;
	text-decoration: none;
	padding:5px;
	margin:5px;
	border-radius : 5px;
	box-shadow: 5px 2px 2px gray;
	text-align:center;
}
a.td:active {
	color: red;
	background-color: #3094b3;
	text-decoration: none;
	padding:5px;
	margin:5px;
	margin:5px;
	text-align:center;
}
a.td:hover {
	color: #3094b3; 
	background-color: white;
	text-decoration: none;
	padding:5px;
	margin:5px;
	text-align:center;
}
