/* =============================================================================
	RESET
   ========================================================================== */

html{font-size:100%;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;overflow-y:scroll;}html,body{width:100%;height:100%;margin:0}.wrap{height:100%}body>.wrap{height:auto;min-height:100%}article,aside,details,figcaption,figure,footer,header,hgroup,nav,section{display:block}audio,canvas,video{display:inline-block;}body>footer{position:relative;clear:both}a:focus{outline:thin dotted}a:hover,a:active{outline:0}strong{font-weight:bold}dfn{font-style:italic}q{quotes:none}q:before,q:after {content:"";content:none;}small,sub,sup{font-size:80%}sub,sup{line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}nav ul,nav ol{list-style:none;list-style-image:none;margin:0;padding:0}img{border:0;-ms-interpolation-mode:bicubic; vertical-align:middle}svg:not(:root){overflow:hidden}figure{margin:0}table{border-collapse:collapse;border-spacing:0}td{vertical-align:top}hr{display:block;height:1px;border:0;border-top:1px solid;padding:0}


/* =============================================================================
	Fonts
   ========================================================================== */

@font-face {
	font-family:'Arimo';
	src:url('fonts/Arimo-Regular-Latin-webfont.eot');
	src:url('fonts/Arimo-Regular-Latin-webfont.eot?#iefix')format('embedded-opentype'),
		url('fonts/Arimo-Regular-Latin-webfont.woff')format('woff'),
		url('fonts/Arimo-Regular-Latin-webfont.ttf')format('truetype'),
		url('fonts/Arimo-Regular-Latin-webfont.svg#ArimoRegular')format('svg');
	font-weight:normal;font-style: normal; }

@font-face {
	font-family: 'Arimo';
	src: url('fonts/Arimo-Italic-Latin-webfont.eot');
	src: url('fonts/Arimo-Italic-Latin-webfont.eot?#iefix') format('embedded-opentype'),
		url('fonts/Arimo-Italic-Latin-webfont.woff') format('woff'),
		url('fonts/Arimo-Italic-Latin-webfont.ttf') format('truetype'),
		url('fonts/Arimo-Italic-Latin-webfont.svg#ArimoItalic') format('svg');
	font-weight: normal; font-style: italic; }

@font-face {
	font-family: 'Arimo';
	src: url('fonts/Arimo-Bold-Latin-webfont.eot');
	src: url('fonts/Arimo-Bold-Latin-webfont.eot?#iefix') format('embedded-opentype'),
		url('fonts/Arimo-Bold-Latin-webfont.woff') format('woff'),
		url('fonts/Arimo-Bold-Latin-webfont.ttf') format('truetype'),
		url('fonts/Arimo-Bold-Latin-webfont.svg#ArimoBold') format('svg');
	font-weight: bold; font-style: normal; }

@font-face {
	font-family: 'Arimo';
	src: url('fonts/Arimo-BoldItalic-Latin-webfont.eot');
	src: url('fonts/Arimo-BoldItalic-Latin-webfont.eot?#iefix') format('embedded-opentype'),
		url('fonts/Arimo-BoldItalic-Latin-webfont.woff') format('woff'),
		url('fonts/Arimo-BoldItalic-Latin-webfont.ttf') format('truetype'),
		url('fonts/Arimo-BoldItalic-Latin-webfont.svg#ArimoBoldItalic') format('svg');
		font-weight: bold; font-style: italic; }

@font-face {
	font-family: 'Bebas';
	src: url('fonts/BebasNeue-webfont.eot');
	src: url('fonts/BebasNeue-webfont.eot?#iefix') format('embedded-opentype'),
		url('fonts/BebasNeue-webfont.woff') format('woff'),
		url('fonts/BebasNeue-webfont.ttf') format('truetype'),
		url('fonts/BebasNeue-webfont.svg#BebasNeueRegular') format('svg');
		font-weight: normal; font-style: normal;
}

/* ===== Primary Styles ========================================================
   Author:
   ========================================================================== */



/* Typo*/

html, button,
input, select,
textarea							{ font-family: 'Arimo', Verdana, Helvetica, sans-serif; color: #000; }
body								{ font-size: 87.5%; line-height: 1.4; }
h1, h2, h3, .h1, .h2, .h3, .giga	{ text-transform: uppercase; }
.giga, h1, .h1						{ font-weight: normal; font-family: 'Bebas', Verdana, Helvetica, sans-serif; }
.giga								{ font-size: 3.6em; line-height: 1.8; letter-spacing: 4px; }
h1, .h1								{ font-size: 2em; line-height: 1.1; letter-spacing: 1px; }
h2, .h2, h3, .h3					{ font-weight: bold; font-family: 'Arimo', Verdana, Helvetica, sans-serif; line-height: 1.4}
h2, .h2								{ font-size: 1.2em; }
h3, .h3								{ font-size: 1em; margin-top: 1em; margin-bottom: .5em;}
p									{ margin-top: 1em;}
abbr								{ text-transform: none!important; }

::-moz-selection,
::selection							{ background: #6f9c39; color: #fff; text-shadow: none; }
a									{ color: #000; text-decoration: none; }
a:hover								{ text-decoration: underline; }

.lien_email						{ color:#0000FF; }
.lien_email:hover				{ color:#0000FF; text-decoration: underline; }

table								{ width: 100%; text-align: left; margin-top: .5em; }
th, td								{ padding: 0; margin: 0; border: 0; text-align: left; }
th > h3								{ display: block; border-right: 1px solid #000; line-height: 1; margin-right: 1em; box-sizing: border-box; }
th.last > h3						{ border: none; }
tbody tr							{ line-height: 3; }
th.first, td.first					{ padding-left: 10px; }
table img							{ width: auto; max-height: 100%;}
table small							{ font-size: 85%; line-height: 1.2; padding-bottom: 10px; margin-top: -6px; display: block; }

hr									{ border-top-color: #000; margin: 1em 0; }

ul, ol								{ margin: 0; margin-top: 1em; padding: 0; list-style: none; display: block; }
dl, dd								{ margin: 0; padding: 0; }
nav li								{ display: inline-block; position: relative }

.ulReportsType						{ margin: 1em; padding: 1em 1em 0em 1em; list-style-type:disc; display: block; }
.ulReportsType	 li:before			{ content: ""; position: absolute; left: -.4em; }

#header								{ background: #14213F; /*#d85836; #112535;*/ color: #fff; min-width:960px; }
#header	span						{ display: block; float: left; margin-left: 10px;}
#header a							{ display: block; float: right; margin-right: 10px;}
#main-nav							{ background: #112535; /*#888a8b;*/ width: 100%; min-width:960px; }
#main-nav.fixed						{ position: fixed; top:0px; left: 0; z-index: 1000;}
#main-nav ul						{ position: relative; height: 30px; line-height: 30px;}
#main-nav .etat a					{ padding-left: 10px;}
#main-nav .etat a:before,
#main-nav .index a:before			{ display: none;}
#main-nav a							{ color: #fff; display: block; text-transform: uppercase;}
#main-nav a:before					{ content: "|"; display: block; float: left;  width: 40px; text-align: center}
#main-nav a:hover					{ text-decoration: none;}

#main-nav .index					{ display:block; position: absolute; bottom: 0; right: 10px; padding: 8px 15px 2px 15px; background: #235075; /*#b8b8b8;*/  }
#main-nav .index:after				{ content: ""; position: absolute; top: 0; right: -10px; width: 0; height: 0;
										border-bottom: 10px solid #696a6b; border-right: 10px solid transparent;}
.etat #main-nav .etat:after,
.reports #main-nav .reports:after,
.generalInfo #main-nav .generalInfo:after		{ content: ""; position: absolute; bottom: -14px; left: 50%; width: 0; height: 0;
										border-left: 15px solid transparent; border-right: 15px solid transparent; border-top: 15px solid #112535; /*#888a8b;*/ }

.main > .section					{ display: none; margin-top: 5px; }
.etat .main > #etat,
.generalInfo .main > #generalInfo,
.reports .main > #reports			{ display: block; }

.info	.contenu					{ width: 430px; margin-right: 10px; }
.info	.niveau						{ width: 200px; border-top: 1.4em solid; margin-bottom: 1em; }
.info	.image						{ width: 450px; margin-left: 10px; margin-top: 10px; margin-bottom: 10px; }

.lstTrv								{ display: block; float: left;}
.lstTrv a							{ display: block; padding: 2px 10px; margin-top: 4px; margin-bottom: 10px; background: #000; color: #fff; float: left; clear: both;}


.grphlvl							{ display: block; float: right; padding: 4px 10px; border: 1px solid #ccc; line-height: 1.2; margin-top: 20px; text-align: right;}
.grphlvl .text 						{ float:left; margin-right: 3em;}
.grphlvl span						{ display: block; height: .8em; border-bottom: 2px solid black; width: 20px; float: left; margin: 0 5px;}
.zoom								{ cursor: pointer; position: relative;}
.loupe								{ display: block; position: absolute; width: 36px; height: 36px;
										background: url(loupe.png); z-index: 100; bottom :10px; right: 10px; }

figure.normal .normal				{ display: block;}
.graph								{ text-align: center; position: relative; padding-bottom: 20px}
.graph dl							{ float: right; border-left: 1px solid #ccc; border-bottom: 1px solid #ccc; border-top: 1px solid #ccc}
.graph, .graph dl					{ height: 315px; }
.graph dt							{ display: none; }
.graph dl, .graph dd				{ position: relative; display:block; line-height: 1; }
.graph figcaption					{ position: absolute; left: 0; height: 315px; font-size: 0.8em; text-align: right;}
.graph .legend,
.graph ol,
.graph ol li						{ position: absolute; right: 0;}
.graph .legend						{ bottom: -2em; line-height: 1.2; padding-right: 20px; bottom: -40px;}
.graph ol							{ top: 0; height: 100%; margin: 0; padding: 0 }
.graph ol li						{ white-space: nowrap;  border-top: 1px solid #ccc; width: 10px;}



.graph dd							{ float: left; border-right: 1px solid #fff; height: 100%;}
.graph dd:last-child				{ border-right: 1px solid #ccc}
.graph dd > span					{ font-size: 12px; text-align: left; bottom: -1.5em ; position: absolute; display: block; width: 15px;
										transform: rotate(90deg); -ms-transform: rotate(90deg); -webkit-transform: rotate(90deg);
										-o-transform: rotate(90deg); -moz-transform: rotate(90deg); margin-left:25%; left: -5px;}

.graph .canevas						{ width: /*10 px;*/ 2px; height: 100%; position: relative; margin: 0 auto }
.graph .step						{ width: 100%; left: 0; bottom: 0; position: absolute; }

.graph a.warning					{ position: absolute; display: block; width: 22px; height: 20px; left: -3px;  background: url(warning.png); z-index: 100; cursor: pointer; }
.graph a.warning:hover				{ text-decoration: none; z-index: 2000;}
.graph a.warning:hover div			{ display: block; z-index: 2000;}
.graph a.warning div				{ width: 280px; padding: 10px; background: #fff; position: absolute; left: 50%; top: 30px; margin-left: -140px; text-align: left; display: none;}

.graph a.audiorec					{ position: absolute; display: block; width: 16px; height: 16px; left: -3px;  background: url(speaker.png); z-index: 100; cursor: pointer; }
.graph a.audiorec div				{ width: 60px; padding: 10px; background: #fff; position: absolute; left: 50%; top: 30px; margin-left: -30px; text-align: left; display: none; z-index: 2000; cursor: auto}

.graph a.audiorec div a:hover		{ color: #0000FF; font-weight: bold; cursor: pointer;}
.graph a.audiorec div a				{ color: #000000; font-weight: normal; padding: 2px 2px 2px 20px; display: inline-block; background: url(speaker.png); background-repeat: no-repeat; }




.graph .leq,
.graph .seuil						{ border-top: 2px solid #000; margin-left: -1px; padding-left: 2px; z-index: 3 }

.graph .normal						{ background: #ccc; z-index: 2; left: 5px; width: /*6px;*/ 2px; display: none;}
.graph .acceptable					{ background: #7acf13; }
.graph .modere						{ background: #f4d921; }
.graph .perturbe					{ background: #f42121; }

.graph.lbl_align 				    { margin-left:25%; }


/* *************************************************************************************************************************************************************** */
.graph2								{ text-align: center; position: relative; padding-bottom: 20px}
.graph2 dl							{ float: right; border-left: 1px solid #ccc; border-bottom: 1px solid #ccc; border-top: 1px solid #ccc}
.graph2, .graph2 dl					{ height: 315px; }
.graph2 dt							{ display: none; }
.graph2 dl, .graph2 dd				{ position: relative; display:block; line-height: 1; }
.graph2 figcaption					{ position: absolute; left: 0; height: 315px; font-size: 0.8em; text-align: right;}
.graph2 .legend,
.graph2 ol,
.graph2 ol li						{ position: absolute; right: 0;}
.graph2 .legend						{ bottom: -2em; line-height: 1.2; padding-right: 20px; bottom: -40px;}
.graph2 ol							{ top: 0; height: 100%; margin: 0; padding: 0 }
.graph2 ol li						{ white-space: nowrap;  border-top: 1px solid #ccc; width: 10px;}



.graph2 dd							{ float: left; border-right: 1px solid #fff; height: 100%;}
.graph2 dd:last-child				{ border-right: 1px solid #ccc}
.graph2 dd > span					{ font-size: 12px; text-align: left; bottom: -1.5em ; position: absolute; display: block; width: 15px;
										transform: rotate(90deg); -ms-transform: rotate(90deg); -webkit-transform: rotate(90deg);
										-o-transform: rotate(90deg); -moz-transform: rotate(90deg); margin-left:25%; left: -5px;}

.graph2 .canevas						{ width: /*10 px;*/ 2px; height: 100%; position: relative; margin: 0 auto }
.graph2 .step						{ width: 100%; left: 0; bottom: 0; position: absolute; }

.graph2 a.warning					{ position: absolute; display: block; width: 22px; height: 20px; left: -3px;  background: url(warning.png); z-index: 100; cursor: pointer; }
.graph2 a.warning:hover				{ text-decoration: none; z-index: 2000;}
.graph2 a.warning:hover div			{ display: block; z-index: 2000;}
.graph2 a.warning div				{ width: 280px; padding: 10px; background: #fff; position: absolute; left: 50%; top: 30px; margin-left: -140px; text-align: left; display: none;}

.graph2 a.audiorec					{ position: absolute; display: block; width: 16px; height: 16px; left: -3px;  background: url(speaker.png); z-index: 100; cursor: pointer; }
.graph2 a.audiorec div				{ width: 60px; padding: 10px; background: #fff; position: absolute; left: 50%; top: 30px; margin-left: -30px; text-align: left; display: none; z-index: 2000; cursor: auto}

.graph2 a.audiorec div a:hover		{ color: #0000FF; font-weight: bold; cursor: pointer;}
.graph2 a.audiorec div a				{ color: #000000; font-weight: normal; padding: 2px 2px 2px 20px; display: inline-block; background: url(speaker.png); background-repeat: no-repeat; }


.graph2 .leq,
.graph2 .seuil						{ border-top: 2px solid #000; margin-left: -1px; padding-left: 2px; z-index: 3 }

.graph2 .normal						{ background: #ccc; z-index: 2; left: 5px; width: /*6px;*/ 2px; display: none;}
.graph2 .acceptable					{ background: #7acf13; }
.graph2 .modere						{ background: #f4d921; }
.graph2 .perturbe					{ background: #f42121; }

.graph2.lbl_align 				    { margin-left:25%; }

/* *************************************************************************************************************************************************************** */


.bl_align_db					    { position: absolute; right: 10px; top: 0; height: 100%; margin: 0; padding: 0 }

.leqinfo							{ background: #fff; padding: 10px 0}
.leqinfo div						{ line-height: 2; text-align: center }

/* Level color codes */
.acceptable							{ border-color: #7acf13; color: #7acf13; }
.modere								{ border-color: #f4d921; color: #f4d921; }
.perturbe							{ border-color: #f42121; color: #f42121; }


/* Body */
body								{ background: #faf5ec; }


/* Drop down selector */
.selector							{ background: #000; color: #fff; padding: .2em 1.4em .2em .4em; cursor: pointer;
										display: inline-block;	position: relative; top: -2px; font-weight: normal; font-size: .9em; z-index: 100; }
.selector > .data					{ display: inline-block; }
.selector,
.selector a,
.selector small						{ color: #fff;}
.selector:hover						{ text-decoration: none; }
.selector small						{ padding: 0 .4em; position: absolute; top: 30%; right: 0}
.selector ul						{ position: absolute; left: 0; top:100%; width: 100%; margin: 0; padding: 0 0 0 6px;
										background: #000; list-style: none; text-align: left; display: none; text-transform: none;}
.selector li						{ display: block; line-height: 2; }

.download_button					{ display: none; position: absolute; top:-2px; right: 385px; margin: 0;}
.download_button button				{ padding : 2px;}

.toggle_switch						{ display: inline-block; vertical-align: middle; position: absolute; top:-2px; right: 200px; margin: 0; text-transform: none; font-weight: normal; font-size:1.1em; padding: 0px;}
.toggle_switch	div 				{ display: inline-block; vertical-align: middle; margin-top: 0px;}
.toggle_switch .toggle-confirm		{ display:inline-block; padding : 0px; margin-top: 0px;}

.mode								{ display: block; position: absolute; top:0; right: 0; margin: 0; }
.mode .selector						{ width: 150px; display: block; }

.norme								{ display: block; width: 100%; }
.norme .selector 					{ width: 30px; display: block; }

/* Main */
.wrap > .main						{ padding-bottom: 15px; }
.map .wrap > .main					{ padding-bottom: 0; }





body > footer						{ margin-top: -260px; height: 180px;  /*border-bottom: 80px solid #112535;*/}
body > footer .container			{ height: 180px; position: relative;}
body > footer nav					{ position: absolute; right: 10px; bottom: -10px }

body > footer li > a				{ color: #fff; text-transform: uppercase; }

body > footer li					{  display: block; position: relative; float: left; margin-top: 10px; margin-left: 15px; background: #a5a5a5; padding: 0 1.3em;
										height: 2.6em; line-height: 2.6em; }
body > footer li:after				{  content: ""; width: 0; height: 0; position: absolute; border-top: 10px solid #787976; border-left: 10px solid transparent;
										bottom: 0; left:-10px }




/* Page Title */
.main > header						{ margin-top: 2em; margin-bottom: 1em; border-bottom: 1px solid #000; }
.main > header h2					{ margin-top: -1em; margin-bottom: 1em;}

section								{ padding-bottom: 3em; }

/* Section title */
section > header					{ border-bottom: 1px solid #000; margin-bottom: .5em; }


section > article,
section .col						{ box-sizing: border-box;}


section > .white					{ background-color: #fff; padding: 10px; }

section > article,
section .col						{ display: inline; float: left; margin-left: 10px; margin-right:10px; } /* grid */

section > article					{ width: 940px;}				/* grid_12 */
section > article:before,
section > article:after 			{ content:"";display:table;}	/* Clearfix */
section > article:after				{ clear:both}					/* Clearfix */







/* Localisation map */
.localisation figure				{ background: #fff; border: 10px solid #fff; }
.map .localisation figure		{ width: 920px;  height: 600px;}
.localisation img,
.localisation figcaption			{ width: 100%; height: 300px; }
.map .localisation figcaption	{ top : 10px; }
.map .localisation img,
.map .localisation figcaption	{ width: 920px;  height: 600px; }
.localisation figure,
.localisation figcaption			{ position: relative; }
.localisation img,
.localisation .canevas				{ position: absolute; top: 0; left: 0; }
.localisation .canevas				{ width: 100%; height: 100%; }
.localisation .round				{ border-radius: 50%; color: #fff; background: #7acf13; display: block; position: absolute; border-color: #FF0000; border-style:solid; border-width:1px;}
.localisation .h1					{ top: 50%; right: 20px; width: 120px; height: 80px; padding: 50px 30px; margin-top: -90px; margin-left: -90px}
.localisation .dot					{ width: 26px; height: 26px; margin-left: -13px; margin-top: -13px; }
.localisation .sdot					{ width: 16px; height: 16px; margin-left: -8px; margin-top: -8px; position: absolute}
.localisation .sdot span			{ position: absolute; left: -3px; bottom: -34px; white-space: nowrap; display: block; padding: 6px 10px;
									  background: #fff; border-radius: 2px; color: #112535; line-height: 1; text-transform: uppercase;
									  border-color: #666666;  border-style:solid; border-width:1px;
									  font-family: 'Bebas', Verdana, Helvetica, sans-serif;}

.localisation .sdot.top  span		{ top: -34px; bottom:auto;}
.localisation .sdot.left  span		{ top: -6px; bottom:auto; left: auto; right: 23px;}
.localisation .sdot.right  span		{ top: -6px; bottom:auto; left: auto; left: 23px;}
.localisation .sdot span:before		{ content: ""; display: block; position: absolute; left: 5px; top: -5px;
										width: 0; height: 0; border-bottom: 5px solid #666666; border-left: 5px solid transparent;
										border-right: 5px solid transparent;}

.localisation .sdot.top span:before { bottom: -5px; top:auto; border-bottom: none; border-top:5px solid #666666;}
.localisation .sdot.left span:before { right: -10px; top:8px; left: auto; border-left: 5px solid #666666; border-bottom: 5px solid transparent; border-top:5px solid transparent;}
.localisation .sdot.right span:before { left: -10px; top:8px; border-right: 5px solid #666666; border-bottom: 5px solid transparent; border-top:5px solid transparent;}
.localisation a.acceptable			{ background: #00ff00; } /*#7acf13*/
.localisation a.modere				{ background: #FFFF00; } /*#f4d921*/
.localisation a.perturbe			{ background: #f42121; }
.localisation a.inactive			{ background: #999; }


.disclaimer							{ padding: 0; margin: 0 0 0 10px; font-size: 0.8em; }

.green								{ color : #7acf13; }
.photos div							{ padding-bottom: 20px; position: relative; }
.photos img							{ border: 5px solid #fff; box-sizing: border-box; vertical-align: middle; display: inline-block; }

/* Pannels */
.pannel								{ padding: 5px 0; }
.pannel header						{ cursor: pointer; }
.pannel header:hover				{ text-decoration: underline; }
.pannel .sep						{ font-size: .8em; }
.pannel .ctn						{ display: none; position: relative; }
.pannel .iholder					{ position: relative;}
.pannel img							{ width: 100%; max-width: 100%; height: auto; box-sizing: border-box; border: #fff solid 5px;}


/* Couleurs */
.couleurs figure					{ border-top: 1.2em solid; margin-top: 1em; width: 198px; float: left; font-size: 12px; }
.couleurs figcaption				{ padding-left: 40px; padding-top: 10px; position: relative; color: #000}
.couleurs figcaption:before			{ content: ""; position: absolute; left: 2px; top: 13px; width: 36px; height: 32px; display: block;
										background: url(logo_seuils.png) no-repeat; }
.couleurs .modere				 	{ margin-left: 10px; margin-right: 10px; }
.couleurs .acceptable > figcaption:before	{ background-position: 0 0; }
.couleurs .modere > figcaption:before		{ background-position: -36px 0; }
.couleurs .perturbe > figcaption:before		{ background-position: -72px 0; }

.lvlhab								{ padding-top : 30px;}
.lvlhab .white						{ background-color: #999; margin-top: 12px; padding: 5px 40px}
.lvlhab .white a					{ color: #fff; display: block; cursor: pointer;}
.lvl header							{ position: relative;  z-index: 100;}

.lvl tbody > tr:nth-child(odd)		{ background: #fff; }
.lvl .date							{ width: 155px; }

.lvl .heure							{ width: 205px; }
.lvl .lvl							{ width: 195px; }
.lvl .meteo							{ width: 340px; }
.lvl .warning						{ width: 30px; text-align: center; position: relative; }
.lvl .warning a						{ text-decoration: none; cursor: pointer}
.lvl .warning a:hover .info			{ display: block; }

.lvl .audiorec						{ width: 30px; text-align: center; position: relative; }
.lvl .audiorec a					{ text-decoration: none; cursor: pointer}
.lvl .audiorec a:hover .info		{ display: block; }

.lvl .info							{ position: absolute; top: -10px; right: 50px; background: #e8e8e8; border-radius: 4px;
										padding: 30px; width: 400px; line-height: 1.4; text-align: left; display: none; }
.lvl .info:after					{ content:"▶"; display: block; position: absolute; text-align: left; font-size: 30px; top: 15px; right: -16px; width: 20px; color:#e8e8e8; }
.lvl .active						{ border-left : 3px solid #FAF5EC}
.lvl .lvl > div						{ width: 70%; margin: 10px 0; height: 1px; border-top: 20px solid; }

.seuils tbody						{ background: #fff}
.seuils .periode					{ width: 155px; }
.seuils .periodelarge				{ width: 185px; }
.details_seuils						{ margin-left:10px; color:#0000FF; }

.seuils .img						{ position: relative; height: 10px; }
.seuils .img > img					{ position: absolute; top: 0; right: 2em;}
.seuils ul							{ padding-left: .4em; }
.seuils li							{ padding-bottom: .6em; position: relative; }
.seuils li:before					{ content: "-"; position: absolute; left: -.4em; }

.plainte .asterix					{ font-size: 5em; line-height: 1; text-align: center; position: relative; top: 10px}

.thicker							{ display: block; height: 40px; padding: 10px 0; width: 100%; overflow: hidden; background: #000;
									  background: rgba(0,0,0,.8); position: fixed; left: 0; bottom: 0; z-index: 30000; min-width: 960px }
.thicker div						{ white-space: nowrap; line-height: 40px; font-size: 1.2em; color: #fff; position: relative; left: 100%; display: inline-block; }

/* Overlay */
.overlay							{ position: fixed; top: 0; left: 0; width: 100%; height: 100%; text-align: center;
										display: none; background: rgba(0,0,0,.9); z-index: 10001}
.overlay .before,
.overlay .image					    { display: inline-block; vertical-align: middle;}
.overlay .before					{ height: 100%;}
.overlay .image						{ position: relative; }
.overlay .close						{ font-size: 20px; width: 30px; height: 30px; line-height: 30px; background: #fff; color: #000; font-weight: bold;
									  display: block; position: absolute; right: 2px; bottom: 2px; cursor: pointer; }
.overlay img						{ max-width: 100%; border: #fff solid 10px; border-radius: 2px; }

/* Zones carte globale */

.zone 								{ display:block; position: absolute; text-align: center; z-index: 1000; background-color: rgba(0,0,0,0.1); font-weight: bold; font-size: 1.5em;}
.zone:hover 						{ background-color: rgba(0,0,0,0.3); text-decoration: none;}
.zone.est							{ top: 80px; right: 73px; width: 325px; height: 142px; }
.zone.ouest						    { top: 122px; left: 50px; width: 182px; height: 125px; }
.zone.sud						    { top: 230px; right: 180px; width: 180px; height: 124px; }

.retourMap 							{ background-color: #b8b8b8; padding: 5px 10px; float: right; color:#fff; margin-top: 7px; }

.btnDate                            { display:inline; vertical-align: bottom; margin:0; cursor:pointer; }

.date_cal 							{ color:#0000FF; }

.police_adj
{
	/*font-family:Verdana, Helvetica, sans-serif;*/
	font-family:Tahoma, Helvetica, sans-serif;
	font-size:100%;
	font-weight:600;
}

.centre_turcot 	{ margin-right:396px;}

.paddingseti	{ padding-top: 5px; padding-bottom: 5px; padding-right:300px;} /*525px;}*/


.space			{display: inline-block; width: 500px;}

.mtq			{ height: 70px; line-height: 70px; background: #faf5ec; text-align: center;}
.map .mtq	{ padding-bottom: 18px; background: none; }
.mtq a			{ padding: 0 0px; }
.mtq a:hover	{ text-decoration:none;}

.avisResidents li {
	margin: 10px;
}

/* =============================================================================
   Section pour l'animation de chargement
   ========================================================================== */
/*.modal {
    display:    none;
    position:   fixed;
    z-index:    1000;
    top:        0;
    left:       0;
    height:     100%;
    width:      100%;
    background: rgba( 255, 255, 255, .8 )
                url('loader1.gif')
                50% 50%
                no-repeat;
}*/
.modal {
    display:    none;
    z-index:    1000;
    height:     320px;
    width:      940px;
    background: #faf5ec
                url('loader4.gif')
                50% 50%
                no-repeat;
}

/* When the body has the loading class, we turn
   the scrollbar off with overflow:hidden */
.graph.loading {
    /*overflow: hidden;   */
}

/* Anytime the body has the loading class, our
   modal element will be visible */
.graph.loading .modal {
    display: block;
}



/* When the body has the loading class, we turn
   the scrollbar off with overflow:hidden */
.graph2.loading {
    /*overflow: hidden;   */
}

/* Anytime the body has the loading class, our
   modal element will be visible */
.graph2.loading .modal {
    display: block;
}


.jetNoiseText {
	color:#0000FF;
	font-weight : bold;
	display: inline-block;
}

/* =============================================================================
   Non-Semantic Helper Classes
   ========================================================================== */

.container{margin-left:auto;margin-right:auto;width:960px}.grid_1,.grid_2,.grid_3,.grid_4,.grid_5,.grid_6,.grid_7,.grid_8,.grid_9,.grid_10,.grid_11,.grid_12{display:inline;float:left;margin-left:10px;margin-right:10px}.alpha{margin-left:0}.omega{margin-right:0}.grid_1{width:60px}.grid_2{width:140px}.grid_3{width:220px}.grid_4{width:300px}.grid_5{width:380px}.grid_6{width:460px}.grid_7{width:540px}.grid_8{width:620px}.grid_9{width:700px}.grid_10{width:780px}.grid_11{width:860px}.grid_12{width:940px}.prefix_1{padding-left:80px}.prefix_2{padding-left:160px}.prefix_3{padding-left:240px}.prefix_4{padding-left:320px}.prefix_5{padding-left:400px}.prefix_6{padding-left:480px}.prefix_7{padding-left:560px}.prefix_8{padding-left:640px}.prefix_9{padding-left:720px}.prefix_10{padding-left:800px}.prefix_11{padding-left:880px}.suffix_1{padding-right:80px}.suffix_2{padding-right:160px}.suffix_3{padding-right:240px}.suffix_4{padding-right:320px}.suffix_5{padding-right:400px}.suffix_6{padding-right:480px}.suffix_7{padding-right:560px}.suffix_8{padding-right:640px}.suffix_9{padding-right:720px}.suffix_10{padding-right:800px}.suffix_11{padding-right:880px}.ir{display:block;text-indent:-999em;overflow:hidden;background-repeat:no-repeat;text-align:left;}.clear{clear:both}br.clear{display:block;height:1px;margin:-1px 0 0 0;overflow:hidden;visibility:hidden}.clearfix:before,.clearfix:after,.main:before,.main:after,.container:before,.container:after{content:"";display:table;}.clearfix:after,.main:after,.container:after{clear:both}.hidden{display: none;}