@charset "UTF-8";

/******************************************************************
 * Référents :
 * http://daisy.tetue.net/
 * http://rocssti.net/
 * http://tinytypo.tetue.net/
 * http://www.knacss.com/
 * https://github.com/stubbornella/oocss
 * 
 * TdM 
 * ------------------------------------------
 * 01 -- RESET
 * 02 -- CLASSES D'AIDES
 * 03 -- BASE ÉDITORIALE
 *		-- TYPO 
 *		-- FONT ICON
 *		-- HYPERLIENS
 *		-- MEDIAS & EMBED
 * 04 -- INTERACTIONS
 *		-- FORMULAIRES
 *		-- BOUTONS
 *		-- ALERTS
 * 05 -- TEMPLATING
 *		-- LAYOUT
 *		-- NAVIGATION
 *		-- BLOCS
 * 06 -- COMPOSANTS
 * 07 -- RWD
 * 08 -- PRINT
 * 09 -- DEV
 *
 *
 * CONVENTIONS D'ÉCRITURE 
 * ------------------------------------------
 *
 * Préfixes :
 *  p-		= page
 *	l- 		= layout
 *	o-		= objet	(ubjet immuable)
 *	c- 		= component
 *	u- 		= utility (objet immuable)
 *	t- 		= themes
 *	sp-		= specific (relatif à composant tiers, ex : cms, contenu iframe, widget)
 *	is-		= etat
 * 	has-	= conditional
 *	js-		= javascript dependence
 *	tmp-	= temporaire (ajout d'un tiers ou temporairement inclassable)
 *	dev-	= test development
 *	_		= hacks
 *
 *
 * Nomage :
 *	ComponentName
 *	ComponentName--modifierName
 *	ComponentName-descendantName
 *	ComponentName.is-stateOfComponent
 *
 */
 
 


/*! 01 - RESET */
/*-------------------------------------------------------*/

	::-moz-selection {
	    background: #b3d4fc;
	    text-shadow: none;
	}
	
	::selection {
	    background: #b3d4fc;
	    text-shadow: none;
	}

	
	*,
	*:before,
	*:after {
	  -webkit-box-sizing: border-box;
	     -moz-box-sizing: border-box;
	          box-sizing: border-box;
	}
	
	.lt-ie8 * { behavior: url(/dist/js/polyfills/boxsizing.htc); }

	
	body > script { display: none !important; }
	
		
		

/*! 02 - CLASSES D'AIDES */
/*-------------------------------------------------------*/

/* Formatage de blocs */

	.u-content-box { box-sizing: content-box; }
		
	.u-clearfix:before,
	.u-clearfix:after {
	    content: " ";
	    display: table;
	}
	.u-clearfix:after { clear: both; }
	.u-clearfix { *zoom: 1; }
	

/* Afficher / Masquer -- */	

	.u-visuallyhidden {
	    border: 0;
	    clip: rect(0 0 0 0);
	    height: 1px;
	    margin: -1px;
	    overflow: hidden;
	    padding: 0;
	    position: absolute;
	    width: 1px;
	}
	.u-visuallyhidden.focusable:active,
	.u-visuallyhidden.focusable:focus {
	    clip: auto;
	    height: auto;
	    margin: 0;
	    overflow: visible;
	    position: static;
	    width: auto;
	}
	
	.u-hidden { visibility: hidden; }
	
	.u-none {
	    display: none !important;
	    visibility: hidden;
	}
	
	
/* Flux -- */

	.u-inbl,
	.u-inbl-group > * { display: inline-block; }
	
	.u-left 	{ float: left; }
	.u-right	{ float: right; }
	
	/* RTL */
	[dir="rtl"] .u-left	 { float: right; }
	[dir="rtl"] .u-right { float: left; }
	
	.u-center {
	 	margin-right: auto;
	 	margin-left: auto;
	}
	
	.u-fixed-top 	{ position: fixed; top: 0; right: 0; bottom: auto; left: 0; }
	.u-fixed-right 	{ position: fixed; top: 0; right: 0; bottom: 0; left: auto; }
	.u-fixed-bottom	{ position: fixed; top: auto; right: 0; bottom: 0; left: 0; }
	.u-fixed-left 	{ position: fixed; top: 0; right: auto; bottom: 0; left: 0; }


/* Habillage -- */

	.u-circle { 
		-webkit-border-radius: 50%;
		   -moz-border-radius: 50%;
		    -ms-border-radius: 50%;
				border-radius: 50%;
	}
	

	
/*! 03 - BASE ÉDITORIALE */
/*-------------------------------------------------------*/

			
	/*! --- TYPO */
	
		body {
			-webkit-font-smoothing: antialiased;
			-moz-osx-font-smoothing: grayscale;
		}
		
		/* https://developer.mozilla.org/fr/docs/Web/CSS/white-space */
		h1 { white-space: pre-line; }
					
		
		/* évite les débordemant */
		/* http://www.alsacreations.com/tuto/lire/1038-gerer-debordement-contenu-et-cesures-css.html */
		div,
		textarea,
		table,
		td,
		th,
		code,
		pre,
		samp {
			word-wrap: break-word;
			-webkit-hyphens: auto;
			-moz-hyphens: auto;
			-ms-hyphens: auto;
			hyphens: auto;
		}
		
		.u-no-cesure {
			word-wrap: normal;
			-webkit-hyphens: none;
			-moz-hyphens: none;
			-ms-hyphens: none;
			hyphens: none;			
			white-space: pre-line;
			white-space: pre-wrap;

		}
		
		code,
		pre,
		samp,
		kbd {
			/* IE fix */
			white-space: pre-line;
			white-space: pre-wrap;
			font-family: Consolas, 'DejaVu Sans Mono', Courier, monospace;
			line-height: normal;
		}
		
		table,
		td,
		blockquote,
		code,
		pre,
		textarea,
		input { max-width: 100%; }
			
		small,
		sub,
		sup { font-size: smaller; }
		
		sup,
		sub {
			vertical-align: 0;
			position: relative;
		}
		sup { bottom: 1ex; }
		sub { top: .5ex; }
		
		/* seules les abréviations ayant un title sont signalées */
		abbr[title] {
			border-bottom: dotted 1px; 
			cursor: help;
		} 
		
		.u-txt-left 		{ text-align: left !important; }
		.u-txt-right 	 	{ text-align: right !important; }
		.u-txt-center 	 	{ text-align: center !important; }
		.u-txt-justify 		{ text-align: justify !important;
		 			  	   	  text-justify: newspaper; }
		.u-txt-nowrap 	 	{ white-space: nowrap; }
		.u-txt-lowercase  	{ text-transform: lowercase; }
		.u-txt-uppercase  	{ text-transform: uppercase; }
		.u-txt-capitalize	{ text-transform: capitalize; }
		.u-txt-top    	 	{ vertical-align: top; }
		.u-txt-bottom 	 	{ vertical-align: bottom; }
		.u-txt-middle 	 	{ vertical-align: middle; }
			
		/* RTL */
		[dir="rtl"] .u-txt-right  { text-align: left; }
		[dir="rtl"]	.u-txt-left   { text-align: right; }
		
	
	/*! --- FONT-ICON */	
	
	
		.o-icon {
			position: relative;
			display: inline-block;
			font-size: inherit;
			text-rendering: auto;
			-webkit-font-smoothing: antialiased;
			-moz-osx-font-smoothing: grayscale;
			line-height: 1;
		}
	
	
			
	/*! --- HYPERLIENS */
	
		a {
			background: transparent;
			color: inherit;
			cursor: pointer;
		}
/* 		a:visited	{ color: inherit; } */
		a, a:focus 	{ outline: none; }
		a:hover 	{ cursor: pointer; }
		
		/* évite la bordure sur une image comprise dans un lien + fix bordure image IE */
		a:link img,
		a:visited img, 
		img {
			border-style: none;
		}
			
			
		
	/*! --- MEDIAS & EMBED */
	
		figure { 
			margin: 0; 
			overflow: hidden;
		}
	
		audio,
		canvas,
		progress,
		video { display: inline-block; }
	
		audio,
		canvas,
		iframe,
		img,
		svg,
		video { vertical-align: middle; }
		
		img,
		svg,
		iframe,
		object,
		embed,
		video {
		  	height: auto;
		  	max-width: 100%;
		}
		
		audio:not([controls]) {
			display: none;
			height: 0;
		}
		[hidden],
		template { display: none; }
		
		img {
			border: 0;
			color: transparent;
			font-size: 0;
			/* For IE. http://css-tricks.com/ie-fix-bicubic-scaling-for-images */
			-ms-interpolation-mode: bicubic;
		}
			
		svg:not(:root) { overflow: hidden; }
		
		
		/* + ratio et rwd embed, object et video */
		
		


/*! 04 - INTERACTIONS */
/*-------------------------------------------------------*/

	/* Hacks Android browser */
	
		button, 
		button:hover, 
		li:hover, 
		a:hover, 
		li, 
		a, 
		*:hover,
		* { 
			-webkit-tap-highlight-color: rgba(255, 255, 255, 0) !important; 
			-webkit-focus-ring-color: rgba(255, 255, 255, 0) !important; 
			outline: none !important; 
		}	



	/*! --- FORMULAIRES */
	
		fieldset {
		    border: 0;
		    margin: 0;
		    padding: 0;
		}
		
		legend {
			display: block;
			width: 100%;
			padding: 0;
			line-height: inherit;
			border: 0;
		}
	
		label,
		button,
		input[type="submit"],
		input[type="button"],
		input[type="reset"]	{ cursor: pointer; }
		
		input[type=text],
		input[type=datetime],
		input[type=datetime-local],
		input[type=email],
		input[type=month],
		input[type=number],
		input[type=password],
		input[type=search],
		input[type=tel],
		input[type=time],
		input[type=url],
		input[type=week] {
		  	vertical-align: middle;
		  	-webkit-appearance: none;
		  	box-sizing: border-box;
		}
		
		/* évite les dimensionnement des radios, checkboxes et images et un affichage différent sous IE */
		input[type="radio"],
		input[type="checkbox"],
		input[type="image"] {
			background-color: transparent;
			border: 0;
			width: auto;
		}
		
		input[type="file"] { display: block; }
		
		select[multiple],
		select[size] { height: auto; }
			
		textarea { resize: vertical; }
		
		label,
		button,
		input,
		select:not([multiple]) { vertical-align: middle; }
		
		.o-input {
			display: block;
			width: 100%;
			border: 0;
		}
		
		.o-input-group {
			position: relative;
			display: table;
			border-collapse: separate;
		}
			.o-input-group-btn {
				display: table-cell;
				width: 1%;
				white-space: nowrap;
				vertical-align: middle;
			}

		
			

		
	
	
	/*! --- BOUTONS */
	
		.c-btn {
			display: inline-block;
			zoom: 1;
			padding: 0 1em;
			margin-bottom: 0;
			border: 0;
			text-decoration: none;
			font-weight: normal;
			line-height: normal;
			text-align: center;
			white-space: nowrap;
			vertical-align: middle;
			-ms-touch-action: manipulation;
			touch-action: manipulation;
			cursor: pointer;
			-webkit-user-drag: none;
			-webkit-user-select: none;
			-moz-user-select: none;
			-ms-user-select: none;
			user-select: none;
			background-image: none;
		    -webkit-box-sizing: border-box;
		    -moz-box-sizing: border-box;
		    box-sizing: border-box;
		}
		
		.o-grp > .c-btn:hover,
		.o-grp-vertical > .c-btn:hover,
		.o-grp > .c-btn:focus,
		.o-grp-vertical > .c-btn:focus,
		.o-grp > .c-btn:active,
		.o-grp-vertical > .c-btn:active,
		.o-grp > .c-btn.active,
		.o-grp-vertical > .c-btn.active { z-index: 2; }
		
		
	/*! --- MENU DÉROULANT */
		
/*
		.c-dropdown { position: relative; }
		
			.c-dropdown-toggle:focus { outline: 0; }
			
			.c-dropdown-menu {
				position: absolute;
				top: 100%;
				left: 0;
				z-index: 1000;
				display: none;
				float: left;
				list-style: none;
			}
*/
		
/* 		.c-dropdown:hover > .c-dropdown-menu, */
/* 		.c-dropdown.is-open > .c-dropdown-menu { display: block; } */
		

		
	
	
	/*! --- ALERTS */
	
		.c-alert {
			padding: .5em;
			margin-bottom: .5em;
			border: 1px solid transparent;
		}


/*! 05 - TEMPLATE */
/*-------------------------------------------------------*/


	html,
	body {
		margin: 0;
		padding: 0;
	}


	/*! --- LAYOUT */
	
		/* Facilite le positionnement absolu */
		
		div, 
		section,
		header,
		nav,
		main { position: relative; } 
	
		/* Block formatting context */
		.o-bfc { 
			overflow: hidden; 
		}
		
		
		/* Blocs placés sous les flottants */
		.u-clear,
		.o-line {
		  clear: both;
		  *zoom: 1;
		}
				
		
		/* Blocs contenant des flottants */
		.o-line:after {
		  content: "";
		  display: table;
		  clear: both;
		  border-collapse: collapse;
		}
		
		/* Groupes */
		
		.o-grp,
		.o-grp-vertical {
		 	position: relative;
		 	display: inline-block;
		 	vertical-align: middle;
		}
			.o-grp > *,
			.o-grp-vertical > * {
			  position: relative;
			  float: left;
			}

		
		/* table layout */
		.o-table {
			display : table;
			table-layout: fixed;
			width: 100%;
		}
			.o-table-row { display : table-row; }  
			
				.o-table-cell {
				  	display: table-cell;	
					vertical-align: middle;
/* 					vertical-align: top; */
				}

				
		/* module, gains superpower "BFC" Block Formating Context */
		/* KNACSS http://knacss.com/ */	
		 
		.o-mod { overflow: hidden; }
		.o-left { float: left; }
		.o-right { float: right; }
		
				
		/* media object http://nicoespeon.com/fr/2013/05/plongee-au-coeur-de-oocss/ */
	
		.o-media, .o-media-body { overflow:hidden; }
		.o-media-img          { float:left; margin-right:20px; }
		.o-media-img-rev      { float:right; margin-left:20px; }
		.o-media-img img      { display:block; }
		
	
		/* flag object http://csswizardry.com/2013/05/the-flag-object/ */
		
		.o-flag {
			display: table;
			width: 100%; 
		}
		
			.o-flag-image, 
			.o-flag-body {
				display: table-cell;
				vertical-align: middle; 
			}
			.o-flag--top 	.o-flag-image, 
			.o-flag--top 	.o-flag-body		{ vertical-align: top; }
			.o-flag--bottom	.o-flag-image, 
			.o-flag--bottom	.o-flag-body 		{ vertical-align: bottom; }
		
			.o-flag-image { padding-right: 10px; }
			
				.o-flag-image > img {
					display: block;
					max-width: none; 
				}
			.o-flag--rev .o-flag-image {
				padding-right: 0;
				padding-left: 10px; 
			}
			
			.o-flag-body { width: 100%; }
				

	
	
	/*! --- NAVIGATION */
	
	
		[role="navigation"] ul {
			margin: 0;
			padding-left: 0;
			list-style: none;
		}
		
		[role="navigation"] a { text-decoration: none; }

	
	
	/*! --- ÉLÉMENTS */
	
		.c-browserupgrade {
		    margin: 0.2em 0;
		    background: #ccc;
		    color: #000;
		    padding: 0.2em 0;
		}
	
		hr {
		    display: block;
		    height: 1px;
		    border: 0;
		    border-top: 1px solid #ccc;
		    margin: 1em 0;
		    padding: 0;
		}
		
		/* supprime les marges hautes sur les premiers titres */
		h1:first-child,.h1:first-child,
		h2:first-child,.h2:first-child,
		h3:first-child,.h3:first-child,
		h4:first-child,.h4:first-child,
		h5:first-child,.h5:first-child,
		h6:first-child,.h6:first-child { margin-top: 0; }
		
		/* supprime les marges basses sur le dernier enfants */
		p:last-child,
		ul:last-child,
		ol:last-child,
		dl:last-child,
		blockquote:last-child,
		pre:last-child,
		table:last-child { margin-bottom: 0; }
		
		/* évite les marges supplémentaires sur les éléments imbriqués */
		li p,
		li ul {
			margin-bottom: 0;
			margin-top: 0;
		}
		
		.u-list-styled,
		.u-list-unstyled,
		.u-list-inline,
		.u-list-btn {
			padding-left: 0;
			list-style: none;
		}
		
		.u-list-inline > li { display: inline-block; }
		
		
	/* Tableaux -- */	
		
		table { 
			max-width: 100%;
			border-collapse: collapse;
			border-spacing: 0;
		}

/*! 06 - COMPOSANTS */
/*-------------------------------------------------------*/	

	.c-map { 
		width: 100%; 
		height: 0;
		padding-bottom: 30%; 
	}

/*! 07 - RWD */
/*-------------------------------------------------------*/	


	/*! fix viewport pour Win8 (snap mode) et prépare pour le futur support */
	
		@-webkit-viewport {
			width: device-width;
			zoom: 1.0;
		}
		@-moz-viewport {
			width: device-width;
			zoom: 1.0;
		}
		@-ms-viewport {
			width: device-width;
			zoom: 1.0;
		}
		@-o-viewport {
			width: device-width;
			zoom: 1.0;
		}
		@viewport {
			width: device-width;
			zoom: 1.0;
		}
	
	
	

/*! 08 - PRINT */
/*-------------------------------------------------------*/	


@media print {
    *,
    *:before,
    *:after {
        background: transparent !important;
        color: #000 !important;
        box-shadow: none !important;
        text-shadow: none !important;
    }

    a,
    a:visited { text-decoration: underline; }

    a[href]:after { content: " (" attr(href) ")"; }

    abbr[title]:after { content: " (" attr(title) ")"; }

    a[href^="#"]:after,
    a[href^="javascript:"]:after { content: ""; }

    pre,
    blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }

    thead { display: table-header-group; }

    tr,
    img { page-break-inside: avoid; }

    img { max-width: 100% !important; }

    p,
    h2,
    h3 {
        orphans: 3;
        widows: 3;
    }
	
	h1,
    h2,
    h3, 
    caption { page-break-after: avoid; }
    
    ul, ol { page-break-inside: avoid; }
}


/*! 09 - DEV */
/*-------------------------------------------------------*/	

/* visualisation des types d'élements -- */

	/*
	[class^="o-"],
	[class*=" o-"] {
	  outline: 5px solid orange;
	}
	
	[class^="o-"],
	[class*=" o-"] {
	  outline: 5px solid green;
	}
	
	[class^="c-"],
	[class*=" c-"] {
	  outline: 5px solid cyan;
	}
	
	[class^="u-"],
	[class*=" u-"] {
	  outline: 5px solid violet;
	}
	
	[class^="s-"],
	[class*=" s-"] {
	  outline: 5px solid aqua;
	}
	
	[class^="_"],
	[class*=" _"] {
	  outline: 5px solid red;
	}
	
	[class^="tmp-"],
	[class*=" tmp-"] {
	  outline: 5px solid yellow ;
	}
	*/