html { font-size:100%; }
body { font-size:1em; }
* { margin:0; padding:0; box-sizing:border-box; }
div { }
h1 { font-size:1.3em; line-height:1.5em; background-color:#FFFFFF; }
h2 { font-size:1.2em; line-height:1.4em; }
h3 { font-size:1.1em; line-height:1.3em; }
h4 { font-size:1.0em; line-height:1.2em; }
h5 { font-size:0.8em; line-height:1.0em; }
h6 { font-size:0.6em; line-height:0.8em; }
a { font-size:1em; color:#585858; }
span { font-family:'Roboto-Regular'; font-size:1.2em; }
label { font-family:'Roboto-Regular'; font-size:1em; color:#424242; line-height:normal;  }
fieldset { text-align:left; color:black; }
legend { font:normal 1em verdana, arial, helvetica, sans-serif; color:#333; font-size:0.8em; }

input[type=text] { padding:1px; font-family:'Roboto-Regular'; font-size:1em; border:none; color:#333; }
input[type=text]:focus { background-color:#ffffff; }

input[type=password] { font-family:'Roboto-Regular'; font-size:1em; border:none; color:#333; background-color:rgb(232, 240, 254); }
input[type=checkbox] { width:1em; height:1em; line-height:1em; cursor:pointer; }

input[type=button] { font-size:1em; border:none; color:black; }

input[type=date] { padding:1px; font-family:'Roboto-Regular'; font-size:1em; border:none; color:#333; }
input[type=time] { padding:1px; font-family:'Roboto-Regular'; font-size:1em; border:none; color:#333; }

.text-error { color:#ff0000; }

html { } 
body { width:100%; height:100%; background-color:white; max-width:1024px; margin:auto; }

	.div-mask { position:fixed; top:0; left:0; width:100%; height:100%; overflow:hidden; background:#0b0b0b; opacity:0.6; }

	.index-header						{ z-index:2; }
	.index-main							{ z-index:1; }
	.index-footer						{ z-index:2; }
	.index-mask							{ z-index:3; }
	
	.index-menu							{ z-index:4; }

	.index-alert						{ z-index:5; }
	
	.mask-popup							{ z-index:80; }
	.index-popup						{ z-index:81; }	
		.mask-popup-1					{ z-index:82; }
		.index-popup-1					{ z-index:83; }
			.mask-popup-2				{ z-index:84; }
			.index-popup-2				{ z-index:85; }
					
		.mask-popup-credit				{ z-index:86; }
		.index-popup-credit				{ z-index:87; }

			.mask-warning				{ z-index:97; }
			.index-warning				{ z-index:98; }

	.index-alert						{ z-index:99; }

	.div-popup { position:fixed; top:0; left:0; right:0; bottom:0; overflow-x:hidden; overflow-y:auto; }
	.div-popup-1 { position:fixed; top:30px; left:5px; right:5px; bottom:5px; overflow-x:hidden; overflow-y:auto; }
			
	.div-display-alert { position:fixed; top:0px; bottom:0px; left:0px; right:0px; }
		.div-display-alert-content { position:relative; height:100%; width:100%; max-width:400px; margin:0px auto 0px auto; background-color:#ffffff; color:#000000; border-radius:5px; border:2px solid #CECECE; }
			.div-display-alert-header { position:absolute; top:0px; height:40px; width:100%; padding:5px 5px 5px 5px; background-color:#ffffff; color:#000000; cursor:pointer; }
				.class-button-close-alert { width:100%; height:34px; margin-top:3px; padding-right:36px; cursor:pointer; font-family:Arial, sans-serif; background-repeat:no-repeat; background-color:#c7c7c7; border-color:#c7c7c7; border-radius:5px; background-image:url(/img/close_transparent_30_30.png); }
			.div-display-alert-main { position:absolute; top:40px; bottom:0px; width:100%; padding:5px 5px 5px 5px; background-color:#4e4e4e; color:#ffffff;}
	
	.div-display-menu-offline	{ position:fixed; top:0px; bottom:0px; left:0px; width:250px; background-color:#ffffff; color:black; overflow:auto; }
		.div-display-menu-offline nav {}
			.div-display-menu-offline nav ul { list-style:none; }
				
				.div-display-menu-offline nav ul li { display:block; line-height:30px; margin:5px 0px 5px 10px; cursor:pointer; }
				.div-display-menu-offline nav ul li:hover { text-decoration:underline; border:1px solid #fff; }
				.div-display-menu-offline nav ul li img { height:30px; width:auto; vertical-align:middle; }
				
				.div-display-menu-offline nav ul li div { display:flex; flex-direction:row; align-items:center; height:100%; text-align:left; cursor:pointer; }
				.div-display-menu-offline nav ul li div:hover { text-decoration:underline; border:1px solid #fff; }
				.div-display-menu-offline nav ul li div span { padding:0px 5px 0px 5px; font-size:1.5em; }
				
	
	.div-display-menu 			{ position:fixed; top:0px; bottom:0px; left:0px; width:250px; background-color:#ffffff; color:white; overflow:auto; }
		.div-display-menu nav {}
			.div-display-menu nav ul { list-style:none; }
				
				.div-display-menu nav ul li div { display:flex; flex-direction:row; align-items:center; height:100%; text-align:left; cursor:pointer; }
				.div-display-menu nav ul li div:hover { text-decoration:underline; border:1px solid #fff; }
				.div-display-menu nav ul li div span { padding:0px 5px 0px 5px; font-size:1.5em; }
				
				.div-display-menu nav ul li { display:block; line-height:30px; margin:5px 0px 5px 10px; cursor:pointer; }
				.div-display-menu nav ul li:hover { }
				.div-display-menu nav ul li img { height:30px; width:auto; vertical-align:middle; }
				.div-display-menu nav ul li.li-others { color:black; }
				.div-display-menu nav ul li:hover.li-others { text-decoration:underline; border:1px solid #fff; }
				
				.ul-sous { display:block; }
				.div-display-menu nav ul li:hover .ul-sous { display:block; }
				.div-display-menu nav ul li ul li { color:black; }
				.div-display-menu nav ul li ul li:hover { text-decoration:underline; border:1px solid #fff; }
				
				.li-active-online { background-color:#DFA913; }
				.li-not-active-online { background-color:transparent; }	
				.li-not-active-online-div { background-color:#B82A0B; }	

.div-header-layout 	{ float:left; width:100%; }
		.header-offline			{ position:fixed; top:0px; width:100%; }
			.div-header-offline { height:100%; width:100%; }
			.div-header-offline-layout,.header-offline	{ height:42px; }
		
		.header			{ position:fixed; top:0px; width:100%; }
			.div-header { height:100%; width:100%; }
			.div-header-color { background-color:#B82A0B; }
				
				.div-menu-principal-offline	{ position:absolute; top:3px; left:33px; right:0px; height:42px; overflow:hidden; }
					.div-menu-principal-offline nav { width:100%; display:flex; flex-direction:column; color:white; }
						.div-menu-principal-offline nav ul { width:100%; list-style:none; flex-direction:row; flex-wrap:nowrap; justify-content:space-around; }
						.div-menu-principal-offline nav ul li { padding:5px 5px 5px 5px; display:flex; flex-direction:row; align-items:center; cursor:pointer; }
						.div-menu-principal-offline nav ul li:hover { padding:2px 2px 2px 2px; text-decoration:underline; border:1px solid #fff; }
						.div-menu-principal-offline nav ul li span { margin-left:10px; font-size:1.1em; }
						.div-menu-principal-offline nav ul li img { display:block; float:left; max-height:30px; width:auto; }
				.div-menu-offline { position:absolute; top:3px; left:0px; width:32px; height:42px; cursor:pointer; background-color:#B82A0B; }
					.div-menu-offline span { position:relative; display:inline-block; margin-top:12px; width:100%; height:20px; border-top:4px solid #fff; border-bottom:4px solid #fff; }
					.div-menu-offline span:before { content:""; position:absolute; top:4px; left:0px; width:100%; border-top:4px solid #fff; }
						
				.div-menu-principal			{ position:absolute; top:3px; left:33px; right:0px; overflow:hidden; }
				.div-menu-principal-color 	{ background-color:#B82A0B; }
					.div-menu-principal nav { width:100%; display:flex; flex-direction:column; color:white; }
						.div-menu-principal nav ul { width:100%; list-style:none; flex-direction:row; flex-wrap:nowrap; justify-content:space-around; }
							.ul-active { background-color:#000000; }
							.ul-not-active { background-color:transparent; }
						.div-menu-principal nav ul li { padding:5px 5px 5px 5px; display:flex; flex-direction:row; align-items:center; cursor:pointer; }
						.div-menu-principal nav ul li:hover { padding:2px 2px 2px 2px; text-decoration:underline; border:1px solid #fff; }
							.div-menu-principal .li-active { background-color:#DFA913; color:black; border-radius:20px 20px 0px 0px; border:none; }
							.div-menu-principal .li-not-active { background-color:transparent; }
						.div-menu-principal nav ul li span { margin-left:10px; font-size:1.1em; }
						.div-menu-principal nav ul li img { display:block; float:left; max-height:30px; width:auto; }
				
				.div-menu { position:absolute; top:3px; left:0px; width:32px; cursor:pointer; background-color:#B82A0B; }
					.div-menu span { position:relative; display:inline-block; margin-top:12px; width:100%; height:20px; border-top:4px solid #fff; border-bottom:4px solid #fff; }
					.div-menu span:before { content:""; position:absolute; top:4px; left:0px; width:100%; border-top:4px solid #fff; }
					
				.div-smenu-principal 		{ position:absolute; right:0px; left:0px; overflow:hidden; border-radius:10px 10px 10px 10px; border:none; }
				.div-smenu-principal-color 	{ background-color:#DFA913; }
					.div-smenu-principal nav { width:100%; display:flex; flex-direction:column; color:white; }
					.div-smenu-principal nav ul { width:100%; list-style:none; flex-direction:row; flex-wrap: nowrap; justify-content:space-around; }
						.div-smenu-principal nav ul li { padding:5px 5px 5px 5px; display:flex; flex-direction:row; align-items:center; cursor:pointer; }
							.div-smenu-principal .li-active { padding:3px; background-color:#DFA913; color:black; border-radius:5px 5px 5px 5px; border:1px solid #000; }
							.div-smenu-principal .li-not-active { background-color:transparent; }
						.div-smenu-principal nav ul li:hover { padding:2px 2px 2px 2px; text-decoration:underline; border:1px solid #fff; }
						.div-smenu-principal nav ul li span { margin-left:10px; font-size:1.1em; }
						.div-smenu-principal nav ul li img { max-height:30px; width:auto; }
				.div-filariane { position:absolute; top:45px; right:0px; left:0px; padding:0px 0px 0px 5px; overflow:hidden; background-color:#808080; }
				
	.div-main-layout { float:left; width:100%; }
		.main { position:relative; width:100%; top:0px; bottom:0px; text-align:center; }
			.div-main-contain-offline { float:left; width:100%; }
			.div-main-contain { float:left; width:100%; padding:5px; }
					
				.rubriques-site { display:flex; justify-content:space-around; flex-wrap:wrap; background-color:#FFDE59; }
					.buttons-site { display:flex; flex-direction:column; align-items:center; padding:10px; margin:10px; background-color:#f7c600; }
						.title-site { margin:10px 0px 10px 0px; line-height:1.7em; font-family:Arial; font-size:1.4em; color:black; }
						.button-site-connexion { margin:10px 0px 20px 0px; }
						.button-site-inscription { margin:20px 0px 20px 0px; }						
				
				.div-main-contain .class-title	{ display:flex; flex-direction:row; justify-content:center; margin:10px; color:black; background-color:#DFA913; }
					.div-main-contain .class-title div { float:left; width:100%; height:100%; display:flex; flex-direction:row; align-items:center; overflow:hidden; }
						.div-main-contain .class-title div span { padding:0px 5px 0px 5px; font-size:1.5em; }
				
				.div-main-contain .class-stitle { display:flex; flex-direction:row; justify-content:center; margin:10px; color:black; background-color:#FFC011; }
					.div-main-contain .class-stitle a { display:block; text-decoration:none; color:black; }
					.div-main-contain .class-stitle a:hover { color:red; }
					.div-main-contain .class-stitle span:before { content:"\25C4"; }
					.div-main-contain .class-stitle span:hover:before { content:"\25BC"; }
					.div-main-contain .class-stitle span:after { content:"\25BA"; }
					.div-main-contain .class-stitle span:hover:after { content:"\25BC"; }
				
				.class-main-contain-entete { float:left; width:100%; font:1.0em verdana, arial, helvetica, sans-serif; background-color:#DFA913; color:#333; }
				.class-main-contain-container { float:left; width:100%; margin-top:5px; }
			
						.cgu-div { margin-top:5px; margin-bottom:15px; text-align:left; }
							.cgu-div h1 { margin-bottom:30px; text-align:left; font-size:1.5em; font-weight: normal; font-family:Helvetica; color:#333333; }
							.cgu-div p { display:block; margin-bottom:7px; font-size:0.9em; font-family:Helvetica; color:#333333; }
							.cgu-div p.title { margin-top:30px; }
							.cgu-div p.stitle { margin-top:10px; }
							.cgu-div p span { font-size:0.9em; font-weight:bold; font-family:Helvetica; color:#333333; }
			
					.contain-rubriques { float:left; width:100%; }
					.contain-rubriques-selected { margin-bottom:5px; background-color:#D3D3D3; border:solid 1px #4e4e4e; border-radius: 5px 5px 5px 5px; }
					.contain-rubriques-not-selected { margin-bottom:5px; background-color:#F5F5F5; border:solid 1px #4e4e4e; border-radius: 5px 5px 5px 5px; }
						
						.title-contain-rubrique			{ margin-top:2px; margin-right:2px; margin-bottom:2px; margin-left:2px; text-align:center; font:1.0em verdana, arial, helvetica, sans-serif; color:black; white-space: nowrap; overflow: hidden; }
						.title-contain-rubrique-on		{ background-color:#FFD33C; }
						.title-contain-rubrique-off		{ background-color:#D4CFBA; }
						.title-contain-rubrique-open	{ margin-top:2px; margin-right:2px; margin-bottom:2px; margin-left:2px; text-align:center; font:1.0em verdana, arial, helvetica, sans-serif; color:black; background-color:#FFD33C; white-space: normal; }
						.title-contain-rubrique-close	{ margin-top:2px; margin-right:2px; margin-bottom:2px; margin-left:2px; text-align:center; font:1.0em verdana, arial, helvetica, sans-serif; color:black; background-color:#FFD33C; white-space:normal; word-break:break-all; }
						
						.stitle-contain-rubrique 		{ margin-top:2px; margin-right:2px; margin-bottom:4px; margin-left:2px; text-align:center; font:0.9em verdana, arial, helvetica, sans-serif; color:black; background-color:#FFC011;}
						
						.contain-rubrique-text { width:100%; text-align:left; }
						.contain-rubrique { width:100%; display:flex; flex-direction:row; justify-content:space-around; flex-wrap:wrap; }
							.title-rubrique-open	{ margin-top:2px; margin-right:2px; margin-bottom:2px; margin-left:2px; text-align:center; font:1.0em verdana, arial, helvetica, sans-serif; color:black; background-color:#FFD33C; white-space: normal; }
							.stitle-rubrique 		{ margin-top:2px; margin-right:2px; margin-bottom:4px; margin-left:2px; text-align:center; font:0.9em verdana, arial, helvetica, sans-serif; color:black; background-color:#FFC011;}
						
							.contain-rubrique form { width:100%; }
							.contain-rubrique fieldset { width:100%; }
							.contain-rubrique fieldset div.large { width:100%; }
							.contain-rubrique fieldset div input[type=text] { width:100%; }
							
							.contain-vignette			{  width:270px; margin:5px 5px 5px 5px; display:flex; flex-direction:column; text-align:left; color:black; border:solid 2px #4e4e4e; cursor:pointer; }
							.contain-vignette-on		{  background-color:#FFFFFF; }
							.contain-vignette-off		{  background-color:#D4CFBA; }
							.contain-vignette-selected	{  width:270px; margin:5px 5px 5px 5px; display:flex; flex-direction:column; text-align:left; color:black; background-color:red; border:solid 2px #4e4e4e; cursor:pointer; }
								
								.contain-vignette-title 	{ padding:3px; margin:2px; overflow-wrap:break-word; text-align:center; }
								.contain-vignette-title-on	{ background-color:#FFFB73; }
								.contain-vignette-title-off	{ background-color:#D4CFBA; }
								
								.contain-vignette-description { padding:3px; margin:2px; overflow-wrap:break-word; }
								.contain-vignette-description-on { background-color:#FFFFFF; }
								.contain-vignette-description-off { background-color:#D4CFBA; }
								
								.col-contain-rubrique-row-noselected{ color:black; background-color:#E7E2F7; }	
								.col-contain-rubrique-row-selected	{ color:black; background-color:red; }	
		
							.col-contain-rubrique-entete { text-align:center; color:black; background-color:#BACDFF; }	
								.contain-rubrique .rubrique-selected { background-color:#d50900; }
								.col-contain-rubrique-entete a { width:100%; display:block; text-decoration:none; color:black; }
									.col-contain-rubrique-entete a:hover { color:black; }
									.col-contain-rubrique-entete span:before { content:"\25C4"; }
									.col-contain-rubrique-entete span:hover:before { content:"\25BC"; }
									.col-contain-rubrique-entete span:after { content:"\25BA"; }
									.col-contain-rubrique-entete span:hover:after { content:"\25BC"; }	

					.class-profil-menu { width:100%; max-width:400px; margin:auto; padding:5px 5px 5px 5px; background-color:#B82A0B; }
						.class-profil-menu span { width:100%; margin:10px 0px 10px 0px; display:inline-block; text-align:center; line-height:1.4em; font-size:1.1em; color:black; background-color:#adc9c5; border:solid 2px #4e4e4e; }
						.class-profil-menu input[type=button] { width:100%; margin:10px 0px 10px 0px; line-height:1.4em; font-size:1em; cursor:pointer; }
						.class-profil-menu input[type=button]:hover { background-color:#E4E3E2; font-weight:bold; }

	.div-footer-layout { float:left; width:100%; height:42px; }
		.footer { position:fixed; bottom:0px; width:100%; height:42px; }
			.div-footer { height:100%; width:100%; background-color:#404654; }
				.div-footer-contain { height:100%; flex-direction:row; flex-wrap:nowrap; justify-content:space-around; align-items:center; }

.display-none { display:none; }
.display-block { display:block; }
.display-flex { display:flex; }
.class-1-button { display:flex; flex-direction:row; justify-content:center; margin-bottom:10px; }
.class-2-button { display:flex; flex-direction:row; justify-content:space-between; }
.class-div-left { float:left; }
	
				.warning-popup { position:relative; margin:50px auto 0px auto; padding:10px; background-color:#FFFFFF; border-radius:4px; }
					.warning-popup .class-title	{ width:100%; height:35px; text-align:left; cursor:pointer; }
						.warning-popup .class-title div { float:left; width:100%; height:100%; display:flex; flex-direction:row; align-items:center; overflow:hidden; }
							.warning-popup .class-title div span { padding:0px 5px 0px 5px; font-size:1.5em; }
					.warning-popup .warning-content { width:100%; margin-bottom:40px; text-align:left; }
					
						.class-send-file		{ width:100%; margin-top:10px; padding:5px; border:1px solid #333; border-radius:4px; }
							.class-mask-input-file { display:inline-block; position:relative; margin-top:10px; overflow:hidden; }
							.class-mask-input-file input[type=file] { position:absolute; left:0; top:0; opacity:0; }
						
						.class-send-emoticon	{ width:100%; margin-top:10px; padding:5px; }
							.class-send-emoticon-cat { width:100%; margin-top:10px; padding:5px; border:1px solid #333; border-radius:4px; }
								.class-send-emoticon-cat span { width:30px; height:30px; padding:6px; cursor:pointer; }
						
						.class-historique	{ width:100%; padding:5px; }
							.class-select-historique { width:100%; margin-top:10px; padding:5px; border:1px solid #333; border-radius:4px; }
								.class-dropdown-list { width:100%; text-align:center; cursor: pointer; }
								.class-dropdown-list-button { color:black; background-color:white; border-color:#6c757d; }
									.class-dropdown-list-button:after { content:"\25BC"; }
									.class-dropdown-list-button a { text-decoration:none; }
								.class-dropdown-list-div { width:100%; display:none; margin-top:10px; padding:5px; border:1px solid #333; border-radius:4px; }
								.class-dropdown-list-div:target { display:block; }
									.class-dropdown-list-div div{ display:flex; flex-direction:row; justify-content:center; margin-bottom:10px; }
									.class-dropdown-list-div ul { padding:10px; list-style:none; background-color:#B5B6B6; }
									.class-dropdown-list-div li { padding:5px; text-align:left; }
									.class-dropdown-list-div .liselected { background-color:#EFEFEF; }
									.class-dropdown-list-div li:hover { text-decoration:underline; border:1px solid #000; background-color:white; }
							.class-content-historique { float:left; width:100%; margin-top:10px; padding:5px; border:1px solid #333; border-radius:4px; }
				
				
				/*	Commun */
				.cookies-consent-popup	{ width:100%; max-width:900px; margin:50px auto 0px auto; padding:5px; text-align:left; background-color:#FFFFFF; border-radius:4px; }
				.cookies-consent-popup form { margin-top: 20px; }
				.cookies-consent-popup fieldset { position:relative; margin-bottom:20px; text-align:center; border:0px; }
				
				.header-popup		{ position:absolute; top:20px; right:0; left:0; }
				.main-popup			{ position:absolute; right:0; bottom:0; left:0; }

				.commun-popup			{ margin:auto; padding:5px; height:100%; text-align:left; background-color:#FFFFFF; border-radius:4px; overflow-y:auto; }

					.commun-popup div.class-all { float:left; width:100%; margin-top:10px; text-align:center; }
					.commun-popup div.class-all img { max-width:100%; height:auto; }
					.commun-popup div.class-all-left { float:left; width:100%; margin-top:10px; text-align:left; }
					.commun-popup div.class-all-left img { max-width:100%; height:auto; }
					.commun-popup div.class-right { float:left; width:50%; margin-top:10px; text-align:right; }
					.commun-popup div.class-left { float:left; width:50%; margin-top:10px; padding-left:10px; text-align:left; }
					.commun-popup div.class-left-hidden { float:left; width:50%; margin-top:10px; padding-left:10px; text-align:left; overflow:hidden; }
					
					.commun-popup .class-title-header { width:100%; height:30px; text-align:left; cursor:pointer; }
						.commun-popup .class-title-header div { float:left; width:100%; height:100%; display:flex; flex-direction:row; align-items:center; overflow: hidden; }
							.commun-popup .class-title-header div span { padding:0px 5px 0px 5px; font-size:1.5em; }
							.commun-popup .class-title-header div img { height:100%; width:auto; }
					.commun-popup .class-message-warning { width:100%; font-size:1.5em; text-align:center; color:red; background-color:white; }

					.commun-popup .class-title	{ display:flex; flex-direction:row; justify-content:center; margin:10px; color:black; background-color:#E3D4F5; }
						.commun-popup .class-title div { float:left; width:100%; height:100%; display:flex; flex-direction:row; align-items:center; overflow: hidden; }
							.commun-popup .class-title div span { padding:0px 5px 0px 5px; font-size:1.5em; }
					
					.commun-popup .class-stitle { display:flex; flex-direction:row; justify-content:center; margin:10px; color:black; background-color:#E3D4F5; }
						.commun-popup .class-stitle a { display:block; text-decoration:none; color:black; }
						.commun-popup .class-stitle a:hover { color:red; }
						.commun-popup .class-stitle span:before { content:"\25C4"; }
						.commun-popup .class-stitle span:hover:before { content:"\25BC"; }
						.commun-popup .class-stitle span:after { content:"\25BA"; }
						.commun-popup .class-stitle span:hover:after { content:"\25BC"; }
					
					.commun-popup form { background-color:#FFFFFF; }
						.commun-popup legend { margin-bottom:10px; }
						.commun-popup div.class-div-textarea { position:relative; margin-bottom:20px; display:flex; flex-direction:row; align-items:center; flex-wrap:wrap; text-align:left; justify-content:start; }
						.commun-popup fieldset { position:relative; margin-bottom:20px; display:flex; flex-direction:row; align-items:center; flex-wrap:wrap; text-align:left; justify-content:start; }
						.commun-popup fieldset.no-margin { margin-bottom:0px; }
							.commun-popup fieldset label { padding:5px 0px; cursor:text; background-color: #D8D8D8; text-align:left; font-size:0.8em; }
							.commun-popup fieldset label.label-row { display:block; width:170px; }
							.commun-popup fieldset img { max-height:20px; width:auto; }
							.commun-popup fieldset img.img-vignette-photo { max-width:100%; max-height:120px; }
							
							.commun-popup fieldset div { display:flex; flex:auto; flex-direction:row; justify-content:start; }
							.commun-popup fieldset div.large { width:100%; }
							
								.commun-popup fieldset div input[type=text] { display:block; width:0; min-width:100%; }
								.commun-popup fieldset div input[type=text].serial-60 { display:block; width:0; min-width:60px; }
								.commun-popup fieldset div input[type=text].serial-100 { display:block; width:0; min-width:100px; }
								.commun-popup fieldset div input[type=radio] { }
								.commun-popup fieldset div input[type=date] { }
								.commun-popup fieldset div input[type=time] { }
								.commun-popup fieldset div input[type=password] { display:block; width:0; min-width:100%; }
								.commun-popup fieldset div input[type=checkbox] { }
								.commun-popup fieldset div select { }
								
								.commun-popup fieldset div.label-data { font-size:1em; background-color:#FFFFFF; }
								.commun-popup fieldset div.class-text-input { width:100%; text-align:left; border-bottom:1px solid #9e9e9e; padding:5px 25px 5px 0px; }
								.commun-popup fieldset div.class-text-input-error { width:100%; text-align:left; border-bottom:1px solid #ff0000; padding:5px 25px 5px 0px; }
								.commun-popup .class-textarea { min-height:30px; width:100%; padding:2px; border:3px solid #cccccc; resize:none; }
								.commun-popup .class-textarea-error { min-height:30px; width:100%; padding:2px; border:3px solid #cccccc; resize:none; }
									
								.commun-popup fieldset div.form-captcha { float:left; width:50%; }
								.commun-popup fieldset div.form-captcha img { max-width:100%; }
				
								.commun-popup .g-recaptcha {}

								.commun-popup fieldset div select.class-select-annee-register	{ width:32% }
								.commun-popup fieldset div select.class-select-mois-register	{ width:41% }
								.commun-popup fieldset div select.class-select-jour-register	{ width:27% }
									.commun-popup fieldset div select.class-option-register {}

						.commun-popup fieldset.flex-column { flex-direction:column; }
							.commun-popup fieldset.flex-column label { width:100%; text-align:center; }
							.commun-popup fieldset.flex-column form { margin-top:5px; margin-bottom:5px; }
							.commun-popup fieldset.flex-column form div { width:100%; display:flex; flex-direction:column; align-items:center; }
							.commun-popup fieldset.flex-column div { width:100%; display:flex; flex-direction:column; align-items:center; }
								.commun-popup fieldset.flex-column div.div-vignettes-photo { width:100%; display:flex; flex-direction:row; flex-wrap:wrap; }	
									.commun-popup fieldset.flex-column div.div-vignette-photo { width:150px; margin-bottom:5px; border:solid 1px #A4A4A4; }
										
										.div-vignette-img-photo { cursor:pointer; text-align:center; }
											.img-vignette-photo { max-width:100%; max-height:120px; }
										.div-vignette-ctrl-photo { width:100%; margin-bottom:3px; display:flex; flex-direction:column; align-items:center; justify-content:space-around; }

					.commun-popup form.form-profil { width:100%; display:flex; flex-direction:row; justify-content:space-around; flex-wrap:wrap; }
						.div-group-params { float:left; width:100%; margin:0px 0px 10px 0px; border:1px solid #d4d4d4; background-color:#f9f9f9; }
							.div-radio-profil { padding:10px 10px 0px 10px; text-align:left; }				
								.div-title-profil { width:100%; font-weight:bold; }
							.div-checkbox-profil { padding:10px 10px 10px 10px; width:100%; text-align:left; }				

					.commun-popup .class-article-paiement { float:left; width:100%; margin-bottom:20px; text-align:center; }
						.class-article-paiement img { max-width:90%; height:auto; }
					
					.commun-popup .class-article-message { float:left; width:100%; margin-bottom:20px; text-align:center; }
						
					.commun-popup .class-article-message-left { float:left; width:90%; padding-bottom:5px; display:flex; flex-direction:row; flex-wrap:nowrap; justify-content:left; text-align:left; align-items:center; }
						.commun-popup .class-article-message-left .class-div-img-message { padding-right:5px; }
							.commun-popup .class-article-message-left .class-div-img-message .class-div-photo { width:100%; height:30px; }
							.commun-popup .class-article-message-left .class-div-img-message .class-div-photo img { width:auto; height:100%; vertical-align:middle; }
							
						.commun-popup .class-article-message-left .class-div-message { padding:5px; border-bottom:1px solid #A4A4A4; background-color:#D8D8D8; border-radius:10px; }
							.commun-popup .class-article-message-left .class-div-name { width:100%; padding-bottom:5px; font-size:1em; color:red; }
							.commun-popup .class-article-message-left .class-div-text { width:100%; font-size:1em; color:black; white-space:normal; word-break:break-word; }
							.commun-popup .class-article-message-left .class-div-file { width:100%;  color:black; white-space:normal; word-break:break-word; }
								.commun-popup .class-article-message-left .class-div-file a { font-size:1em; }
								.commun-popup .class-article-message-left .class-div-file img { width:auto; height:3em; vertical-align:middle; }
							.commun-popup .class-article-message-left .class-div-date { padding-top:5px; text-align:right; font-size:0.8em; color:black; }
						.commun-popup .class-article-message-right { float:right; width:90%; padding-bottom:5px; display:flex; flex-direction:row; flex-wrap:nowrap; justify-content:right; text-align:left; align-items:center; }
							.commun-popup .class-article-message-right .class-div-message { padding:5px; border-bottom:1px solid #A4A4A4;background-color:#D8D8D8; border-radius:10px; }
							.commun-popup .class-article-message-right .class-div-text { width:100%; font-size:1em; color:black; white-space:normal; word-break:break-word; }
							.commun-popup .class-article-message-right .class-div-file { width:100%; color:black; white-space:normal; word-break:break-word; }
								.commun-popup .class-article-message-right .class-div-file a { font-size:1em; }
								.commun-popup .class-article-message-right .class-div-file img { width:auto; height:3em; vertical-align:middle; }
						.commun-popup .class-article-message-right .class-div-date { padding-top:5px; text-align:right; font-size:0.8em; color:black; }
							
					.autocomplete-items { border:1px solid #d4d4d4; border-bottom:none; border-top:none; }
					.autocomplete-items div { padding:10px; cursor:pointer; background-color:#fff; border-bottom:1px solid #d4d4d4; }
					.autocomplete-items div:hover { background-color: #e9e9e9; }
					.autocomplete-active { background-color: DodgerBlue !important; color: #ffffff; }
					
					.class-rooms{ width:100%; height:100%; display:flex; flex-direction:row; flex-wrap:nowrap; }
						.class-rooms-messages	{ float:left; height:100%; background-color:green; }
						.class-rooms-users		{ float:left; height:100%; background-color:blue; }
							.div-box-chat		{ position:relative; float:left; height:100%; width:100%; }
								.div-chat-box	{ position:absolute; top:3px; left:3px; right:3px; bottom:3px; text-align:center; background-color:white; border-width:1px; border-color:black; border-style:solid solid solid solid; }
									/* MESSAGES */
									.messages-rooms		{ position:absolute; top:0px; left:0px; right:0px; bottom:52px; text-align:left; overflow-x:hidden; overflow-y:scroll; }	
									.button-chats		{ position:absolute; height:24px; bottom:28px; left:0px; right:0px; display:flex; align-items:center; justify-content:space-around; }
										.button-chats input[type=button] { height:100%; width:24px; align-items: normal; background-size:contain; background-color:#ADC9C5; cursor:pointer; }
										.button-chats input[type=button]:hover	{ background-color:white;}
										.class-button-attachment{ background-image:url(/img/attachment-24-24.png); }
										.class-button-emoticon{ background-image:url(/img/emoticon-24-24.png); }
										.class-button-history{ background-image:url(/img/history-24-24.png); }
										.class-button-users{ background-image:url(/img/liste-users-24-24.png); }
									.input-chats		{ position:absolute; height:24px; bottom:2px; left:0px; right:30px; border-width:1px; border-color:#535a6c; border-style:solid solid solid solid; }
										.input-message-rooms { width:100%; height:100%; padding:1px; }
									.button-input-chats	{ position:absolute; height:24px; bottom:2px; right:3px; width:24px; }
										.button-input-chats input[type=button] { height:100%; width:24px; align-items: normal; background-size:contain; background-color:#ADC9C5; cursor:pointer; }
										.button-input-chats input[type=button]:hover	{ background-color:white;}
										.class-button-message{ background-image:url(/img/send-24-24.png); }
									
									/* USERS */
									.users-rooms { position:absolute; top:0px; left:0px; right:0px; bottom:30px; text-align:left; overflow-x:scroll; overflow-y:scroll; }
										.class-article-user { position:relative; width:100%; height:1.5em; margin-top:4px; cursor:pointer; background-color:#D8D8D8; }
											.class-div-img-user				{ position:absolute; top:0px; bottom:0px; left:0px; }
												.class-div-img-user		img	{ width:auto; height:100%; vertical-align:middle; }
											.class-div-name-user			{ position:absolute; top:0px; right:0px; bottom:0px; left:26px; white-space:nowrap; }
												.class-div-name-user	span{ font-size:1.2em; vertical-align:middle; color:black; font-weight:bold; }
				
				
				.connexion-popup { width:100%; max-width:330px; margin:50px auto 0px auto; padding:10px; text-align:left; background-color:#FFFFFF; border-radius:4px; }
					.connexion-popup form { margin-top:20px; background-color:#FFFFFF; }
						.connexion-popup fieldset { position:relative; margin-bottom:20px; text-align:left; border:0px; }
							.connexion-popup label { text-align:left; padding:5px 0px; cursor:text; }
							.connexion-popup .class-text-input { width:100%; text-align:left; border-bottom:1px solid #9e9e9e; padding:5px 25px 5px 0px; }
							.connexion-popup .class-text-input-error { width:100%; text-align:left; border-bottom:1px solid #ff0000; padding:5px 25px 5px 0px; }
							
					.connexion-popup .class-title	{ width:100%; height:35px; text-align:left; cursor:pointer; }
						.connexion-popup .class-title div { float:left; width:100%; height:100%; display:flex; flex-direction:row; align-items:center; overflow: hidden; }
							.connexion-popup .class-title div span { padding:0px 5px 0px 5px; font-size:1.5em; }
					
					.connexion-popup .class-stitle { display:flex; flex-direction:row; justify-content:center; margin:10px; color:black; background-color:#E3D4F5; }
						.connexion-popup .class-stitle a { display:block; text-decoration:none; color:black; }
						.connexion-popup .class-stitle a:hover { color:red; }
						.connexion-popup .class-stitle span:before { content:"\25C4"; }
						.connexion-popup .class-stitle span:hover:before { content:"\25BC"; }
						.connexion-popup .class-stitle span:after { content:"\25BA"; }
						.connexion-popup .class-stitle span:hover:after { content:"\25BC"; }
						
					.connexion-popup .form-captcha	{ display:flex; flex-direction:row; }
						.connexion-popup .form-captcha img	{ padding: 0px 0px 0px 10px; }

					.link-mdp-oublie { font-size:0.8em; cursor:pointer; }
					
				.inscription-popup { width:100%; max-width:330px; margin:50px auto 0px auto; padding:10px; text-align:left; background-color:#FFFFFF; border-radius:4px; }
					.inscription-popup form { margin-top:20px; background-color:#FFFFFF; }
						.inscription-popup fieldset { position:relative; margin-bottom:20px; text-align:left; border:0px; }
							.inscription-popup label { text-align:left; padding:5px 0px; cursor:text; }
							.inscription-popup .class-text-input { width:100%; text-align:left; border-bottom:1px solid #9e9e9e; padding:5px 25px 5px 0px; }
							.inscription-popup .class-text-input-error { width:100%; text-align:left; border-bottom:1px solid #ff0000; padding:5px 25px 5px 0px; }
							.inscription-popup .class-checkbox-input { text-align:left; border-bottom:1px solid #9e9e9e; padding:5px 25px 5px 0px; }
							.inscription-popup .class-checkbox-input-error { text-align:left; border-bottom:1px solid #9e9e9e; padding:5px 25px 5px 0px; }
					
					.inscription-popup .class-title	{ width:100%; height:35px; text-align:left; cursor:pointer; }
						.inscription-popup .class-title div { float:left; width:100%; height:100%; display:flex; flex-direction:row; align-items:center; overflow: hidden; }
							.inscription-popup .class-title div span { padding:0px 5px 0px 5px; font-size:1.5em; }
					
					.inscription-popup .class-stitle { display:flex; flex-direction:row; justify-content:center; margin:10px; color:black; background-color:#E3D4F5; }
						.inscription-popup .class-stitle a { display:block; text-decoration:none; color:black; }
						.inscription-popup .class-stitle a:hover { color:red; }
						.inscription-popup .class-stitle span:before { content:"\25C4"; }
						.inscription-popup .class-stitle span:hover:before { content:"\25BC"; }
						.inscription-popup .class-stitle span:after { content:"\25BA"; }
						.inscription-popup .class-stitle span:hover:after { content:"\25BC"; }

		@media screen and (max-width: 370px)
		{	.div-header-layout,.header	{ height:84px; }
					.div-menu-principal	{ height:42px; }
					.div-menu-principal nav ul li { width:40px; }
					.div-menu-principal nav ul li span { display:none; }
					.div-smenu-principal { display:block; top:43px; }		.div-smenu-principal img { display:block; }		.div-smenu-principal span { display:none; }
					.div-filariane { display:none; }
					.div-menu { height:42px; }

			.warning-popup { width:100%; max-width:100%; }
			
			.commun-popup-short { max-width:100%; }
			.commun-popup-width { max-width:100%; }
			.enable-tinymce{ display:none; } .disable-tinymce{ display:block; }
			
			.class-room-messages		{ width:100%; }
			.class-room-users			{ width:100%; }
			.class-option-room-users 	{ display:none; }
		
		}
		@media screen and (min-width: 371px) and (max-width: 580px)
		{	.div-header-layout,.header	{ height:84px; }
					.div-menu-principal	{ height:42px; }
					.div-menu-principal nav ul li { width:40px; }
					.div-menu-principal nav ul li span { display:none; }
					.div-smenu-principal { display:block; top:43px; }		.div-smenu-principal img { display:block; }		.div-smenu-principal span { display:none; }
					.div-filariane { display:none; }
					.div-menu { height:42px; }

			.warning-popup { width:100%; max-width:100%; }
			
			.commun-popup-short { max-width:100%; }
			.commun-popup-width { max-width:100%; }
			.enable-tinymce{ display:none; } .disable-tinymce{ display:block; }
			
			.class-room-messages		{ width:100%; }
			.class-room-users			{ width:90%; }
			.class-option-room-users 	{ display:none; }

		}
		@media screen and (min-width: 581px) and (max-width: 900px)
		{	.div-header-layout,.header	{ height:108px; }
					.div-menu-principal	{ height:52px; }
					.div-menu-principal nav ul li { width:25%; }
					.div-menu-principal nav ul li span { display:block; }
					.div-smenu-principal { display:block; top:55px; }		.div-smenu-principal img { display:none; }		.div-smenu-principal span { display:block; }
					.div-filariane { display:none; }
					.div-menu { height:52px; }

			.warning-popup { width:100%; max-width:100%; }
			
			.commun-popup-short { max-width:100%; }
			.commun-popup-width { max-width:100%; }
			.enable-tinymce{ display:block; } .disable-tinymce{ display:none; }
			
			.class-room-messages		{ width:70%; }
			.class-room-users			{ width:30%; }
			.class-option-room-users 	{ display:block; }
			
		}
		@media only screen and (min-width: 901px)
		{	.footer	{ max-width: 1024px; }	
			.div-header-layout,.header	{ height:108px; max-width: 1024px; }
			.header-offline { max-width: 1024px; }
					.div-menu-principal	{ height:52px; }
					.div-menu-principal nav ul li { width:20%; }
					.div-menu-principal nav ul li span { display:block; }
					.div-smenu-principal { display:block; top:55px; }		.div-smenu-principal img { display:block; }		.div-smenu-principal span { display:block; }
					.div-filariane { display:none; }
					.div-menu { height:52px; }
				
			.warning-popup { width:900px; }
			
			.commun-popup-short { width:900px; }
			.commun-popup-width { max-width:95%; }
			.enable-tinymce{ display:block; } .disable-tinymce{ display:none; }
			
			.class-room-messages		{ width:70%; }
			.class-room-users			{ width:30%; }
			.class-option-room-users 	{ display:block; }
			
		}
		
.button-site { margin:3px 0px 0px 0px; border:0; background:transparent; cursor:pointer; }
	.button-site::-moz-focus-inner { border:0; }
		.button-site span { display: block; }
		/* Button borders */
		.button-site span { border:1px solid rgb(128,128,128); border-radius:4px; }
		.button-site span span { border:1px solid rgb(192,192,192); border-radius:3px; }
		/* Button backgrounds */
		.button-site span { 
			background:#B82A0B;
			background-image :    -moz-linear-gradient(#B82A0B,#C8300E);
			background-image :     -ms-linear-gradient(#B82A0B,#C8300E);
			background-image :      -o-linear-gradient(#B82A0B,#C8300E);
			background-image : -webkit-linear-gradient(#B82A0B,#C8300E);
			background-image :         linear-gradient(#B82A0B,#C8300E);
			}
		.button-site span:hover { 
			background:#B82A0B;
			background-image :    -moz-linear-gradient(#B82A0B,#FF3E13);
			background-image :     -ms-linear-gradient(#B82A0B,#FF3E13);
			background-image :      -o-linear-gradient(#B82A0B,#FF3E13);
			background-image : -webkit-linear-gradient(#B82A0B,#FF3E13);
			background-image :         linear-gradient(#B82A0B,#FF3E13);
			}
		/* Button text */
		.button-site span { padding:0 7px; line-height:1.3em; font-family:Arial; font-size:1.1em; color:white; }
		.button-site span:hover { padding:0 3px; font-weight:bold; }
		.button-site a { font-size:1.1em; color:white; }
		
.button-submit-site { border:0; background:transparent; cursor:pointer; }
	.button-submit-site::-moz-focus-inner { border:0; }
		.button-submit-site span { display: block; }
		/* Button borders */
		.button-submit-site span { border:1px solid rgb(128,128,128); border-radius:4px; }
		.button-submit-site span span { border:1px solid rgb(192,192,192); border-radius:3px; }
		/* Button backgrounds */
		.button-submit-site span { 
			background:#B82A0B;
			background-image :    -moz-linear-gradient(#B82A0B,#C8300E);
			background-image :     -ms-linear-gradient(#B82A0B,#C8300E);
			background-image :      -o-linear-gradient(#B82A0B,#C8300E);
			background-image : -webkit-linear-gradient(#B82A0B,#C8300E);
			background-image :         linear-gradient(#B82A0B,#C8300E);
			}
		.button-submit-site span:hover { 
			background:#B82A0B;
			background-image :    -moz-linear-gradient(#B82A0B,#FF3E13);
			background-image :     -ms-linear-gradient(#B82A0B,#FF3E13);
			background-image :      -o-linear-gradient(#B82A0B,#FF3E13);
			background-image : -webkit-linear-gradient(#B82A0B,#FF3E13);
			background-image :         linear-gradient(#B82A0B,#FF3E13);
			}
		/* Button text */
		.button-submit-site span { padding:0 7px; line-height:1.3em; font-family:Arial; font-size:1.1em; color:white; }
		.button-submit-site span:hover { font-weight:bold; }

.button-title-site { margin:6px 0px 0px 0px; border:0; background:transparent; cursor:pointer; }
	.button-title-site::-moz-focus-inner { border:0; }
		.button-title-site span { display: block; }
		/* Button borders */
		.button-title-site span { border:1px solid rgb(128,128,128); border-radius:8px; }
		.button-title-site span span { border:1px solid rgb(192,192,192); border-radius:6px; }
		/* Button backgrounds */
		.button-title-site span { 
			background:#B82A0B;
			background-image :    -moz-linear-gradient(#B82A0B,#C8300E);
			background-image :     -ms-linear-gradient(#B82A0B,#C8300E);
			background-image :      -o-linear-gradient(#B82A0B,#C8300E);
			background-image : -webkit-linear-gradient(#B82A0B,#C8300E);
			background-image :         linear-gradient(#B82A0B,#C8300E);
			}
		.button-title-site span:hover { 
			background:#B82A0B;
			background-image :    -moz-linear-gradient(#B82A0B,#FF3E13);
			background-image :     -ms-linear-gradient(#B82A0B,#FF3E13);
			background-image :      -o-linear-gradient(#B82A0B,#FF3E13);
			background-image : -webkit-linear-gradient(#B82A0B,#FF3E13);
			background-image :         linear-gradient(#B82A0B,#FF3E13);
			}
		/* Button text */
		.button-title-site span { padding:0 10px; line-height:1.5em; font-family:Arial; font-size:1.2em; color:white; }
		.button-title-site span:hover { font-weight:bold; }

.calendarMain { font-family:"Helvetica Neue", Helvetica, Geneva, sans-serif; text-align:left; }
.calendarMain:after { content:" "; display:block; clear:both; }
/* conteneur calendrier */
.calendarMain > div { width:220px; padding:5px 10px 10px 10px; background-color:#2e373f; border-radius:10px; -moz-box-shadow:0 0 10px #555; -webkit-box-shadow:0 0 10px #555; box-shadow:0 0 10px #555; font-size:12px; }
/* bouton d'affichage*/
.calendarMain > input { display:block; height:22px; padding-top:2px; background-color:#2e373f; color:#fff; border-radius:5px; border:none; }
.calendarMain > input:hover { background-color:#2673cb; }
/* navigation dans le calendrier */
.calendarMain .calendarTitle { position:absolute; margin:7px 0 0 0; padding:0; width:220px; color:#ccc; text-align:center; }

.calendarCommun { font-family:"Helvetica Neue", Helvetica, Geneva, sans-serif; text-align:left; }
.calendarCommun:after { content:" "; display:block; clear:both; }
/* conteneur calendrier */
/* .calendarCommun > div { width:100%; padding:0px 0px 0px 0px; border-radius:10px; -moz-box-shadow:0 0 10px #555; -webkit-box-shadow:0 0 10px #555; box-shadow:0 0 10px #555; font-size:12px; } */
.calendarCommun > div { width:100%; padding:0px 0px 0px 0px; border-radius:10px; font-size:12px; }
/* bouton d'affichage*/
.calendarCommun > input { display:block; height:22px; padding-top:2px; background-color:#2e373f; color:#fff; border-radius:5px; border:none; }
.calendarCommun > input:hover { background-color:#2673cb; }
/* navigation dans le calendrier */
.calendarCommun .calendarTitle { position:absolute; margin:7px 0 0 0; padding:0; width:180px; color:black; text-align:center; }


.calendarNav input { position:relative; margin:5px 0 10px 0; width:20px; background-color:#5d6f7f; border:none; color:#fff; }
.calendarNav input:hover { background-color:#6f8598; }
.calendarNav .calendarNavMR, .calendarNav .calendarNavYR { float:right; }

/* calendrier */
.jsCalendarCommun { color:#fff; border-collapse:collapse; }
.jsCalendarCommun th { color:black; font-size:12px; font-weight:normal; text-align:center; background-color:#96C4FF; }
.jsCalendarCommun td { padding:0; border:none; width:26px; padding:3px 0 3px 0; color:black; font-weight:bold; text-decoration:none; text-align:center; }
.jsCalendarCommun .day:hover { background-color:#96C4FF; border-color:#96C4FF; }
.jsCalendarCommun .selectedDay { background-color:#D358F7; border-color:#D358F7; }

.jsCalendar { color:#fff; border-collapse:collapse; }
.jsCalendar th { color:#8ba7bf; font-size:16px; font-weight:normal; text-align:center; }
.jsCalendar td { padding:0; border:none; width:30px; padding:3px 0 3px 0; color:#fff; font-weight:bold; text-decoration:none; text-align:center; }
.jsCalendar .day:hover { background-color:#2673cb; border-color:#2673cb; }
.jsCalendar .selectedDay { background-color:#c44d38; border-color:#c44d38; }