/*
La méthodologie BEM est utilisée.
*/
/*
Les helpers sont des bouts de code facilitant le travail : mixins, variables, ...
Identiques que ceux de PointCulture
*/
/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
  display: block;
}
body {
  line-height: 1;
}
ol,
ul {
  list-style: none;
}
blockquote,
q {
  quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
  content: '';
  content: none;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
.clearfix:after {
  visibility: hidden;
  display: block;
  font-size: 0;
  content: " ";
  clear: both;
  height: 0;
}
.clearfix {
  display: inline-block;
  position: relative;
}
* html .clearfix {
  height: 1%;
}
.clearfix {
  display: block;
}
.hidden {
  display: none;
}
.right {
  float: right;
}
.right + .right {
  margin-right: 15px;
}
.left {
  float: left;
}
.left + .left {
  margin-left: 30px;
  margin-top: 6px;
}
.border--bottom:after {
  background: #9fa8a8;
  content: '';
  display: block;
  height: 1px;
  margin: 15px 0;
  clear: both;
}
.border--top:before {
  background: #9fa8a8;
  content: '';
  display: block;
  height: 1px;
  margin: 15px 0;
}
.responsive-object {
  width: 100%;
  position: relative;
}
.responsive-object iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.container {
  width: 100%;
  max-width: 100%;
  margin: 0 auto;
  padding-left: 30px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  background-size: 100% auto;
}
.col {
  float: left;
  width: 100%;
  padding-right: 30px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.first {
  clear: left;
}
.col--center {
  margin-left: auto;
  margin-right: auto;
  float: none;
}
.has-col {
  padding-right: 0;
}
.first {
  clear: left;
}
.col--alone {
  padding-right: 30px;
}
.clear {
  clear: both;
}
.small--hidden {
  display: none;
}
.grid--s-2 .col--s-1-2:nth-child(odd) {
  clear: both;
}
/* Responsive : mobile first */
@media (min-width: 520px) {
  .big--hidden {
    display: none;
  }
  .small--hidden {
    display: block;
  }
}
@media (min-width: 680px) {
  .col--s-1-2 {
    width: 50%;
  }
  .col--s-1-3 {
    width: 33.33333333%;
  }
  .col--s-2-3 {
    width: 66.66666667%;
  }
  .col--s-1-5 {
    width: 33.33333333%;
  }
  .col--s-1-4 {
    width: 25%;
  }
  .col--s-3-4 {
    width: 75%;
  }
  .col--s-3-5 {
    width: 60%;
  }
  .col--s-2-5 {
    width: 40%;
  }
  .col--s-4-5 {
    width: 80%;
  }
  .col--s-3-10 {
    width: 30%;
  }
  .col--s-6-7 {
    width: 85.71428571%;
  }
  .col--s-7-10 {
    width: 70%;
  }
}
@media (min-width: 960px) {
  .col--border-left {
    position: relative;
  }
  .col--border-left:after {
    display: block;
    content: '';
    width: 1px;
    background: #9fa8a8;
    position: absolute;
    top: 0;
    bottom: 0;
    left: -16px;
  }
  .col--border-right {
    position: relative;
  }
  .col--border-right:after {
    display: block;
    content: '';
    width: 1px;
    background: #9fa8a8;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 15px;
  }
  .small--hidden {
    display: block;
  }
  .col--full {
    width: 100%;
  }
  .col--1-5 {
    width: 20%;
  }
  .col--1-2 {
    width: 50%;
  }
  .col--1-3 {
    width: 33.33333333%;
  }
  .col--2-3 {
    width: 66.66666667%;
  }
  .col--1-4 {
    width: 25%;
  }
  .col--3-4 {
    width: 75%;
  }
  .col--3-5 {
    width: 60%;
  }
  .col--2-5 {
    width: 40%;
  }
  .col--4-5 {
    width: 80%;
  }
  .col--5-8 {
    width: 62.5%;
  }
  .col--3-10 {
    width: 30%;
  }
  .col--3-8 {
    width: 37.5%;
  }
  .col--6-7 {
    width: 85.71428571%;
  }
  .col--7-10 {
    width: 70%;
  }
  .grid--4 .col--1-4:nth-child(odd) {
    clear: none;
  }
  .grid--4 .col--1-4:nth-child(4n+1) {
    clear: both;
  }
}
@media (min-width: 1024px) {
  .container {
    max-width: 1024px;
  }
}
@media (min-width: 1280px) {
  .container {
    max-width: 1280px;
  }
}
/* Responsive : mobile first
@media (min-width: 768px){}
@media (min-width: 960px){}
*/
/* Mixins */
/* Call mixins */
.slick-carousel__dots .slick-active button.theme--numerique,
a.theme--numerique:hover .box--background,
a.theme--numerique:focus .box--background,
.theme--numerique .link--read-more:before,
.theme--numerique.label span {
  background: #5fcba0;
}
.detail__text .slick-carousel__dots .slick-active button.theme--numerique,
.detail__text a.theme--numerique:hover .box--background,
.detail__text a.theme--numerique:focus .box--background,
.detail__text .theme--numerique .link--read-more:before,
.detail__text .theme--numerique.label span {
  background: #c7cccc;
}
.theme--numerique .badge:after {
  background: rgba(95, 203, 160, 0.5);
}
.slick-carousel__dots button.theme--numerique {
  border-color: #5fcba0;
}
.theme--numerique.nav__link:before {
  font-family: 'Material Design Icons';
  content: '\F407';
  display: inline;
  margin-right: 5px;
  color: #5fcba0;
}
.theme--numerique.nav__link:hover,
.theme--numerique.nav__link.active {
  color: #5fcba0;
}
.theme--numerique.nav__link:after {
  background-color: #5fcba0;
}
.theme--numerique.theme__option:before {
  color: #5fcba0;
}
.slick-carousel__dots .slick-active button.theme--sante,
a.theme--sante:hover .box--background,
a.theme--sante:focus .box--background,
.theme--sante .link--read-more:before,
.theme--sante.label span {
  background: #ff4f83;
}
.detail__text .slick-carousel__dots .slick-active button.theme--sante,
.detail__text a.theme--sante:hover .box--background,
.detail__text a.theme--sante:focus .box--background,
.detail__text .theme--sante .link--read-more:before,
.detail__text .theme--sante.label span {
  background: #c7cccc;
}
.theme--sante .badge:after {
  background: rgba(255, 79, 131, 0.5);
}
.slick-carousel__dots button.theme--sante {
  border-color: #ff4f83;
}
.theme--sante.nav__link:before {
  font-family: 'Material Design Icons';
  content: '\F407';
  display: inline;
  margin-right: 5px;
  color: #ff4f83;
}
.theme--sante.nav__link:hover,
.theme--sante.nav__link.active {
  color: #ff4f83;
}
.theme--sante.nav__link:after {
  background-color: #ff4f83;
}
.theme--sante.theme__option:before {
  color: #ff4f83;
}
.slick-carousel__dots .slick-active button.theme--genre,
.slick-carousel__dots .slick-active button.theme--genres,
a.theme--genre:hover .box--background,
a.theme--genres:hover .box--background,
a.theme--genre:focus .box--background,
a.theme--genres:focus .box--background,
.theme--genre .link--read-more:before,
.theme--genres .link--read-more:before,
.theme--genre.label span,
.theme--genres.label span {
  background: #5bb8ef;
}
.detail__text .slick-carousel__dots .slick-active button.theme--genre,
.detail__text .slick-carousel__dots .slick-active button.theme--genres,
.detail__text a.theme--genre:hover .box--background,
.detail__text a.theme--genres:hover .box--background,
.detail__text a.theme--genre:focus .box--background,
.detail__text a.theme--genres:focus .box--background,
.detail__text .theme--genre .link--read-more:before,
.detail__text .theme--genres .link--read-more:before,
.detail__text .theme--genre.label span,
.detail__text .theme--genres.label span {
  background: #c7cccc;
}
.theme--genre .badge:after,
.theme--genres .badge:after {
  background: rgba(91, 184, 239, 0.5);
}
.slick-carousel__dots button.theme--genre,
.slick-carousel__dots button.theme--genres {
  border-color: #5bb8ef;
}
.theme--genre.nav__link:before,
.theme--genres.nav__link:before {
  font-family: 'Material Design Icons';
  content: '\F407';
  display: inline;
  margin-right: 5px;
  color: #5bb8ef;
}
.theme--genre.nav__link:hover,
.theme--genres.nav__link:hover,
.theme--genre.nav__link.active,
.theme--genres.nav__link.active {
  color: #5bb8ef;
}
.theme--genre.nav__link:after,
.theme--genres.nav__link:after {
  background-color: #5bb8ef;
}
.theme--genre.theme__option:before,
.theme--genres.theme__option:before {
  color: #5bb8ef;
}
.slick-carousel__dots .slick-active button.theme--environnement,
a.theme--environnement:hover .box--background,
a.theme--environnement:focus .box--background,
.theme--environnement .link--read-more:before,
.theme--environnement.label span {
  background: #84b614;
}
.detail__text .slick-carousel__dots .slick-active button.theme--environnement,
.detail__text a.theme--environnement:hover .box--background,
.detail__text a.theme--environnement:focus .box--background,
.detail__text .theme--environnement .link--read-more:before,
.detail__text .theme--environnement.label span {
  background: #c7cccc;
}
.theme--environnement .badge:after {
  background: rgba(132, 182, 20, 0.5);
}
.slick-carousel__dots button.theme--environnement {
  border-color: #84b614;
}
.theme--environnement.nav__link:before {
  font-family: 'Material Design Icons';
  content: '\F407';
  display: inline;
  margin-right: 5px;
  color: #84b614;
}
.theme--environnement.nav__link:hover,
.theme--environnement.nav__link.active {
  color: #84b614;
}
.theme--environnement.nav__link:after {
  background-color: #84b614;
}
.theme--environnement.theme__option:before {
  color: #84b614;
}
.slick-carousel__dots .slick-active button.theme--artiste,
.slick-carousel__dots .slick-active button.theme--artartiste,
.slick-carousel__dots .slick-active button.theme--artsartistes,
a.theme--artiste:hover .box--background,
a.theme--artartiste:hover .box--background,
a.theme--artsartistes:hover .box--background,
a.theme--artiste:focus .box--background,
a.theme--artartiste:focus .box--background,
a.theme--artsartistes:focus .box--background,
.theme--artiste .link--read-more:before,
.theme--artartiste .link--read-more:before,
.theme--artsartistes .link--read-more:before,
.theme--artiste.label span,
.theme--artartiste.label span,
.theme--artsartistes.label span {
  background: #8669a0;
}
.detail__text .slick-carousel__dots .slick-active button.theme--artiste,
.detail__text .slick-carousel__dots .slick-active button.theme--artartiste,
.detail__text .slick-carousel__dots .slick-active button.theme--artsartistes,
.detail__text a.theme--artiste:hover .box--background,
.detail__text a.theme--artartiste:hover .box--background,
.detail__text a.theme--artsartistes:hover .box--background,
.detail__text a.theme--artiste:focus .box--background,
.detail__text a.theme--artartiste:focus .box--background,
.detail__text a.theme--artsartistes:focus .box--background,
.detail__text .theme--artiste .link--read-more:before,
.detail__text .theme--artartiste .link--read-more:before,
.detail__text .theme--artsartistes .link--read-more:before,
.detail__text .theme--artiste.label span,
.detail__text .theme--artartiste.label span,
.detail__text .theme--artsartistes.label span {
  background: #c7cccc;
}
.theme--artiste .badge:after,
.theme--artartiste .badge:after,
.theme--artsartistes .badge:after {
  background: rgba(134, 105, 160, 0.5);
}
.slick-carousel__dots button.theme--artiste,
.slick-carousel__dots button.theme--artartiste,
.slick-carousel__dots button.theme--artsartistes {
  border-color: #8669a0;
}
.theme--artiste.nav__link:before,
.theme--artartiste.nav__link:before,
.theme--artsartistes.nav__link:before {
  font-family: 'Material Design Icons';
  content: '\F407';
  display: inline;
  margin-right: 5px;
  color: #8669a0;
}
.theme--artiste.nav__link:hover,
.theme--artartiste.nav__link:hover,
.theme--artsartistes.nav__link:hover,
.theme--artiste.nav__link.active,
.theme--artartiste.nav__link.active,
.theme--artsartistes.nav__link.active {
  color: #8669a0;
}
.theme--artiste.nav__link:after,
.theme--artartiste.nav__link:after,
.theme--artsartistes.nav__link:after {
  background-color: #8669a0;
}
.theme--artiste.theme__option:before,
.theme--artartiste.theme__option:before,
.theme--artsartistes.theme__option:before {
  color: #8669a0;
}
.slick-carousel__dots .slick-active button.theme--nord-sud,
.slick-carousel__dots .slick-active button.theme--nordsud,
a.theme--nord-sud:hover .box--background,
a.theme--nordsud:hover .box--background,
a.theme--nord-sud:focus .box--background,
a.theme--nordsud:focus .box--background,
.theme--nord-sud .link--read-more:before,
.theme--nordsud .link--read-more:before,
.theme--nord-sud.label span,
.theme--nordsud.label span {
  background: #f07723;
}
.detail__text .slick-carousel__dots .slick-active button.theme--nord-sud,
.detail__text .slick-carousel__dots .slick-active button.theme--nordsud,
.detail__text a.theme--nord-sud:hover .box--background,
.detail__text a.theme--nordsud:hover .box--background,
.detail__text a.theme--nord-sud:focus .box--background,
.detail__text a.theme--nordsud:focus .box--background,
.detail__text .theme--nord-sud .link--read-more:before,
.detail__text .theme--nordsud .link--read-more:before,
.detail__text .theme--nord-sud.label span,
.detail__text .theme--nordsud.label span {
  background: #c7cccc;
}
.theme--nord-sud .badge:after,
.theme--nordsud .badge:after {
  background: rgba(240, 119, 35, 0.5);
}
.slick-carousel__dots button.theme--nord-sud,
.slick-carousel__dots button.theme--nordsud {
  border-color: #f07723;
}
.theme--nord-sud.nav__link:before,
.theme--nordsud.nav__link:before {
  font-family: 'Material Design Icons';
  content: '\F407';
  display: inline;
  margin-right: 5px;
  color: #f07723;
}
.theme--nord-sud.nav__link:hover,
.theme--nordsud.nav__link:hover,
.theme--nord-sud.nav__link.active,
.theme--nordsud.nav__link.active {
  color: #f07723;
}
.theme--nord-sud.nav__link:after,
.theme--nordsud.nav__link:after {
  background-color: #f07723;
}
.theme--nord-sud.theme__option:before,
.theme--nordsud.theme__option:before {
  color: #f07723;
}
.slick-carousel__dots button.coll--documentaire,
.slick-carousel__dots button.coll--documentaires,
.coll--documentaire .read-more:before,
.coll--documentaires .read-more:before,
.coll--documentaire.label span,
.coll--documentaires.label span,
.coll--documentaire .link--read-more:before,
.coll--documentaires .link--read-more:before,
.coll--documentaire .tag,
.coll--documentaires .tag,
.coll--documentaire .btn,
.coll--documentaires .btn {
  background: #75902b;
}
a.coll--documentaire:hover .box--background,
a.coll--documentaires:hover .box--background,
a.coll--documentaire:focus .box--background,
a.coll--documentaires:focus .box--background {
  background: #75902b;
}
.detail__text a.coll--documentaire:hover .box--background,
.detail__text a.coll--documentaires:hover .box--background,
.detail__text a.coll--documentaire:focus .box--background,
.detail__text a.coll--documentaires:focus .box--background {
  background: #c7cccc;
}
.coll--documentaire .badge:after,
.coll--documentaires .badge:after {
  background: rgba(117, 144, 43, 0.5);
}
.slick-carousel__dots .slick-active button.coll--documentaire,
.slick-carousel__dots .slick-active button.coll--documentaires {
  border-color: #75902b;
}
.coll--documentaire.collection-form__option:before,
.coll--documentaires.collection-form__option:before {
  color: #75902b;
}
.slick-carousel__dots button.coll--cinema,
.slick-carousel__dots button.coll--cinema-de-fiction,
.slick-carousel__dots button.coll--cinema-fiction,
.coll--cinema .read-more:before,
.coll--cinema-de-fiction .read-more:before,
.coll--cinema-fiction .read-more:before,
.coll--cinema.label span,
.coll--cinema-de-fiction.label span,
.coll--cinema-fiction.label span,
.coll--cinema .link--read-more:before,
.coll--cinema-de-fiction .link--read-more:before,
.coll--cinema-fiction .link--read-more:before,
.coll--cinema .tag,
.coll--cinema-de-fiction .tag,
.coll--cinema-fiction .tag,
.coll--cinema .btn,
.coll--cinema-de-fiction .btn,
.coll--cinema-fiction .btn {
  background: #fd7b3f;
}
a.coll--cinema:hover .box--background,
a.coll--cinema-de-fiction:hover .box--background,
a.coll--cinema-fiction:hover .box--background,
a.coll--cinema:focus .box--background,
a.coll--cinema-de-fiction:focus .box--background,
a.coll--cinema-fiction:focus .box--background {
  background: #fd7b3f;
}
.detail__text a.coll--cinema:hover .box--background,
.detail__text a.coll--cinema-de-fiction:hover .box--background,
.detail__text a.coll--cinema-fiction:hover .box--background,
.detail__text a.coll--cinema:focus .box--background,
.detail__text a.coll--cinema-de-fiction:focus .box--background,
.detail__text a.coll--cinema-fiction:focus .box--background {
  background: #c7cccc;
}
.coll--cinema .badge:after,
.coll--cinema-de-fiction .badge:after,
.coll--cinema-fiction .badge:after {
  background: rgba(253, 123, 63, 0.5);
}
.slick-carousel__dots .slick-active button.coll--cinema,
.slick-carousel__dots .slick-active button.coll--cinema-de-fiction,
.slick-carousel__dots .slick-active button.coll--cinema-fiction {
  border-color: #fd7b3f;
}
.coll--cinema.collection-form__option:before,
.coll--cinema-de-fiction.collection-form__option:before,
.coll--cinema-fiction.collection-form__option:before {
  color: #fd7b3f;
}
.slick-carousel__dots button.coll--chanson,
.slick-carousel__dots button.coll--chanson-francaise,
.coll--chanson .read-more:before,
.coll--chanson-francaise .read-more:before,
.coll--chanson.label span,
.coll--chanson-francaise.label span,
.coll--chanson .link--read-more:before,
.coll--chanson-francaise .link--read-more:before,
.coll--chanson .tag,
.coll--chanson-francaise .tag,
.coll--chanson .btn,
.coll--chanson-francaise .btn {
  background: #28aae1;
}
a.coll--chanson:hover .box--background,
a.coll--chanson-francaise:hover .box--background,
a.coll--chanson:focus .box--background,
a.coll--chanson-francaise:focus .box--background {
  background: #28aae1;
}
.detail__text a.coll--chanson:hover .box--background,
.detail__text a.coll--chanson-francaise:hover .box--background,
.detail__text a.coll--chanson:focus .box--background,
.detail__text a.coll--chanson-francaise:focus .box--background {
  background: #c7cccc;
}
.coll--chanson .badge:after,
.coll--chanson-francaise .badge:after {
  background: rgba(40, 170, 225, 0.5);
}
.slick-carousel__dots .slick-active button.coll--chanson,
.slick-carousel__dots .slick-active button.coll--chanson-francaise {
  border-color: #28aae1;
}
.coll--chanson.collection-form__option:before,
.coll--chanson-francaise.collection-form__option:before {
  color: #28aae1;
}
.slick-carousel__dots button.coll--litterature,
.slick-carousel__dots button.coll--documents-sonoreslitterature,
.slick-carousel__dots button.coll--documents-sonores-litterature,
.coll--litterature .read-more:before,
.coll--documents-sonoreslitterature .read-more:before,
.coll--documents-sonores-litterature .read-more:before,
.coll--litterature.label span,
.coll--documents-sonoreslitterature.label span,
.coll--documents-sonores-litterature.label span,
.coll--litterature .link--read-more:before,
.coll--documents-sonoreslitterature .link--read-more:before,
.coll--documents-sonores-litterature .link--read-more:before,
.coll--litterature .tag,
.coll--documents-sonoreslitterature .tag,
.coll--documents-sonores-litterature .tag,
.coll--litterature .btn,
.coll--documents-sonoreslitterature .btn,
.coll--documents-sonores-litterature .btn {
  background: #204a67;
}
a.coll--litterature:hover .box--background,
a.coll--documents-sonoreslitterature:hover .box--background,
a.coll--documents-sonores-litterature:hover .box--background,
a.coll--litterature:focus .box--background,
a.coll--documents-sonoreslitterature:focus .box--background,
a.coll--documents-sonores-litterature:focus .box--background {
  background: #204a67;
}
.detail__text a.coll--litterature:hover .box--background,
.detail__text a.coll--documents-sonoreslitterature:hover .box--background,
.detail__text a.coll--documents-sonores-litterature:hover .box--background,
.detail__text a.coll--litterature:focus .box--background,
.detail__text a.coll--documents-sonoreslitterature:focus .box--background,
.detail__text a.coll--documents-sonores-litterature:focus .box--background {
  background: #c7cccc;
}
.coll--litterature .badge:after,
.coll--documents-sonoreslitterature .badge:after,
.coll--documents-sonores-litterature .badge:after {
  background: rgba(32, 74, 103, 0.5);
}
.slick-carousel__dots .slick-active button.coll--litterature,
.slick-carousel__dots .slick-active button.coll--documents-sonoreslitterature,
.slick-carousel__dots .slick-active button.coll--documents-sonores-litterature {
  border-color: #204a67;
}
.coll--litterature.collection-form__option:before,
.coll--documents-sonoreslitterature.collection-form__option:before,
.coll--documents-sonores-litterature.collection-form__option:before {
  color: #204a67;
}
.slick-carousel__dots button.coll--jazz,
.coll--jazz .read-more:before,
.coll--jazz.label span,
.coll--jazz .link--read-more:before,
.coll--jazz .tag,
.coll--jazz .btn {
  background: #b19335;
}
a.coll--jazz:hover .box--background,
a.coll--jazz:focus .box--background {
  background: #b19335;
}
.detail__text a.coll--jazz:hover .box--background,
.detail__text a.coll--jazz:focus .box--background {
  background: #c7cccc;
}
.coll--jazz .badge:after {
  background: rgba(177, 147, 53, 0.5);
}
.slick-carousel__dots .slick-active button.coll--jazz {
  border-color: #b19335;
}
.coll--jazz.collection-form__option:before {
  color: #b19335;
}
.slick-carousel__dots button.coll--jeune,
.slick-carousel__dots button.coll--jeune-public,
.coll--jeune .read-more:before,
.coll--jeune-public .read-more:before,
.coll--jeune.label span,
.coll--jeune-public.label span,
.coll--jeune .link--read-more:before,
.coll--jeune-public .link--read-more:before,
.coll--jeune .tag,
.coll--jeune-public .tag,
.coll--jeune .btn,
.coll--jeune-public .btn {
  background: #1cd8d4;
}
a.coll--jeune:hover .box--background,
a.coll--jeune-public:hover .box--background,
a.coll--jeune:focus .box--background,
a.coll--jeune-public:focus .box--background {
  background: #1cd8d4;
}
.detail__text a.coll--jeune:hover .box--background,
.detail__text a.coll--jeune-public:hover .box--background,
.detail__text a.coll--jeune:focus .box--background,
.detail__text a.coll--jeune-public:focus .box--background {
  background: #c7cccc;
}
.coll--jeune .badge:after,
.coll--jeune-public .badge:after {
  background: rgba(28, 216, 212, 0.5);
}
.slick-carousel__dots .slick-active button.coll--jeune,
.slick-carousel__dots .slick-active button.coll--jeune-public {
  border-color: #1cd8d4;
}
.coll--jeune.collection-form__option:before,
.coll--jeune-public.collection-form__option:before {
  color: #1cd8d4;
}
.slick-carousel__dots button.coll--jeux,
.slick-carousel__dots button.coll--jeuxarts-ludiques,
.slick-carousel__dots button.coll--jeux-arts-ludiques,
.coll--jeux .read-more:before,
.coll--jeuxarts-ludiques .read-more:before,
.coll--jeux-arts-ludiques .read-more:before,
.coll--jeux.label span,
.coll--jeuxarts-ludiques.label span,
.coll--jeux-arts-ludiques.label span,
.coll--jeux .link--read-more:before,
.coll--jeuxarts-ludiques .link--read-more:before,
.coll--jeux-arts-ludiques .link--read-more:before,
.coll--jeux .tag,
.coll--jeuxarts-ludiques .tag,
.coll--jeux-arts-ludiques .tag,
.coll--jeux .btn,
.coll--jeuxarts-ludiques .btn,
.coll--jeux-arts-ludiques .btn {
  background: #2626c8;
}
a.coll--jeux:hover .box--background,
a.coll--jeuxarts-ludiques:hover .box--background,
a.coll--jeux-arts-ludiques:hover .box--background,
a.coll--jeux:focus .box--background,
a.coll--jeuxarts-ludiques:focus .box--background,
a.coll--jeux-arts-ludiques:focus .box--background {
  background: #2626c8;
}
.detail__text a.coll--jeux:hover .box--background,
.detail__text a.coll--jeuxarts-ludiques:hover .box--background,
.detail__text a.coll--jeux-arts-ludiques:hover .box--background,
.detail__text a.coll--jeux:focus .box--background,
.detail__text a.coll--jeuxarts-ludiques:focus .box--background,
.detail__text a.coll--jeux-arts-ludiques:focus .box--background {
  background: #c7cccc;
}
.coll--jeux .badge:after,
.coll--jeuxarts-ludiques .badge:after,
.coll--jeux-arts-ludiques .badge:after {
  background: rgba(38, 38, 200, 0.5);
}
.slick-carousel__dots .slick-active button.coll--jeux,
.slick-carousel__dots .slick-active button.coll--jeuxarts-ludiques,
.slick-carousel__dots .slick-active button.coll--jeux-arts-ludiques {
  border-color: #2626c8;
}
.coll--jeux.collection-form__option:before,
.coll--jeuxarts-ludiques.collection-form__option:before,
.coll--jeux-arts-ludiques.collection-form__option:before {
  color: #2626c8;
}
.slick-carousel__dots button.coll--afro,
.slick-carousel__dots button.coll--musiques-afro-americaines,
.slick-carousel__dots button.coll--blues-hip-hop-soul-reggae,
.coll--afro .read-more:before,
.coll--musiques-afro-americaines .read-more:before,
.coll--blues-hip-hop-soul-reggae .read-more:before,
.coll--afro.label span,
.coll--musiques-afro-americaines.label span,
.coll--blues-hip-hop-soul-reggae.label span,
.coll--afro .link--read-more:before,
.coll--musiques-afro-americaines .link--read-more:before,
.coll--blues-hip-hop-soul-reggae .link--read-more:before,
.coll--afro .tag,
.coll--musiques-afro-americaines .tag,
.coll--blues-hip-hop-soul-reggae .tag,
.coll--afro .btn,
.coll--musiques-afro-americaines .btn,
.coll--blues-hip-hop-soul-reggae .btn {
  background: #c0375b;
}
a.coll--afro:hover .box--background,
a.coll--musiques-afro-americaines:hover .box--background,
a.coll--blues-hip-hop-soul-reggae:hover .box--background,
a.coll--afro:focus .box--background,
a.coll--musiques-afro-americaines:focus .box--background,
a.coll--blues-hip-hop-soul-reggae:focus .box--background {
  background: #c0375b;
}
.detail__text a.coll--afro:hover .box--background,
.detail__text a.coll--musiques-afro-americaines:hover .box--background,
.detail__text a.coll--blues-hip-hop-soul-reggae:hover .box--background,
.detail__text a.coll--afro:focus .box--background,
.detail__text a.coll--musiques-afro-americaines:focus .box--background,
.detail__text a.coll--blues-hip-hop-soul-reggae:focus .box--background {
  background: #c7cccc;
}
.coll--afro .badge:after,
.coll--musiques-afro-americaines .badge:after,
.coll--blues-hip-hop-soul-reggae .badge:after {
  background: rgba(192, 55, 91, 0.5);
}
.slick-carousel__dots .slick-active button.coll--afro,
.slick-carousel__dots .slick-active button.coll--musiques-afro-americaines,
.slick-carousel__dots .slick-active button.coll--blues-hip-hop-soul-reggae {
  border-color: #c0375b;
}
.coll--afro.collection-form__option:before,
.coll--musiques-afro-americaines.collection-form__option:before,
.coll--blues-hip-hop-soul-reggae.collection-form__option:before {
  color: #c0375b;
}
.slick-carousel__dots button.coll--monde,
.slick-carousel__dots button.coll--musiques-du-monde,
.slick-carousel__dots button.coll--musique-du-monde,
.coll--monde .read-more:before,
.coll--musiques-du-monde .read-more:before,
.coll--musique-du-monde .read-more:before,
.coll--monde.label span,
.coll--musiques-du-monde.label span,
.coll--musique-du-monde.label span,
.coll--monde .link--read-more:before,
.coll--musiques-du-monde .link--read-more:before,
.coll--musique-du-monde .link--read-more:before,
.coll--monde .tag,
.coll--musiques-du-monde .tag,
.coll--musique-du-monde .tag,
.coll--monde .btn,
.coll--musiques-du-monde .btn,
.coll--musique-du-monde .btn {
  background: #6f4b20;
}
a.coll--monde:hover .box--background,
a.coll--musiques-du-monde:hover .box--background,
a.coll--musique-du-monde:hover .box--background,
a.coll--monde:focus .box--background,
a.coll--musiques-du-monde:focus .box--background,
a.coll--musique-du-monde:focus .box--background {
  background: #6f4b20;
}
.detail__text a.coll--monde:hover .box--background,
.detail__text a.coll--musiques-du-monde:hover .box--background,
.detail__text a.coll--musique-du-monde:hover .box--background,
.detail__text a.coll--monde:focus .box--background,
.detail__text a.coll--musiques-du-monde:focus .box--background,
.detail__text a.coll--musique-du-monde:focus .box--background {
  background: #c7cccc;
}
.coll--monde .badge:after,
.coll--musiques-du-monde .badge:after,
.coll--musique-du-monde .badge:after {
  background: rgba(111, 75, 32, 0.5);
}
.slick-carousel__dots .slick-active button.coll--monde,
.slick-carousel__dots .slick-active button.coll--musiques-du-monde,
.slick-carousel__dots .slick-active button.coll--musique-du-monde {
  border-color: #6f4b20;
}
.coll--monde.collection-form__option:before,
.coll--musiques-du-monde.collection-form__option:before,
.coll--musique-du-monde.collection-form__option:before {
  color: #6f4b20;
}
.slick-carousel__dots button.coll--classique,
.slick-carousel__dots button.coll--musique-classique,
.coll--classique .read-more:before,
.coll--musique-classique .read-more:before,
.coll--classique.label span,
.coll--musique-classique.label span,
.coll--classique .link--read-more:before,
.coll--musique-classique .link--read-more:before,
.coll--classique .tag,
.coll--musique-classique .tag,
.coll--classique .btn,
.coll--musique-classique .btn {
  background: #b16633;
}
a.coll--classique:hover .box--background,
a.coll--musique-classique:hover .box--background,
a.coll--classique:focus .box--background,
a.coll--musique-classique:focus .box--background {
  background: #b16633;
}
.detail__text a.coll--classique:hover .box--background,
.detail__text a.coll--musique-classique:hover .box--background,
.detail__text a.coll--classique:focus .box--background,
.detail__text a.coll--musique-classique:focus .box--background {
  background: #c7cccc;
}
.coll--classique .badge:after,
.coll--musique-classique .badge:after {
  background: rgba(177, 102, 51, 0.5);
}
.slick-carousel__dots .slick-active button.coll--classique,
.slick-carousel__dots .slick-active button.coll--musique-classique {
  border-color: #b16633;
}
.coll--classique.collection-form__option:before,
.coll--musique-classique.collection-form__option:before {
  color: #b16633;
}
.slick-carousel__dots button.coll--rock,
.slick-carousel__dots button.coll--rockpop,
.slick-carousel__dots button.coll--rock-pop,
.slick-carousel__dots button.coll--rockpopelectro,
.slick-carousel__dots button.coll--rock-pop-electro,
.coll--rock .read-more:before,
.coll--rockpop .read-more:before,
.coll--rock-pop .read-more:before,
.coll--rockpopelectro .read-more:before,
.coll--rock-pop-electro .read-more:before,
.coll--rock.label span,
.coll--rockpop.label span,
.coll--rock-pop.label span,
.coll--rockpopelectro.label span,
.coll--rock-pop-electro.label span,
.coll--rock .link--read-more:before,
.coll--rockpop .link--read-more:before,
.coll--rock-pop .link--read-more:before,
.coll--rockpopelectro .link--read-more:before,
.coll--rock-pop-electro .link--read-more:before,
.coll--rock .tag,
.coll--rockpop .tag,
.coll--rock-pop .tag,
.coll--rockpopelectro .tag,
.coll--rock-pop-electro .tag,
.coll--rock .btn,
.coll--rockpop .btn,
.coll--rock-pop .btn,
.coll--rockpopelectro .btn,
.coll--rock-pop-electro .btn {
  background: #1d6750;
}
a.coll--rock:hover .box--background,
a.coll--rockpop:hover .box--background,
a.coll--rock-pop:hover .box--background,
a.coll--rockpopelectro:hover .box--background,
a.coll--rock-pop-electro:hover .box--background,
a.coll--rock:focus .box--background,
a.coll--rockpop:focus .box--background,
a.coll--rock-pop:focus .box--background,
a.coll--rockpopelectro:focus .box--background,
a.coll--rock-pop-electro:focus .box--background {
  background: #1d6750;
}
.detail__text a.coll--rock:hover .box--background,
.detail__text a.coll--rockpop:hover .box--background,
.detail__text a.coll--rock-pop:hover .box--background,
.detail__text a.coll--rockpopelectro:hover .box--background,
.detail__text a.coll--rock-pop-electro:hover .box--background,
.detail__text a.coll--rock:focus .box--background,
.detail__text a.coll--rockpop:focus .box--background,
.detail__text a.coll--rock-pop:focus .box--background,
.detail__text a.coll--rockpopelectro:focus .box--background,
.detail__text a.coll--rock-pop-electro:focus .box--background {
  background: #c7cccc;
}
.coll--rock .badge:after,
.coll--rockpop .badge:after,
.coll--rock-pop .badge:after,
.coll--rockpopelectro .badge:after,
.coll--rock-pop-electro .badge:after {
  background: rgba(29, 103, 80, 0.5);
}
.slick-carousel__dots .slick-active button.coll--rock,
.slick-carousel__dots .slick-active button.coll--rockpop,
.slick-carousel__dots .slick-active button.coll--rock-pop,
.slick-carousel__dots .slick-active button.coll--rockpopelectro,
.slick-carousel__dots .slick-active button.coll--rock-pop-electro {
  border-color: #1d6750;
}
.coll--rock.collection-form__option:before,
.coll--rockpop.collection-form__option:before,
.coll--rock-pop.collection-form__option:before,
.coll--rockpopelectro.collection-form__option:before,
.coll--rock-pop-electro.collection-form__option:before {
  color: #1d6750;
}
.slick-carousel__dots button.coll--musique-de-films,
.coll--musique-de-films .read-more:before,
.coll--musique-de-films.label span,
.coll--musique-de-films .link--read-more:before,
.coll--musique-de-films .tag,
.coll--musique-de-films .btn {
  background: #9e0491;
}
a.coll--musique-de-films:hover .box--background,
a.coll--musique-de-films:focus .box--background {
  background: #9e0491;
}
.detail__text a.coll--musique-de-films:hover .box--background,
.detail__text a.coll--musique-de-films:focus .box--background {
  background: #c7cccc;
}
.coll--musique-de-films .badge:after {
  background: rgba(158, 4, 145, 0.5);
}
.slick-carousel__dots .slick-active button.coll--musique-de-films {
  border-color: #9e0491;
}
.coll--musique-de-films.collection-form__option:before {
  color: #9e0491;
}
.slick-carousel__dots button.coll--other,
.slick-carousel__dots button.coll--autres,
.coll--other .read-more:before,
.coll--autres .read-more:before,
.coll--other.label span,
.coll--autres.label span,
.coll--other .link--read-more:before,
.coll--autres .link--read-more:before,
.coll--other .tag,
.coll--autres .tag,
.coll--other .btn,
.coll--autres .btn {
  background: #8da092;
}
a.coll--other:hover .box--background,
a.coll--autres:hover .box--background,
a.coll--other:focus .box--background,
a.coll--autres:focus .box--background {
  background: #8da092;
}
.detail__text a.coll--other:hover .box--background,
.detail__text a.coll--autres:hover .box--background,
.detail__text a.coll--other:focus .box--background,
.detail__text a.coll--autres:focus .box--background {
  background: #c7cccc;
}
.coll--other .badge:after,
.coll--autres .badge:after {
  background: rgba(141, 160, 146, 0.5);
}
.slick-carousel__dots .slick-active button.coll--other,
.slick-carousel__dots .slick-active button.coll--autres {
  border-color: #8da092;
}
.coll--other.collection-form__option:before,
.coll--autres.collection-form__option:before {
  color: #8da092;
}
@font-face {
  font-family: 'Material Design Icons';
  src: url('../fonts/materialdesignicons-webfont.eot');
  src: url('../fonts/materialdesignicons-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/materialdesignicons-webfont.woff2') format('woff2'), url('../fonts/materialdesignicons-webfont.woff') format('woff'), url('../fonts/materialdesignicons-webfont.ttf') format('truetype'), url('../fonts/materialdesignicons-webfont.svg#material_design_iconsregular') format('svg');
  font-weight: normal;
  font-style: normal;
}
h1,
h2,
h3,
.main-title,
.secondary-title,
.third-title {
  font-family: 'Droid Sans', serif;
  line-height: 1;
  margin-bottom: 15px;
}
h1 + .subtitle,
h2 + .subtitle,
h3 + .subtitle,
.main-title + .subtitle,
.secondary-title + .subtitle,
.third-title + .subtitle {
  font-family: 'Droid Sans', serif;
  margin-bottom: 30px;
  margin-top: -15px;
}
hr {
  width: 50%;
  margin: 45px auto;
  border-bottom: 1px solid #c7cccc;
  border-top: none;
}
.main-title,
.title--main {
  font-size: 35px;
  line-height: 1;
}
.main-title.main-title--section,
.title--main.main-title--section {
  position: relative;
  margin-bottom: 45px;
}
.main-title.main-title--section:after,
.title--main.main-title--section:after {
  -webkit-transition: all 0.1s ease-in-out;
  -moz-transition: all 0.1s ease-in-out;
  -ms-transition: all 0.1s ease-in-out;
  -o-transition: all 0.1s ease-in-out;
  background: #c7cccc;
  bottom: -15px;
  content: '';
  display: block;
  height: 3px;
  position: absolute;
  width: 220px;
}
.secondary-title,
.title--secondary,
.stream-field h2,
.rich-text h2 {
  font-size: 30px;
  line-height: 1.3;
}
.third-title,
.title--third,
.stream-field h3,
.rich-text h3 {
  font-size: 22px;
  line-height: 1.3;
}
.title--section {
  font-size: 21px;
  font-family: 'Droid Sans', serif;
  display: block;
  line-height: 1.3;
  margin-bottom: 15px;
}
.detail__actions + .title--section {
  margin-top: 30px;
}
p {
  margin-bottom: 15px;
}
p:last-child {
  margin-bottom: 0;
}
strong,
b {
  font-weight: bold;
}
em,
i {
  font-style: italic;
}
form {
  font-family: 'Droid Sans', serif;
}
ol {
  list-style-type: decimal;
  list-style-position: inside;
  margin-bottom: 15px;
}
.styled-list,
.stream-field ul,
.rich-text ul {
  margin-bottom: 15px;
}
.styled-list li,
.stream-field ul li,
.rich-text ul li {
  position: relative;
  padding-left: 20px;
}
.styled-list li:before,
.stream-field ul li:before,
.rich-text ul li:before {
  content: '>';
  position: absolute;
  left: 0;
}
.styled-list:last-child,
.stream-field ul:last-child,
.rich-text ul:last-child {
  margin-bottom: 0;
}
.detail__content a {
  color: #ffbe26;
}
.detail__content a:hover {
  text-decoration: underline;
  color: #f2aa00;
}
.braine .detail__content a {
  color: #6cb31a;
}
.braine .detail__content a:hover {
  text-decoration: underline;
  color: #5e9c17;
}
.comines .detail__content a {
  color: #f39b15;
}
.comines .detail__content a:hover {
  text-decoration: underline;
  color: #cb7e0a;
}
.le-phare .detail__content a {
  color: #15365d;
}
.le-phare .detail__content a:hover {
  text-decoration: underline;
  color: #1F4E86;
}
.whalll .detail__content a {
  color: #00a6a2;
}
.whalll .detail__content a:hover {
  text-decoration: underline;
  color: #007370;
}
.schaerbeek .detail__content a {
  color: #cfc857;
}
.schaerbeek .detail__content a:hover {
  text-decoration: underline;
  color: #BDB536;
}
.le-manege .detail__content a {
  color: #AC057B;
}
.le-manege .detail__content a:hover {
  text-decoration: underline;
  color: #930469;
}
.la-louviere .detail__content a {
  color: #806B81;
}
.la-louviere .detail__content a:hover {
  text-decoration: underline;
  color: #725f73;
}
@media (min-width: 680px) {
  .thumbnail--shifted--top .title--section {
    margin-bottom: -10px;
  }
}
body {
  font-family: 'Droid Serif', serif;
  font-size: 100%;
  line-height: 1.6;
  background: #c7cccc;
}
a {
  color: inherit;
}
img {
  max-width: 100%;
}
main {
  display: block;
}
.main-container {
  padding: 0;
}
@media (min-width: 960px) {
  .main-container {
    padding-right: 30px;
    padding-left: 30px;
  }
}
/*
CSS relatifs à des scripts (tels quels)
*/
.r-tabs .r-tabs-nav {
  margin: 0;
  padding: 0;
}
.r-tabs .r-tabs-tab {
  display: inline-block;
  margin: 0;
  list-style: none;
  background: #d2d6d6;
  padding: 5px 15px;
  font-family: 'Droid Sans', serif;
}
.r-tabs .r-tabs-tab a {
  color: #4c4c4c;
  text-decoration: none;
}
.r-tabs .r-tabs-accordion-title {
  display: none;
  background: #d2d6d6;
  padding: 5px 15px;
  font-family: 'Droid Sans', serif;
}
.r-tabs .r-tabs-accordion-title a {
  color: #4c4c4c;
  text-decoration: none;
}
.r-tabs .r-tabs-state-active {
  background: #c7cccc;
}
.r-tabs .r-tabs-state-active a {
  color: black;
}
.r-tabs .r-tabs-state-classic {
  background: #efe0d6;
}
.r-tabs .r-tabs-state-classic a {
  color: black;
}
.r-tabs .r-tabs-state-game {
  background: #d4d4f4;
}
.r-tabs .r-tabs-state-game a {
  color: black;
}
.r-tabs .r-tabs-panel {
  display: none;
}
.r-tabs .r-tabs-panel.r-tabs-state-active {
  display: block;
}
/* Accordion responsive breakpoint */
@media only screen and (max-width: 768px) {
  .r-tabs .r-tabs-nav {
    display: none;
  }
  .r-tabs .r-tabs-accordion-title {
    display: block;
  }
}
/*
Les "components" sont un type de module spécifique qui représentent un élément de section important
a priori utilisé une seule fois sur la page : main, header, footer, nav, article, section
Spécifiques aux médiathèques (override)
*/
/* Main content */
.main-content {
  overflow: hidden;
  display: block;
  background: white;
  padding-top: 45px;
  padding-bottom: 45px;
}
/* Sections */
.section {
  padding-top: 60px;
  padding-bottom: 60px;
}
.section--small {
  padding-top: 0;
  padding-bottom: 0;
  margin-bottom: 30px;
}
/* Responsive Navigation */
.site__container,
.site__pusher {
  height: 100%;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.site__container {
  overflow: hidden;
}
.site__pusher {
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -webkit-transform: translateX(0px);
  -moz-transform: translateX(0px);
  -ms-transform: translateX(0px);
  -o-transform: translateX(0px);
}
.responsive-nav--primary--open .site__pusher,
.responsive-nav--account--open .site__pusher {
  -webkit-transform: translateX(-280px);
  -moz-transform: translateX(-280px);
  -ms-transform: translateX(-280px);
  -o-transform: translateX(-280px);
}
.responsive-nav--primary--open .site__cache,
.responsive-nav--account--open .site__cache {
  bottom: 0;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
}
.site__content {
  -webkit-overflow-scrolling: touch;
  bottom: 0;
  left: 0;
  overflow-y: scroll;
  padding-top: 0;
  position: absolute;
  right: 0;
  top: 55px;
}
/* Responsive : mobile first */
@media (min-width: 768px) {
}
@media (min-width: 960px) {
  .site__container,
  .site__pusher {
    position: static;
    -webkit-transform: translateX(0) !important;
    -moz-transform: translateX(0) !important;
    -ms-transform: translateX(0) !important;
    -o-transform: translateX(0) !important;
  }
  .site__content {
    overflow-y: auto;
    position: static;
  }
  .site__container {
    overflow: auto;
  }
}
/* Responsive nav*/
.js-trigger-nav {
  display: block;
  height: 55px;
  overflow: hidden;
  position: absolute;
  right: 0;
  text-decoration: none;
  text-indent: 100%;
  top: 0;
  white-space: nowrap;
  width: 55px;
  z-index: 2000;
}
.js-trigger-nav:after {
  color: #c7cccc;
  content: '\F44E';
  display: block;
  font-family: 'Material Design Icons';
  font-size: 35px;
  line-height: 0;
  position: relative;
  text-align: center;
  text-indent: 0;
  top: 3px;
}
.js-trigger-nav--account {
  right: 55px;
}
.js-trigger-nav--account:after {
  content: '\F103';
}
.responsive-nav--account--open .js-trigger-nav--account {
  background: #252525;
}
.responsive-nav--primary--open .js-trigger-nav--primary {
  background: #252525;
}
.responsive-nav {
  -webkit-overflow-scrolling: touch;
  -webkit-transform: translateX(280px);
  -moz-transform: translateX(280px);
  -ms-transform: translateX(280px);
  -o-transform: translateX(280px);
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  background: #252525;
  bottom: 0;
  overflow-y: scroll;
  position: absolute;
  right: 0;
  padding-top: 60px;
  top: 0;
  border-top: 55px solid #323232;
  width: 280px;
  z-index: 1000;
}
.responsive-nav__link {
  display: block;
  font-size: 24px;
  padding: 10px 20px 10px 20px;
  border-bottom: 1px solid #4c4c4c;
  text-transform: uppercase;
  text-decoration: none;
}
.responsive-nav__link--connect {
  border-bottom: 0;
}
.responsive-nav--account {
  -webkit-transform: translateX(280px);
  -moz-transform: translateX(280px);
  -ms-transform: translateX(280px);
  -o-transform: translateX(280px);
  bottom: 0;
  color: white;
  font-family: 'Droid Sans', sans-serif;
  overflow-y: scroll;
  padding-top: 20px;
  position: absolute;
  right: 0;
  top: 0;
  width: 280px;
}
.responsive-nav--account span {
  padding: 0 20px;
}
.responsive-nav--account--open .responsive-nav--account {
  z-index: 2000;
  display: block;
}
.responsive-nav--primary--open .responsive-nav--primary {
  z-index: 2000;
  display: block;
}
/* Main Nav */
.main-nav {
  background: none;
  padding: 0;
  font-family: 'Droid Sans', sans-serif;
}
.main-nav__list {
  padding: 0;
}
.main-nav__item,
.secondary-nav__item {
  position: relative;
}
.main-nav__link {
  border-bottom: 1px solid #4c4c4c;
  color: white;
  display: block;
  font-size: 1em;
  letter-spacing: 1px;
  padding: 20px;
  position: relative;
  text-decoration: none;
  text-transform: uppercase;
}
.main-nav__link.active {
  font-weight: bold;
}
.main-nav__link--lower {
  border-bottom: none;
  letter-spacing: 0;
  padding-right: 10px;
  padding-top: 10px;
  text-transform: none;
}
.main-nav__link__subhead {
  color: #7ab439;
  text-transform: none;
  position: absolute;
  top: 7px;
  font-size: 12px;
  letter-spacing: 0px;
}
.main-nav__subnav {
  position: static;
  min-width: 0;
}
.main-nav__subnav__list {
  position: relative;
  font-size: 18px;
  padding: 0 20px 10px 20px;
}
.main-nav__subnav__link {
  color: white;
  padding: 10px 0;
  text-decoration: none;
  display: block;
}
/* Responsive : mobile first  */
@media (min-width: 520px) {
  /* Simple nav */
  .nav__item {
    float: left;
  }
}
@media (min-width: 960px) {
  .js-trigger-nav {
    display: none;
  }
  .responsive-nav {
    -webkit-transform: none;
    -moz-transform: none;
    -ms-transform: none;
    -o-transform: none;
    -webkit-transition: none;
    -moz-transition: none;
    -ms-transition: none;
    -o-transition: none;
    background: none;
    overflow-y: initial;
    position: static;
    padding-top: 0;
    border-top: none;
    width: auto;
    display: block;
    padding-left: 30px;
  }
  .main-nav {
    padding-top: 30px;
  }
  .main-nav__item {
    float: left;
    padding-bottom: 20px;
  }
  .main-nav__item--right {
    float: right;
  }
  .main-nav__link {
    color: black;
    padding: 0 30px 0 0;
    border: none;
  }
  .main-nav__item:last-child .main-nav__link {
    padding-right: 0;
  }
  .verviers .main-nav__link {
    color: #1f3241;
  }
  .braine .main-nav__link {
    color: #BEB5B5;
  }
  .comines .main-nav__link {
    color: #029896;
  }
  .le-phare .main-nav__link {
    color: #1F4E86;
  }
  .whalll .main-nav__link {
    color: #5B5351;
  }
  .schaerbeek .main-nav__link {
    color: #673F6D;
  }
  .le-manege .main-nav__link {
    color: #BEB5B5;
  }
  .la-louviere .main-nav__link {
    color: #92AD35;
  }
  .main-nav__link__subhead {
    top: -16px;
  }
  .main-nav__subnav {
    position: absolute;
    top: 40px;
    min-width: 220px;
    display: none;
  }
  .main-nav__item:hover .main-nav__subnav {
    display: block;
  }
  .main-nav__subnav__list {
    background: #e3e6e6;
    font-size: 15px;
    padding: 15px;
  }
  .main-nav__subnav__list:before {
    content: '';
    height: 0;
    display: block;
    width: 0;
    border-left: 15px solid transparent;
    border-right: 15px solid transparent;
    border-bottom: 15px solid #e3e6e6;
    position: absolute;
    top: -15px;
    left: 50%;
    margin-left: -15px;
  }
  .main-nav__subnav__link {
    padding: 0;
    color: #323232 !important;
    font-size: 90%;
  }
  .main-nav__subnav__link:hover {
    color: black !important;
  }
  .main-nav__subnav__link--other {
    border-top: 1px solid #4c4c4c;
    padding-top: 5px;
    margin-top: 5px;
  }
  .js-trigger-nav {
    display: none;
  }
}
/* Site header */
.site__header {
  position: static;
  z-index: 50;
}
/* Logo */
.site__title {
  margin: 0;
  background: #323232;
  padding-left: 30px;
  min-height: 55px;
}
.verviers .site__title {
  background: #1f3241;
}
.braine .site__title {
  background: #BEB5B5;
}
.comines .site__title {
  background: #029896;
}
.le-phare .site__title {
  background: #1F4E86;
}
.whalll .site__title {
  background: #5B5351;
}
.schaerbeek .site__title {
  background: #673F6D;
}
.le-manege .site__title {
  background: #BEB5B5;
}
.la-louviere .site__title {
  background: #92AD35;
}
.logo-container {
  display: block;
  width: auto;
}
.site__logo {
  display: block;
  float: left;
  max-width: 100px;
  height: 100px;
  position: absolute;
  z-index: 200;
  padding: 5px;
}
.site__logo img {
  max-height: 100%;
}
.site__name {
  float: left;
  width: auto;
  color: #FFF !important;
  display: block;
  font-family: 'Droid Sans', sans-serif;
  font-size: 1em;
  font-weight: bold;
  line-height: 1;
  margin: 20px 0;
  position: relative;
  text-decoration: none;
  margin-left: 110px;
  z-index: 200;
  text-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
}
.site__name:hover {
  text-decoration: none;
}
/* Top header */
.site__header__top {
  position: static;
}
.site__header__top .container {
  padding: 0;
}
/* Responsive : mobile first  */
@media (min-width: 960px) {
  .site__header {
    position: relative;
    background: white;
  }
  .site__header__top {
    position: absolute;
    top: 0;
    width: 100%;
  }
  .site__name {
    font-size: 2.2em;
    width: 60%;
    margin: 90px 0 30px 0;
  }
  .site__logo {
    padding-right: 30px;
    width: 100%;
    box-sizing: border-box;
    max-width: 100%;
  }
  .site__logo img {
    max-height: 200px;
  }
  .comines .site__logo img {
    background: white;
    padding: 10px 0px 10px 10px;
  }
  .logo-container {
    position: relative;
    margin: 90px 0 30px 0;
    height: 60px;
    width: 20%;
  }
  .whalll .logo-container {
    height: 100px;
  }
  .comines .logo-container,
  .le-phare .logo-container,
  .la-louviere .logo-container,
  .schaerbeek .logo-container,
  .verviers .logo-container {
    margin-top: 30px;
  }
}
.site__footer {
  background: #323232;
  font-family: 'Droid Sans', sans-serif;
}
.verviers .site__footer {
  background: #1f3241;
}
.braine .site__footer {
  background: #BEB5B5;
}
.comines .site__footer {
  background: #029896;
}
.le-phare .site__footer {
  background: #1F4E86;
}
.whalll .site__footer {
  background: #5B5351;
}
.schaerbeek .site__footer {
  background: #673F6D;
}
.le-manege .site__footer {
  background: #BEB5B5;
}
.la-louviere .site__footer {
  background: #92AD35;
}
.site__footer__menus {
  padding: 30px 0 30px 30px;
  color: white;
}
.site__footer__menus a {
  color: white !important;
  text-decoration: none;
}
.site__footer__menus a:hover {
  text-decoration: underline;
}
.site__footer__copy {
  background: rgba(0, 0, 0, 0.2);
}
.site__footer__copy a,
.site__footer__copy span {
  display: block;
  float: left;
  margin: 15px 15px;
}
.site__footer__copy .copy {
  float: left;
  font-size: 13px;
  color: white;
  margin: 19px 0;
  border-left: 1px solid white;
  padding-left: 12px;
  text-decoration: none;
}
.site__footer__list .email {
  font-size: 13px;
}
.site__footer__legal {
  background: #474747;
  font-size: 14px;
}
.site__footer__title {
  text-transform: uppercase;
  margin-top: 30px;
  margin-bottom: 15px;
}
.site__footer__left {
  float: left;
  clear: left;
  color: #c7cccc;
}
.site__footer__left a {
  text-decoration: none;
  padding: 15px 0;
  display: block;
}
.site__footer__left a:hover {
  text-decoration: underline;
}
.site__footer__left li {
  float: left;
  margin-right: 15px;
}
.site__footer__right {
  float: right;
}
.copyright {
  color: #c7cccc;
  padding: 15px 0;
  display: block;
  float: right;
  margin-left: 30px;
}
.detail {
  padding-top: 30px;
  padding-bottom: 30px;
}
.detail__cover img {
  width: 100%;
  height: auto;
}
/* Header and titles */
.detail__title {
  margin-bottom: 30px;
}
.detail__secondary-title {
  font-size: 21px;
  margin-bottom: 15px;
}
.detail__leader,
.detail__subtitle {
  font-size: 27px;
  margin: 12px 0;
  display: block;
  line-height: 1.2;
}
.detail__parent {
  font-size: 27px;
  text-decoration: none;
}
.detail__parent:hover {
  text-decoration: underline;
}
.detail__metas {
  margin-top: 15px;
}
/* Content */
.detail__headline {
  font-family: 'Droid Sans', sans-serif;
  font-weight: bold;
  margin-bottom: 30px;
}
.detail__content {
  margin-bottom: 30px;
}
.detail--video .detail__content,
.detail--interactive .detail__content {
  margin-top: 30px;
}
.detail__content__inner {
  background: #d2d6d6;
  padding: 15px;
}
.detail--media .detail__content__inner {
  padding: 30px 0 30px 30px;
  margin-bottom: 30px;
}
.detail__video {
  background: #c7cccc;
  margin-left: -30000px;
  margin-right: -29970px;
  padding: 0 30000px 0;
}
.detail__video iframe {
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  padding-bottom: 56.25%;
}
.detail__video__inner {
  position: relative;
  width: 100%;
  padding: 0;
}
.detail__iframe {
  background: #c7cccc;
  margin-left: -30000px;
  margin-right: -29970px;
  padding: 0 30000px 0;
}
.detail__iframe iframe {
  width: 100%;
}
.detail__text {
  position: relative;
}
.detail__text table {
  margin-bottom: 15px;
  font-family: 'Droid Sans', serif;
}
.detail__text table th {
  font-weight: bold;
  text-align: left;
}
.infos-pratiques .detail__text {
  margin-top: 30px;
}
.richtext-image {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  display: block;
  margin: 21px 0;
  height: auto;
  max-width: 100%;
}
.richtext-image.right {
  float: right;
  margin: 10px 0;
  padding-left: 30px;
  width: 52%;
}
.richtext-image.left {
  width: 69.5%;
  margin: 10px 0 10px -35%;
  float: left;
  padding-right: 30px;
}
.detail__tabs a {
  text-decoration: none;
}
.detail__tabs a:hover {
  text-decoration: underline;
}
.detail__tags {
  margin-top: 21px;
}
.detail__list {
  position: relative;
  font-family: 'Droid Sans', serif;
  margin-top: 30px;
}
/* Image inside detail*/
.detail__image {
  max-width: 100%;
  margin: 21px 0;
  display: block;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.detail__image--small-left {
  width: 52%;
  float: left;
  margin: 10px 0;
  padding-right: 30px;
}
.detail__image--small-right {
  width: 52%;
  margin: 10px 0;
  float: right;
  padding-left: 30px;
}
/* Links at the end*/
.detail__links {
  padding-top: 60px;
  padding-bottom: 60px;
  font-family: 'Droid Sans', serif;
}
.detail__links--chapters .detail__links__inner {
  padding: 15px;
  margin-top: 30px;
  position: relative;
  border: 1px solid #c7cccc;
}
/* Responsive */
@media (min-width: 768px) {
  .detail {
    padding-top: 60px;
    padding-bottom: 60px;
  }
  .detail__image--offset-left {
    width: 69.5%;
    margin: 10px 0 10px -35%;
    float: left;
    padding-right: 30px;
  }
  .detail__image--offset-right {
    width: 69.5%;
    margin: 10px -35% 10px 0;
    float: right;
    padding-left: 30px;
  }
}
@media (min-width: 960px) {
  .detail--focus .detail__content,
  .detail--publication .detail__content,
  .detail--portrait .detail__content,
  .detail--gallery .detail__content,
  .detail--interactive .detail__content,
  .detail--podcast .detail__content,
  .detail--video .detail__content,
  .detail--playlist .detail__content,
  .detail--event .detail__content,
  .detail--critique .detail__content {
    float: left;
    margin-left: 20%;
    margin-top: 30px;
    padding-top: 38.5%;
    position: relative;
  }
  .detail--critique .detail__content {
    margin-left: 0;
  }
  .detail--critique.detail--nocover .detail__content {
    padding-top: 0;
    margin-top: 30px;
    margin-left: 0;
  }
  .detail--nocover .detail__content {
    padding-top: 0;
    margin-top: 30px;
  }
  .detail__media-cover {
    margin-top: 30px;
    padding-top: 38.5%;
  }
  .detail--nocover .detail__media-cover {
    padding-top: 0;
    margin-top: 30px;
  }
  .detail--focus .detail__cover,
  .detail--portrait .detail__cover,
  .detail--publication .detail__cover,
  .detail--podcast .detail__cover,
  .detail--gallery .detail__cover,
  .detail--playlist .detail__cover,
  .detail--event .detail__cover,
  .detail--critique .detail__cover {
    margin-bottom: 0;
    height: 0;
  }
  .detail--media .detail__cover {
    height: auto;
  }
}
.page {
  padding-top: 60px;
  padding-bottom: 60px;
}
.homepage {
  padding-top: 30px;
  padding-bottom: 30px;
}
.page__headline {
  margin-bottom: 30px;
  font-family: 'Droid Sans', sans-serif;
}
.page__text {
  position: relative;
  margin-bottom: 30px;
}
.page__headline + .page__text:before {
  -webkit-transition: all 0.1s ease-in-out;
  -moz-transition: all 0.1s ease-in-out;
  -ms-transition: all 0.1s ease-in-out;
  -o-transition: all 0.1s ease-in-out;
  background: #9fa8a8;
  top: -21px;
  content: '';
  display: block;
  height: 2px;
  position: absolute;
  width: 33.33333333%;
}
.messages {
  margin: 30px;
}
/*
Les "éléments" sont des sélecteurs ou des balises qui peuvent être utilisées n'importe ou et qui restent simples - boutons, liens, badges, icones.
Ils peuvent être utilisés à l'intérieur de modules, groupés, etc.
*/
.link {
  background: none;
  border: none;
  display: block;
  font-family: 'Droid Sans', serif;
  font-weight: bold;
  margin-top: 12px;
  position: relative;
  text-decoration: none;
}
.link:after,
.link:before {
  font-family: 'Material Design Icons';
  margin-left: 5px;
  position: relative;
  top: 1px;
  line-height: 1;
}
.link:first-child {
  margin-top: 0;
}
.link--app {
  font-style: italic;
  font-weight: normal;
  position: relative;
  padding-left: 70px;
  line-height: 60px;
  height: 60px;
}
.link--app + .link--app {
  margin-top: 12px;
}
.link--app__image {
  position: absolute;
  left: 0;
}
.link--app__name {
  display: inline-block;
  vertical-align: middle;
  line-height: normal;
}
.link--small {
  font-size: 14px;
  margin: 10px 0 0 0;
  color: #4c4c4c;
}
.link--read-more:before {
  -webkit-transition: all 0.1s ease-in-out;
  -moz-transition: all 0.1s ease-in-out;
  -ms-transition: all 0.1s ease-in-out;
  -o-transition: all 0.1s ease-in-out;
  background: black;
  content: '';
  display: block;
  height: 3px;
  margin-left: 0;
  position: absolute;
  top: -6px;
  width: 60px;
}
.verviers .link--read-more:before {
  background: #1f3241;
}
.braine .link--read-more:before {
  background: #BEB5B5;
}
.comines .link--read-more:before {
  background: #029896;
}
.le-phare .link--read-more:before {
  background: #1F4E86;
}
.whalll .link--read-more:before {
  background: #5B5351;
}
.schaerbeek .link--read-more:before {
  background: #673F6D;
}
.le-manege .link--read-more:before {
  background: #BEB5B5;
}
.la-louviere .link--read-more:before {
  background: #92AD35;
}
.link--read-more:hover:before,
a:hover .link--read-more:before {
  width: 90px;
  background: white;
}
.verviers .link--read-more:hover:before,
.verviers a:hover .link--read-more:before {
  background: #f2aa00;
}
.braine .link--read-more:hover:before,
.braine a:hover .link--read-more:before {
  background: #6cb31a;
}
.comines .link--read-more:hover:before,
.comines a:hover .link--read-more:before {
  background: #cb7e0a;
}
.le-phare .link--read-more:hover:before,
.le-phare a:hover .link--read-more:before {
  background: #fabe00;
}
.whalll .link--read-more:hover:before,
.whalll a:hover .link--read-more:before {
  background: #007370;
}
.schaerbeek .link--read-more:hover:before,
.schaerbeek a:hover .link--read-more:before {
  background: #BDB536;
}
.le-manege .link--read-more:hover:before,
.le-manege a:hover .link--read-more:before {
  background: #AC057B;
}
.la-louviere .link--read-more:hover:before,
.la-louviere a:hover .link--read-more:before {
  background: #806B81;
}
.city .link--read-more {
  text-align: center;
  font-family: 'Town80Text-Medium';
  font-weight: normal;
  font-size: 21px;
  margin-top: 30px;
}
.city .link--read-more:before {
  left: 0;
  right: 0;
  margin: auto;
  top: -15px;
}
.link--show {
  display: inline;
}
.link--contrast,
.link--connected {
  color: #7ab439;
}
.link--review:after {
  content: '\F27F';
}
.link--alone {
  margin-top: 0;
}
.link--more:after {
  content: '\F152';
}
.index-list__item .link--more {
  margin-left: 5px;
  display: inline;
  font-weight: bold;
  text-decoration: none;
}
.index-list__item .link--more:after {
  display: none;
}
.index-list__item .link--more:hover {
  text-decoration: underline;
}
.city .link--more {
  margin-left: 0;
  font-family: 'Town80Text-Medium';
  font-weight: normal;
  font-size: 21px;
  margin-top: 30px;
  display: block;
}
.city .link--more:before {
  left: 0;
  right: 0;
  top: -15px;
  -webkit-transition: all 0.1s ease-in-out;
  -moz-transition: all 0.1s ease-in-out;
  -ms-transition: all 0.1s ease-in-out;
  -o-transition: all 0.1s ease-in-out;
  background: #F0DE00;
  content: '';
  display: block;
  height: 3px;
  margin-left: 0;
  position: absolute;
  width: 60px;
}
.city .link--more:hover {
  text-decoration: none;
}
.city .link--more:hover:before {
  width: 90px;
}
.index-list__item:hover .link--more:before {
  width: 90px;
}
.link--map:after {
  content: '\F441';
}
.link--has-dropdown {
  font-weight: normal;
  display: inline;
  margin-top: 0;
}
.link--has-dropdown:after {
  content: '\F236';
}
.main-nav .link--has-dropdown {
  display: block;
}
.link--send {
  display: inline;
}
.link--send:after {
  content: '\F62B';
}
.availability__item--info .link--send {
  color: #00AEDA;
  font-weight: normal;
}
.link--action {
  font-weight: normal;
  position: relative;
  padding-left: 20px;
}
.link--action:before {
  position: absolute;
  left: 0;
  margin-left: 0;
  color: #7ab439;
}
.link--calendar:before {
  content: '\F1E3';
  color: #7ab439;
}
.link--add-wishlist {
  margin-top: 0;
}
.link--add-wishlist:before {
  content: '\F1BB';
  bottom: 0;
  top: auto;
}
.link--remove-wishlist {
  margin-top: 0;
  font-size: 14px;
}
.link--remove-wishlist:before {
  content: '\F1BC';
}
.table {
  width: 100%;
}
.table th {
  text-align: left;
  font-weight: bold;
}
.table td {
  padding: 5px 15px 2px 0;
}
.styled-table {
  width: 100%;
  margin-bottom: 30px;
}
.styled-table__td {
  background: #d7e9c4;
  border-right: 2px solid white;
  border-bottom: 2px solid white;
  padding: 2px 5px;
}
.comines .styled-table__td {
  background: #efd8b6;
}
.le-phare .styled-table__td {
  background: #feecb3;
}
.comines .styled-table__td {
  background: #efd8b6;
}
.verviers .styled-table__td {
  background: #fbe6b3;
}
.braine .styled-table__td {
  background: #d3e8ba;
}
.whalll .styled-table__td {
  background: #b3d5d4;
}
.styled-table__th {
  background: #afd288;
  font-weight: bold;
  font-family: 'Droid Sans', sans-serif;
}
.filter {
  text-decoration: none;
  font-family: 'Droid Sans', sans-serif;
  color: #323232 !important;
}
.filter:hover {
  text-decoration: none !important;
}
.filter--inline {
  float: left;
  margin-bottom: 15px;
  margin-right: 15px;
}
.filter_count {
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  background: #cae1b0;
  display: inline-block;
  font-size: 14px;
  height: 20px;
  line-height: 20px;
  text-align: center;
  min-width: 20px;
  margin-left: 5px;
}
.comines .filter_count {
  background: #efd8b6;
}
.le-phare .filter_count {
  background: #feecb3;
}
.comines .filter_count {
  background: #efd8b6;
}
.verviers .filter_count {
  background: #fbe6b3;
}
.braine .filter_count {
  background: #d3e8ba;
}
.whalll .filter_count {
  background: #b3d5d4;
}
.filter--box {
  font-family: 'Droid Sans', sans-serif;
  border: 1px solid #e3e6e6;
  display: inline-block;
  margin: 0 10px;
  padding: 3px 7px 5px 7px;
  line-height: 1.2;
}
.filter--box:after {
  content: '\F69A';
  color: #9fa8a8;
  font-family: 'Material Design Icons';
  line-height: 1;
  margin-left: 5px;
  position: relative;
}
.btn,
button {
  border: none;
  background: #4c4c4c;
  text-align: center;
  font-family: 'Droid Sans', serif;
  padding: 5px 30px 7px 10px;
  font-size: 15px;
  color: white;
  text-decoration: none;
  line-height: 18px;
  display: inline-block;
}
.btn:hover,
button:hover {
  cursor: pointer;
}
.search-form--classical .btn,
.search-form--classical button {
  background: #b16633;
}
.btn--border {
  background: none;
  border: 1px solid #4c4c4c;
  color: #4c4c4c;
}
.btn > input {
  background: none;
  border: none;
  margin: 0;
  padding: 0;
  text-align: center;
  font-family: 'Droid Sans', serif;
  font-size: 15px;
  color: white;
  display: block;
  max-width: 100%;
  white-space: normal;
}
.btn > input:hover {
  cursor: pointer;
}
.btn--stuck {
  height: 30px;
}
.btn--large {
  font-size: 21px;
  line-height: 1.2;
  padding: 15px;
  text-align: left;
}
.btn--large:after {
  bottom: 0;
  content: '\F152';
  font-family: 'Material Design Icons';
  font-size: 16px;
  line-height: 30px;
  margin-left: 5px;
  width: 30px;
  text-align: center;
  -webkit-transition: all 0.2s linear;
  -moz-transition: all 0.2s linear;
  -ms-transition: all 0.2s linear;
  -o-transition: all 0.2s linear;
}
.btn--center {
  display: block;
  margin-left: auto;
  margin-right: auto;
}
.btn--icon {
  position: relative;
  padding-right: 40px;
  overflow: hidden;
}
.btn--icon:after {
  bottom: 0;
  content: '\F152';
  font-family: 'Material Design Icons';
  font-size: 16px;
  line-height: 30px;
  margin-left: 5px;
  position: absolute;
  right: 0;
  top: 0;
  width: 30px;
  text-align: center;
  -webkit-transition: all 0.2s linear;
  -moz-transition: all 0.2s linear;
  -ms-transition: all 0.2s linear;
  -o-transition: all 0.2s linear;
}
.btn--icon:hover:after {
  right: -30px;
}
.btn--control {
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
  padding: 0;
  width: 30px;
  height: 30px;
  position: relative;
}
.btn--control:before {
  position: absolute;
  font-family: 'Material Design Icons';
  content: '\F152';
  color: white;
  left: 0;
  line-height: 30px;
  bottom: 0;
  top: 0;
  right: 0;
  text-align: center;
  text-indent: 0;
  font-size: 20px;
}
.btn--zoom:before {
  content: '\F43D';
}
.btn--dezoom:before {
  content: '\F43C';
}
.btn--reset:before {
  content: '\F161';
}
.btn--pointculture {
  background: #7ab439;
}
.verviers .btn--pointculture {
  background: #1f3241;
}
.braine .btn--pointculture {
  background: #BEB5B5;
}
.comines .btn--pointculture {
  background: #029896;
}
.le-phare .btn--pointculture {
  background: #1F4E86;
}
.whalll .btn--pointculture {
  background: #5B5351;
}
.schaerbeek .btn--pointculture {
  background: #673F6D;
}
.le-manege .btn--pointculture {
  background: #BEB5B5;
}
.la-louviere .btn--pointculture {
  background: #92AD35;
}
.btn--culturebe {
  margin-top: 10px;
  background: #F2374C;
}
.btn--search {
  color: #323232;
  background: #c7cccc;
  font-size: 21px;
}
.btn--search:before {
  text-indent: 0;
  content: '\F43B';
  font-family: 'Material Design Icons';
}
.btn--send {
  background: #00AEDA;
}
.btn--send:after {
  content: '\F62B';
}
p .btn--send {
  margin-top: 12px;
}
.btn--download {
  margin-bottom: 30px;
  background: #7ab439;
}
.btn--download:after {
  content: '\F147';
}
.btn--submit {
  background: #7ab439;
}
.btn--delete:after {
  content: '\F250';
}
.tip {
  position: relative;
}
.tip:after {
  content: '\F3F0';
  font-family: 'Material Design Icons';
}
.tip:hover {
  cursor: pointer;
}
.tip__data {
  position: absolute;
  background: #e3e6e6;
  padding: 12px;
  right: -30px;
  width: 200px;
  z-index: 300;
  -webkit-box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.5);
  box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.5);
}
.tip:hover .tip__data {
  display: block;
}
.label {
  font-family: 'Droid Sans', serif;
  font-size: 13px;
  margin-right: 5px;
}
a.label {
  text-decoration: none;
}
.label span {
  background: #4c4c4c;
  color: white;
  display: inline-block;
  margin: 3px 0 0 0;
  padding: 2px 5px;
}
.thumbnail .label {
  text-align: right;
  float: right;
  margin-left: 5px;
}
.thumbnail .label span {
  font-size: 14px;
}
.jeb .label {
  float: left;
  text-align: left;
  margin-left: 0;
  margin-right: 5px;
}
.label--secondary span {
  background: #c7cccc;
  color: #4c4c4c;
}
.label--event {
  position: absolute;
  z-index: 20;
  bottom: 0;
  left: 12px;
  margin: 0;
}
.label--event span {
  background: #7ab439;
}
h3 + .label,
p + .label {
  display: inline-block;
  margin-top: 6px;
}
select {
  background: white;
  width: 100%;
  max-width: 345px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  padding: 5px;
  font-size: 15px;
  font-family: 'Droid Sans', serif;
}
.select--nav {
  margin-bottom: 30px;
}
.js-select {
  position: relative;
  z-index: 10;
}
.js-select:focus {
  outline: none;
}
.js-select select {
  display: none;
}
.js-select__placeholder {
  font-family: 'Droid Sans', serif;
  padding: 3px 10px;
  font-size: 15px;
  width: 100%;
  background: #fff;
  display: block;
  border: 1px solid #9fa8a8;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  text-decoration: none;
}
.js-select__placeholder:after {
  font-family: 'Material Design Icons';
  content: '\F236';
  margin-left: 5px;
  position: relative;
  top: 1px;
  float: right;
}
.js-select__placeholder:hover {
  cursor: pointer;
}
.js-select--active {
  z-index: 250;
}
.js-select__options {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  background: #fff;
  border: 1px solid #9fa8a8;
  border-top: none;
  display: none;
  font-family: 'Droid Sans', serif;
  font-size: 15px;
  list-style-type: none;
  margin: 0;
  padding: 3px 10px;
  position: absolute;
  width: 100%;
  z-index: 100;
  max-height: 430px;
  overflow-y: scroll;
}
.js-select--active .js-select__options {
  display: block;
}
.select--location .js-select__options {
  min-width: 274px;
  border: 1px solid #9fa8a8;
  margin-top: -1px;
}
.js-select__item:hover {
  cursor: pointer;
  text-decoration: underline;
}
.select-inline {
  margin: -3px 0px 0px 12px;
  min-width: 220px;
}
.select-inline.select--location {
  min-width: 300px;
}
.box {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  padding: 12px;
  background: white;
  display: block;
  /*    margin-bottom: (@gutter/2);*/
  font-family: 'Droid Sans', serif;
}
a.box {
  text-decoration: none;
}
.advantages .box {
  margin-bottom: 15px;
}
.box--background {
  background: #c7cccc;
}
.section--background .box--background {
  background: white;
}
a:hover .box--background,
a:focus .box--background {
  background: #9fa8a8;
}
.box--background--education {
  background: #2a5980;
}
.box--border {
  border: 1px solid #c7cccc;
}
.box--message {
  padding-left: 40px;
  position: relative;
}
.box--message:before {
  font-family: 'Material Design Icons';
  content: '\F3F0';
  position: absolute;
  left: 12px;
}
.box--error,
.box--warning {
  border-color: #EE8D00;
  color: #EE8D00;
  margin-bottom: 30px;
}
.box--success {
  border-color: #81B701;
  color: #81B701;
  margin-bottom: 30px;
}
.box--debug,
.box--info {
  border-color: #00AEDA;
  color: #00AEDA;
  margin-bottom: 30px;
}
/* With big icon */
.box--icon {
  border: 1px solid #7ab439;
  font-style: italic;
  font-weight: bold;
  padding-left: 65px;
  position: relative;
}
.verviers .box--icon {
  border-color: #1f3241;
}
.braine .box--icon {
  border-color: #BEB5B5;
}
.comines .box--icon {
  border-color: #029896;
}
.le-phare .box--icon {
  border-color: #1F4E86;
}
.whalll .box--icon {
  border-color: #5B5351;
}
.schaerbeek .box--icon {
  border-color: #673F6D;
}
.le-manege .box--icon {
  border-color: #BEB5B5;
}
.la-louviere .box--icon {
  border-color: #92AD35;
}
.box--icon:before {
  font-family: 'Material Design Icons';
  background: #7ab439;
  color: white;
  content: '\F3F0';
  font-size: 30px;
  font-style: normal;
  font-weight: normal;
  height: 100%;
  left: 0;
  line-height: 50px;
  position: absolute;
  text-align: center;
  top: 0;
  width: 50px;
}
.verviers .box--icon:before {
  background: #1f3241;
}
.braine .box--icon:before {
  background: #BEB5B5;
}
.comines .box--icon:before {
  background: #029896;
}
.le-phare .box--icon:before {
  background: #1F4E86;
}
.whalll .box--icon:before {
  background: #5B5351;
}
.schaerbeek .box--icon:before {
  background: #673F6D;
}
.le-manege .box--icon:before {
  background: #BEB5B5;
}
.la-louviere .box--icon:before {
  background: #92AD35;
}
.box--icon--calendar:before {
  content: '\F1E4';
}
.box--icon--money:before {
  content: '\F20C';
}
.box--icon--truck:before {
  content: '\F62B';
}
.box--icon--media:before {
  content: '';
  background-image: url('../images/icon-media.png');
  background-repeat: no-repeat;
  background-position: center center;
}
.svg .box--icon--media:before {
  background-image: url('../images/icon-media.svg');
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 25px;
}
.box--icon--emprunts:before {
  content: '\F60E';
}
.box--icon--wishlist:before {
  content: '\F615';
}
.box--icon--abo:before {
  content: '\F604';
}
/* With color status */
.box--status {
  padding-right: 30px;
  position: relative;
  min-height: 76px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
a.box--status:hover {
  border-color: #9fa8a8;
}
.box--status:after {
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  content: '';
  height: 10px;
  width: 10px;
  position: absolute;
  right: 10px;
  top: 50%;
  margin-top: -5px;
  background: none;
}
.box--status--outside:after {
  right: -20px;
}
.box--status--success:after {
  background: #81B701;
}
a.box--status--success:hover {
  border-color: #81B701;
}
.box--status--danger:after {
  background: #F43616;
}
a.box--status--danger:hover {
  border-color: #F43616;
}
.box--status--warning:after {
  background: #EE8D00;
}
a.box--status--warning:hover {
  border-color: #EE8D00;
}
.box--status--info:after {
  background: #00AEDA;
}
a.box--status--info:hover {
  border-color: #00AEDA;
}
/*
Les "modules" sont n'importe quel pattern/motif qui requièrent plus qu'un seul élément HTML.
Par exemple une vignette (image+headline), un carousel, ...
*/
.thumbnail {
  background: #e3e6e6;
  margin-bottom: 30px;
  text-decoration: none !important;
}
.thumbnail:hover * {
  text-decoration: none;
}
.thumbnail__caption {
  padding: 30px 30px 30px 0;
}
.thumbnail__caption.alone {
  padding: 30px;
}
.thumbnail--partner .thumbnail__caption {
  padding: 15px;
}
.thumbnail__headline {
  color: #323232;
}
.thumbnail__image img {
  display: block;
  width: 100%;
  height: auto;
}
.thumbnail--partner .thumbnail__image {
  padding: 10px;
  background: white;
  border: 1px solid #e3e6e6;
}
.thumbnail__title {
  font-size: 24px;
  font-family: 'Droid Sans', sans-serif;
  padding-bottom: 10px;
  border-bottom: 2px solid white;
  margin-bottom: 15px;
  font-weight: bold;
  text-transform: uppercase;
  line-height: 1.2;
}
.thumbnail--partner .thumbnail__title {
  font-size: 18px;
  margin: 0;
  border: none;
  padding: 0;
}
.thumbnail__categories {
  color: #323232;
  font-family: 'Droid Sans', sans-serif;
}
.thumbnail__infos {
  color: #323232;
  font-size: 14px;
  margin: 12px 0;
}
@media (max-width: 960px) {
  .thumbnail__image {
    padding: 0;
  }
  .thumbnail__caption {
    padding-left: 30px;
  }
}
.breadcrumb__link {
  text-decoration: none;
}
.breadcrumb__link:hover {
  text-decoration: underline;
}
.breadcrumb {
  position: relative;
  display: block;
  font-family: 'Droid Sans', sans-serif;
  font-size: 21px;
  margin-bottom: 30px;
}
.breadcrumb:after {
  content: '';
  display: block;
  width: 219px;
  height: 1px;
  background: #c7cccc;
  margin-top: 5px;
  margin-bottom: 12px;
}
.breadcrumb h1 {
  display: inline-block;
}
.calendar-widget {
  font-family: 'Droid Sans', sans-serif;
}
.calendar-widget table {
  background: #e3e6e6;
  width: 100%;
}
.calendar-widget .month {
  font-size: 16px;
  text-align: center;
  padding: 5px;
  text-transform: capitalize;
}
.calendar-widget th {
  border-bottom: 1px solid white;
  padding: 10px 3px 0 3px;
}
.calendar-widget th a {
  text-decoration: none;
}
.calendar-widget th a:hover {
  text-decoration: none !important;
}
.calendar-widget td {
  padding: 10px 10px 0 3px;
  font-size: 14px;
  text-align: center;
  line-height: 1;
}
.calendar-widget td:hover {
  font-weight: bold;
}
.calendar-widget td.active a {
  font-weight: bold;
  color: white;
  padding: 3px;
  text-decoration: none;
}
.verviers .calendar-widget td.active a {
  background: #1f3241;
}
.braine .calendar-widget td.active a {
  background: #BEB5B5;
}
.comines .calendar-widget td.active a {
  background: #029896;
}
.le-phare .calendar-widget td.active a {
  background: #1F4E86;
}
.whalll .calendar-widget td.active a {
  background: #5B5351;
}
.schaerbeek .calendar-widget td.active a {
  background: #673F6D;
}
.le-manege .calendar-widget td.active a {
  background: #BEB5B5;
}
.la-louviere .calendar-widget td.active a {
  background: #92AD35;
}
.calendar-widget td.active a:hover {
  color: white;
}
.calendar-widget tr:last-child td {
  padding-bottom: 12px;
}
.section--background .calendar-widget table {
  background: white;
}
.section--background .calendar-widget th {
  border-bottom: 1px solid #e3e6e6;
}
.js-trigger-dropdown:hover {
  cursor: pointer;
}
.js-dropdown {
  display: none;
}
.js-dropdown--open {
  display: block;
}
.css-dropdown {
  display: none;
}
.css-trigger-dropdown:hover .css-dropdown {
  display: block;
}
.aside-nav {
  margin-bottom: 30px;
}
.aside-nav__item {
  margin-bottom: 1px;
  position: relative;
}
.aside-nav__link {
  background: #c7cccc;
  display: block;
  font-family: 'Droid Sans', serif;
  text-decoration: none;
  padding: 10px 25px 10px 10px;
  position: relative;
}
.aside-nav__link:after {
  content: '\F152';
  font-family: 'Material Design Icons';
  position: absolute;
  right: 10px;
  line-height: 0;
  display: block;
  top: 50%;
}
.aside-nav__link:hover,
.aside-nav__link.active {
  color: white;
  background: #7ab439;
}
.verviers .aside-nav__link:hover,
.verviers .aside-nav__link.active {
  background: #1f3241;
}
.braine .aside-nav__link:hover,
.braine .aside-nav__link.active {
  background: #BEB5B5;
}
.comines .aside-nav__link:hover,
.comines .aside-nav__link.active {
  background: #029896;
}
.le-phare .aside-nav__link:hover,
.le-phare .aside-nav__link.active {
  background: #1F4E86;
}
.whalll .aside-nav__link:hover,
.whalll .aside-nav__link.active {
  background: #5B5351;
}
.schaerbeek .aside-nav__link:hover,
.schaerbeek .aside-nav__link.active {
  background: #673F6D;
}
.le-manege .aside-nav__link:hover,
.le-manege .aside-nav__link.active {
  background: #BEB5B5;
}
.la-louviere .aside-nav__link:hover,
.la-louviere .aside-nav__link.active {
  background: #92AD35;
}
.aside-nav__subnav__link {
  text-decoration: none;
  font-family: 'Droid Sans', serif;
}
.aside-nav__subnav__link:hover {
  font-weight: bold;
}
.aside-nav__subnav {
  left: 100%;
  min-width: 190px;
  position: absolute;
  top: 0;
  z-index: 200;
  background: red;
  padding: 10px;
}
.social {
  overflow: auto;
}
.social--square {
  float: left;
}
.social__item {
  float: left;
  padding: 0 10px;
}
.social--square .social__item {
  margin-right: 10px;
  padding: 0;
}
.site__header .social__item {
  padding: 0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  width: 33.33333333%;
}
.site__header .social__item:last-child {
  border-right: none;
}
.city__social .social {
  margin-top: 10px;
}
.social__link {
  display: block;
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
  width: 30px;
  text-decoration: none;
  height: 55px;
}
.social__link:after {
  font-size: 21px;
  display: block;
  text-indent: 0;
  font-family: 'Material Design Icons';
  color: white;
  line-height: 10px;
  text-align: center;
}
.social--square .social__link {
  height: 30px;
  background: #4c4c4c;
  color: white;
  line-height: 1;
}
.social--square .social__link:after {
  font-size: 15px;
  color: white !important;
  line-height: 0px;
}
.site__header .social__link {
  width: auto;
  padding: 10px 0;
}
.social__link--facebook:after {
  content: '\F301';
  color: #3b5998;
}
.social--square .social__link--facebook,
.social__link--square.social__link--facebook {
  background: #3b5998;
}
.site__footer .social__link--facebook:hover:after,
.site__header .social__link--facebook:hover:after {
  color: #768bb7;
}
.social__link--twitter:after {
  content: '\F631';
  color: #55acee;
}
.social--square .social__link--twitter,
.social__link--square.social__link--twitter {
  background: #55acee;
}
.site__footer .social__link--twitter:hover:after,
.site__header .social__link--twitter:hover:after {
  color: #88c5f3;
}
.social__link--youtube:after {
  content: '\F6B0';
  color: #dd4b39;
}
.social--square .social__link--youtube,
.social__link--square.social__link--youtube {
  background: #dd4b39;
}
.site__footer .social__link--youtube:hover:after,
.site__header .social__link--youtube:hover:after {
  color: #e78174;
}
.social__link--instagram:after {
  content: '\F3F1';
  color: #323232;
}
.social__link--instagram:hover:after {
  color: #999999;
  transition: all 0.4s ease-in-out;
  -moz-transition: all 0.4s ease-in-out;
  -webkit-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  -ms-transition: all 0.4s ease-in-out;
}
.social--square .social__link--instagram,
.social__link--square.social__link--instagram {
  background: #323232;
}
.site__footer .social__link--instagram:hover:after,
.site__header .social__link--instagram:hover:after {
  color: #707070;
}
.social__link--mail:after {
  content: '\F2E3';
}
.social__link--square {
  color: white;
  height: 30px;
  width: 30px;
  margin-left: 10px;
  position: relative;
  line-height: 30px;
}
.social__link--square:after {
  color: white;
  text-align: center;
  width: 30px;
  position: absolute;
  line-height: inherit;
  top: 0;
}
.top.social__link {
  margin-top: -10px;
}
@media (max-width: 959px) {
  .site__header .social__link:after {
    font-size: 35px;
  }
}
@media (min-width: 960px) {
  .site__header .social {
    float: right;
    border-bottom: none;
  }
  .site__header .social__item {
    padding: 0 10px;
    width: auto;
    border-right: none;
  }
  .site__header .social__link {
    width: 30px;
    padding: 0;
  }
}
.index-list {
  margin-bottom: 30px;
}
.index-list__item {
  float: left;
  margin-bottom: 15px;
  min-height: 124px;
  position: relative;
  width: 100%;
  line-height: 1.4;
  font-size: 15px;
}
.index-list--medias .index-list__item {
  min-height: 0;
}
.city__playlists .index-list__item {
  padding: 30px;
}
.index-list__item__title {
  font-size: 23px;
  margin: 0;
}
.index-list__item__title a {
  text-decoration: none;
}
.index-list--medias .index-list__item__title {
  font-size: 18px;
}
.index-list__item__infos {
  margin-top: 10px;
}
.index-list__item__infos p {
  margin-bottom: 0;
}
.index-list--medias .index-list__item__infos {
  margin: 0;
}
.index-list__item__cover {
  display: block;
  position: relative;
  text-decoration: none;
  z-index: 0;
  overflow: hidden;
  max-height: 200px;
  margin-top: -12px;
  margin-left: -12px;
  margin-right: -12px;
}
.index-list__item__cover img {
  height: auto;
  width: 100%;
}
.results .index-list__item__cover img {
  max-height: 100%;
  width: auto;
  min-width: 0;
  float: right;
}
.index-list__item--partner .index-list__item__cover {
  background: white;
  text-align: center;
  height: 124px;
  border: 5px solid white;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  line-height: 124px;
}
.index-list__item--partner .index-list__item__cover img {
  display: inline;
  width: auto;
  min-width: auto;
  min-height: auto;
  line-height: 100%;
  max-height: 100%;
}
@media (min-width: 768px) {
  .index-list__item__cover {
    position: absolute;
    right: 0;
    top: 0;
    height: 100%;
    overflow: hidden;
    width: 200px;
    margin: 0;
    max-height: none;
  }
  .index-list__item__cover img {
    min-height: 100%;
    min-width: 100%;
    width: auto;
    max-width: none;
  }
}
/* General */
.form {
  margin-bottom: 30px;
}
.form--large {
  margin-bottom: 0;
}
.form__fieldset {
  margin-bottom: 30px;
}
.search-form--classical .form__fieldset {
  margin-bottom: 15px;
}
.input {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  background: white;
  border: 1px solid #9fa8a8;
  color: #4c4c4c;
  display: block;
  font-family: 'Droid Sans', serif;
  font-size: 15px;
  font-style: italic;
  height: 32px;
  margin: 0 0 15px 0;
  padding: 3px 10px;
}
.form--large .input {
  font-size: 21px;
  padding: 10px;
  height: 50px;
  line-height: 50px;
  border: 1px solid #7ab439;
  width: 70%;
}
.search-form--advanced .input,
.search-form--tabs .input,
.search-form--classical .input {
  width: 100%;
}
.input--radio {
  margin-right: 15px;
}
.input--has-help {
  margin-bottom: 0;
}
.input--stuck {
  float: left;
}
.label--inline {
  float: left;
}
.input--inline {
  float: left;
}
.form__help {
  margin-top: 0;
  float: left;
}
.btn + .form__help {
  margin-top: 30px;
}
.form {
  /* to hide the checkbox itself */
}
.form input[type=checkbox] {
  display: none;
}
.form input[type=checkbox] + .checkbox {
  display: block;
}
.form input[type=checkbox] + .checkbox:before {
  font-family: 'Material Design Icons';
  content: '\F227';
  display: block;
  float: left;
  font-size: 15px;
  margin-right: 12px;
  position: relative;
  top: 1px;
}
.form input[type=checkbox] + .checkbox:hover {
  cursor: pointer;
}
.form input[type=checkbox].error + .checkbox:before {
  color: red;
}
.form input[type=checkbox]:checked + .checkbox:before {
  content: '\F22B';
}
/* Newsletter */
.newsletter-form__input {
  background: white;
  border: none;
  height: 30px;
  margin: 0;
  font-family: 'Droid Sans', serif;
  font-style: italic;
  font-size: 15px;
  padding: 5px;
  color: #4c4c4c;
  max-width: 100%;
  width: 212px;
}
.newsletter-form__submit {
  background: #7ab439;
  margin-top: 10px;
}
.form--large .newsletter-form__submit {
  width: 30%;
  height: 50px;
  font-size: 21px;
  text-align: left;
  margin-top: 0;
}
.form--large .newsletter-form__submit:after {
  font-size: 21px;
  position: static;
  display: inline;
}
/* Archives */
.archives-form__option {
  position: relative;
  padding-left: 14px;
}
.archives-form__option:before {
  font-family: 'Material Design Icons';
  font-size: 80%;
  left: -2px;
  margin-right: 5px;
  position: absolute;
  top: 3px;
}
/* Theme */
.theme__option {
  position: relative;
  padding-left: 14px;
}
.theme__option:before {
  font-family: 'Material Design Icons';
  content: '\F407';
  font-size: 70%;
  left: -2px;
  margin-right: 5px;
  position: absolute;
  top: 6px;
}
/* Collections */
.collection-form__select {
  z-index: 5;
}
.collection-form__option {
  position: relative;
  padding-left: 14px;
}
.collection-form__option:before {
  font-family: 'Material Design Icons';
  content: '\F407';
  font-size: 70%;
  left: -2px;
  margin-right: 5px;
  position: absolute;
  top: 6px;
}
/* Agenda */
.agenda-search-form .btn {
  margin-top: 10px;
}
.agenda-search-form .input {
  width: 100%;
  margin: 0;
}
/* Search in header */
.search-form {
  position: relative;
}
.site__header .search-form {
  width: 240px;
  position: absolute;
  top: 20px;
  right: 20px;
  margin: 0;
}
.search-form__inner {
  overflow: hidden;
  float: right;
  height: 30px;
  width: 100%;
}
.site__header .search-form__inner {
  position: absolute;
  right: 0;
  z-index: 12;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
}
.search-form__input {
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  background: #fff;
  border: 0;
  color: #4c4c4c;
  font-family: 'Droid Sans', serif;
  font-size: 15px;
  font-style: italic;
  height: 30px;
  margin-right: -30px;
  padding: 0 30px 0 8px;
  width: 100%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
}
.site__header .search-form__input {
  float: left;
  padding: 8px 30px 8px 8px;
}
.search-form--simple .search-form__input {
  width: 100%;
  border: 1px solid #c7cccc;
}
.search-form__submit {
  float: right;
  text-indent: -9999px;
  background: white;
  padding: 0;
  width: 30px;
  height: 30px;
  position: relative;
}
.search-form__submit span {
  color: #323232;
  font-size: 21px;
  text-align: right;
  float: right;
  width: 30px;
}
.search-form__submit span:before {
  text-indent: 0;
  display: block;
  text-align: center;
  content: '\F43B';
  font-family: 'Material Design Icons';
}
.search-form--simple .search-form__submit {
  background: #c7cccc;
}
.site__header .search-form__submit {
  background: none;
}
.search-form--full {
  background: #c7cccc;
  width: 100%;
  height: auto;
  position: relative;
  padding: 15px;
  margin-bottom: 30px;
}
.search-form--advanced {
  background: #c7cccc;
  padding: 30px 0 30px 30px;
  margin-bottom: 30px;
  width: 100%;
}
.search-form--classical {
  background: #efe0d6;
  padding: 30px 0 30px 30px;
  margin-bottom: 30px;
}
.search-form--tabs {
  background: #c7cccc;
  position: relative;
  padding: 15px;
  width: 100%;
}
.search-tabs {
  margin-bottom: 30px;
}
/* Autocomplete */
.ac-results {
  position: absolute;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  background: #c7cccc;
  padding: 15px;
  box-sizing: border-box;
  right: 0;
  left: 0;
  z-index: 20;
  top: 30px;
}
.search-form--full .ac-results {
  width: 75%;
  right: 25%;
  top: 45px;
}
.search-form--tabs .ac-results {
  top: 45px;
}
/* Responsive */
@media (min-width: 960px) {
  .site__header .search-form {
    position: relative;
    float: right;
    margin: 12px 30px 12px 0;
    top: auto;
    right: auto;
    width: auto;
  }
  .site__header .search-form .search-form__input {
    width: 0;
    padding: 0;
  }
  .site__header .search-form.search-form--open .search-form__input {
    display: inline-block;
    width: 400px;
    padding: 0 30px 0 8px;
    border: 1px solid #c7cccc;
  }
  .site__header .search-form__inner {
    width: 30px;
  }
  .site__header .search-form--open .search-form__inner {
    width: 400px;
  }
}
.cta {
  background: #c7cccc;
  display: block;
  font-family: 'Droid Sans', serif;
  margin-bottom: 15px;
  padding: 30px 15px;
  position: relative;
  text-align: center;
  text-decoration: none;
  border: 1px solid #c7cccc;
  color: black;
  width: 100%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
a.cta:hover,
button.cta:hover {
  background: white;
  color: #7ab439;
}
a.cta:hover.cta--education,
button.cta:hover.cta--education {
  background: #2a5980;
  color: white;
}
a.cta:hover.cta--pointculture,
button.cta:hover.cta--pointculture {
  background: #7ab439;
  color: white;
}
.cta-list .cta {
  margin-bottom: 12px;
}
.cta__price {
  font-size: 50px;
  display: block;
  line-height: 1;
}
.cta__label {
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  border-radius: 100%;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  background: #7ab439;
  color: white;
  display: block;
  height: 40px;
  line-height: 40px;
  position: absolute;
  right: -20px;
  text-align: center;
  top: -20px;
  font-size: 13px;
  width: 40px;
}
.cta__label--blue {
  background: #00AEDA;
}
.cta--home {
  padding: 15px;
  background: none;
}
.cta--menu {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  border: none;
  color: white;
  padding: 12px;
  text-align: left;
}
.cta--pointculture {
  background: #7ab439;
}
.cta--education {
  background: #2a5980;
}
.cta--home-education {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  background: #2a5980;
  color: white;
  padding: 30px 90px 30px 21px;
  position: relative;
  text-align: left;
  width: auto;
}
.cta--home-education:after {
  content: '';
  background: url('../images/illu-cta-se.png') no-repeat;
  height: 220px;
  width: 236px;
  display: block;
  position: absolute;
  right: -144px;
  bottom: -15px;
}
/*largeur de la page*/
.cta--large {
  background: #d2d6d6;
  margin-bottom: 0;
  padding-left: 0;
  padding-right: 0;
}
.cta--home-education .cta__title {
  font-size: 28px;
  line-height: 30px;
}
.cta--large .cta__title {
  font-size: 21px;
  text-align: left;
  line-height: 24px;
  margin: 0 8px 0 0;
  width: 55%;
}
.cta--menu .cta__link {
  font-size: 21px;
  line-height: 24px;
  text-decoration: none;
}
.cta--home-education .cta__link {
  font-size: 21px;
  line-height: 24px;
  text-decoration: none;
}
.cta--home .cta__link {
  font-family: 'Droid Sans', serif;
  font-style: italic;
  font-size: 120%;
}
.cta--home .cta__link:after {
  font-style: normal;
}
.cta__link:after {
  font-family: 'Material Design Icons';
  -webkit-transition: all 0.2s linear;
  -moz-transition: all 0.2s linear;
  -ms-transition: all 0.2s linear;
  -o-transition: all 0.2s linear;
  bottom: 0;
  content: '\F152';
  font-size: 16px;
  line-height: 30px;
  margin-left: 5px;
  position: relative;
  right: 0;
  text-align: center;
  width: 30px;
}
.cta:hover .cta__link:after {
  right: -30px;
}
@media (min-width: 960px) {
  .cta--large .cta__inner {
    display: table;
  }
  .cta--large .cta__title {
    display: table-cell;
  }
  .cta--large .cta__content {
    display: table-cell;
    padding-right: 30px;
  }
  .cta--home-education {
    margin-right: 110px;
  }
}
.player {
  position: relative;
  margin-bottom: 21px;
}
.player__item {
  border-bottom: 1px solid #c7cccc;
  padding: 5px 0;
}
.player__disk {
  position: relative;
}
.player__disk__title {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  line-height: 25px;
  font-weight: bold;
}
.player__item--playable:before {
  content: '\F4FC';
  font-family: 'Material Design Icons';
  font-size: 21px;
  line-height: 25px;
}
.player__item--playable.amplitude-playing:before {
  color: #7ab439;
  content: '\F4D5';
}
.player__item--playable:hover {
  cursor: pointer;
}
.player__item__number {
  color: #9fa8a8;
  display: inline-block;
  width: 40px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  padding: 0 10px;
  text-align: right;
}
.accordion__title {
  background: #c7cccc;
  padding: 15px 12px;
  font-size: 18px;
  margin: 15px 0 0 0;
}
.accordion__title:after {
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  border-radius: 100%;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  font-family: 'Material Design Icons';
  background: white;
  content: '\F236';
  float: right;
  font-size: 18px;
  height: 21px;
  line-height: 23px;
  text-align: center;
  width: 21px;
}
.accordion__title:hover {
  cursor: pointer;
}
.accordion__title.active:after {
  content: '\F239';
}
.accordion__content {
  padding: 12px 0 30px 0;
}
.results {
  padding-right: 30px;
  min-height: 700px;
  padding-top: 30px !important;
}
.results__block {
  padding-bottom: 30px;
  margin-bottom: 30px;
  border-bottom: 1px solid #c7cccc;
}
.results__block:last-child {
  border: none;
}
.availability {
  margin-bottom: 30px;
  font-family: 'Droid Sans', serif;
}
.availability__item {
  position: relative;
  padding-left: 20px;
}
.availability__item:before {
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  content: '';
  height: 10px;
  width: 10px;
  position: absolute;
  left: 0;
  top: 9px;
  background: #c7cccc;
}
.availability__choice {
  margin-bottom: 0;
}
.availability__item--success:before {
  background: #81B701;
}
.availability__item--info:before {
  background: #00AEDA;
}
.availability__item--danger:before {
  background: #F43616;
}
.availability__item--warning:before {
  background: #EE8D00;
}
.facets__title {
  margin-bottom: 30px;
}
.pagination {
  font-family: 'Droid Sans', serif;
}
.pagination a {
  text-decoration: none;
}
.endless_page_link,
.endless_page_current,
.endless_separator {
  display: block;
  float: left;
  padding: 8px 12px;
  line-height: 1;
  border: 1px solid #c7cccc;
  margin-right: 5px;
}
.section--background .endless_page_link,
.section--background .endless_page_current,
.section--background .endless_separator {
  border: 1px solid white;
}
.endless_page_link:hover {
  background: #c7cccc;
}
.section--background .endless_page_link:hover {
  background: white;
}
.endless_page_current {
  background: #c7cccc;
}
.section--background .endless_page_current {
  background: white;
}
.modal {
  position: fixed;
  background: white;
  -webkit-box-shadow: 3px 3px 9px rgba(0, 0, 0, 0.3);
  -moz-box-shadow: 3px 3px 9px rgba(0, 0, 0, 0.3);
  box-shadow: 3px 3px 9px rgba(0, 0, 0, 0.3);
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  left: 0;
  right: 0;
  margin: auto;
  max-width: 100%;
  max-height: 80%;
  padding: 30px;
  top: 10%;
  overflow-y: scroll;
  width: 600px;
  z-index: 500;
}
.modal.modal--musicmap {
  width: 768px;
  overflow-y: hidden;
  max-height: 500px;
}
.modal.modal--dates {
  width: 500px;
}
.modal iframe {
  width: 100%;
}
.js-close-modal {
  position: absolute;
  top: 10px;
  right: 10px;
  height: 30px;
  width: 30px;
  display: block;
}
.js-close-modal:after {
  content: '\F69A';
  color: #9fa8a8;
  font-family: 'Material Design Icons';
  line-height: 1;
  position: absolute;
  top: 0;
  right: 0;
}
.js-close-modal:hover {
  cursor: pointer;
}
.js-open-modal {
  margin-left: 5px;
}
.js-open-modal:after {
  font-family: 'Material Design Icons';
  content: '\F3F0';
}
.js-open-modal:hover {
  cursor: pointer;
}
.modal-overlay {
  background: rgba(0, 0, 0, 0.5);
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  top: 0;
  z-index: 500;
}
.modal--musicmap .modal__inner {
  overflow-y: scroll;
  height: 400px;
}
.modal__content {
  width: 75%;
  padding-left: 30px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  float: left;
}
.modal__sidebar {
  width: 25%;
  float: left;
}
.modal--musicmap .modal__title {
  font-size: 20px;
  margin-bottom: 12px;
  text-transform: uppercase;
  border-bottom: 1px solid #c7cccc;
  padding-bottom: 12px;
}
.modal--musicmap .modal h3 {
  font-size: 16px;
  text-transform: uppercase;
  margin-top: 24px;
  margin-bottom: 12px;
}
.modal--musicmap .modal__caption {
  font-size: 14px;
  margin: 12px 0;
  font-style: italic;
  font-family: 'Droid Sans', serif;
  line-height: 18px;
}
.stream-block .col__rich-text:not(:first-child) {
  margin-top: 1em;
  clear: both;
}
.stream-block h2.title--secondary:not(:first-child) {
  margin-top: 1em;
}
.stream-block figure.left {
  margin-right: 30px;
}
.stream-block figure.right {
  margin-right: -30px;
  margin-left: 30px;
}
.stream-block figure.full-width {
  margin-right: -30px;
}
.stream-block figure.half-width img {
  width: 50%;
  margin-left: 25%;
  height: auto;
}
/* Project-specific */
.error-404 .main-content,
.error-500 .main-content,
.error-502 .main-content {
  background: url('../images/illu-error.png') no-repeat 90% bottom;
  padding-bottom: 120px;
}
.error-404 .breadcrumb,
.error-500 .breadcrumb,
.error-502 .breadcrumb {
  margin-bottom: 30px;
}
.error-503 .main-content {
  background: url('../images/illu-error-indisponible.png') no-repeat 70% 75%;
  padding-bottom: 120px;
}
.error-503 .breadcrumb {
  margin-bottom: 30px;
}
@media (max-width: 960px) {
  .error-503 .main-content {
    background: url('../images/illu-error-indisponible-opacity.png') no-repeat 70% 75%;
  }
}
@media (max-width: 1300px) {
  .error-503 .main-content {
    background: url('../images/illu-error-indisponible-opacity.png') no-repeat 70% 75%;
  }
}
.account__shortcut {
  margin-bottom: 30px;
}
.account__shortcut__title {
  margin-bottom: 15px;
}
.account__shortcut__title.title--curioso {
  margin-bottom: -29px;
}
/* Account list et list item, comme sur la pages des emprunts ou des demandes d'envoi*/
.account__list {
  margin-bottom: 30px;
}
.account__list__item {
  float: left;
  margin-bottom: 15px;
  min-height: 124px;
  position: relative;
  width: 100%;
}
.account__list__title {
  font-size: 22px;
  margin: 0;
}
.account__list__title a {
  text-decoration: none;
}
.account__list__infos p {
  margin-bottom: 0;
}
.account__list__cover {
  height: auto;
  width: 100%;
  display: block;
  margin-top: 15px;
  float: left;
}
@media (min-width: 960px) {
  .account-home .main-content {
    background: white url('../images/illu-account-home.png') no-repeat 100% bottom;
  }
  .account-inscription .main-content {
    background: white url('../images/illu-inscription-home.png') no-repeat 100% bottom;
  }
  .account__list__cover {
    position: absolute;
    right: 0;
    top: 0;
    margin: 0;
    height: 100%;
    width: auto;
  }
}
.classical-search .icon {
  background: #e0c2ad;
  width: 18px;
  height: 18px;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  display: inline-block;
  position: relative;
  top: 3px;
  margin-right: 5px;
  text-decoration: none;
  text-align: center;
  -webkit-transition: background 0.1s ease-in-out;
  -moz-transition: background 0.1s ease-in-out;
  -ms-transition: background 0.1s ease-in-out;
  -o-transition: background 0.1s ease-in-out;
}
.classical-search a.icon:hover {
  background: #d0a385;
}
.classical-search .icon:after {
  position: absolute;
  width: 18px;
  left: 0;
  height: 18px;
  line-height: 18px;
  top: -2px;
}
.classical-search .icon--more:after {
  content: '+';
}
.classical-search .icon--less:after {
  content: '-';
}