@media (min-width: 641px) {
	body {
		width: auto;
		margin: 5px;
		padding: 5px;
		font-size:40px;
	}
	.breaking{
		font-size:1.5em;
	}
	.diaporama{
		padding-bottom:80px;	
	}
	hr {
/*		display: none; */
		color: black;
	    border-bottom-style: groove;
	    border-bottom-color: coral;
	    border-bottom-width: 7px;
	}

	img.ouEtQuand{
		width:80px;
		height:90px;
	}

	img.logoPart{
		display: block;
		max-width:250px;
		max-height:150px;
		width: auto;
		height: auto;
		margin-left: 10px;
		margin-right: 10px;
	}
	
	.sponsor_slide {
		background-color: #fff;
		width:250px;
		height:150px;
		text-align:center;
		vertical-align:middle;
		display: none;
	}

	img.slidePix{
		display: block;
		max-width:1000px;
		max-height:750px;
		width: auto;
		height: auto;
		margin-left: auto;
		margin-right: auto;
	}
	.pix_slide {
		width:100%;
		height:100%;
		text-align:center;
		vertical-align:middle;
		display: none;
	}
	
	img.warningIcon{
		vertical-align:bottom;
		height: 70px;
	}
	
	.enveloppe  {
	  display: flex;
	  flex: 0 1 auto;
	  flex-direction: row;
	  flex-basis: auto;
	}

	.mobile_only {
		display: none !important;
	}
}

@media (max-width: 640px) {
	.breaking{
		font-size:0.6em;
	}
	.diaporama{
		padding-bottom:25px;	
	}
	
	hr {
		color: black;
	    border-bottom-style: groove;
	    border-bottom-color: coral;
	    border-bottom-width: 7px;
	}

	img.ouEtQuand{
		width:50px;
		height:56px;
	}

	img.logoPart{
		display: block;
		max-width:100px;
		max-height:67px;
		width: auto;
		height: auto;
		margin-left: 0px;
		margin-right: 0px;
	}

	marquee{
		font-size:22px;	
	}

	.sponsor_slide {
		background-color: #fff;
		width:90px;
		height:60px;
		text-align:center;
		vertical-align:middle;
		display: none;
	}

	img.slidePix{
		display: block;
		max-width:420px;
		max-height:315px;
		width: auto;
		height: auto;
		margin-left: auto;
		margin-right: auto;
	}
	
	.pix_slide {
		width:100%;
		height:100%;
		text-align:center;
		vertical-align:middle;
		display: none;
	}

	img.warningIcon{
		vertical-align:bottom;
		height: 35px;
	}

	* {
		box-sizing: border-box;
	}
	
	/* passer body (et tous les éléments de largeur fixe) en largeur automatique */

	body {
		width: auto;
		margin: 0;
		padding: 0;
		font-size:20px;
	}
	
	/* fixer une largeur maximale de 100% aux éléments potentiellement problématiques */

	img, table, td, blockquote, code, pre, textarea, input, iframe, object, embed, video {
		max-width: 100%;
	}
	
	/* conserver le ratio des images */

	img {
		height: auto;
	}
	
	/* gestion des mots longs */

	textarea, table, td, th, code, pre, samp {
		-webkit-hyphens: auto; /* césure propre */
		-moz-hyphens: auto;
		hyphens: auto;
		word-wrap: break-word; /* passage à la ligne forcé */
	}
	
	code, pre, samp {
		white-space: pre-wrap; /* passage à la ligne spécifique pour les éléments à châsse fixe */
	}
	
	/* Passer à une seule colonne (à appliquer aux éléments multi-colonnes) */
	.element1,
	.element2 {
		float: none;
		width: auto;
	}
	
	/* masquer les éléments superflus */

	.hide_mobile {
		display: none !important;
	}
	
	/* Un message personnalisé */

/* 
   	body:before {
		content: "Version mobile du site";
		display: block;
		text-align: center;
		font-style: italic;
		color: #777;
	}
/* */

/* We tell all items to be 100% width, via flex-basis */
	.enveloppe  {
	  display: flex;
	  flex-basis: 100%;
	  flex-direction: column;
	}
	.enveloppe > * {
		flex-basis: 100%;
	}
}

.enveloppe > * {
/*  background-color:blue;
  border:2px solid red;
*/  padding:5px;
	font-size:1.0em;
}
body{
	font-family:Verdana;
	background-color:#000;
	color:#fB7;
	height:100%;
/*	padding-left:20px;
	padding-right:10px;
	padding-top:10px;
	overflow:hidden;
*/
}

a{
	color:#eee;
}

.header{
	position:fixed;
	left:0px;
	top:0px;
	right-padding:5px;
}
.breaking{
	background-color:red;
	color:#fff;
	width:100%;
}
.titre{
	font-size:1.5em;
	font-weight:bold;	
}

.center {
    margin-left: auto;
    margin-right: auto;
}


.fade {
	-webkit-animation-name: fade;
	-webkit-animation-duration: 1s;
	animation-name: fade;
	animation-duration: 1s;
}

@-webkit-keyframes fade {
	from {opacity: .2} 
	to {opacity: 1}
}

@keyframes fade {
	from {opacity: .2} 
	to {opacity: 1}
}
