@charset "utf-8";
/* CSS Document

COULEURS
	Vert émeraude : #009879 - rgba(0,152,121) - Accents, boutons, éléments d'appel à l'action
	Vert foncé : #00695C - rgba(0,105,92) - Fonds secondaires, accents, hiérarchie visuelle
	Anthracite : #2C2F33 - rgba(44,47,51) - Textes, titres, fonds foncés
	Gris clair : #F4F6F8 - rgba(244,246,248) - Fonds secondaires pour encadrés, tableaux, sections
	Blanc : #FFFFFF - rgba(255,255,255) - Fond principal
*/

.top { width:100%; display:flex; flex-wrap:wrap; align-items:flex-end; margin:0; padding:0; justify-content:space-between; }
	.topLogo { width:50%; max-width:500px; margin:0 auto; text-align:center; }
		.topLogo img { width:auto; height:100%; }
	.topText { width:50%; display:flex; flex-wrap:wrap; justify-content:space-between; }
		.topText_link { width:50%; display:flex; flex-wrap:wrap; align-items:flex-end; }
			a.linkBTN, a.linkBTN:visited { display:flex; width:40px; height:40px; margin:0 1em; padding:0.5em; background-color:rgba(0,152,121); color:#FFFFFF; border-radius:50%; justify-content:center; align-items:center; }
			a.linkText:link, a.linkText:visited { color:rgba(0,151,121); }
			a.linkText:hover, a.linkText:active { color:rgba(44,47,51); }

.pagePict { width:100%; display:flex; flex-wrap:wrap; margin:0; padding:0; font-size:0; }
	.pageTitle { width:100%; display:flex; flex-wrap:wrap; margin:0; padding:0.5em 10%; background-color:rgba(0,105,92); color:#FFFFFF; justify-content:center; }
		.pageTitle h1 { width:100%; text-align:center; font-size: 50px; font-family: 'monteserralternates-bold', Arial, Helvetica, sans-serif; }
	.pageText {width:100%; display:flex; flex-wrap:wrap; margin:0; padding:2em 15%; justify-content:center; }
			.pageText p { width:100%; font-size:30px; color:rgba(44,47,51); font-family: 'lato', Arial, Helvetica, sans-serif; }

@media only screen and (max-width:1200px) {
	.topLogo { width:50%; max-width:400px; margin:0; }
	.topText { font-size:0.85em; }
		.topText_link { font-size:0.85em; }
}

@media only screen and (max-width:850px) {
	.topLogo { width:50%; max-width:300px; margin:0 auto; }
	.topText { font-size:0.85em; }
		.topText_link { font-size:1.05em; justify-content:center; align-items:center; }
	
	.pageTitle h1 { font-size:1.5em; }
	.pageText p { font-size:1.25em; }
}

@media only screen and (max-width:600px) {
	.topLogo, .topText { width:100%; }
	.topText_link { width:100%; padding:1em 0; font-size:1.5em; }

	.pageText { padding:2em; }
}