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

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

}
@font-face
{
    font-family: 'roboto';
    src: url('../fonts/Roboto-Light.eot');
    src: url('../fonts/Roboto-Light.eot?#iefix') format('embedded-opentype'),
         url('../fonts/Roboto-Light.woff') format('woff'),
         url('../fonts/Roboto-Light.ttf') format('truetype'),
         url('../fonts/Roboto-Light.svg#Roboto-Light') format('svg');
    font-weight: lighter;
}
@font-face {
  font-family: 'open-sans';
  src: url("../fonts/OpenSans-Light.ttf");
  font-weight: normal;
  font-style: normal; 
}

*
{
	box-sizing: border-box;
	outline: none;
}

/* STYLE PAGE */
.Mairie
{
	background-color: #5BA097 !important;
}
.Guignes
{
	background-color: #443078 !important;
}
.Enfance
{
	background-color: #E93C89 !important;
}
.Sociales
{
	background-color: #EE7F2D !important;
}
.Environnement
{
	background-color: #32953D !important;
}
.Vie
{
	background-color: #950622 !important;
}
.Urbanisme
{
	background-color: #d7b100 !important;
}
.Associations
{
	background-color: #EE7F2D !important;
}
.Entreprise
{
	background-color: #67B0D9 !important;
}
.Commercant
{
	background-color: #950622 !important;
}
.Sante
{
	background-color: #32953D !important;
}

/*GENERAL*/
BODY
{
	margin: 0;
	font-family: arial;
	font-size: 14px;
	color: #666;
	/*background-image:url(../img/fond/automne-01.jpg);
    background-repeat: no-repeat;
    background-attachment: fixed;*/
}
h1
{
	color: #fff;
	background-color: #3e3d3d;
	font-size: 25px;
	font-family: roboto;
	letter-spacing: 1px;
	margin: 0px 0px 20px 0px;
	font-size: 32px;
	line-height: 36px;
	font-weight: lighter;
	padding: 20.5px 20px;
	border-top: 1px solid #e4e4e4;
	border-left: 1px solid #e4e4e4;
	border-right: 1px solid #e4e4e4;
}
h2
{
	margin: 5px 0;
	color: #184387;
	font-size: 20px;
	font-weight: 100;
	font-family: roboto;
}
h3
{
	margin: 5px 0;
	color: #184387;
	font-size: 25px;
	font-family: roboto;
}
h1 > a,h2 > a,h3 > a
{
	text-decoration: none;
}
table
{
	border-spacing: 0;
}
table td
{
	margin: 0;
	padding: 0;
}
hr
{
	margin: 0;
	padding: 0;
	background: none;
	border: none;
	border-bottom: 1px dashed #184387;
}
a img
{
	border: 0;
}
a
{
	color: #184387;
}

.clear
{
	clear: both;
}

/*FORMULAIRE*/
#captchagc,
#captchagc *
{
	box-sizing: border-box;
	outline: none;
}
#captchagc
{
	position: relative;
	background-color: #E7E7E7;
	border: 1px solid #D6D6D6;
	width: 250px;
	height: 70px;
	overflow: hidden;
	margin: 10px auto;
	float: initial;
}
#captchagc > img:nth-of-type(1)
{
	position: absolute;
	top: 18px;
	left: 18px;
	width: 34px;
	height: 34px;
	z-index: 2;
	margin: 0!important;
}
#captchagc > img:nth-of-type(2)
{
    position: absolute;
    top: 40px;
    left: 25px;
    width: 25px;
	height: 25px;
	z-index: 3;
	margin: 0!important;
	animation: 3s ease-out 1s infinite running captchagc;
}
@keyframes captchagc
{
	0% { left: 25px; }
	25% { left: 25px; }
	50%{ left: 210px; }
	100%{ left: 210px; }
}
#captchagc > img:nth-of-type(1) + div
{
	position: absolute;
	top: 14px;
	right: 14px;
	border: 1px solid #535353;
	border-radius: 4px;
	width: 41px;
	height: 40px;
	background-color: #FFF;
	z-index: 1;
}
#captchagc > img:nth-of-type(1) + div.accept
{
	border: 1px solid #F3990C;
}
#captchagc > img:nth-of-type(1) + div.hover
{
	border: 1px solid #1CD129;
}
#captchagc:before
{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	content: ">>>>>>>>";
	font-family: 'Open sans', sans-serif;
	font-size: 17px;
}
#captchagc.valid:after
{
	position: absolute;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	content: "";
	background-color: rgba(255,255,255,0.9);
	z-index: 3;
}
#captchagc > i
{
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	z-index: 4;
	opacity: 0;
	transition: ease-in-out 200ms opacity, ease-in-out 200ms left;
}	
#captchagc.valid > i:nth-of-type(1)
{
	opacity: 1;
	left: 17%;
}
#captchagc > i:nth-of-type(1):before
{
	content: "\f00c";

	font-family: "Font Awesome 5 Pro";
	font-weight: 900;
	
	padding: 5px;
	color: #12D954;
	font-size: 30px;
	width: 30px;
	height: 30px;
	line-height: 30px;
	border-radius: 100%;
	background-color: #FFF;
	border: 2px solid #12D954;
}
#captchagc > i:nth-of-type(2)
{
	position: absolute;
	top: 23px;
	left: 113px;
	z-index: 5;
	font-size: 25px;
	opacity: 1;
}
#captchagc.valid > img:nth-of-type(1)
{
	top: 18px!important;
	left: 197px!important;
}
#captchagc.valid > img:nth-of-type(2)
{
	display: none;
}


input[type='button'], 
input[type='submit'], 
input[type='button']:active, 
input[type='submit']:active, 
.bouton, .bouton:active
{
	display: inline-block;
	padding: 7px 7px;
    color: #FFFFFF;
    background: #184387;
    border: 1px solid #184387;
    border-radius: 2px;
    cursor: pointer;
    box-shadow: 0 1px 5px rgba(0,0,0,0.5);
    text-decoration: none;
    font-size: 15px;
    margin: 10px;
}
input[type='button']:hover, 
input[type='submit']:hover, 
.bouton:hover,
.bouton.select
{
	opacity: 0.8;
}
.bouton.select
{
	pointer-events: none;
}
input[type='text'], 
input[type='password'],
select
{
	height: 25px;
	border-radius: 2px;
	border: 1px solid #CCC;
	margin: 2px 0;
	outline: none;
	padding: 0 5px;
}
textarea
{
	border: 1px solid #999;
	border-radius: 2px;
	box-sizing: border-box;
}
input[type='text']:focus, 
input[type='password']:focus, 
textarea:focus
{
	outline: none;
	border: 1px solid #184387;
}

/*NOTIFICATIONS*/
.notification
{
	padding: 5px;
	border-radius: 5px;
	margin: 5px 0;
}
.notification.validation
{
	border: 1px solid #090;
	background-color: #E0FFE0;
	color: #090;
}
.notification.erreur
{
	border: 1px solid #900;
	background-color: #FBB;
	color: #900;
}

/*SITE*/
#site
{
	position: relative;
	width: 100%;
	margin: 0 auto;
	background-color: #E6DED3;
	background-size: cover;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-attachment: fixed;
}


/*HEADER/TOP/BANNIERE*/
#header_top
{
	background-color: #184387;
	position: relative;
	z-index: 999;
}
#header_top .container_top > *
{
	vertical-align: middle;
}
.container_top
{
	width: 100%;
	padding: 0;
}
#header .container_top
{
}
#user_access
{
	color: white;
	position: relative;
}
#user_access a 
{
	text-decoration: none;
	color: white;
}
#user_access ul a
{
	padding: 10px;
	display: inline-block;
	border-left: 3px solid transparent;
}
#user_access ul a:hover
{
	border-left: 3px solid white;	
}
#user_access .fa-caret-down
{
	cursor: pointer;
}
#user_access .fa-caret-down:hover
{
	color: #ff978f;
}
#user_access .fa-caret-down.open + ul
{
	display: block;
}
#user_access i
{
	font-size: 21px;
	z-index: 9999;
}
#user_access ul
{
	position: absolute;
	/*overflow: inherit!important;*/
	display: none;
	top: calc(100% + 1px);
	text-align: left;
	z-index: 999;
	list-style: none;
	background-color: #184387;
	margin: 0px;
	padding-left: 0px;
	box-shadow: 1px 1px 5px #000;
}
#user_access ul:before
{
	content: '';
	height: 8px;
	width: 100%;
	display: block;
	background-color: #184387;
	position: absolute;
	top: -5px;
	left: 0px;
}

.container_top > *
{
	display: inline-table;
	vertical-align: top;
}
.container_top > div
{
	padding: 3px 3%;
}
.container_top > div > *
{
	line-height: 25px;
	color: #fff;
	padding-left: 5px;
}
.container_top > div > span
{
	font-size: 12px;
}
.social
{
	margin:0;
	padding:3px 0;
}
.social > li
{
	margin: 0;
	padding: 0;
	list-style: none;
	display: inline-block;
	vertical-align: top;
}
.social > li > a
{
	width: 25px;
	height: 25px;
	text-align: center;
	border-radius: 50%;
	background-color: #2a2a2b;
	display: inline-block;
}
.social > li > a > .fa
{
	font-size: 15px;
	color: #fff;
	line-height: 25px;
}
.social > li > a.twitter:hover
{
	background-color: #55acee;
}
.social > li > a.skype:hover
{
	background-color: #00aff0;
}
.social > li > a.linkedin:hover
{
	background-color: #0976b4;
}
.social > li > a.googleplus:hover
{
	background-color: #dd4b39;
}
.social > li > a.facebook:hover
{
	background-color: #3b5998;
}
.social > li > a.pinterest:hover
{
	background-color: #cb2027;
}

/*LOGO*/
#logo
{
    z-index: 99;
    padding: 0;
    margin: 0;
    display: inline-block;
    position: absolute;
}
#logo > a
{
	display: block;
	margin: 0 auto;
	padding: 0;
}
#logo > a > img
{
	width: 285px;
	max-width: 285px;
}
.container
{
	width: 90%;
	margin: 0 auto;
	max-width: 1450px;
}

/*²*/
.element
{
	background-color: #fff;
	border: 1px solid #fff;
	margin-bottom: 20px;
	clear: both;
}
.element#contenu
{
	padding: 20px 30px;
}
#content
{
	vertical-align: top;
	position: relative;
	width: 64%;
	font-size: 14px;
	padding: 0px 1% 25px 1%;
	line-height: 24px;
	display: inline-block;
	padding: 0;
	margin: 0;
}
#content img
{
	margin: 5px;
}
#content img[align='left']
{
	margin: 5px 5px 5px 0;
}
#content img[align='right']
{
	margin: 5px 0 5px 5px;
}
#content img[align='absmiddle']
{
	margin: 5px;
}
#content > #search
{
	display: block;
	position: absolute;
    top: 0;
    right: 0;
    width: 37%;
    margin-right: 15px;
}
.sous_pages
{
	margin: 0;
	padding: 0;
	display: inline-block;
	/*text-align: center;*/
	/*border-top: 4px solid #184387;*/
	/*border-bottom: 4px solid #184387;*/
}
.sous_pages > li
{
	list-style: none;
	padding: 0;
	/*display: inline-block;*/
	width: 100%;
	/*margin: 1%;*/
}
.sous_pages > li > a
{
	text-decoration: none;	
	background-color: #333;
	display: inline-block;
	width: 100%;
	padding: 4px 10px;
	color: #fff;
	border-left: 4px solid transparent;
	border-bottom: 1px solid transparent;
}
.sous_pages > li > a:hover,
.sous_pages > li > a.select
{
	color: white;
	background-color: #184387!important;
}
#slider_accueil img,
#slider_galerie img
{
	margin: 0;	
}
#slider_galerie li img
{
	vertical-align: middle;
}
#slider_galerie li > a
{
	display: inline-block;
	height: 100%;
}
#slider_galerie li > a:before
{
	content: "";
	display: inline-block;
	vertical-align: middle;
	height: 100%;
	border: 1px solid transparent;
}
#slider_adherent
{
	margin-bottom: 35px;
}
#slider_adherent, #slider_adherent > ul, #slider_adherent > ul > li
{
	height: 350px;
}
#slider_adherent > ul, #slider_adherent > ul > li
{
	width: 100%;
}
#slider_adherent > ul > li
{
	background-size: contain;
    background-position: 50% 50%;
    background-repeat: no-repeat;
}

#baniere
{
	height: 165px;
	width: 100%;
	background-size: cover;
	background-position: 50% 50%;
	box-shadow: 0 2px 2px rgba(0,0,0,0.1);
}
#header
{
	position: absolute;
	top: 35px;
	left: 0px;
	right: 0px;
}

#header + .container,
#slider_accueil + .container,
#baniere + .container
{
	font-size: 0px;
	padding-bottom: 35px;
	font-size: 0px;
	margin-top: 20px;
	position: relative;
	z-index: 99;
}
#header + hr
{
	margin: 30px 0 15px;
	border-bottom: 1px solid rgba(102, 102, 102, 0.2);
}

/*MENU*/
#menu
{
	padding: 0;
    display: inline-block;
    z-index: 999;
    width: 100%;
    text-align: right;
    padding: 8px 0;
    position: relative;
}
#menu > ul
{
	margin: 0;
	padding: 0;
	margin-top: 20px;
	list-style: none;
}
#menu > ul > li
{
	position: relative;
	display: inline-block;
	vertical-align: top;
	*float: left;/*IE7*/
}
#menu > ul > li > a
{
	display: block;
	text-decoration: none;
	color: white;
	font-size: 18px;
	font-family: open-sans;
	font-weight: bold;
	padding-bottom: 10px;
	position: relative;
	overflow: hidden;
    padding: 6px 20px 6px 10px;
    margin: 0px;
    background-color: #fff;
}

#menu > ul > li:first-child   > a { background-color: #184387; color: white; border-color: white; }
#menu > ul > li:nth-child(2)  > a { background-color: #5BA097; color: white; border-color: white; }
#menu > ul > li:nth-child(3)  > a { background-color: #443078; color: white; border-color: white; }
#menu > ul > li:nth-child(4)  > a { background-color: #E93C89; color: white; border-color: white; }
#menu > ul > li:nth-child(5)  > a { background-color: #EE7F2D; color: white; border-color: white; }
#menu > ul > li:nth-child(6)  > a { background-color: #950622; color: white; border-color: white; }
#menu > ul > li:nth-child(7)  > a { background-color: #32953D; color: white; border-color: white; }
#menu > ul > li:nth-child(8)  > a { background-color: #d7b100; color: white; border-color: white; }
#menu > ul > li:nth-child(9)  > a { background-color: #ff5722; color: white; border-color: white; }
#menu > ul > li:nth-child(10) > a { background-color: #00bcd4; color: white; border-color: white; }
#menu > ul > li:nth-child(11) > a { background-color: #4caf50; color: white; border-color: white; }
#menu > ul > li:nth-child(12) > a { background-color: #ff9800; color: white; border-color: white; }


#menu > ul > li:first-child:hover > a { background-color: #fff;border-bottom: 6px solid #184387; color: #184387; }
#menu > ul > li:nth-child(2):hover > a { background-color: #fff;border-bottom: 6px solid #5BA097; color: #5BA097; }
#menu > ul > li:nth-child(3):hover > a { background-color: #fff;border-bottom: 6px solid #443078; color: #443078; }
#menu > ul > li:nth-child(4):hover > a { background-color: #fff;border-bottom: 6px solid #E93C89; color: #E93C89; }
#menu > ul > li:nth-child(5):hover > a { background-color: #fff;border-bottom: 6px solid #EE7F2D; color: #EE7F2D; }
#menu > ul > li:nth-child(6):hover > a { background-color: #fff;border-bottom: 6px solid #950622; color: #950622; }
#menu > ul > li:nth-child(7):hover > a { background-color: #fff;border-bottom: 6px solid #32953D; color: #32953D; }
#menu > ul > li:nth-child(8):hover > a { background-color: #fff;border-bottom: 6px solid #d7b100; color: #d7b100; }
#menu > ul > li:nth-child(9):hover > a { background-color: #fff;border-bottom: 6px solid #ff5722; color: #ff5722; }
#menu > ul > li:nth-child(10):hover > a { background-color: #fff;border-bottom: 6px solid #00bcd4; color: #00bcd4; }
#menu > ul > li:nth-child(11):hover > a { background-color: #fff;border-bottom: 6px solid #4caf50; color: #4caf50; }
#menu > ul > li:nth-child(12):hover > a { background-color: #fff;border-bottom: 6px solid #ff9800; color: #ff9800; }

#menu > ul > li:hover > a
{
}

#menu > ul > li > a > .fa
{
	line-height: 25px;
	font-size: 22px;
}
#menu > ul > li > a > .fa-angle-down
{
	font-size: 12px;
	position: absolute;
	right: 0px;
	top: 50%;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
    transition: top 0.3s;
    padding-right: 6px;
}
#menu > ul > li:hover > a > .fa-angle-down.down1
{
	top: 120%;
}
#menu > ul > li > a > .fa-angle-down.down2
{
	top: -20%;
}
#menu > ul > li:hover > a > .fa-angle-down.down2
{
	top: 50%;
}
#menu > ul > li:hover > a, 
#menu > ul > li.select > a
{
	/*color: #184387!important;*/
}

#menu > ul > li > ul
{
	display: none;
	position: absolute;
	background-color: #f9f9f9;
	text-align: left;
	padding: 0;
	z-index: 3;
	list-style: none;
}
#menu > ul > li > ul > li
{
	white-space:nowrap;
}
#menu > ul > li > ul > li > a
{
	padding: 5px;
	display: block;
	color: #666;
	font-size: 15px;
	font-family: avantgarde_bk_btbook;
	text-decoration: none;
	
	white-space: nowrap;
}
#menu > ul > li > ul > li:hover > a, 
#menu > ul > li > ul > li > a.select
{
	color: #184387;
	/*color:#FFFFFF;*/
}

/*SLIDER*/
#slider
{
	margin: -10px 0 0 -10px;
	
	width: 710px;
	height: 300px;
	z-index: 1;
}
#slider_accueil
{
	overflow: hidden;
	margin-left: auto;
	margin-right: auto;
	position: relative;
	width: 100%!important;
	height: 165px;
	z-index: 1;
	box-shadow: 0 2px 2px rgba(0,0,0,0.1);
}
#slider_accueil > ul
{
	top: 0;
	width: 100%;
	height: 100%!important;
}
#slider_accueil > ul li
{
	background-position: 50% 50%;
	background-size: auto 100%;
	background-repeat: no-repeat;
	width: 100%;
	height: 100%!important;
}
#slider_accueil > ul > li > div
{
	position: absolute;
	bottom: 0;
	background: rgba(0,0,0,0.5);
	color: #FFFFFF;
	padding: 5px;
	width: 100%;
	text-shadow: 1px 1px 0 rgba(0,0,0,0.5);
}

#slider_accueil .boutonsPagination
{
	right: inherit!important;
	left: 50%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	-o-transform: translateX(-50%);
}
#slider_accueil .boutonPagination
{
	width: 15px!important;
	height: 15px!important;
	border: 2px solid #184387!important;
	opacity: 1!important;
	background-color: transparent!important;
}

#slider_accueil .boutonPagination.select
{
	background: #184387!important;
}
/*#slider_accueil div:nth-child(4),
#slider_accueil div:last-child
{
	background-color: transparent!important;
	box-shadow: none!important;
	text-shadow: none!important;
	color: #184387!important;
	font-size: 62px!important;
	font-family: roboto!important;
}*/

.titreSlider
{
	display: block;
	font-size: 25px;
	text-transform: uppercase;
	padding: 1%;
	color: #f34337;
	font-weight: 700;
}

#slider_galerie
{
	overflow: hidden;
	margin-left: auto;
	margin-right: auto;
	margin-top: 40px;
	width: 100%;
	height: 150px;
}
#slider_galerie li
{
	margin: 0 2px;	
	display: table-cell;
}
#partenairesHome
{
	margin-top: 40px;
	position: relative;
}
#partenairesHome > span
{
	position: absolute;
}
#partenaires-liste
{
	padding-left: 0px;
	font-size: 0px;
}
#partenaires-liste > a
{
	color: white;
}
#partenaires-liste li
{
	display: inline-block;
	vertical-align: top;
	width: 30.333333%;
	height: 315px;
	margin: 1.5%;
	box-sizing: border-box;
	position: relative;
	background-color: white;
}
#partenaires-liste li > h2
{
	position: relative;
	z-index: 5;
	margin: 0px;
	padding: 5px 0px 5px 5px;
    transition: padding ease 0.3s;
    -webkit-transition: padding ease 0.3s;
    -moz-transition: padding ease 0.3s;
    -ms-transition: padding ease 0.3s;
    -o-transition: padding ease 0.3s;
    border-bottom: none;
    background-color: rgba(24, 67, 135, 0.75);
    color: white;
    text-shadow: 1px 1px 9px #0e0e0e;
}
#partenaires-liste li:hover > h2
{
	padding: 15px 0px 5px 5px;
}
#partenaires-liste li > .photo
{
	width: 100%;
	height: 232px;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: 50% 50%;
}
#partenaires-liste li > span
{
	position: absolute;
	bottom: 0%;
	left: 0%;
	right: 0%;
    background-color: rgba(24, 67, 135, 0.75);
    color: white;
    display: block;
    text-align: center;
    font-size: 17px;
    transition: padding ease 0.3s;
    -webkit-transition: padding ease 0.3s;
    -moz-transition: padding ease 0.3s;
    -ms-transition: padding ease 0.3s;
    -o-transition: padding ease 0.3s;
}
#partenaires-liste li:hover > span
{
	padding: 7.5px 0px;
}
#partenaires-liste li > .overlay
{
	position: absolute;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	opacity: 0;
	background-color: rgba(0, 0, 0, 0.45);
	transition: opacity ease-in-out 0.25s;
}
#partenaires-liste li:hover > .overlay
{
	opacity: 1;
}
#expressions-liste
{
	padding-left: 0px;
	font-size: 0px;
}
#expressions-liste a
{
	color: white;
}
#expressions-liste li
{
	display: inline-block;
	vertical-align: top;
	width: 30.333333%;
	height: 315px;
	margin: 1.5%;
	box-sizing: border-box;
	position: relative;
	background-color: white;
}
#expressions-liste li > h2
{
	position: relative;
	z-index: 5;
	margin: 0px;
	padding: 5px 0px 5px 5px;
    transition: padding ease 0.3s;
    -webkit-transition: padding ease 0.3s;
    -moz-transition: padding ease 0.3s;
    -ms-transition: padding ease 0.3s;
    -o-transition: padding ease 0.3s;
    border-bottom: none;
    background-color: rgba(24, 67, 135, 0.75);
    color: white;
    text-shadow: 1px 1px 9px #0e0e0e;
}
#expressions-liste li:hover > h2
{
	padding: 15px 0px 5px 5px;
}
#expressions-liste li > .photo
{
	width: 100%;
	height: 232px;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: 50% 50%;
}
#expressions-liste li > span
{
	position: absolute;
	bottom: 0%;
	left: 0%;
	right: 0%;
    background-color: rgba(24, 67, 135, 0.75);
    color: white;
    display: block;
    text-align: center;
    font-size: 17px;
    transition: padding ease 0.3s;
    -webkit-transition: padding ease 0.3s;
    -moz-transition: padding ease 0.3s;
    -ms-transition: padding ease 0.3s;
    -o-transition: padding ease 0.3s;
}
#expressions-liste li:hover > span
{
	padding: 7.5px 0px;
}
#expressions-liste li > .overlay
{
	position: absolute;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	opacity: 0;
	background-color: rgba(0, 0, 0, 0.45);
	transition: opacity ease-in-out 0.25s;
}
#expressions-liste li:hover > .overlay
{
	opacity: 1;
}

#agenda
{
	position: relative;
}
#agenda > div
{
	height: 358px;
}
#agenda > div > ul
{
	width: 100%;
	height: 358px!important;
}
#agenda > div > ul > li
{
	width: 100%;
	height: 318px!important;
}
#agenda > div > ul > li > ul
{
	padding: 20px 45px;
	list-style: none;
	font-size: 0px;
	text-align: center;	
	height: 318px;
}

#agenda > div > ul > li > ul > li
{
	position: relative;
	display: inline-block;
	vertical-align: top;
	font-size: 15px;
	width: 31.3333%;
	height: 318px;
	/*background-size: cover;
	background-position: 50% 50%;*/
	background-size: contain;
    background-position: 50% 25%;
    background-repeat: no-repeat;
    background-color: #FFF;
	margin-bottom: 0px;
}
#agenda > div > ul > li > a
{
	text-decoration: none;
    display: inline-block;
    height: 100%;
    width: 100%;
}
#agenda > div > ul > li > ul > li > a > div
{
	position: absolute;
	bottom: 0px;
	left: 0px;
	right: 0px;
	background-color: white;
	line-height: 35px;
}
#agenda > div > ul > li > ul > li h3
{
	font-size: 15px;
	line-height: 20px;
	padding: 0 5px;
}
#agenda > div > ul > li > ul > li h3 + span:hover
{
	font-weight: bold;
}
#agenda > div > ul > li > ul > li:nth-child(even)
{
	margin: 0px 3%;
}
.date_agenda
{
	position: absolute;
	left: 0px;
	top: 5px;
	border-radius: 0px 10px 10px 0px;
	background-color: white;
	padding: 1px 10px 0 10px;
	color: white;
	font-size: 16px;
	background-color: #184387;
}

.fev { background-color: #a8238c; }
.mar { background-color: #d39e24; }
.avr { background-color: #94604e; }
.mai { background-color: #bfc12f; }
.jun { background-color: #b0247b; }
.jui { background-color: #328e39; }
.aou { background-color: #7689ef; }
.sep { background-color: #2bb2f2; }
.oct { background-color: #2ed82c; }
.nov { background-color: #ffb734; }
.dec { background-color: #871818; }

/*Pagination*/
.g-recaptcha
{
	width: 100%!important;
}
.g-recaptcha > div
{
	margin: 0 auto;
}
form
{
	display: inline;
}
.pagination
{
	margin-top: 10px;	
}
.pagination input
{
	display: inline-block;
    width: 40px;
    padding: 9px 5px 8px 5px;
    margin: 1px;
    height: initial;
    text-align: center;
}
.pagination a
{
	display: inline-block;
	padding: 5px 10px;
	margin: 1px;
	border-radius: 3px;	
	background: #E8E8E8;
	text-decoration: none;
	font-size: 16px;
	font-weight: bold;
	color: #000000;
}
.pagination a:hover
{
	background: #1888AD;
	color: #FFFFFF;
}
.pagination a:active
{
	background: #E8E8E8;
	color: #000000;
}
.pagination a.disabled
{
	background: #E8E8E8;
	color: #CCCCCC;
}

/*CONTENU*/
#nuage_liens
{
	text-align: center;
	color: #999999;
}

/*ASIDE (GAUCHE OU DROITE)*/
#aside
{
	position: relative;
	width: 32%;	
	vertical-align: top;
	margin-left: 3%;
	display: inline-block;
	text-align: center;
	font-size: 15px;
}
#aside #search,
.element#search
{
	padding: 20px 0px;
	background-color: transparent;
	border: none;
	text-align: center;
}
#aside #mag a
{
	text-decoration: none;
	display: inline-block;
}
#aside #mag iframe
{
	margin: 10px 0px;
}
#aside #mag iframe + div
{
	font-size: 18px;
	margin-bottom: 10px;
}
#raccourcis_bouton > div > ul
{
    margin: 13px 0 9px;
    padding: 0;
    width: 100%;
}
#raccourcis_bouton > div > ul > li
{
    list-style: none;
    margin-right: 0;
    width: 32%;
    display: inline-block;
    vertical-align: middle;
}
#raccourcis_bouton > div > ul > li > a
{
	text-align: center;
	text-decoration: none;
}
#raccourcis_bouton > div > ul > li > a:hover > span.li_font > i
{
	filter: saturate(50%);
}
#raccourcis_bouton > div > ul > li > a > span.li_font
{
	color: #fff;
    text-align: center;
    display: block;
}
#raccourcis_bouton > div > ul > li > a >  span.li_font > i
{
	padding: 20px 0 0 0;
    border-radius: 50%;
    font-size: 26px;
    filter: saturate(100%);
	width: 69px;
    height: 69px;
}
.association-pratiques >  span.li_font > i { background-color: #E93C89; }
.association-pratiques >  .li_text { color: #E93C89 !important; }

.entreprise-pratiques >  span.li_font > i { background-color: #67B0D9; }
.entreprise-pratiques >  .li_text { color: #67B0D9 !important; }

.commercant-pratiques >  span.li_font > i { background-color: #950622; }
.commercant-pratiques >  .li_text { color: #950622 !important; }

.sante-pratiques >  span.li_font > i { background-color: #EE7F2D; }
.sante-pratiques >  .li_text { color: #EE7F2D !important; }

.numeros-pratiques >  span.li_font > i { background-color: #E5413B; }
.numeros-pratiques >  .li_text { color: #E5413B !important; }

.demarche-pratiques >  span.li_font > i { background-color: #4B2D0F; }
.demarche-pratiques >  .li_text { color: #4B2D0F !important; }

.scolaire-pratiques >  span.li_font > i { background-color: #E93C89; }
.scolaire-pratiques >  .li_text { color: #E93C89 !important; }

.fb-pratiques >  span.li_font > i { background-color: #3B5998; }
.fb-pratiques >  .li_text { color: #3B5998 !important; }

.insta-pratiques >  span.li_font > i { background-color: #30618A; }
.insta-pratiques >  .li_text { color: #30618A !important; }

.culture-pratiques >  span.li_font > i { background-color: #443078; }
.culture-pratiques >  .li_text { color: #443078 !important; }

.location-de-salle >  span.li_font > i { background-color: #f6c810; }
.location-de-salle >  .li_text { color: #f6c810 !important; }

#raccourcis_bouton > div > ul > li > a >  span.li_text
{
	color: #f6c810;
    font-size: 15px;
    text-align: center;
    width: 100%;
    padding: 10px 0 25px;
    display: block;
}
#aside #info
{
	text-align: left;
	font-size: 17px;
	padding-bottom: 0px;
}
#aside #info label,
#aside #info span
{
	display: inline-block;
	vertical-align: top;
}
#aside #info > div
{
	padding: 10px 4%;
}
#aside #info > div > div
{
	margin-bottom: 8px;
}
#aside #info i
{
	font-size: 20px;
}
#aside #info label i
{
	padding-right: 10px;
}
#aside #info > a:last-child
{
	text-decoration: none;
	margin: 10px 0px;
	display: block;
	text-align: center;
}
#aside #info > a:last-child:hover
{
	font-weight: bold;
}
.button
{
	border: none;
    background-color: #184387;
    color: white;
    padding: 7px 14px;
    font-size: 18px;
    cursor: pointer;
}
.button:hover
{
	opacity: 0.9;
}
#aside #mag {
    padding-bottom: 20px;
}
#aside .element input[type="text"],
.element#search input[type="text"]
{
	width: 70%;
	height: 35px;
}
#aside #liens_utiles ul
{
	padding-left: 23px;
    list-style: none;
    text-align: left;
    font-size: 18px;
    line-height: 31px;
}
#aside #liens_utiles ul > li:before
{
	content: "\f144 ";
	display: inline-block;
    font: normal normal normal 14px/1 'Font Awesome 5 Pro';
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    color: #184387;
    padding-right: 6px;
}
#aside #liens_utiles ul > li > a
{
	text-decoration: none;
}
.titre-bloc
{
	background-color: #3e3d3d;
	color: white;
	margin: 0px;
	font-size: 28px;
	padding: 20px 0px 20px 20px;
	text-align: left;
}
.titre-bloc.inverse
{
	background-color: #e4e4e4;
	color: #184387;
}
.titre-bloc.covid-19 {
    background-color: #d24040;
    color: #fff;
}
.button.covid-19 {
    border: none;
    background-color: #d24040;
    color: white;
    padding: 7px 14px;
    font-size: 18px;
    cursor: pointer;
}
.covid-19-bloc > a
{
	color: #fff !important;
}
#aside .element > h2
{
	margin: 0px 0px 0 0px;
}
#aside > div:first-child
#aside > ul
{
	list-style: none;
	margin: 15px 0 15px 4px;
	padding: 0;
}
#aside > ul > li
{
	width: 251px;
}
#aside > ul > li > a
{
	display: block;
	text-decoration: none;
	padding: 8px;
	margin: 5px 0;
	border-left: 1px solid #500050;
	border-top: 1px solid #500050;
	border-bottom: 1px solid #500050;
	border-radius: 3px 0 0 3px;
	color: #FFFFFF;
	text-align: center;
	box-shadow: 0 2px 2px rgba(0,0,0,0.3);
	text-shadow: 1px 1px 0 rgba(0,0,0,0.5);
}
#aside > ul > li > a:hover
{
	background: #701374;
}
#aside .bloc:last-child
{
	border-bottom: none;
}
#aside .bloc:first-child
{
	padding-top: 0;
}

#result-search
{
	padding-left: 0px;
	list-style: none;
} 
#result-search > li
{
	position: relative;
    padding: 15px 0px 15px 10px;
    background-color: #e4e4e4;
    margin-left: 35px;
    margin-bottom: 10px;
    border: 1px solid #d2d2d2;
}
#result-search > li > i
{
	position: absolute;
    top: calc(50% - 15px);
    left: -30px;
    color: #184387;
    font-size: 30px;
}

/*FOOTER*/
#footer
{
	position: relative;
	width: 100%;
	background-color: #2e3537;
	color: #FFFFFF;
	text-shadow: 1px 1px 0 rgba(0,0,0,0.5);
	font-size: 12px;
	background-image: url(../img/map-footer.jpg);
	background-size: cover;
	background-position: 50% 50%;
}
#footer a
{
	text-decoration: none;
	color: #FFFFFF;
}
#footer .container
{
	text-align: center;
	font-size: 15px;
}
#footer img
{
    margin: 10px 0px 0px 12%;
    max-width: 200px;
}
#footer a:hover
{
	text-decoration: underline;
}
#footer #infos_site
{
	padding: 10px;
}
#footer #infos_complementaires
{
	text-align: right;
}
#footer #info-footer
{
    text-align: center;
    background-color: #184387;
    font-size: 16px;
    padding: 15px 10px;
}



/*DIVERS PROPRE AU SITE*/
.bloc
{
	border-radius: 3px;
	width: 100%;
	height: 120px;
	color: #FFFFFF;
	text-decoration: none;
	margin: 0!important;
	padding-top: 30px;
}
.bloc.video
{
	display: inline-block;
	width: 320px;
	height: 240px;
	margin: 0 0 5px 12px;
	padding: 5px;
}
.bloc h2
{
	text-decoration: none;
	margin-top: 15px;
	letter-spacing: -1px;
	text-transform: uppercase;
	font-size: 26px;
	font-weight: 100;
}
#promo-slider
{
	height: 275px;
	width: 30%;
	display: inline-block;
	vertical-align: top;
	margin-left: 5%;
	text-align: center;
}
#promo-slider > ul, #promo-slider > ul > li
{
	width: 100%;
	height: 100%;
}
#promo-slider > ul > li
{
	background-repeat: no-repeat;
	background-position: 50% 50%;
	text-align: left;
	position: relative;
	background-size: contain;
}
#promo-slider > ul > li p
{
	font-size: 15px;
	margin: 0px;
    line-height: 22px;
    max-height: 65px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}
#promo-slider > ul > li i
{
	font-size: 12px;
	font-weight: bold;
	display: block;
	padding-bottom: 3px;
}
#promo-slider > ul > li > a > div
{
	padding: 5px 25px;
	background-color: rgba(244, 67, 54, 0.78);
	position: absolute;
	bottom: 0px;
	margin: 0px;	
	width: 100%;
}
#promo-slider  h3
{
	text-align: center;
    padding: 5px 0px;
    font-size: 19px;
}
#promo-slider a
{
	text-decoration: none;
	color: white;
	display: inline-block;
	width: 100%;
	height: 100%;
}
#promo-slider.promo-aside
{
	width: 100%;
	margin-left: 0px;
	padding-bottom: 0px;
	height: 400px;
}


#promo-slider.promo-aside p
{
	position: static;
	display: inline-block;
	vertical-align: middle;
}
#promo-slider.promo-aside img
{
	height: 185px;
	display: block;
	margin: 0 auto;
}
#promo-slider.promo-aside > ul > li > a > div
{
	height: 175px;
}
#promo-slider.promo-aside > ul > li > a > div:after
{
	content: '';
	height: 100%;
	display: inline-block;
	vertical-align: middle;
}
#promo-slider.promo-aside > ul > li > a > div > p
{
	max-height: inherit;
	-webkit-line-clamp: 6;
}
#actu-slider 
{
	position: relative;
	background-color: #fff;
	width: 48%;
    display: inline-block;
    margin: 0 3px 15px;
}

#actu-slider > a,
#agenda > a
{
	position: absolute;
	top: 23px;
	color: #6e6e6e;
	right: 15px;
    text-decoration: none;
    font-size: 15px;
}
#actu-slider > a:hover,
#agenda > a:hover
{
	border-bottom: 1px dashed;
}
#actu-slider > div
{
	width: 100%;
	margin-bottom: 20px;
	height: 318px;
	padding: 20px 35px;
	display: inline-block;
	vertical-align: top;
}
#actu-accueil
{
	padding-left: 0px;
	margin: 0px;
	width: calc(100% - 70px);
}
#actu-accueil + div,
#actu-accueil + div + div,
#agenda > div > ul + div,
#agenda > div > ul + div + div,
#slider_adherent > ul + div,
#slider_adherent > ul + div + div
{
	border: none!important;
	opacity: 1!important;
	font-size: 0px!important;
	height: 100%!important;
	width: 35px!important;
	top: 0px!important;
	margin: 0!important;
	background-color: #fff!important;
	border-radius: 0px!important;
    box-shadow: none!important;
	color: #184387!important;
}
#actu-accueil + div:after,
#actu-accueil + div + div:after,
#agenda > div > ul + div:after,
#agenda > div > ul + div + div:after,
#slider_adherent > ul + div:after,
#slider_adherent > ul + div + div:after
{
	content: "\f054";
	display: block;
	position: absolute;
	top: 50%;
	left: 50%;
	font-size: 30px!important;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%) translateX(-50%);
	-moz-transform: translateY(-50%) translateX(-50%);
	-ms-transform: translateY(-50%) translateX(-50%);
	-o-transform: translateY(-50%) translateX(-50%);
	display: inline-block;
    font: normal normal normal 28px/1 'Font Awesome 5 Pro'!important;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
}
#actu-accueil + div:after,
#agenda > div > ul + div:after,
#slider_adherent > ul + div:after
{
	content: "\f053";
}
#actu-accueil + div:hover,
#actu-accueil + div + div:hover,
#agenda > div > ul + div:hover,
#agenda > div > ul + div + div:hover,
#slider_adherent > ul + div:hover,
#slider_adherent > ul + div + div:hover
{
	/*opacity: 0.6!important;*/
	color: #3269c1!important;
}
#actu-accueil + div
{
	left: 0px!important;
}
#actu-accueil + div + div
{
	right: 0px!important;
}
#actu-accueil > li
{
	display: inline-block;
	vertical-align: top;
	font-size: 0px;
	width: 100%;
}
#actu-accueil > li > a
{
	text-decoration: none;
	color: black;
}
#actu-accueil > li > a > div,
#liste-asso > ul > li > a > div
{
	display: inline-block;
	vertical-align: top;
	font-size: 15px;
	width: 50%;
}
#actu-accueil > li > a > div > div,
#liste-asso > ul > li > a > div > div
{
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 5;
    -webkit-box-orient: vertical;
    margin: 17px 0px;
    line-height: 22px;
    height: 115px;
    text-align: left;
}
#actu-accueil > li h2,
#liste-asso h2
{
	margin-top: 15px;
	text-align: left;
}
#actu-accueil > li div > i
{
	font-size: 12px;
	color: grey;
}
#actu-accueil > li > a span,
#liste-asso > ul > li > a span
{
	font-size: 18px;
	color: #184387;
}
#actu-accueil .button
{
	float: right;
}
#actu-accueil > li > a span:hover
{
	border-bottom: 1px dashed;
}

#actu-accueil > li > a > div.pic,
#liste-asso > ul > li > a > div.pic
{
	background-image: url(../img/actu.jpg);
	background-size: contain;
	background-position: 50% 50%;
	background-repeat: no-repeat;
	height: 275px;
	overflow: hidden;
}
#liste-asso > ul > li > a > div.pic
{
	height: 225px;
}

#actu-accueil > li div.pic + div
{
	padding: 0px 20px;
}

#liste-asso
{
	display: inline-block;
	vertical-align: top;
    width: calc(100% - 180px);
    margin-left: 13px;
}
#liste-asso img
{
	margin: 0px;
}
#liste-asso > ul
{
	margin: 0px;
	padding-left: 0px;
	list-style: none;
}
#liste-asso > ul > li
{
	font-size: 0px;
	background-color: #333333;
	margin-bottom: 15px;
}
#liste-asso > ul > li > a
{
	color: white;
}
#liste-asso h3
{
	padding-left: 15px;
    font-size: 18px;
    padding: 13px 0px 13px 20px ;
}
#liste-asso h3 + div
{
	padding: 0px 20px;
}
#liste-asso > ul > li > a span
{
	display: block;
	text-align: right;
}
#liste-asso > ul > li > a span:hover
{
	color: rgb(255, 151, 143);
}

#mag-liste > ul
{
	list-style: none;
	margin: 0;
	padding: 0;
	text-align: center;
}
#mag-liste > ul > li
{
	margin: 5px;
	padding: 0;
	display:  inline-block;
	text-align: center;
}
#mag-liste > ul > li > h2
{
	font-size: 16px;
	text-align: center;
}

#actualites.bloc ul li a i
{
	font-size: 12px;
	display: block;
	text-align: right;
	font-style: normal;
}

#info-asso, 
#horaire-asso
{
	display: inline-block;
	vertical-align: top;
	width: 47.5%;
	font-size: 15px;
	min-height: 220px;
	overflow: hidden;
}
#info-asso
{
	margin-right: 5%;
}

#info-asso > div, 
#horaire-asso > div
{
	padding: 20px;
}

#info-asso h3, 
#horaire-asso h3
{
	text-align: center;
	padding-left: 5px;
	font-size: 20px;
}
#desc-asso
{
	font-size: 0px;
	padding: 10px;
}
#desc-asso > *
{
	display: inline-block;
	vertical-align: top;
	font-size: 15px;
}
#desc-asso > div
{
	width: 57%;
}
#desc-asso > img
{
	max-width: 40%;
	margin-right: 1%;
}

#actualites.bloc, 
#temoignages.bloc
{
	position: relative;
	height: 250px;
	border-bottom: 1px dashed #666;
}
#actualites.bloc .slider, 
#temoignages.bloc .slider
{
	width: 100%;
	height: 160px;
}

#actualites.bloc .slider ul, 
#temoignages.bloc .slider ul
{
	width: 100%;
	height: 200px;
	
	margin: 0;
	list-style: none;
}
#actualites.bloc .slider ul li,
#temoignages.bloc .slider ul li
{
	padding: 5px 1%;
	text-align: justify;
}

#actualites.bloc a,
#temoignages.bloc a
{
	text-decoration: none;
}
#actualites.bloc a:hover,
#temoignages.bloc a:hover
{
	text-decoration: underline;
}

#actualites.bloc .slider a,
#temoignages.bloc .slider a
{
	color: #666;
	text-decoration: none;
}
#actualites.bloc .slider a:hover,
#temoignages.bloc .slider a:hover
{
	color: #666;
	text-decoration: none;
}
#liste-actu
{
	padding-left: 0px;
	list-style: none;
}
#liste-actu img
{
	max-width: 100%;
	height: inherit!important;
}
#liste-actu > li > a
{
	max-width: 50%;
}
#liste-actu > li > a,
#liste-actu > li > div
{
	vertical-align: top;
	padding: 10px;
}
#liste-actu > li > a
{
	float: left;
}
#videos.bloc
{
	height: 250px;
	border-bottom: 1px dashed #666;
}
#videos.bloc a
{
	display: block;
	margin: 5px 0;
	text-decoration: none;
	text-align: center;
	line-height: 30px;
}
#videos.bloc a:hover
{
	text-decoration: underline;
}

#langs
{
	float:right;
}

#langs > div
{
	display:inline-block;
}

#langs > div:hover
{
	opacity:0.5
}
.menuMobile
{
	display: none;
	position: absolute;
	top: 40px;
	right: 5%;
	cursor: pointer;
	font-size: 17px!important;
}
#menu_1
{
	display: block;
	/*height: auto!important;*/
}
.galerie table,
.contact table 
{
	display: block;
}
.galerie tbody,
.contact tbody 
{
	display: block;
}
.galerie tr
{
	display: block;
	text-align: center;
}
.galerie td
{
	display: inline-block;
	padding-left: 1%;
}
.galerie td > a
{
	width: 100%!important;
	padding: 0 !important;
	display: block !important;
	position: relative;
	overflow: hidden;
	text-decoration: none
}
.galerie td > a > span
{
	position: absolute;
	width: 100%;
	height: 50%;
	left: 0;
	transition:top 0.3s,bottom 0.3s;
	background-color: rgba(0, 0, 0, 0.3);
	border: none;
}
.overlay_top
{
	top: -51%;
}
.galerie td > a:hover > .overlay_top
{
	top: 0%;
}
.overlay_bottom
{
	bottom: -50%;
}
.galerie td > a:hover > .overlay_bottom
{
	bottom: 0%;
}
.galerie td > a
{
	background-color: #FFF;
}
.galerie td > a > img
{
	border: 1px solid rgba(50, 50, 50, 0.1);
	border-bottom: none;
	width: 300px;
	object-fit: contain;
}
.galerie td > a > *
{
	margin: 0!important;
}
.galerie td > a > h2
{
	background-color: #323232;
	/*line-height: 30px;*/
	font-size: 15px;
	letter-spacing: 1px;
	position: relative;
	z-index: 1;
	width: 300px;
	color: #fff;
	border-left: 1px solid rgba(50, 50, 50, 0.1);
	border-right: 1px solid rgba(50, 50, 50, 0.1);

	height: 60px;
    display: flex;
    justify-content: center;
    align-items: center;
}

#galerie-liste
{
	padding-left: 0px;
	width: 100%;
	list-style: none;
	font-size: 0px;
}
#galerie-liste > li
{
	display: inline-block;
	vertical-align: top;
	width: 19.25%;
	margin: 0.25%;
	position: relative;
	overflow: hidden;
}
#galerie-liste > li > a
{
	display: block;
}
#galerie-liste > li > a >.mask
{
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.7);
	position: absolute;
	top: 100%;
	opacity: 0;
	animation: 0.15s forwards linear;
	-webkit-animation: 0.15s forwards linear;
}
#galerie-liste > li > a >.mask > i
{
	font-size: 45px;
	color: white;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translateX(-50%) translateY(-50%);
	-webkit-transform: translateX(-50%) translateY(-50%);
}
#galerie-liste > li > a >.mask > span
{
	font-size: 15px;
	display: block;
	width: 95%;
	color: white;
	position: absolute;
	left: 50%;
	text-align: center;
	top: 50%;
	transform: translateX(-50%) translateY(-50%);
	-webkit-transform: translateX(-50%) translateY(-50%);
}
#galerie-liste > li > a >.mask > span > i
{
	font-size: 45px;
}
@keyframes in-top
{
	0% { top: -100%; left: 0%; opacity: 1; }
	100% { top: 0%; left: 0%; opacity: 1; }
}
@keyframes in-bottom
{
	0% { top: 100%;	left: 0%; opacity: 1; }
	100% { top: 0%; left: 0%; opacity: 1; }
}
@keyframes in-right
{
	0% { top: 0%; left: 100%; opacity: 1; }
	100% { top: 0%;	left: 0%; opacity: 1; }
}
@keyframes in-left
{
	0% { top: 0%; left: -100%; opacity: 1; }
	100% { top: 0%;	left: 0%; opacity: 1; }
}
#galerie-liste > li > a > .mask.in-top
{
	animation-name: in-top;
	-webkit-animation-name: in-top;
}
#galerie-liste > li > a > .mask.in-bottom
{
	animation-name: in-bottom;
	-webkit-animation-name: in-bottom;
}
#galerie-liste > li > a > .mask.in-right
{
	animation-name: in-right;
	-webkit-animation-name: in-right;
}
#galerie-liste > li > a > .mask.in-left
{
	animation-name: in-left;
	-webkit-animation-name: in-left;
}

@keyframes out-top
{
	0% { top: 0%; left: 0%;	opacity: 1;	}
	100% { top: -100%; left: 0%; opacity: 1; }
}
@keyframes out-bottom
{
	0% { top: 0%; left: 0%;	opacity: 1;	}
	100% { top: 100%; left: 0%;	opacity: 1;	}
}
@keyframes out-right
{
	0% { top: 0%; left: 0%;	opacity: 1;	}
	100% { top: 0%;	left: 100%;	opacity: 1;	}
}
@keyframes out-left
{
	0% { top: 0%; left: 0%;	opacity: 1;	}
	100% { top: 0%;	left: -100%; opacity: 1; }
}
#galerie-liste > li > a > .mask.out-top
{
	animation-name: out-top;
	-webkit-animation-name: out-top;
}
#galerie-liste > li > a > .mask.out-bottom
{
	animation-name: out-bottom;
	-webkit-animation-name: out-bottom;
}
#galerie-liste > li > a > .mask.out-right
{
	animation-name: out-right;
	-webkit-animation-name: out-right;
}
#galerie-liste > li > a > .mask.out-left
{
	animation-name: out-left;
	-webkit-animation-name: out-left;
}

#galerie-liste > li img
{
	width: 100%;
	margin: 0px;
}

.msgContact
{
	width: 96%;
	margin: 0 2%;
	margin-top: 25px;
	float: left;
	box-sizing: border-box;
	moz-box-sizing: border-box;
}
.theCaptcha
{
	width: 100%!important;
	text-align: center;
	margin: 0 auto;
}
.theCaptcha > div > div > div
{
	width: 100%!important;
}
.g-recaptcha
{
	width: 100%!important;
}
.g-recaptcha > div > div
{
	margin: 0 auto;
}
.formContact > div > div
{
	float: left;
	width: 50%;
	padding:0 2%;
	margin-top: 25px;
	box-sizing: border-box;
	moz-box-sizing: border-box;
}
.formContact > center
{
	display: block;
	float: left;
	margin-top: 10px;
	width: 100%;
}
.formContact > div > div > label,
.msgContact > label
{
	display: block;
	position: relative;
}
.formContact > div > div > label:first-child
{
	margin-bottom: 6px;
	line-height: 19px;
	font-weight: 400;
}
.formContact > div > div > label > i,
.msgContact > label > i
{
	position: absolute;
	min-width: 34px;
	top: 3px;
	right: 1px;
	border-left: 1px solid #b3b3b3;
	color: #b3b3b3;
	height: 32px;
	font-size: 14px;
	text-align: center;
	line-height: 32px;
}
.msgContact > label > i
{
	top: 0;
	height: 100%;
	line-height: 120px;
}
.formContact > div > div > label > input,
.msgContact > label > textarea,
select
{
	padding: 6px 12px;
	padding-right: 46px;
	width: 100%;
	height: 34px;
	outline: none;
	font-family: arial;
	color: #555;
	box-sizing: border-box;
	moz-box-sizing: border-box;
}
.formContact > div > div:nth-child(4) > label:nth-child(2)
{
	width: 35%;
	min-width: 100px;
	display: inline-block;
	margin-right: 1%;
}
.formContact > div > div:nth-child(4) > label:last-child
{
	display: inline-block;
	width: 64%;
}
.lien_pdf
{
	display: inline-block;
	padding: 7px 12px;
	background-color: #184387;
	color: white;
}
.lien_pdf:hover
{
	
	opacity: 0.9;
}
.lien_pdf:before
{
	content: "\f1c1";
	margin-right: 4px;
	display: inline-block;
    font: normal normal normal 14px/1 'Font Awesome 5 Pro';
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    font-size: 24px;
}
#elus > .row:first-child
{
	text-align: center;
}
#elus > .row > .col-6
{
	margin: 10px 0;
}
#elus > .row > .col-6 > .elus-bloc
{
	background-color: #fff;
	border-radius: 10px;
}
#elus > .row > .col-6 > .elus-bloc > .elus-image
{
	width: 100%;
    overflow: hidden;
    position: relative;
    padding-top: 100%;
}
#elus > .row > .col-6 > .elus-bloc > .elus-image img
{
	position: absolute;
    left: 50%;
    top: 60%;
    transform: translate(-50%, -50%);
    width: 100%;
    padding: 0;
    margin: 0;
}
#elus > .row > .col-6 > .elus-bloc > .elus-nom
{
	font-weight: 600;
	font-size: 17px;
	padding: 10px 10px;
	text-align: center;
	margin: 0 auto;
}
#elus > .row > .col-6 > .elus-bloc > .elus-fonction
{
	padding: 0 10px 10px;
	height: 106px;
	display: flex;
	align-items: center;
	text-align: center;
	justify-content: center;
}


@media only screen and (max-width:1300px) {
	#menu > ul > li > a
	{
		font-size: 18px;
	}
	#actu-slider 
	{
	    width: 100%;
	    display: block;
	}
}

@media only screen and (max-width:1200px) {
	.formContact > div > div:nth-child(4) > label:nth-child(2),
	.formContact > div > div:nth-child(4) > label:last-child
	{
		width: 100%;
	}
	.container_top > div
	{
		padding: 3px 1%;
	}
	.container
	{
		width: 95%;
	}
	#menu > ul > li
	{
		padding: 10px 0 0 0;
	}
	#menu > ul > li > a
	{
		font-size: 16px;
		padding: 15px 20px;
	}
	#menu > ul > li > ul > li > a
	{
		padding: 8px;
	}
	#menu_1
	{
		height: 100%!important;
	}
}
@media only screen and (max-width:1000px) {
	.container_top > div:nth-child(2)
	{
		display: none;
	}
}
@media only screen and (max-width:980px) {
	.menuMobile
	{
		display: none;
		position: absolute;
		right: 5%;
		cursor: pointer;
		top: 40px;
		z-index: 99;
		font-size: 17px!important;
	}
	#content
	{
		width: 100%;
	}
	#content > h1
	{
		margin-top: 20px;
		text-align: left!important;
	}
	#aside
	{
		margin-left: 0px;
		width: 100%;
	}
	#logo
	{
		position: relative;
		padding: 8px 30px;
		width: 55%;
		z-index: 88;
		min-width: 280px;
	}
	#logo > img
	{
		width: 100%;
	}
	#logo > a > img
	{
		max-width: 200px;
	}
	.titre-bloc
	{
		font-size: 23px; 
	}

	.container_top > div > .menuMobile
	{
		display: block;
	    color: #fff;
	    background-color: #184387;
	    padding: 5px 12px;
	    border-radius: 3px;
	    border: 1px solid #e4e4e4;
		position: absolute;
    	top: -65px;
	}
	.home > div > h1
	{
		padding-bottom: 60px;
	}
	#content > #search
	{
		width: 100%;
		text-align: center;
		margin: 0 auto;
		top: 42px;
	}
	#menu
	{
		z-index: inherit;
	}
	#menu_1
	{
		position: fixed;
		right: 0;
		width: 200px;
		height: 100%;
		background-color: #333;
		color: #fff;
		z-index: -1;
		top: 0;
		margin-top: 0px!important;
		padding-top: 40px!important;
		overflow: auto;
	}
	#menu_1 > li
	{
		display: block!important;
	}
	#menu_1 > li > a
	{
		color: #fff!important;
		background-color: transparent!important;
	}
	#menu > ul > li > ul
	{
		position: relative;
	}
	#menu > ul > li
	{
	}
	#menu > ul > li > ul > li 
	{
		text-align: left;
	}
	#content > #search
	{
		display: block;
	}
	#aside > #search
	{
		display: none;
	}

	#contenu
	{
		word-break: break-word;
	}
	#contenu img
	{
		width: 100%;
		height: initial !important;
	}
}
@media only screen and (max-width:770px) {
	#content, #aside
	{
		display: block;
		width: 100%;
	}
	
	.container_top > div:nth-child(2),
	.social
	{
		display: none;
	}
	#header + .container, #slider_accueil + .container, #baniere + .container
	{
		margin-top: 0px;
	}
	#agenda > div > ul > li,
	#agenda > div > ul > li:nth-child(even)
	{
	    display: block;
	    width: 100%;
	    margin: 10px auto;
	}
	iframe
	{
		width: 100%!important;
	}
}
@media only screen and (max-width:480px) {

	.formContact > div > div
	{
		width: 100%;
		margin-top: 15px;
	}
	.container_top > div:nth-child(4)
	{
		display: none;
	}
	tbody, tbody > tr > td
	{
		display: block;
		width: 100%;
	}
	tbody > tr > td > div
	{
		padding: 0px; 
	}

	#agenda > div > ul > li,
	#agenda > div > ul > li:nth-child(even)
	{
		width: 100%;
	}
	#actu-accueil > li > a > div > div
	{
		display: none;
	}

	#agenda > div
	{
	    height: 1018px;
	}
	#agenda > div > ul > li > ul > li
	{
		display: block;
		margin: 0 0 5px 0!important;
		width: 100%;
	}
	#partenaires-liste li
	{
		width: 100%;
		padding: 0;
		margin: 0;
		margin-bottom: 15px;
	}
}


/* CSS Plugin Météo */

@font-face {
    font-family: 'weather';
    src: url('https://s3-us-west-2.amazonaws.com/s.cdpn.io/93/artill_clean_icons-webfont.eot');
    src: url('https://s3-us-west-2.amazonaws.com/s.cdpn.io/93/artill_clean_icons-webfont.eot?#iefix') format('embedded-opentype'),
         url('https://s3-us-west-2.amazonaws.com/s.cdpn.io/93/artill_clean_icons-webfont.woff') format('woff'),
         url('https://s3-us-west-2.amazonaws.com/s.cdpn.io/93/artill_clean_icons-webfont.ttf') format('truetype'),
         url('https://s3-us-west-2.amazonaws.com/s.cdpn.io/93/artill_clean_icons-webfont.svg#artill_clean_weather_iconsRg') format('svg');
    font-weight: normal;
    font-style: normal;
}


#weather {
  width: 100%;
  margin: 0px auto;
  text-align: center;
  padding: 8px 0px!important;
  font-size: 18px;
  color: #184387/*#b2b2b2*/;
}

#weather i {
  color: #184387;
  font-family: weather;
  font-size: 150px;
  font-weight: normal;
  font-style: normal;
  line-height: 1.0;
  text-transform: none;
}
#weather li
{
	text-transform: uppercase;
}

.icon-0:before { content: ":"; }
.icon-1:before { content: "p"; }
.icon-2:before { content: "S"; }
.icon-3:before { content: "Q"; }
.icon-4:before { content: "S"; }
.icon-5:before { content: "W"; }
.icon-6:before { content: "W"; }
.icon-7:before { content: "W"; }
.icon-8:before { content: "W"; }
.icon-9:before { content: "I"; }
.icon-10:before { content: "W"; }
.icon-11:before { content: "I"; }
.icon-12:before { content: "I"; }
.icon-13:before { content: "I"; }
.icon-14:before { content: "I"; }
.icon-15:before { content: "W"; }
.icon-16:before { content: "I"; }
.icon-17:before { content: "W"; }
.icon-18:before { content: "U"; }
.icon-19:before { content: "Z"; }
.icon-20:before { content: "Z"; }
.icon-21:before { content: "Z"; }
.icon-22:before { content: "Z"; }
.icon-23:before { content: "Z"; }
.icon-24:before { content: "E"; }
.icon-25:before { content: "E"; }
.icon-26:before { content: "3"; }
.icon-27:before { content: "a"; }
.icon-28:before { content: "A"; }
.icon-29:before { content: "a"; }
.icon-30:before { content: "A"; }
.icon-31:before { content: "6"; }
.icon-32:before { content: "1"; }
.icon-33:before { content: "6"; }
.icon-34:before { content: "1"; }
.icon-35:before { content: "W"; }
.icon-36:before { content: "1"; }
.icon-37:before { content: "S"; }
.icon-38:before { content: "S"; }
.icon-39:before { content: "S"; }
.icon-40:before { content: "M"; }
.icon-41:before { content: "W"; }
.icon-42:before { content: "I"; }
.icon-43:before { content: "W"; }
.icon-44:before { content: "a"; }
.icon-45:before { content: "S"; }
.icon-46:before { content: "U"; }
.icon-47:before { content: "S"; }

#weather div {
  margin: 0 0 8px;
  color: #184387;
  font-size: 70px;
  text-align: center;
}

#weather ul {
  margin: 0;
  padding: 0;
}

#weather li {
  display: inline-block;
}

#weather .currently {
  margin: 0 20px;
}

.row
{
	margin : 0 -10px;
	padding : 0;
	font-size : 0;
	list-style : none;
}

.row > *
{
	display : inline-block;
	margin : 0;
	padding : 0 10px;
	font-size : 15px; /*font default*/
	vertical-align : top;
}

.row > .col-1
{
	width : 8.333333%;
}

.row > .col-2
{
	width : 16.666667%;
}

.row > .col-3
{
	width : 25%;
}

.row > .col-4
{
	width : 33.33%;
}

.row > .col-5
{
	width : 41.666667%;
}

.row > .col-6
{
	width : 50%;
}

.row > .col-7
{
	width : 58.333333%;
}

.row > .col-8
{
	width : 66.66%;
}

.row > .col-9
{
	width : 75%;
}

.row > .col-10
{
	width : 83.333333%;
}

.row > .col-11
{
	width : 91.666667%;
}

.row > .col-12
{
	width : 100%;
}
@media screen and (max-width:860px)
{
	.row > *
	{
		display : block!important;
		width : initial!important;
		padding : initial!important;
	}
}

.filter
{
	padding: 0;
	margin: 0;
	text-align: center;
}
.filter > li
{
	display: inline-block;
}
.filter > li > button
{
	padding: 10px 20px;
	background-color: #fff;
	text-decoration: none;
	color: #3e3d3d;
	border: 0;
}
.filter > li > button.active
{
	padding: 10px 20px;
	background-color: #3e3d3d;
	text-decoration: none;
	color: #fff;
	border: 0;
}

.accordion {
  /*width: 90%;
  max-width: 1000px;*/
  margin: 2rem auto;
}
.accordion-item {
  background-color: #fff;
  color: #111;
  margin: 1rem 0;
  /*border-radius: 0.5rem;
  box-shadow: 0 2px 5px 0 rgba(0,0,0,0.25);*/
}
.accordion-item-header {
  padding: 0.5rem 3rem 0.5rem 1rem;
  min-height: 3.5rem;
  line-height: 1.25rem;
  font-weight: bold;
  display: flex;
  align-items: center;
  position: relative;
  cursor: pointer;
}
.accordion-item-header::after {
  content: "\002B";
  font-size: 2rem;
  position: absolute;
  right: 1rem;
}
.accordion-item-header.active::after {
  content: "\2212";
}
.accordion-item-body {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.2s ease-out;
}
.accordion-item-body-content {
  padding: 1rem;
  line-height: 1.5rem;
  border-top: 1px solid #ededed;
  /*border-image: linear-gradient(to right, transparent, #34495e, transparent) 1;*/
}