/* Auteur : Herve Augoyat - www.ah-book.com
 Developpement sur-mesure pour SMC - Santé Mentale et Communautés à Lyon / Villeurbanne.
 Copie ou modification interdite sans l'accord ecrit de l'auteur. */

#load {display: none}
.H #load {display:block; width:50px; height:auto; /*height:12.5px*/ position:fixed; z-index:1001; top:50%; margin-top:-6px; left:50%; margin-left:-25px;}

html {font-size: 100%; height:100%; width:100%; -webkit-font-smoothing: antialiased;text-rendering: optimizeLegibility;overscroll-behavior: none;
position: relative}

/*
@media screen and (-webkit-min-device-pixel-ratio:0)
and (min-resolution:.001dpcm) {
  img { image-rendering: -webkit-optimize-contrast !important; }
}

 Unset for Safari 11+
@media not all and (min-resolution:.001dpcm)
{ @supports (-webkit-appearance:none) and (stroke-color:transparent) {
  img { image-rendering: unset !important; }
}} */


/* kumbh-sans-300 - latin */
@font-face { 
  font-family: 'fut';
  font-style: normal;
  font-weight: 300;
  src: url('../Fontes/kumbh-sans-v12-latin-300.eot'); /* IE9 Compat Modes */
  src: local(''),
	   url('../Fontes/kumbh-sans-v12-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../Fontes/kumbh-sans-v12-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
       url('../Fontes/kumbh-sans-v12-latin-300.woff') format('woff'), /* Modern Browsers */
       url('../Fontes/kumbh-sans-v12-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../Fontes/kumbh-sans-v12-latin-300.svg#KumbhSans') format('svg'); /* Legacy iOS */
}

/* kumbh-sans-regular - latin */
@font-face {
  font-family: 'fut';
  font-style: normal;
  font-weight: 400;
  src: url('../Fontes/kumbh-sans-v12-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
	   url('../Fontes/kumbh-sans-v12-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../Fontes/kumbh-sans-v12-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../Fontes/kumbh-sans-v12-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../Fontes/kumbh-sans-v12-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../Fontes/kumbh-sans-v12-latin-regular.svg#KumbhSans') format('svg'); /* Legacy iOS */
}

@font-face {
  font-family: 'fut';
  font-style: normal;
  font-weight: 500;
  src: url('../Fontes/kumbh-sans-v12-latin-500.eot'); /* IE9 Compat Modes */
  src: local(''),
	   url('../Fontes/kumbh-sans-v12-latin-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../Fontes/kumbh-sans-v12-latin-500.woff2') format('woff2'), /* Super Modern Browsers */
       url('../Fontes/kumbh-sans-v12-latin-500.woff') format('woff'), /* Modern Browsers */
       url('../Fontes/kumbh-sans-v12-latin-500.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../Fontes/kumbh-sans-v12-latin-500.svg#KumbhSans') format('svg'); /* Legacy iOS */
}

@font-face {
  font-family: 'fut';
  font-style: normal;
  font-weight: 600;
  src: url('../Fontes/kumbh-sans-v12-latin-600.eot'); /* IE9 Compat Modes */
  src: local(''),
	   url('../Fontes/kumbh-sans-v12-latin-600.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../Fontes/kumbh-sans-v12-latin-600.woff2') format('woff2'), /* Super Modern Browsers */
       url('../Fontes/kumbh-sans-v12-latin-600.woff') format('woff'), /* Modern Browsers */
       url('../Fontes/kumbh-sans-v12-latin-600.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../Fontes/kumbh-sans-v12-latin-600.svg#KumbhSans') format('svg'); /* Legacy iOS */
}

/*   -------------------------  */


/* source-sans-3-300 - latin */
@font-face {
  font-family: 'tre';
  font-style: normal;
  font-weight: 300;
  src: url('../Fontes/source-sans-3-v8-latin-300.eot'); /* IE9 Compat Modes */
  src: url('../Fontes/source-sans-3-v8-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../Fontes/source-sans-3-v8-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
       url('../Fontes/source-sans-3-v8-latin-300.woff') format('woff'), /* Modern Browsers */
       url('../Fontes/source-sans-3-v8-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../Fontes/source-sans-3-v8-latin-300.svg#SourceSans3') format('svg'); /* Legacy iOS */
}

/* source-sans-3-regular - latin */
@font-face {
  font-family: 'tre';
  font-style: normal;
  font-weight: 400;
  src: url('../Fontes/source-sans-3-v8-latin-regular.eot'); /* IE9 Compat Modes */
  src: url('../Fontes/source-sans-3-v8-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../Fontes/source-sans-3-v8-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../Fontes/source-sans-3-v8-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../Fontes/source-sans-3-v8-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../Fontes/source-sans-3-v8-latin-regular.svg#SourceSans3') format('svg'); /* Legacy iOS */
}

/* source-sans-3-500 - latin */
@font-face {
  font-family: 'tre';
  font-style: normal;
  font-weight: 500;
  src: url('../Fontes/source-sans-3-v8-latin-500.eot'); /* IE9 Compat Modes */
  src: url('../Fontes/source-sans-3-v8-latin-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../Fontes/source-sans-3-v8-latin-500.woff2') format('woff2'), /* Super Modern Browsers */
       url('../Fontes/source-sans-3-v8-latin-500.woff') format('woff'), /* Modern Browsers */
       url('../Fontes/source-sans-3-v8-latin-500.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../Fontes/source-sans-3-v8-latin-500.svg#SourceSans3') format('svg'); /* Legacy iOS */
}

/* source-sans-3-600 - latin */
@font-face {
  font-family: 'tre';
  font-style: normal;
  font-weight: 600;
  src: url('../Fontes/source-sans-3-v8-latin-600.eot'); /* IE9 Compat Modes */
  src: url('../Fontes/source-sans-3-v8-latin-600.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../Fontes/source-sans-3-v8-latin-600.woff2') format('woff2'), /* Super Modern Browsers */
       url('../Fontes/source-sans-3-v8-latin-600.woff') format('woff'), /* Modern Browsers */
       url('../Fontes/source-sans-3-v8-latin-600.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../Fontes/source-sans-3-v8-latin-600.svg#SourceSans3') format('svg'); /* Legacy iOS */
}






body {font-size:1em; background-color:#ffffff; margin:0; width: 100%; height:100%; position: relative; 
	font-family:'fut', Arial, Verdana, Helvetica, sans-serif; 
	-webkit-user-select: none; -moz-user-select: none;  -khtml-user-select: none; -ms-user-select: none; font-variant-ligatures: no-common-ligatures;}

* { outline: none;}
.ret, .retourligne {clear:both; width:0; height:0; line-height:0; margin:0; padding:0; float:none}
.retMob { display: none}

img {display:block}
a img {border:none}
a {outline:none; border:none; text-decoration:none}
ul, li {margin:0; padding:0; list-style:none}
h1, h2, h3, h4 {padding:0; margin:0; font-size:1em; font-weight:normal; line-height:1.1em}
sup {font-size: 0.55em; line-height: 1em}
/*::-moz-selection, ::selection { background:#00949a}*/
#testeur {position:fixed; z-index:9999; bottom:0; left:0; padding:7px; font-size:0.7em; letter-spacing:0.1em; display:inline-block; font-family: sans-serif; color:#FFF; opacity:0.5; background-color: #000000; display: none}


/*
#affichette {position:fixed; top:50%; left:50%; width:822px; height:512px; margin-left:-411px; margin-top:-256px; z-index:9999; visibility:hidden; cursor:pointer}
#extaffichette {position:fixed; top:0; left:0; width:100%; height:100%; background-color: rgba(38, 38, 38, 0.8); z-index:9998; visibility:hidden; cursor:pointer}
#croix {position:fixed; top:50%; left:50%; margin-left:421px; margin-top:-296px; width:31px; height:31px; z-index:9999; visibility:hidden; cursor:pointer}
#hommage {width:450px; height:128px; position:fixed; bottom:20px; right:20px; z-index:9999; visibility:hidden; cursor:pointer; display:block; border:5px solid #FFF}*/


#btmenu {display: none} 
#MOB {display:none}
#MOB2 {display:none} 
#MOB3 {display: none}

#logoHaut {display: none}
	.H #logoHaut {display: none}
	#logoHaut img {display: none}

.calExt{} .cal {position: absolute; top:0; left:0; width: 100%}
.H .cal {width: auto; height: auto}

.calExt2{} .cal2 {position: absolute; top:0; left:0; width: 100%}
.H .cal2 {width: auto; height: auto}

#remonte {width:46px; height:46px; background-color:#fff; position:fixed; bottom:0px; left:0; z-index:950; 
		visibility:hidden; overflow:hidden; cursor:pointer}
		#remonte img {width:22px; position:absolute; top:50%; left:50%; margin-left:-11px; margin-top:-11px; display:block;transform-origin: 50% 50%;}
.H #remonte {visibility: hidden}


.H .ano0 {visibility: hidden}
.H .anSX0 {visibility: hidden; transform-origin:0 0 }
.H .anSX1 {transform-origin:0 0 }
.H .ans1 {visibility: hidden; transform-origin:50% 50% }
.contextimg {overflow: hidden}
.H .any1, .H .any2, .H .any3 {visibility: hidden; transform-origin: 50% 50% }
.H .anys1 {visibility: hidden; transform-origin: 50% 50% }
.H .anScale {transform-origin:50% 50% }



#page {width:100%; height: auto; position:relative}
.largeurInt01{width:78%; max-width: 1560px; margin-left:auto; margin-right: auto; position: relative}
@media screen and (max-width: 1950px) {
	.largeurInt01 {width:82%; margin-left:15%; margin-right:0; }
}


#entete {width: 100%;position:relative; height: 180px}
#logo {width:178px; height: auto; display: block; position:relative; padding-top:40px; z-index:100}
.H #logo {visibility:hidden}
	#logo img {width:100%; display:block}
	

#menu-haut {width:auto; position:absolute; top:0; right:25%; z-index:201}
	#menu-haut ul {float:right; list-style:none; margin:0; padding:0; }
	#menu-haut li {float:left; display:inline-block; margin-left:20px}
	#menu-haut li a {padding-left:1em; line-height: 1.2em; font-size:0.9em; letter-spacing:0.025em; font-family:'tre', Arial, Helvetica, sans-serif; color:#4a4a4a; text-decoration:none; padding-top:1.2em; padding-bottom:1.2em; display: inline-block; position: relative}
	#menu-haut li a img {position: absolute; top: 50%; width: 0.4em; margin-top: -0.2em; left:0}
	#menu-haut li a.menuhaut-actif {color:#449bb5}
	.H #menu-haut li a {visibility:hidden}

#menu {width:auto; position:relative}
.H #menu {width:auto; position:absolute; top:79px; right:25%;z-index: 300}
	#menu ul {float:right; list-style:none; margin:0; padding:0;}
	#menu .lm {float:left; display:inline-block; margin-left:37px}
	#menu .am {font-size:1.25em; color:#404040; text-decoration:none; z-index:9002; position:relative;line-height: 1.2em;
					font-family:'tre', Arial, Verdana, Helvetica, sans-serif; text-transform:uppercase; letter-spacing:0.015em; padding: 0.5em 0;
					font-weight: 500; display: inline-block; cursor: pointer}
	#menu #m0, #menu #m1, #menu #m2, #menu #m3 {padding-right:1.1em}
	#menu .am img { position: absolute; right: 0; top:50%; width:0.6em; margin-top: -0.3em; transform-origin: 50% 50%}
	.H #menu .am { visibility: hidden}

.sousmenu { position: relative; background-color: #2c7aa2; border-radius: 10px; padding-left:2em; padding-right:2em; 
			padding-top:1.2em; padding-bottom:1.2em; z-index: 500; box-shadow: 1px 1px 18px rgba(0, 0, 0, 0.09); font-size: 1.3em}
	@media screen and (max-width: 2100px) {   .sousmenu { font-size: 1em}   }
		.H .sousmenu {position: absolute; top:0; left:0; background-color: #2c7aa2; border-radius: 10px; padding-left:2.5em; padding-right:2.5em; 
			padding-top:1.2em; padding-bottom:1.2em; z-index: 500; display: none}
			.sousmenu li {display: block; float: none; margin: 0; padding: 0; border-bottom: 1px solid #7eaec6}
			.sousmenu .sansBord {border-bottom: none}
			.sousmenu li a {display:block; padding:0; font-size:1.1em; font-weight:300; color:#fff; cursor: pointer; 
					line-height: 1.2em; padding-right:15px; margin:0; position: relative; overflow: hidden}
			.sousmenu li a img  {width: 0.4em; position: absolute; top:50%; margin-top: -0.2em; left:0; transform-origin: 50% 50%}
			.sousmenu li a span {font-weight: 400; font-size: 1em; padding-top: 0.7em; padding-bottom: 0.7em; padding-left: 1.2em; display: block; position: relative; z-index: 501}
			.H .sousmenu li a b {position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #fff; z-index: 500; 
				transform-origin: 0 0;}
			
			.sousmenu li a.sousmactif {color:#18264c}

#menufond { background-color: rgba(68, 155, 181, 0.25); height:6px; width:100%; position:absolute; top:126px; z-index:199; visibility: hidden;
	right: 0; transform-origin: 100% 100%}
#menu-actif {background-color:#449bb5; height:6px; width:0px; right:0; position:absolute; top:126px; z-index:200}


.H #b0 {width:24%; height:180px; background-color:#449bb5; position:absolute; top:0; left:50%; margin-left: -24%; z-index:10; transform-origin: 0 0}

#entete.enteteMosaique {width: 100%;position:relative; height: 220px; overflow: visible}
.H #b0.b0Mosaique {width:24%; height:220px; background-color:#449bb5; position:absolute; top:0; left:50%; margin-left: -24%; z-index:10; transform-origin: 0 0}

/* fin entete */

#contenu, #contenuMosaique {width:63%; color:#ffffff; position:relative; z-index:65; background-color:#727786; float: left}
.H #contenu {background:none}
#contenuMosaique {background:none}
	#contenuIntaccueil {padding-top:3.5em; padding-left: 5em; padding-bottom:4.5em; display: block}
	#contenu h1 {font-size:2.3em; width:95%; display:block;font-weight:300; position: relative; z-index: 12; display: block; line-height: 1.7em}
	#contenu h1.h1interieur {font-size:2.3em; width:95%; display:block;font-weight:300; position: relative; z-index: 12; display: block; line-height: 1.4em} 
	#contenu h1 strong {font-weight:300}
	#contenu .h1petit {font-size:2.3em; line-height: 1.5em; width:95%}
	#contenu h2 {font-size:1.2em; display:block;font-weight:400; width:95%; position: relative; z-index: 12; display: block; line-height: 1.5em}
	/*#contenu h1 {font-size:2.5em; display:block;font-weight:300; position: relative; z-index: 12; display: block}*/
	#contenu p {font-size:1.4em; width:80%; text-align:left; line-height:1.7em; display:block; margin-top:1em; padding: 0; font-weight: 300; position: relative; z-index: 12}
	#contenu p strong {text-transform:uppercase; font-weight: 400; letter-spacing: 0.05em}

#contenu a {color:#FFFFFF; font-size:1em; background-image:url(../Images/fl1-blanc.png); background-size: 0.45em; background-repeat:no-repeat; background-position:0 0.6em; padding:0 0 0 1.1em; display: inline-block}
			#contenu a:hover {text-decoration:none; color:#CCCCCC}

#contenu a.lieninterieurcontenu {display: inline;color:#D8E8EC; text-decoration: underline; background: none; padding: 0}
#contenu a.lieninterieurcontenu:hover {display: inline;color:#B1C1CF; text-decoration:none; background: none; padding: 0}

#contenu ul {position: relative; z-index: 12}
	#contenu ul.ulmini li {background-image:url(../Images/fl1-blanc.png); background-repeat:no-repeat; background-position:0 0.7em; padding:0 0 0 1.2em; margin:0.8em 0 0 0; background-size: 0.4em; color:#fff}
			#contenu ul.ulmini li a {background:none; padding:0; font-size:1.4em; color:#fff}


	#contenuInterieur {padding-top:2em; padding-left:3em; padding-bottom:3em; display: block}


#contenu-fond {width:100%; height: 100%; background-color:#727786; position:absolute; top:0; right:0; z-index:10; transform-origin: 100% 0}
#b1 {width:368px; height:368px; background-color:#449bb5; position:absolute; top:0; right:0; z-index:11; transform-origin: 0 0}
#b1.coul0A {background-color: #763b65}
#b1.coul0B {background-color: #313769}

.H #contenu-fond, .H #contenu h1, .H #contenu h2, .H #contenu ul, .H #contenu p, .H #b1, .H #b0 { visibility: hidden}



#page #visu {width:37%; height:368px; position:relative;  z-index:10; overflow:hidden; float: left}
.H #page #visu {visibility: hidden}
	#page #visu img {width:auto; display: block}

#suitecontenuaccueil {width: 48%; padding-top: 2em; padding-left: 5em}
#suitecontenuaccueil p {font-size: 1.4em; color:#474458; line-height: 1.9em}

#suitecontenuaccueil p .annonceAccueil {margin:25px 0 0 0; padding:13px 30px 2px 0; font-size:1.2em; text-transform:none; color:#383e50; font-family:'tre', Arial, Verdana, Helvetica, sans-serif; background:none; line-height: 1.6em; position: relative; display:block}
.annonceAccueil .traitAcc {background-color: #449bb5; width:40px; height:2px; position: absolute; top: 0; left: 0}

#suitecontenuaccueil p a.pdf { background-image:url(../Images/icoPDF.png); background-position:0 0.3em; background-repeat:no-repeat; padding:0 0 0 1.9em; display:inline-block; background-size: 1.1em; display: inline-block; color:#383e50; margin-top:1em; margin-bottom: 1em; text-decoration: underline}
#suitecontenuaccueil p a.pdf:hover { text-decoration: none}


#Partenaires {width:54%; margin: 0; padding-top:2.5em; padding-bottom:6.5em; padding-left: 5em}
#Partenaires li {width: 30%; margin-right: 1.5%; margin-bottom: 1.5em; float: left}
#Partenaires li.ret {clear:both; width:0; height:0; line-height:0; margin:0; padding:0; float:none}
#Partenaires li a {display: block; width: 100%}
#Partenaires li a img {width: 100%; display: block}


#page #bas {background-color:#449bb5; width:100%; position:relative; padding-bottom:5em; padding-top: 1em; z-index:300}
#bas-int #logobas {width:178px; float:left; display:block; margin:27px 6em 0 0}
#bas-int #logobas img {width: 100%; display: block}
#bas-int .rubfoot { display: inline-block; float:left; width: 240px; margin:37px 4em 0 0; color:#FFFFFF}
	 #bas-int .rubfoot span {font-size:1.25em; display:block; border-bottom:1px #ffffff solid; padding:0 0 6px 0; margin-bottom:17px; font-family:'tre', Arial, Verdana, Helvetica, sans-serif; letter-spacing:0.025em; line-height: 1.8em; font-weight: 500}
	#bas-int .rubfoot ul {margin:0; padding:0; list-style:none}
	#bas-int .rubfoot ul li {margin:0; font-family:'fut', Arial, Verdana, Helvetica, sans-serif; }
	#bas-int .rubfoot ul li a {color:#FFFFFF; text-decoration:none; position: relative; font-size: 1em; font-weight: 400;line-height: 1.5em; display: block; margin-bottom: 0.2em; padding: 0.2em 0 0.2em 1.2em}
	#bas-int .rubfoot ul li a img {position: absolute; top:0.8em; width: 0.4em; left:0;  display: block}



#page #pagetype {display:none}	



/*Pages intérieurs*/



#retourDispositif {position:absolute; top:140px; z-index:260; width:250px; left:50%; margin-left:-40px; background-image:url(../Images/fl1.png); background-size: 0.4em; color:#2d82ac; font-family:'tre', Arial, Verdana, Helvetica, sans-serif;; font-size:1.05em; padding:0 0 0 10px; background-position:0 8px; background-repeat:no-repeat; display:none; font-weight: 500}
#retourDispositif:hover {color:#17678e; text-decoration:none}
	
#sousmenu-dispositifs {font-family:'fut', Arial, Verdana, Helvetica, sans-serif; width: 100%; text-align: right}
	#sousmenu-dispositifs a { display:inline-block; background-image:url(../Images/fl1.png); color:#448cb5; font-size:0.95em; font-weight:bold; padding:0.6em 0 0.6em 1.1em; margin-right:2.5em; background-position:0 50%; background-repeat:no-repeat; background-size: 0.4em; letter-spacing:0.02em}
	#sousmenu-dispositifs a:hover {color:#17678e; text-decoration:none}
	

/* MosaiqueNew */ 

#mosaiqueNew {/*width:75%;*/ width:100%; position:relative;  z-index:300;padding:0 0 10em 0; min-height: 25em}
	#mosaiqueNew ul {margin:0; list-style:none; padding:0}
	#mosaiqueNew .mosa {margin:0; list-style:none; padding:0; display: block; /* width:20%;*/ width: 15%; float: left; margin-right: 1px; margin-bottom: 1px; position: relative; z-index: 300}
	#mosaiqueNew li.retA, #mosaiqueNew li.ret {clear:both; width:0; height:0; line-height:0; margin:0; padding:0; float:none}
	
	#mosaiqueNew li a {display: block; position: relative; width: 100%; z-index: 10; overflow: hidden}
	#mosaiqueNew li img {width: 100%; display: block; position: relative; z-index: 10; transform-origin: 50% 50%}
	#mosaiqueNew li div {position: absolute; top:0; right:0;  width: 4em; height: 4em; background-color: #2C71BB; z-index: 13; visibility: hidden; transform-origin: 50% 50%}
	#mosaiqueNew li div img {width:100%; height: 100%; z-index: 14; visibility: hidden; transform-origin: 50% 50%}
	
#mosaiqueNew li a .pbase { position: absolute; top:0; left:0; background-color: #2C71BB; z-index: 20; color:#fff; padding: 3em; }
.H #mosaiqueNew li a .pbase {display: none}
.H #mosaiqueNew li {visibility: hidden}


#bdroite {width:37%; height:358px; position:absolute; top:-20px; right:0; z-index:1; background-color:#2f98bf; visibility: hidden; transform-origin: 100% 100%}
#bgauche {width:500px; height:500px; position:absolute; top:400px; left:-200px; z-index:289; background-color:#2f98bf; visibility: hidden; transform-origin: 0 0}


	
	#article {width:100%; margin-top:4em;  padding-bottom: 8em}
		#article #articleCont {float:left; width:48%; padding-left:3em; margin-right:4em; font-size: 1.1em;
			-webkit-user-select:text; -moz-user-select:text;  -khtml-user-select:text; -ms-user-select:text}
			#articleCont h2 {margin:25px 0 0 0; padding:7px 30px 13px 55px; font-size:1.7em; text-transform:uppercase; color:#474644; font-family:'tre', Arial, Verdana, Helvetica, sans-serif; background-image:url(../Images/fl3.png); background-repeat:no-repeat; background-position:0px 0px;
			font-weight: 500; background-size: 1.8em;}
			#articleCont .h2perso {margin:35px 0 0 0; padding:7px 0 13px 2.4em; font-size:1.7em; text-transform:none; color:#474644; font-family:'tre', Arial, Verdana, Helvetica, sans-serif; background-image:url(../Images/fl4.png); background-size: 2em; 
				background-repeat:no-repeat; background-position:0px 0px}
			#articleCont h3 {margin:26px 0 0 0; padding:0.05em 30px 0 2em; font-size:1.4em; text-transform:uppercase; color:#474644; font-family:'tre', Arial, Verdana, Helvetica, sans-serif;background-image:url(../Images/fl2.png); background-repeat:no-repeat; background-position:0px 0px;
			font-weight: 500; background-size: 1.5em; line-height: 1.5em}
			#articleCont .h3lignes {margin:30px 0 0 0; padding:5px 0 7px 42px; font-size:1.2em; text-transform:uppercase; color:#474644; font-family:'tre', Arial, Verdana, Helvetica, sans-serif; background-image:url(../Images/icone2.gif); background-repeat:no-repeat; background-position:0px 8px;}
			#articleCont .h2sansmarge {margin:0;}
			#articleCont .h2lignes {background-position:0 10px; font-size:1.2em}
			#articleCont .h2lignesGd {background-position:0 10px; font-size:1.7em; line-height: 1.4em; text-transform: none}

			#articleCont .h2texteseul {margin:25px 0 0 0; padding:13px 30px 2px 0; font-size:1.7em; text-transform:none; color:#383e50; font-family:'tre', Arial, Verdana, Helvetica, sans-serif;background:none; line-height: 1.6em; position: relative}
			
			#articleCont .h3texteseul {margin:25px 0 0 0; padding:13px 30px 2px 0; font-size:1.4em; text-transform:none; color:#383e50; font-family:'tre', Arial, Verdana, Helvetica, sans-serif;background:none; line-height: 1.6em; position: relative}
				
			#articleCont .h2texteseul .traittitre {background-color: #449bb5; width:40px; height: 3px; position: absolute; top: 0; left: 0}
			#articleCont .h3texteseul .traittitre {background-color: #449bb5; width:40px; height: 2px; position: absolute; top: 0; left: 0}

			#articleCont p {font-size:1.05em; color:#373735; line-height:1.75em; width:100%; text-align:left; margin-top:15px; font-weight:400}
			#articleCont .ppetit {font-size:1em}
			#articleCont .pmini {font-size:0.9em}
			#articleCont p .imggauche {float:left; margin:0 20px 5px 0}
			#articleCont ul {margin:0 40px 0 10px; padding:0; list-style:none; font-size:1.05em; line-height: 1.5em}
			#articleCont .ulpetit {margin:0 40px 0 24px; padding:0; list-style:none; font-size:0.95em; }
			#articleCont ul li {margin:15px 0 0 0; padding:0 0 0 17px; background-image:url(../Images/fl1.png); background-repeat:no-repeat; background-position:0 0.5em; background-size:0.55em; color:#2b2b2a; text-align:left; display:block}
			#articleCont .ulpetit2 {margin:0 40px 0 24px; padding:0; list-style:none; font-size:0.9em; }
			#articleCont .ulpetit2 li {margin:16px 0 0 0; padding:0 0 0 20px; background-image:url(../Images/fl1.png); background-repeat:no-repeat; background-position:0 6px; color:#2b2b2a; text-align:left; display:block}
			
			#articleCont h2 sup {text-transform:lowercase}
				
				#articleCont .textgras{font-weight:bold}
			#articleCont ul ul {font-size:0.9em; padding:5px 0 20px 0; margin:0 25px 0 25px}
			#articleCont a {color:#373735; text-decoration:underline}
			#articleCont a:hover {color:#2d82ac; text-decoration:none}
			
			#articleCont .imageplein {width: 100%; display: block; margin: 1.5em 0}
			#articleCont .imagevignette {width:20%; display: block; margin: 1.5em 0}

			#articleCont ul.listeValider { margin: 0; padding: 0; display: block}
			#articleCont ul.listeValider li { display: block; position: relative; font-size:1.15em; padding:0.5em 0 0.5em 2em; background: none; margin: 0; color:#383e50}	
			#articleCont ul.listeValider li strong {color:#0f4a87}
			#articleCont ul.listeValider li img {position: absolute; top: 0.3em; left: 0; width: 1.5em; display: block}


			#articleCont ul.listelogos2 { margin:2em 0; padding: 0; display: block}
			#articleCont ul.listelogos2 li {margin:0; padding: 0; float: left; width:45%; margin-right: 5%; background:none; display: block}
				#articleCont ul.listelogos2 li.ret {clear: both; width:0; height:0; line-height:0; margin:0; padding:0; float:none}
			#articleCont ul.listelogos2 li img {width:100%; display: block}


			#articleCont #liste-publications {margin:0 0 50px 0; padding:0; list-style:none; background:none; font-size:1em}
				#articleCont #liste-publications li {/*width:165px;*/ width:26%; float:left; display:block; margin:1.5em 6% 1.5em 0; background:none; padding:0; text-align:left}
				#articleCont #liste-publications .retourligne {width:0px; height:0; line-height:0px; font-size:0px; clear:both; margin:0; padding:0; float:none}
					#articleCont #liste-publications li a {text-decoration:none; display:block; width: 100%} 
					#articleCont #liste-publications li a:hover .details {color:#0f4a87} 
					#articleCont #liste-publications li a:hover img {display:block; border:1px solid #707070}
					#articleCont #liste-publications li a:hover .titre {color:#0f4a87;}
					
					#articleCont #liste-publications li a img {display:block; border:1px solid #a0a0a0; width: 100%}
					#articleCont #liste-publications li a span {display:block}
					#articleCont #liste-publications li a .titre {margin:8px 0 0 0; text-decoration:none; font-size:0.95em; letter-spacing:normal}
					#articleCont #liste-publications li a .details {margin:5px 0 0 0; padding:0 0 0 10px; font-size:0.8em; background-image:url(../Images/fl1-plein.png); background-size: 0.4em; background-repeat:no-repeat; background-position:0 45%; font-family:'tre', Arial, Verdana, Helvetica, sans-serif; color:#2d82ac; text-decoration:underline; line-height: 1.3em}
			
			#articleCont .souligne {text-decoration:underline}
			#articleCont .spanpetit {font-size:0.95em}
			#articleCont .spancouleur1 {color:#0f4a87}
#articleCont .spancouleur2 {color:#4472c4}
#articleCont .spancouleur3 {color:#c00000}
			#article .pdf { background-image:url(../Images/icoPDF.png); background-position:top right; background-repeat:no-repeat; padding:0 35px 10px 0; margin:0 10px 0 0; display:inline-block; background-size: 1.4em}
			#article .doc { background-image:url(../Images/icoDOC.png); background-position:top right; background-repeat:no-repeat; padding:0 35px 10px 0; margin:0 10px 0 0; display:inline-block; background-size: 1.4em}
			
			#article figure {width: 100%;margin:0 0 1.8em 0; padding: 0; display: block}
			#article figcaption {display: block}
			#article audio {width: 100%; border-radius: 5em; margin:0; padding: 0; display: block}
		
				

			#articleCont .servicesPlus {width:100%;}
				#articleCont .depliA {font-weight:400; color:#3f7da0; font-size: 1em; padding:1em 0; border-top:1px solid #b6d7e2; position: relative; display: block; width:50%; line-height: 1.4em; cursor: pointer; z-index: 30;}
				#articleCont .depliAder {border-bottom:1px solid #4d94ac}
					#articleCont .depliA span {display:block; margin-right: 3em; margin-left:0; letter-spacing: 0.025em}
					#articleCont .depliA .cerclePlus2 {width:0.9em;position: absolute; display: block; top:1.4em; right: 0; border:1px solid #fff; border-radius: 50%; transform-origin: 50% 50%}
					#articleCont .depliA .cerclePlus2 img {display: block; width: 100%; transform-origin: 50% 50%}

				#articleCont .depliB {padding-top:1em; padding-bottom: 3em; position: relative; z-index: 20; width:100%; font-size: 1em; line-height:1.8em; color:#393939}
				.H #articleCont .depliB {display: none}
					/*#articleCont .depliB p {margin: 0; padding: 0; display: block}
					#articleCont .depliB p strong, #articleCont .depliB li strong {color:#000; font-weight: 500}
					#articleCont .depliB ul {margin:0; padding: 0; display: block; margin-bottom: 1.5em}
					#articleCont .depliB li { padding-left:1.1em; background-image: url("../Images/fl22.png"); background-repeat: no-repeat; background-size: 0.45em; 
						background-position: 0 0.7em}
					#articleCont .depliB li a {color:#009de2; font-weight: 500}*/

			

		#article #articleInfos {float:left; width:307px; padding-left:2em; padding-bottom:20px; border-left: 5px solid #deedf0; margin-top:3em;
-webkit-user-select:text; -moz-user-select:text;  -khtml-user-select:text; -ms-user-select:text}
			#article #articleInfos h3 {margin:0px 0 0 0; padding:0 0 0.2em 0; font-size:1.4em; color:#148d9b; text-transform:uppercase; 
										font-family:'tre', Arial, Verdana, Helvetica, sans-serif; letter-spacing:0.1em}
			#article #articleInfos ul {margin:0; padding:0 0 3em 0; list-style:none;}
			#article #articleInfos ul li {padding:0 0 0 12px; margin:13px 0 0 0; background-image:url(../Images/fl1.png); background-repeat:no-repeat; background-position:0px 7px; color:#474644; font-family:'tre', Arial, Verdana, Helvetica, sans-serif; font-size:1em; background-size: 0.45em}
			#article #articleInfos ul li span {color:#666666; font-size:0.9em}
			#article #articleInfos .gras li { line-height:1.4em; font-size:1.05em; padding:0 0 0 12px; margin:8px 0 0 0; background-image:url(../Images/fl1.png); background-repeat:no-repeat; background-position:0 7px; color:#474644; background-size: 0.45em}
			#article #articleInfos .gras li .spanpetit {font-size:0.9em; font-weight:normal; color:#5d5c5a; font-family:'tre', Arial, Verdana, Helvetica, sans-serif;}
			
			#article #articleInfos ul li a {text-decoration:underline; color:#5d5c5a;} #article #articleInfos ul li a:hover {color:#3e3d3b; text-decoration:none}
			#article #articleInfos #listeInfos-publications {padding-bottom:25px}
			#article #articleInfos #listeInfos-publications li {margin:4px 0 0 0}
			#article #articleInfos #listeInfos-publications li a {color:#666666; font-size:0.9em; text-decoration:none}
			#article #articleInfos #listeInfos-publications li a:hover {color:#333333; text-decoration:underline}
			
			#article #articleInfos #listeActu li {margin:4px 0 0 0}
			#article #articleInfos #listeActu li a {color:#333333; font-size:0.9em; text-decoration:underline}
			#article #articleInfos #listeActu li a:hover {color:#666666; text-decoration:none}
			#article #articleInfos .pactu {font-size:0.95em; text-align:justify}
			
			#article #articleInfos h2 {margin:1.5em 0 0 0; padding:0; font-size:1.5em; color:#2B3237; font-family:'tre', Arial, Verdana, Helvetica, sans-serif;}
			#article #articleInfos h2 .soustitremini {font-size: 0.9em; padding: 0.4em 0; display: block; color:#54575A}
			#article #articleInfos p {margin:1.5em 0 3em 0; color:#5d5c5a; font-size:1.1em}
			#article #articleInfos p a {text-decoration:underline; color:#5d5c5a;} #article #articleInfos p a:hover {color:#3e3d3b; text-decoration:none}
			
			#articleInfos img {margin:0 0 2em 0; width: 100%; display: block}
			#articleInfos #carte {width:100%; height:auto; position:relative; margin-top:1em;}
				#articleInfos #carte #zoom {position:absolute; top:0; right:0; height:46px; width:46px; z-index:223; background-color:#449bb5}
					#articleInfos #carte #zoom img {width: 100%; display: block}
				#articleInfos #carte #carteimg {position:relative; z-index:222; width:100%; height:auto}
					
#page #fondint {width:100px; height:1000px; position:absolute; top:196px; right:0; z-index:3; background-color:#2f98bf; display:none}



/*formulaire #formdon */
#formdon { width:100%; padding:2em 0 0 0; margin:0; border:none; -moz-user-select: -moz-none; -khtml-user-select: none; -webkit-user-select: none; -o-user-select: none; user-select: none}
#formdon fieldset { width: 100%; text-align: left; border:none; margin:0; padding:0 0 1.5em 0;font-family:'tre', Arial, Verdana, Helvetica, sans-serif; font-weight:normal}

#formdon input[type="radio"] {display: none;}
	#formdon input[type="radio"] + label { color: #2d82ac; font-size: 1.3em; cursor: pointer; user-select: none; padding-left: 1.5em; padding-right: 1.5em; position:relative; padding-bottom:0.5em; padding-top:3em; display:block; float:left; margin-right:0.6em; border-radius:6px;background-color:#e1edf3; border:1px solid #dee4e6; margin-bottom:0.7em;}
	#formdon input[type="radio"] + label:before { transition: all 200ms cubic-bezier(.4,.25,.3,1); content: ""; width: 20px; height: 20px; border-radius: 50%; background-color:#fff; border: 2px solid #2d82ac; font-size: 0; position: absolute; bottom: 60%; left: 50%; transform: translate(-50%, 50%);}
	#formdon input[type="radio"] + label:after { transition: all 200ms cubic-bezier(.4,.25,.3,1); content: ""; width: 0; height: 0; border-radius: 50%; background-color:#2d82ac; position: absolute; bottom: 60%; left: 50%; transform: translate(-50%, 50%); }
	#formdon input[type="radio"]:checked + label:before { background-color: transparent; width: 30px; height: 30px; border-width: 2px; }
	#formdon input[type="radio"]:checked + label:after { width: 20px; height: 20px; }

	#formdon .labellibre {font-family:'tre', Arial, Verdana, Helvetica, sans-serif; font-weight:normal; display:inline-block; font-size:1.5em; color: #2d82ac; letter-spacing:0.04em}
	#formdon .choixlibre {width:6em; background-color:#e1edf3; border:1px solid #dee4e6; border:none; border-radius:6px; display:inline-block; color: #2d82ac; font-size:1.3em; margin-left:1em; padding: 0.8em 1.4em; letter-spacing:0.06em}
	#formdon .euro {	font-family:'tre', Arial, Verdana, Helvetica, sans-serif; font-weight:normal; display:inline-block; font-size:1.5em; color: #2d82ac; padding-left:0.3em}
	
	#formdon #estimation {color:#777777; font-size:1.1em; display:block; margin:20px 0 15px 0; line-height:1.7em}
		#formdon #estimation i {font-style:normal}
	
	#formdon .envoyerreduit {width:68%}

	#formdon #envoyer {font-family: 'fut', Arial, Helvetica, sans-serif; color:#fff; text-transform:uppercase; background-color: rgb(68, 155, 181); border-radius:8px;display:block; border:none;  padding:0.9em 0 0.9em 14%; width:100%; font-size:1.1em; background-image:url(../Images/trait.gif); background-repeat:no-repeat; background-position:6% 50%;  background-size:5%; line-height:1.2em; letter-spacing:0.2em; margin:2.2em 0 1.3em 0; cursor:pointer; text-align:left; font-weight:400; }



/*@media screen and (max-height:730px) , screen and (max-width: 1750px) {*/
@media screen and (max-width: 1750px) {
.H #load {width:40px; /*height:10px*/margin-top:-5px; margin-left:-20px;}
#remonte {width:37px; height:37px}
	#remonte img {width:16px; margin-left:-8px; margin-top:-8px}
body {font-size: 0.8em}
	/*.largeurInt01 {width:82%; margin-left:15%; margin-right:0; }*/
#entete {height: 144px}
#logo {width:142px; padding-top:32px}
	#bas-int #logobas {width:142px}
.H #menu {top:63px}
	#menu .lm {margin-left:29px}
#menufond {height:5px;top:100px }
#menu-actif {height:5px; top:100px}
#bas-int .rubfoot {width:192px}
	
#article {margin-top:4em;  padding-bottom: 8em}
	#article #articleCont {float:left; width:48%; padding-left:3em; margin-right:4em; font-size: 1.1em}
	#article #articleInfos {float:left; width:250px; padding-left:2em; padding-bottom:18px; border-left: 4px solid #deedf0; margin-top:3em}
	#articleInfos #carte #zoom {height:36px; width:36px}
	
#entete.enteteMosaique {height: 176px}
.H #b0.b0Mosaique {height:176px}
	
#formdon input[type="radio"] + label {padding-left: 1.4em; padding-right: 1.4em; margin-right:0.6em; border-radius:5px }	
}

/*@media screen and (max-height:570px) , screen and (max-width:1450px) {*/
@media screen and (max-width:1450px) {
	.H #menu {right:20%}
	#menu-haut {right:20%}
	
	#mosaiqueNew {/*width:80%;*/ }
	#mosaiqueNew .mosa { /* width:20%;*/ width: 16%}
}

/*@media screen and (max-height:570px) , screen and (max-width:1350px) {*/
@media screen and (max-width:1350px) {
body {font-size: 0.72em}
.largeurInt01 {width:86%; margin-left:12%; margin-right:0; }	
#entete {height: 130px}
#logo {width:128px; padding-top:29px}
	#bas-int #logobas {width:128px}
.H #menu {top:57px; right:20%}
	#menu-haut {right:20%}
	#menu .lm {margin-left:26px}
#menufond {height:4px;top:90px }
#menu-actif {height:4px; top:90px}
#bas-int .rubfoot {width:173px}
	
#article #articleCont {width:50%}
	
#entete.enteteMosaique {height: 158px}
.H #b0.b0Mosaique {height:158px}
	
	
}

/*@media screen and (max-height:460px) , screen and (max-width:1200px) {*/
@media screen and (max-width:1200px) {
#MOB2 {display: block}	
.largeurInt01 {width:91%; margin-left:8%; margin-right:0; }
.H #menu {right:15%}
	#menu-haut {right:15%}
	
#mosaiqueNew {/*width:85%;*/ }
	#mosaiqueNew .mosa { /* width:20%;*/ width: 17%}
	
#contenuInterieur {font-size: 0.95em}
	#formdon input[type="radio"] + label {padding-left: 1.3em; padding-right: 1.3em; margin-right:0.5em; border-radius:5px }	
}










@media screen and (max-width: 998px) {

	#MOB2 {display:none}
	#MOB {display: block}
	
	#logoHaut {width: 120px; margin-left: 7%; padding-top: 20px;margin-bottom:40px;  display: block; position: relative}
	.H #logoHaut {display: block; visibility: hidden}
	#logoHaut img {width: 100%; display: block}
	
	#btmenu {display:block; position: fixed; top:20px; right:7%; width:50px; height:50px; z-index:950; 
	transform-origin:50% 50%; cursor: pointer; background-color: rgba(68,155,181,0.9)}
		#btm1, #btm2, #btm3 {width:22px; height: 2px; background-color: #fff; position: relative; margin-left:auto; margin-right: auto; display: block; 
			transform-origin: 0 0}
		#btm1 {margin-top:17px} #btm2 {margin-top:5px} #btm3 {margin-top: 5px}
	
	.H #btmenu, .H #btmenu i {visibility: hidden}	
	
	.retMOB {display:block; clear:both; width:0; height:0; line-height:0; margin:0; padding:0; float:none}
	
	
	/* navigation */	
#entete {width: 100%; height: auto; position:relative; top:0; left: 0; padding-top:0; z-index: 500; background-color: #fbf9f9;}
	.H #entete {width:100%; height: 100%; position: fixed; left:0; top: 0; padding-top: 0; z-index:900; overflow: scroll; display: none}
	#entete .largeurInt01 {width: 100%; margin: 0}
	
#logo {width:120px; margin-left: 7%; padding-top:20px;  float:none; position: relative}
	.H #logo {visibility: hidden}

	
.H #menu {top:0; right:0; left:0; margin:3em 0 0 7%; padding:0; float:none; position:relative; width: auto; z-index:800}
	#menu ul {float:none}
		.H #menu .lm {display:block; float:none; margin: 0; padding: 0}
		#menu .am {display:inline-block; padding:0.6em 0 0.4em 0; font-size: 2em; font-weight:500; margin:0}
		
		#menu #m0, #menu #m1, #menu #m2 {padding-right:1em}
		#menu .am img {width:0.5em; margin-top: -0.25em}
	#menu li .mactif {color:#184f99}	
	
	.sousmenu { position: relative; background:none; border-radius: 10px; z-index: 500; box-shadow: 0 0 0 #f4f4f4; background-color: #2c7aa2; display: inline-block;}
	#menu .sousmenu {padding-left:2em; padding-right:2em; width: 74%; max-width: 340px; padding-top:0.2em; padding-bottom:0.2em; margin-bottom: 2.5em; margin-top: 0.7em}
		.H .sousmenu {position: relative; background-color: #2c7aa2; z-index: 500; display: none}
		
			.sousmenu li {display:block}
			.sousmenu .sansBord {border-bottom: none}
			.sousmenu li a {display:block; padding:0; line-height: 1.6em; font-size:1.4em; margin:0; overflow: visible}
			.sousmenu li a span {padding-top: 0.6em; padding-bottom: 0.6em; padding-left: 1.1em}
			.sousmenu li a img  {width: 0.4em; position: absolute; top:1.2em; margin-top:0; left:0; transform-origin: 50% 50%}
			.H .sousmenu li a b { display: none}
			
			.sousmenu li a.sousmactif {color:#18264c}
	
	#menu-haut {width:auto; position:relative; top:0; right:0; margin-top: 3em; padding-bottom: 8em; margin-left: 7%}
	#menu-haut ul {float:none}
	#menu-haut li {float:none; display:block; margin-left:0px}
	#menu-haut li a {padding-left:1em; line-height: 1.2em; font-size:1.4em; color:#4a4a4a; padding-top:0.4em; padding-bottom:0.4em; display: inline-block; position: relative}
	#menu-haut li a img {position: absolute; top: 50%; width: 0.4em; margin-top: -0.2em; left:0}
	#menu-haut li a.menuhaut-actif {color:#449bb5}
	.H #menu-haut li a {visibility:hidden}
/* fin navigation*/
	

#b1, #b0, .H #b0, #menufond, #menu-actif { display: none}
	
.largeurInt01{width:86%; margin-left:auto; margin-right: auto}
#entete .largeurInt01 {width: 100%; margin: 0}	
	
#contenu, #contenuMosaique {width:100%; color:#ffffff; position:relative; z-index:65; background-color:#727786; float: none}
.H #contenu {background:none}
	#contenuIntaccueil {padding:2em 2.5em 4em 2.5em; display: block}
	#contenu h1 {font-size:1.9em; width: 90%} 
	#contenu h1 br {display: none}
	#contenu h1 strong {font-weight:300}
	#contenu h2 {font-size:1.25em; display:block;font-weight:300; position: relative; z-index: 12; display: block}
	/*#contenu h1 {font-size:2.5em; display:block;font-weight:300; position: relative; z-index: 12; display: block}*/
	#contenu p {font-size:1.4em; width:90%; max-width: 600px; text-align:left; line-height:1.7em; display:block; margin-top:1.8em; font-weight: 300; position: relative; z-index: 12}
	#contenu p strong {text-transform:uppercase; font-weight: 400; letter-spacing: 0.05em}
	
	#contenuInterieur {font-size: 1.3em}
	
#contenu-fond {width:100%; height: 100%; background-color:#727786; position:absolute; top:0; left:0; z-index:10; transform-origin: 100% 0}
.H #contenu-fond, .H #contenu h1 { visibility: hidden}

#page #visu {width:100%; height:200px; margin-top:0; position:relative;  z-index:10; overflow:hidden; float:none}
.H #page #visu {visibility: hidden}
	#page #visu img {width:auto; display: block}

#suitecontenuaccueil {width: 100%; padding-top: 2em; padding-left:0}
#suitecontenuaccueil p {font-size: 1.4em; color:#474458; line-height: 1.9em}

#Partenaires {width:100%; margin: 0; padding-top:2.5em; padding-bottom:6.5em; padding-left: 0}

#page #bas {padding-bottom:7em; padding-top: 1em}
#bas-int #logobas {width:120px; float:none; margin:27px 6em 0 0}
#bas-int .rubfoot { float:none; width: 200px; display: block; margin:37px 4em 0 0}
	 #bas-int .rubfoot span {font-size:1.5em}
	#bas-int .rubfoot ul li a {font-size: 1.4em}


/* page int */
	
#retourDispositif {position:relative; top:0; z-index:260; width:250px; left:0; margin-left:5%; margin-top: 30px; font-size:1.05em; padding:0 0 0 10px; background-position:0 8px; display:block}
.hasJS #retourDispositif {visibility: hidden}
	

#mosaiqueNew {padding:0 0 10em 0}
	#mosaiqueNew .mosa {width: 28%; float: left; margin-right: 2px; margin-bottom: 2px}
	#mosaiqueNew li.retA, #mosaiqueNew .mosa.vide { display: none}

#bdroite {width:50%; height:358px; top:-20px; right:0}
#bgauche {width:500px; height:500px; top:400px; left:-200px}
	
	

	
	#article {width:100%; margin-top:60px; font-size: 1.1em}
		#article #articleCont {float:none; width:90%; padding-left: 5%; padding-right: 5%;}
			#articleCont h2 {font-size:1.7em; padding:7px 0 13px 55px;}
			#articleCont .h2perso {font-size:1.7em;  }
			#articleCont h3 { font-size:1.3em; padding:0.05em 0 0 2em;}
			#articleCont .h3lignes {font-size:1.3em; ;}
			#articleCont .h2sansmarge {margin:0;}
			#articleCont .h2lignes {font-size:1.2em}
			#articleCont .h2lignesGd {font-size:1.5em}
	
			#articleCont .h2texteseul {margin:25px 0 0 0; padding:13px 0 2px 0; font-size:1.7em; line-height: 1.5em}
			#articleCont .h3texteseul {margin:25px 0 0 0; padding:13px 0 2px 0; font-size:1.3em; line-height: 1.5em}
	
			#articleCont p {font-size:1.05em; line-height:1.7em; width:auto; text-align:left}
			#articleCont .ppetit {font-size:1.05em}
			#articleCont p .imggauche {float:left; margin:0 20px 5px 0; width:120px}
			#articleCont ul {font-size:1.05em;margin:0 0 0 10px;}
			#articleCont .ulpetit {  font-size:0.95em; margin:0 0 0 24px;}
			#articleCont ul li {text-align:left; display:block; background-position:0 0.4em;}
			#articleCont .ulpetit2 { font-size:0.9em; margin:0 0 0 24px;}
			#articleCont .ulpetit2 li { text-align:left; display:block}
			
			#articleCont ul ul {font-size:0.8em; padding:5px 0 20px 0; margin:0 25px 0 25px}
			
			#articleCont .imagevignette {width:35%}
	
			#articleCont #liste-publications {margin:0 0 50px 0; font-size:1em}
				#articleCont #liste-publications li {width:28%; margin:1.5em 4% 1.5em 0; background:none; padding:0; text-align:left}
				#articleCont #liste-publications .retourligne {width:0px; height:0; line-height:0px; font-size:0px; clear:both; margin:0; padding:0; float:none}
					
					#articleCont #liste-publications li a img {width:100%}
					#articleCont #liste-publications li a .titre {margin:8px 0 0 0; font-size:0.85em}
					#articleCont #liste-publications li a .details {margin:5px 0 0 0; padding:0 0 0 10px; font-size:0.7em; background-position:0 5px}
			
			#article .pdf {padding:0 35px 10px 0; margin:0 10px 0 0}
			#article .doc {padding:0 35px 10px 0; margin:0 10px 0 0}
			
		#article #articleInfos {float:none; width:90%; max-width: 307px; padding-left:5%; padding-right: 5%; padding-top: 50px; margin-top:60px; padding-bottom: 30px; border:none; border-top: 4px solid #56a3b8}
			#article #articleInfos h3 { font-size:1.4em}
			#article #articleInfos ul li { font-size:1em}
			#article #articleInfos .gras li {font-size:1.05em; }
			#article #articleInfos .gras li .spanpetit {font-size:0.9em}
	
			#article #articleInfos #listeInfos-publications li {margin:4px 0 0 0}
			
			#article #articleInfos #listeActu li {margin:4px 0 0 0}
			#article #articleInfos .pactu {font-size:0.95em; text-align:left}
			
			#article #articleInfos h2 {font-size:1.5em}
			#article #articleInfos p {font-size:1.1em}
			
			#articleInfos img {margin:0 0 15px 0}
					
	
}
@media screen and (max-width: 500px) {
#Partenaires li {width:45%; margin-right: 5%; float: left}
#Partenaires li.ret {clear:both; width:0; height:0; line-height:0; margin:0; padding:0; float:none}	

#contenu h1 {width: 95%} 
#contenu p {width:95%}
#page #visu {width:100%; height:150px}	
#contenuInterieur {font-size: 1.1em; padding-left:1.5em;}	
	
#articleCont #liste-publications .retourligne {width:0px; height:0; line-height:0px; font-size:0px; clear:both; margin:0; padding:0; float:none}

#mosaiqueNew {min-height: auto}
#mosaiqueNew .mosa {width: 48%; margin-right: 2px; margin-bottom: 2px}	
#bdroite, #bgauche {display:none}
	
#formdon .envoyerreduit {width:100%}
#articleCont ul.listelogos2 li {float:none; width:80%; margin-right:0; margin-bottom:1.2em; background:none; display: block}	
#articleCont .depliA {width:60%}	
}