@charset "iso-8859-1";
/* --- CHARGEMENT DES @FONTS --- */
/*
@font-face {
	font-family: 'tt-rounds';
	src: url('../fonts/tt-rounds/TT-Rounds-Regular.eot');
	src: url('../fonts/tt-rounds/TT-Rounds-Regular.eot?#iefix') format('embedded-opentype'),
         url('../fonts/tt-rounds/TT-Rounds-Regular.woff') format('woff'),
         url('../fonts/tt-rounds/TT-Rounds-Regular.ttf') format('truetype'),
         url('../fonts/tt-rounds/TT-Rounds-Regular.svg#TTRounds-Regular') format('svg');
    font-style: normal;
    font-weight: normal;
    text-rendering: optimizeLegibility;
	}
*/
@font-face {
	font-family: 'AdrianeText';
	src: url('../fonts/adrianetext-rg/AdrianeText-Rg.eot');
	src: url('../fonts/adrianetext-rg/AdrianeText-Rg.eot?#iefix') format('embedded-opentype'), 
		url('../fonts/adrianetext-rg/AdrianeText-Rg.woff') format('woff'), 
		url('../fonts/adrianetext-rg/AdrianeText-Rg.ttf') format('truetype'), 
		url('../fonts/adrianetext-rg/AdrianeText-Rg.svg#AdrianeText') format('svg');
	font-style: normal;
	font-weight: normal;
	text-rendering: optimizeLegibility;
	}
@font-face {
	font-family: 'open_sanslight';
	src: url('../fonts/opensans_light/OpenSans-Light-webfont.eot');
	src: url('../fonts/opensans_light/OpenSans-Light-webfont.eot?#iefix') format('embedded-opentype'),
		url('../fonts/opensans_light/OpenSans-Light-webfont.woff') format('woff'),
		url('../fonts/opensans_light/OpenSans-Light-webfont.ttf') format('truetype'),
		url('../fonts/opensans_light/OpenSans-Light-webfont.svg#open_sanslight') format('svg');
	font-weight: normal;
	font-style: normal;
	}
.light, .open_sanslight {
	font-family: 'open_sanslight', Arial, Helvetica, Verdana, Sans-Serif; 
	font-weight: normal;
	font-style: normal;
	}
/*
@font-face {
	font-family: 'open_sansregular';
	src: url('../fonts/opensans_regular/OpenSans-Regular-webfont.eot');
	src: url('../fonts/opensans_regular/OpenSans-Regular-webfont.eot?#iefix') format('embedded-opentype'),
		url('../fonts/opensans_regular/OpenSans-Regularwebfont.woff') format('woff'),
		url('../fonts/opensans_regular/OpenSans-Regular-webfont.ttf') format('truetype'),
		url('../fonts/opensans_regular/OpenSans-Regular-webfont.svg#open_sanslight') format('svg');
	font-weight: normal;
	font-style: normal;
	}
.regular, .open_sansregular {
	font-family: 'open_sansregular', Arial, Helvetica, Verdana, Sans-Serif; 
	font-weight: normal;
	font-style: normal;
	}
*/
@font-face {
	font-family: 'open_sansitalic';
	src: url('../fonts/opensans_italic/OpenSans-Italic-webfont.eot');
	src: url('../fonts/opensans_italic/OpenSans-Italic-webfont.eot?#iefix') format('embedded-opentype'),
		url('../fonts/opensans_italic/OpenSans-Italic-webfont.woff') format('woff'),
		url('../fonts/opensans_italic/OpenSans-Italic-webfont.ttf') format('truetype'),
		url('../fonts/opensans_italic/OpenSans-Italic-webfont.svg#open_sansitalic') format('svg');
	font-weight: normal;
	font-style: normal;
	}
.italique, .open_sansitalic {
	font-family: 'open_sansitalic', Arial, Helvetica, Verdana, Sans-Serif; 
	font-weight: normal;
	font-style: normal;
	}
@font-face {
	font-family: 'open_sansbold';
	src: url('../fonts/opensans_bold/OpenSans-Bold-webfont.eot');
	src: url('../fonts/opensans_bold/OpenSans-Bold-webfont.eot?#iefix') format('embedded-opentype'),
		url('../fonts/opensans_bold/OpenSans-Bold-webfont.woff') format('woff'),
		url('../fonts/opensans_bold/OpenSans-Bold-webfont.ttf') format('truetype'),
		url('../fonts/opensans_bold/OpenSans-Bold-webfont.svg#open_sansbold') format('svg');
	font-weight: normal;
	font-style: normal;
	}
.bold, .open_sansbold {
	font-family: 'open_sansbold', Arial, Helvetica, Verdana, Sans-Serif; 
	font-weight: normal;
	font-style: normal;
	}

/* --- CSS DU HTML --- */
html, body { height: 100%; }
body {
	max-height: 100%;
	margin: 0; 
	padding: 0; 
	background-color: #ffffff; 	
	font-family: 'open_sanslight', Arial, Helvetica, Verdana, sans-serif; 
	color: #000000; 
	line-height: 1.6;
	}
ul, ol, li, p, td { 
	font-size: 1em; 
	color: #000000; 
	}
ul.ul2 { margin-left: -20px; padding-left: 0; }
p { 
	margin-bottom: 1em;
	font-size: 1em;
	}
h1, h2, h3, h4, h5, h6, .titre1, .titre2, .titre3, .titre4, .titre5, .titre6 {
	margin: 0.5em 0 0.3em 0;
	font-family: 'AdrianeText', Georgia, 'Times New Roman', Times, serif;
	/* font-family: 'open_sansbold', Arial, Helvetica, Verdana, Sans-Serif; */
	font-weight: normal;
	font-style: normal;
	color: #2c3e50; 	/* midnightblue */
	line-height: 1.2;
	}
h1, .titre1 { margin-top: 0; font-size: 3em; text-transform: uppercase; }
h2, .titre2 { margin-top: 0; font-size: 2.3em; }
h3, .titre3 { font-size: 1.7em; }
h4, .titre4 { font-size: 1.4em; text-transform: uppercase; color: #3498db; }		/* wetasphalt */
h5, .titre5 { font-size: 1.25em; color: #3498db; }	
h6, .titre6 { font-size: 1.1em; color: #3498db; }
.trait-dessous, .souligne { border-bottom: 1px solid #3498db; }
h1.trait-dessous { border-bottom: 1px solid #2c3e50; }
sub, sup { font-size: 0.65em; }
hr { 
	color: #ecf0f1; 
	background-color: #ecf0f1; /* clouds */
	height: 1px; 
	border: #ecf0f1; 
	}
figure { 
	text-align: center;
	}
figcaption { 
	font-size: 0.9em;
	font-family: 'open_sansitalic', Arial, Helvetica, Verdana, Sans-Serif; 
	font-weight: normal;
	font-style: normal;
	color: #34495e; /* wetasphalt */
	}
figure > figcaption { margin-top: 6px; }
img { 
	max-width: 100%; /* Essentiel pour le responsive : redimensionnement des images jusqu'à leur taille de 100%, pas plus */
	height: auto; 
	vertical-align: middle;
	border: none;
	}
aside { 
	font-size: 0.9em; color: #3498db; /* bleu */
	}

/* lien normal */
a:visited, a:link { color: #8e44ad; text-decoration: underline; }	/* violet */
a:active, a:hover { color: #2ecc71; text-decoration: underline; }	/* vert */

/* --- INDEX --- */
.music {
	position: absolute;
	bottom: 0;
	left: 0;
	z-index: 99;
	}
#neige {
	position: absolute;
	top:0; left: 0; 
	width: 100%; height: 98%;
}
/* --- MES STYLES DE BLOCS --- */
#rocketwagon-canvas { z-index:-1; }
.starfield2 { background-color:black; background-image: url('../images/watercolor-universe-2.jpg'); background-repeat:no-repeat; background-size: cover; background-attachment: fixed; }
.fond-img1 { 
	background-image:none; 
	background-color: #666; 
	}
.page, .container, .wrap { /* bloc qui gère la largeur générale du site */
	margin-left: 1.5625%;
	margin-right: 1.5625%;	
	padding: 0; 
	width: auto;
	}
.page2 { 
	margin: 0;
	padding: 30px; 
	width: auto;
	}
.hauteur100 { 
	height: 100%;
	}
.hauteur90 { 
	height:90%;
	}
.hauteur85 { 
	height: 85%;
	}
.table-responsive { width: 96%; margin: 0 2%; color: #ffffff; }
.table-responsive h1, .table-responsive h2, .table-responsive h3, .table-responsive h4, .table-responsive h5, .table-responsive h6, .table-responsive p { color: #ffffff; text-shadow: 1px 1px 2px rgba(0,0,0, 0.9); }
.table-responsive a.bouton1 { text-shadow: none; }
.cell1 { width:50%; }
.cell2 { width:46%; padding: 0 2%; }

.resume, .texte { color: #000; }
.banner-photo-large {
	width: auto;
	height: 250px;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: top left;
	}
.fond1 {
	background-color: transparent;
	}
.fond2 {
	background-color: transparent;
	}
.fond3 {
	background-color: #ffffff;
	}
.ul2 {
	margin-left: 10px;
	padding: 0;
	}
.ul2 li {
	margin: 0.5em 15px;
	padding: 0;
	}
header, #haut { 
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 99;
	padding: 0 1.5%; 
	background-color: #ecf0f1;
	border-bottom: 4px solid #8e44ad;
	box-shadow: 0 3px 12px rgba(0,0,0, 0.1);
	}
.bloc-fixe {
	position: fixed; 
	top:100px; 
	right:1%;
	bottom: 50px;
	z-index: 4;
	/* max-height: 600px;*/
	overflow: auto; 
	}
.marge-h, .marge-top, .marge-haut { padding-top: 100px;  }
.marge-top { margin-top: 50px; }
.marge-dessus { margin-top: 20px; }
.marge-dessous { margin-bottom: 20px; }
footer { 
	margin: 10px 1.5625%;  
	color: #7f8c8d; /* GRIS asbestos */
	}
footer.taille100, .bas2 { 
	margin: 0;
	padding: 8px 0;
	border-top: 4px solid #8e44ad; 
	background-color: #ffffff;
	background-color: rgba(255,255,255,0.9);
	}
footer hr { border-top: 4px solid #8e44ad; 
	}
footer p { 
	color: #7f8c8d; /* GRIS asbestos */
	}
.baseline {
	font-size: 1.2em;
	font-family: 'open_sansbold', Arial, Helvetica, Verdana, Sans-Serif; 
	font-weight: normal;
	font-style: normal;
	color: #7f8c8d; 
	}
.bloc-logo { 
	margin:0;
	padding-top: 7px;
	width: 20%;
	float: left;
	text-align: center; 
	}
.logo { max-width: 96%; height: auto; }
.bloc-nav {
	margin:0;
	width: 80%;
	float: left;
	}
.arborescence { 
	display: bloc;
	color: #95a5a6; /* gris concrete */
	font-size: 0.7em; 
	opacity: 0.75;
	}
#sous-chapitre {
	margin: 15px 0;
	padding: 0;
	background-color: none;
	font-family: 'open_sanslight', Arial, Helvetica, Verdana, Sans-Serif; 
	font-weight: normal;
	font-style: normal;
	}
#sous-chapitre ul {  
	margin: 0; 
	padding: 0; 
	list-style: none; 
	}
#sous-chapitre ul li { 
	margin: 0; 
	padding: 0; 
	list-style: none; 	/* on repete pour certain vieux navigateur comme ie... */
	display: block;	
	float: left;
	}
.fond-contact {
    background-color: #666;
    background-size: cover;
    background-image: url('../images/googlemaps1.jpg');
    background-position: center center;
    height: 90px;
    overflow: hidden;
    transition: all 0.4s ease-out 0s;
	}

/*  MENU
================================================== */
.nav {
	height: 60px;
	position: relative;
	font-size: 20px;
	font-family: 'open_sanslight', Arial, Helvetica, Verdana, Sans-Serif;
	font-weight: normal;
	font-style: normal;
	text-transform: uppercase; 
	color: #2c3e50;
	text-decoration: none;
	z-index: 997;
	}
ul.nav, ul.nav ul { 
	margin: 0; 
	padding: 0; 
	list-style: none; 
	}
ul.nav > li { 
	float: right; 
	transition: 0.2s ease-in;
	}
ul.nav li:hover { 
	background-color: #2ecc71; /* vert */
	}
ul.nav li a:visited, ul.nav li a:link { 
	display: block; 
	padding: 0 15px; /* espacement interieur des boutons */
	height: 60px; 
	line-height: 60px; /* centrage vertical du texte */
	color: #2c3e50;
	text-decoration: none; 
	}
ul.nav li a:active, ul.nav li a:hover { color: #ffffff; text-decoration: none; }
/* decalage a droite du dernier element, dernier lien en rouge */
/* ul.nav > li:last-child { float: right; }
ul.nav li:last-child:hover > ul { right: 0; } */
ul.nav li {	position: relative; }


/*  #SOUS MENU 
================================================== */
ul.nav ul { 
	display: none; /* on cache le sous menu par defaut */
	position: absolute;
	background-color: #ecf0f1;
	border-bottom: 4px solid #8e44ad;
	width: 240px; 
	z-index: 998;
	}
ul.nav li:hover > ul { 
	display: block; /* on affiche le sous menu <ul> au survol de l'element <li> */ 
	}
ul.nav ul ul { top: 0px; left: 240px; } /* positionne le sous-menu a 180px à droite */
ul.nav > li:hover > div { display: block; }


/*  #MENU MOBILE 
================================================== */
#menumobile {
	background-color: transparent;
	}
.bouton-menu-mobile, .bouton-menu-mobile2 { 
	display: block;
	float: left;
	margin: 1.5%; 
	padding: 1.5%;
	width: 94%; 	/* 1.5 + 1.5 + 44 + 1.5 + 1.5 = 50% */
	background-color: #2c3e50; 
	color: #ffffff;
	text-transform: uppercase;
	text-align: center;
	vertical-align: middle;	/* permet l'alignement vertical sur la ligne de texte (images, icones, etc.) */
	box-shadow: 0px 0px 1px #ffffff; /* ombre plutot qu'une bordure a cause des calculs de largeur */
	}
.bouton-menu-mobile:link, .bouton-menu-mobile:visited { 
	background-color: #2c3e50;
	color: #ffffff;
	text-decoration: none; 
	transition: 0.5s ease-out; 
	}
.bouton-menu-mobile:hover, .bouton-menu-mobile:active { 
	background-color: #34495e; 	
	color: #ffffff;
	text-decoration: none; 
	transition: 0.2s ease-in; 
	}
.bouton-menu-mobile2 { 	
	background-color: #34495e; 
	width: 27.33%; 	/* 1.5 + 1.5 + 27 + 1.5 + 1.5 = 33% */
	}
.bouton-menu-mobile2:link, .bouton-menu-mobile2:visited { 
	background-color: #2ecc71; 	
	color: #ffffff;
	text-decoration: none; 
	transition: 0.5s ease-out; 
	}
.bouton-menu-mobile2:hover, .bouton-menu-mobile2:active { 
	background-color: #2c3e50; 	
	color: #ffffff;
	text-decoration: none; 
	transition: 0.2s ease-in; 
	}

/* --- FIN MENU MOBILE --- */

.bloc-article { padding: 1px 25px; }
.bloc-contenu, .contenu { padding: 15px; }

.fond-actualite {
	border-bottom: 1px solid #dddddd;
	}
/* --- BOUTONS, NAVIGATION, LIENS... --- */
.bouton1 { 
	display: inline-block; 	/* non compris par IE7... comme d'hab... */
	*zoom: 1;		/* Pour IE un élément inline qui possède le layout aura le même comportement qu’un inline-block. */
					/*
					Astuce pour s'éviter des feuilles de style conditionnelle que pour IE7 et cie :
					*toto = ne sera compris que par IE7 et -
					_toto = ne sera compris que par IE6 et -		
					*/
	margin: 0; 
	padding: 8px 16px;		/* marges interieures : vertical horizontal */
	background-color: #8e44ad;
	font-family: 'open_sansbold', Arial, Helvetica, Verdana, Sans-Serif;
	color: #ffffff;
	verical-align: middle; 
	white-space: nowrap;
	border-radius: 2px;
	transition: 0.2s ease-in; 
	border: none !important;
	cursor: pointer;
	}
.bouton1:visited, .bouton1:link { 
	background-color: #8e44ad;	/* violet */
	color: #ffffff; 
	text-decoration: none; 
	}
.bouton1:hover, .bouton1:active { 
	background-color: #2ecc71;	/* vert */
	color: #ffffff; 
	text-decoration: none; 
	}

.bouton2 { 
	display: inline-block; /* non compris par IE7... comme d'hab... */
	*zoom: 1;		/* Pour IE un élément inline qui possède le layout aura le même comportement qu’un inline-block. */
	margin: 0; 
	padding: 6px 12px;		/* marges interieures */
	background-color: #909437; /* VERT */
	font-family: 'open_sansbold', Arial, Helvetica, Verdana, Sans-Serif;
	color: #ffffff;
	verical-align: middle; 
	white-space: nowrap;
	border-radius: 2px;
	transition: 0.2s ease-in; 
	border: none !important;
	cursor: pointer;
	}
.bouton2:visited, .bouton2:link { 
	background-color: #909437; /* VERT */
	color: #ffffff; 
	text-decoration: none; 
	}
.bouton2:hover, .bouton2:active { 
	background-color: #d10019; /* ROUGE */
	color: #ffffff; 
	text-decoration: none; 
	}	

.bouton3 { 
	display: inline-block; /* non compris par IE7... comme d'hab... */
	*zoom: 1;		/* Pour IE un élément inline qui possède le layout aura le même comportement qu’un inline-block. */
	margin: 0; 
	padding: 4px 6px;		/* marges interieures */
	background-color: transparent;	
	font-family: 'open_sansbold', Arial, Helvetica, Verdana, Sans-Serif;
	font-size: 0.85em;
	color: #000000;
	text-transform: uppercase;
	verical-align: middle; 
	white-space: nowrap;
	border: 1px solid #000000; 
	border-radius: 2px;
	transition: 0.15s ease-in; 
	cursor: pointer;
	}
.bouton3:visited, .bouton3:link { 
	background-color: transparent;	
	color: #000000; 
	text-decoration: none; 
	border: 1px solid #000000;
	}
.bouton3:hover, .bouton3:active { 
	background-color: #ffffff; /* blanc */
	color: #e74c3c; /* ROUGE */
	text-decoration: none; 
	border: 1px solid #e74c3c; /* rouge */
	}
		
.a2:visited, .a2:link { /* lien blanc */
	color: #ffffff;
	text-decoration: none; 
	}
.a2:hover, .a2:active { 
	color: #ecf0f1; /* clouds */
	text-decoration: underline;
	}
.a3:visited, .a3:link {
	color: #8e44ad;	/* bleu belizehole */
	text-decoration: none;
	}	
.a3:hover, .a3:active {
	color: #2ecc71; 	/* vert nephritis */
	text-decoration: none;
	}
.a4:visited, .a4:link {	
	opacity: 1.0; 
	text-decoration: none;
	}	
.a4:hover, .a4:active {
	opacity: 0.5; 	
	text-decoration: none;
	}
.a5:visited, .a5:link {
	color: #c0392b; 	/* ROUGE */
	text-decoration: none;
	}	
.a5:hover, .a5:active {
	color: #7f8c8d; 	
	text-decoration: none;
	}
.a6:visited, .a6:link {
	color: #8e44ad; /* violet */
	text-decoration: none;
	}	
.a6:hover, .a6:active {
	color: #7f8c8d; 	/* gris */
	text-decoration: none;
	}
.label { 
	display: inline-block;
	*zoom: 1;		/* Pour IE un élément inline qui possède le layout aura le même comportement qu’un inline-block. */
	padding: 2px 4px;
	background-color: #aaaaaa;
	color: #ffffff;
	font-size: 0.7em;
	font-family: 'open_sanssemibold', Arial, Helvetica, Verdana, Sans-Serif;
	font-style: normal;
	font-weight: normal;
	white-space: nowrap;
	text-transform: uppercase;
	text-shadow: 1px 1px 0 #000000;
	text-shadow: 1px 1px 0 rgba(0,0,0, 0.5);
	border-radius: 0px;
	box-shadow: 0px 0px 1px rgba(0,0,0, 0.75);
	}
.label.label-rouge { background-color: #c0392b; }
.label.label-vert { background-color: #2ecc71; }
.label.label-bleu { background-color: #2980b9; }
.label.label-orange { background-color: #f39c12; }
.label.label-gris { background-color: #95a5a6; }
.label.label-noir { background-color: #midnightblue; }
.label.label-blanc { background-color: #ecf0f1; }

.margesous { margin-bottom: 35px; }
.decolle5 { padding: 1px 5px; }
.decolle10 { padding: 3px 10px; }
.decolle15 { padding: 5px 15px; }
.arrondi2 { border-radius: 4px 4px 0 0; }

.hauteur-min { min-height:600px; }
.hauteur { height: 120px; }
.hauteur2 { height: 205px; }
.bloc-projet { 
	position: relative;
	height: 120px;
	margin-bottom: 20px;
	}
.bloc-projet2 { 
	position: relative;
	height: 120px;
	}
.bloc-projet date, .bloc-projet2 date { 
	position: absolute; 
	top: 3px;
	left: 3px; 
	z-index: 6;
	display: inline-block;
	*zoom: 1;		/* Pour IE un élément inline qui possède le layout aura le même comportement qu’un inline-block. */
	padding: 1px 4px;
	background-color: #ffffff;
	color: #000;
	font-size: 0.6em;
	font-family: 'open_sanssemibold', Arial, Helvetica, Verdana, Sans-Serif;
	font-style: normal;
	font-weight: normal;
	white-space: nowrap;
	text-transform: uppercase;
	text-shadow: 1px 1px 0 #fff;
	text-shadow: 1px 1px 0 rgba(255,255,255, 0.5);
	border-radius: 0px;
	box-shadow: 0px 0px 1px rgba(0,0,0, 0.75);
	}
.bloc-projet label, .bloc-projet2 label { 
	position: absolute; 
	top: 3px;
	right: 3px; 
	font-size: 0.55em;
	font-family: 'open_sanslight', Arial, Helvetica, Verdana, Sans-Serif;
	font-weight: normal;
	font-style: normal;
	z-index: 5;
	}
.titre-projet {
	padding: 3px 4px;
	font-size: 0.7em;
	font-family: 'open_sansbold', Arial, Helvetica, Verdana, Sans-Serif; 
	font-weight: normal;
	font-style: normal;
	color: #000;
	line-height: 1.3;
	text-transform: uppercase;
	}
.titre-projet:link { color: #000; }
.titre-projet:hover { color: #d10019; }
.bloc-projet p { 
	position: absolute; 
	top: 0;
	bottom: 0; 
	left: 0; 
	right: 0;
	padding: 10px 4px;
	background-color: #d10019;
	background-color: rgba(209,0,25, 0);
	line-height: 120px;
	font-size: 0.7em;
	color: #ffffff;
	text-shadow: 1px 1px 0px rgba(0,0,0, 0.9);
	text-align: center;
	text-transform: uppercase;
	opacity: 1; 
	z-index: 4;
	}
.bloc-projet2 span {
	font-size: 0.7em;
	font-weight: bold;
	} 
.bloc-projet:hover p { opacity: 1; background-color: rgba(209,0,25, 0.75); }

.bloc-projet p span { 
	width: 100%; /* largeur zone de texte */
	vertical-align:middle;
	display:inline-block;
	line-height:normal; /* on rétablit le line-height */
	text-align: center; /* ... et l'alignement du texte */
	}

/* --- MASONRY --- */
#container { margin: 0 1% 0 1%; }
#container .item {
	width: 220px;
    margin: 0 1% 1% 0;
    border: none;
    position: relative;
    float: left;
    background-color: #f9f9f9;
    font-size: 80%;
    box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.3);
    border-radius: 2px;
	}
#container .item img { 
	display: block;
	width: 220px;
	height: auto;
	}

#container article h2 { font-size: 1.15em; border: none; }
.bloc-contenu {
    padding: 5px 10px;
	}
#container article .bloc-contenu une, #container article .bloc-contenu promo {
    margin: 0;
    padding: 0;
	}
.box-text {
	margin-bottom: 10px;
	padding-right: 10px;
	max-height: 650px; 
	overflow-x: hidden;
	overflow-y: auto; 
	font-size: 85%;
	}

.multicolonnes2, .multicolonnes3, .multicolonnes4 {
	column-gap: 2.5em;
	column-rule-width: 1px;
	column-rule-color: #cccccc;
	column-rule-style: dotted;
	}
.multicolonnes2 {
	column-count: 2;
	}
.multicolonnes3 {
	column-count: 3;
	}
.multicolonnes4 {
	column-count: 4;
	}
.multicolonnes2 hr, .multicolonnes3 hr, .multicolonnes4 hr {
	break-after: column; /* Standard W3C */
	visibility: hidden;
	}
.item-col4 { width: 24%; margin-left: 0.5%; margin-right: 0.5%; }
.parallax-container {
	padding: 110px 0 30px 0;
	height: 300px;
	max-height: 300px;
	width: 100%;
	}
.item-scroll, .item-noscroll {
	display: block;
	padding-bottom: 64%;
	border: 1px solid #ccc;
	overflow: hidden;
	background-position: center top;
	background-size: 100% auto;
	transition: all 1s ease;
	}
.item-scroll:hover {
	background-position: center bottom;
	transition: all 4s linear;
	}
.ombreselection { box-shadow: 0 0 50px 0 rgba(142,68,173,0); transition: all 0.4s ease-in; }
.ombreselection:hover { box-shadow: 0 0 45px 0 rgba(142,68,173,0.3); }
abbr { cursor:help; }
abbr > span { display: none; }
abbr:hover > span { display: inline; }
.tooltip {
	text-decoration: none;
	border-bottom: 1px dotted #069;
	color: #069;
	}
a.tooltip { text-decoration: none; }
a.tooltip:hover { text-decoration: none; } 
a.tooltip span {
	margin-top: 72px; 
	margin-left: -64px;
	padding: 5px 10px;
	font-size: 0.8em;
	text-align: center;
	border-radius: 3px;
	box-shadow: 3px 3px 6px rgba(142,68,173,0.3);
	display: none; 
	z-index: 10;
	}
a.tooltip span::before {
	z-index: 20;
	position: absolute;
	top: -12px;
	left: 23px;
	border: 0;
	content: url('../images/pointe.gif')
	}
a.tooltip:hover span {
	position: absolute; 
	display: inline-block; 
	color: #fff;
	background-color: #333;
	}
.cadre-violet {
	border: 4px solid #8e44ad; 
	}
.flex-centre {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: flex-start;
	align-items: center;
	}
.flex-content   {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: flex-start;
	align-items: stretch;
	}
.flex-content-bas   {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: flex-start;
	align-items: flex-end;
	}
.space50 { padding-top: 50px; padding-bottom: 50px; }
.space75 { padding-top: 75px; padding-bottom: 75px; }
.space100 { padding-top: 100px; padding-bottom: 100px; }
.space125 { padding-top: 125px; padding-bottom: 125px; }
.space150 { padding-top: 150px; padding-bottom: 150px; }
.space175 { padding-top: 175px; padding-bottom: 175px; }
.space200 { padding-top: 200px; padding-bottom: 200px; }