/*
Theme Name: Mplus
Theme URI: https://www.mplusinfo.fr/
Author: Grégory Muller
Author URI: http://www.mulhouse.fr/
Description: Thème réalisé en 2017 pour le webzine M+ de la ville de Mulhouse (Alsace).
Version: 2.0
License: All right reserved
License URI: http://creativecommons.org/licenses/by-nc-nd/4.0/
Text Domain: mplusinfo.fr
Tags: red, black, blue, yellow, light, dark, two-columns, three-columns, four-columns, right-sidebar, fixed-layout, responsive-layout, sticky navigation, video, Modal box, theme-options, accessibility-ready
*/

/*
01 Eléments principaux
	Rouge: #f04124;
	Bleu: #0086cd;
	Jaune: #fdc300;
	Gris: #3e3c4a;
02 Mise en page
03 Header
	a Outils
		Réseaux sociaux
	b En-tête
		Recherche
		Menu principal
		Hamburger
	c Barre latérale
		Recherche
		Menu latéral
		Close
04 Contenu
	a Accueil
		Arlerte
		Article principal
		Article secondaire
		Immanquables
		Brève
		Le chiffre
		Vidéo
		Image
		Twitter
		Agenda
		Annonce
		Annonce formulaire
		Article tertiaire
	b Rubrique
		Rubrique
		Article
		Chargement
	c Article
		Photo
		Edition
		Rédaction
		Diaporama
	d Classique
		Photo
		Edition
		Rédaction
	e Brève
	f Evénements
		Recherche
		Annonce
	g Evénement
		Photo
		Rédaction
		Datepicker
	h Aside
		Immanquables
		Image
		Twitter
		Brève
		Agenda
		Google map
		Recherche
	i Commentaire
		Modal Box
	j Contact
		Modal Box
		Vidéo
		Ajouter votre événement
05 Footer
	a Accès rapide
	b Outils
	c Scroll up
06 Habillage
07 Autre
	a Wow
08 Application
*/

/*  --------------------------------------------------- 01 Eléments principaux --------------------------------------------------- */

body {
	background: #ffffff;
	color: #3e3c4a;
	font-family: 'Open Sans', sans-serif;
	font-size: 18px;
	font-weight:400;
	margin: 0;
	padding: 0;
}

.clear {
	clear: both;
}

.page-container {
	width: 1200px;
	margin: 0 auto;
	padding: 0 20px 0 20px;
}

.container {
    margin: 0 10px 0 10px;
}

.col-1 {
	float: left;
	width: 100px;
}

.col-3 {
	float: left;
	width: 300px;
}

.col-4 {
	float: left;
	width: 400px;
}

.col-5 {
	float: left;
	width: 500px;
}

.col-6 {
	float: left;
	width: 600px;
}

.col-9 {
	float: left;
	width: 900px;
}

.col-12 {
	width: 1200px;
}


/*  --------------------------------------------------- 02 Mise en page --------------------------------------------------- */

::-webkit-input-placeholder {
	color: white;
}

::-moz-placeholder {
	color: white;
}

:-ms-input-placeholder {
	color: white;
}

:-moz-placeholder {
	color: white;
}

a {
	color: #f04124;
	text-decoration: none;
}

a:hover {
	text-decoration: underline;
}

span.rouge {
	color: #f04124;
}

span.bleu {
	color: #0086cd;
}

span.jaune {
	color: #fdc300;
}

span.blanc {
	color: #ffffff;
}

	
/*  --------------------------------------------------- 03 Header --------------------------------------------------- */

header {
	height: 155px;
}

/************************** a Outils **************************/

header .outils {
	background: #ffffff;
	color: #ffffff;
	font-size: 12px;
	height: 12px;
	margin: 0;
	padding: 9px 0 9px 0;
}

header .outils ul.gauche {
	margin: 0;
	padding: 0;
}

header .outils ul.gauche li {
	border-left: 1px solid #000000;
	display: block;
	float: left;
	padding: 0 10px 0 10px;
}

header .outils ul.gauche li:first-child {
	border-left: none;
	padding: 0 10px 0 0;
}

header .outils ul.gauche li a {
	color: #000000;
}

header .outils ul.gauche li a:hover {
	color: #f04124;
	text-decoration: none;
}

/* Réseaux sociaux */

header .outils .droite {
	color: #000000;
	text-align: right;
}

header .outils .droite .menu-reseaux-sociaux-container {
	float: right;
}

header .outils .droite ul.social {
	float: right;
	margin: 0;
	padding: 0;
}

header .outils .droite ul.social li {
	display: block;
	float: left;
	margin: 0 0 0 16px;
}

header .outils .droite ul.social li i {
	font-size: 15px;
}

header .outils .droite ul.social li i:hover {
	color: #000000;
}

/************************** b En-tête **************************/

header #entete {
	background: #f04124;
	color: #ffffff;
	font-size: 13px;
	height: 125px;
	margin: 0;
	padding: 0;
	position:relative;
	/* Transition */
    -webkit-transition: all 0s;
    -moz-transition: all 0s;
    -ms-transition: all 0s;
    -o-transition: all 0s;
    transition: all 0s;
}

header #entete.fixed {
	position:fixed;
	top: 0;
	width: 100%;
	z-index:1000;
}

header #entete.smaller {
	height: 90px;
	/* Ombre */
	-moz-box-shadow: 0px 1px 5px #3e3c4a; 
	-webkit-box-shadow: 0px 1px 5px #3e3c4a; 
	box-shadow: 0px 1px 5px #3e3c4a; 
	/* Transition */
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
	/* Transition delay */
    -webkit-transition-delay: 0.3s;
    -moz-transition-delay: 0.3s;
    -ms-transition-delay: 0.3s;
    -o-transition-delay: 0.3s;
    transition-delay: 0.3s;
}

header #entete .logo {
	float: left;
}

header #entete .logo a img {
	display: block;
    height: 105px;
    margin: 20px 0 0 0;
    width: 168px;
	/* Transition */
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

header #entete.smaller .logo a img {
    height: 75px;
    margin: 15px 48px 0 0;
    width: 120px;
	/* Transition */
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
	/* Transition delay */
    -webkit-transition-delay: 0.3s;
    -moz-transition-delay: 0.3s;
    -ms-transition-delay: 0.3s;
    -o-transition-delay: 0.3s;
    transition-delay: 0.3s;
}

/* Recherche */

header #entete #recherchemenu {
	float: left;
	height: 92px;
	margin: 33px 0 0 0;
	width: 812px;
	/* Transition */
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}


header #entete.smaller #recherchemenu {
	margin: 15px 0 0 0;
	/* Transition */
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
	/* Transition delay */
    -webkit-transition-delay: 0.3s;
    -moz-transition-delay: 0.3s;
    -ms-transition-delay: 0.3s;
    -o-transition-delay: 0.3s;
    transition-delay: 0.3s;
}


header #entete #recherchemenu .recherche {
	float: right;
}

header #entete #recherchemenu .recherche form {
  display: block;
}

header #entete #recherchemenu .recherche input[type=text] {
	background: none;
	border: 1px solid #ffffff;
	color: #ffffff;
	display: block;
	float: left;
	font-family: 'Open Sans', sans-serif;
	font-size: 13px;
	height: 28px;
	line-height: 28px;
	margin: 0;
	padding: 0 30px 0 10px;
	width: 230px;
}

header #entete #recherchemenu .recherche input[type=text]:hover,
header #entete #recherchemenu .recherche input[type=text]:focus {
	border: 1px solid #000000;
}

header #entete #recherchemenu .recherche input[type="submit"] {
	background: none;
	border: none;
	color: #ffffff;
	cursor: pointer;
	float: left;
	font-family: FontAwesome;
	font-size: 14px;
	/*height: 18px;*/
	margin: 5px 0 0 -30px;
	/*width: 18px;*/
}

header #entete #recherchemenu .recherche input[type="submit"]:hover, header #entete #recherchemenu .recherche input[type="submit"]:focus {
	color: #000000;
}

/* Menu principal */

header #entete #recherchemenu #menuprincipal {
	height: 31px;
	float: right;
	margin: 32px 0 0 0;
	padding: 0;
	position:relative;
	/* Transition */
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

header #entete.smaller #recherchemenu #menuprincipal {
	margin: 15px 0 0 0;
	/* Transition */
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
	/* Transition delay */
    -webkit-transition-delay: 0.3s;
    -moz-transition-delay: 0.3s;
    -ms-transition-delay: 0.3s;
    -o-transition-delay: 0.3s;
    transition-delay: 0.3s;
}

header #entete #recherchemenu #menuprincipal .menu {
	position:relative;
	font-size: 15px;
}

header #entete #recherchemenu #menuprincipal .menu ul {
	float: left;
	list-style-type: none;
	margin: 0;
	padding: 0;
}
 
header #entete #recherchemenu #menuprincipal .menu ul li {
	float: left;
	margin: 0;
	position: relative;
	margin: 0 0 0 0;
	text-align: center;
}

header #entete #recherchemenu #menuprincipal .menu ul li + li {
	margin: 0 0 0 20px;
}

header #entete #recherchemenu #menuprincipal .menu ul li a {
	background: #ffffff;
	display: block ;
	color: #000000;
	font-size: 14px;
	font-weight: 700;
	height: 23px;
	padding: 7px 15px 0 15px;
	text-transform: uppercase;
}

header #entete #recherchemenu #menuprincipal .menu ul li a:hover {
	background: #000000;
	color: #ffffff;
	text-decoration: none;
}

header #entete #recherchemenu #menuprincipal .menu ul li a i {
	font-size: 13px;
	margin: 0 0 0 6px;
}

header #entete #recherchemenu #menuprincipal .menu ul li.ma-ville a i {
	color: #f04124;
}

header #entete #recherchemenu #menuprincipal .menu ul li.ils-font-mulhouse a i {
	color: #0086cd;
}

header #entete #recherchemenu #menuprincipal .menu ul li.vos-sorties a i {
	color: #fdc300;
}
 
header #entete #recherchemenu #menuprincipal .menu ul li.current-menu-item a {
	background: #000000;
	color: #ffffff;
}

/* Hamburger */

header #entete #menulateral {
	float: right;
	margin : 58px 0 0 0;
	/* Transition */
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

header #entete.smaller #menulateral {
	margin : 34px 0 0 0;
	/* Transition */
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
	/* Transition delay */
    -webkit-transition-delay: 0.3s;
    -moz-transition-delay: 0.3s;
    -ms-transition-delay: 0.3s;
    -o-transition-delay: 0.3s;
    transition-delay: 0.3s;
}

header #entete #menulateral button.menu-btn {
	background: transparent;
	border: none;
	cursor: pointer;
	height: 23px;
	margin: 0;
	position: relative;
	width: 31px;
}

header #entete #menulateral button.menu-btn span {
	background: #000000;
	display: block;
	height: 3px;
	left: 0;
	position: absolute;
	/* Transition */
	-webkit-transition: all .2s ease-in-out;
	-moz-transition: all .2s ease-in-out;
    -ms-transition: all .2s ease-in-out;
	-o-transition: all .2s ease-in-out;
	transition: all .2s ease-in-out;
}

header #entete #menulateral button.menu-btn:hover span {
	width: 100%;
	/* Transition */
	-webkit-transition: all .2s ease-in-out;
	-moz-transition: all .2s ease-in-out;
    -ms-transition: all .2s ease-in-out;
	-o-transition: all .2s ease-in-out;
	transition: all .2s ease-in-out;
}

header #entete #menulateral .menu-btn span.first {
	top: 0px;
	width: 31px;
}

header #entete #menulateral .menu-btn span.second {
	top: 10px;
	width: 22px;
}

header #entete #menulateral .menu-btn span.third {
	top: 20px;
	width: 28px;
}

/* div.pushy-content ul#nav.menu li.tribunes {
	display:none !important;
}
*/

/************************** c Barre latérale **************************/

/* Close */

header #entete #menulateral .close {
	margin: 10px 13px 15px 13px;
	text-align: right;
}

header #entete #menulateral .close i {
	cursor: pointer;
	font-size: 15px;
}

header #entete #menulateral .close i:hover {
	color: #000000;
}

/* Recherche */

header #entete #menulateral .recherche {
	margin: 10px 13px 10px 13px;
	width: 100%;
}

header #entete #menulateral .recherche form {
	display: block;
}

header #entete #menulateral .recherche input[type=text] {
	background: none;
	border: 1px solid #ffffff;
	color: #ffffff;
	display: block;
	float: left;
	font-family: 'Open Sans', sans-serif;
	font-size: 13px;
	height: 28px;
	line-height: 28px;
	margin: 0;
	padding: 0 30px 0 10px;
	width: 140px;
}

header #entete #menulateral .recherche input[type=text]:hover,
header #entete #menulateral .recherche input[type=text]:focus {
	border: 1px solid #000000;
}

header #entete #menulateral .recherche input[type="submit"] {
	background: none;
	border: none;
	color: #ffffff;
	cursor: pointer;
	float: left;
	font-family: FontAwesome;
	font-size: 14px;
	margin: 5px 0 0 -30px;
}

header #entete #menulateral .recherche input[type="submit"]:hover,
header #entete #menulateral .recherche input[type="submit"]:focus {
	color: #000000;
}

/* Menu latéral */

header #entete #menulateral nav.pushy {
	background: #f04124 url('images/lateral.jpg') no-repeat top center;
	background-size:cover;
	padding: 0 0 0 0;
	overflow-x: hidden;
    width: 225px;
}

.pushy-right {
	-webkit-transform: translate3d(225px, 0, 0);
	-ms-transform: translate3d(225px, 0, 0);
	transform: translate3d(225px, 0, 0);
}

.pushy-open-right #container,
.pushy-open-right .push {
	-webkit-transform: translate3d(-225px, 0, 0);
	-ms-transform: translate3d(-225px, 0, 0);
	transform: translate3d(-225px, 0, 0);
}

header #entete #menulateral nav.pushy ul {
	list-style-type: none;
	margin: 18px 0 10px 0;
	padding: 0px 13px 0 13px;
	position: relative;
}

header #entete #menulateral nav.pushy ul li {
	font-size: 14px;
	font-weight: 700;
	margin: 0;
	padding: 0;
	text-transform: uppercase;
}

header #entete #menulateral nav.pushy ul li a {
	background: #ffffff;
	color: #000000;
	display: inline-block;
	margin: 0;
	padding: 6px 6px 6px 6px;
}

header #entete #menulateral nav.pushy ul li.tribunes a {
	margin: 0 0 15px 0;
}

header #entete #menulateral nav.pushy ul li a:hover,
header #entete #menulateral nav.pushy ul li.current-cat a {
	background: #000000;
	color: #ffffff;
	text-decoration: none;
}

header #entete #menulateral nav.pushy ul li a i {
	font-size: 13px;
	margin: 0 0 0 6px;
}

header #entete #menulateral nav.pushy ul li a:after {
    font-family: FontAwesome;
    content: '\f067';
	font-weight: normal;
	margin: 0 0 0 6px;
}

header #entete #menulateral nav.pushy ul li.ma-ville a i,
header #entete #menulateral nav.pushy ul li.cat-item-5 a:after {
	color: #f04124;
}

header #entete #menulateral nav.pushy ul li.ils-font-mulhouse a i,
header #entete #menulateral nav.pushy ul li.cat-item-6 a:after {
	color: #0086cd;
}

header #entete #menulateral nav.pushy ul li.vos-sorties a i,
header #entete #menulateral nav.pushy ul li.vos-sorties a:after {
	color: #fdc300;
}

header #entete #menulateral nav.pushy ul li ul {
	margin: 0px 0 15px 0;
	padding: 2px 13px 0 10px;
}

header #entete #menulateral nav.pushy ul li ul li {
	font-size: 13px;
	text-transform: none;
	padding: 0;
	margin: 0;
}

header #entete #menulateral nav.pushy ul li ul li a {
	background: none;
	color: #ffffff;
	display: block;
	font-weight: 400;
	margin: 0 0 2px 0;
	padding: 0;
}

header #entete #menulateral nav.pushy ul li ul li a:after {
	content: none;
}

header #entete #menulateral nav.pushy ul li ul li a:hover {
	background: none;
}

header #entete #menulateral nav.pushy ul li ul li a span {
    background: #ffffff;
    color: #000000;
    display: inline-block;
    padding: 3px 6px 3px 6px;
    margin-left: -10px;
}

header #entete #menulateral nav.pushy ul li.current-cat ul li a {
	background: none;
}

header #entete #menulateral nav.pushy ul li ul li.current-cat a {
	background: none;
}

header #entete #menulateral nav.pushy ul li ul li:hover a span,
header #entete #menulateral nav.pushy ul li ul li.current-cat a span {
    color: #ffffff;
}

header #entete #menulateral nav.pushy ul li.ma-ville ul li:hover a span,
header #entete #menulateral nav.pushy ul li.cat-item-5 ul li:hover a span,
header #entete #menulateral nav.pushy ul li.cat-item-5 ul li.current-cat a span {
	background: #f04124;
}

header #entete #menulateral nav.pushy ul li.ils-font-mulhouse ul li:hover a span,
header #entete #menulateral nav.pushy ul li.cat-item-6 ul li:hover a span,
header #entete #menulateral nav.pushy ul li.cat-item-6 ul li.current-cat a span {
	background: #0086cd;
}

header #entete #menulateral nav.pushy ul li.vos-sorties ul li:hover a span {
	background: #fdc300;
}


/*  --------------------------------------------------- 04 Contenu --------------------------------------------------- */

#contenu {
	padding:0;
	margin:0;
}

#contenu .gris {
	background: #3e3c4a;
	margin-bottom: -300px;
    padding-bottom: 300px;
}

/************************** a Accueil **************************/

/* Alerte */

#contenu .alerte {
	padding: 30px 0 30px 0;
	background: #3e3c4a;
}

#contenu .alerte p {
	color: #ffffff;
	font-size: 18px;
	font-weight: 700;
	margin: 0;
	padding: 0;
}

#contenu .alerte p a {
	color: #ffffff;
}

#contenu .alerte p a:hover {
	color: #f04124;
	text-decoration: none;
}

#contenu .alerte i {
	color: #f04124;
	font-size: 16px;
	margin: 0 6px 0 0;
}

#contenu .alerte p .surtitre {
	color: #f04124;
	font-size: 18px;
	font-weight: 700;
	text-transform: uppercase;
}

/* Article principal */

#contenu section.actualites {
	margin: 0;
}

#contenu section.actualites article.principal {
	float: left;
	position: relative;
	overflow: hidden;
}

#contenu section.actualites article.col-6 {
	height: 400px;
	width: 580px;
}

#contenu section.actualites article.principal img {
    bottom: -1000px;
    left: -1000px;
    margin: auto;
    position: absolute;
    right: -1000px;
    top: -1000px;
	/* Transition */
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

#contenu section.actualites article.principal:hover img {
	/* Scale */
	-webkit-transform:scale(1.05); /* Safari and Chrome */
	-moz-transform:scale(1.05); /* Firefox */
	-ms-transform:scale(1.05); /* IE 9 */
	-o-transform:scale(1.05); /* Opera */
	 transform:scale(1.05);
}

#contenu section.actualites article.principal .description {
	background: transparent;
	background: rgba(0,0,0,0.6);
    bottom: 0;
    color: #ffffff;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000,endColorstr=#99000000);
    padding: 30px 30px 30px 30px;
    position: absolute;
    left: 0;
    right: 0;
}

#contenu section.actualites article.principal .description .categorie {
	color: #f04124;
	font-size: 12px;
	font-weight: 700;
	text-transform: uppercase;
}

#contenu section.actualites article.principal:hover .description .categorie {
	color: #ffffff;
}

#contenu section.actualites article.principal.ils-font-mulhouse .description .categorie {
	color: #0086cd;
}

#contenu section.actualites article.principal.ils-font-mulhouse:hover .description .categorie {
	color: #ffffff;
}

#contenu section.actualites article.principal .description h1 {
	font-size: 28px;
	font-weight: 700;
	line-height: 28px;
	margin: 4px 40px 0 0;
	padding: 0;
	z-index: 100;
    /* Break word */
    word-break: break-word;
	-webkit-hyphens: auto;
	-moz-hyphens: auto;
	-ms-hyphens: auto;
	-o-hyphens: auto;
	hyphens: auto;
}

#contenu section.actualites article.principal .description a {
	color: #ffffff;
}

#contenu section.actualites article.principal:hover .description a {
	color: #f04124;
	text-decoration: none;
}

#contenu section.actualites article.principal.ils-font-mulhouse:hover .description a {
	color: #0086cd;
}

#contenu section.actualites article.principal .description ul.social {
	float: right;
	margin: 0;
	padding: 0;
}

#contenu section.actualites article.principal .description ul.social li {
	display: block;
	float: left;
	margin: 0 0 0 10px;
}

#contenu section.actualites article.principal .description ul.social li a {
	color: #ffffff;
}

#contenu section.actualites article.principal .description ul.social li a:hover {
	color: #f04124;
}

#contenu section.actualites article.principal.ils-font-mulhouse .description ul.social li i:hover {
	color: #0086cd;
}

#contenu section.actualites article.principal .description ul.social li i {
	font-size: 13px;
}

#contenu section.actualites article.principal.ils-font-mulhouse .description ul.social li i {
	color: #ffffff;
}

#contenu section.actualites article.principal .description a.plus i {
    bottom: -9px;
	color: #ffffff;
	font-size: 50px;
    position: absolute;
    right: -2px;
}

#contenu section.actualites article.principal:hover .description a.plus i {
	color: #f04124;
}

#contenu section.actualites article.principal.ils-font-mulhouse:hover .description a.plus i {
	color: #0086cd;
}

/* Article secondaire */

#contenu section.actualites #secondaires {
	float: left;
	width: 300px;
}

#contenu section.actualites #secondaires article.secondaire {
	position: relative;
	overflow: hidden;
}

#contenu section.actualites #secondaires article.col-3 {
	float: none;
	height: 200px;
	width: 300px;
}

#contenu section.actualites #secondaires article.secondaire img {
    bottom: -1000px;
    left: -1000px;
    margin: auto;
    position: absolute;
    right: -1000px;
    top: -1000px;
	/* Transition */
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

#contenu section.actualites #secondaires article.secondaire:hover img {
	/* Scale */
	-webkit-transform:scale(1.05); /* Safari and Chrome */
	-moz-transform:scale(1.05); /* Firefox */
	-ms-transform:scale(1.05); /* IE 9 */
	-o-transform:scale(1.05); /* Opera */
	 transform:scale(1.05);
}

#contenu section.actualites #secondaires article.secondaire .description {
}

#contenu section.actualites #secondaires article.secondaire .description .categorie {
	background: #ffffff;
	color: #f04124;
	float: left;
	font-size: 12px;
	font-weight: 400;
	padding: 4px 8px 4px 8px;
    position: absolute;
	text-transform: uppercase;
	top: 0; 
}

#contenu section.actualites #secondaires article.secondaire .description .categorie a {
	color: #f04124;
}

#contenu section.actualites #secondaires article.secondaire:hover .description .categorie {
	background: #f04124;
	color: #ffffff;
}

#contenu section.actualites #secondaires article.secondaire.ils-font-mulhouse:hover .description .categorie {
	background: #0086cd;
	color: #ffffff;
}

#contenu section.actualites #secondaires article.secondaire:hover .description .categorie a {
	color: #ffffff;
}

#contenu section.actualites #secondaires article.secondaire.ils-font-mulhouse .description .categorie a {
	color: #0086cd;
}

#contenu section.actualites #secondaires article.secondaire.ils-font-mulhouse:hover .description .categorie a {
	color: #ffffff;
}

#contenu section.actualites #secondaires article.secondaire .description ul.social {
	margin: 0;
	padding: 2px 10px 2px 10px; 
    position: absolute;
    right: 0;
}

#contenu section.actualites #secondaires article.secondaire .description ul.social li {
	display: block;
	float: left;
	margin: 0 0 0 10px;
}

#contenu section.actualites #secondaires article.secondaire .description ul.social li i {
	font-size: 13px;
}

#contenu section.actualites #secondaires article.secondaire .description ul.social li i {
	color: #ffffff;
}

#contenu section.actualites #secondaires article.secondaire .description ul.social li i:hover {
	color: #f04124;
}

#contenu section.actualites #secondaires article.secondaire.ils-font-mulhouse .description ul.social li i:hover {
	color: #0086cd;
}

#contenu section.actualites #secondaires article.secondaire .description h1 {
	bottom: 0;
	font-size: 16px;
	font-weight: 700;
    position: absolute;
    margin: 0 15px 20px 26px;
	left: 0;
	right: 0;
	z-index: 100;
    /* Break word */
    word-break: break-word;
	-webkit-hyphens: auto;
	-moz-hyphens: auto;
	-ms-hyphens: auto;
	-o-hyphens: auto;
	hyphens: auto;
}

#contenu section.actualites #secondaires article.secondaire .description h1 span {
    background: #f04124;
    color: #ffffff;
    display: inline-block;
    padding: 3px 5px 3px 5px;
    margin: 3px 0 0px -9px;
}

#contenu section.actualites #secondaires article.secondaire.ils-font-mulhouse .description h1 span {
    background: #0086cd;
}

#contenu section.actualites #secondaires article.secondaire:hover .description h1 span {
    background: #ffffff;
    color: #f04124;
    display: inline-block;
    padding: 3px 5px 3px 5px;
    margin: 3px 0 0px -9px;
}


#contenu section.actualites #secondaires article.secondaire.ils-font-mulhouse:hover .description h1 span {
    color: #0086cd;
}

#contenu section.actualites #secondaires article.secondaire .description a.plus i {
    bottom: -9px;
	color: #ffffff;
	font-size: 50px;
    position: absolute;
    right: -2px;
}

#contenu section.actualites #secondaires article.secondaire:hover .description a.plus i {
	color: #f04124;
}

#contenu section.actualites #secondaires article.secondaire.ils-font-mulhouse:hover .description a.plus i {
	color: #0086cd;
}

/* Immanquables */

#contenu section.actualites #immanquables {
	background: #ffffff;
	height: 400px;
	outline: 1px solid #3e3c4a;
}

#contenu section.actualites #immanquables.col-3 {
    margin: 0 0 0 20px;
	float: left;
	width: 280px;
}

#contenu section.actualites #immanquables h1 {
	background: #f04124;
	color: #ffffff;
	font-size: 18px;
	font-weight: 600;
	padding: 8px 20px 8px 20px;
	margin: 0;
	letter-spacing: 1px;
	text-transform: uppercase;
}

#contenu section.actualites #immanquables h1 i {
	margin: 0 6px 0 0;
}

#contenu section.actualites #immanquables ul {
	display: block;
	list-style-type: none;
	margin: 20px 0 20px 0;
	padding: 0;
	position: relative;
	height: 325px;
	overflow:auto;
}

#contenu section.actualites #immanquables ul li {
	border-left: 3px solid #d2d2d2;
	color: #000000;
	font-size: 14px;
	font-weight: 400;
	margin: 0px 20px 5px 20px;
	padding: 0 15px 10px 15px;
}

#contenu section.actualites #immanquables ul li:before {
	background: #ffffff;
	color: #f04124;
	content: "\f067"; /* FontAwesome Unicode */
	font-family: FontAwesome;
	display: inline-block;
	padding-bottom: 4px;
	margin-bottom: -4px;
	margin-left: -21px; /* same as padding-left set on li */
	width: 21px; /* same as padding-left set on li */
}

#contenu section.actualites #immanquables ul li a {
	color: #000000;
}

#contenu section.actualites #immanquables ul li a:hover {
	color: #f04124;
	text-decoration: none;
}

#contenu section.actualites #immanquables ul li .surtitre {
	color: #f04124;
	font-size: 14px;
	font-weight: 700;
	text-transform: uppercase;
}

#contenu section.actualites .col-3.twitter-medium {
	display: none;
}

/* Brève */

#contenu section.breves {
	margin: 40px 0 0 0;
}

#contenu section.breves .breve {
	color: #ffffff;
	background: #000000;
	height: 190px;
	position: relative;
	overflow: hidden;
}

#contenu section.breves .breve .titre {
	height: 140px;
	line-height: 140px;
	padding: 20px 30px 20px 30px;
}

#contenu section.breves .breve a h1 {
	color: #ffffff;
	font-size: 22px;
	font-weight: 600;
	line-height: 28px;
	text-align: center;
	line-height: 28px;
	width: 100%;
	vertical-align:middle;
	display:inline-block;
}

#contenu section.breves .breve.rouge {
	background: #f04124;
}

#contenu section.breves .breve ul.social {
	margin: 0;
	padding: 10px 20px 2px 10px; 
    position: absolute;
    right: 0;
}

#contenu section.breves .breve ul.social li {
	display: block;
	float: left;
	margin: 0 0 0 10px;
}

#contenu section.breves .breve ul.social li i {
	font-size: 13px;
}

#contenu section.breves .breve ul.social li i {
	color: #ffffff;
}

#contenu section.breves .breve ul.social li i:hover {
	color: #f04124;
}

#contenu section.breves .breve.rouge ul.social li i:hover {
	color: #000000;
}

#contenu section.breves .breve a.plus i {
    bottom: -9px;
	color: #ffffff;
	font-size: 50px;
    position: absolute;
    right: -2px;
}

#contenu section.breves .breve a.plus i {
	color: #ffffff;
}

#contenu section.breves .breve:hover a.plus i {
	color: #f04124;
}

#contenu section.breves .breve.rouge:hover a.plus i {
	color: #000000;
}

/* Le chiffre */

#contenu section.breves .chiffre {
	color: #3e3c4a;
	height: 190px;
	position: relative;
	outline: 1px solid #c3c3c3;
}

#contenu section.breves .chiffre .surtitre {
	background: #ffffff;
	text-align: center;
	margin: -15px 80px 0 80px;
	position:absolute;
	top:0px; 
	right:0px;
	left: 0px;
}

#contenu section.breves .chiffre .surtitre p {
	color: #000000;
	font-size: 14px;
	margin: 4px 0 0 0;
	padding: 0;
}

#contenu section.breves .chiffre .surtitre i {
	color: #f04124;
	font-size: 30px;
}

#contenu section.breves .chiffre h1 {
	font-family: 'Lobster Two', cursive;
	font-size: 45px;
	font-weight: 400;
	text-align: center;
	margin: 0;
	padding: 40px 0 0 0;
	white-space: nowrap;
}

#contenu section.breves .chiffre .description {
	text-align: center;
	padding: 0px 20px 0px 20px;
	height: 80px;
	line-height: 80px;
	padding: 0px 30px 0px 30px;
	overflow: hidden;
}

#contenu section.breves .chiffre .description .kezako {
	height: auto;
	line-height: 17px;
	width: 100%;
	vertical-align:middle;
	display:inline-block;
}

#contenu section.breves .chiffre .description p {
	color: #000000;
	font-size: 14px;
	font-style: italic;
	margin: 4px 0 0 0;
	padding: 0;
}

#contenu section.breves .chiffre .description a {
	color: #000000;
}

#contenu section.breves .chiffre .description a:hover {
	color: #f04124;
}

/* Vidéo */

#contenu section.medias {
	margin: 30px 0 0 0;
}

div.video{
/*	height:326px; */
}

#contenu section.medias .video p {
	font-size: 18px;
	font-weight: 700;
	margin: 0 0 10px 0;
	padding: 0;
	text-transform: uppercase;
}

#contenu section.medias .video p a {
	color: #000000;
}

#contenu section.medias .video i {
	color: #f04124;
	margin: 0 0 0 6px;
}

#contenu section.medias .video .youtube {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	height: 0;
	margin: 0;
}

#contenu section.medias .video .youtube iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/* Image */

/*Box Facebook responsive */
/* Cet élément block le script injecté dans l'iframe. On le cache */
#fb-root { 
	display: none; 
}  
/* on redéfini la taille du contenu */ 
.fb_iframe_widget, .fb_iframe_widget span, .fb_iframe_widget span iframe[style] { 
	width: 100% !important; 
}



#contenu section.medias .image {
	height: 326px!important;
}

#contenu section.medias .image p {
	font-size: 18px;
	font-weight: 700;
	margin: 0 0 10px 0;
	padding: 0;
	text-transform: uppercase;
}

#contenu section.medias .image p a {
	color: #000000;
}

#contenu section.medias .image i {
	color: #f04124;
	margin: 0 0 0 6px;
}

div.facebookpageplugin {
	width:100% !important;
}


html.js.flexbox.flexboxlegacy.canvas.canvastext.webgl.no-touch.geolocation.postmessage.no-websqldatabase.indexeddb.hashchange.history.draganddrop.websockets.rgba.hsla.multiplebgs.backgroundsize.borderimage.borderradius.boxshadow.textshadow.opacity.cssanimations.csscolumns.cssgradients.no-cssreflections.csstransforms.csstransforms3d.csstransitions.fontface.generatedcontent.video.audio.localstorage.sessionstorage.webworkers.applicationcache.svg.inlinesvg.smil.svgclippaths body.home.page-template-default.page.page-id-30.group-blog div#contenu div.page-container section.medias div.col-3.instagram-container div.container div#curator-feed-default-feed-layout.crt-widget.crt-no-touch.crt-widget-theme-sydney.crt-widget-grid-carousel.crt-widget-branded a.crt-logo.crt-tag {
	display:none !important;
	color: #ffffff;
}


#contenu section.medias .image .instagram {
	height: 326px!important;
	position: relative;
	/*outline: 1px solid #c3c3c3;*/
}



#contenu section.medias .image .instagram .partage {
    bottom: 0;
    font-size: 16px;
    font-weight: 700;
    position: absolute;
    margin: 0 0 20px 0;
    left: 0;
    right: 0;
}

#contenu section.medias .image .instagram p {
	background: #000000;
	color: #ffffff;
	display: inline-block;
    font-size: 16px;
    font-weight: 700;
    padding: 1px 6px 3px 6px;
    margin: 0 15px 3px 15px;
	text-transform: none;
}

#contenu section.medias .image .instagram p.insta {
	background: #f04124;
}

#contenu section.medias .image .instagram iframe {
	height: 326px!important;
}

#contenu section.medias .image .hashtag .apn {
    bottom: 0;
    position: absolute;
    margin: 0 0 0px 0;
    left: 0;
    right: 0;
}

#contenu section.medias .image .hashtag .apn img {
    bottom: 0;
    font-size: 16px;
    font-weight: 700;
    position: absolute;
    margin: 0 0 0px 0;
    left: 0;
    right: 0;
}

#contenu section.medias .image .hashtag {
	height: 46px;
	position: relative;
	outline: 1px solid #c3c3c3;
	text-align: center;
}

#contenu section.medias .image .hashtag p {
	font-size: 18px;
	font-weight: 700;
	padding: 12px 0 10px 30px;
}

#contenu section.medias .image .hashtag p a {
	color: #f04124;
	font-size: 18px;
	font-weight: 700;
	text-transform: none;
}

/* Twitter */

#contenu section.medias .twitter {
}

#contenu section.actualites .twitter {
}

#contenu section.medias .twitter p,
#contenu section.actualites .twitter p {
	font-size: 18px;
	font-weight: 700;
	margin: 0 0 10px 0;
	padding: 0;
	text-transform: uppercase;
}

#contenu section.medias .twitter p a,
#contenu section.actualites .twitter p a {
	color: #000000;
}

#contenu section.medias .twitter i,
#contenu section.actualites .twitter i {
	color: #f04124;
	margin: 0 0 0 6px;
}

#contenu section.medias .twitter .tweet,
#contenu section.actualites .twitter .tweet {
	height: 296px;
	padding: 10px 15px 20px 15px;
	outline: 1px solid #f04124;
	text-align: center;
}

#contenu section.medias .twitter .tweet a,
#contenu section.actualites .twitter .tweet a {
}

#contenu section.medias .twitter .tweet iframe,
#contenu section.actualites .twitter .tweet iframe {
	min-width: 100% !important;
	width: 100% !important;
}

/* Agenda */

#contenu section.agenda {
	background: #e9e9e9;
	padding: 50px 0 50px 0;
}

#contenu section.agenda .titre {
	float: left;
	margin: 0;
	padding: 0;
}

#contenu section.agenda .titre h1 {
	font-size: 30px;
	font-weight: 700;
	margin: 0;
	padding: 0;
	text-transform: uppercase;
}

#contenu section.agenda .titre a {
	color: #000000;
}

#contenu section.agenda .titre a i {
	font-size: 28px;
	margin: 0 0 0 10px;
}

#contenu section.agenda .titre a:hover {
	color: #fdc300;
	text-decoration: none;
}

#contenu section.agenda .titre a:hover span.jaune {
	color: #000000;
}

#contenu section.agenda .rubrique {
	float: right;
	margin: 7px 0 0 0;
	padding: 0;
}

#contenu section.agenda .rubrique ul {
	float: right;
	font-size: 12px;
	margin: 0;
	padding: 0;
	text-transform: uppercase;
}

#contenu section.agenda .rubrique ul li {
	background: #ffffff;
	display: block;
	float: left;
	margin: 0 0 0 16px;
	padding: 4px 6px 4px 6px;
}

#contenu section.agenda .rubrique ul li:hover {
	background: #fdc300;
}

#contenu section.agenda .rubrique ul li a {
	color: #000000;
}

#contenu section.agenda .rubrique ul li:hover a {
	color: #ffffff;
	text-decoration: none;
}

/* Annonce */

#contenu section.agenda .annonce {
	margin: 25px 0 20px 0;
	position: relative;
	overflow: hidden;
}

#contenu section.agenda .annonce .photo {
	float: left;
	position: relative;
	overflow: hidden;
	height: 134px;
	width: 100%;
}

#contenu section.agenda .annonce .photo img {
    bottom: -1000px;
    left: -1000px;
    margin: auto;
    position: absolute;
    right: -1000px;
    top: -1000px;
    width: 510px;
	/* Transition */
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

#contenu section.agenda .annonce:hover .photo img {
	/* Scale */
	-webkit-transform:scale(1.05); /* Safari and Chrome */
	-moz-transform:scale(1.05); /* Firefox */
	-ms-transform:scale(1.05); /* IE 9 */
	-o-transform:scale(1.05); /* Opera */
	 transform:scale(1.05);
}

#contenu section.agenda .annonce .photo .titre h1 {
    top: 0;
    font-size: 16px;
    font-weight: 700;
    position: absolute;
    margin: 12px 17px 17px 28px;
    left: 0;
    right: 0;
}

#contenu section.agenda .annonce .photo .titre h1 span {
    background: #000000;
    color: #ffffff;
    display: inline-block;
    padding: 3px 6px 3px 6px;
    margin: 3px 0 0px -11px;
}

#contenu section.agenda .annonce:hover .photo .titre h1 span {
    background: #ffffff;
    color: #000000;
}

#contenu section.agenda .annonce .description {
	background: #fdc300;
	height: 150px;
	padding: 20px 20px 20px 20px;
    position: relative;
}

#contenu section.agenda .annonce .description h2 {
	font-size: 15px;
	font-weight: 700;
	margin: 0 0 10px 0;
	padding: 0;
}

#contenu section.agenda .annonce .description h2 a {
	color: #000000;
	text-decoration: none;
}

#contenu section.agenda .annonce .description p {
	font-size: 14px;
	font-weight: 400;
	height: 75px;
	margin: 0;
	padding: 0;
	overflow: hidden;
}

#contenu section.agenda .annonce .description p a {
	color: #3e3c4a;
	text-decoration: none;
}

#contenu section.agenda .annonce .description p.date {
	font-size: 13px;
	font-weight: 700;
	margin: 15px 0 0 0;
	padding: 0;
	text-transform: uppercase;
}

#contenu section.agenda .annonce .description p.date a {
	color: #ffffff;
	text-decoration: none;
}

#contenu section.agenda .annonce .description .degrade {
    background: linear-gradient(to bottom, rgba(253,195,255,0) 0, #fdc300 100%) repeat scroll 0 0 rgba(253,195,255,0);
    bottom: 65px;
    height: 40px;
    left: 0;
    position: absolute;
    right: 0;
    z-index: 200;
}

#contenu section.agenda .annonce a.plus i {
    bottom: -6px;
	color: #ffffff;
	font-size: 30px;
    position: absolute;
    right: -2px;
}

#contenu section.agenda .annonce a.plus i {
	color: #ffffff;
}

#contenu section.agenda .annonce:hover a.plus i {
	color: #000000;
}

/* Annonce formulaire */

#contenu section.agenda .annonce.formulaire .description {
	background: #000000;
}

#contenu section.agenda .annonce.formulaire .description h2 a {
	color: #ffffff;
	text-decoration: none;
}

#contenu section.agenda .annonce.formulaire .description p a {
	color: #e9e9e9;
	text-decoration: none;
}

#contenu section.agenda .annonce .description p.date a {
	color: #ffffff;
	text-decoration: none;
}

#contenu section.agenda .annonce.formulaire:hover a.plus i {
	color: #fdc300;
}

#contenu section.agenda .recherche {
	color: #000000;
	font-size: 13px;
	float: left;
}

#contenu section.agenda .recherche:hover {
	text-decoration: none;
}

#contenu section.agenda .recherche:hover i {
	color: #fdc300;
}

#contenu section.agenda .recherche i {
	margin: 0 6px 0 0;
}

#contenu section.agenda .ajout {
	color: #000000;
	font-size: 13px;
	float: right;
}

#contenu section.agenda .ajout:hover {
	text-decoration: none;
}

#contenu section.agenda .ajout:hover i {
	color: #fdc300;
}

#contenu section.agenda .ajout i {
	margin: 0 0 0 6px;
}

/* Article tertiaire */

#contenu section.tertiaires {
	margin: 50px 0 0 0;
}

#contenu section.tertiaires .titre {
	float: left;
	margin: 0 0 20px 0;
	padding: 0;
}

#contenu section.tertiaires .titre h1 {
	font-size: 30px;
	font-weight: 700;
	margin: 0;
	padding: 0;
	text-transform: uppercase;
}

#contenu section.tertiaires .titre a {
	color: #000000;
}

#contenu section.tertiaires .titre a i {
	font-size: 28px;
	margin: 0 0 0 10px;
}

#contenu section.tertiaires .titre a:hover {
	color: #f04124;
	text-decoration: none;
}

#contenu section.tertiaires .titre a:hover span.rouge {
	color: #000000;
}

#contenu section.tertiaires.ils-font-mulhouse .titre a:hover {
	color: #0086cd;
	text-decoration: none;
}

#contenu section.tertiaires.ils-font-mulhouse .titre a:hover span.bleu {
	color: #000000;
}

#contenu section.tertiaires .articles {
	font-size: 13px;
	float: right;
	margin: 0 0 20px 0;
	padding: 15px 0 0 0;
}

#contenu section.tertiaires .articles p {
	color: #000000;
	margin: 0;
	padding: 0;
}

#contenu section.tertiaires .articles a {
	text-decoration: none;
}

#contenu section.tertiaires .articles p:hover {
	color: #f04124;
	margin: 0;
	padding: 0;
}

#contenu section.tertiaires.ils-font-mulhouse .articles p:hover {
	color: #0086cd;
}


#contenu section.tertiaires .articles p i {
	margin: 0 0 0 6px;
}

#contenu section.tertiaires.ils-font-mulhouse .articles p i {
	color: #0086cd;
}

#contenu section.tertiaires article.tertiaire {
	position: relative;
	overflow: hidden;
	height: 253px;
}

#contenu section.tertiaires article.tertiaire img {
    bottom: -1000px;
    left: -1000px;
    margin: auto;
    position: absolute;
    right: -1000px;
    top: -1000px;
	/* Transition */
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

#contenu section.tertiaires article.tertiaire:hover img {
	/* Scale */
	-webkit-transform:scale(1.05); /* Safari and Chrome */
	-moz-transform:scale(1.05); /* Firefox */
	-ms-transform:scale(1.05); /* IE 9 */
	-o-transform:scale(1.05); /* Opera */
	 transform:scale(1.05);
}

#contenu section.tertiaires article.tertiaire .description {
}


#contenu section.tertiaires article.tertiaire .description .categorie {
	background: #ffffff;
	color: #f04124;
	float: left;
	font-size: 12px;
	font-weight: 400;
	padding: 4px 8px 4px 8px;
    position: absolute;
	text-transform: uppercase;
	top: 0; 
}

#contenu section.tertiaires article.tertiaire:hover .description .categorie {
	background: #f04124;
	color: #ffffff;
}

#contenu section.tertiaires article.tertiaire:hover .description .categorie a {
	color: #ffffff;
}

#contenu section.tertiaires.ils-font-mulhouse article.tertiaire .description .categorie,
#contenu section.tertiaires article.tertiaire.ils-font-mulhouse .description .categorie,
#contenu section.tertiaires.ils-font-mulhouse article.tertiaire .description .categorie a,
#contenu section.tertiaires article.tertiaire.ils-font-mulhouse .description .categorie a {
	color: #0086cd;
}

#contenu section.tertiaires.ils-font-mulhouse article.tertiaire:hover .description .categorie,
#contenu section.tertiaires article.tertiaire.ils-font-mulhouse:hover .description .categorie,
#contenu section.tertiaires.ils-font-mulhouse article.tertiaire:hover .description .categorie a,
#contenu section.tertiaires article.tertiaire.ils-font-mulhouse:hover .description .categorie a {
	background: #0086cd;
	color: #ffffff;
}

#contenu section.tertiaires article.tertiaire .description ul.social {
	margin: 0;
	padding: 2px 10px 2px 10px; 
    position: absolute;
    right: 0;
}

#contenu section.tertiaires article.tertiaire .description ul.social li {
	display: block;
	float: left;
	margin: 0 0 0 10px;
}

#contenu section.tertiaires article.tertiaire .description ul.social li i {
	font-size: 13px;
}

#contenu section.tertiaires article.tertiaire .description ul.social li i {
	color: #ffffff;
}

#contenu section.tertiaires article.tertiaire .description ul.social li i:hover {
	color: #f04124;
}

#contenu section.tertiaires.ils-font-mulhouse article.tertiaire .description ul.social li i:hover,
#contenu section.tertiaires article.tertiaire.ils-font-mulhouse .description ul.social li i:hover {
	color: #0086cd;
}

#contenu section.tertiaires article.tertiaire .description h1 {
	bottom: 0;
	font-size: 16px;
	font-weight: 700;
    position: absolute;
    margin: 0 15px 20px 26px;
	left: 0;
	right: 0;
	z-index: 100;
    /* Break word */
    word-break: break-word;
	-webkit-hyphens: auto;
	-moz-hyphens: auto;
	-ms-hyphens: auto;
	-o-hyphens: auto;
	hyphens: auto;
}

#contenu section.tertiaires article.tertiaire .description h1 span {
    background: #f04124;
    color: #ffffff;
    display: inline-block;
    padding: 3px 5px 3px 5px;
    margin: 3px 0 0px -9px;
}

#contenu section.tertiaires.ils-font-mulhouse article.tertiaire .description h1 span,
#contenu section.tertiaires article.tertiaire.ils-font-mulhouse .description h1 span {
    background: #0086cd;
}

#contenu section.tertiaires article.tertiaire:hover .description h1 span {
    background: #ffffff;
    color: #f04124;
    display: inline-block;
    padding: 3px 5px 3px 5px;
    margin: 3px 0 0px -9px;
}

#contenu section.tertiaires.ils-font-mulhouse article.tertiaire:hover .description h1 span,
#contenu section.tertiaires article.tertiaire.ils-font-mulhouse:hover .description h1 span {
    color: #0086cd;
}

#contenu section.tertiaires article.tertiaire .description a.plus i {
    bottom: -9px;
	color: #ffffff;
	font-size: 50px;
    position: absolute;
    right: -2px;
}

#contenu section.tertiaires article.tertiaire:hover .description a.plus i {
	color: #f04124;
}

#contenu section.tertiaires.ils-font-mulhouse article.tertiaire:hover .description a.plus i,
#contenu section.tertiaires article.tertiaire.ils-font-mulhouse:hover .description a.plus i {
	color: #0086cd;
}


/************************** b Rubrique **************************/

#contenu section.rubrique .col-12 {
	margin: 0 0 10px 0;
}

#contenu section.rubrique .titre {
	margin: 8px 0 0 0;
}

#contenu section.rubrique .titre h1 {
	background: #f04124;
	color: #000000;
	display: inline;
	font-size: 40px;
	font-weight: 700;
	margin: 0 0 0 0;
    padding: 3px 18px 6px 18px;
	text-transform: uppercase;
}

#contenu section.rubrique.ils-font-mulhouse .titre h1 {
	background: #0086cd;
}

#contenu section.rubrique .titre h1 i {
	margin: 0 0 0 10px;
}

#contenu section.rubrique .titre p {
	color: #ffffff;
	height: 60px;
	margin: 40px 0 0 0;
	overflow: hidden;
}

/* Rubrique */

#contenu section.rubrique .rubrique {
	margin: 20px 0 40px 0;
	padding: 0;
}

#contenu section.rubrique .rubrique ul {
	float: left;
	font-size: 12px;
	margin: 0;
	padding: 0;
	text-transform: uppercase;
}

#contenu section.rubrique .rubrique ul li {
	background: #ffffff;
	display: block;
	float: left;
	margin: 10px 16px 0 0;
	padding: 4px 6px 4px 6px;
}

#contenu section.rubrique .rubrique ul li.active,
#contenu section.rubrique .rubrique ul li.current-cat {
	background: #f04124;
}

#contenu section.rubrique.ils-font-mulhouse .rubrique ul li.active,
#contenu section.rubrique.ils-font-mulhouse .rubrique ul li.current-cat {
	background: #0086cd;
}

#contenu section.rubrique .rubrique ul li:hover {
	background: #f04124;
}

#contenu section.rubrique .rubrique ul li a {
	color: #f04124;
}

#contenu section.rubrique .rubrique ul li.active a,
#contenu section.rubrique .rubrique ul li.current-cat a {
	color: #ffffff;
}

#contenu section.rubrique.ils-font-mulhouse .rubrique ul li:hover {
	background: #0086cd;
}

#contenu section.rubrique.ils-font-mulhouse .rubrique ul li a {
	color: #0086cd;
}

#contenu section.rubrique.ils-font-mulhouse .rubrique ul li.active a,
#contenu section.rubrique.ils-font-mulhouse .rubrique ul li.current-cat a {
	color: #ffffff;
}

#contenu section.rubrique .rubrique ul li:hover a {
	color: #ffffff;
	text-decoration: none;
}

/* Article */

#contenu section.rubrique article.tertiaire {
	position: relative;
	overflow: hidden;
	height: 253px;
	margin: 30px 0 0 0;
}

#contenu section.rubrique article.tertiaire img {
    bottom: -1000px;
    left: -1000px;
    margin: auto;
    position: absolute;
    right: -1000px;
    top: -1000px;
	/* Transition */
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

#contenu section.rubrique article.tertiaire:hover img {
	/* Scale */
	-webkit-transform:scale(1.05); /* Safari and Chrome */
	-moz-transform:scale(1.05); /* Firefox */
	-ms-transform:scale(1.05); /* IE 9 */
	-o-transform:scale(1.05); /* Opera */
	 transform:scale(1.05);
}

#contenu section.rubrique article.tertiaire .description {
}

#contenu section.rubrique article.tertiaire .description .categorie {
	background: #ffffff;
	color: #000000;
	float: left;
	font-size: 12px;
	font-weight: 400;
	padding: 4px 8px 4px 8px;
    position: absolute;
	text-transform: uppercase;
	top: 0; 
}

#contenu section.rubrique article.tertiaire:hover .description .categorie {
	background: #000000;
	color: #ffffff;
}

#contenu section.rubrique article.tertiaire:hover .description .categorie a {
	color: #ffffff;
}

#contenu section.rubrique.ma-ville article.tertiaire .description .categorie,
#contenu section.rubrique article.tertiaire.ma-ville .description .categorie,
#contenu section.rubrique article.tertiaire.ma-ville .description .categorie a {
	color: #f04124;
}

#contenu section.rubrique.ils-font-mulhouse article.tertiaire .description .categorie,
#contenu section.rubrique article.tertiaire.ils-font-mulhouse .description .categorie,
#contenu section.rubrique article.tertiaire.ils-font-mulhouse .description .categorie a {
	color: #0086cd;
}

#contenu section.rubrique.ma-ville article.tertiaire:hover .description .categorie,
#contenu section.rubrique article.tertiaire.ma-ville:hover .description .categorie,
#contenu section.rubrique article.tertiaire.ma-ville:hover .description .categorie a {
	background: #f04124;
	color: #ffffff;
}

#contenu section.rubrique.ils-font-mulhouse article.tertiaire:hover .description .categorie,
#contenu section.rubrique article.tertiaire.ils-font-mulhouse:hover .description .categorie,
#contenu section.rubrique article.tertiaire.ils-font-mulhouse:hover .description .categorie a {
	background: #0086cd;
	color: #ffffff;
}

#contenu section.rubrique article.tertiaire .description ul.social {
	margin: 0;
	padding: 2px 10px 2px 10px; 
    position: absolute;
    right: 0;
}

#contenu section.rubrique article.tertiaire .description ul.social li {
	display: block;
	float: left;
	margin: 0 0 0 10px;
}

#contenu section.rubrique article.tertiaire .description ul.social li i {
	font-size: 13px;
}

#contenu section.rubrique article.tertiaire .description ul.social li i {
	color: #ffffff;
}

#contenu section.rubrique article.tertiaire .description ul.social li i:hover {
	color: #000000;
}

#contenu section.rubrique.ma-ville article.tertiaire .description ul.social li i:hover,
#contenu section.rubrique article.tertiaire.ma-ville .description ul.social li i:hover {
	color: #f04124;
}

#contenu section.rubrique.ils-font-mulhouse article.tertiaire .description ul.social li i:hover,
#contenu section.rubrique article.tertiaire.ils-font-mulhouse .description ul.social li i:hover {
	color: #0086cd;
}

#contenu section.rubrique article.tertiaire .description h1 {
	bottom: 0;
	font-size: 16px;
	font-weight: 700;
    position: absolute;
    margin: 0 15px 20px 26px;
	left: 0;
	right: 0;
	z-index: 100;
    /* Break word */
    word-break: break-word;
	-webkit-hyphens: auto;
	-moz-hyphens: auto;
	-ms-hyphens: auto;
	-o-hyphens: auto;
	hyphens: auto;
}

#contenu section.rubrique article.tertiaire .description h1 span {
    background: #000000;
    color: #ffffff;
    display: inline-block;
    padding: 3px 5px 3px 5px;
    margin: 3px 0 0px -9px;
}

#contenu section.rubrique.ma-ville article.tertiaire .description h1 span,
#contenu section.rubrique article.tertiaire.ma-ville .description h1 span {
    background: #f04124;
}

#contenu section.rubrique.ils-font-mulhouse article.tertiaire .description h1 span,
#contenu section.rubrique article.tertiaire.ils-font-mulhouse .description h1 span {
    background: #0086cd;
}

#contenu section.rubrique article.tertiaire:hover .description h1 span {
    background: #ffffff;
    color: #000000;
    display: inline-block;
    padding: 3px 5px 3px 5px;
    margin: 3px 0 0px -9px;
}

#contenu section.rubrique.ma-ville article.tertiaire:hover .description h1 span,
#contenu section.rubrique article.tertiaire.ma-ville:hover .description h1 span {
    color: #f04124;
}

#contenu section.rubrique.ils-font-mulhouse article.tertiaire:hover .description h1 span,
#contenu section.rubrique article.tertiaire.ils-font-mulhouse:hover .description h1 span {
    color: #0086cd;
}

#contenu section.rubrique article.tertiaire .description a.plus i {
    bottom: -9px;
	color: #ffffff;
	font-size: 50px;
    position: absolute;
    right: -2px;
}

#contenu section.rubrique article.tertiaire:hover .description a.plus i {
	color: #000000;
}

#contenu section.rubrique.ma-ville article.tertiaire:hover .description a.plus i,
#contenu section.rubrique article.tertiaire.ma-ville:hover .description a.plus i {
	color: #f04124;
}

#contenu section.rubrique.ils-font-mulhouse article.tertiaire:hover .description a.plus i,
#contenu section.rubrique article.tertiaire.ils-font-mulhouse:hover .description a.plus i {
	color: #0086cd;
}

/* Chargement */

#contenu section.chargement {
}

#contenu section.chargement .col-12 .container {
	background: #f04124;
	font-size: 12px;
	margin-top: 30px;
	padding: 10px 0 10px 0;
	text-align: center;
	text-transform: uppercase;
}

#contenu section.chargement.ils-font-mulhouse .col-12 .container {
	background: #0086cd;
}

#contenu section.chargement:hover .col-12 .container {
	background: #000000;
}

#contenu section.chargement a {
	color: #ffffff;
}

#contenu section.chargement a i {
	color: #ffffff;
	margin: 0 6px 0 6px;
}

#contenu section.chargement a:hover {
	text-decoration: none;
}


























/* Pagination */

.pagination, span.em-pagination {
	clear: both;
	padding: 30px 0 10px 0;
	margin: 0 0 0 0;
	text-align: center;
	font-weight: 400;
}

span.em-pagination {
	 display: inline-block;
	 width: 100%;
}

.pagination a, .pagination span.pages, .pagination span.dots, span.em-pagination a, span.em-pagination span.pages, span.em-pagination span.dots, span.em-pagination span.current {
	color: #000000 !important;
	display: inline-block;
	font-size: 15px;
	padding: 0 2px;
	text-decoration: none !important;
}

.pagination a:hover, .pagination a:focus, span.em-pagination a:hover, span.em-pagination a:focus, .pagination span.current {
	color: #f04124 !important;
	font-size: 15px;
	padding: 0 2px;
	text-decoration: none !important;
}

.pagination.ils-font-mulhouse a:hover, .pagination.ils-font-mulhouse a:focus, span.em-pagination a:hover, span.em-pagination a:focus, .pagination.ils-font-mulhouse span.current {
	color: #0086cd !important;
	font-size: 15px;
	padding: 0 2px;
	text-decoration: none !important;
}

.navigation .nav-previous a, .em-navigation a.next {
	color: #e75138 !important;
	float: left;
	font-size: 14px;
	padding: 1px 10px 3px 10px;
	margin: 0 0 0 0;
	text-decoration: none;
}

.navigation .nav-previous a:hover, .em-navigation a.prev:hover {
}

.navigation .nav-next a, .em-navigation a.next {
	color: #e75138 !important;
	float: right;
	font-size: 14px;
	padding: 1px 10px 3px 10px;
	margin: 0 0 0 0;
	text-decoration: none;
}

.navigation .nav-next a:hover, .em-navigation a.next:hover {
	background: none;
	/*border: solid 1px #8e79cf;*/
}

div.pagination span.current, span.em-pagination span.current {
	/*border: solid 1px #e75138;*/
	color: #f04124 !important;
}
























/************************** c Article **************************/

/* Photo */

#contenu section.article article {
	/*position: relative;
	overflow: hidden;*/
}

#contenu section.article article .col-12 img {
	position: relative;
	width: 100%;
}

#contenu section.article article .col-12 {
	position: relative;
}

#contenu section.article article .description {
}

#contenu section.article article .description .categorie {
	background: #ffffff;
	color: #f04124;
	font-size: 12px;
	font-weight: 400;
	left: 10px;
	padding: 4px 8px 4px 8px;
    position: absolute;
	text-transform: uppercase;
	top: 0; 
}

#contenu section.article article.ils-font-mulhouse .description .categorie {
	color: #0086cd;
}

#contenu section.article article.ils-font-mulhouse .description .categorie a {
	color: #0086cd;
}

#contenu section.article article .description ul.social {
	margin: 0;
	padding: 10px 30px 2px 10px; 
    position: absolute;
    right: 0;
    top: 0;
}

#contenu section.article article .description ul.social li {
	display: block;
	float: left;
	margin: 0 0 0 10px;
}

#contenu section.article article .description ul.social li i {
	font-size: 13px;
}

#contenu section.article article .description ul.social li i {
	color: #ffffff;
}

#contenu section.article article .description ul.social li i:hover {
	color: #f04124;
}

#contenu section.article article.ils-font-mulhouse .description ul.social li i:hover {
	color: #0086cd;
}

#contenu section.article article .description h1 {
	bottom: 0;
	font-size: 40px;
	font-weight: 700;
    position: absolute;
    padding: 0;
    margin: 0 15px 23px 45px;
    max-width: 70%;
	left: 0;
	z-index: 100;
    /* Break word */
    word-break: break-word;
	-webkit-hyphens: auto;
	-moz-hyphens: auto;
	-ms-hyphens: auto;
	-o-hyphens: auto;
	hyphens: auto;
}

#contenu section.article article .description h1 span {
    background: #f04124;
    color: #ffffff;
    display: inline-block;
    padding: 3px 9px 6px 9px;
    margin: 3px 0 0px -15px;
}

#contenu section.article article.ils-font-mulhouse .description h1 span {
    background: #0086cd;
}

#contenu section.article article .description .copyright {
    background-color: rgba(0, 0, 0, 0.5);
    /* For IE 5.5 - 7*/
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000);
    /* For IE 8*/
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000)";
    bottom: 0;
	color: #ffffff;
	font-size: 11px;
	font-weight: 400;
    position: absolute;
    margin: 0 10px 3px 0;
    padding: 6px 9px 6px 9px;
    max-width: 20%;
    right: 0;
}

/* Edition */

#contenu section.article article .edition {
	margin: 20px 0 20px 0;
}

#contenu section.article article .edition ul.ariane {
	font-size: 14px;
	margin: 0;
	padding: 0;
}

#contenu section.article article .edition ul.ariane li {
	display: block;
	float: left;
	padding: 0 5px 0 0;
}

#contenu section.article article .edition ul.ariane li:first-child:before {
	content: none;
}

#contenu section.article article .edition ul.ariane li:before {    
	font-family: 'FontAwesome';
	content: '\f0da';
	margin: 0 5px 0 0;
	color: #3e3c4a;
}

#contenu section.article article.ils-font-mulhouse .edition ul.ariane li:before {
	color: #0086cd;
}

#contenu section.article article .edition ul.ariane li a {
	color: #000000;
}

#contenu section.article article .edition ul.ariane li a:hover {
	color: #f04124;
	text-decoration: none;
}

#contenu section.article article.ils-font-mulhouse .edition ul.ariane li a:hover {
	color: #0086cd;
}

#contenu section.article article .edition p.date {
	font-size: 14px;
	margin: 0;
	padding: 0;
}

#contenu section.article article .edition p.date a {
	color: #f04124;
}

#contenu section.article article.ils-font-mulhouse .edition p.date a {
	color: #0086cd;
}

#contenu section.article article .edition p.date i {
	color: #f04124;
	margin: 0 5px 0 20px;
}

#contenu section.article article.ils-font-mulhouse .edition p.date i {
	color: #0086cd;
}

#contenu section.article article .edition p.date span.interraction {
	float: right;
	margin: 0 0 0 20px;
	padding: 0;
}

#contenu section.article article .edition p.date span.interraction a {
	color: #000000;
}

#contenu section.article article .edition p.date span.interraction i {
	color: #f04124;
	margin: 0 0 0 5px;
}

#contenu section.article article .edition p.date span.interraction i:first-child {
	margin: 0 20px 0 5px;
}

#contenu section.article article.ils-font-mulhouse .edition p.date span.interraction i {
	color: #0086cd;
	margin: 0 0 0 5px;
}

#contenu section.article article.ils-font-mulhouse .edition p.date span.interraction i:first-child {
	margin: 0 20px 0 5px;
}

/* Rédaction */

#contenu section.article article .redaction p {
	margin: 0 0 20px 0;
	padding: 0;
}

#contenu section.article article .redaction p + p {
	margin: 20px 0 20px 0;
	padding: 0;
}

#contenu section.article article .redaction h2 {
	font-size: 24px;
	font-weight: 700;
	margin: 30px 0 20px 0;
	padding: 0;
}

#contenu section.article article .redaction a {
	color: #f04124;
}

#contenu section.article article.ils-font-mulhouse .redaction a {
	color: #0086cd;
}

#contenu section.article article .redaction blockquote {
    border-left: 6px solid #f04124;
    color: #000000;
    font-style: italic;
    font-weight: 600;
    padding: 10px 20px 10px 20px;
    margin: 30px 0 30px 0;
}

#contenu section.article article.ils-font-mulhouse .redaction blockquote {
    border-left: 6px solid #0086cd;
    clear: both;
}

#contenu section.article article .redaction blockquote p {
	margin: 0;
	padding: 0;
}

#contenu section.article article .redaction img {
	float: right;
	margin: 0px 0 5px 20px;
	width: auto;
}

#contenu section.article article .redaction figure {
	padding: 0 0 15px 0;
	margin: 0;
	/*width: 100%;  MODIF GREG A  */
	display: block;
	float: right;
}

#contenu section.article article .redaction .wp-caption img {
	float: none;
	margin: 0;
	width: 100%;
}

#contenu section.article article .redaction figcaption.wp-caption-text {
	font-size: 14px;
	font-style: italic;
	margin: 5px 0 0 0;
	padding: 0;
	text-align: center;
}

#contenu section.article article .redaction figure.wp-caption {
	float: right;
	position: relative;
	margin: 0 0 30px 20px;
	overflow: hidden;
	width: 100%;
}

#contenu section.article article .redaction span.caption-credit {
    background-color: rgba(0, 0, 0, 0.5);
    /* For IE 5.5 - 7*/
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000);
    /* For IE 8*/
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000)";
    top: 0;
	color: #ffffff;
	font-size: 11px;
	font-weight: 400;
    position: absolute;
    margin: 0;
    padding: 6px 9px 6px 9px;
    max-width: 50%;
    right: 0;
}

#contenu section.article article .redaction .encadre {
    border: 1px solid #f04124;
    clear: both;
	padding: 15px 15px 15px 15px;
	margin: 30px 0 30px 0;
}

#contenu section.article article .redaction .encadre ul {
	margin-top: 0;
}

#contenu section.article article .redaction .encadre ul li {
	margin-top: 10px;
}

#contenu section.article article .redaction .demi {
    background: #f04124;
    float: right;
    width: 50%;
	margin: 0 0 20px 20px;
}

#contenu section.article article .redaction .demi a {
	color: #000!important;
	font-weight: bold!important;
}

#contenu section.article article .redaction .facebook:before {
	content: "\f09a";
	font-family: FontAwesome;
	font-style: normal;
	font-weight: normal;
	text-decoration: inherit;
	color: #f04124;
	font-size: 18px;
	padding: 0 6px 0 0;
}

#contenu section.article article.ils-font-mulhouse .redaction .facebook:before {
	color: #0086cd;
}

#contenu section.article article .redaction .twitter:before {
	content: "\f099";
	font-family: FontAwesome;
	font-style: normal;
	font-weight: normal;
	text-decoration: inherit;
	color: #f04124;
	font-size: 18px;
	padding: 0 6px 0 0;
}

#contenu section.article article.ils-font-mulhouse .redaction .twitter:before {
	color: #0086cd;
}

#contenu section.article article .redaction .tarif:before {
	content: "\f145";
	font-family: FontAwesome;
	font-style: normal;
	font-weight: normal;
	text-decoration: inherit;
	color: #f04124;
	font-size: 18px;
	padding: 0 6px 0 0;
}

#contenu section.article article.ils-font-mulhouse .redaction .tarif:before {
	color: #0086cd;
}

#contenu section.article article.ils-font-mulhouse .redaction .encadre {
    border: 1px solid #0086cd;
    clear: both;
}

#contenu section.article article.ils-font-mulhouse .redaction .demi {
    background: #0086cd;
}

#contenu section.article article .redaction .encadre h2 {
    color: #f04124;
	margin: 0 0 10px 0;
}

#contenu section.article article .redaction .demi h2 {
    color: #ffffff;
}

#contenu section.article article.ils-font-mulhouse .redaction .encadre h2 {
    color: #0086cd;
	margin: 0 0 10px 0;
}

#contenu section.article article.ils-font-mulhouse .redaction .demi h2 {
    color: #ffffff;
}

#contenu section.article article .redaction .demi p {
	color: #ffffff;
}

#contenu section.article article .redaction .encadre p {
	margin: 0;
}

#contenu section.article article .redaction .encadre p + p {
	margin: 10px 0 0 0;
}

#contenu section.article article .redaction .jetpack-video-wrapper {
	position: relative!important;
	padding-bottom: 56.25%; /* 16:9 */
	height: 0;
	margin: 20px 0 20px 0;
}
	
#contenu section.article article .redaction .jetpack-video-wrapper iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%!important;
	height: 100%!important;
}

#contenu section.article article .redaction p.renseignements {
    font-weight: 600;
    margin: 20px 0 10px 0;
    padding: 0 0 0 0;
}

#contenu section.article article .redaction p.renseignements::before {    
	font-family: 'FontAwesome';
	content: '\f055';
	margin: 0 5px 0 0;
	color: #f04124;
}

#contenu section.article article.ils-font-mulhouse .redaction p.renseignements::before {    
	color: #0086cd;
}

#contenu section.article article .redaction p.renseignements i {
	color: #f04124;
	margin: 0 6px 0 20px;
}

#contenu section.article article.ils-font-mulhouse .redaction p.renseignements i {
	color: #0086cd;
}

#contenu section.article article .redaction #etiquettes {
	background: #e9e9e9;
	clear: both;
	font-size: 14px;
	font-weight: 600;
    margin: 30px 0 0 0;
    padding: 20px 20px 20px 20px;
    border-left: 3px solid #000000;
}

#contenu section.article article.ils-font-mulhouse .redaction #etiquettes a {
	color: #0086cd;
}

div.redaction div.printfriendly.pf-alignleft {
	z-index: 10;
}


/************************** c Classique **************************/

/* Photo */

#contenu section.classique article {
	/*position: relative;
	overflow: hidden;*/
}

#contenu section.classique article .col-12 img {
	position: relative;
	width: 100%;
}

#contenu section.classique article .col-12 {
	position: relative;
}

#contenu section.classique article .description {
}

#contenu section.classique article .description .categorie {
	background: #ffffff;
	color: #000000;
	font-size: 12px;
	font-weight: 400;
	left: 10px;
	padding: 4px 8px 4px 8px;
    position: absolute;
	text-transform: uppercase;
	top: 0; 
}

#contenu section.classique article .description ul.social {
	margin: 0;
	padding: 10px 30px 2px 10px; 
    position: absolute;
    right: 0;
    top: 0;
}

#contenu section.classique article .description ul.social li {
	display: block;
	float: left;
	margin: 0 0 0 10px;
}

#contenu section.classique article .description ul.social li i {
	font-size: 13px;
}

#contenu section.classique article .description ul.social li i {
	color: #ffffff;
}

#contenu section.classique article .description ul.social li i:hover {
	color: #000000;
}

#contenu section.classique article .description h1 {
	bottom: 0;
	font-size: 40px;
	font-weight: 700;
    position: absolute;
    padding: 0;
    margin: 0 15px 23px 45px;
    max-width: 70%;
	left: 0;
	z-index: 100;
    /* Break word */
    word-break: break-word;
	-webkit-hyphens: auto;
	-moz-hyphens: auto;
	-ms-hyphens: auto;
	-o-hyphens: auto;
	hyphens: auto;
}

#contenu section.classique article .description h1 span {
    background: #000000;
    color: #ffffff;
    display: inline-block;
    padding: 3px 9px 6px 9px;
    margin: 3px 0 0px -15px;
}

#contenu section.classique article .description .copyright {
    background-color: rgba(0, 0, 0, 0.5);
    /* For IE 5.5 - 7*/
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000);
    /* For IE 8*/
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000)";
    bottom: 0;
	color: #ffffff;
	font-size: 11px;
	font-weight: 400;
    position: absolute;
    margin: 0 10px 3px 0;
    padding: 6px 9px 6px 9px;
    max-width: 20%;
    right: 0;
}

/* Edition */

#contenu section.classique article .edition {
	margin: 20px 0 20px 0;
}

#contenu section.classique article .edition ul.ariane {
	font-size: 14px;
	margin: 0;
	padding: 0;
}

#contenu section.classique article .edition ul.ariane li {
	display: block;
	float: left;
	padding: 0 5px 0 0;
}

#contenu section.classique article .edition ul.ariane li:first-child:before {
	content: none;
}

#contenu section.classique article .edition ul.ariane li:before {    
	font-family: 'FontAwesome';
	content: '\f0da';
	margin: 0 5px 0 0;
	color: #3e3c4a;
}

#contenu section.classique article .edition ul.ariane li a {
	color: #000000;
}

#contenu section.classique article .edition ul.ariane li a:hover {
	color: #f04124;
	text-decoration: none;
}

/* Rédaction */

#contenu section.classique article .redaction p {
	margin: 0 0 20px 0;
	padding: 0;
}

#contenu section.classique article .redaction p + p {
	margin: 20px 0 20px 0;
	padding: 0;
}

#contenu section.classique article .redaction h2 {
	font-size: 24px;
	font-weight: 700;
	margin: 30px 0 20px 0;
	padding: 0;
}

#contenu section.classique article .redaction a {
	color: #f04124;
}

#contenu section.classique article .redaction blockquote {
    border-left: 6px solid #f04124;
    color: #000000;
    font-style: italic;
    font-weight: 600;
    padding: 10px 20px 10px 20px;
    margin: 30px 0 30px 0;
}

#contenu section.classique article .redaction blockquote p {
	margin: 0;
	padding: 0;
}

#contenu section.classique article .redaction img {
	float: right;
	margin: 20px 0 20px 20px;
	width: auto;
}

#contenu section.classique article .redaction .wp-caption img {
	float: none;
	margin: 0;
	width: 100%;
}

#contenu section.classique article .redaction p.wp-caption-text {
	font-size: 14px;
	font-style: italic;
	margin: 5px 0 0 0;
	padding: 0;
	text-align: center;
}

#contenu section.classique article .redaction .wp-caption {
	float: right;
	position: relative;
	margin: 20px 0 30px 0;
	overflow: hidden;
}

#contenu section.classique article .redaction .wp-caption.petit {
	margin: 20px 0 30px 20px;
	width: 480px;
}

#contenu section.classique article .redaction p.copyright {
    background-color: rgba(0, 0, 0, 0.5);
    /* For IE 5.5 - 7*/
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000);
    /* For IE 8*/
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000)";
    top: 0;
	color: #ffffff;
	font-size: 11px;
	font-weight: 400;
    position: absolute;
    margin: 0;
    padding: 6px 9px 6px 9px;
    max-width: 50%;
    right: 0;
}

#contenu section.classique article .redaction .encadre {
    border: 1px solid #000000;
    clear: both;
	padding: 15px 15px 15px 15px;
	margin: 30px 0 30px 0;
}

#contenu section.classique article .redaction .encadre h2 {
    color: #000000;
	margin: 0 0 10px 0;
}

#contenu section.classique article .redaction .encadre p {
	margin: 0;
}

#contenu section.classique article .redaction .jetpack-video-wrapper {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	height: 0;
	margin: 20px 0 20px 0;
}
	
#contenu section.classique article .redaction .jetpack-video-wrapper iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%!important;
	height: 100%!important;
}

#contenu section.classique article .redaction p.renseignements {
    font-weight: 600;
    margin: 20px 0 10px 0;
    padding: 0 0 0 0;
}

#contenu section.classique article .redaction p.renseignements::before {    
	font-family: 'FontAwesome';
	content: '\f055';
	margin: 0 5px 0 0;
	color: #f04124;
}

#contenu section.classique article.ils-font-mulhouse .redaction p.renseignements::before {    
	color: #0086cd;
}

#contenu section.classique article .redaction p.renseignements i {
	color: #f04124;
	margin: 0 6px 0 20px;
}

/* Diaporama */

.slideshow-window {
	border-radius: 0!important;
    background-color:transparent!important;
    border: none!important;
    margin-bottom: 0!important;
    padding-top: 0!important;
	background-color:#ffffff !important;
}
div.slideshow-window.jetpack-slideshow.slideshow-black div.slideshow-slide {
	background-color:#ffffff !important;
}


/************************** e Brève **************************/

#contenu section.classique article .redaction div[id^="breve"]::before {
	content:"";
	display:block;
	height:80px; /* fixed header height*/
	margin:-100px 0 0; /* negative fixed header height */
}

#contenu section.classique article .redaction .breve {
	border: solid 1px #d2d2d2;
	padding: 20px 20px 10px 20px;
	position: relative;
	margin: 40px 0 30px 0;
}

#contenu section.classique article .redaction .breve:hover {
	border: solid 1px #f04124;
}

#contenu section.classique article .redaction .breve-container {
	border-left: solid 5px #d2d2d2;
	margin: 0 0 0 0;
	padding: 0 0 0 20px;
}

#contenu section.classique article .redaction .breve p {
	margin: 0 0 20px 0;
	padding: 0;
}

#contenu section.classique article .redaction .breve p + p {
	margin: 20px 0 20px 0;
	padding: 0;
}

#contenu section.classique article .redaction .breve h2 {
	font-size: 24px;
	font-weight: 700;
	margin: 0px 0 20px 0;
	padding: 0;
	width: 70%;
}

#contenu section.classique article .redaction p.date {
	float: right;
	font-size: 14px;
	margin: 0;
	padding: 6px 0 0 0;
	text-align: right;
	width: 30%;
}

#contenu section.classique article .redaction p.date i {
	color: #f04124;
	margin: 0 5px 0 20px;
}


/************************** f Evenements **************************/

#contenu section.evenements .col-12 {
	margin: 0 0 10px 0;
}

#contenu section.evenements .titre {
	margin: 8px 0 0 0;
}

#contenu section.evenements .titre h1 {
	background: #fdc300;
	color: #000000;
	display: inline;
	font-size: 40px;
	font-weight: 700;
	margin: 0 0 0 0;
    padding: 3px 18px 6px 18px;
	text-transform: uppercase;
}

#contenu section.evenements .titre h1 i {
	margin: 0 0 0 10px;
}

#contenu section.evenements .titre .ajout {
	color: #ffffff;
	font-size: 13px;
	float: right;
}

#contenu section.evenements .titre .ajout:hover {
	color: #fdc300;
	text-decoration: none;
}

#contenu section.evenements .titre .ajout:hover i {
	color: #fdc300;
}

#contenu section.evenements .titre .ajout i {
	color: #fdc300;
	margin: 0 0 0 10px;
}

#contenu section.evenements .titre p {
	color: #ffffff;
	height: 60px;
	margin: 40px 0 0 0;
	overflow: hidden;
}

/* Recherche */

#contenu section.evenements .recherche {
	background: #ffffff;
	outline: 1px solid #fdc300;
	margin: 50px 0 10px 0;
}

#contenu section.evenements .recherche .quoi {
	border-right: 1px solid #fdc300;
	float: left;
	padding: 0 40px 0 50px;
	margin: 30px 0 30px 0;
	width: 150px;
}

#contenu section.evenements .recherche .quoi label {
	color: #fdc300;
	cursor: pointer;
	display: block;
	font-size: 18px;
	font-weight: 700;
	margin: 0 0 10px 0;
	text-transform: uppercase;
}

#contenu section.evenements .recherche .quoi select {
	background: transparent;
	background: url(images/formulaire-select-blanc.png) center right no-repeat #000000;
	border: 1px solid #ffffff;
	color: #ffffff;
	padding: 5px 35px 5px 10px;
	font-size: 14px;
	height: 34px;
	width: 150px;
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
}

select::-ms-expand { display: none; } @media screen and (min-width:0\0) { select { background:none\9; padding: 5px\9; } }

#contenu section.evenements .recherche .quand {
	border-right: 1px solid #fdc300;
	float: left;
	font-size: 13px;
	padding: 0 40px 0 50px;
	margin: 30px 0 30px 0;
	position: relative;
	width: 290px;
}

#contenu section.evenements .recherche .quand label {
	color: #fdc300;
	cursor: pointer;
	display: block;
	font-size: 18px;
	font-weight: 700;
	margin: 0 0 10px 0;
	text-transform: uppercase;
}

#contenu section.evenements .recherche .quand input[type=text] {
	border: 1px solid #ffffff;
	background : #000000 url(images/formulaire-calendrier.png) center right no-repeat;
	color: #ffffff;
	font-size: 14px;
	font-weight: 300;
	margin: 0 10px 0 10px;
	padding: 8px 30px 8px 10px;
	width: 100px;
	/* Box-sizing */
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

#contenu section.evenements .recherche .motscles {
	border-right: 1px solid #fdc300;
	float: left;
	font-size: 13px;
	padding: 0 40px 0 50px;
	margin: 30px 0 30px 0;
	position: relative;
	width: 200px;
}

#contenu section.evenements .recherche .motscles label {
	color: #fdc300;
	cursor: pointer;
	display: block;
	font-size: 18px;
	font-weight: 700;
	margin: 0 0 10px 0;
	text-transform: uppercase;
}

#contenu section.evenements .recherche .motscles input[type=text] {
	border: 1px solid #ffffff;
	background : #000000 url(images/formulaire-motscles.png) center right no-repeat;
	color: #ffffff;
	font-size: 14px;
	font-weight: 300;
	margin: 0;
	padding: 8px 30px 8px 10px;
	width: 190px;
	/* Box-sizing */
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

#contenu section.evenements .recherche .soumettre {
	float: left;
	font-size: 13px;
	padding: 0 40px 0 50px;
	margin: 30px 0 30px 0;
	position: relative;
	width: 177px;
}

#contenu section.evenements .recherche .soumettre input[type="submit"] {
	background: #fdc300;
	border: none;
	color: #ffffff;
	cursor: pointer;
	font-weight: 700;
	font-size: 16px;
	float: right;
	font-family: 'Open Sans', sans-serif;
	padding:6px 14px 6px 14px;
	margin: 32px 0 0 0;
}

#contenu section.evenements .recherche .soumettre input[type="submit"]:hover {
	cursor: pointer;
	background: #000000;
}

/* Annonce */

#contenu section.evenements .annonce {
	margin: 25px 0 20px 0;
	position: relative;
	overflow: hidden;
}

#contenu section.evenements .annonce .photo {
	float: left;
	position: relative;
	overflow: hidden;
	height: 134px;
	width: 100%;
}

#contenu section.evenements .annonce .photo img {
    bottom: -1000px;
    left: -1000px;
    margin: auto;
    position: absolute;
    right: -1000px;
    top: -1000px;
    width: 510px;
	/* Transition */
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

#contenu section.evenements .annonce:hover .photo img {
	/* Scale */
	-webkit-transform:scale(1.05); /* Safari and Chrome */
	-moz-transform:scale(1.05); /* Firefox */
	-ms-transform:scale(1.05); /* IE 9 */
	-o-transform:scale(1.05); /* Opera */
	 transform:scale(1.05);
}

#contenu section.evenements .annonce .photo .titre h1 {
    background: none;
    top: 0;
    font-size: 16px;
    font-weight: 700;
    position: absolute;
    margin: 12px 17px 17px 28px;
    left: 0;
    right: 0;
}

#contenu section.evenements .annonce .photo .titre h1 span {
    background: #000000;
    color: #ffffff;
    display: inline-block;
    padding: 3px 6px 3px 6px;
    margin: 3px 0 0px -11px;
}

#contenu section.evenements .annonce:hover .photo .titre h1 span {
    background: #ffffff;
    color: #000000;
}

#contenu section.evenements .annonce .description {
	background: #fdc300;
	height: 150px;
	padding: 20px 20px 20px 20px;
    position: relative;
}

#contenu section.evenements .annonce .description h2 {
	font-size: 15px;
	font-weight: 700;
	margin: 0 0 10px 0;
	padding: 0;
}

#contenu section.evenements .annonce .description h2 a {
	color: #000000;
	text-decoration: none;
}

#contenu section.evenements .annonce .description p {
	font-size: 14px;
	font-weight: 400;
	height: 75px;
	margin: 0;
	padding: 0;
	overflow: hidden;
}

#contenu section.evenements .annonce .description p a {
	color: #3e3c4a;
	text-decoration: none;
}

#contenu section.evenements .annonce .description p.date {
	font-size: 13px;
	font-weight: 700;
	margin: 15px 0 0 0;
	padding: 0;
	text-transform: uppercase;
}

#contenu section.evenements .annonce .description p.date a {
	color: #ffffff;
	text-decoration: none;
}

#contenu section.evenements .annonce .description .degrade {
    background: linear-gradient(to bottom, rgba(253,195,255,0) 0, #fdc300 100%) repeat scroll 0 0 rgba(253,195,255,0);
    bottom: 65px;
    height: 40px;
    left: 0;
    position: absolute;
    right: 0;
    z-index: 200;
}

#contenu section.evenements .annonce a.plus i {
    bottom: -6px;
	color: #ffffff;
	font-size: 30px;
    position: absolute;
    right: -2px;
}

#contenu section.evenements .annonce a.plus i {
	color: #ffffff;
}

#contenu section.evenements .annonce:hover a.plus i {
	color: #000000;
}

/* Chargement */

#contenu section.chargement.evenements {
}

#contenu section.chargement.evenements .col-12 .container {
	background: #fdc300;
}

#contenu section.chargement.evenements:hover .col-12 .container {
	background: #000000;
}



/************************** g Evenement **************************/

/* Photo */

#contenu section.evenement article {
	/*position: relative;
	overflow: hidden;*/
}

#contenu section.evenement article .col-12 img {
	position: relative;
	width: 100%;
}

#contenu section.evenement article .col-12 {
	position: relative;
}

#contenu section.evenement article .description {
}

#contenu section.evenement article .description .categorie {
	background: #ffffff;
	color: #000000;
	font-size: 12px;
	font-weight: 400;
	left: 10px;
	padding: 4px 8px 4px 8px;
    position: absolute;
	text-transform: uppercase;
	top: 0; 
}

#contenu section.evenement article .description .categorie ul {
	list-style: none;
	padding: 0;
	margin: 0;
}

#contenu section.evenement article .description .categorie li {
	float: left;
	padding: 0;
	margin: 0;
}

#contenu section.evenement article .description ul.social {
	margin: 0;
	padding: 10px 30px 2px 10px; 
    position: absolute;
    right: 0;
    top: 0;
}

#contenu section.evenement article .description ul.social li {
	display: block;
	float: left;
	margin: 0 0 0 10px;
}

#contenu section.evenement article .description ul.social li i {
	font-size: 13px;
}

#contenu section.evenement article .description ul.social li i {
	color: #ffffff;
}

#contenu section.evenement article .description ul.social li i:hover {
	color: #f04124;
}

#contenu section.evenement article .description .titre {
	bottom: 0;
	font-size: 40px;
	font-weight: 700;
    position: absolute;
    padding: 0;
    margin: 0 15px 23px 45px;
    max-width: 70%;
	left: 0;
	z-index: 100;
}

#contenu section.evenement article .description p.date {
	font-size: 20px;
	font-weight: 700;
    padding: 0;
    margin: 0;
    /* Break word */
    word-break: break-word;
	-webkit-hyphens: auto;
	-moz-hyphens: auto;
	-ms-hyphens: auto;
	-o-hyphens: auto;
	hyphens: auto;
}

#contenu section.evenement article .description p.date span {
    background: #ffffff;
    color: #000000;
    display: inline-block;
    padding: 3px 9px 6px 9px;
    margin: 0 0 -3px -15px;
}

#contenu section.evenement article .description p.date span:first-child {
    text-transform: capitalize;
}

#contenu section.evenement article .description h1 {
	bottom: 0;
	font-size: 40px;
	font-weight: 700;
    padding: 0;
    margin: 0;
    /* Break word */
    word-break: break-word;
	-webkit-hyphens: auto;
	-moz-hyphens: auto;
	-ms-hyphens: auto;
	-o-hyphens: auto;
	hyphens: auto;
}

#contenu section.evenement article .description h1 span {
    background: #000000;
    color: #ffffff;
    display: inline-block;
    padding: 3px 9px 6px 9px;
    margin: 3px 0 0 -15px;
}

#contenu section.evenement article .description .copyright {
    background-color: rgba(0, 0, 0, 0.5);
    /* For IE 5.5 - 7*/
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000);
    /* For IE 8*/
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000)";
    bottom: 0;
	color: #ffffff;
	font-size: 11px;
	font-weight: 400;
    position: absolute;
    margin: 0 10px 3px 0;
    padding: 6px 9px 6px 9px;
    max-width: 20%;
    right: 0;
}

/* Rédaction */

#contenu section.evenement article .col-9 {
	margin: -3px 0 0 0;
}

#contenu section.evenement article .redaction {
	background: #fdc300;
	color: #000000;
	padding: 30px 20px 30px 20px;
}

#contenu section.evenement article .redaction p.lieu {
	color: #000000;
	font-size: 30px;
	font-weight: 700;
	padding: 0;
	margin: 0;
}

#contenu section.evenement article .redaction p.lieu i {
	margin: 0 10px 0 0;
}

#contenu section.evenement article .redaction p {
	margin: 0 0 20px 0;
	padding: 0;
}

#contenu section.evenement article .redaction p + p {
	margin: 20px 0 20px 0;
	padding: 0;
}

#contenu section.evenement article .redaction h2 {
	font-size: 24px;
	font-weight: 700;
	margin: 30px 0 20px 0;
	padding: 0;
}

#contenu section.evenement article .redaction a {
	color: #f04124;
	font-weight: 600;
}

#contenu section.evenement article .redaction blockquote {
    border-left: 6px solid #f04124;
    color: #000000;
    font-style: italic;
    font-weight: 600;
    padding: 10px 20px 10px 20px;
    margin: 30px 0 30px 0;
}

#contenu section.evenement article .redaction blockquote p {
	margin: 0;
	padding: 0;
}

#contenu section.evenement article .redaction img {
	float: right;
	margin: 20px 0 20px 20px;
	width: auto;
}

#contenu section.evenement article .redaction .wp-caption img {
	float: none;
	margin: 0;
	width: 100%;
}

#contenu section.evenement article .redaction p.wp-caption-text {
	font-size: 14px;
	font-style: italic;
	margin: 5px 0 0 0;
	padding: 0;
	text-align: center;
}

#contenu section.evenement article .redaction .wp-caption {
	float: right;
	position: relative;
	margin: 20px 0 30px 0;
	overflow: hidden;
}

#contenu section.evenement article .redaction .wp-caption.petit {
	margin: 20px 0 30px 20px;
	width: 480px;
}

#contenu section.evenement article .redaction p.copyright {
    background-color: rgba(0, 0, 0, 0.5);
    /* For IE 5.5 - 7*/
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000);
    /* For IE 8*/
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000)";
    top: 0;
	color: #ffffff;
	font-size: 11px;
	font-weight: 400;
    position: absolute;
    margin: 0;
    padding: 6px 9px 6px 9px;
    max-width: 50%;
    right: 0;
}

#contenu section.evenement article .redaction .encadre {
    border: 1px solid #f04124;
    clear: both;
	padding: 15px 15px 15px 15px;
	margin: 30px 0 30px 0;
}

#contenu section.evenement article .redaction .encadre h2 {
    color: #f04124;
	margin: 0 0 10px 0;
}

#contenu section.evenement article .redaction .encadre p {
	margin: 0;
}

#contenu section.evenement article .redaction .encadre p + p {
	margin: 10px 0 0 0;
}

#contenu section.evenement article .redaction .demi {
    background: #000000;
    float: right;
    width: 50%;
	margin: 30px 0 30px 20px;
}

#contenu section.evenement article .redaction .facebook:before {
	content: "\f09a";
	font-family: FontAwesome;
	font-style: normal;
	font-weight: normal;
	text-decoration: inherit;
	color: #ffffff;
	font-size: 18px;
	padding: 0 6px 0 0;
}

#contenu section.evenement article .redaction .twitter:before {
	content: "\f099";
	font-family: FontAwesome;
	font-style: normal;
	font-weight: normal;
	text-decoration: inherit;
	color: #ffffff;
	font-size: 18px;
	padding: 0 6px 0 0;
}

#contenu section.evenement article .redaction .tarif:before {
	content: "\f145";
	font-family: FontAwesome;
	font-style: normal;
	font-weight: normal;
	text-decoration: inherit;
	color: #ffffff;
	font-size: 18px;
	padding: 0 6px 0 0;
}

#contenu section.evenement article .redaction .demi h2 {
    color: #ffffff;
}

#contenu section.evenement article .redaction .demi p {
	color: #ffffff;
}

#contenu section.evenement article .redaction .jetpack-video-wrapper {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	height: 0;
	margin: 20px 0 20px 0;
}
	
#contenu section.evenement article .redaction .jetpack-video-wrapper iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%!important;
	height: 100%!important;
}

#contenu section.evenement article .redaction p.renseignements {
	background: #000000;
	color: #ffffff;
	display: inline;
	font-size: 16px;
    font-weight: 600;
    line-height: 30px;
    margin: 20px 0 10px 0;
    padding: 3px 9px 3px 9px;
}

#contenu section.evenement article .redaction p.renseignements a {
	color: #fdc300;
}


#contenu section.evenement article .redaction p.renseignements::before {    
	font-family: 'FontAwesome';
	content: '\f055';
	margin: 0 5px 0 0;
	color: #fdc300;
}

#contenu section.evenement article .redaction p.renseignements i {
	color: #fdc300;
	margin: 0 6px 0 20px;
}

#contenu section.evenement article .redaction .sharedaddy {
	margin: 20px 0 0 0;
}

#contenu section.evenement article .redaction div.sharedaddy h3.sd-title:before {
    border-top: 1px solid #000000!important;
}

/* Datepicker */

.ui-corner-all, .ui-corner-bottom, .ui-corner-right, .ui-corner-br {
	border-bottom-right-radius: 0px!important;
}

.ui-corner-all, .ui-corner-bottom, .ui-corner-left, .ui-corner-bl {
	border-bottom-left-radius: 0px!important;
}

.ui-corner-all, .ui-corner-top, .ui-corner-right, .ui-corner-tr {
	border-top-right-radius: 0px!important;
}

.ui-corner-all, .ui-corner-top, .ui-corner-left, .ui-corner-tl {
    border-top-left-radius: 0px!important;
}

.ui-widget-header {
	border: 1px solid #fdc300!important;
	background-color: #fdc300!important;
	background-image: none!important;
}

.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight {
    border: 1px solid #fdc300!important;
	background-color: #fdc300!important;
	background-image: none!important;
    color: #000000!important;
}


/************************** h Aside **************************/

aside {
}

/* Immanquables */

aside #immanquables {
	background: #ffffff;
	height: 400px;
	outline: 1px solid #c3c3c3;
	margin: 20px 0 0 0;
}

aside #immanquables h1 {
	background: #f04124;
	color: #ffffff;
	font-size: 18px;
	font-weight: 600;
	padding: 8px 20px 8px 20px;
	margin: 0;
	letter-spacing: 1px;
	text-transform: uppercase;
}

aside #immanquables h1 i {
	margin: 0 6px 0 0;
}

aside #immanquables ul {
	display: block;
	list-style-type: none;
	margin: 20px 0 20px 0;
	padding: 0;
	position: relative;
	height: 325px;
	overflow:auto;
}

aside #immanquables ul li {
	border-left: 3px solid #d2d2d2;
	color: #ffffff;
	font-size: 14px;
	font-weight: 400;
	margin: 0px 20px 5px 20px;
	padding: 0 15px 10px 15px;
}

aside #immanquables ul li:before {
	background: #ffffff;
	color: #f04124;
	content: "\f067"; /* FontAwesome Unicode */
	font-family: FontAwesome;
	display: inline-block;
	padding-bottom: 4px;
	margin-bottom: -4px;
	margin-left: -21px; /* same as padding-left set on li */
	width: 21px; /* same as padding-left set on li */
}

aside #immanquables ul li a {
	color: #000000;
}

aside #immanquables ul li a:hover {
	color: #f04124;
	text-decoration: none;
}

aside #immanquables ul li .surtitre {
	color: #f04124;
	font-size: 14px;
	font-weight: 700;
	text-transform: uppercase;
}

/* Image */

aside .image {
	height: 326px!important;
	padding: 0 0 30px 0;
	margin: 30px 0 0 0;
}

aside .image p {
	font-size: 18px;
	font-weight: 700;
	margin: 0 0 10px 0;
	padding: 0;
	text-transform: uppercase;
}

aside .image p a {
	color: #000000;
}

aside .image i {
	color: #f04124;
	margin: 0 0 0 6px;
}

aside .image .instagram {
	height: 280px!important;
	position: relative;
	/*outline: 1px solid #c3c3c3;*/
}

aside .image .instagram .partage {
    bottom: 0;
    font-size: 16px;
    font-weight: 700;
    position: absolute;
    margin: 0 0 20px 0;
    left: 0;
    right: 0;
}

aside .image .instagram p {
	background: #000000;
	color: #ffffff;
	display: inline-block;
    font-size: 16px;
    font-weight: 700;
    padding: 1px 6px 3px 6px;
    margin: 0 15px 3px 15px;
	text-transform: none;
}

aside .image .instagram p.insta {
	background: #f04124;
}

aside .image .instagram iframe {
	height: 280px!important;
}

aside .image .hashtag .apn {
    bottom: 0;
    position: absolute;
    margin: 0 0 0px 0;
    left: 0;
    right: 0;
}

aside .image .hashtag .apn img {
    bottom: 0;
    font-size: 16px;
    font-weight: 700;
    position: absolute;
    margin: 0 0 0px 0;
    left: 0;
    right: 0;
}

aside .image .hashtag {
	height: 46px;
	position: relative;
	outline: 1px solid #c3c3c3;
	text-align: center;
}

aside .image .hashtag p {
	font-size: 18px;
	font-weight: 700;
	padding: 12px 0 10px 30px;
}

aside .image .hashtag p a {
	color: #f04124;
	font-size: 18px;
	font-weight: 700;
	text-transform: none;
}

/* Twitter */

aside .twitter {
	margin: 30px 0 0 0;
}

aside .twitter p {
	font-size: 18px;
	font-weight: 700;
	margin: 0 0 10px 0;
	padding: 0;
	text-transform: uppercase;
}

aside .twitter p a {
	color: #000000;
}

aside .twitter i {
	color: #f04124;
	margin: 0 0 0 6px;
}

aside .twitter .tweet {
	height: 296px;
	padding: 10px 15px 20px 15px;
	outline: 1px solid #f04124;
	text-align: center;
}

aside .twitter .tweet a {
}

aside .twitter .tweet iframe {
	min-width: 100% !important;
	width: 100% !important;
}

/* Brève */

aside .breve {
	color: #ffffff;
	background: #000000;
	height: 190px;
	margin: 30px 0 0 0;
	position: relative;
	overflow: hidden;
}

aside .breve .titre {
	height: 140px;
	line-height: 140px;
	padding: 20px 30px 20px 30px;
}

aside .breve a h1 {
	color: #ffffff;
	font-size: 22px;
	font-weight: 600;
	line-height: 28px;
	text-align: center;
	line-height: 28px;
	width: 100%;
	vertical-align:middle;
	display:inline-block;
}

aside .breve.rouge {
	background: #f04124;
}

aside .breve ul.social {
	margin: 0;
	padding: 10px 20px 2px 10px; 
    position: absolute;
    right: 0;
}

aside .breve ul.social li {
	display: block;
	float: left;
	margin: 0 0 0 10px;
}

aside .breve ul.social li i {
	font-size: 13px;
}

aside .breve ul.social li i {
	color: #ffffff;
}

aside .breve ul.social li i:hover {
	color: #f04124;
}

aside .breve.rouge ul.social li i:hover {
	color: #000000;
}

aside .breve a.plus i {
    bottom: -9px;
	color: #ffffff;
	font-size: 50px;
    position: absolute;
    right: -2px;
}

aside .breve a.plus i {
	color: #ffffff;
}

aside .breve:hover a.plus i {
	color: #f04124;
}

aside .breve.rouge:hover a.plus i {
	color: #000000;
}

/* Annonce */

aside .annonce {
	margin: 30px 0 0 0;
	position: relative;
	overflow: hidden;
}

aside .annonce .photo {
	float: left;
	position: relative;
	overflow: hidden;
	height: 134px;
	width: 100%;
}

aside .annonce .photo img {
    bottom: -1000px;
    left: -1000px;
    margin: auto;
    position: absolute;
    right: -1000px;
    top: -1000px;
    width: 510px;
	/* Transition */
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

aside .annonce:hover .photo img {
	/* Scale */
	-webkit-transform:scale(1.05); /* Safari and Chrome */
	-moz-transform:scale(1.05); /* Firefox */
	-ms-transform:scale(1.05); /* IE 9 */
	-o-transform:scale(1.05); /* Opera */
	 transform:scale(1.05);
}

aside .annonce .photo .titre h1 {
    top: 0;
    font-size: 16px;
    font-weight: 700;
    position: absolute;
    margin: 12px 17px 17px 28px;
    left: 0;
    right: 0;
}

aside .annonce .photo .titre h1 span {
    background: #000000;
    color: #ffffff;
    display: inline-block;
    padding: 3px 6px 3px 6px;
    margin: 3px 0 0px -11px;
}

aside .annonce:hover .photo .titre h1 span {
    background: #ffffff;
    color: #000000;
}

aside .annonce .description {
	background: #fdc300;
	height: 150px;
	padding: 20px 20px 20px 20px;
    position: relative;
}

aside .annonce .description h2 {
	font-size: 15px;
	font-weight: 700;
	margin: 0 0 10px 0;
	padding: 0;
}

aside .annonce .description h2 a {
	color: #000000;
	text-decoration: none;
}

aside .annonce .description p {
	font-size: 14px;
	font-weight: 400;
	height: 75px;
	margin: 0;
	padding: 0;
	overflow: hidden;
}

aside .annonce .description p a {
	color: #3e3c4a;
	text-decoration: none;
}

aside .annonce .description p.date {
	font-size: 13px;
	font-weight: 700;
	margin: 15px 0 0 0;
	padding: 0;
	text-transform: uppercase;
}

aside .annonce .description p.date a {
	color: #ffffff;
	text-decoration: none;
}

aside .annonce .description .degrade {
    background: linear-gradient(to bottom, rgba(253,195,255,0) 0, #fdc300 100%) repeat scroll 0 0 rgba(253,195,255,0);
    bottom: 65px;
    height: 40px;
    left: 0;
    position: absolute;
    right: 0;
    z-index: 200;
}

aside .annonce a.plus i {
    bottom: -6px;
	color: #ffffff;
	font-size: 30px;
    position: absolute;
    right: -2px;
}

aside .annonce a.plus i {
	color: #ffffff;
}

aside .annonce:hover a.plus i {
	color: #000000;
}

/* Google map */

aside #map {
	margin: -3px 0 0 0;
}

aside #map .google-maps iframe {
	width: 100% !important;
	height: 300px !important;
}

/* Jetpack partage */

aside .sharedaddy {
	display: none;
}

/* Recherche */

aside .recherche {
	background: #ffffff;
	outline: 1px solid #fdc300;
	margin: 20px 0 0 0;
	padding: 20px 20px 20px 20px;
}

aside .recherche .em-search div {
    display: block!important;
}

aside .recherche .quoi {
	margin: 20px 0 0 0;
	position: relative;
}

aside .recherche .quoi label {
	color: #fdc300;
	cursor: pointer;
	display: block;
	font-size: 18px;
	font-weight: 700;
	margin: 0 0 10px 0;
	text-transform: uppercase;
}

aside .recherche .quoi select {
	background: transparent;
	background: url(images/formulaire-select-blanc.png) center right no-repeat #000000;
	border: 1px solid #ffffff;
	color: #ffffff;
	padding: 5px 35px 5px 10px;
	font-size: 14px;
	height: 34px;
	width: 100%;
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
}

select::-ms-expand { display: none; } @media screen and (min-width:0\0) { select { background:none\9; padding: 5px\9; } }

aside .recherche .quand {
	font-size: 13px;
	margin: 20px 0 0 0;
	position: relative;
	width: 290px;
}

aside .recherche .quand label {
	color: #fdc300;
	cursor: pointer;
	display: block;
	font-size: 18px;
	font-weight: 700;
	margin: 0 0 10px 0;
	text-transform: uppercase;
}

aside .recherche .quand input[type=text] {
	border: 1px solid #ffffff;
	background : #000000 url(images/formulaire-calendrier.png) center right no-repeat;
	color: #ffffff;
	font-size: 14px;
	font-weight: 300;
	margin: 0 6px 0 6px;
	padding: 8px 30px 8px 10px;
	width: 90px;
	/* Box-sizing */
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

aside .recherche .motscles {
}

aside .recherche .motscles label {
	color: #fdc300;
	cursor: pointer;
	display: block;
	font-size: 18px;
	font-weight: 700;
	margin: 0 0 10px 0;
	text-transform: uppercase;
}

aside .recherche .motscles input[type=text] {
	border: 1px solid #ffffff;
	background : #000000 url(images/formulaire-motscles.png) center right no-repeat;
	color: #ffffff;
	font-size: 14px;
	font-weight: 300;
	margin: 0;
	padding: 8px 30px 8px 10px;
	width: 100%;
	/* Box-sizing */
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

aside .recherche .soumettre {
	float: right;
	font-size: 13px;
	margin: 0px 0 0px 0;
	position: relative;
	width: 177px;
}

aside .recherche .soumettre input[type="submit"] {
	background: #fdc300;
	border: none;
	color: #ffffff;
	cursor: pointer;
	font-weight: 700;
	font-size: 16px;
	float: right;
	font-family: 'Open Sans', sans-serif;
	padding:6px 14px 6px 14px;
	margin: 32px 0 0 0;
}

aside .recherche .soumettre input[type="submit"]:hover {
	cursor: pointer;
	background: #000000;
}


/************************** i Commentaire **************************/

#contenu section.commentaire {
	background: #e9e9e9;
	display: block;
	float: none;
	height: auto;
	padding: 60px 0 60px 0;
	margin: 50px 0 0 0;
}

#contenu section.commentaire .titre {
	float: left;
	margin: 0 0 10px 0;
	padding: 0;
}

#contenu section.commentaire h2 {
	color: #000000;
	font-size: 30px;
	font-weight: 700;
	margin: 0 0 0 0;
	padding: 0;
	text-transform: uppercase;
}

#contenu section.commentaire h2 i {
	font-size: 26px;
	margin: 0 0 0 10px;
	padding: 0;
}

#contenu section.commentaire h3 {
	color: #000000;
	font-size: 18px;
	font-weight: 700;
	margin: 10px 0 0 0;
	padding: 0;
}

#contenu section.commentaire p {
	margin: 0;
	padding: 0;
}

#contenu section.commentaire p.comment-notes {
	font-size: 16px;
	margin: 10px 0 10px 0;
	padding: 0;
}

#contenu section.commentaire form {
	position: relative;
	overflow: hidden;
	padding: 0 0 0 0;
}

#contenu section.commentaire form label {
	color: #f04124;
	cursor: pointer;
	float: left;
	font-size: 14px;
	font-weight: 700;
	margin:20px 0 4px 0;
	text-align: left;
	text-transform: uppercase;
	width: 100%;
}

#contenu section.commentaire form label:hover {
	color: #fdc300;
}

#contenu section.commentaire form input[type=text],
#contenu section.commentaire form input[type=email],
#contenu section.commentaire form input[type=tel] {
	border: none;
	background: #ffffff;
	color: #3e3c4a;
	font-size: 16px;
	font-weight: 300;
	margin: 0;
	padding: 8px 10px 8px 10px;
	width: 100%;
	/* Box-sizing */
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

#contenu section.commentaire form input[type=text]:focus,
#contenu section.commentaire form input[type=mail]:focus,
#contenu section.commentaire form input[type=text]:hover,
#contenu section.commentaire form input[type=mail]:hover,
#contenu section.commentaire form input[type=tel]:hover,
#contenu section.commentaire form input[type=tel]:hover {
	color: #000000;
}

#contenu section.commentaire form textarea {
	border: none;
	background: #ffffff;
	color: #3e3c4a;
	height: 150px;
	font-weight: 300;
	font-size: 16px;
	margin: 0;
	padding: 8px 10px 8px 10px;
	width: 100%;
	/* Box-sizing */
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

#contenu section.commentaire form textarea:focus,
#contenu section.commentaire form textarea:hover {
	color: #000000;
}

#contenu section.commentaire form input[type="submit"] {
	background: #f04124;
	border: none;
	color: #ffffff;
	cursor: pointer;
	font-weight: 700;
	font-size: 16px;
	float: right;
	font-family: 'Open Sans', sans-serif;
	padding:6px 14px 6px 14px;
	margin: 20px 0 0 0;
}

#contenu section.commentaire form input[type="submit"]:hover {
	cursor: pointer;
	background: #000000;
}

#contenu section.commentaire #respond {
	margin: 10px 0 0 0;
}

#contenu section.commentaire .reply {
	margin: 10px 0 20px 0;
}

#contenu section.commentaire ol {
	margin: 40px 0 50px 0;
	padding: 0 10px 0 10px;
}

#contenu section.commentaire ol li {
    margin: 30px 0 10px 0;
}

#contenu section.commentaire .avatar {
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
}

#contenu section.commentaire .comment-metadata a {
	color: #a3a3a3;
	font-size: 14px;
}

#contenu section.commentaire .comment-metadata .edit-link a {
	color: #f04124;
	font-size: 14px;
}

#contenu section.commentaire ol li .comment-author {
	color: #000000;
	font-weight: 700;
}

#contenu section.commentaire ol li .comment-meta {
    font-weight: 300;
    color: #a3a3a3;
    margin: 0px 0 10px 0;
    padding: 0;
}

/* Modal Box */

#contenu section.commentaire .articles {
	font-size: 13px;
	float: right;
	margin: 0 0 20px 0;
	padding: 15px 0 0 0;
}

#contenu section.commentaire .articles button {
	background: transparent;
	border: none;
	color: #000000;
	cursor: pointer;
	margin: 0;
	padding: 0;
	text-decoration: none;
}

#contenu section.commentaire .articles button:hover {
	color: #f04124;
	margin: 0;
	padding: 0;
}

#contenu section.commentaire .articles button i {
	margin: 0 0 0 6px;
}

#contenu section.commentaire .articles a {
	background: transparent;
	border: none;
	color: #000000;
	cursor: pointer;
	margin: 0;
	padding: 0;
	text-decoration: none;
}

#contenu section.commentaire .articles a:hover {
	color: #f04124;
	margin: 0;
	padding: 0;
}

#contenu section.commentaire .articles a i {
	margin: 0 0 0 6px;
}

.modal {
	display: none;
	height: 100%;
	padding-top: 150px;
	left: 0;
	position: fixed;
	overflow: auto; /* Enable scroll if needed */
	top: 0;
	width: 100%;
	z-index: 99999;
	background-color: rgb(0,0,0);
	background-color: rgba(0,0,0,0.5);
	/* Transition */
	-webkit-animation: fade .5s;
	-moz-animation: fade .5s;
	-ms-animation: fade .5s;
	-o-animation: fade .5s;
	animation: fade .5s;
}

@keyframes fade {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}
@-webkit-keyframes fade {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}

.modal-content {
	background-color: #fefefe;
	max-height: 50%;
	margin: auto;
	position: relative;
	overflow: auto;
	width: 1000px;
}

.close-modal {
	color: #aaaaaa;
	float: right;
	font-size: 15px;
	margin: 20px 20px 20px 20px;
}

.close-modal:hover,
.close-modal:focus {
	color: #000000;
	text-decoration: none;
	cursor: pointer;
}

.modal h2 {
	font-size: 24px!important;
	font-weight: 700!important;
	margin: 20px 20px 20px 20px!important;
	padding: 0!important;
}

.modal p {
	margin: 0px 20px 20px 20px!important;
	padding: 0!important;
}

.modal p + p {
	margin: 20px 20px 20px 20px!important;
	padding: 0!important;
}



/************************** j Contact **************************/

#contenu section.contact {
	background: #e9e9e9;
	display: block;
	float: none;
	height: auto;
	padding: 60px 0 60px 0;
	margin: 0;
}

#contenu section.contact .articles {
	font-size: 13px;
	float: right;
	margin: 0 0 20px 0;
	padding: 15px 0 0 0;
}

#contenu section.contact .articles p {
	color: #000000;
	margin: 0;
	padding: 0;
}

#contenu section.contact .articles a {
	text-decoration: none;
}

#contenu section.contact .articles p:hover {
	color: #f04124;
	margin: 0;
	padding: 0;
}

#contenu section.contact .articles p i {
	margin: 0 0 0 6px;
}

#contenu section.contact .titre {
	float: left;
	margin: 0 0 10px 0;
	padding: 0;
}

#contenu section.contact h1 {
	color: #000000;
	font-size: 30px;
	font-weight: 700;
	margin: 0 0 0 0;
	padding: 0;
	text-transform: uppercase;
}

#contenu section.contact h1 i {
	font-size: 26px;
	margin: 0 0 0 10px;
	padding: 0;
}

#contenu section.contact form {
	position: relative;
	overflow: hidden;
	padding: 0 0 0 0;
}

#contenu section.contact form label {
	color: #f04124;
	cursor: pointer;
	/*float: left;*/
	font-size: 14px;
	font-weight: 700;
	margin:20px 0 4px 0;
	text-align: left;
	text-transform: uppercase;
	/*width: 100%;*/
}

#contenu section.contact form label:hover {
	color: #fdc300;
}

#contenu section.contact form input[type=text],
#contenu section.contact form input[type=email],
#contenu section.contact form input[type=tel] {
	border: none;
	background: #ffffff;
	color: #3e3c4a;
	font-size: 16px;
	font-weight: 300;
	margin: 0;
	padding: 8px 10px 8px 10px;
	width: 100%;
	/* Box-sizing */
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

#contenu section.contact form input[type=text]:hover,
#contenu section.contact form input[type=text]:focus,
#contenu section.contact form input[type=mail]:hover,
#contenu section.contact form input[type=mail]:focus,
#contenu section.contact form input[type=tel]:hover,
#contenu section.contact form input[type=tel]:focus {
	color: #000000;
}

#contenu section.contact form select {
	background: transparent;
	background: url(images/formulaire-select-noir.png) center right no-repeat #ffffff;
	border: 1px solid #ffffff;
	color: #000000;
	padding: 5px 35px 5px 10px;
	font-size: 16px;
	height: 34px;
	width: 100%;
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
}

#contenu section.contact form textarea {
	border: none;
	background: #ffffff;
	color: #3e3c4a;
	height: 150px;
	font-weight: 300;
	font-size: 16px;
	margin: 0;
	padding: 8px 10px 8px 10px;
	width: 100%;
	/* Box-sizing */
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

#contenu section.contact form textarea:focus,
#contenu section.contact form textarea:hover {
	color: #000000;
}

#contenu section.contact form input[type="submit"] {
	background: #f04124;
	border: none;
	color: #ffffff;
	cursor: pointer;
	font-weight: 700;
	font-size: 16px;
	float: right;
	font-family: 'Open Sans', sans-serif;
	padding:6px 14px 6px 14px;
	margin: 20px 0 0 0;
}

#contenu section.contact form input[type="submit"]:hover {
	cursor: pointer;
	background: #000000;
}

#contenu section.contact p.renseignements {
    font-weight: 600;
    margin: 20px 0 10px 0;
    padding: 0 0 0 0;
}

#contenu section.contact p.renseignements::before {    
	font-family: 'FontAwesome';
	content: '\f055';
	margin: 0 5px 0 0;
	color: #f04124;
}

#contenu section.contact p.renseignements i {
	color: #f04124;
	margin: 0 6px 0 20px;
}

#contenu section.contact .facebook:before {
	content: "\f09a";
	font-family: FontAwesome;
	font-style: normal;
	font-weight: normal;
	text-decoration: inherit;
	color: #f04124;
	font-size: 18px;
	padding: 0 6px 0 0;
}

#contenu section.article article .redaction .twitter:before {
	content: "\f099";
	font-family: FontAwesome;
	font-style: normal;
	font-weight: normal;
	text-decoration: inherit;
	color: #f04124;
	font-size: 18px;
	padding: 0 6px 0 0;
}

#contenu section.contact .tarif:before {
	content: "\f145";
	font-family: FontAwesome;
	font-style: normal;
	font-weight: normal;
	text-decoration: inherit;
	color: #f04124;
	font-size: 18px;
	padding: 0 6px 0 0;
}

/* Jetpack partage */

#contenu section.contact .sd-sharing-enabled {
	display: none;
}

/* Modal Box */

#contenu section.contact .articles {
	font-size: 13px;
	float: right;
	margin: 0 0 20px 0;
	padding: 15px 0 0 0;
}

#contenu section.contact .articles button {
	background: transparent;
	border: none;
	color: #000000;
	cursor: pointer;
	margin: 0;
	padding: 0;
	text-decoration: none;
}

#contenu section.contact .articles button:hover {
	color: #f04124;
	margin: 0;
	padding: 0;
}

#contenu section.contact .articles button i {
	margin: 0 0 0 6px;
}

#contenu section.contact .articles a {
	background: transparent;
	border: none;
	color: #000000;
	cursor: pointer;
	margin: 0;
	padding: 0;
	text-decoration: none;
}

#contenu section.contact .articles a:hover {
	color: #f04124;
	margin: 0;
	padding: 0;
}

#contenu section.contact .articles a i {
	margin: 0 0 0 6px;
}

/* Vidéo */

.post-type-archive-video #contenu section.rubrique article.tertiaire img {
    /*width: 510px;*/
}

#contenu section.contact .video {
	margin: 20px 0 30px 0;
	width: 100%;	
}

#contenu section.contact .video .youtube {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	height: 0;
	margin: 0;
}

#contenu section.contact .video .youtube iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

#contenu section.contact .map iframe {
	width: 100%!important;
}

/* Ajouter votre événement */

#event-form h3 { margin:30px 0px 10px 0px; font-weight:bold; }
#event-form p { margin-top:0px; margin-bottom: 0; }
#event-form .inside { clear:both; margin-bottom:20px; }

#event-form #event-name { width:90%; padding: 8px 10px 8px 10px; margin: 0 0 10px 0; }
#event-form .event-extra-details { margin-top:20px; }
#event-form .event-extra-details select { vertical-align:top; }
#event-form input.em-date-start,
#event-form input.em-date-end,
#event-form input.em-time-start,
#event-form input.em-time-end {	margin: 0 0 10px 0!important; width: auto!important; }
}
#event-form .event-extra-details select {  height: auto!important; }
#event-form .event-extra-details select {
    background-image: none!important;
    height: auto!important;
}

#em-location-data table.em-location-data {margin-top: 20px; }
#em-location-data table.em-location-data td, #em-location-data table.em-location-data th { vertical-align:top; border:none; padding: 0 0 5px 0; }
#em-location-data table.em-location-data select { width:100%; }
#em-location-data table.em-location-data { width:50%; float:left; border:none; }
#em-location-data .em-location-map-container { width: 50%; height: 400px; float:left; }
#em-location-data .em-location-map-404, #em-location-data .em-location-map-content { width:100%; height:100%; }
#em-location-data .em-location-map-404 { vertical-align:middle; text-align: center; }


div.em-datepicker.em-datepicker-until.em-event-dates div.em-datepicker-until-fields {
	width: 50% !important;
}
div#em-form-when.em.event-form-when.input div.em-time-range {
	width: 50% !important;
}


/*  --------------------------------------------------- 05 Footer --------------------------------------------------- */

footer {
	position: relative;
	margin: 50px 0 0 0;
}

/************************** a Accès rapide **************************/

footer #acces-rapides {
	background: #e9e9e9;
	padding: 0 0 25px 0;
}

footer #acces-rapides .logo {
	background: #e9e9e9;
	padding: 25px 0 0 0;
}

footer #acces-rapides p {
	font-size: 14px;
	font-weight: 700;
	margin: 0;
	padding: 23px 0 0 0;
}

footer #acces-rapides .mulhouse p {
	text-align: right;
}

footer #acces-rapides .rubrique {
	float: left;
	margin: 0 0 0 0;
	padding: 0;
}

footer #acces-rapides .rubrique ul {
	float: right;
	font-size: 12px;
	margin: 3px 0 0 0;
	padding: 0;
	text-transform: uppercase;
}

footer #acces-rapides .rubrique ul .col-1 {
	width: 140px;
}

footer #acces-rapides .rubrique ul li {
	background: #ffffff;
	display: block;
	float: left;
	margin: 0 16px 0 0;
	padding: 4px 6px 4px 6px;
}

footer #acces-rapides .rubrique ul li:hover {
	background: #f04124;
}

footer #acces-rapides .rubrique ul li a {
	color: #000000;
}

footer #acces-rapides .rubrique ul li:hover a {
	color: #ffffff;
	text-decoration: none;
}

footer #acces-rapides .mulhouse .rubrique ul li:hover {
	background: #fdc300;
}

footer #acces-rapides .mulhouse .rubrique ul li {
	float: right;
	margin: 0 0 0 16px;
}

footer #acces-rapides .mulhouse .rubrique {
	float: right;
}

footer #acces-rapides .mulhouse .rubrique ul {
	float: right;
}

footer #acces-rapides .mulhouse .rubrique ul .col-1 {
	width: 140px;
}

/************************** b Outils **************************/

footer .outils {
	background: #3e3c4a;
	color: #ffffff;
	font-size: 12px;
	min-height: 12px;
	margin: 0;
	padding: 9px 0 9px 0;
}

footer .outils ul.gauche {
	margin: 0;
	padding: 0;
}

footer .outils ul.gauche li {
	border-left: 1px solid #ffffff;
	display: block;
	float: left;
	padding: 0 10px 0 10px;
}

footer .outils ul.gauche li:first-child {
	border-left: none;
	padding: 0 10px 0 0;
}

footer .outils ul.gauche li a {
	color: #ffffff;
}

footer .outils ul.gauche li a:hover {
	color: #f04124;
	text-decoration: none;
}

footer .outils ul.droite {
	float: right;
	margin: 0;
	padding: 0;
}

footer .outils ul.droite li {
	border-right: 1px solid #ffffff;
	display: block;
	float: left;
	padding: 0 10px 0 10px;
}

footer .outils ul.droite li:last-child {
	border-right: none;
	padding: 0 10px 0 10px;
}

footer .outils ul.droite li a {
	color: #ffffff;
}

footer .outils ul.droite li a:hover {
	color: #f04124;
	text-decoration: none;
}

/************************** c Scroll up **************************/

footer .backup .scrollup {
	background-color: #d8d8d8;
	border: 1px solid #d8d8d8;
	bottom: 50px;
	color: #ffffff;
	display: none;
	height: 40px;
	font-size: 20px;
	position: fixed;
	right: 50px;
	line-height: 37px;
	text-align: center;
	width: 40px;
}

footer .backup .scrollup.fixed {
	display: block;
}
 
footer .backup .scrollup:hover {
	background: #f04124;
	color: white;
}


/*  --------------------------------------------------- 06 Habillage --------------------------------------------------- */

#habillage {
	position: relative;
}

#habillage .fixed {
	position: relative;
	margin: 0 0 0 300px;
}

#habillage .fixed img.haut {
	height: 110px;
	position: fixed;
	top: 8px;
	z-index: 9999;
	/* Transition */
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

#habillage.smaller .fixed img.haut {
	height: 75px;
	/* Transition */
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
	/* Transition delay */
    -webkit-transition-delay: 0.3s;
    -moz-transition-delay: 0.3s;
    -ms-transition-delay: 0.3s;
    -o-transition-delay: 0.3s;
    transition-delay: 0.3s;
}

#habillage img.gauche {
	position: absolute;
	top: 200px;
	left: -300px;
	z-index: 100;
}

#habillage img.droite {
	position: absolute;
	top: 200px;
	right: -300px;
	z-index: 100;
}

/*  --------------------------------------------------- 07 Autre --------------------------------------------------- */

/************************** a Wow **************************/

.js .wow {
	visibility: hidden;
}

.ie-old{
	background-color: #3e3c4a;
	color: #ffffff;
	font-size: 14px;
	margin: 0 !important;
	padding: 10px 0 !important;
	position: fixed !important;
	text-align: center;
	top: 0;
	z-index: 99999;
}


/*  --------------------------------------------------- 08 Application --------------------------------------------------- */

.wpappninja .wow {
	visibility: visible !important;
	-webkit-animation: none !important;
	-moz-animation: none !important;
	-o-animation: none !important;
	-ms-animation: none !important;
	animation: none !important;
}

/* masquer notif */
div#wpappninja_banner {
	display:none !important;
}
/*Promotion appli V2 */

div.applivdeux {
	margin:10px 0 10px 0;
	padding:5px  20px 5px 20px;
	outline: 1px dotted #f04124;
}


/*  --------------------------------------------------- Responsive --------------------------------------------------- */

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

	.page-container {
		width: auto;
		max-width: 1200px;
	}

	.col-1 {
		width: 8.3%;
	}

	.col-3 {
		width: 25%;
	}

	.col-4 {
		width: 33.3%;
	}

	.col-5 {
		width: 41.6%;
	}

	.col-6 {
		width: 50%;
	}

	.col-9 {
		width: 75%;
	}

	.col-12 {
		width: 100%;
	}

	#habillage .fixed {
		margin: 0 0 0 32%;
	/* Transition */
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
	}

	#habillage.smaller .fixed {
		margin: 0 0 0 18%;
	/* Transition */
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
	}

	#habillage .fixed img.haut {
		height: 90px;
	}

	header #entete #recherchemenu {
	    width: 68%;
	}

	#contenu .gris {
		background: #3e3c4a;
		margin-bottom: -24%;
	    padding-bottom: 24%;
	}

	#contenu .gris.fixe {
		background: #3e3c4a;
		margin-bottom: -300px;
		padding-bottom: 300px;
	}

	#contenu section.actualites article.col-6 {
		width: 50%;
	}

	#contenu section.actualites #secondaires {
		width: 25%;
	}

	#contenu section.actualites #secondaires article.col-3 {
		width: auto;
	}

	#contenu section.actualites #immanquables.col-3 {
		width: 25%;
    	margin: 0;
	}

	#contenu section.medias .twitter {
		display: none;
	}
	
	div.facebookpageplugin {
		width:500px;
	}
		
	#contenu section.medias .instagram-container.col-3 {
		width: 50%;
	}

	#contenu section.medias .image {
		height: auto!important;
	}

	#contenu section.medias .image .hashtag {
		display: none;
	}

	#contenu section.agenda .rubrique {
		display: none;
	}

	#contenu section.article .col-9 {
		width: 100%;
	}

	#contenu section.evenement .col-9 {
		width: 100%;
	}

	.modal-content {
	    background-color: #fefefe;
	    margin: auto;
	    width: 80%;
	}

	#contenu section.evenements .recherche .quoi {
		border-right: none;
		padding: 0 5% 0 5%;
		width: 15%;
	}

	#contenu section.evenements .recherche .quand {
		border-right: 1px solid #fdc300;
		font-size: 13px;
		padding: 0 5% 0 5%;
		width: 25%;
	}

	#contenu section.evenements .recherche .motscles {
		border-right: 1px solid #fdc300;
		font-size: 13px;
		padding: 0 5% 0 5%;
		width: 24%;
	}

	#contenu section.evenements .recherche .soumettre {
		float: none;
		font-size: 13px;
		padding: 0;
		width: 100%;
	}

	#contenu section.evenements .recherche .soumettre input[type="submit"] {
		margin: 0;
		width: 100%;
	}

	#contenu section.article article .redaction .wp-caption img {
		margin: 0 0 0 20px;
	}

	aside {
		display: none;
	}

	footer #acces-rapides .col-1 {
		width: 15%;
	}

	footer #acces-rapides .col-1 .mulhouse {
		float: right;
	}

	footer #acces-rapides .col-5 {
		width: 35%;
	}

	footer #acces-rapides .rubrique ul .col-1 {
		width: auto;
	}

	footer #acces-rapides .mulhouse .rubrique ul .col-1 {
		float: right;
		width: auto;
	}

}


@media only screen and (max-width: 1000px) {
/* Avant passage à 5 articles a la une :
	#contenu section.actualites article.col-6 {
		width: 70%;
	}

	#contenu section.actualites #secondaires {
		float: left;
		width: 30%;
	}

	#contenu section.actualites #secondaires article.col-3 {
		width: auto;
	}
*/
/* Après passage à 5 articles a la une : */
	#contenu section.actualites article.col-6 {
		width: 100%;
	}

	#contenu section.actualites #secondaires {
		float: left;
		width: 100%;
	}

	#contenu section.actualites #secondaires article.col-3 {
		float: left;
		width: 50%;
	}
	
	#contenu section.actualites article.principal img {
		
	}
	#contenu section.actualites #secondaires article.secondaire img {
		
	}
	
	#contenu section.actualites .immanquables-container {
    	margin: 0 10px 0 10px;
	}

	#contenu section.actualites #immanquables.col-3 {
		width: 49.5%;
    	margin: 30px 0 0 0;
	}

	#contenu section.actualites .col-3.twitter-medium .container {
    	margin: 0 10px 0 20px;
	}

	#contenu section.actualites .col-3.twitter-medium {
		display: none;
	}

	#contenu section.actualites .twitter {
    	margin: 27px 0 0 0;
	}

	#contenu section.actualites .twitter .tweet {
	    height: 343px;
	}

	#contenu section.breves {
	    margin: 0;
	}

	#contenu section.breves .col-3 {
		width: 50%;
		margin: 20px 0 0 0;
	}

	#contenu section.medias .col-3.twitter-large {
		display: none;
	}

	#contenu section.agenda .col-3 {
		width: 50%;
	}

	#contenu section.evenements .col-3 {
		width: 33.33%;
	}

}

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

	#contenu section.article article .redaction figure {
		padding: 0;
		margin: 0;
		width: 100%!important;
	}

	#contenu section.article article .redaction .wp-caption img {
		float: none;
		margin: 0;
		height: auto!important;
		width: 100%!important;
	}

	#contenu section.article article .redaction img {
		float: none;
		margin: 0;
		height: auto!important;
		width: 100%!important;
	}

}


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

	header #entete #recherchemenu {
		display: none;
	}

	#habillage .fixed {
		margin: 0 0 0 45%;
	}

	#habillage.smaller .fixed {
		margin: 0 0 0 45%;
	}

	#habillage .fixed img.haut {
		top: 50px;
	}

	#habillage.smaller .fixed img.haut {
		top: 8px;
	}

	#contenu section.article article .description h1,
	#contenu section.classique article .description h1,
	#contenu section.evenement article .description .titre {
		font-size: 30px;
	    max-width: 100%;
	}

	#contenu section.article article .description h1 span,
	#contenu section.article.classique .description h1 span,
	#contenu section.article.evenement .description h1 span {
	    padding: 3px 9px 6px 9px;
	    margin: 3px 0 0px -15px;
	}

	#contenu section.article article .description .copyright,
	#contenu section.classique article .description .copyright,
	#contenu section.evenement article .description .copyright {
	    display: none;
	}

	#contenu section.article article .edition {
		margin: 0 0 20px 0;
	}

	#contenu section.article article .edition ul.ariane {
		display: none;
	}

	#contenu section.article article .edition p.date i {
	    margin: 0 5px 0 0px;
	}

	#contenu section.rubrique .col-4 {
		width: 50%;
	}

	#contenu section.evenements .titre p {
		display: none;
	}

	#contenu section.evenements .recherche .quoi {
		border-right: 1px solid #fdc300;
		float: left;
		font-size: 13px;
		padding: 0 5% 0 5%;
		margin: 0px 0 30px 0;
		position: relative;
		width: 35%;
	}

	#contenu section.evenements .recherche .quand {
		border-right: none;
		float: left;
		font-size: 13px;
		padding: 0 5% 0 5%;
		margin: 30px 0 30px 0;
		position: relative;
		width: 49%;
	}

	#contenu section.evenements .recherche .motscles {
		border-right: 1px solid #fdc300;
		float: left;
		padding: 0 5% 0 5%;
		margin: 30px 0 30px 0;
		width: 30%;
	}

	#contenu section.evenements .recherche .soumettre {
		float: left;
		font-size: 13px;
		padding: 0 5% 0 5%;
		margin: 0px 0 30px 0;
		position: relative;
		width: 44%;
	}

	#contenu section.evenements .recherche .soumettre input[type="submit"] {
		margin: 34px 0 0 0;
		width: 100%;
	}

	#contenu section.evenements .col-3 {
		width: 50%;
	}

}


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

	#contenu section.actualites article.col-6 {
		width: 100%;
	}

	#contenu section.actualites #secondaires {
		float: left;
		width: 100%;
	}

	#contenu section.actualites #secondaires article.col-3 {
		float: left;
		width: 50%;
	}

	#contenu section.actualites #immanquables ul li {
		float: none;
	}

	#contenu section.tertiaires {
	    margin: 30px 0 0 0;
	}

	#contenu section.tertiaires .col-4 {
		margin-bottom: 20px;
		width: 100%;
	}

	#contenu section.article article .description h1,
	#contenu section.classique article .description h1 {
		font-size: 25px;
		position: relative;
	    margin: -6px 15px 23px 15px;
	}

	#contenu section.evenement article .description .titre {
		background: #fdc300;
		position: relative;
	    margin: -3px 0px 3px 0px;
	    padding: -3px 0px 3px 15px;
	}

	#contenu section.evenement article .description .titre p.date {
		font-size: 16px;
	    padding: 20px 0 0 30px;
	    margin: 0;
	}

	#contenu section.evenement article .description .titre p.date span {
	    padding: 3px 9px 6px 9px;
	    margin: 0 0 -3px -12px;
	}

	#contenu section.evenement article .description .titre h1 {
		font-size: 25px;
	    margin: 0;
	    padding: 0px 0 0 30px;
	}

	#contenu section.article article .redaction .wp-caption.petit,
	#contenu section.classique article .redaction .wp-caption.petit {
		margin: 20px 0 30px 0;
		width: 100%;
	}


	#contenu section.article article .redaction img,
	#contenu section.classique article .redaction img {
		margin: 20px 0 30px 0;
		width: 100%;
	}

	#contenu section.article article .redaction .wp-caption.petit img,
	#contenu section.classique article .redaction .wp-caption.petit img {
		margin: 0;
		width: 100%;
	}

	footer #acces-rapides .logo {
	}

	footer #acces-rapides .col-5 {
		display: none;
	}

	footer #acces-rapides .col-1 {
		width: 50%;
	}

	footer .outils ul.gauche li {
		margin: 0 0 6px 0;
		text-align: center;
		width: 100%;
	}

	footer .outils ul.droite {
		float: none;
		margin: 0;
		padding: 0;
	}

	footer .outils ul.droite li {
		border-right: none;
		display: block;
		float: right;
		padding: 0 10px 0 10px;
		margin: 0 0 6px 0;
		text-align: center;
		width: 100%;
	}
	
}

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

	#contenu section.actualites .col-3.twitter-medium {
		display: none;
	}

	#contenu section.actualites .immanquables-container {
    	margin: 0 11px 0 11px;
	}

	#contenu section.actualites #immanquables.col-3 {
		width: 100%;
    	margin: 30px 0 0 0;
	}

	#contenu section.medias .col-6 {
		width: 100%;
	}

	#contenu section.medias .instagram-container.col-3 {
		margin: 30px 0 0 0;
		width: 100%;
	}

	#contenu section.classique article .redaction .breve p.date i {
		color: #f04124;
		margin: 0 5px 0 0px;
	}

	#contenu section.classique article .redaction .breve h2 {
		font-size: 24px;
		font-weight: 700;
		margin: 0px 0 20px 0;
		padding: 0;
		width: 100%;
	}

	#contenu section.classique article .redaction p.date {
		float: none;
		font-size: 14px;
		margin: 0;
		padding: 6px 0 0 0;
		text-align: left;
		width: 100%;
	}

	#contenu section.evenements .recherche .quoi {
		border-right: none;
		margin: 10px 0 30px 0;
		width: 90%;
		text-align: center;
	}

	#contenu section.evenements .recherche .quand {
		border-right: none;
		margin: 10px 0 10px 0;
		width: 90%;
		text-align: center;
	}

	#contenu section.evenements .recherche .motscles {
		border-right: none;
		margin: 20px 0 10px 0;
		width: 90%;
		text-align: center;
	}

	#contenu section.evenements .recherche .soumettre {
		float: none;
		padding: 0;
		margin: 30px 0 30px 0;
		width: 100%;
	}

	#contenu section.evenements .recherche .soumettre input[type="submit"] {
		margin: 0;
		width: 100%;
	}

	#em-location-data table.em-location-data {
		width:100%;
	}

	#em-location-data .em-location-map-container {
		width: 100%;
	}

	footer .backup {
		display: none;
	}

}

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

	#contenu section.actualites article.col-6 {
		width: 100%;
	}

	#contenu section.actualites #secondaires {
		float: left;
		width: 100%;
	}

	#contenu section.actualites #secondaires article.col-3 {
		float: none;
		width: auto;
	}
	
	#contenu section.actualites #secondaires article.secondaire img {
			min-height: 200px;
	}
	
	#contenu section.actualites #secondaires article.secondaire {
		height:200px;
	}
	
	#contenu section.breves .col-3 {
		width: 100%;
	}

	#contenu section.breves .chiffre {
		height: 210px;
		margin: 8px 0 0 0;
	}

	#contenu section.breves .chiffre .description {
		height: 110px;
		line-height: 100px;
	}

	#contenu section.agenda .col-3,
	#contenu section.evenements .col-3 {
		width: 100%;
	}

	#contenu section.rubrique .col-4 {
		width: 100%;
	}

	#contenu section.article article .redaction .demi {
	    float: none;
		margin: 30px 0 30px 0;
	    width: 100%;
	}

	#contenu section.evenement article .redaction .demi {
	    float: none;
		margin: 30px 0 30px 0;
	    width: 100%;
	}

}
div.em-datepicker-data.inline-inputs.hidden {
	display:inline-block !important;	
}

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

	header .outils ul.gauche {
		display: none;
	}

	#habillage .fixed {
		display: none;
	}

	#contenu section.article article .edition p.date span.interraction {
		display: none;
	}

	#contenu section.evenements .titre .ajout {
		display: block;
		float: none;
		margin: 20px 0 0 0;
		text-align: left;
	}

	#contenu section.evenements .recherche {
	background: #ffffff;
	outline: 1px solid #fdc300;
	margin: 10px 0 0 0;
	}

}


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

	#contenu section.medias .image .instagram .partage {
		display: none;
	}

	#contenu section.medias .image .instagram {
	    height: 180px!important;
	}

	#contenu section.medias .image .instagram iframe {
	    height: 180px!important;
	}

}