@charset "utf-8";


/*
Theme Name: CHEVREUL
Theme URI: 
Description: Institut Chevreul
Version: 1.0
Author: Emilie De Paepe
Tags: white, black, yellow, flexible-width, Responsive
 
Creation Theme by Emilie De Paepe - LASIR UMR8516 || http://lasir.univ-lille.fr/
*/




/***********************************************************************************************************************************************************************************************************/
/* BASIC */
/**********************************************************************************************************************************************************************************************************/

* {
    margin: 0; padding: 0;
}


html, body {
	width:100%;
	height:100%;
	margin:0px;
	padding:0px;
	background-color:#ECEDED;
}

	body, input, select, textarea {
		color: #474747;
		font-family: 'Source Sans Pro', sans-serif;
		font-size: 1.2em;
		font-weight: 300;
		line-height: 1.5em;
	}
	
	img {border:0; border:none;  border: transparent;}
	
	

	a {
		color: #008dca;
		font-weight: 400;
		text-decoration: none;
		outline:none;
		border:0; border:none;
		margin:0; padding:0;
	}

		a:hover {
			color: #00b2ff;
			text-decoration: underline;
		}
		
	a.gris {
		color:#3E3D40;
		text-decoration:none
	}
	
		a.gris:hover {
			color:#B1B3B4;
		}

	strong, b {
		font-weight: 600;
	}

	em, i {
		font-style: italic;
	}
	

	ol, dl, table, blockquote {
		margin: 0 0 2em 0;
	}
	
	ul {
		margin:0;
	}
		
	
	p {
		margin:0 0 1.5em 0; text-align:justify;
	}
	
	p.highlight {
		width:96%;
		background-color:#f6f6f6;
		font-size:0.9em; line-height:1.3em; font-weight:400; color:#58595b;
		margin:2em auto 2em auto; padding:0.8em 1em 0.8em 1em;
		border:1px dotted #7e7e7e;
	}
	
	span.stabilo {
		background-color:#ffed00;
	}
	

	h1, h2, h3, h4, h5, h6 {
		color: inherit;
		font-size:1.5em;
		font-weight: 600;
		line-height: 2em;
		margin-bottom: 0.05em;
	}

		h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
			color: inherit;
			text-decoration: none;
		}
		
			h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover {
				color: inherit;
				text-decoration: none;
			}

		h1 em, h2 em, h3 em, h4 em, h5 em, h6 em {
			font-style: normal;
			font-weight: 300;
		}

		
	h1 {
		font-size: 1.4em;
		margin-top: 1.5em;
	}
	
		
	h2 {
		font-size: 1.3em;
		letter-spacing: -0.01em;
	}

	h3 {
		font-size: 1.2em;
		letter-spacing: -0.025em;
	}
		

	sub {
		font-size: 0.8em;
		position: relative;
		top: 0.5em;
	}

	sup {
		font-size: 0.8em;
		position: relative;
		top: -0.5em;
	}

	hr {
		border-top: solid 1px #e0e0e0;
		border: 0;
		margin-bottom: 1.5em;
	}

	blockquote {
		border-left: solid 0.5em #e0e0e0;
		font-style: italic;
		padding: 1em 0 1em 2em;
	}




	#page-wrap {
		width:100%;
	}
	
	header, section, footer {
	width:100%;
	margin:auto;
	}
	
	
	.lirelasuite {
		display: inline-flex;
		display: -ms-inline-flex;
		display: -moz-inline-flex;
		display: -webkit-inline-flex;
		width:auto;
		padding:0.4em 0.7em 0.4em 0.7em; margin:0;
		font-size:0.8em;
		background-color:#3E3D40;
	}
	
	.plus {
		display: inline-flex;
		display: -ms-inline-flex;
		display: -moz-inline-flex;
		display: -webkit-inline-flex;
		width:auto;
		padding:0em 0.4em 0em 0.3em; margin:0;
		background-color:#3E3D40;;
	}
		.lirelasuite a, .plus a {
			color:#FFF;
			text-decoration:none;
			font-size:1.1em; font-weight:500; line-height:1.1em; color:#FFF;
		}
		
			.lirelasuite a:hover, .plus a:hover {
				color:#FFED00;
			}
			

	.credits {
		font-size:0.9em; font-style:italic; color:grey;
	}



	
/* Catégories (index + single + archives) */
.toutes-actus {
	background-color:#3E3D40;
}

.congres {
	background-color:#BE0A26;
}

.seminaire {
	background-color:#97BF0D; 
}
				
.recherche {
	background-color:#39A9DC;
}

.plateforme {
	background-color:#93117E;					
}

.archi-cm {
	background-color:#D40050;				
}
				
.batiment {
	background-color:#EE8518;	
}

.divers {
	background-color:#58585A;				
}

span.metas {
	font-size:0.8em; font-weight:500; color:#b1b3b4;
}			
			
			
				
				
/***********************************************************************************************************************************************************************************************************/
/* HEADER */
/**********************************************************************************************************************************************************************************************************/

header {
	height:auto !important;
	background-color:#FFF;
}


	header > .header {
		width:80%; max-width:1200px; height: auto !important;
	}

		header > .header > .logo {
		 	display:inline-block; 
			width:20%; height:auto !important; 
			vertical-align:sub !important;
			margin:0 0 1.2em 0; padding:0;
		}

		header > .header > nav {
			display:inline-block;width:79%;
		}

			header > .header > nav > ul {
				width:auto !important;
				text-align:right;
				margin: 0;
				padding:0;
			}

				header > .header > nav > ul li {
					position: relative;
					display: inline-block;
					margin-left: 0.24em;
				}
			
				header > .header > nav > ul li:first-child {
					margin-left: 0;
				}

				header > .header > nav > ul li a {
					font-weight: 400;
					color: #b1b3b4;
					text-decoration: none;
					padding: 0.3em 0.75em 0.3em 0.75em;
				}

				header > .header > nav > ul li:hover a {
					color: #3e3d40;
					background-color:#ffed00;
				}
				
				header > .header > nav > ul li.current_page_item a {
						color:#3e3d40;
						background-color:#ffed00;
					}

					
	
	header > .banner {
		width:100%; height:9em;
		margin:0;padding:0; 
		overflow:hidden;
		border-width:0.25em 0 1em 0; border-style:solid; border-color:#3E3D40; 
		background-color:#3E3D40; background-repeat:no-repeat; background-position:bottom; background-size:cover; 
	}
							
		header > .banner > nav {
			width:80%;max-width:1200px;
			height:100%;
			margin:auto;
			border:0px solid red;
		}
				
			header > .banner > nav > ul {
				width:100%;
				height:100% !important;
				display: inline-flex;
				display: -ms-inline-flex;
				display: -moz-inline-flex;
				display: -webkit-inline-flex;
				flex-direction: row;
				flex-wrap: nowrap;
				flex-flow: row nowrap; /* raccourcis de flex-direction et flex-wrap */
				justify-content: space-between;
				align-items: flex-end;
				list-style-type:none;
				margin:0; padding:0;
				border:0px solid white;
			}
			
				header > .banner > nav > ul li {
					width:32%; height:2.1em;
					background-color:#FFF;
					opacity: 0.8;
					margin:0; padding:0.35em 0 0.15em 0;
					box-shadow: 0px 0px 4px 1px rgba(70, 67, 67, 0.75);
					-moz-box-shadow: 0px 0px 4px 1px rgba(70, 67, 67, 0.75);
					-webkit-box-shadow: 0px 0px 4px 1px rgba(70, 67, 67, 0.75);;
				}
			
				header > .banner > nav > ul li:first-child {
					margin-left: 0;
				}
			
				header > .banner > nav > ul li:hover {
					height:7em;
					top:-3.25em !important;
				}
			
					header > .banner > nav > ul li header {
						width:91%; height:auto !important;
						margin:auto !important;
						font-size:1.10em; line-height:1.3em; font-weight:800; color:#000;
						background-image:url(image/onglet-off.png);
						background-repeat:no-repeat; background-position:right;
						background-size:7.5%;
					}
					
					header > .banner > nav > ul li:hover header {
						background-image:url(image/onglet-on.png);
					}
				
					header > .banner > nav > ul li p {
						display: none;
					}
				
					header > .banner > nav > ul li:hover p {
						display: block;
						width:91%; height:auto !important;
						margin:0.4em 0 0 4.5%;
						text-align:left; line-height:1.2em;
					}
					
/* Searchform */
	
		header > .header > ul.searchform {
			width:100%; height:auto !important;
			margin:0; padding:0.5em 0 0 0;
			text-align:right;
		}
		
			header > .header > ul.searchform li {
				width:auto !important; height:auto !important;
				display:inline-flex;
				display: -ms-inline-flex;
				display: -moz-inline-flex;
				display: -webkit-inline-flex;
				flex-direction: row;
				flex-wrap:wrap;
				list-style-type:none;
				margin:0; padding:0;
				font-size:0.9em; color:#B1B3B4;
			}
		
				header > .header > ul.searchform li a {
					color:#B1B3B4;
				}
				
					header > .header > ul.searchform li a:hover {
						color:#000; font-weight:600;
					}
					
					header > .header > ul.searchform li.current_page_item a {
						color:#000; font-weight:600;
					}

		
			header > .header > ul.searchform li form{
				display:inline-flex;
				display: -ms-inline-flex;
				display: -moz-inline-flex;
				display: -webkit-inline-flex;
				flex-direction: row;
				flex-wrap:nowrap;
				margin:0 0 0 0.6em; padding:0;
			}
			
		
				header > .header > ul.searchform li form input.champs, form input.champs  {
					font-size:1em;
					padding:0 0.3em 0 0.3em;
				}
		
				header > .header > ul.searchform li form input.go  {
					width:auto !important; height:100%;
					margin:0 0 0 0.3em;
				}
		

/***********************************************************************************************************************************************************************************************************/
/* MAIN => PAGE */
/**********************************************************************************************************************************************************************************************************/

.main {
	width:80%;max-width:1200px;
	margin:auto;
	background-color:#ECEDED;;
}

	.main > .page-contenu {
		width:100%; height:auto !important;
		margin:0; padding:0;
		background-color:#FFF;
		box-shadow: 0px 0px 4px 1px rgba(70, 67, 67, 0.75);
		-moz-box-shadow: 0px 0px 4px 1px rgba(70, 67, 67, 0.75);
		-webkit-box-shadow: 0px 0px 4px 1px rgba(70, 67, 67, 0.75);
	}
	
		.main > .page-contenu > p.index-intro {
			padding:1.5em;
			margin:0;
			font-weight:regular;
		}
		
		.main > .page-contenu > .contenu {
			margin:0; padding:1em 2.5em 2.5em 2.5em;
		}
		
			.main > .page-contenu > .contenu > h1 {
				min-height:1.6em;
				line-height:1.3em;
				margin:2em 0 2em 0;
				padding:0.2em 0 0em 0.6em;
				border-left:0.3em solid #ffed00;
			}
			
			.main > .page-contenu > .contenu > h2 {
				font-size:1em;
				line-height:1.3em;
				font-weight:600;
				margin:1.5em 0 0 0;
				padding:0;
			}	
			
			
			.main > .page-contenu > .contenu > ul {
				list-style-type: none;
				font-weight:600;
				margin:0; padding:0;
			}
				.main > .page-contenu > .contenu > ul li {
					border-left:0.25em solid #ffed00;
					font-size:0.9em; line-height:1.2em; font-weight:400;
					margin:0 0 0.7em 0; padding:0 0 0 0.5em;
				}
	
	

	.main > nav {
		width:100%;height:auto !important;
		margin:2em auto 0 auto; padding:0;
	}

		.main > nav > ul {
			display:flex;
			display: -ms-flex;
			display: -moz-flex;
			display: -webkit-flex;
			justify-content: center;
			align-items:center;
		}

			.main > nav > ul li { 
				display:inline-flex;
				display: -ms-inline-flex;
				display: -moz-inline-flex;
				display: -webkit-inline-flex;
				justify-content: center;
				flex-wrap: wrap;
				align-items:center;
				list-style: none; 
				width:auto !important; min-width:6em; min-height:6em; 
				margin-left:2em;padding:0px; 
				text-align:center;
			}
			
			.main > nav > ul li {background-repeat:no-repeat; background-position:center top; background-size:64% !important; }
			.main > nav > ul li:nth-child(1) {margin-left:0; background-image:url(image/nav-laboratoires.png);}
			.main > nav > ul li:nth-child(1):hover {background-image:url(image/nav-laboratoires-hover.png);}
			.main > nav > ul li:nth-child(2) { background-image:url(image/nav-plateformes.png);}
			.main > nav > ul li:nth-child(2):hover { background-image:url(image/nav-plateformes-hover.png);}
			.main > nav > ul li:nth-child(3) { background-image:url(image/nav-archi.png);}
			.main > nav > ul li:nth-child(3):hover { background-image:url(image/nav-archi-hover.png);}
			.main > nav > ul li:nth-child(4) {background-image:url(image/nav-contact.png);}
			.main > nav > ul li:nth-child(4):hover {background-image:url(image/nav-contact-hover.png);}
			.main > nav > ul li:nth-child(5) {background-image:url(image/nav-rss.png);}
			.main > nav > ul li:nth-child(5):hover {background-image:url(image/nav-rss-hover.png);}
			
			
			.main > nav > ul li a { 
				width:100%;
				align-self:flex-end;
				padding:4.5em 0 0 0;
				color:#3E3D40;text-decoration:none
			}
			
			.main > nav > ul li a:hover { 
				color:#B1B3B4;
			}
			
			
				
	/* Page laboratoires -> TablePress - laboratoires */
	#table-laboratoires {position:relative;}
	#table-laboratoires  table {width:100%;  border-collapse: separate; border-spacing:0 2em; border:0; margin:0;}
	#table-laboratoires tbody td {vertical-align:middle; text-align:justify; border:0;}
	#table-laboratoires tbody tr .column-1 { width:18%;padding-right:1.5em;}
	#table-laboratoires tbody tr .column-1 img{ width:100%;}
	#table-laboratoires tbody tr .column-2 {margin:0; padding:1em; text-align:justify; font-size:0.9em; line-height:1.4em; background-color:#fff; border-left:0.25em solid #FFED00;}

			
	/* Page plateformes -> présentation des 8 plates-formes */
	.main > .page-contenu > .contenu > ul.plateformes {
		width:100%;
		display:flex;
		display: -ms-flex;
		display: -moz-flex;
		display: -webkit-flex;
		flex-direction: row;
		flex-wrap: wrap;
		justify-content: space-between;
		align-items:center;
	}

		.main > .page-contenu > .contenu > ul.plateformes li {
			width:48%;
			display:inline-flex;
			display: -ms-inline-flex;
			display: -moz-inline-flex;
			display: -webkit-inline-flex;
			flex-direction: row;
		    flex-wrap: nowrap;
		    justify-content: flex-start;
		    align-items:center;
			border-left:0;
			padding-left:0;
		}
		
			.main > .page-contenu > .contenu > ul.plateformes li img {
				width:20%; height:100%;
			}
				.main > .page-contenu > .contenu > ul.plateformes li img:hover {
					width:25%; height:100%;
				}
			
			.main > .page-contenu > .contenu > ul.plateformes li a {
				width:68%; height:100%;
				padding:0.7em;
				font-weight:600;
				border-right:0.25em solid #FFED00;
				background: #F6F6F6; /* For browsers that do not support gradients */    
				background: -webkit-linear-gradient(left, #ffffff 0%, #f6f6f6 8%);
				background: -o-linear-gradient(left, #ffffff 0%, #f6f6f6 8%);
				background: -moz-linear-gradient(left, #ffffff 0%, #f6f6f6 8%);
				background: -ms-linear-gradient(left, #ffffff 0%, #f6f6f6 8%);
				background: linear-gradient(left, #ffffff 0%, #f6f6f6 8%);
			}	


	/* Pages -> photos sur une ligne */
	.main > .page-contenu > .contenu > ul.mozaic-photos {
		width:100%;
		display:flex;
		display: -ms-flex;
		display: -moz-flex;
		display: -webkit-flex;
		flex-direction: row;
		flex-wrap: nowrap;
		justify-content:center;
		align-items:center;
		margin:1.5em 0 0 0; padding:0;
	}	
	
		.main > .page-contenu > .contenu > ul.mozaic-photos li {
			width:auto !important;
			margin:0.2em;padding:0;
			border:0;
		}
		
		.main > .page-contenu > .contenu > ul.mozaic-photos li.projet {
			margin:0.7em;
		}

			.main > .page-contenu > .contenu > ul.mozaic-photos li img{
				width:100%;
			}		

		
			
	/* Page projet archi-cm -> plugin WP-ShowHide*/
	.sh-link {margin:0.5em 0 0 0; padding:0.5em 0 0.5em 1em; background-color:#F6F6F6; border-left:0.25em solid #FFED00;} 
	.sh-link:hover {background-color:#FFED00;}  	 
	.sh-link A {display:block; width:100%; color:#3E3D40; font-weight:600; text-decoration:none;}
	.sh-link A:hover {color:#B1B3B4;}
	.sh-content {margin:0; padding:0.5em 1em 1em 1em; text-align:justify; font-size:0.9em; line-height:1.4em; background-color:#F6F6F6; border-left:0.25em solid #FFED00;}	
	.pressrelease-link {}  
	.pressrelease-link.sh-hide A {} /* css "less_text" */  
	.pressrelease-link.sh-show A {} /* css "more_text" */ 
	.pressrelease-content {}  
	.pressrelease-content.sh-hide {}  
	.pressrelease-content.sh-show {}
	
	/* Page contact -> TablePress - contact */
	#table-contact {position:relative;}
	#table-contact  table {width:100%;  border-collapse: separate; border-spacing:0 2em; border:0; margin:0;}
	#table-contact tbody td {vertical-align:middle; text-align:left; border:0;}
	#table-contact tbody tr .column-1 { width:6%;padding-right:1em;}
	#table-contact tbody tr .column-1 img{ width:100%;}
	#table-contact tbody tr .column-2 { padding-left:0.6em;border-left:0em solid #FFED00;line-height:1.3em;}
				

/***********************************************************************************************************************************************************************************************************/
/* INDEX */
/**********************************************************************************************************************************************************************************************************/

	.actus {
		width:100%; height:auto !important;
		display: inline-flex;
		display: -ms-inline-flex;
		display: -moz-inline-flex;
		display: -webkit-inline-flex;
		flex-direction: row;
		flex-wrap: nowrap;
		flex-flow: row nowrap; /* raccourcis de flex-direction et flex-wrap */
		justify-content: space-between;
		align-items: stretch;
		margin:0; padding: 0;
	}

		.actus > article  {
			width:32%; height:auto !important;
			margin: 0; padding:1em 0 1em 0;
			background-color:#fff;
			border-width:0.15em 0 0.15em 0; border-style:solid; border-color:#3E3D40;
			}
			

			.actus > article:first-child {
				margin-left: 0;
			}
				
				.actus > article > .thumbnail {
					width:85%; height:auto !important; max-height:9em;
					overflow:hidden;
					margin:auto !important; padding:0;	
				}
				
					.actus > article > .thumbnail img {
						width:100%; height:100%;						
					}
							
					.actus > article > .thumbnail h1 {
						position:absolute;
						height:0.5em;
						margin-top:0.75em; margin-left:-0.8em; padding:0.70em 0.65em 0.30em 0.65em;
						font-size:0.75em; font-weight:500; line-height:0; color:#FFF;
					}
				
				
				.actus > article > .art-actu {
					width:85%; height:auto !important; min-height:55% !important; max-height:100% !important;
					margin:auto; padding:0;
				}
				
					.actus > article > .art-actu > h2 {
						margin:0.5em 0 0em 0;
						font-size:1.4em; font-weight:600; line-height:1.2em; color:#3e3d40;
					}
					
					.actus > article > .art-actu > p {
						font-size:0.9em; line-height:1.3em;
						margin:0.5em 0 1.5em 0;
					}
					
					
				.actus > article > p.lien {
					width:85%;
					margin:0 auto 0 auto;
				}
					
					
					
	.nav-actus {
		display:block;
		width:100%; height:auto !important;
		margin: 0.6em 0 0 0; padding:0;
	}
	
		.nav-actus > .nav-pages {
		display:inline;
		width:auto !important;
		float:right;
		}
					
				

/***********************************************************************************************************************************************************************************************************/
/* SINGLE */
/**********************************************************************************************************************************************************************************************************/				
				
	.contenu > article  {
		width:100%; height:auto !important;
		margin: 0; padding:0 0 4em 0;
	}
							
		.contenu > article > h1 {
			display: inline-flex;
			display: -ms-inline-flex;
			display: -moz-inline-flex;
			display: -webkit-inline-flex;
			height:0.5em;
			margin:3.5em 0.3em 0 0; padding:0.70em 0.65em 0.30em 0.65em;
			font-size:0.75em; font-weight:500; line-height:0; color:#FFF;
		}
								
		.contenu > article > h2 {
			margin:1em 0 0em 0;
			font-size:1.3em; font-weight:600; color:#3e3d40;
		}
			
			
			
/***********************************************************************************************************************************************************************************************************/
/* ARCHIVES + RESULTATS RECHERCHE */
/**********************************************************************************************************************************************************************************************************/	

	.contenu > .liste {
		display: inline-flex;
		display: -ms-inline-flex;
		display: -moz-inline-flex;
		display: -webkit-inline-flex;
		width:100%; height:auto !important;
		margin: 0; padding:1.5em 0 1em 0;
		border-top:1px dotted #b1b3b4;border:bottom:0;
	}

				
		.contenu > .liste  > .thumbnail {
			width:25%; height:auto !important; max-height:7.7em;
			overflow:hidden;
			margin:0 1em 0 0; padding:0;
		}
				
			.contenu > .liste > .thumbnail img {
				width:100%; height:100%;	
			}
							
			.contenu > .liste > .thumbnail h1 {
				position:absolute;
				height:0.5em;
				margin-top:0.75em; margin-left:-0.8em; padding:0.70em 0.65em 0.30em 0.65em;
				font-size:0.75em; font-weight:500; line-height:0; color:#FFF;
			}
				
				
		.contenu > .liste > .art-actu {
			width:85%;
			margin:auto; padding:0;
		}
				
			.contenu > .liste > .art-actu > h2 {
				margin:0; padding:0;
				font-size:1.4em; font-weight:600; line-height:1.2em; color:#3e3d40;
			}
					
			.contenu > .liste > .art-actu > p {
				font-size:0.9em; line-height:1.3em;
				margin:0 0 0.5em 0; padding:0;
			}

	
	
/* menu archives */	

	.menu-archives{
		width:100%; height:auto !important;
		margin:0; padding:0;
	}
	
			.menu-archives > ul li {
				display:inline-flex;
				display: -ms-inline-flex;
				display: -moz-inline-flex;
				display: -webkit-inline-flex;
				flex-direction: row;
				flex-wrap:wrap;
				align-items: flex-start;
				list-style-type:none;
				height:0.5em;
				margin:0 0.2em 0 0; padding:0.70em 0.65em 0.30em 0.65em;
				font-size:0.9em; font-weight:500; line-height:0; color:#FFF;
			}
			

				.menu-archives > ul li a {
					color:#FFF;
					text-decoration:none;
				}
		
				.menu-archives > ul li a:hover {
					color:#dcddde;
				}

				
/* resultats search */
	.contenu > .liste-search {
		display: block;
		width:100%; height:auto !important;
		margin: 0; padding:1em 0 0.5em 0;
		border-top:1px dotted #b1b3b4;border:bottom:0;
	}
				
				
			.contenu > .liste-search > h2 {
				margin:0; padding:0;
				font-size:1.2em; font-weight:600; line-height:1.2em; color:#3e3d40;
			}
					
			.contenu > .liste-search > p {
				font-size:0.8em; line-height:1.3em;
				margin:0 0 0.5em 0; padding:0;
			}



/***********************************************************************************************************************************************************************************************************/
/* FOOTER */
/**********************************************************************************************************************************************************************************************************/

footer { 
	display:block; 
	border:0px solid red;
}

	footer > .footer {
		width:100%; height:auto !important; 
		margin-top:2em; padding:0;
		background-color:#FFF;
		border-top:0.15em solid #3E3D40;
	}
		
		footer > .footer > .tutelles {
			position:relative;
			height:auto !important;
			margin:0; padding: 0;
			display:flex;
			display: -ms-flex;
			display: -moz-flex;
			display: -webkit-flex;
			justify-content: center;
			flex-wrap: wrap;
		}

			footer > .footer > .tutelles > li { 
				display:inline-block; 
				list-style: none; 
				width:auto !important; height:auto !important; min-width:1em; max-width:8em; max-height:4em !important; 
				margin:2em 0 2em 2.5em; padding:0px;
				vertical-align:center; 
				align-self: center;	   
 				-webkit-align-self: center;
   				-ms-flex-item-align: center;
			}

			footer > .footer >.tutelles > li img { 
				width:90%; height:90%; 
				vertical-align:middle;
			}
			

	footer > .footer > .copyright {
		width:auto !important;
		margin:0 auto; padding:0.03em 0 0.07em 0;
		background-color:#3E3D40; 
		text-align:center; font-size:0.8em; color:#CCC;
		border:0px solid blue;
	}
	
		footer > .footer > .copyright a {
			color:#CCC;
			text-decoration:none;
		}
	
		footer > .footer > .copyright a:hover {
			color:#FFED00;
			text-decoration:none;
		}
	
	
		footer > .footer > .copyright ul {
			width:auto !important; height:1em;
			display: inline-flex;
			display: -ms-inline-flex;
			display: -moz-inline-flex;
			display: -webkit-inline-flex;
			flex-direction: row;
			flex-wrap: nowrap;
			align-items:center;
			margin:0;padding:0;
			border:0px solid blue;
		}
		
			footer > .footer > .copyright ul li {
				list-style-type:none;
				margin:0;padding:0 0.3em 0 0;
			}



/* Wide */

	@media screen and (max-width: 1680px) {

		/* Basic */

			body, input, select, textarea {
				font-size: 14pt;
				line-height: 1.5em;
			}

		/* Banner */


	}

/* Normal */

	@media screen and (max-width: 1280px) {

		/* Basic */
		


			body, input, select, textarea {
				font-size: 13pt;
				line-height: 1.5em;
			}

		/* Main */
		.main {
			width:96%;
		}


		/* Header */
		
			header > .header {
		width:96%; 
	}
		
		header > .banner > nav {
			width:96%;
		}


		/* Index */



		/* Footer */



	}

/* Narrow */

	@media screen and (max-width: 980px) {

		/* Basic */

			body, input, select, textarea {
				font-size: 12pt;
				line-height: 1.5em;
			}


		/* Header */

		header > .header > .logo {
		 	display:block; 
			width:25%; height:auto !important; 
			vertical-align:sub !important;
			margin:0 auto 1.2em auto; padding:0;
		}

		header > .header > nav {
			display:block; width:100%;
		}

			header > .header > nav > ul {
				width:auto !important;
				text-align:center;
				margin: 0;
				padding:0;
				margin-bottom:1em;
			}
			
	
		/* Index */

			



	}


	@media screen and (max-width: 840px) {

		/* Basic */

			html, body {
				overflow-x: hidden;
			}

			body, input, select, textarea {
				font-size: 13pt;
			}

			h1, h2, h3, h4, h5, h6 {
				margin-bottom: 0.5em;
			}


		/* Header */

				
				
		/* Footer */
			footer > .footer > .tutelles > li { 
				margin:1em 0 1em 1.5em; padding:0px;
			}
			
			footer > .footer >.tutelles > li img { 
				width:70%; height:70%; 
				vertical-align:middle;
			}
		

	}
	
	

/* Mobile */

	@media screen and (max-width: 736px) {

		/* Basic */

			body, input, select, textarea {
				font-size: 11pt;
				line-height: 1.35em;
			}

			h2 {
				font-size: 1.25em;
				letter-spacing: 0;
				line-height: 1.35em;
			}

			h3 {
				font-size: 1em;
				letter-spacing: 0;
				line-height: 1.35em;
			}



		/* Lists */



		/* Banner */



		/* Wrapper */



	}

/* Mobile (Portrait) */

	@media screen and (max-width: 650px) {

		/* header */
		header > .banner > nav {display:none;}

		/* actus */
	.actus {
		width:100%; height:auto !important;
		display: inline-flex;
		display: -ms-inline-flex;
		display: -moz-inline-flex;
		display: -webkit-inline-flex;
		flex-direction: column;
		flex-wrap: nowrap;
		flex-flow: row nowrap; /* raccourcis de flex-direction et flex-wrap */
		justify-content: space-between;
		align-items: stretch;
		margin:0; padding: 0;
	}
				
				.actus > article > .thumbnail {
					width:85%; height:auto !important; max-height:9em;
					overflow:hidden;
					margin:auto !important; padding:0;	
				}
				
					.actus > article > .thumbnail img {
						width:100%; height:100%;						
					}
							
					.actus > article > .thumbnail h1 {
						display:none;
					}
				
				
				.actus > article > .art-actu {
					width:85%; height:auto !important; min-height:55% !important; max-height:100% !important;
					margin:auto; padding:0;
				}
				
					.actus > article > .art-actu > h2 {
						margin:0.5em 0 0em 0;
						font-size:1.4em; font-weight:600; line-height:1.2em; color:#3e3d40;
					}
					

	}




	}
