/*
	infos-style.css
	Crération: 15/01/2019
	Modification: 20/01/2019
	Camille FRONTON
*/
* {
  box-sizing: border-box;
}
[class*=zone-]{
	float: left;
	padding: 15px;
	border: 1px solid #659f99;
}
[class*=espace-]{
	border:1px solid #659f99;
	border-left:5px solid #f1c88e;
	background-color:#180119;
	color:#fff5ff;
	padding:0.5em;
	width:98%;
	margin-left:auto;
	margin-right:auto;
}
[class*=marqueTexte-]{
	cursor:pointer;
	padding:0.012em;
	border:1px dotted #c2d7d5;
	content:"message";
}

html,
body{
	font-family:"Helvetica Neue", Helvetica, Arial, Sans-Serif;
	font-size:10pt ;
}
img {
  width: 100%;
  height: auto;
}

.arrondi{
	-webkit-border-radius:0.5em 0.5em 0.5em 0.5em;
	-moz-border-radius:0.5em 0.5em 0.5em 0.5em;
	border-radius:0.5em 0.5em 0.5em 0.5em;
}
.arrondiHaut{
	-webkit-border-radius:0.5em 0.5em 0em 0em;
	-moz-border-radius:0.5em 0.5em 0em 0em;
	border-radius:0.5em 0.5em 0em 0em;
}
.arrondiBas{
	-webkit-border-radius:0em 0em 0.5em 0.5em;
	-moz-border-radius:0em 0em 0.5em 0.5em;
	border-radius:0em 0em 0.5em 0.5em;
}

.tableau{
	width:100%;
}
.tableau th{
	background-color:grey;
	color:white;
}
.tableau td{
	padding:0.6em;
	border:1px solid #659f99;
	width:50%;
}

.nettoyeur{
	content:"";
	clear:both; 
	visibility:hidden;
}
/*---------------------------------------------------------------*/
/* --- Menu vertical --- */
.zone-Menu{
	margin-top:0.42em;
}
.zone-Menu a{
	text-decoration:none;
	text-shadow:1px 2px 2px #233102;
}
.zone-Menu a:link{
	color:#08f8df;
	background-color:#d2e7e5;
	padding:0.3em;
}
.zone-Menu a:visited{
	color:#08f8df;
	background-color:#d2e7e5;
	padding:0.3em;
}
.zone-Menu a:hover{
	color:#d2e7e5;
	background-color:#659f99;
	padding:0.3em;
}
.zone-Menu a:active{
	color:#d2e7e5;
	background-color:#08f8df;
	padding:0.3em;
}

/* --- Menu horizontal --- */
.menuLigne{
	width: 100%;
	background-color:#3a9b65;
}
.menuLigne h2{
	font-weight:bold;
	text-shadow:1px 2px 4px #424948;
	margin-left:0.62em;
	color:#e6e6e6;
}
.menuLigne ul{
	list-style-type: none;
	margin: 0px;
	padding: 0px;
}
.menuLigne li{
	display: inline-block;
	padding: 4px;
	background-color:#3a9b65;
	margin-left:0.3em;
	font-size:87%;
}
.menuLigne li a{
	display:block;
	padding:5px;
	color:#f1f1f1;
	font-weight:bold;
	font-size:87%;
	text-decoration:none;
}
.menuLigne li a:hover,
.menuLigne li a:hover.enCours{
	color:#5b6a5f;
	background-color:#c1e1c9;
	border-radius:0px 6px 0px 6px;
	-webkit-border-radius:0px 6px 0px 6px;
	-moz-border-radius:0px 6px 0px 6px;
	box-shadow: inset 2px 2px 0.5em gray;
	-webkit-box-shadow: inset 2px 2px 0.5em gray;
	-moz-box-shadow: inset 2px 2px 0.5em gray;
}
.menuLigne li a.enCours{
	color:#273a2c;
	background-color:#d6e1c1;
	border-left:1px solid #ecf1e3;
	border-top:1px solid #ecf1e3;
	border-radius:0px 6px 0px 6px;
	-webkit-border-radius:0px 6px 0px 6px;
	-moz-border-radius:0px 6px 0px 6px;
	box-shadow: 2px 2px 0.53em #174724;
	-webkit-box-shadow: 2px 2px 0.53em #174724;
	-moz-box-shadow: 2px 2px 0.53em #174724;
}

/*---------------------------------------------------------------*/
span.marqueTexte-gras1{
	font-weight:bold;
	color:#527e79;
}
span.marqueTexte-gras2{
	font-weight:bold;
	font-style:italic;
	color:#527e79;
}
span.marqueTexte-italique1{
	font-style:italic;
	color:#316b65;
}
span.marqueTexte-italique2{
	font-style:italic;
}

.ephemeride{
	color:#33e7d4;
	padding:0.6em;
	background-color:#24ab9d;
}
.conteneur-Milieu{
	padding:0.7em;
}
/* --- Pour la vidéo --- */
.partie-Affichage{
	width:80%;
	height:auto;
	margin-top:2em;
	margin-left:auto;
	margin-right:auto;
}
.partie-Videos{
	width:100%;
	height:auto;
}
.videos-Messages{
	width:100%;
	border-top:1px dashed #5b6a5f;
	border-bottom:1px dashed #5b6a5f;
	margin-top:0.8em;
	margin-bottom:0.8em;
	color:#18766c;
	background-color:#dff3f1;
	padding:0.36em;
}
.videos-Messages h1{
	font-weight:bold;
	text-shadow:1px 2px 4px #6b7776;
	margin-left:0.62em;
}
.videos-Messages h2{
	font-weight:bold;
	font-style:italic;
	text-shadow:1px 2px 4px #6b7776;
	margin-left:0.62em;
}
.centrage{
	margin-left:auto;
	margin-right:auto;
	width:auto;
	float: none;
}

/*---------------------------------------------------------------*\
 *	Responsive													 * 
\*---------------------------------------------------------------*/
@media only screen and (max-width: 600px) {
	/* Pour les téléphones mobiles: */
	body{
		width:auto;  
	}
	[class*="zone-"] {
		float:left;
		width: 100%;
	}
	img{
		width: 100%;
		height: auto;
	}
	.Corps{
		width:100%;
		margin-left:auto;
		margin-right:auto;
		background-color:#f2fffe;
	}
	.zone-Hautpage{
		background-color:#219f92;
		color:#e7f3f2;
		text-align:center;
		width:100%;
		height:20%;
	}
	.zone-Gauche{
		width:auto;
		padding:0.6em;
	}
	.zone-Droite{
		width:auto;
		padding:0.6em;
	}
	.zone-Baspage{
		background-color:#219f92;
		color:#d4f3f0;
		text-align:center;
		width:100%;
		height:10%;
		padding:0.65em;
		vertical-align:middle;
	}
	.zone-Menu{
		background-color:#d9e8e6;
		width:100%;
		border:1px dotted #829d99;
	}
	.zone-Menu ul{
		list-style:none;
		margin:0px;
		padding:0px;
	}
	.zone-Menu li{
		display:block;
		margin-left:1em;
		padding:0.3em;
	}
	.zone-Image{
		margin-top:0.4em;
	}
	.leTitre{
		font-size:2em;
		font-weight:bold;
		text-shadow:1px 2px #0f4943;
	}
}

/*---------------------------------------------------------------*/
@media only screen and (min-width: 600px){
	/* Tablette en portrait et grand mobile: */
	[class*=zone-]{
		float: left;
		padding: 0.7em;
		border: 1px solid #659f99;
	}
	.Corps{
		width:100%;
		margin-left:auto;
		margin-right:auto;
	}
	.zone-Hautpage{
		background-color:#219f92;
		color:#e7f3f2;
		text-align:center;
		width:100%;
		height:8em;
	}
	.zone-Gauche{
		float:left;
		width:40%;
		padding:1em;
	}
	.zone-Droite{
		float:right;
		width:40%;
		padding:1em;
	}
	.zone-Baspage{
		background-color:#219f92;
		color:#d4f3f0;
		text-align:center;
		width:100%;
		height:3em;
		padding:0.65em;
		vertical-align:middle;
	}
	.zone-Menu{
		background-color:#d9e8da;
		width:100%;
		border:1px solid #829d84;
	}
	.zone-Menu ul{
		list-style:none;
		margin:0px;
		padding:0px;
	}
	.zone-Menu li{
		display:block;
		margin-left:1em;
		padding:0.3em;
	}
	.zone-Image{
		margin-top:0.4em;
	}
	.leTitre{
		font-size:3em;
		font-weight:bold;
		text-shadow:1px 2px #0f4943;
	}
	
}

/*---------------------------------------------------------------*/
@media only screen and (min-width: 768px) and (min-width: 992px){
	/* Tablette en paysage: 768 et plus; Ordinateur portable et de bureau: 992 et plus */
	[class*=zone-]{
		float: left;
		padding: 0.7em;
		border: 1px solid #659f99;
	}
	.Corps{
		width:1200px;
		margin-left:auto;
		margin-right:auto;
		background-color:#d8fffb;
	}
	.zone-Hautpage{
		background-color:#219f92;
		color:#e7f3f2;
		text-align:center;
		width:100%;
		height:8em;
	}
	.zone-Gauche{
		float:left;
		width:40%;
		padding:1em;
	}
	.zone-Droite{
		float:right;
		width:50%;
		padding:1em;
	}
	.zone-Baspage{
		background-color:#219f92;
		color:#d4f3f0;
		text-align:center;
		width:100%;
		height:3em;
		padding:0.65em;
		vertical-align:middle;
	}
	.zone-Menu{
		background-color:#d9e8e6;
		width:100%;
		border:1px dotted #829d99;
	}
	.zone-Menu ul{
		list-style:none;
		margin:0px;
		padding:0px;
	}
	.zone-Menu li{
		display:block;
		margin-left:1em;
		padding:0.3em;
	}
	.zone-Image{
		margin-top:0.4em;
	}
	.leTitre{
		font-size:3em;
		font-weight:bold;
		text-shadow:1px 2px #0f4943;
	}
}

/*---------------------------------------------------------------*/
@media only screen and (min-device-width: 1200px) {
	/* Grand écran */
	[class*=zone-]{
		float: left;
		padding: 0.7em;
		border: 1px solid #659f99;
	}
	.Corps{
		width:1500px;
		margin-left:auto;
		margin-right:auto;
	}
	.zone-Hautpage{
		background-color:#219f92;
		color:#e7f3f2;
		text-align:center;
		width:100%;
		height:8em;
	}
	.zone-Gauche{
		width:40%;
		padding:1em;
	}
	.zone-Droite{
		float:right;
		width:50%;
		padding:1em;
	}
	.zone-Baspage{
		background-color:#219f92;
		color:#d4f3f0;
		text-align:center;
		width:100%;
		height:3em;
		padding:0.65em;
		vertical-align:middle;
	}
	.zone-Menu{
		background-color:#d9e8e6;
		width:100%;
		border:1px dashed #829d99;
	}
	.zone-Menu ul{
		list-style:none;
		margin:0px;
		padding:0px;
	}
	.zone-Menu li{
		display:block;
		margin-left:1em;
		padding:0.3em;
	}
	.zone-Image{
		margin-top:0.4em;
	}
	.leTitre{
		font-size:3em;
		font-weight:bold;
		text-shadow:1px 2px #0f4943;
	}
}

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