body {
	background:linear-gradient(white,#bcdef5);
/*	max-width: 1600px;  */
	margin-left: auto;
	margin-right: auto;
	width: 98%; /* largeur obligatoire pour être centré */
	min-width:600px;
	margin-left :1%;
	margin-right:1%;
	font-family: verdana;
	height : auto;
}
/* ------------------------------- Style du header ------------------------------------------------------- */
header{	
				/* border-width: 1px;
				border-style: ridge;
				border-color: #5087C5;
				border-radius : 10px; */
				padding-left: 1%;
				padding-right: 1%;
				padding-top : 10px;
				padding-bottom : 1px;
	
		/* --------- Style de la 1ere case gauche du header contenant le logo --------- */		
}			
		.head_1{
				display: inline-block; 		/*permet de placer ce 1er bloc côte à côte du 2nd */
				vertical-align: top;		/* aligne les 2 blocs au dessus */
				text-align: center;
				/*width : 22% ;*/
				width : 250px;
			/*------------encadrement pour réglage mise en page----------------*/
				/*
				border-width: 1px;
				border-style: ridge;
				border-color: #5087C5;
				border-radius : 10px; 
				padding-left: 1%;
				padding-right: 1%;
				padding-top : 10px;
				padding-bottom : 1px;
				*/
			/*------------------fin encadrement------------------------*/
			}
				.logo{						/* position logo haut*/
					width:150px;				
				}
		

		/* --------- Style de la 2eme case du header contenant le menu --------- */		
		.head_2{
				display: inline-block; 		/*permet de placer ce 2° bloc côte à côte du 1er */
				vertical-align: top;
				width: 70%;
				/*height: auto; */	
				height : auto;
				/*padding : 0% 0% 0% 0%;*/ /* haut | droit | bas | gauche */
				margin-top : 40px; 
				/*------------encadrement pour réglage mise en page----------------*/
					/*
					border-width: 1px;
					border-style: ridge;
					border-color: #5087C5;
					border-radius : 10px; 
					*/
					/*padding-left: 1%;
					padding-right: 1%;
					padding-top : 10px;
					padding-bottom : 1px;*/
				/*----------fin encadrement--------------*/
				
		}
			
			nav ul.entete{ 						/* bandeau blanc du menu tout en haut */
					text-align: center; 		/* le texte du menu est centré */
					height : auto;
					color:white;	
							
			}
			nav li.entete{
					display:inline-block; 		/* affiche le menu sur une ligne */
					width:15%; 
					vertical-align: middle;
					min-width : 120px;
					max-width : 150px;
					background-color: #FCF7EC;
					/* color:white; */
					height : auto; 
					/* height : 25px; */
					font-size : 0.9em;
					/*border-width: 1px;*/
					/*border-style: ridge;*/
					border-color: #5087C5;
					border-radius : 2px; 
					padding-left: 0%;
					padding-right: 0%;
					padding-bottom :2px;
					padding-top : 0px;
			}
			
			nav li.entete_selection{            /* affiche en gros l'onglet en cours */
					display:inline-block; 		/* affiche le menu sur une ligne */
					width:15%; 
					vertical-align: middle;
					min-width : 120px;
					max-width : 150px;
					background-color: #fcf3cf; /*#FAA44C;  orange foncé */
					/* background-color:#FCF7EC ; */ /* orange pâle */
					/* height : 20px; */
					/*color:red;*/
					height : auto; 
					/*height : 25px; */
					font-size : 0.9em;
					font-weight : bold;
					/*	color:red; */
					/*border-width: 1px;*/
					/* border-style: ridge; */
					border-color: #5087C5;
					border-radius : 2px;
					padding-left: 0%;
					padding-right: 0%;
					padding-bottom :2px;
					padding-top : 0px;
			}
			nav li.espace{
					display:inline-block; 		/* espace entre les items du menu sur une ligne */
					width:0px;
					vertical-align: middle;
				}
			

			a:hover {			/* changement couleur menu au survol souris */ 
			color:white;
			background-color: #FFA500;
			font-size : 1em;	
			}

		
	
			p.petiteLigneSousLogo{
					/*position : relative; 	*//* permet d'ajuster la position de la ligne */
					/*top:0px;	*/		 /* remonte de 10 px la ligne */
					text-align : center;
					font-size :0.7em;
					line-height: 6px;
					color: #5087C5;
			}
			p.text1_sous_menu{
					position : relative; 	/* permet d'ajuster la position de la ligne */
					/* top:1px;		*/	 /* remonte de 10 px la ligne */ 
					text-align : center;
					font-size :1.2em;
					line-height: 10px;
					color: #5087C5;  /* ------ bleu -----*/
					/* color: #FAA44C; */ /*----- orange ---- */
			}
			p.text2_sous_menu{
					position : relative; 	/* permet d'ajuster la position de la ligne */
				/*	top:10px;	*/		 /* remonte de 10 px la ligne */
					text-align : center;
					font-size :0.8em;
					line-height: 8px;
					   color: #5087C5;  /* ------ bleu -----*/
					/* color: #FAA44C; */ /*----- orange ---- */
			}
	

/* ------------------------------- Style du corps ------------------------------------------------------- */
section{
	display: block; /* les blocs de section se positionnent les uns au dessus des autres */
	height : auto;
	width: 100%; /* largeur obligatoire pour être centré */
	/*min-width:10px;
	margin-left :1%;
	padding-right:5%; */
	padding-top : 0px;
	padding-bottom : 30px;
					/* BORDURES DE REGLAGES : NE PAS EFFACER ! */
					/*
					border-width: 1px;
					border-style: ridge;
					border-color: #5087C5;		
					border-radius : 10px; 
					*/
		}
			.descriptif{
				display: inline-block;
				vertical-align: top;
					position : relative; 	/* permet d'ajuster la position de la ligne */
					top:-40px;				/* remontée de xx px*/	
				width:90%;   /* reglage a faire avec le width du bloc à droite (vid_automatisme) et (image_droite) */
				text-align: left;
					padding-left: 5%;
					padding-right: 5%;
					font-size :0.9em;
					color: #226699;
					text-decoration: ;
					font-family :arial;
					line-height: 20px; 
			
						/* BORDURES DE REGLAGES : NE PAS EFFACER ! */
						/*
						border-width: 1px;
						border-style: outset;
						border-color: orange;
						border-radius : 10px;
						*/
			}
			.enonce{
				display: inline-block;
				vertical-align: top;	
					position : relative; 	/* permet d'ajuster la position de la ligne */
					top:-30px;				/* remontée de xx px*/	
				width: 55%;  /* reglage a faire avec le width du bloc à droite (vid_automatisme) et (image_droite) */
				text-align: left;
				padding-left: 0%;
				padding-right: 1%;
					
						/* BORDURES DE REGLAGES : NE PAS EFFACER ! */
						/*
						border-width: 1px;
						border-style: outset;
						border-color: orange;
						border-radius : 10px;
						*/
			}
			.important {
				display: inline-block;
				vertical-align: top;	
				position : relative; 	/* permet d'ajuster la position de la ligne */
				top:-40px;				/* remontée de xx px*/	
				width: 55%;  /* reglage a faire avec le width du bloc à droite (vid_automatisme) et (image_droite) */			
			}
			.image_droite{
				display: inline-block; 	/* permet au bloc vid_automatisme de se positionner à droite du bloc précédent */
				vertical-align: top;
				width: 38%;  		/* reglage a faire avec le width du bloc à gauche (enonce) */
				/* margin-right:10px; */
				padding: 2px 10px 2px 2px; 
				/*padding-left: 1%;*/
				height : auto;
			
						/* BORDURES DE REGLAGES : NE PAS EFFACER ! */
						/*
						border-width: 1px;
						border-style: outset;
						border-color: orange;
						border-radius : 10px;
						*/
			}
				h1{
					position : relative; 	/* permet d'ajuster la position de la ligne */
					top:-30px;				/* remontée de xx px*/	
					text-align: center;
					padding-left: 2%;
					padding-right: 5%;
					font-size :1.1em;
					color: #226699;
					text-decoration: normal;
					font-family :arial;
					line-height: 23px;
				}
				h2{
					text-align: left;
					padding-left: 10%;
					padding-right: 5%;
					font-family :arial;
					font-size :0.9em;
					color: #226699;
					font-weight :normal;
					line-height: 18px;
				}
				
				h2.marque{
					text-align: center;
					padding-left: 10%;
					padding-right: 10%;
					font-family :arial;
					font-size :0.9em;
					color: #226699 ;
					font-weight :bold;
					line-height: 18px;
				}
				h2.vert{
					text-align: center;
					padding-left: 5%;
					padding-right: 5%;
					font-family :arial;
					font-size :1.8em;
					color: #33b703 ;
					font-weight :bold;
					line-height: 20px;
				}
				h2.bleu{
					text-align: center;
					padding-left: 5%;
					padding-right: 5%;
					font-family :arial;
					font-size :1.8em;
					color: #0e7bf0 ;
					font-weight :bold;
					line-height: 20px;
				}
				h2.orange{
					text-align: center;
					padding-left: 5%;
					padding-right: 5%;
					font-family :arial;
					font-size :1.8em;
					color: #f57c0b ;
					font-weight :bold;
					line-height: 20px;
				}

				h3{
					text-align: center;
					padding-left: 5%;
					padding-right: 5%;
					font-family :arial;
					font-size :0.9 em;
					color: #226699;
					/*font-weight :normal;*/
					line-height: 15px;
					/* font-weight :bold; */
					/* text-decoration: underline; */
				}
				p.qr{
					font-family :Bahnschrift;
					font-size :1em;
					text-align: center;
					color: #f57c0b ;
					}
				p.aere{
					text-align: center;
					padding-left: 20%;
					padding-right: 20%;
					
					font-family :Bahnschrift;
					font-size :1em;
					color: #226699 ;
					font-weight :lighter;
					line-height: 25px;
				}
				p.fonce{
					text-align: center;
					padding-left: 20%;
					padding-right: 20%;
					
					font-family :verdana;
					font-size :0.9em;
					color: #226699 ;
					font-weight :bold;
					line-height: 25px;
				}
				
				p.centre{
					font-family :verdana;
					font-size :1.2em;
					text-align: center;
					color: #f57c0b ; 
					}
					
				p.lien_bleu{
				color : #0e7bf0;
				text-align: center;
				font_size : 1.6em;
				}	
				a.lien_bleu {								/* couleur et soulignement texte menu  */
				color : #0e7bf0;
				font_size : 1.6em;
				text-decoration: underline;
				text-align: center;
				}

				.sanssautdeligne{
					white-space:nowrap; /* ne pas sauter de ligne*/
					padding-left: 2%;
					font-family :arial;
					font-size :0.1 em;
					color: #FAA44C;
					font-weight :normal;							/* font-weight :bold; */
				}
				ul.centre {
					vertical-align: top;
					text-align: left;
					font-family :arial;
					padding-left: 22%;
					padding-right: 5%;
					font-size :1.1em;
					line-height: 22px;
					color: #226699;
				}
				.images_schema{
					display: bloc;
					padding-left : 0%;
					padding-right :0.5%;
					text-align:center
				}
				.images_distib{
					display: bloc;
					padding-left : 1.5%;
					padding-right :1.5%;
					text-align:center
				}
				.images_reseaux{
					display: bloc;
					padding-left : 1.5%;
					padding-right :1.5%;
					text-align:center
				}
				.img_dist{
					width:350px;
					height : auto;
					border-radius : 5px;
				}
				.img_irve1{
					display: bloc;
					padding-left : 1.5%;
					padding-right :1.5%;
					width:auto;
					height :80px ;
					text-align:center
				}
				.img_irve2{
					display: bloc;
					padding-left : 1.5%;
					padding-right :1.5%;
					width:auto;
					height :30px ;
					text-align:center
				}
				.img_irve3{
					position : relative; 	/* permet d'ajuster la position de la ligne */
					top:-18px;				/* remontée de xx px*/	
					width:auto;
					height :200px ;
					/*text-align:center*/
				}
				.img_dist:hover{  /* zoom au survol de l'image horizontale */
					border-width: 3px;
					border-style: outset;
					border-color: orange;
											
					width:400px;
					height : auto;
					border-radius : 5px;
				}
				.img_dist2{
					height: 262px;
					width: auto;
					border-radius : 5px;
				}
				.img_dist2:hover{	 /* zoom au survol de l'image verticale */
					border-width: 3px;
					border-style: outset;
					border-color: orange;
					height: 312px;
					width: auto;
					border-radius : 5px;
				}
				.img_dist4{
					height: 262px;
					width: auto;
					border-radius : 5px;
				}
				.img_dist4:hover{	 /* zoom au survol de l'image verticale */
					border-width: 3px;
					border-style: outset;
					border-color: orange;
					height: 312px;
					width: auto;
					border-radius : 5px;
				}
				
				.img_dist3{
					height: 262px;
					width: auto;
					border-radius : 5px;
				}
				.img_dist3:hover{	 /* zoom au survol de l'image verticale */
					border-width: 3px;
					border-style: outset;
					border-color: orange;
					height: 312px;
					width: auto;
					border-radius : 5px;
				}
				
				.ma_video
				{
					display: inline-block; 	/* permet au bloc vid_automatisme de se positionner à droite du bloc précédent */
					vertical-align: top;
								position : relative; 	/* permet d'ajuster la position de la ligne */
								top:-40px;				/* remontée de xx px*/	
					width: 38%;  		/* reglage a faire avec le width du bloc à gauche (enonce) */
					margin-right:10px; 
					padding: 2px 2px 2px 2px; 
					/* BORDURES DE REGLAGES : NE PAS EFFACER ! */
					/*
					border-width: 1px;
					border-style: outset;
					border-color: orange;
					border-radius : 10px;
					*/
				}
				.ma_video:hover{
				}
				.video-container {
					overflow: hidden;
					border-radius: 20px;
				}
				.video-responsive { 
					overflow:hidden; 
					border-radius : 20px;
					position:relative;
					padding-bottom: 56.25%; /* 16:9 aspect ratio */
					border: 1px solid transparent; /* Ajout d'une bordure transparente pour permettre le débordement */
				}
				.video-responsive video {
					position: absolute;
					top: 0px;
					left: 0px;
					width: 100%;
					height: 100%;
				}
				.video-responsive figcaption {
					position: absolute;
					bottom: -15px;
					left: 0;
					width: 100%;
					text-align: center; /* Facultatif : ajuste le texte au centre */
					background: rgba(0, 0, 0, 0); /* Facultatif : ajoute un fond semi-transparent */
					color: #fff; /* Facultatif : ajuste la couleur du texte */
					padding: 0px; /* Facultatif : ajoute un espace autour du texte */
					clip: rect(1px, 1px, 1px, 1px); /* Masque le texte visuellement */
					clip-path: inset(50%);
				}
				

/* ------------------------------- Style du footer ------------------------------------------------------- */
	footer {
	/*	background:linear-gradient(white,#bcdef5);*/
	background-color:#5087C5;
	position: relative;
	color : white;
	height : auto;
	border-width: 1px;
	border-style: ridge;
	border-color: #5087C5;
	border-radius : 10px;
	padding-left: 3%;
	padding-right: 3%;
}
p.basdepage{
	text-align: center;
	position: relative;
	color : white;
	line-height: 2;
	font-size :0.8em;
}
p.petit {
	position: relative;
	font-size :0.6em;
	color : white;
	text-align: center;
}
@media all and (max-device-width: 1024px)  /* ---------------------------------- MISE EN PAGE  POUR MOBILES -----------------------------------------------*/
{
	body {
		background:linear-gradient(white,#bcdef5);
		margin-left: auto;
		margin-right: auto;
		width: 98%; /* largeur obligatoire pour être centré */

		margin-left :1%;
		margin-right:1%;
		font-family: verdana;
		height : auto;
	}
	/* ------------------------------- Style du header ------------------------------------------------------- */
	header{	
					/*
					border-width: 1px;
					border-style: ridge;
					border-color: #5087C5;
					border-radius : 10px; 
					*/
					padding-left: 1%;
					padding-right: 1%;
					padding-top : 10px;
					padding-bottom : 1px;
		
			/* --------- Style de la 1ere case gauche du header contenant le logo --------- */		
	}			
			.head_1{
					display: inline-block; 		/*permet de placer ce 1er bloc côte à côte du 2nd */
					vertical-align: top;		/* aligne les 2 blocs au dessus */
					width: 36%;	
					/*width: 260px;*/					
				
					/* min-width : 130px; permet de ne pas écraser le logo quand on retrecit la fenetre */	
					height: auto;
					padding-top:5px;
					
					/*				border-width: 1px;
									border-style: ridge;
									border-color: #5087C5;
									border-radius : 10px; 
					*/
					/*------------encadrement pour réglage mise en page----------------*/
					/*
					border-width: 1px;
					border-style: ridge;
					border-color: #5087C5;
					border-radius : 10px; 
					padding-left: 1%;
					padding-right: 1%;
					padding-top : 10px;
					padding-bottom : 1px;
					*/
					/*------------------fin encadrement------------------------*/
					} 
					.logo{						/* position logo haut*/
						/* width:160px;
						   padding-left: 40px; */
						width: 100%;
						padding-left :1%;
					}
		
			/* --------- Style de la 2eme case du header contenant le menu --------- */		
			.head_2{
					display: inline-block; 		/*permet de placer ce 2° bloc côte à côte du 1er */
					vertical-align: middle;
					width: 57%;
					/*height: 100px;*/	
					height: auto;	
					
					/*------------encadrement pour réglage mise en page----------------*/
					/*
					border-width: 1px;
					border-style: ridge;
					border-color: #5087C5;
					border-radius : 10px; 
					padding-left: 1%;
					padding-right: 1%;
					padding-top : 10px;
					padding-bottom : 1px;
					*/
					/*------------------fin encadrement------------------------*/
			}	
		
					p.petiteLigneSousLogo{
						display : none;
					}
					p.text1_sous_menu{
						position : relative; /* permet d'ajuster la position de la ligne */
						text-align : center;
						line-height : 1.2;
						font-size :1.5em;
						/*color: #FAA44C;    orange */
						color: #5087C5;
					}
					p.text2_sous_menu{
						/*display : none; */
						position : relative; /* permet d'ajuster la position de la ligne */
						text-align : center;
						line-height : 1.2;
						font-size :1.5em;
						/*color: #FAA44C;    orange */
						color: #5087C5;
					}

				nav ul.entete{ 						/* bandeau blanc du menu tout en haut */
						text-align: center; 		/* le texte du menu est centré */
						height : auto; 				
			}
				nav li.entete{
						display:inline-block; 		/* affiche le menu sur une ligne */
						width:70%;
						min-width : 80px;
						max-width : 500px;
						background-color:#FCF7EC  ; 
						height : auto;
						font-size :2.5em;
						border-width: 3px;
						border-style: ridge;
						border-color: #5087C5;
						border-radius : 10px; 
						padding-left: 0%;
						padding-right: 0%;
						padding-bottom :6px;
						padding-top : 6px;
				}
				nav li.entete_selection{            /* affiche en gros l'onglet en cours */
						display:inline-block; 		/* affiche le menu sur une ligne */
						width:70%;
						min-width : 80px;
						max-width : 500px;
						background-color: #fcf3cf ; /*#FAA44C;  orange foncé */
						color:white;
						height : auto;
						font-size : 2.8em;
						font-weight : bold;
						border-width: 3px;
						border-style: ridge;
						border-color: #5087C5;
						border-radius : 10px; 
						padding-left: 0%;
						padding-right: 0%;
						padding-bottom :6px;
						padding-top : 6px;
				}
				a {								/* couleur et soulignement texte menu  */
					color : #225699;
					text-decoration: underline;
				}
				a:hover {			/* changement couleur menu au survol souris */ 
				color:white;
				text-decoration:none;
				background-color: tan;
				}
				

	/* ------------------------------- Style du corps ------------------------------------------------------- */
	section{
		display: block; /* les blocs de section se positionnent les uns au dessus des autres */
		height : auto;
		width: 100%; /* largeur obligatoire pour être centré */
		/*min-width:10px;
		margin-left :1%;
		padding-right:5%; */
		padding-top : 20px;
		padding-bottom : 20px;
						
						/*
						border-width: 1px;
						border-style: ridge;
						border-color: #5087C5;		
						border-radius : 10px;
						*/
	}
				.descriptif{
					display: inline-block;
					vertical-align: top;
						position : relative; 	/* permet d'ajuster la position de la ligne */
						top:-40px;				/* remontée de xx px*/	
					width:90%;   /* reglage a faire avec le width du bloc à droite (vid_automatisme) et (image_droite) */
					text-align: left;
						padding-left: 5%;
						padding-right: 5%;
						font-size :2em;
						color: #226699;
						text-decoration: ;
						font-family :arial;
						line-height: 40px; 

				}
				.enonce{
						display: inline-block;
						vertical-align: top;						
						width: 100%; /* reglage a faire avec le width du bloc à droite (vid_automatisme) */
				}
			
							h1{
								text-align: left;
								padding-left: 2%;
								padding-right: 5%;
								font-size :2em;
								color: #226699;
								text-decoration: underline;
								font-family :arial;
								line-height: 40px;
							}
							h2{
								text-align: left;
								padding-left: 5%;
								padding-right: 5%;
								font-family :arial;
								font-size :2em;
								color: #226699;
								font-weight :normal;
								line-height: 40px;
							}
							h3{
								text-align: left;
								padding-left: 10%;
								padding-right: 5%;
								font-family :arial;
								/*font-size :0.9em;*/
								font-size :2em;
								color: #FE642E;
								font-weight :normal;							/* font-weight :bold; */
								text-decoration: underline;
							}
								h2.marque{
									text-align: center;
									padding-left: 5%;
									padding-right: 5%;
									font-family :arial;
									font-size :2.5em;
									color: #226699 ;
									font-weight :bold;
									line-height: 45px;
								}
								h2.vert{
									text-align: center;
									padding-left: 5%;
									padding-right: 5%;
									font-family :arial;
									font-size :3em;
									color: #33b703 ;
									font-weight :bold;
									line-height: 20px;
								}
								h2.bleu{
									text-align: center;
									padding-left: 5%;
									padding-right: 5%;
									font-family :arial;
									font-size :3em;
									color: #0e7bf0 ;
									font-weight :bold;
									line-height: 20px;
								}
								h2.orange{
									text-align: center;
									padding-left: 5%;
									padding-right: 5%;
									font-family :arial;
									font-size :3em;
									color: #f57c0b ;
									font-weight :bold;
									line-height: 20px;
								}
								p.qr{
								font-family :Bahnschrift;
								font-size :3em;
								text-align: center;
								color: #f57c0b ;
								}
								p.aere{
									text-align: center;
									padding-left: 1%;
									padding-right: 1%;
									
									font-family :Bahnschrift;
									font-size :2.5em;
									color: #226699 ;
									font-weight :normal;
									line-height: 45px;
								}
								p.fonce{
									text-align: center;
									padding-left: 1%;
									padding-right: 1%;
									
									font-family :verdana;
									font-size :2.5em;
									color: #226699 ;
									font-weight :bold;
									line-height: 45px;
								}
								
								p.centre{
									font-family :verdana;
									font-size :5em;
									text-align: center;
									color: #f57c0b ; 
									}
								p.lien_bleu{
									color : #0e7bf0;
									text-align: center;
									font-size : 3em;
								}	
							
								.sanssautdeligne{
								white-space:nowrap; /* ne pas sauter de ligne*/
								padding-left: 2%;
								font-family :arial;
								font-size :0.1 em;
								color: #FAA44C;
								font-weight :normal;							/* font-weight :bold; */
							}

							ul.centre {
								text-align: left;
								font-family :arial;
								padding-left: 15%;
								padding-right: 5%;
								font-size :2em;
								line-height: 36px;
								color: #226699;
							}
							.images_schema{
							display: bloc;
							padding-left : 0%;
							padding-right :0.5%;
							text-align:center
							}
							.images_distib{
							display: bloc;
							padding-left : 1.5%;
							padding-right :1.5%;
							
							text-align:center
							}
							.images_reseaux{
							display: bloc;
							padding-left : 1.5%;
							padding-right :1.5%;
							text-align:center
							}
							.img_dist{
							/* width:350px; */
							width: 30%;
							height : auto;
							border-radius : 15px;
							}
							.img_irve1{
							display: bloc;
							padding-left : 1.5%;
							padding-right :1.5%;
							width:auto;
							height :150px ;
							text-align:center
							}
							.img_irve2{
							display: bloc;
							padding-left : 1.5%;
							padding-right :1.5%;
							width:auto;
							height :60px ;
							text-align:center
							}
							.img_irve3{
							/*	position : relative; */	/* permet d'ajuster la position de la ligne */
							/*	top:-18px;	*/			/* remontée de xx px*/	
								width:auto;
								height :400px ;
								/*text-align:center*/
							}
									.img_dist:hover{   
									border-width: 3px;
									border-style: outset;
									border-color: orange;
									border-radius : 30px;
																
									width:40%; 
									height : auto;
									border-radius : 5px;
									
									}
									*/
							.img_dist2{
								height: auto;
								width: 30%;
								border-radius : 5px;
							}
									
									.img_dist2:hover{	 
										border-width: 3px;
										border-style: outset;
										border-color: orange;
										border-radius : 6px;
										
										height: auto;
										width: 40%;
										
										
									}
									*/
							.img_dist3{
								height: 262px; 
								width: auto;
								border-radius : 5px;
							}
									
									.img_dist3:hover{	  
										border-width: 3px;
										border-style: outset;
										border-color: orange;
										border-radius : 6px;	
										
										height: 272px; 
										width: auto;
								
										
									}
									
							.img_dist4{
								height: auto;
								width: 12%;
								border-radius : 5px;
							}
									.img_dist4:hover{	 
										border-width: 3px;
										border-style: outset;
										border-color: orange;
										border-radius : 6px;	
										
										height: auto;
										width: 35%;
									}
									
									.image_droite{
									font-family :arial;
									padding-left: 15%;
									padding-right: 5%;
									font-size :2em;
									line-height: 36px;	
									}
									
									
				.ma_video
				{
					/*display: inline-block; */	/* permet au bloc vid_automatisme de se positionner à droite du bloc précédent */
					vertical-align: top;
					
						width: 99%;  		/* reglage a faire avec le width du bloc à gauche (enonce) */
						/* margin-right:10px; */
						padding: 5px 5px 5px 5px; /* reglage haut/droit/bas/gauche */
						
						/* BORDURES DE REGLAGES : NE PAS EFFACER ! */
						/*
						border-width: 1px;
						border-style: outset;
						border-color: orange;
						border-radius : 10px;
						*/
				}	
				.ma_video:hover{
					
				}
				.video-responsive { 
						overflow:hidden;
						border-radius : 20px;
						position:relative;
						}
			
	/* ------------------------------- Style du footer ------------------------------------------------------- */
		footer {
	/*	background:linear-gradient(white,#bcdef5);*/
		background-color:#5087C5;
		position: relative;
		color : white;
		height : auto;
		border-width: 1px;
		border-style: ridge;
		border-color: #5087C5;
		border-radius : 10px;
		padding-left: 3%;
		padding-right: 3%;
	}
	p.basdepage{
		text-align: center;
		position: relative;
		color : white;
		line-height: 1.2em;
		font-size :1.3em;
	}
	p.petit {
		position: relative;
		font-size :1.3em;
		color : white;
		text-align: center;
	}
}

