@charset "UTF-8";
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section,
summary {
  display: block;
}

/**
 * Correct `inline-block` display not defined in IE 6/7/8/9 and Firefox 3.
 */
audio,
canvas,
video {
  display: inline-block;
  *display: inline;
  *zoom: 1;
}

/**
 * Prevent modern browsers from displaying `audio` without controls.
 * Remove excess height in iOS 5 devices.
 */
audio:not([controls]) {
  display: none;
  height: 0;
}

/**
 * Address styling not present in IE 7/8/9, Firefox 3, and Safari 4.
 * Known issue: no IE 6 support.
 */
[hidden] {
  display: none;
}

/* ==========================================================================
   Base
   ========================================================================== */
/**
 * 1. Correct text resizing oddly in IE 6/7 when body `font-size` is set using
 *    `em` units.
 * 2. Prevent iOS text size adjust after orientation change, without disabling
 *    user zoom.
 */
html {
  font-size: 100%; /* 1 */
  -ms-text-size-adjust: 100%; /* 2 */
  -webkit-text-size-adjust: 100%; /* 2 */
}

/**
 * Address `font-family` inconsistency between `textarea` and other form
 * elements.
 */
html,
button,
input,
select,
textarea {
  font-family: sans-serif;
}

/**
 * Address margins handled incorrectly in IE 6/7.
 */
body {
  margin: 0;
}

/* ==========================================================================
   Links
   ========================================================================== */
/**
 * Address `outline` inconsistency between Chrome and other browsers.
 */
a:focus {
  outline: thin dotted;
}

/**
 * Improve readability when focused and also mouse hovered in all browsers.
 */
a:active,
a:hover {
  outline: 0;
}

/* ==========================================================================
   Typography
   ========================================================================== */
/**
 * Address styling not present in IE 7/8/9, Safari 5, and Chrome.
 */
abbr[title] {
  border-bottom: 1px dotted;
}

/**
 * Address style set to `bolder` in Firefox 3+, Safari 4/5, and Chrome.
 */
b,
strong {
  font-weight: bold;
}

blockquote {
  margin: 1em 40px;
}

/**
 * Address styling not present in Safari 5 and Chrome.
 */
dfn {
  font-style: italic;
}

/**
 * Address differences between Firefox and other browsers.
 * Known issue: no IE 6/7 normalization.
 */
hr {
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  height: 0;
}

/**
 * Address styling not present in IE 6/7/8/9.
 */
mark {
  background: #ff0;
  color: #000;
}

/**
 * Address margins set differently in IE 6/7.
 */
p,
pre {
  margin: 1em 0;
}

/**
 * Correct font family set oddly in IE 6, Safari 4/5, and Chrome.
 */
code,
kbd,
pre,
samp {
  font-family: monospace, serif;
  _font-family: "courier new", monospace;
  font-size: 1em;
}

/**
 * Improve readability of pre-formatted text in all browsers.
 */
pre {
  white-space: pre;
  white-space: pre-wrap;
  word-wrap: break-word;
}

/**
 * Address CSS quotes not supported in IE 6/7.
 */
q {
  quotes: none;
}

/**
 * Address `quotes` property not supported in Safari 4.
 */
q:before,
q:after {
  content: "";
  content: none;
}

/**
 * Address inconsistent and variable font size in all browsers.
 */
small {
  font-size: 80%;
}

/**
 * Prevent `sub` and `sup` affecting `line-height` in all browsers.
 */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sup {
  top: -0.5em;
}

sub {
  bottom: -0.25em;
}

/* ==========================================================================
   Lists
   ========================================================================== */
/**
 * Address margins set differently in IE 6/7.
 */
dl,
menu,
ol,
ul {
  margin: 1em 0;
}

dd {
  margin: 0 0 0 40px;
}

/**
 * Address paddings set differently in IE 6/7.
 */
menu,
ol,
ul {
  padding: 0 0 0 40px;
}

/**
 * Correct list images handled incorrectly in IE 7.
 */
nav ul,
nav ol {
  list-style: none;
  list-style-image: none;
}

/* ==========================================================================
   Embedded content
   ========================================================================== */
/**
 * 1. Remove border when inside `a` element in IE 6/7/8/9 and Firefox 3.
 * 2. Improve image quality when scaled in IE 7.
 */
img {
  border: 0; /* 1 */
  -ms-interpolation-mode: bicubic; /* 2 */
}

/**
 * Correct overflow displayed oddly in IE 9.
 */
svg:not(:root) {
  overflow: hidden;
}

/* ==========================================================================
   Figures
   ========================================================================== */
/**
 * Address margin not present in IE 6/7/8/9, Safari 5, and Opera 11.
 */
figure {
  margin: 0;
}

/* ==========================================================================
   Forms
   ========================================================================== */
/**
 * Correct margin displayed oddly in IE 6/7.
 */
form {
  margin: 0;
}

/**
 * Define consistent border, margin, and padding.
 */
fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em;
}

/**
 * 1. Correct color not being inherited in IE 6/7/8/9.
 * 2. Correct text not wrapping in Firefox 3.
 * 3. Correct alignment displayed oddly in IE 6/7.
 */
legend {
  border: 0; /* 1 */
  padding: 0;
  white-space: normal; /* 2 */
  *margin-left: -7px; /* 3 */
}

/**
 * 1. Correct font size not being inherited in all browsers.
 * 2. Address margins set differently in IE 6/7, Firefox 3+, Safari 5,
 *    and Chrome.
 * 3. Improve appearance and consistency in all browsers.
 */
button,
input,
select,
textarea {
  font-size: 100%; /* 1 */
  margin: 0; /* 2 */
  vertical-align: baseline; /* 3 */
  *vertical-align: middle; /* 3 */
}

/**
 * Address Firefox 3+ setting `line-height` on `input` using `!important` in
 * the UA stylesheet.
 */
button,
input {
  line-height: normal;
}

/**
 * Address inconsistent `text-transform` inheritance for `button` and `select`.
 * All other form control elements do not inherit `text-transform` values.
 * Correct `button` style inheritance in Chrome, Safari 5+, and IE 6+.
 * Correct `select` style inheritance in Firefox 4+ and Opera.
 */
button,
select {
  text-transform: none;
}

/**
 * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
 *    and `video` controls.
 * 2. Correct inability to style clickable `input` types in iOS.
 * 3. Improve usability and consistency of cursor style between image-type
 *    `input` and others.
 * 4. Remove inner spacing in IE 7 without affecting normal text inputs.
 *    Known issue: inner spacing remains in IE 6.
 */
button,
html input[type=button],
input[type=reset],
input[type=submit] {
  -webkit-appearance: button; /* 2 */
  cursor: pointer; /* 3 */
  *overflow: visible; /* 4 */
}

/**
 * Re-set default cursor for disabled elements.
 */
button[disabled],
html input[disabled] {
  cursor: default;
}

/**
 * 1. Address box sizing set to content-box in IE 8/9.
 * 2. Remove excess padding in IE 8/9.
 * 3. Remove excess padding in IE 7.
 *    Known issue: excess padding remains in IE 6.
 */
input[type=checkbox],
input[type=radio] {
  box-sizing: border-box; /* 1 */
  padding: 0; /* 2 */
  *height: 13px; /* 3 */
  *width: 13px; /* 3 */
}

/**
 * 1. Address `appearance` set to `searchfield` in Safari 5 and Chrome.
 * 2. Address `box-sizing` set to `border-box` in Safari 5 and Chrome
 *    (include `-moz` to future-proof).
 */
input[type=search] {
  -webkit-appearance: textfield; /* 1 */
  -moz-box-sizing: content-box;
  -webkit-box-sizing: content-box; /* 2 */
  box-sizing: content-box;
}

/**
 * Remove inner padding and search cancel button in Safari 5 and Chrome
 * on OS X.
 */
input[type=search]::-webkit-search-cancel-button,
input[type=search]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * Remove inner padding and border in Firefox 3+.
 */
button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0;
}

/**
 * 1. Remove default vertical scrollbar in IE 6/7/8/9.
 * 2. Improve readability and alignment in all browsers.
 */
textarea {
  overflow: auto; /* 1 */
  vertical-align: top; /* 2 */
}

/* ==========================================================================
   Tables
   ========================================================================== */
/**
 * Remove most spacing between table cells.
 */
table {
  border-collapse: collapse;
  border-spacing: 0;
}

/*config*/
[class*=block-grid-] {
  display: block;
  padding: 0;
  margin: 0 -0.75rem;
}
[class*=block-grid-]:before, [class*=block-grid-]:after {
  content: " ";
  display: table;
}
[class*=block-grid-]:after {
  clear: both;
}
[class*=block-grid-] > li {
  display: block;
  height: auto;
  float: left;
  padding: 0 0.75rem 1.5rem;
}

@media only screen {
  .small-block-grid-1 > li {
    width: 100%;
    list-style: none;
  }
  .small-block-grid-1 > li:nth-of-type(1n) {
    clear: none;
  }
  .small-block-grid-1 > li:nth-of-type(1n+1) {
    clear: both;
  }
  .small-block-grid-2 > li {
    width: 50%;
    list-style: none;
  }
  .small-block-grid-2 > li:nth-of-type(1n) {
    clear: none;
  }
  .small-block-grid-2 > li:nth-of-type(2n+1) {
    clear: both;
  }
  .small-block-grid-3 > li {
    width: 33.3333333333%;
    list-style: none;
  }
  .small-block-grid-3 > li:nth-of-type(1n) {
    clear: none;
  }
  .small-block-grid-3 > li:nth-of-type(3n+1) {
    clear: both;
  }
  .small-block-grid-4 > li {
    width: 25%;
    list-style: none;
  }
  .small-block-grid-4 > li:nth-of-type(1n) {
    clear: none;
  }
  .small-block-grid-4 > li:nth-of-type(4n+1) {
    clear: both;
  }
  .small-block-grid-5 > li {
    width: 20%;
    list-style: none;
  }
  .small-block-grid-5 > li:nth-of-type(1n) {
    clear: none;
  }
  .small-block-grid-5 > li:nth-of-type(5n+1) {
    clear: both;
  }
  .small-block-grid-6 > li {
    width: 16.6666666667%;
    list-style: none;
  }
  .small-block-grid-6 > li:nth-of-type(1n) {
    clear: none;
  }
  .small-block-grid-6 > li:nth-of-type(6n+1) {
    clear: both;
  }
  .small-block-grid-7 > li {
    width: 14.2857142857%;
    list-style: none;
  }
  .small-block-grid-7 > li:nth-of-type(1n) {
    clear: none;
  }
  .small-block-grid-7 > li:nth-of-type(7n+1) {
    clear: both;
  }
  .small-block-grid-8 > li {
    width: 12.5%;
    list-style: none;
  }
  .small-block-grid-8 > li:nth-of-type(1n) {
    clear: none;
  }
  .small-block-grid-8 > li:nth-of-type(8n+1) {
    clear: both;
  }
  .small-block-grid-9 > li {
    width: 11.1111111111%;
    list-style: none;
  }
  .small-block-grid-9 > li:nth-of-type(1n) {
    clear: none;
  }
  .small-block-grid-9 > li:nth-of-type(9n+1) {
    clear: both;
  }
  .small-block-grid-10 > li {
    width: 10%;
    list-style: none;
  }
  .small-block-grid-10 > li:nth-of-type(1n) {
    clear: none;
  }
  .small-block-grid-10 > li:nth-of-type(10n+1) {
    clear: both;
  }
  .small-block-grid-11 > li {
    width: 9.0909090909%;
    list-style: none;
  }
  .small-block-grid-11 > li:nth-of-type(1n) {
    clear: none;
  }
  .small-block-grid-11 > li:nth-of-type(11n+1) {
    clear: both;
  }
  .small-block-grid-12 > li {
    width: 8.3333333333%;
    list-style: none;
  }
  .small-block-grid-12 > li:nth-of-type(1n) {
    clear: none;
  }
  .small-block-grid-12 > li:nth-of-type(12n+1) {
    clear: both;
  }
}
@media only screen and (min-width:30em) {
  .xsmall-block-grid-1 > li {
    width: 100%;
    list-style: none;
  }
  .xsmall-block-grid-1 > li:nth-of-type(1n) {
    clear: none;
  }
  .xsmall-block-grid-1 > li:nth-of-type(1n+1) {
    clear: both;
  }
  .xsmall-block-grid-2 > li {
    width: 50%;
    list-style: none;
  }
  .xsmall-block-grid-2 > li:nth-of-type(1n) {
    clear: none;
  }
  .xsmall-block-grid-2 > li:nth-of-type(2n+1) {
    clear: both;
  }
  .xsmall-block-grid-3 > li {
    width: 33.3333333333%;
    list-style: none;
  }
  .xsmall-block-grid-3 > li:nth-of-type(1n) {
    clear: none;
  }
  .xsmall-block-grid-3 > li:nth-of-type(3n+1) {
    clear: both;
  }
  .xsmall-block-grid-4 > li {
    width: 25%;
    list-style: none;
  }
  .xsmall-block-grid-4 > li:nth-of-type(1n) {
    clear: none;
  }
  .xsmall-block-grid-4 > li:nth-of-type(4n+1) {
    clear: both;
  }
  .xsmall-block-grid-5 > li {
    width: 20%;
    list-style: none;
  }
  .xsmall-block-grid-5 > li:nth-of-type(1n) {
    clear: none;
  }
  .xsmall-block-grid-5 > li:nth-of-type(5n+1) {
    clear: both;
  }
  .xsmall-block-grid-6 > li {
    width: 16.6666666667%;
    list-style: none;
  }
  .xsmall-block-grid-6 > li:nth-of-type(1n) {
    clear: none;
  }
  .xsmall-block-grid-6 > li:nth-of-type(6n+1) {
    clear: both;
  }
  .xsmall-block-grid-7 > li {
    width: 14.2857142857%;
    list-style: none;
  }
  .xsmall-block-grid-7 > li:nth-of-type(1n) {
    clear: none;
  }
  .xsmall-block-grid-7 > li:nth-of-type(7n+1) {
    clear: both;
  }
  .xsmall-block-grid-8 > li {
    width: 12.5%;
    list-style: none;
  }
  .xsmall-block-grid-8 > li:nth-of-type(1n) {
    clear: none;
  }
  .xsmall-block-grid-8 > li:nth-of-type(8n+1) {
    clear: both;
  }
  .xsmall-block-grid-9 > li {
    width: 11.1111111111%;
    list-style: none;
  }
  .xsmall-block-grid-9 > li:nth-of-type(1n) {
    clear: none;
  }
  .xsmall-block-grid-9 > li:nth-of-type(9n+1) {
    clear: both;
  }
  .xsmall-block-grid-10 > li {
    width: 10%;
    list-style: none;
  }
  .xsmall-block-grid-10 > li:nth-of-type(1n) {
    clear: none;
  }
  .xsmall-block-grid-10 > li:nth-of-type(10n+1) {
    clear: both;
  }
  .xsmall-block-grid-11 > li {
    width: 9.0909090909%;
    list-style: none;
  }
  .xsmall-block-grid-11 > li:nth-of-type(1n) {
    clear: none;
  }
  .xsmall-block-grid-11 > li:nth-of-type(11n+1) {
    clear: both;
  }
  .xsmall-block-grid-12 > li {
    width: 8.3333333333%;
    list-style: none;
  }
  .xsmall-block-grid-12 > li:nth-of-type(1n) {
    clear: none;
  }
  .xsmall-block-grid-12 > li:nth-of-type(12n+1) {
    clear: both;
  }
}
@media only screen and (min-width:40.01em) {
  .medium-block-grid-1 > li {
    width: 100%;
    list-style: none;
  }
  .medium-block-grid-1 > li:nth-of-type(1n) {
    clear: none;
  }
  .medium-block-grid-1 > li:nth-of-type(1n+1) {
    clear: both;
  }
  .medium-block-grid-2 > li {
    width: 50%;
    list-style: none;
  }
  .medium-block-grid-2 > li:nth-of-type(1n) {
    clear: none;
  }
  .medium-block-grid-2 > li:nth-of-type(2n+1) {
    clear: both;
  }
  .medium-block-grid-3 > li {
    width: 33.3333333333%;
    list-style: none;
  }
  .medium-block-grid-3 > li:nth-of-type(1n) {
    clear: none;
  }
  .medium-block-grid-3 > li:nth-of-type(3n+1) {
    clear: both;
  }
  .medium-block-grid-4 > li {
    width: 25%;
    list-style: none;
  }
  .medium-block-grid-4 > li:nth-of-type(1n) {
    clear: none;
  }
  .medium-block-grid-4 > li:nth-of-type(4n+1) {
    clear: both;
  }
  .medium-block-grid-5 > li {
    width: 20%;
    list-style: none;
  }
  .medium-block-grid-5 > li:nth-of-type(1n) {
    clear: none;
  }
  .medium-block-grid-5 > li:nth-of-type(5n+1) {
    clear: both;
  }
  .medium-block-grid-6 > li {
    width: 16.6666666667%;
    list-style: none;
  }
  .medium-block-grid-6 > li:nth-of-type(1n) {
    clear: none;
  }
  .medium-block-grid-6 > li:nth-of-type(6n+1) {
    clear: both;
  }
  .medium-block-grid-7 > li {
    width: 14.2857142857%;
    list-style: none;
  }
  .medium-block-grid-7 > li:nth-of-type(1n) {
    clear: none;
  }
  .medium-block-grid-7 > li:nth-of-type(7n+1) {
    clear: both;
  }
  .medium-block-grid-8 > li {
    width: 12.5%;
    list-style: none;
  }
  .medium-block-grid-8 > li:nth-of-type(1n) {
    clear: none;
  }
  .medium-block-grid-8 > li:nth-of-type(8n+1) {
    clear: both;
  }
  .medium-block-grid-9 > li {
    width: 11.1111111111%;
    list-style: none;
  }
  .medium-block-grid-9 > li:nth-of-type(1n) {
    clear: none;
  }
  .medium-block-grid-9 > li:nth-of-type(9n+1) {
    clear: both;
  }
  .medium-block-grid-10 > li {
    width: 10%;
    list-style: none;
  }
  .medium-block-grid-10 > li:nth-of-type(1n) {
    clear: none;
  }
  .medium-block-grid-10 > li:nth-of-type(10n+1) {
    clear: both;
  }
  .medium-block-grid-11 > li {
    width: 9.0909090909%;
    list-style: none;
  }
  .medium-block-grid-11 > li:nth-of-type(1n) {
    clear: none;
  }
  .medium-block-grid-11 > li:nth-of-type(11n+1) {
    clear: both;
  }
  .medium-block-grid-12 > li {
    width: 8.3333333333%;
    list-style: none;
  }
  .medium-block-grid-12 > li:nth-of-type(1n) {
    clear: none;
  }
  .medium-block-grid-12 > li:nth-of-type(12n+1) {
    clear: both;
  }
}
@media only screen and (min-width:45.01em) {
  .xmedium-block-grid-1 > li {
    width: 100%;
    list-style: none;
  }
  .xmedium-block-grid-1 > li:nth-of-type(1n) {
    clear: none;
  }
  .xmedium-block-grid-1 > li:nth-of-type(1n+1) {
    clear: both;
  }
  .xmedium-block-grid-2 > li {
    width: 50%;
    list-style: none;
  }
  .xmedium-block-grid-2 > li:nth-of-type(1n) {
    clear: none;
  }
  .xmedium-block-grid-2 > li:nth-of-type(2n+1) {
    clear: both;
  }
  .xmedium-block-grid-3 > li {
    width: 33.3333333333%;
    list-style: none;
  }
  .xmedium-block-grid-3 > li:nth-of-type(1n) {
    clear: none;
  }
  .xmedium-block-grid-3 > li:nth-of-type(3n+1) {
    clear: both;
  }
  .xmedium-block-grid-4 > li {
    width: 25%;
    list-style: none;
  }
  .xmedium-block-grid-4 > li:nth-of-type(1n) {
    clear: none;
  }
  .xmedium-block-grid-4 > li:nth-of-type(4n+1) {
    clear: both;
  }
  .xmedium-block-grid-5 > li {
    width: 20%;
    list-style: none;
  }
  .xmedium-block-grid-5 > li:nth-of-type(1n) {
    clear: none;
  }
  .xmedium-block-grid-5 > li:nth-of-type(5n+1) {
    clear: both;
  }
  .xmedium-block-grid-6 > li {
    width: 16.6666666667%;
    list-style: none;
  }
  .xmedium-block-grid-6 > li:nth-of-type(1n) {
    clear: none;
  }
  .xmedium-block-grid-6 > li:nth-of-type(6n+1) {
    clear: both;
  }
  .xmedium-block-grid-7 > li {
    width: 14.2857142857%;
    list-style: none;
  }
  .xmedium-block-grid-7 > li:nth-of-type(1n) {
    clear: none;
  }
  .xmedium-block-grid-7 > li:nth-of-type(7n+1) {
    clear: both;
  }
  .xmedium-block-grid-8 > li {
    width: 12.5%;
    list-style: none;
  }
  .xmedium-block-grid-8 > li:nth-of-type(1n) {
    clear: none;
  }
  .xmedium-block-grid-8 > li:nth-of-type(8n+1) {
    clear: both;
  }
  .xmedium-block-grid-9 > li {
    width: 11.1111111111%;
    list-style: none;
  }
  .xmedium-block-grid-9 > li:nth-of-type(1n) {
    clear: none;
  }
  .xmedium-block-grid-9 > li:nth-of-type(9n+1) {
    clear: both;
  }
  .xmedium-block-grid-10 > li {
    width: 10%;
    list-style: none;
  }
  .xmedium-block-grid-10 > li:nth-of-type(1n) {
    clear: none;
  }
  .xmedium-block-grid-10 > li:nth-of-type(10n+1) {
    clear: both;
  }
  .xmedium-block-grid-11 > li {
    width: 9.0909090909%;
    list-style: none;
  }
  .xmedium-block-grid-11 > li:nth-of-type(1n) {
    clear: none;
  }
  .xmedium-block-grid-11 > li:nth-of-type(11n+1) {
    clear: both;
  }
  .xmedium-block-grid-12 > li {
    width: 8.3333333333%;
    list-style: none;
  }
  .xmedium-block-grid-12 > li:nth-of-type(1n) {
    clear: none;
  }
  .xmedium-block-grid-12 > li:nth-of-type(12n+1) {
    clear: both;
  }
}
@media only screen and (min-width:50.01em) {
  .xxmedium-block-grid-1 > li {
    width: 100%;
    list-style: none;
  }
  .xxmedium-block-grid-1 > li:nth-of-type(1n) {
    clear: none;
  }
  .xxmedium-block-grid-1 > li:nth-of-type(1n+1) {
    clear: both;
  }
  .xxmedium-block-grid-2 > li {
    width: 50%;
    list-style: none;
  }
  .xxmedium-block-grid-2 > li:nth-of-type(1n) {
    clear: none;
  }
  .xxmedium-block-grid-2 > li:nth-of-type(2n+1) {
    clear: both;
  }
  .xxmedium-block-grid-3 > li {
    width: 33.3333333333%;
    list-style: none;
  }
  .xxmedium-block-grid-3 > li:nth-of-type(1n) {
    clear: none;
  }
  .xxmedium-block-grid-3 > li:nth-of-type(3n+1) {
    clear: both;
  }
  .xxmedium-block-grid-4 > li {
    width: 25%;
    list-style: none;
  }
  .xxmedium-block-grid-4 > li:nth-of-type(1n) {
    clear: none;
  }
  .xxmedium-block-grid-4 > li:nth-of-type(4n+1) {
    clear: both;
  }
  .xxmedium-block-grid-5 > li {
    width: 20%;
    list-style: none;
  }
  .xxmedium-block-grid-5 > li:nth-of-type(1n) {
    clear: none;
  }
  .xxmedium-block-grid-5 > li:nth-of-type(5n+1) {
    clear: both;
  }
  .xxmedium-block-grid-6 > li {
    width: 16.6666666667%;
    list-style: none;
  }
  .xxmedium-block-grid-6 > li:nth-of-type(1n) {
    clear: none;
  }
  .xxmedium-block-grid-6 > li:nth-of-type(6n+1) {
    clear: both;
  }
  .xxmedium-block-grid-7 > li {
    width: 14.2857142857%;
    list-style: none;
  }
  .xxmedium-block-grid-7 > li:nth-of-type(1n) {
    clear: none;
  }
  .xxmedium-block-grid-7 > li:nth-of-type(7n+1) {
    clear: both;
  }
  .xxmedium-block-grid-8 > li {
    width: 12.5%;
    list-style: none;
  }
  .xxmedium-block-grid-8 > li:nth-of-type(1n) {
    clear: none;
  }
  .xxmedium-block-grid-8 > li:nth-of-type(8n+1) {
    clear: both;
  }
  .xxmedium-block-grid-9 > li {
    width: 11.1111111111%;
    list-style: none;
  }
  .xxmedium-block-grid-9 > li:nth-of-type(1n) {
    clear: none;
  }
  .xxmedium-block-grid-9 > li:nth-of-type(9n+1) {
    clear: both;
  }
  .xxmedium-block-grid-10 > li {
    width: 10%;
    list-style: none;
  }
  .xxmedium-block-grid-10 > li:nth-of-type(1n) {
    clear: none;
  }
  .xxmedium-block-grid-10 > li:nth-of-type(10n+1) {
    clear: both;
  }
  .xxmedium-block-grid-11 > li {
    width: 9.0909090909%;
    list-style: none;
  }
  .xxmedium-block-grid-11 > li:nth-of-type(1n) {
    clear: none;
  }
  .xxmedium-block-grid-11 > li:nth-of-type(11n+1) {
    clear: both;
  }
  .xxmedium-block-grid-12 > li {
    width: 8.3333333333%;
    list-style: none;
  }
  .xxmedium-block-grid-12 > li:nth-of-type(1n) {
    clear: none;
  }
  .xxmedium-block-grid-12 > li:nth-of-type(12n+1) {
    clear: both;
  }
}
@media only screen and (min-width:64em) {
  .large-block-grid-1 > li {
    width: 100%;
    list-style: none;
  }
  .large-block-grid-1 > li:nth-of-type(1n) {
    clear: none;
  }
  .large-block-grid-1 > li:nth-of-type(1n+1) {
    clear: both;
  }
  .large-block-grid-2 > li {
    width: 50%;
    list-style: none;
  }
  .large-block-grid-2 > li:nth-of-type(1n) {
    clear: none;
  }
  .large-block-grid-2 > li:nth-of-type(2n+1) {
    clear: both;
  }
  .large-block-grid-3 > li {
    width: 33.3333333333%;
    list-style: none;
  }
  .large-block-grid-3 > li:nth-of-type(1n) {
    clear: none;
  }
  .large-block-grid-3 > li:nth-of-type(3n+1) {
    clear: both;
  }
  .large-block-grid-4 > li {
    width: 25%;
    list-style: none;
  }
  .large-block-grid-4 > li:nth-of-type(1n) {
    clear: none;
  }
  .large-block-grid-4 > li:nth-of-type(4n+1) {
    clear: both;
  }
  .large-block-grid-5 > li {
    width: 20%;
    list-style: none;
  }
  .large-block-grid-5 > li:nth-of-type(1n) {
    clear: none;
  }
  .large-block-grid-5 > li:nth-of-type(5n+1) {
    clear: both;
  }
  .large-block-grid-6 > li {
    width: 16.6666666667%;
    list-style: none;
  }
  .large-block-grid-6 > li:nth-of-type(1n) {
    clear: none;
  }
  .large-block-grid-6 > li:nth-of-type(6n+1) {
    clear: both;
  }
  .large-block-grid-7 > li {
    width: 14.2857142857%;
    list-style: none;
  }
  .large-block-grid-7 > li:nth-of-type(1n) {
    clear: none;
  }
  .large-block-grid-7 > li:nth-of-type(7n+1) {
    clear: both;
  }
  .large-block-grid-8 > li {
    width: 12.5%;
    list-style: none;
  }
  .large-block-grid-8 > li:nth-of-type(1n) {
    clear: none;
  }
  .large-block-grid-8 > li:nth-of-type(8n+1) {
    clear: both;
  }
  .large-block-grid-9 > li {
    width: 11.1111111111%;
    list-style: none;
  }
  .large-block-grid-9 > li:nth-of-type(1n) {
    clear: none;
  }
  .large-block-grid-9 > li:nth-of-type(9n+1) {
    clear: both;
  }
  .large-block-grid-10 > li {
    width: 10%;
    list-style: none;
  }
  .large-block-grid-10 > li:nth-of-type(1n) {
    clear: none;
  }
  .large-block-grid-10 > li:nth-of-type(10n+1) {
    clear: both;
  }
  .large-block-grid-11 > li {
    width: 9.0909090909%;
    list-style: none;
  }
  .large-block-grid-11 > li:nth-of-type(1n) {
    clear: none;
  }
  .large-block-grid-11 > li:nth-of-type(11n+1) {
    clear: both;
  }
  .large-block-grid-12 > li {
    width: 8.3333333333%;
    list-style: none;
  }
  .large-block-grid-12 > li:nth-of-type(1n) {
    clear: none;
  }
  .large-block-grid-12 > li:nth-of-type(12n+1) {
    clear: both;
  }
}
@media only screen and (min-width:75.01em) {
  .xlarge-block-grid-1 > li {
    width: 100%;
    list-style: none;
  }
  .xlarge-block-grid-1 > li:nth-of-type(1n) {
    clear: none;
  }
  .xlarge-block-grid-1 > li:nth-of-type(1n+1) {
    clear: both;
  }
  .xlarge-block-grid-2 > li {
    width: 50%;
    list-style: none;
  }
  .xlarge-block-grid-2 > li:nth-of-type(1n) {
    clear: none;
  }
  .xlarge-block-grid-2 > li:nth-of-type(2n+1) {
    clear: both;
  }
  .xlarge-block-grid-3 > li {
    width: 33.3333333333%;
    list-style: none;
  }
  .xlarge-block-grid-3 > li:nth-of-type(1n) {
    clear: none;
  }
  .xlarge-block-grid-3 > li:nth-of-type(3n+1) {
    clear: both;
  }
  .xlarge-block-grid-4 > li {
    width: 25%;
    list-style: none;
  }
  .xlarge-block-grid-4 > li:nth-of-type(1n) {
    clear: none;
  }
  .xlarge-block-grid-4 > li:nth-of-type(4n+1) {
    clear: both;
  }
  .xlarge-block-grid-5 > li {
    width: 20%;
    list-style: none;
  }
  .xlarge-block-grid-5 > li:nth-of-type(1n) {
    clear: none;
  }
  .xlarge-block-grid-5 > li:nth-of-type(5n+1) {
    clear: both;
  }
  .xlarge-block-grid-6 > li {
    width: 16.6666666667%;
    list-style: none;
  }
  .xlarge-block-grid-6 > li:nth-of-type(1n) {
    clear: none;
  }
  .xlarge-block-grid-6 > li:nth-of-type(6n+1) {
    clear: both;
  }
  .xlarge-block-grid-7 > li {
    width: 14.2857142857%;
    list-style: none;
  }
  .xlarge-block-grid-7 > li:nth-of-type(1n) {
    clear: none;
  }
  .xlarge-block-grid-7 > li:nth-of-type(7n+1) {
    clear: both;
  }
  .xlarge-block-grid-8 > li {
    width: 12.5%;
    list-style: none;
  }
  .xlarge-block-grid-8 > li:nth-of-type(1n) {
    clear: none;
  }
  .xlarge-block-grid-8 > li:nth-of-type(8n+1) {
    clear: both;
  }
  .xlarge-block-grid-9 > li {
    width: 11.1111111111%;
    list-style: none;
  }
  .xlarge-block-grid-9 > li:nth-of-type(1n) {
    clear: none;
  }
  .xlarge-block-grid-9 > li:nth-of-type(9n+1) {
    clear: both;
  }
  .xlarge-block-grid-10 > li {
    width: 10%;
    list-style: none;
  }
  .xlarge-block-grid-10 > li:nth-of-type(1n) {
    clear: none;
  }
  .xlarge-block-grid-10 > li:nth-of-type(10n+1) {
    clear: both;
  }
  .xlarge-block-grid-11 > li {
    width: 9.0909090909%;
    list-style: none;
  }
  .xlarge-block-grid-11 > li:nth-of-type(1n) {
    clear: none;
  }
  .xlarge-block-grid-11 > li:nth-of-type(11n+1) {
    clear: both;
  }
  .xlarge-block-grid-12 > li {
    width: 8.3333333333%;
    list-style: none;
  }
  .xlarge-block-grid-12 > li:nth-of-type(1n) {
    clear: none;
  }
  .xlarge-block-grid-12 > li:nth-of-type(12n+1) {
    clear: both;
  }
}
@media only screen and (min-width:81.251em) {
  .xxlarge-block-grid-1 > li {
    width: 100%;
    list-style: none;
  }
  .xxlarge-block-grid-1 > li:nth-of-type(1n) {
    clear: none;
  }
  .xxlarge-block-grid-1 > li:nth-of-type(1n+1) {
    clear: both;
  }
  .xxlarge-block-grid-2 > li {
    width: 50%;
    list-style: none;
  }
  .xxlarge-block-grid-2 > li:nth-of-type(1n) {
    clear: none;
  }
  .xxlarge-block-grid-2 > li:nth-of-type(2n+1) {
    clear: both;
  }
  .xxlarge-block-grid-3 > li {
    width: 33.3333333333%;
    list-style: none;
  }
  .xxlarge-block-grid-3 > li:nth-of-type(1n) {
    clear: none;
  }
  .xxlarge-block-grid-3 > li:nth-of-type(3n+1) {
    clear: both;
  }
  .xxlarge-block-grid-4 > li {
    width: 25%;
    list-style: none;
  }
  .xxlarge-block-grid-4 > li:nth-of-type(1n) {
    clear: none;
  }
  .xxlarge-block-grid-4 > li:nth-of-type(4n+1) {
    clear: both;
  }
  .xxlarge-block-grid-5 > li {
    width: 20%;
    list-style: none;
  }
  .xxlarge-block-grid-5 > li:nth-of-type(1n) {
    clear: none;
  }
  .xxlarge-block-grid-5 > li:nth-of-type(5n+1) {
    clear: both;
  }
  .xxlarge-block-grid-6 > li {
    width: 16.6666666667%;
    list-style: none;
  }
  .xxlarge-block-grid-6 > li:nth-of-type(1n) {
    clear: none;
  }
  .xxlarge-block-grid-6 > li:nth-of-type(6n+1) {
    clear: both;
  }
  .xxlarge-block-grid-7 > li {
    width: 14.2857142857%;
    list-style: none;
  }
  .xxlarge-block-grid-7 > li:nth-of-type(1n) {
    clear: none;
  }
  .xxlarge-block-grid-7 > li:nth-of-type(7n+1) {
    clear: both;
  }
  .xxlarge-block-grid-8 > li {
    width: 12.5%;
    list-style: none;
  }
  .xxlarge-block-grid-8 > li:nth-of-type(1n) {
    clear: none;
  }
  .xxlarge-block-grid-8 > li:nth-of-type(8n+1) {
    clear: both;
  }
  .xxlarge-block-grid-9 > li {
    width: 11.1111111111%;
    list-style: none;
  }
  .xxlarge-block-grid-9 > li:nth-of-type(1n) {
    clear: none;
  }
  .xxlarge-block-grid-9 > li:nth-of-type(9n+1) {
    clear: both;
  }
  .xxlarge-block-grid-10 > li {
    width: 10%;
    list-style: none;
  }
  .xxlarge-block-grid-10 > li:nth-of-type(1n) {
    clear: none;
  }
  .xxlarge-block-grid-10 > li:nth-of-type(10n+1) {
    clear: both;
  }
  .xxlarge-block-grid-11 > li {
    width: 9.0909090909%;
    list-style: none;
  }
  .xxlarge-block-grid-11 > li:nth-of-type(1n) {
    clear: none;
  }
  .xxlarge-block-grid-11 > li:nth-of-type(11n+1) {
    clear: both;
  }
  .xxlarge-block-grid-12 > li {
    width: 8.3333333333%;
    list-style: none;
  }
  .xxlarge-block-grid-12 > li:nth-of-type(1n) {
    clear: none;
  }
  .xxlarge-block-grid-12 > li:nth-of-type(12n+1) {
    clear: both;
  }
}
.row {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  margin-top: 0;
  margin-bottom: 0;
  max-width: 86.25rem;
}
.row:before, .row:after {
  content: " ";
  display: table;
}
.row:after {
  clear: both;
}
.row.collapse > .column,
.row.collapse > .columns {
  padding-left: 0;
  padding-right: 0;
}
.row.collapse .row {
  margin-left: 0;
  margin-right: 0;
}
.row .row {
  width: auto;
  margin-left: -1.5rem;
  margin-right: -1.5rem;
  margin-top: 0;
  margin-bottom: 0;
  max-width: none;
}
.row .row:before, .row .row:after {
  content: " ";
  display: table;
}
.row .row:after {
  clear: both;
}
.row .row.collapse {
  width: auto;
  margin: 0;
  max-width: none;
}
.row .row.collapse:before, .row .row.collapse:after {
  content: " ";
  display: table;
}
.row .row.collapse:after {
  clear: both;
}

.column,
.columns {
  padding-left: 1.5rem;
  padding-right: 1.5rem;
  width: 100%;
  float: left;
}

[class*=column] + [class*=column]:last-child {
  float: right;
}

[class*=column] + [class*=column].end {
  float: left;
}

@media only screen {
  .column,
  .columns {
    position: relative;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
    float: left;
  }
  .small-1 {
    width: 8.3333333333%;
  }
  .small-2 {
    width: 16.6666666667%;
  }
  .small-3 {
    width: 25%;
  }
  .small-4 {
    width: 33.3333333333%;
  }
  .small-5 {
    width: 41.6666666667%;
  }
  .small-6 {
    width: 50%;
  }
  .small-7 {
    width: 58.3333333333%;
  }
  .small-8 {
    width: 66.6666666667%;
  }
  .small-9 {
    width: 75%;
  }
  .small-10 {
    width: 83.3333333333%;
  }
  .small-11 {
    width: 91.6666666667%;
  }
  .small-12 {
    width: 100%;
  }
  .small-offset-0 {
    margin-left: 0% !important;
  }
  .small-offset-1 {
    margin-left: 8.3333333333% !important;
  }
  .small-offset-2 {
    margin-left: 16.6666666667% !important;
  }
  .small-offset-3 {
    margin-left: 25% !important;
  }
  .small-offset-4 {
    margin-left: 33.3333333333% !important;
  }
  .small-offset-5 {
    margin-left: 41.6666666667% !important;
  }
  .small-offset-6 {
    margin-left: 50% !important;
  }
  .small-offset-7 {
    margin-left: 58.3333333333% !important;
  }
  .small-offset-8 {
    margin-left: 66.6666666667% !important;
  }
  .small-offset-9 {
    margin-left: 75% !important;
  }
  .small-offset-10 {
    margin-left: 83.3333333333% !important;
  }
  .small-offset-11 {
    margin-left: 91.6666666667% !important;
  }
  .small-reset-order {
    margin-left: 0;
    margin-right: 0;
    left: auto;
    right: auto;
    float: left;
  }
  .column.small-centered,
  .columns.small-centered {
    margin-left: auto;
    margin-right: auto;
    float: none;
  }
  .column.small-uncentered,
  .columns.small-uncentered {
    margin-left: 0;
    margin-right: 0;
    float: left;
  }
  .column.small-centered:last-child,
  .columns.small-centered:last-child {
    float: none;
  }
  .column.small-uncentered:last-child,
  .columns.small-uncentered:last-child {
    float: left;
  }
  .column.small-uncentered.opposite,
  .columns.small-uncentered.opposite {
    float: right;
  }
}
@media only screen and (min-width:30em) {
  .column,
  .columns {
    position: relative;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
    float: left;
  }
  .xsmall-1 {
    width: 8.3333333333%;
  }
  .xsmall-2 {
    width: 16.6666666667%;
  }
  .xsmall-3 {
    width: 25%;
  }
  .xsmall-4 {
    width: 33.3333333333%;
  }
  .xsmall-5 {
    width: 41.6666666667%;
  }
  .xsmall-6 {
    width: 50%;
  }
  .xsmall-7 {
    width: 58.3333333333%;
  }
  .xsmall-8 {
    width: 66.6666666667%;
  }
  .xsmall-9 {
    width: 75%;
  }
  .xsmall-10 {
    width: 83.3333333333%;
  }
  .xsmall-11 {
    width: 91.6666666667%;
  }
  .xsmall-12 {
    width: 100%;
  }
  .xsmall-offset-0 {
    margin-left: 0% !important;
  }
  .xsmall-offset-1 {
    margin-left: 8.3333333333% !important;
  }
  .xsmall-offset-2 {
    margin-left: 16.6666666667% !important;
  }
  .xsmall-offset-3 {
    margin-left: 25% !important;
  }
  .xsmall-offset-4 {
    margin-left: 33.3333333333% !important;
  }
  .xsmall-offset-5 {
    margin-left: 41.6666666667% !important;
  }
  .xsmall-offset-6 {
    margin-left: 50% !important;
  }
  .xsmall-offset-7 {
    margin-left: 58.3333333333% !important;
  }
  .xsmall-offset-8 {
    margin-left: 66.6666666667% !important;
  }
  .xsmall-offset-9 {
    margin-left: 75% !important;
  }
  .xsmall-offset-10 {
    margin-left: 83.3333333333% !important;
  }
  .xsmall-offset-11 {
    margin-left: 91.6666666667% !important;
  }
  .xsmall-reset-order {
    margin-left: 0;
    margin-right: 0;
    left: auto;
    right: auto;
    float: left;
  }
  .column.xsmall-centered,
  .columns.xsmall-centered {
    margin-left: auto;
    margin-right: auto;
    float: none;
  }
  .column.xsmall-uncentered,
  .columns.xsmall-uncentered {
    margin-left: 0;
    margin-right: 0;
    float: left;
  }
  .column.xsmall-centered:last-child,
  .columns.xsmall-centered:last-child {
    float: none;
  }
  .column.xsmall-uncentered:last-child,
  .columns.xsmall-uncentered:last-child {
    float: left;
  }
  .column.xsmall-uncentered.opposite,
  .columns.xsmall-uncentered.opposite {
    float: right;
  }
}
@media only screen and (min-width:40.01em) {
  .column,
  .columns {
    position: relative;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
    float: left;
  }
  .medium-1 {
    width: 8.3333333333%;
  }
  .medium-2 {
    width: 16.6666666667%;
  }
  .medium-3 {
    width: 25%;
  }
  .medium-4 {
    width: 33.3333333333%;
  }
  .medium-5 {
    width: 41.6666666667%;
  }
  .medium-6 {
    width: 50%;
  }
  .medium-7 {
    width: 58.3333333333%;
  }
  .medium-8 {
    width: 66.6666666667%;
  }
  .medium-9 {
    width: 75%;
  }
  .medium-10 {
    width: 83.3333333333%;
  }
  .medium-11 {
    width: 91.6666666667%;
  }
  .medium-12 {
    width: 100%;
  }
  .medium-offset-0 {
    margin-left: 0% !important;
  }
  .medium-offset-1 {
    margin-left: 8.3333333333% !important;
  }
  .medium-offset-2 {
    margin-left: 16.6666666667% !important;
  }
  .medium-offset-3 {
    margin-left: 25% !important;
  }
  .medium-offset-4 {
    margin-left: 33.3333333333% !important;
  }
  .medium-offset-5 {
    margin-left: 41.6666666667% !important;
  }
  .medium-offset-6 {
    margin-left: 50% !important;
  }
  .medium-offset-7 {
    margin-left: 58.3333333333% !important;
  }
  .medium-offset-8 {
    margin-left: 66.6666666667% !important;
  }
  .medium-offset-9 {
    margin-left: 75% !important;
  }
  .medium-offset-10 {
    margin-left: 83.3333333333% !important;
  }
  .medium-offset-11 {
    margin-left: 91.6666666667% !important;
  }
  .medium-reset-order {
    margin-left: 0;
    margin-right: 0;
    left: auto;
    right: auto;
    float: left;
  }
  .column.medium-centered,
  .columns.medium-centered {
    margin-left: auto;
    margin-right: auto;
    float: none;
  }
  .column.medium-uncentered,
  .columns.medium-uncentered {
    margin-left: 0;
    margin-right: 0;
    float: left;
  }
  .column.medium-centered:last-child,
  .columns.medium-centered:last-child {
    float: none;
  }
  .column.medium-uncentered:last-child,
  .columns.medium-uncentered:last-child {
    float: left;
  }
  .column.medium-uncentered.opposite,
  .columns.medium-uncentered.opposite {
    float: right;
  }
}
@media only screen and (min-width:45.01em) {
  .column,
  .columns {
    position: relative;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
    float: left;
  }
  .xmedium-1 {
    width: 8.3333333333%;
  }
  .xmedium-2 {
    width: 16.6666666667%;
  }
  .xmedium-3 {
    width: 25%;
  }
  .xmedium-4 {
    width: 33.3333333333%;
  }
  .xmedium-5 {
    width: 41.6666666667%;
  }
  .xmedium-6 {
    width: 50%;
  }
  .xmedium-7 {
    width: 58.3333333333%;
  }
  .xmedium-8 {
    width: 66.6666666667%;
  }
  .xmedium-9 {
    width: 75%;
  }
  .xmedium-10 {
    width: 83.3333333333%;
  }
  .xmedium-11 {
    width: 91.6666666667%;
  }
  .xmedium-12 {
    width: 100%;
  }
  .xmedium-offset-0 {
    margin-left: 0% !important;
  }
  .xmedium-offset-1 {
    margin-left: 8.3333333333% !important;
  }
  .xmedium-offset-2 {
    margin-left: 16.6666666667% !important;
  }
  .xmedium-offset-3 {
    margin-left: 25% !important;
  }
  .xmedium-offset-4 {
    margin-left: 33.3333333333% !important;
  }
  .xmedium-offset-5 {
    margin-left: 41.6666666667% !important;
  }
  .xmedium-offset-6 {
    margin-left: 50% !important;
  }
  .xmedium-offset-7 {
    margin-left: 58.3333333333% !important;
  }
  .xmedium-offset-8 {
    margin-left: 66.6666666667% !important;
  }
  .xmedium-offset-9 {
    margin-left: 75% !important;
  }
  .xmedium-offset-10 {
    margin-left: 83.3333333333% !important;
  }
  .xmedium-offset-11 {
    margin-left: 91.6666666667% !important;
  }
  .xmedium-reset-order {
    margin-left: 0;
    margin-right: 0;
    left: auto;
    right: auto;
    float: left;
  }
  .column.xmedium-centered,
  .columns.xmedium-centered {
    margin-left: auto;
    margin-right: auto;
    float: none;
  }
  .column.xmedium-uncentered,
  .columns.xmedium-uncentered {
    margin-left: 0;
    margin-right: 0;
    float: left;
  }
  .column.xmedium-centered:last-child,
  .columns.xmedium-centered:last-child {
    float: none;
  }
  .column.xmedium-uncentered:last-child,
  .columns.xmedium-uncentered:last-child {
    float: left;
  }
  .column.xmedium-uncentered.opposite,
  .columns.xmedium-uncentered.opposite {
    float: right;
  }
}
@media only screen and (min-width:50.01em) {
  .column,
  .columns {
    position: relative;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
    float: left;
  }
  .xxmedium-1 {
    width: 8.3333333333%;
  }
  .xxmedium-2 {
    width: 16.6666666667%;
  }
  .xxmedium-3 {
    width: 25%;
  }
  .xxmedium-4 {
    width: 33.3333333333%;
  }
  .xxmedium-5 {
    width: 41.6666666667%;
  }
  .xxmedium-6 {
    width: 50%;
  }
  .xxmedium-7 {
    width: 58.3333333333%;
  }
  .xxmedium-8 {
    width: 66.6666666667%;
  }
  .xxmedium-9 {
    width: 75%;
  }
  .xxmedium-10 {
    width: 83.3333333333%;
  }
  .xxmedium-11 {
    width: 91.6666666667%;
  }
  .xxmedium-12 {
    width: 100%;
  }
  .xxmedium-offset-0 {
    margin-left: 0% !important;
  }
  .xxmedium-offset-1 {
    margin-left: 8.3333333333% !important;
  }
  .xxmedium-offset-2 {
    margin-left: 16.6666666667% !important;
  }
  .xxmedium-offset-3 {
    margin-left: 25% !important;
  }
  .xxmedium-offset-4 {
    margin-left: 33.3333333333% !important;
  }
  .xxmedium-offset-5 {
    margin-left: 41.6666666667% !important;
  }
  .xxmedium-offset-6 {
    margin-left: 50% !important;
  }
  .xxmedium-offset-7 {
    margin-left: 58.3333333333% !important;
  }
  .xxmedium-offset-8 {
    margin-left: 66.6666666667% !important;
  }
  .xxmedium-offset-9 {
    margin-left: 75% !important;
  }
  .xxmedium-offset-10 {
    margin-left: 83.3333333333% !important;
  }
  .xxmedium-offset-11 {
    margin-left: 91.6666666667% !important;
  }
  .xxmedium-reset-order {
    margin-left: 0;
    margin-right: 0;
    left: auto;
    right: auto;
    float: left;
  }
  .column.xxmedium-centered,
  .columns.xxmedium-centered {
    margin-left: auto;
    margin-right: auto;
    float: none;
  }
  .column.xxmedium-uncentered,
  .columns.xxmedium-uncentered {
    margin-left: 0;
    margin-right: 0;
    float: left;
  }
  .column.xxmedium-centered:last-child,
  .columns.xxmedium-centered:last-child {
    float: none;
  }
  .column.xxmedium-uncentered:last-child,
  .columns.xxmedium-uncentered:last-child {
    float: left;
  }
  .column.xxmedium-uncentered.opposite,
  .columns.xxmedium-uncentered.opposite {
    float: right;
  }
}
@media only screen and (min-width:64em) {
  .column,
  .columns {
    position: relative;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
    float: left;
  }
  .large-1 {
    width: 8.3333333333%;
  }
  .large-2 {
    width: 16.6666666667%;
  }
  .large-3 {
    width: 25%;
  }
  .large-4 {
    width: 33.3333333333%;
  }
  .large-5 {
    width: 41.6666666667%;
  }
  .large-6 {
    width: 50%;
  }
  .large-7 {
    width: 58.3333333333%;
  }
  .large-8 {
    width: 66.6666666667%;
  }
  .large-9 {
    width: 75%;
  }
  .large-10 {
    width: 83.3333333333%;
  }
  .large-11 {
    width: 91.6666666667%;
  }
  .large-12 {
    width: 100%;
  }
  .large-offset-0 {
    margin-left: 0% !important;
  }
  .large-offset-1 {
    margin-left: 8.3333333333% !important;
  }
  .large-offset-2 {
    margin-left: 16.6666666667% !important;
  }
  .large-offset-3 {
    margin-left: 25% !important;
  }
  .large-offset-4 {
    margin-left: 33.3333333333% !important;
  }
  .large-offset-5 {
    margin-left: 41.6666666667% !important;
  }
  .large-offset-6 {
    margin-left: 50% !important;
  }
  .large-offset-7 {
    margin-left: 58.3333333333% !important;
  }
  .large-offset-8 {
    margin-left: 66.6666666667% !important;
  }
  .large-offset-9 {
    margin-left: 75% !important;
  }
  .large-offset-10 {
    margin-left: 83.3333333333% !important;
  }
  .large-offset-11 {
    margin-left: 91.6666666667% !important;
  }
  .large-reset-order {
    margin-left: 0;
    margin-right: 0;
    left: auto;
    right: auto;
    float: left;
  }
  .column.large-centered,
  .columns.large-centered {
    margin-left: auto;
    margin-right: auto;
    float: none;
  }
  .column.large-uncentered,
  .columns.large-uncentered {
    margin-left: 0;
    margin-right: 0;
    float: left;
  }
  .column.large-centered:last-child,
  .columns.large-centered:last-child {
    float: none;
  }
  .column.large-uncentered:last-child,
  .columns.large-uncentered:last-child {
    float: left;
  }
  .column.large-uncentered.opposite,
  .columns.large-uncentered.opposite {
    float: right;
  }
}
@media only screen and (min-width:75.01em) {
  .column,
  .columns {
    position: relative;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
    float: left;
  }
  .xlarge-1 {
    width: 8.3333333333%;
  }
  .xlarge-2 {
    width: 16.6666666667%;
  }
  .xlarge-3 {
    width: 25%;
  }
  .xlarge-4 {
    width: 33.3333333333%;
  }
  .xlarge-5 {
    width: 41.6666666667%;
  }
  .xlarge-6 {
    width: 50%;
  }
  .xlarge-7 {
    width: 58.3333333333%;
  }
  .xlarge-8 {
    width: 66.6666666667%;
  }
  .xlarge-9 {
    width: 75%;
  }
  .xlarge-10 {
    width: 83.3333333333%;
  }
  .xlarge-11 {
    width: 91.6666666667%;
  }
  .xlarge-12 {
    width: 100%;
  }
  .xlarge-offset-0 {
    margin-left: 0% !important;
  }
  .xlarge-offset-1 {
    margin-left: 8.3333333333% !important;
  }
  .xlarge-offset-2 {
    margin-left: 16.6666666667% !important;
  }
  .xlarge-offset-3 {
    margin-left: 25% !important;
  }
  .xlarge-offset-4 {
    margin-left: 33.3333333333% !important;
  }
  .xlarge-offset-5 {
    margin-left: 41.6666666667% !important;
  }
  .xlarge-offset-6 {
    margin-left: 50% !important;
  }
  .xlarge-offset-7 {
    margin-left: 58.3333333333% !important;
  }
  .xlarge-offset-8 {
    margin-left: 66.6666666667% !important;
  }
  .xlarge-offset-9 {
    margin-left: 75% !important;
  }
  .xlarge-offset-10 {
    margin-left: 83.3333333333% !important;
  }
  .xlarge-offset-11 {
    margin-left: 91.6666666667% !important;
  }
  .xlarge-reset-order {
    margin-left: 0;
    margin-right: 0;
    left: auto;
    right: auto;
    float: left;
  }
  .column.xlarge-centered,
  .columns.xlarge-centered {
    margin-left: auto;
    margin-right: auto;
    float: none;
  }
  .column.xlarge-uncentered,
  .columns.xlarge-uncentered {
    margin-left: 0;
    margin-right: 0;
    float: left;
  }
  .column.xlarge-centered:last-child,
  .columns.xlarge-centered:last-child {
    float: none;
  }
  .column.xlarge-uncentered:last-child,
  .columns.xlarge-uncentered:last-child {
    float: left;
  }
  .column.xlarge-uncentered.opposite,
  .columns.xlarge-uncentered.opposite {
    float: right;
  }
}
.block {
  margin: 0px 0px 36px 0px;
}
@media only screen and (min-width:40.01em) {
  .block {
    margin: 0px 0px 36px 0px;
  }
}
@media only screen and (min-width:64em) {
  .block {
    margin: 0px 0px 48px 0px;
  }
}

.container {
  padding: 36px 0px 18px 0px;
}
@media only screen and (min-width:40.01em) {
  .container {
    padding: 36px 0px 18px 0px;
  }
}
@media only screen and (min-width:64em) {
  .container {
    padding: 48px 0px 24px 0px;
  }
}
.container {
  margin: 0px 0px 36px 0px;
}
@media only screen and (min-width:40.01em) {
  .container {
    margin: 0px 0px 36px 0px;
  }
}
@media only screen and (min-width:64em) {
  .container {
    margin: 0px 0px 48px 0px;
  }
}
.container {
  padding-bottom: 24px;
}

.inner-block {
  margin-bottom: 12px;
  margin-top: 0;
}
@media only screen and (min-width:40.01em) {
  .inner-block {
    margin-bottom: 18px;
  }
}

.inner-container {
  padding: 24px 0 12px 0;
}
@media only screen and (min-width:40.01em) {
  .inner-container {
    padding: 24px 0 6px 0;
  }
}
@media only screen and (min-width:64em) {
  .inner-container {
    padding: 30px 0 12px 0;
  }
}

.side-spacing {
  padding: 0px 9px 0px 9px;
}
@media only screen and (min-width:40.01em) {
  .side-spacing {
    padding: 0px 18px 0px 18px;
  }
}
@media only screen and (min-width:64em) {
  .side-spacing {
    padding: 0px 24px 0px 24px;
  }
}

/*
$main-font: 'Roboto Condensed', sans-serif;
$second-font: 'Roboto', sans-serif;
*/
html, body, button, input, select, textarea {
  font-family: "Roboto Condensed", sans-serif;
}

a {
  color: var(--primary-color);
  text-decoration: underline;
  outline: 0;
}
a p {
  color: #000;
}
a:focus {
  outline: 0;
}
a.-skip {
  display: block;
  font-family: "Boldonse", sans-serif;
  font-style: italic;
}
@media only screen and (min-width:50.01em) {
  a.-skip {
    font-size: 1.125em;
    line-height: 1.3333333333em;
  }
}
a.-bold {
  font-weight: 400;
}
@media only screen and (min-width:50.01em) {
  a.-bold {
    font-size: 1.125em;
    line-height: 1.3333333333em;
  }
  a.-bold span {
    font-size: 1em;
    line-height: 1.5em;
  }
}
a.-pad-left {
  padding-left: 12px;
}

html, body {
  color: #000;
  font-family: "Roboto Condensed", sans-serif;
  font-size: 17px;
  font-style: normal;
  line-height: 1.5em;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5 {
  font-family: "Boldonse", sans-serif;
  font-weight: 400;
  margin-top: 0;
  color: #000;
  line-height: 1.4em;
  text-transform: uppercase;
}
h1.section-title, h2.section-title, h3.section-title, h4.section-title, h5.section-title, h6.section-title, .h1.section-title, .h2.section-title, .h3.section-title, .h4.section-title, .h5.section-title {
  text-align: center;
  padding: 2em 0 1.5em;
  font-size: 1.25em;
}

h1, .h1 {
  font-size: 1.75em;
  line-height: 1.2857142857em;
  color: var(--primary-color);
  font-weight: 300;
  margin: 24px 0;
  text-align: center;
}
@media only screen and (min-width:40.01em) {
  h1, .h1 {
    font-size: 1.5em;
    line-height: 1.5em;
  }
}
@media only screen and (min-width:50.01em) {
  h1, .h1 {
    font-size: 1.875em;
    line-height: 1.2em;
  }
}
h1.-mob, .h1.-mob {
  margin: 22px 0;
  font-size: 24px;
}
@media only screen and (min-width:50.01em) {
  h1.-mob, .h1.-mob {
    display: none;
  }
}

h2, .h2 {
  font-size: 1.6875em;
  line-height: 1.3333333333em;
  margin-bottom: 0;
  line-height: 1.4em;
}

h3, .h3 {
  margin: 0;
  text-transform: none;
  font-size: 1.25em;
  line-height: 1.2em;
}

h4, .h4 {
  font-size: 1.5em;
  line-height: 1.5em;
  font-weight: 300;
  text-transform: none;
}

h5, .h5 {
  font-size: 1em;
  line-height: 1.5em;
  margin-bottom: 6px;
}
@media only screen and (min-width:50.01em) {
  h5, .h5 {
    font-size: 1.125em;
    line-height: 1.3333333333em;
  }
}

p {
  font-size: 0.8em;
}
@media only screen and (min-width:40.01em) {
  p {
    font-size: 1em;
  }
}
@media only screen and (min-width:40.01em) {
  p span {
    font-size: 1em;
    line-height: 1.5em;
  }
}

label {
  font-size: 15px;
}

span {
  font-size: 15px;
  outline: 0;
}
span:focus {
  outline: 0;
}

strong {
  font-weight: 700;
}

textarea {
  font-family: "Roboto Condensed", sans-serif;
}

th {
  font-weight: 400;
}

/*atoms*/
.main {
  padding-top: 0;
  position: relative;
  transition: all 0.2s cubic-bezier(0.1, 0.21, 0, 1);
  z-index: 2;
}
.main:before, .main:after {
  content: " ";
  display: table;
}
.main:after {
  clear: both;
}

.page-wrap.active, .app-footer.active {
  display: none;
}
@media only screen and (min-width:50.01em) {
  .page-wrap.active, .app-footer.active {
    display: block;
  }
}

.page-wrap {
  min-height: 100%;
  position: relative;
  margin-bottom: -200px;
}

.page-wrap:after {
  content: "";
  display: block;
}

.app-footer, .page-wrap:after {
  min-height: 200px;
}

.wrapper {
  position: relative;
}
.wrapper {
  margin: 0px 9px 0px 9px;
}
@media only screen and (min-width:40.01em) {
  .wrapper {
    margin: 0px 18px 0px 18px;
  }
}
@media only screen and (min-width:64em) {
  .wrapper {
    margin: 0px 24px 0px 24px;
  }
}
@media only screen and (min-width:40.01em) {
  .wrapper {
    margin: 0px 18px 0px 18px;
  }
}
@media only screen and (min-width:40.01em) and (min-width:40.01em) {
  .wrapper {
    margin: 0px 36px 0px 36px;
  }
}
@media only screen and (min-width:40.01em) and (min-width:64em) {
  .wrapper {
    margin: 0px 48px 0px 48px;
  }
}
@media (min-width: 85.25rem) {
  .wrapper {
    margin: 0 auto;
    padding: 0;
    max-width: 81.25rem;
  }
}
.wrapper.-no-margin {
  margin: 0;
}
@media only screen and (min-width:50.01em) {
  .wrapper.-no-margin {
    margin: 0 36px;
  }
}
@media only screen and (min-width:64em) {
  .wrapper.-no-margin {
    margin: 0 48px;
  }
}
.wrapper > .row {
  max-width: none;
  width: auto;
}
.wrapper > .row {
  margin: 0px -9px 0px -9px;
}
@media only screen and (min-width:40.01em) {
  .wrapper > .row {
    margin: 0px -18px 0px -18px;
  }
}
@media only screen and (min-width:64em) {
  .wrapper > .row {
    margin: 0px -24px 0px -24px;
  }
}

/*.large-6.column {
    @media only screen and (min-width:75.01em) {
        padding:0;
    }
}

.large-6.column + .large-6.column {
    @media only screen and (min-width:75.01em) {
        padding-left:3rem;
    }
}*/
.row.-flush {
  max-width: none;
  width: auto;
}
.row.-flush {
  margin: 0px -9px 0px -9px;
}
@media only screen and (min-width:40.01em) {
  .row.-flush {
    margin: 0px -18px 0px -18px;
  }
}
@media only screen and (min-width:64em) {
  .row.-flush {
    margin: 0px -24px 0px -24px;
  }
}
.row.-reduced {
  max-width: none;
  width: auto;
}
.row.-reduced {
  margin: 0px -4.5px 0px -4.5px;
}
@media only screen and (min-width:40.01em) {
  .row.-reduced {
    margin: 0px -9px 0px -9px;
  }
}
@media only screen and (min-width:64em) {
  .row.-reduced {
    margin: 0px -12px 0px -12px;
  }
}
.row.-no-pad .column {
  padding-bottom: 0;
}
@media only screen and (min-width:40.01em) {
  .row.-no-pad .column {
    padding-bottom: 0;
  }
}
.row .row {
  margin: 0px -4.5px 0px -4.5px;
}
@media only screen and (min-width:40.01em) {
  .row .row {
    margin: 0px -9px 0px -9px;
  }
}
@media only screen and (min-width:64em) {
  .row .row {
    margin: 0px -12px 0px -12px;
  }
}
.row .row .column {
  padding: 0px 4.5px 0px 4.5px;
}
@media only screen and (min-width:40.01em) {
  .row .row .column {
    padding: 0px 9px 0px 9px;
  }
}
@media only screen and (min-width:64em) {
  .row .row .column {
    padding: 0px 12px 0px 12px;
  }
}
@media only screen and (min-width:64em) {
  .row .row .column {
    padding-bottom: 6px;
  }
}
.row .row.-no-pad .column {
  padding-bottom: 0;
}
@media only screen and (min-width:40.01em) {
  .row .row.-no-pad .column {
    padding-bottom: 0;
  }
}

.column {
  padding-bottom: 24px;
}
.column {
  padding: 0px 9px 18px 9px;
}
@media only screen and (min-width:40.01em) {
  .column {
    padding: 0px 18px 18px 18px;
  }
}
@media only screen and (min-width:64em) {
  .column {
    padding: 0px 24px 24px 24px;
  }
}
@media only screen and (min-width:64em) {
  .column {
    padding-bottom: 30px;
  }
}
.column.-inner {
  padding: 18px 9px 0px 9px;
}
@media only screen and (min-width:40.01em) {
  .column.-inner {
    padding: 18px 18px 0px 18px;
  }
}
@media only screen and (min-width:64em) {
  .column.-inner {
    padding: 24px 24px 0px 24px;
  }
}
.column.-inner {
  margin-bottom: 36px;
}
@media only screen and (min-width:40.01em) {
  .column.-inner {
    margin-bottom: 36px;
  }
}
@media only screen and (min-width:64em) {
  .column.-inner {
    margin-bottom: 48px;
  }
}
.column.-reduced {
  padding: 0px 4.5px 0px 4.5px;
}
@media only screen and (min-width:40.01em) {
  .column.-reduced {
    padding: 0px 9px 0px 9px;
  }
}
@media only screen and (min-width:64em) {
  .column.-reduced {
    padding: 0px 12px 0px 12px;
  }
}
@media only screen and (min-width:64em) {
  .column.-reduced {
    padding-bottom: 6px;
  }
}

[class*=block-grid-] {
  margin: 0 -6px;
}

[class*=block-grid-] > li {
  padding: 0 6px 12px;
}

article {
  padding: 12px;
  border: 1px solid #cccccc;
}

body, html {
  height: 100%;
  width: 100%;
}

hr {
  border-top: 1px solid var(--primary-color);
  margin: 0 -9px;
}
@media only screen and (min-width:40.01em) {
  hr {
    margin: 0 -36px;
  }
}
@media only screen and (min-width:50.01em) {
  hr {
    margin: 0;
  }
}

section {
  background-color: #fff;
  padding-bottom: 30px;
}

html.noscroll {
  overflow: hidden;
}
@media only screen and (min-width:50.01em) {
  html.noscroll {
    overflow: visible;
  }
}

input, textarea {
  border-width: 0;
  padding: 6px 12px;
}
input:focus, textarea:focus {
  outline: 0;
}

.lazyload,
.lazyloading {
  min-height: 100px;
}

.select {
  position: relative;
}
.select select {
  border: none;
  border-radius: 0;
  color: #000;
  opacity: 0;
  left: 0;
  top: 0;
  padding: 0 12px;
  position: absolute;
  height: 100%;
  text-transform: uppercase;
  width: 100%;
  z-index: 2;
  -webkit-appearance: none;
}
.select select:focus {
  outline: 0;
}

.select__text {
  background: #fff;
  border-radius: 3px;
  line-height: 18px;
  padding: 0;
  position: relative;
  text-transform: uppercase;
  width: 100%;
  z-index: 1;
}
.select__text:before {
  content: "\f107";
  position: absolute;
  right: 0;
  top: 50%;
  font: normal normal normal 14px/1 FontAwesome;
  font-size: 18px;
  text-rendering: auto;
  font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  margin: -9px 4px 0 0;
}

.circle {
  border-radius: 1000px;
  background: var(--primary-color);
  height: 43px;
  width: 43px;
  display: inline-block;
  border: 1px solid var(--primary-color);
}
@media only screen and (min-width:64em) {
  .circle {
    border-radius: 1000px;
    background: var(--primary-color);
    height: 60px;
    width: 60px;
  }
}

.circle-small {
  border-radius: 1000px;
  background: var(--primary-color);
  height: 22px;
  width: 22px;
  display: inline-block;
}

.circle-large {
  border-radius: 1000px;
  background: var(--primary-color);
  height: 300px;
  width: 300px;
  display: inline-block;
}
@media only screen and (min-width:30em) {
  .circle-large {
    border-radius: 1000px;
    background: var(--primary-color);
    height: 350px;
    width: 350px;
  }
}
@media only screen and (min-width:40.01em) and (max-width:45em) {
  .circle-large {
    border-radius: 1000px;
    background: var(--primary-color);
    height: 280px;
    width: 280px;
  }
}
@media only screen and (min-width:45.01em) {
  .circle-large {
    border-radius: 1000px;
    background: var(--primary-color);
    height: 300px;
    width: 300px;
  }
}

.circle-grey {
  border-radius: 1000px;
  background: rgba(0, 0, 0, 0.15);
  height: 70px;
  width: 70px;
  cursor: pointer;
  position: fixed;
  right: 24px;
  bottom: -74px;
  z-index: 1000;
  border: none;
  display: block;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.25s ease, background-color 0.25s ease;
}
.circle-grey.visible {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}
.circle-grey img {
  width: 42px;
  position: absolute;
  margin: auto;
  text-align: center;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  filter: brightness(0) invert(1);
  opacity: 1;
}
.circle-grey:hover {
  border-radius: 1000px;
  background: rgba(0, 0, 0, 0.25);
  height: 70px;
  width: 70px;
  opacity: 1;
}

.abs-top {
  position: absolute;
  top: 50%;
}

.absolute-center {
  position: absolute;
  margin: auto;
  text-align: center;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}

.center {
  position: absolute;
  top: 50%;
  left: 50%;
}

.cf:before,
.cf:after {
  content: " "; /* 1 */
  display: table; /* 2 */
}

.cf:after {
  clear: both;
}

.cb {
  clear: both;
}

.center-inline, .ci {
  text-align: center;
}

@media only screen and (min-width:40.01em) {
  .ri-med {
    text-align: right;
  }
}

.faded-7 {
  opacity: 0.7;
}

.h-space {
  margin: 0 24px;
}

.h-space-half {
  margin: 0 12px;
}

.hide {
  display: none;
}

.hide-small {
  display: none;
}
@media only screen and (min-width:40.01em) {
  .hide-small {
    display: block;
  }
}

.ib {
  display: inline-block;
}

.inline-center {
  text-align: center;
  overflow: auto;
}
.inline-center:after {
  content: "";
  height: 100%;
  margin-left: -0.25em; /* To offset spacing. May vary by font */
}

.inline-center:after,
.ic__content {
  display: inline-block;
  vertical-align: middle;
}

.ic__content {
  max-width: 98%;
}
.ic__content.-max {
  width: 98%;
}

.left {
  float: left;
}

.left-xxm {
  padding: 24px;
}
@media only screen and (min-width:50.01em) {
  .left-xxm {
    float: left;
    width: 50%;
  }
}

.max-overlay {
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  transition: all 0.5s ease;
  width: 100%;
}

.m-up {
  display: none;
}
@media only screen and (min-width:40.01em) {
  .m-up {
    display: block;
  }
}

.relative {
  position: relative;
}

.right {
  float: right;
}

.right-xxm {
  padding: 24px;
}
@media only screen and (min-width:50.01em) {
  .right-xxm {
    float: right;
    width: 50%;
  }
}

.right-inline {
  text-align: right;
}

.utils-scroll-shadows {
  background: radial-gradient(farthest-side at 50% 100%, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0)) 0 100%;
  background-attachment: fixed;
  background-repeat: no-repeat;
  background-size: 100% 40px, 100% 40px;
  height: 100%;
  left: 0;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  width: 100%;
}
.utils-scroll-shadows.-scroll-down {
  background: radial-gradient(farthest-side at 50% 0, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0)), radial-gradient(farthest-side at 50% 100%, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0)) 0 100%;
  background-attachment: fixed;
  background-repeat: no-repeat;
  background-size: 100% 40px, 100% 40px;
}
.utils-scroll-shadows.-scroll-bottom {
  background: radial-gradient(farthest-side at 50% 0, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0));
  background-attachment: fixed;
  background-repeat: no-repeat;
  background-size: 100% 40px, 100% 40px;
}
@media only screen and (min-width:45.01em) {
  .utils-scroll-shadows {
    overflow: visible;
  }
}

.table-center {
  display: table;
  height: 100%;
  width: 100%;
}
.table-center .table-cell {
  vertical-align: middle;
}

.table-cell {
  display: table-cell;
}

.u-icon-attach {
  display: inline-block;
  position: relative;
}
.u-icon-attach > .icon {
  position: absolute;
  right: 12px;
}
.u-icon-attach .fa:before {
  margin: -8px 0 0 0;
  position: absolute;
  right: 12px;
  top: 50%;
}
.u-icon-attach.-small .fa:before {
  right: 8px;
}

.utils-capitalize {
  text-transform: capitalize;
}

.z3 {
  z-index: 3;
}

/*defaults*/
/*! HTML5 Boilerplate v4.3.0 | MIT License | http://h5bp.com/ */
/*
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */
/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */
/* apply a natural box layout model to all elements */
*, *:before, *:after {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

html {
  color: #222;
  font-size: 1em;
  line-height: 1.4;
}

/*
 * Remove text-shadow in selection highlight: h5bp.com/i
 * These selection rule sets have to be separate.
 * Customize the background color to match your design.
 */
::-moz-selection {
  background: #b3d4fc;
  text-shadow: none;
}

::selection {
  background: #b3d4fc;
  text-shadow: none;
}

/*
 * A better looking default horizontal rule
 */
hr {
  display: block;
  height: 1px;
  border: 0;
  margin: 1em 0;
  padding: 0;
}

/*
 * Remove the gap between images, videos, audio and canvas and the bottom of
 * their containers: h5bp.com/i/440
 */
audio,
canvas,
img,
svg,
video {
  vertical-align: middle;
}

/*
 * Remove default fieldset styles.
 */
fieldset {
  border: 0;
  margin: 0;
  padding: 0;
}

/*
 * Allow only vertical resizing of textareas.
 */
textarea {
  resize: vertical;
}

ul {
  padding: 0;
  margin: 0;
}
ul li {
  list-style-type: none;
}

/* ==========================================================================
   Browse Happy prompt
   ========================================================================== */
.browsehappy {
  margin: 0.2em 0;
  background: #ccc;
  color: #000;
  padding: 0.2em 0;
}

/* ==========================================================================
   Helper classes
   ========================================================================== */
/*
 * Hide visually and from screen readers: h5bp.com/u
 */
.hidden {
  display: none !important;
  visibility: hidden;
}

/*
 * Hide only visually, but have it available for screen readers: h5bp.com/v
 */
.visuallyhidden {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}

/*
 * Extends the .visuallyhidden class to allow the element to be focusable
 * when navigated to via the keyboard: h5bp.com/p
 */
.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
  clip: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  position: static;
  width: auto;
}

/*
 * Hide visually and from screen readers, but maintain layout
 */
.invisible {
  visibility: hidden;
}

/*
 * Clearfix: contain floats
 *
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    `contenteditable` attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that receive the `clearfix` class.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */
.clearfix:before,
.clearfix:after {
  content: " "; /* 1 */
  display: table; /* 2 */
}

.clearfix:after {
  clear: both;
}

/* ==========================================================================
   EXAMPLE Media Queries for Responsive Design.
   These examples override the primary ('mobile first') styles.
   Modify as content requires.
   ========================================================================== */
@media only screen and (min-width: 35em) {
  /* Style adjustments for viewports that meet the condition */
}
@media print, (-o-min-device-pixel-ratio: 5/4), (-webkit-min-device-pixel-ratio: 1.25), (min-resolution: 120dpi) {
  /* Style adjustments for high resolution devices */
}
/* ==========================================================================
   Print styles.
   Inlined to avoid the additional HTTP request: h5bp.com/r
   ========================================================================== */
@media print {
  * {
    background: transparent !important;
    color: #000 !important; /* Black prints faster: h5bp.com/s */
    box-shadow: none !important;
    text-shadow: none !important;
  }
  a,
  a:visited {
    text-decoration: underline;
  }
  a[href]:after {
    content: " (" attr(href) ")";
  }
  abbr[title]:after {
    content: " (" attr(title) ")";
  }
  /*
   * Don't show links that are fragment identifiers,
   * or use the `javascript:` pseudo protocol
   */
  a[href^="#"]:after,
  a[href^="javascript:"]:after {
    content: "";
  }
  pre,
  blockquote {
    border: 1px solid #999;
    page-break-inside: avoid;
  }
  thead {
    display: table-header-group; /* h5bp.com/t */
  }
  tr,
  img {
    page-break-inside: avoid;
  }
  img {
    max-width: 100% !important;
  }
  p,
  h2,
  h3 {
    orphans: 3;
    widows: 3;
  }
  h2,
  h3 {
    page-break-after: avoid;
  }
}
/*organisms*/
.banner {
  background: rgb(48, 88, 145);
  padding: 8px 0 6px 0;
  text-align: center;
}

.country-picker {
  cursor: pointer;
  font-weight: 700;
  padding: 0;
  position: relative;
}
.country-picker.active .fa-angle-down {
  transition: rotate 0.8s ease;
  transform: rotate(180deg);
}
.country-picker.active .dropdown {
  display: block;
}
.country-picker span {
  letter-spacing: 2px;
}
.country-picker img {
  width: 20px;
}
.country-picker .dropdown {
  padding: 24px;
  right: -38px;
  top: 34px;
}
@media only screen and (min-width:40.01em) {
  .country-picker .dropdown {
    top: 36px;
  }
}

.cover {
  background: var(--primary-color);
  display: none;
  height: 100%;
  left: 0;
  opacity: 0.9;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 1;
}
.cover.-display {
  display: block;
}

.dropdown {
  background: #fff;
  border: 2px solid #eee;
  display: none;
  position: absolute;
  top: 0;
  z-index: 30;
}
.dropdown ul {
  margin: auto;
  min-width: 70px;
  padding: 0;
}
.dropdown li {
  padding: 4px;
  text-align: left;
}
.dropdown li a span {
  vertical-align: middle;
}
.dropdown li a img {
  margin-left: 6px;
  width: 20px;
}
.dropdown.active {
  display: block;
}

.gradient {
  background: -moz-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgb(255, 255, 255) 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, right top, color-stop(0%, rgba(255, 255, 255, 0)), color-stop(100%, rgb(255, 255, 255))); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgb(255, 255, 255) 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgb(255, 255, 255) 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgb(255, 255, 255) 100%); /* IE10+ */
  background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgb(255, 255, 255) 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#00ffffff", endColorstr="#ffffff",GradientType=1 ); /* IE6-9 */
  position: absolute;
  z-index: 5;
}

.grid.inactive .grid-item {
  opacity: 0;
}
.grid .grid-item {
  border: 1px solid #ddd;
  opacity: 0;
  transition: opacity 0.45s ease;
  margin-bottom: 20px; /* ← adds vertical spacing */
  float: left;
}
.grid .grid-item.is-visible {
  opacity: 1;
}
.grid .grid-item .grid-item__content {
  padding: 12px;
  /*
  img {
    margin-bottom: 18px;
    width: 100%;
  }
  */
}
.grid .grid-item .grid-item__content a {
  text-decoration: none;
  transition: all 0.2s ease;
}
.grid .grid-item .grid-item__content .grid-item__content-image {
  margin-bottom: 5px;
  position: relative;
  /* cursor: pointer; */
  height: 0;
  display: block;
  width: 100%;
  /* padding-bottom is calculated and rendered in to HTML */
}
.grid .grid-item .grid-item__content .grid-item__content-image img, .grid .grid-item .grid-item__content .grid-item__content-image iframe, .grid .grid-item .grid-item__content .grid-item__content-image video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: block;
}
.grid .grid-item .grid-item__content .grid-item__content-image img.-play {
  height: 48px;
  width: 48px;
  z-index: 2;
  position: absolute;
  margin: auto;
  text-align: center;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}
.grid .grid-item .grid-item__content .grid-item__content-vimeo {
  position: relative;
  padding-bottom: 56.25%; /* 16:9 ratio */
  margin-bottom: 18px;
  height: 0;
}
.grid .grid-item .grid-item__content .grid-item__content-vimeo iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.grid .grid-item .grid-item__content .grid-item__content-video {
  position: relative;
  margin-bottom: 18px;
}
.grid .grid-item .grid-item__content .grid-item__content-video .video-js {
  max-width: 100%;
  padding-top: 56.25%;
}
.grid .grid-item .grid-item__content .grid-item__content-video .vjs-fullscreen {
  padding-top: 0px;
}
.grid .grid-item .grid-item__content h5 {
  color: #000000;
  line-height: 1.6em;
  margin-bottom: 12px;
  padding: 10px 0px;
}
@media only screen and (min-width:50.01em) {
  .grid .grid-item .grid-item__content h5:hover {
    color: var(--primary-color);
  }
}
.grid .grid-item .grid-item__content p {
  padding: 0 6px;
}
.grid .grid-item .grid-item__content p {
  color: #999;
  font-weight: 400;
}
.grid .grid-item .grid-item__content p > a {
  color: var(--primary-color);
  opacity: 1;
}
@media only screen and (min-width:50.01em) {
  .grid .grid-item .grid-item__content p > a:hover {
    color: #666;
  }
}
.grid .grid-item .grid-item__image {
  position: relative;
  cursor: pointer;
  display: block;
  width: 100%;
  /* padding-bottom is calculated and rendered in to HTML */
}
.grid .grid-item .grid-item__image img, .grid .grid-item .grid-item__image iframe, .grid .grid-item .grid-item__image video {
  width: 100%;
  display: block;
}
.grid .grid-item .grid-item__image img.-plus {
  display: none;
  height: 36px;
  width: 36px;
  z-index: 2;
  position: absolute;
  margin: auto;
  text-align: center;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}
.grid .grid-item .grid-item__image img.-play {
  height: 48px;
  width: 48px;
  z-index: 2;
  position: absolute;
  margin: auto;
  text-align: center;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}
@media only screen and (min-width:50.01em) {
  .grid .grid-item .grid-item__image:hover .cover, .grid .grid-item .grid-item__image:hover .-plus, .grid .grid-item .grid-item__image:hover .-play, .grid .grid-item .grid-item__image:hover .grid-item__filters {
    display: block;
  }
}
.grid .grid-item .grid-item__filters {
  background: #f2f2f2;
  padding: 24px 18px 18px;
}
.grid .grid-item .grid-item__filters a, .grid .grid-item .grid-item__filters span {
  background: #ddd;
  border-radius: 4px;
  display: inline-block;
  font-size: 11px;
  font-weight: 400;
  opacity: 0.5;
  padding: 3px 10px;
  margin: 0 6px 6px 0;
  text-transform: uppercase;
  z-index: 12;
  color: #000;
  text-decoration: none;
}
@media only screen and (min-width:50.01em) {
  .grid .grid-item .grid-item__filters a, .grid .grid-item .grid-item__filters span {
    font-size: 14px;
    margin: 0 8px 6px 0;
  }
  .grid .grid-item .grid-item__filters a:hover, .grid .grid-item .grid-item__filters span:hover {
    opacity: 0.8;
  }
}
.grid .grid-item .grid-item__filters span {
  cursor: pointer;
}
.grid .grid-item .grid-item__filters.-book {
  background: none;
  bottom: 0;
  display: none;
  padding: 0 0 6px 12px;
  position: absolute;
  z-index: 4;
}
.grid .grid-item .grid-item__filters.-book span {
  background: #fff;
  color: var(--primary-color);
  opacity: 1;
}
.grid .grid-item .grid-item__filters.-book span.-add, .grid .grid-item .grid-item__filters.-book span.-remove {
  display: none;
}
@media only screen and (min-width:50.01em) {
  .grid .grid-item .grid-item__filters.-book span.-add.active, .grid .grid-item .grid-item__filters.-book span.-remove.active {
    display: inline-block;
  }
}
@media only screen and (min-width:50.01em) {
  .grid .grid-item .grid-item__filters.-book span:hover {
    background: var(--primary-color);
    color: #fff;
  }
}
.grid .grid-item .grid-item__filters.-book a {
  background: var(--primary-color);
  color: #fff;
  opacity: 1;
}
@media only screen and (min-width:50.01em) {
  .grid .grid-item .grid-item__filters.-book a:hover {
    background: #fff;
    color: var(--primary-color);
  }
}
.grid .grid-sizer, .grid .grid-item {
  width: 100%;
}
@media only screen and (min-width:40.01em) {
  .grid .grid-sizer, .grid .grid-item {
    width: 49%;
  }
}
@media only screen and (min-width:64em) {
  .grid .grid-sizer, .grid .grid-item {
    width: 32%;
  }
}
.grid .grid-item-width-2 {
  width: 100%;
}
@media only screen and (min-width:40.01em) {
  .grid .grid-item-width-2 {
    width: 100%;
  }
}
@media only screen and (min-width:64em) {
  .grid .grid-item-width-2 {
    width: 66%;
  }
}
.grid .gutter-sizer {
  width: 2%;
  margin-bottom: 20px;
}

.overlay {
  background: #fff;
  height: 100%;
  left: 0;
  opacity: 0;
  position: absolute;
  top: 0;
  transition: all 0.7s ease;
  width: 100%;
}

.pagination {
  text-align: center;
  padding-bottom: 20px;
}
@media only screen and (min-width:40.01em) {
  .pagination {
    padding: 0;
    font-size: 18px;
  }
}
.pagination a:hover {
  color: var(--primary-color);
}

.section {
  padding: 36px 0px 18px 0px;
}
@media only screen and (min-width:40.01em) {
  .section {
    padding: 36px 0px 18px 0px;
  }
}
@media only screen and (min-width:64em) {
  .section {
    padding: 48px 0px 24px 0px;
  }
}
@media only screen and (min-width:64em) {
  .section {
    padding-bottom: 18px;
  }
}

/*SECTIONS*/
.red-box {
  background-color: var(--primary-color);
  width: 100%;
  padding: 24px;
  color: white;
  margin-bottom: 10px;
}
.red-box.-hide {
  display: none;
}
.red-box ul {
  -webkit-column-count: 2; /* Chrome, Safari, Opera */
  -moz-column-count: 2; /* Firefox */
  column-count: 2;
}
.red-box ul li {
  cursor: pointer;
  font-size: 18px;
  font-weight: 300;
  line-height: 1.7em;
}
@media only screen and (min-width:30em) {
  .red-box ul {
    -webkit-column-count: 3; /* Chrome, Safari, Opera */
    -moz-column-count: 3; /* Firefox */
    column-count: 3;
  }
}
@media only screen and (min-width:50.01em) {
  .red-box ul {
    -webkit-column-count: 5; /* Chrome, Safari, Opera */
    -moz-column-count: 5; /* Firefox */
    column-count: 5;
    -webkit-column-gap: 20px; /* Chrome, Safari, Opera */
    -moz-column-gap: 20px; /* Firefox */
    column-gap: 20px;
  }
}
@media only screen and (min-width:64em) {
  .red-box ul {
    -webkit-column-count: 6; /* Chrome, Safari, Opera */
    -moz-column-count: 6; /* Firefox */
    column-count: 6;
  }
}

/* ===== Footer – Global ===== */
.app-footer {
  background: var(--primary-color, #6fe699);
  color: #0b0b0b;
  --container: 1300px;
  --gutter: 32px;
}
.app-footer .row {
  max-width: var(--container);
  margin: 0 auto;
  padding: 0;
}
.app-footer .row::before {
  display: none;
}
.app-footer a {
  color: #0b0b0b;
  text-decoration: none;
}
.app-footer a:hover {
  text-decoration: underline;
}

/* ===== CTA (VO + COLAGENE+) ===== */
.app-footer__cta {
  padding: 70px 0 120px;
  background-color: transparent;
  /* ====== Tablet ====== */
  /* ====== Mobile ====== */
}
.app-footer__cta .cta__inner {
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 var(--gutter);
}
.app-footer__cta .cta__container {
  max-width: 800px; /* fix de la typo ax-width */
  display: grid;
  grid-template-columns: 120px minmax(0, 1fr); /* logo | texte */
  align-items: flex-start;
  column-gap: 20px;
}
.app-footer__cta .cta__brand img {
  width: 80px;
  height: auto;
  display: block;
  margin-top: 8px;
}
.app-footer__cta .cta__content {
  position: relative;
}
.app-footer__cta .cta__content .cta__rule {
  display: block;
  height: 3px;
  background: #0b0b0b;
  margin: 10px 0 18px;
}
.app-footer__cta .cta__content p {
  font-size: 24px;
  line-height: 1.35;
  margin: 0 0 14px;
}
.app-footer__cta .cta__content .cta__link {
  display: flex; /* pour align-items */
  align-items: center;
  gap: 14px;
  font-weight: 800;
  font-size: 44px;
  letter-spacing: 0.02em;
  text-decoration: none;
}
.app-footer__cta .cta__content .cta__link .cta__colagene {
  max-width: 100%;
  height: auto;
}
.app-footer__cta .cta__content .cta__link .cta__arrow {
  width: 37px;
  height: 36px;
  margin-left: auto;
}
.app-footer__cta .cta__content .cta__link:hover .cta__arrow {
  transform: translate(2px, -2px);
  transition: transform 0.2s ease;
}
@media (max-width: 920px) {
  .app-footer__cta {
    padding: 50px 0 80px;
  }
  .app-footer__cta .cta__container {
    grid-template-columns: 120px minmax(0, 1fr);
    column-gap: 20px;
  }
  .app-footer__cta .cta__brand img {
    width: 70px;
    margin-top: 4px;
  }
  .app-footer__cta .cta__content .cta__rule {
    width: 60%;
  }
  .app-footer__cta .cta__content p {
    font-size: 20px;
  }
  .app-footer__cta .cta__content .cta__link {
    font-size: 32px;
  }
}
@media (max-width: 560px) {
  .app-footer__cta {
    padding: 40px 0 20px;
  }
  .app-footer__cta .cta__container {
    grid-template-columns: 1fr; /* stack logo + texte */
    row-gap: 16px;
    text-align: center;
  }
  .app-footer__cta .cta__brand {
    justify-self: center;
  }
  .app-footer__cta .cta__brand img {
    width: 64px;
    margin-top: 0;
  }
  .app-footer__cta .cta__content {
    text-align: center;
  }
  .app-footer__cta .cta__content .cta__rule {
    width: 80px;
    margin: 10px auto 18px;
  }
  .app-footer__cta .cta__content p {
    font-size: 18px;
  }
  .app-footer__cta .cta__content .cta__link {
    font-size: 26px;
    justify-content: center;
  }
  .app-footer__cta .cta__content .cta__arrow {
    width: 30px;
    height: 30px;
    margin-left: 12px;
  }
}

.newsletter__msg {
  margin-top: 10px;
  font-size: 14px;
}

.newsletter__msg[data-status=ok] {
  color: var(--primary-color);
}

.newsletter__msg[data-status=error] {
  color: #c00;
}

/* ===== Footer bottom: Disciplines / Newsletter / Info / Contact ===== */
.app-footer__lists {
  padding: 26px 0 50px;
  /* Titres colonnes */
  /* Newsletter inline field + OK text */
  /* Menu Info */
  /* Contact line + icons (ancien style copié) */
  /* Responsive stacking (mobile) */
}
.app-footer__lists .row {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: nowrap;
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 10px;
  gap: 0px;
}
.app-footer__lists .row .column {
  flex: 0 0 auto;
  /* 1 = Disciplines (1 colonne) */
  /* 2 = Newsletter (2 colonnes) */
  /* 3 = Info (1 colonne) */
  /* 4 = Contact (2 colonnes) */
}
.app-footer__lists .row .column:nth-child(1) {
  width: 16.666%;
}
.app-footer__lists .row .column:nth-child(2) {
  width: 33.333%;
}
.app-footer__lists .row .column:nth-child(3) {
  width: 16.666%;
}
.app-footer__lists .row .column:nth-child(4) {
  width: 33.333%;
}
.app-footer__lists .row .column .contact-column {
  max-width: 400px;
}
.app-footer__lists h3 {
  font-size: 14px;
  text-transform: uppercase;
  margin: 0 0 14px;
  position: relative;
  padding-bottom: 12px;
}
.app-footer__lists h3::before {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  right: 0;
  height: 2px;
  background: #0b0b0b;
}
.app-footer__lists h4 {
  font-size: 16px;
  text-transform: uppercase;
  margin: 0 0 14px;
  padding-bottom: 10px;
  position: relative;
}
.app-footer__lists h4::before {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  right: 0;
  height: 1px;
  background: #0b0b0b;
}
.app-footer__lists .newsletter {
  display: flex;
  align-items: center;
  gap: 18px;
}
.app-footer__lists .newsletter label {
  display: none;
}
.app-footer__lists .newsletter input[type=email] {
  appearance: none;
  background: transparent;
  border: none;
  border-bottom: 1px solid #0b0b0b;
  padding: 6px 0 4px;
  width: 240px;
  font-size: 16px;
  outline: none;
  color: #000;
}
.app-footer__lists .newsletter input[type=email]::placeholder {
  color: #333;
  opacity: 1;
}
.app-footer__lists .newsletter input[type=email]:focus {
  outline: none;
  border-color: #000;
}
.app-footer__lists .newsletter button {
  background: none;
  border: none;
  font-weight: 700;
  font-size: 16px;
  padding: 0;
}
.app-footer__lists .newsletter button:hover {
  text-decoration: underline;
  cursor: pointer;
}
.app-footer__lists .footer-menu {
  list-style: none;
  margin: 0;
  padding: 0;
}
.app-footer__lists .footer-menu li {
  margin: 0 0 8px;
}
.app-footer__lists .contact-block {
  display: flex;
  align-items: center;
  gap: 20px;
  flex-wrap: nowrap;
}
.app-footer__lists .contact-block > div:first-child {
  flex: 0 0 auto; /* email/phone fixe */
}
.app-footer__lists .contact-block .social-mini {
  flex: 1 1 auto; /* prend le reste */
  display: flex;
  justify-content: center; /* centré horizontal */
  align-items: center; /* centré vertical */
  gap: 20px;
}
.app-footer__lists .contact-block .social-mini a {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 36px;
  height: 36px;
  text-decoration: none;
  border-radius: 0; /* no border-radius */
  font-size: 36px;
  transition: background 0.3s ease;
}
.app-footer__lists .contact-block .social-mini a:hover {
  background: var(--primary-color, #6fe699);
  color: #000;
}
@media (max-width: 900px) {
  .app-footer__lists .row {
    flex-direction: column;
    gap: 24px;
  }
  .app-footer__lists .row .column {
    width: 100% !important;
  }
  .app-footer__lists .newsletter input[type=email] {
    width: 100%;
    max-width: 300px;
  }
}

/* Responsive stacking (mobile) */
@media (max-width: 900px) {
  .app-footer__info .row,
  .app-footer__lists .row {
    flex-direction: column;
    gap: 24px;
  }
  .app-footer__info .row .column,
  .app-footer__lists .row .column {
    width: 100% !important;
  }
}
.app-header {
  background: #fff;
  border-top: 8px solid var(--primary-color);
  top: 0;
  width: 100%;
  z-index: 101;
  border-bottom: 1px solid var(--primary-color);
}
.admin-bar .app-header {
  top: 32px;
}
@media only screen and (min-width:50.01em) {
  .app-header {
    position: fixed;
    border-bottom: none;
  }
}
.app-header .wrapper {
  padding: 30px 0;
}
@media only screen and (min-width:50.01em) {
  .app-header .wrapper {
    padding: 50px 0;
    border-bottom: 1px solid var(--primary-color);
  }
  .app-header .wrapper.-home {
    border-bottom: none;
  }
}
@media only screen and (min-width:50.01em) {
  .app-header .wrapper-inner {
    padding: 0 30px;
  }
}
.app-header .app-header__logo {
  z-index: 2;
}
@media only screen and (min-width:50.01em) {
  .app-header .app-header__logo {
    left: 30px;
    position: absolute;
    top: 0;
    bottom: 0;
    display: flex;
    align-items: center; /* vertically center without transform */
  }
}
.app-header .app-header__logo img {
  height: 75px;
  width: auto;
  opacity: 0;
  transition: opacity 0.6s ease;
}
.app-header .app-header__logo img.is-loaded {
  opacity: 1;
}
.app-header .fa-bars {
  color: var(--primary-color);
  cursor: pointer;
  font-size: 28px;
  position: absolute;
  right: 20px;
  top: 55px;
}
@media only screen and (min-width:50.01em) {
  .app-header .fa-bars {
    display: none;
  }
}
.app-header .app-header__close {
  cursor: pointer;
  display: none;
  height: 24px;
  position: absolute;
  right: 16px;
  top: 58px;
  width: 24px;
}
@media only screen and (min-width:50.01em) {
  .app-header .app-header__close {
    display: none;
  }
}
.app-header.active .app-nav {
  display: block;
}
.app-header.active .fa-bars {
  display: none;
}
.app-header.active .app-header__close {
  display: block;
}

.tooltipster-content {
  overflow: visible !important;
}

.tooltip-theme-arrows .tooltipster-box {
  border: none;
  border-radius: 5px;
  background: #fff;
  box-shadow: 0 0 10px 6px rgba(0, 0, 0, 0.1);
}
.tooltip-theme-arrows .tooltipster-bottom .tooltipster-box {
  margin-top: 6px;
}
.tooltip-theme-arrows .tooltipster-left .tooltipster-box {
  margin-right: 6px;
}
.tooltip-theme-arrows .tooltipster-right .tooltipster-box {
  margin-left: 6px;
}
.tooltip-theme-arrows .tooltipster-top .tooltipster-box {
  margin-bottom: 6px;
}
.tooltip-theme-arrows .tooltipster-content {
  color: #8d8d8d;
}
.tooltip-theme-arrows .tooltipster-arrow {
  height: 6px;
  margin-left: -6px;
  width: 12px;
}
.tooltip-theme-arrows .tooltipster-left .tooltipster-arrow, .tooltip-theme-arrows .tooltipster-right .tooltipster-arrow {
  height: 12px;
  margin-left: 0;
  margin-top: -6px;
  width: 6px;
}
.tooltip-theme-arrows .tooltipster-arrow-background {
  display: none;
}
.tooltip-theme-arrows .tooltipster-arrow-border {
  border: 6px solid transparent;
}
.tooltip-theme-arrows .tooltipster-bottom .tooltipster-arrow-border {
  border-bottom-color: #fff;
}
.tooltip-theme-arrows .tooltipster-left .tooltipster-arrow-border {
  border-left-color: #fff;
}
.tooltip-theme-arrows .tooltipster-right .tooltipster-arrow-border {
  border-right-color: #fff;
}
.tooltip-theme-arrows .tooltipster-top .tooltipster-arrow-border {
  border-top-color: #fff;
}
.tooltip-theme-arrows .tooltipster-bottom .tooltipster-arrow-uncropped {
  top: -6px;
}
.tooltip-theme-arrows .tooltipster-right .tooltipster-arrow-uncropped {
  left: -6px;
}
.tooltip-theme-arrows .tooltipster-box {
  background: white;
  border: 5px solid white;
}
.tooltip-theme-arrows .tooltipster-arrow-border,
.tooltip-theme-arrows .tooltipster-arrow-background {
  border-color: white !important;
}

.js-navartistsdrop.dropdowns .dropdown__close {
  width: 24px;
}
.js-navartistsdrop .tooltip-wrapper {
  position: relative;
}
.js-navartistsdrop .tooltip-wrapper .tooltip-anchor {
  position: relative;
  display: inline-block;
  text-decoration: none;
}
.js-navartistsdrop .tooltip-wrapper .tooltip-anchor:hover .custom-tooltip {
  opacity: 1;
  visibility: visible;
}
.js-navartistsdrop .tooltip-wrapper .custom-tooltip {
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateX(-111%) translateY(-50%);
  background: #fff;
  border: 5px solid #fff;
  z-index: 9999;
  white-space: nowrap;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.2s ease;
  padding: 0;
  pointer-events: none;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
}
.js-navartistsdrop .tooltip-wrapper .custom-tooltip .tooltip-image {
  display: block;
  max-width: 150px;
  height: auto;
  margin: 0;
}
.js-navartistsdrop .tooltip-wrapper .custom-tooltip .tooltip-arrow {
  content: "";
  position: absolute;
  top: 50%;
  right: -10px;
  transform: translateY(-50%);
  width: 0;
  height: 0;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
  border-left: 10px solid #fff;
}
.js-navartistsdrop .tooltip-wrapper.is-tooltip-right .custom-tooltip {
  left: 100%;
  transform: translateX(20px) translateY(-50%);
}
.js-navartistsdrop .tooltip-wrapper.is-tooltip-right .custom-tooltip .tooltip-arrow {
  right: auto;
  left: -10px;
  border-left: 0;
  border-right: 10px solid #fff;
}

/* ============================
   VO Talents — Header overrides
   (append-only, safe to drop at end)
   ============================ */
.page-wrap .main > .wrapper,
.main .wrapper {
  will-change: margin-top;
}

/* Dropdown search container */
.dropdowns.-search .dropdowns__wrap .dropdown__close {
  width: 24px;
  display: block;
}

@media (max-width: 782px) {
  .dropdowns:not(.is-fullscreen).-search .dropdowns__wrap .dropdown__close {
    display: block;
    width: 24px;
    height: 24px;
    right: 16px;
    top: 5px;
  }
}

/* Layout inside */
.dropdowns__elastic-search {
  margin-bottom: 18px;
  padding-bottom: 14px;
  padding-right: 0 !important;
}

.dropdowns__elastic-search .h2 {
  margin-bottom: 10px;
  font-size: clamp(18px, 1.2vw + 14px, 28px);
  line-height: 1.15;
}

.js-oeuvre-elastic-input {
  width: calc(100% - 70px);
  padding: 10px 12px;
  padding-left: 56px; /* space for the loupe */
  border-radius: 0;
  font-size: 28px;
  outline: none;
  background-color: #fff;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
  /* 🔍 loupe */
  background-image: url("../img/loupe.png");
  background-repeat: no-repeat;
  background-position: 16px center;
  background-size: 30px 30px;
}

/* Champ de recherche œuvres */
.js-oeuvre-elastic-input {
  color: #666666;
  font-weight: 300; /* light */
}

/* Placeholder */
.js-oeuvre-elastic-input::placeholder {
  color: #666666;
  font-weight: 300;
  opacity: 1; /* Firefox */
}

/* Compatibilité anciens navigateurs */
.js-oeuvre-elastic-input::-webkit-input-placeholder {
  color: #666666;
  font-weight: 300;
}

.js-oeuvre-elastic-input:-ms-input-placeholder {
  color: #666666;
  font-weight: 300;
}

.js-oeuvre-elastic-input:focus {
  border-color: var(--primary-color);
  box-shadow: 0 0 0 2px rgba(111, 230, 153, 0.25);
}

.oeuvre-elastic-hint {
  margin-top: 8px;
  font-size: 16px;
  line-height: 1.35;
  opacity: 0.8;
}

/* Suggestions */
.oeuvre-elastic-suggestions {
  margin-top: 14px;
}

.oeuvre-elastic-suggestions__title {
  font-size: 16px;
  opacity: 0.8;
  margin-bottom: 10px;
}

.oeuvre-elastic-suggestions__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
}

.oeuvre-elastic-suggestions__group-title {
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  opacity: 0.7;
  margin-bottom: 8px;
}

.oeuvre-elastic-suggestions__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.oeuvre-elastic-chip {
  border: 1px solid rgba(0, 0, 0, 0.14);
  background: transparent;
  padding: 6px 10px;
  border-radius: 0;
  cursor: pointer;
  font-size: 13px;
  transition: background 0.15s ease, border-color 0.15s ease;
}

.oeuvre-elastic-chip:hover {
  border-color: rgba(0, 0, 0, 0.3);
}

/* Results / status area */
/* Simple pulse line under input when typing */
.dropdowns.-search.is-typing .js-oeuvre-elastic-input {
  border-color: var(--primary-color);
  box-shadow: 0 0 0 2px rgba(111, 230, 153, 0.18);
}

.dropdowns.-search.js-searchdrop.is-typing .js-oeuvre-elastic-input {
  border-color: var(--primary-color);
  box-shadow: 0 0 0 2px rgba(111, 230, 153, 0.18);
  border-radius: 0;
}

.oeuvre-elastic-loading,
.oeuvre-elastic-empty,
.oeuvre-elastic-error {
  font-size: 16px;
  opacity: 0.8;
  padding: 10px 0;
}

.os-no-results {
  font-size: 16px;
}

.oeuvre-elastic-inputwrap {
  position: relative; /* au cas où */
}

.oeuvre-elastic-clear {
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  width: 24px;
  height: 24px;
  border: 0;
  background: transparent;
  padding: 0;
  cursor: pointer;
  display: none; /* visible seulement quand on tape */
  align-items: center;
  justify-content: center;
}

.oeuvre-elastic-clear.is-visible {
  display: inline-flex;
}

.oeuvre-elastic-clear .icon-close-thin {
  width: 100%;
  height: 100%;
}

.oeuvre-elastic-clear .icon-close-thin line {
  stroke: #ccc; /* ✅ couleur */
  stroke-width: 1.2; /* ajuste si tu veux plus fin/épais */
  stroke-linecap: round; /* rendu plus clean */
}

.oeuvre-elastic-clear:hover .icon-close-thin line,
.oeuvre-elastic-clear:focus .icon-close-thin line {
  stroke: #bfbfbf;
}

.oeuvre-elastic-list {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
}

.oeuvre-elastic-item {
  display: grid;
  grid-template-columns: 70px 1fr;
  gap: 10px;
  text-decoration: none;
  color: inherit;
  border: 1px solid rgba(0, 0, 0, 0.1);
  padding: 8px;
}

.oeuvre-elastic-item__thumb {
  position: relative;
  width: 70px;
  height: 70px;
  overflow: hidden;
  background: rgba(0, 0, 0, 0.03);
}

.oeuvre-elastic-item__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.oeuvre-elastic-item__title mark {
  background: rgba(111, 230, 153, 0.35);
  padding: 0 2px;
}

/* Fix: allow artworks thumbnails inside search dropdown results */
.dropdowns.-search .dropdowns__hashtag-menu .oeuvre-elastic-results .grid-item__image img:not(.-plus):not(.-play),
.dropdowns.-search .dropdowns__hashtag-menu .oeuvre-elastic-results .grid-item__image iframe,
.dropdowns.-search .dropdowns__hashtag-menu .oeuvre-elastic-results .grid-item__image video {
  display: block !important;
  position: static !important;
  width: 100% !important;
  height: auto !important;
  right: auto !important;
  top: auto !important;
  opacity: 1 !important;
  z-index: auto !important;
}

/* =========================
   Fullscreen search overlay
   ========================= */
/* Default: keep your current behavior */
.dropdowns.-search.js-searchdrop {
  /* no change here */
}

/* Fullscreen state */
.dropdowns.-search.js-searchdrop.is-fullscreen {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  z-index: 999999 !important;
  display: block !important;
  /* atmosphere */
  background: #fff;
  /* animation */
  opacity: 0;
  transform: translateY(12px) scale(0.985);
  transition: opacity 0.35s ease, transform 0.35s ease;
}

.dropdowns.-search.js-searchdrop.is-fullscreen.is-fullscreen-ready {
  opacity: 1;
  transform: translateY(0) scale(1);
}

/* Make the inner wrap scrollable + centered-ish */
.dropdowns.-search.js-searchdrop.is-fullscreen .dropdowns__wrap {
  position: relative;
  height: 100vh;
  overflow: auto;
  padding: 0 0 50px 0;
  margin: 0 !important;
}

/* WP admin bar offset */
body.admin-bar .dropdowns.-search.js-searchdrop.is-fullscreen {
  top: 32px !important;
  height: calc(100vh - 32px) !important;
}

/* WP admin bar is taller on small screens */
@media (max-width: 782px) {
  body.admin-bar .dropdowns.-search.js-searchdrop.is-fullscreen {
    top: 46px !important;
    height: calc(100vh - 46px) !important;
  }
}
/* Constrain the content width (optional) */
.dropdowns.-search.js-searchdrop.is-fullscreen .dropdowns__elastic-search, .dropdowns.-search.js-searchdrop.is-fullscreen .dropdowns__elastic-search-results {
  max-width: 1200px;
  margin: 0 auto;
}

@media (max-width: 1200px) {
  .dropdowns.-search.js-searchdrop.is-fullscreen .dropdowns__elastic-search-results {
    padding: 0px 15px;
  }
}

.dropdowns.-search.js-searchdrop .dropdowns__search {
  padding: 50px 25px 0px;
}

.dropdowns.-search.js-searchdrop.is-fullscreen .dropdowns__search {
  background-color: var(--primary-color);
}

.dropdowns.-search.js-searchdrop.is-fullscreen .dropdowns__hashtag-menu {
  background-color: #fff;
}

/* Top-right close button (new) */
.oeuvre-search-close {
  position: fixed;
  top: 18px;
  right: 18px;
  z-index: 1000000;
  width: 44px;
  height: 44px;
  border: 1px solid rgba(0, 0, 0, 0.15);
  background: rgba(255, 255, 255, 0.85);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  cursor: pointer;
  display: none;
  align-items: center;
  justify-content: center;
}

.dropdowns.-search.js-searchdrop.is-fullscreen .oeuvre-search-close {
  display: flex;
}

.oeuvre-search-close img {
  width: 18px;
  height: 18px;
  display: block;
}

/* Optional: lock body scroll when fullscreen */
body.os-search-lock {
  overflow: hidden;
}

/* Define --vo-adminbar-h from WP var (with fallbacks) */
body.admin-bar {
  --vo-adminbar-h: var(--wp-admin--admin-bar--height, 32px);
}

@media (max-width: 782px) {
  body.admin-bar {
    --vo-adminbar-h: var(--wp-admin--admin-bar--height, 46px);
  }
}
.app-nav {
  background: var(--primary-color);
  display: none;
  margin: 0 -9px;
  text-align: center;
  z-index: 1;
}
@media only screen and (min-width:40.01em) {
  .app-nav {
    margin: 0 -36px;
  }
}
@media only screen and (min-width:50.01em) {
  .app-nav {
    background: #fff;
    display: block;
    margin: 0;
  }
}
.app-nav.-right {
  z-index: 999;
}
@media only screen and (min-width:50.01em) {
  .app-nav.-right {
    position: absolute;
    right: 30px;
    top: 0;
    bottom: 0;
    text-align: right;
    display: flex;
    align-items: center;
  }
}
.app-nav.-right > li:last-child {
  border-bottom: none;
}
@media only screen and (min-width:50.01em) {
  .app-nav.-right > li:last-child > a {
    padding-right: 0;
  }
}
@media (max-width: 799px) {
  .app-nav.app-nav-first {
    margin-top: 30px;
  }
}
@media (min-width: 800px) and (max-width: 1050px) {
  .app-nav.app-nav-first {
    text-align: left;
    padding-left: 120px;
  }
}
.app-nav.app-nav-second > li > a {
  font-weight: 400;
}
.app-nav > li {
  border-bottom: 1px solid rgba(255, 255, 255, 0.6);
  position: static;
}
@media only screen and (min-width:50.01em) {
  .app-nav > li {
    border-bottom: none;
    display: inline-block;
    padding: 0;
    margin: 0 2px;
  }
}
@media only screen and (min-width:75.01em) {
  .app-nav > li {
    margin: 0 4px;
  }
}
.app-nav > li > a {
  color: #fff;
  display: block;
  font-family: "Roboto Condensed", sans-serif;
  font-size: 22px;
  font-weight: 700;
  padding: 16px;
  text-transform: uppercase;
  position: relative;
  text-decoration: none;
  transition: all 0.25s ease-in-out;
}
.app-nav > li > a:hover, .app-nav > li > a.active {
  /*&:after {
  	width: calc(100% + 9px);
  }*/
}
@media only screen and (min-width:50.01em) {
  .app-nav > li > a {
    color: #000;
    font-size: 15px;
    padding: 4px 8px;
  }
}
@media (min-width: 900px) {
  .app-nav > li > a {
    padding: 4px 12px;
  }
}
@media only screen and (min-width:64em) {
  .app-nav > li > a {
    font-size: 15px;
    padding: 8px 12px;
  }
}
@media only screen and (min-width:75.01em) {
  .app-nav > li > a {
    padding: 8px 16px;
  }
}
.app-nav > li .angle-down {
  display: none;
  width: 22px;
  position: absolute;
  right: 20px;
  top: 20px;
}
@media only screen and (min-width:50.01em) {
  .app-nav > li .angle-down {
    display: none;
  }
}
.app-nav > li .dropdowns {
  display: none;
}
@media only screen and (min-width:50.01em) {
  .app-nav > li .dropdowns {
    position: absolute;
    left: 0;
    top: 135px;
  }
}
@media only screen and (min-width:64em) {
  .app-nav > li .dropdowns {
    top: 143px;
  }
}
@media only screen and (min-width:50.01em) {
  .app-nav > li:hover > a {
    color: var(--primary-color);
  }
}
.app-nav > li.current-menu-item {
  background-color: rgb(from var(--primary-color) r g b/0.15);
}
.app-nav > li.current-menu-item > a {
  color: #000 !important;
}
.app-nav > li.current-menu-item > a:hover {
  color: #000 !important;
}
.app-nav > li.active > .angle-down {
  display: block;
}
.app-nav > li.active li.active > .angle-down {
  display: block;
}
.app-nav > li.-pdf {
  display: none;
}
.app-nav > li.-pdf.has-items a {
  background-color: rgb(from var(--primary-color) r g b/0.15);
}
@media only screen and (min-width:50.01em) {
  .app-nav > li.-pdf {
    display: inline-block;
    position: relative;
  }
}
.app-nav > li.-pdf .circle-small {
  margin: -11px -11px 0 0;
  opacity: 0;
  position: absolute;
  right: 3px;
  width: auto;
  height: auto;
  top: 0;
  visibility: hidden;
  border-radius: 0; /* override global */
}
.app-nav > li.-pdf .circle-small span {
  font-family: "Roboto Condensed", sans-serif;
  font-weight: normal;
  color: #fff;
  padding: 0px 5px;
}
@media (min-width: 800px) {
  .app-nav .-lang {
    margin-left: 14px;
  }
}
.app-nav .lang-dd {
  position: relative;
  font-family: inherit;
}
.app-nav .lang-dd__summary {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border: 1px solid #5fe38c;
  color: #5fe38c;
  background: #fff;
  cursor: pointer;
  font-size: 14px;
  line-height: 1;
  user-select: none;
}
.app-nav .lang-dd__summary::-webkit-details-marker {
  display: none;
}
.app-nav .lang-dd__summary::after {
  content: "▾";
  font-size: 10px;
  transform: translateY(1px);
}
.app-nav .lang-dd__summary:focus {
  outline: none;
}
.app-nav .lang-dd__list {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  min-width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
  border: 1px solid #5fe38c;
  background: #fff;
  z-index: 999;
}
.app-nav .lang-dd__list li a {
  display: block;
  padding: 6px 10px;
  color: #5fe38c;
  text-decoration: none;
  font-size: 14px;
  text-align: center;
}
.app-nav .lang-dd__list li a:hover {
  background: #e9fff1;
}
.app-nav .lang-dd:not([open]) .lang-dd__list {
  display: none;
}

.book h1 {
  font-size: 35px;
  text-transform: uppercase;
}
.book .intro_phrase-bloc {
  padding: 40px;
  background-color: #eefaf2;
  margin-bottom: 50px;
}
.book .intro_txt {
  margin: 0 auto;
  max-width: 800px;
  font-size: 17px;
  text-align: center;
}
.book .intro_txt p {
  font-size: 17px;
}
.book .intro_txt em {
  background-color: var(--primary-color);
  font-style: normal;
}
.book .book__bio {
  background: var(--primary-color);
  display: none;
  position: relative;
  margin-bottom: 36px;
}
.book .book__bio:before, .book .book__bio:after {
  content: " ";
  display: table;
}
.book .book__bio:after {
  clear: both;
}
.book .book__bio .book__bio-wrap {
  min-height: 200px;
}
.book .book__bio .book__bio-wrap .bio__content {
  float: left;
  margin-left: 32%;
  padding: 50px;
  width: 68%;
}
.book .book__bio .book__bio-wrap .bio__content h2 {
  line-height: 1.4em;
  font-size: 17px;
  margin: 0 0 1em;
}
@media only screen and (min-width:64em) {
  .book .book__bio .book__bio-wrap .bio__content h2 {
    font-size: 21px;
  }
}
.book .book__bio .book__bio-wrap .bio__content p {
  font-size: 15px;
  margin: 0;
  line-height: 1.4em;
}
@media only screen and (min-width:64em) {
  .book .book__bio .book__bio-wrap .bio__content p {
    font-size: 17px;
  }
}
.book .book__bio .book__bio-wrap .bio__image {
  height: 100%;
  overflow: hidden;
  position: absolute;
  width: 32%;
}
.book .book__bio .book__bio-wrap .bio__image img {
  height: 100%;
  margin-left: -25%;
  min-width: 100%;
  position: absolute;
  height: auto;
  transform: translateY(-11%);
  top: 0;
  margin: 0;
  bottom: 0;
}
@media only screen and (min-width:64em) {
  .book .book__bio .book__bio-wrap .bio__image img {
    margin-left: -20%;
  }
}
@media only screen and (min-width:75.01em) {
  .book .book__bio .book__bio-wrap .bio__image img {
    margin-left: -15%;
  }
}
@media only screen and (min-width:81.251em) {
  .book .book__bio .book__bio-wrap .bio__image img {
    margin: 0;
  }
}
.book .book__container {
  position: relative;
}
.book .book__container.active {
  padding-top: 0;
}
@media only screen and (min-width:50.01em) {
  .book .book__container.active {
    padding-top: 30%;
  }
}
@media only screen and (min-width:64em) {
  .book .book__container.active {
    padding-top: 25%;
  }
}
.book .book__container .news-cta {
  border-color: var(--primary-color);
  color: var(--primary-color);
  display: table;
  height: 150px;
}
.book .book__container .news-cta .grid-item__content {
  display: table-cell;
  text-align: center;
  vertical-align: middle;
}
.book .book__container .news-cta .grid-item__content h5 {
  color: var(--primary-color);
  width: 100%;
  margin-bottom: 0px;
  display: inline-block;
  vertical-align: top;
}
.book .book__mob {
  display: block;
  width: 100%;
}
@media only screen and (min-width:50.01em) {
  .book .book__mob {
    display: none;
  }
  .book .book__mob.active {
    display: block;
  }
}
.book .book__mob-title {
  text-align: center;
  padding: 24px 0;
}
@media only screen and (min-width:50.01em) {
  .book .book__mob-title {
    display: none;
  }
}
.book .book__mob-title span {
  background: #ddd;
  font-size: 12px;
  font-weight: 400;
  opacity: 0.7;
  padding: 6px;
  text-transform: uppercase;
}
@media only screen and (min-width:50.01em) {
  .book .list {
    position: absolute;
    top: 0;
    left: 0;
  }
}
.book .list li {
  margin-bottom: 6px;
}
@media only screen and (min-width:50.01em) {
  .book .list li {
    margin-bottom: 0;
  }
}
.book .list li .list__image {
  opacity: 0;
}
.book .list li .list__image.-loaded {
  opacity: 1;
}

.fancybox-video {
  display: none;
}

.-display {
  overflow: hidden;
  position: absolute;
  min-height: 200px;
}

/* Whole grid fade + per-item reveal (matches taxonomy pages) */
.grid {
  opacity: 0;
  transition: opacity 1.5s ease, transform 0s;
  min-height: 600px;
}

.grid.is-ready {
  opacity: 1;
}

.grid .grid-item {
  opacity: 0;
  transform: translateY(8px);
  transition: opacity 0.35s ease, transform 0;
}

.grid .grid-item.is-visible {
  opacity: 1;
  transform: none;
}

/* "Afficher plus" spinner + disabled state */
.btn.btn-more {
  opacity: 0;
  position: relative;
}

.btn.btn-more .btn__spinner {
  display: none;
  position: absolute;
  left: 10px;
  top: 50%;
  transform: translateY(-50%);
  width: 18px;
  height: 18px;
}

.btn.btn-more .btn__spinner-img {
  width: 18px;
  height: 18px;
  display: none;
}

.btn.btn-more.is-loading {
  display: block;
  opacity: 1;
}

.btn.btn-more.is-loading .btn__spinner {
  display: none;
}

/* CSS fallback spinner (used if no VO_SPINNER_URL) */
.btn.btn-more .btn__spinner:not(:has(img)) {
  border: 2px solid rgba(0, 0, 0, 0.15);
  border-top-color: currentColor;
  border-radius: 50%;
  animation: vo-spin 0.7s linear infinite;
}

@keyframes vo-spin {
  to {
    transform: translateY(-50%) rotate(360deg);
  }
}
.btn.btn-more.is-loading {
  pointer-events: none;
  opacity: 0.75;
}

.artist-skills {
  margin-top: 20px;
}
.artist-skills a {
  padding: 5px 10px;
  background-color: transparent;
  margin-bottom: 10px;
  margin-right: 10px;
  transition: all 0.3s ease;
  color: #000;
  border: 1px solid #000;
  font-weight: normal;
  text-decoration: none;
}
.artist-skills a:hover {
  color: #fff;
  background-color: #000;
}

.clinique {
  text-align: center;
}
@media only screen and (min-width:50.01em) {
  .clinique {
    text-align: left;
  }
}
.clinique h2 {
  color: var(--primary-color);
  border-bottom: 1px solid #ddd;
  font-family: "Roboto Condensed", sans-serif;
  font-size: 24px;
  font-style: italic;
  font-weight: 600;
  padding: 24px 0;
  text-transform: none;
}
@media only screen and (min-width:40.01em) {
  .clinique h2 {
    font-size: 24px;
  }
}
@media only screen and (min-width:50.01em) {
  .clinique h2 {
    font-size: 30px;
    padding: 36px 0;
    text-align: center;
  }
}
@media only screen and (min-width:64em) {
  .clinique h2 {
    font-size: 40px;
    padding: 56px 0;
  }
}
.clinique strong {
  font-style: italic;
  font-weight: 400;
}
.clinique .row {
  padding-top: 24px;
  margin: 0 -9px;
  width: auto;
}
@media only screen and (min-width:40.01em) {
  .clinique .row {
    padding-top: 36px;
    margin: 0 -18px;
  }
}
@media only screen and (min-width:64em) {
  .clinique .row {
    margin: 0 -24px;
    padding-top: 50px;
  }
}
.clinique .row .column h3 {
  margin-bottom: 24px;
  font-size: 1.5em;
}
@media only screen and (min-width:40.01em) {
  .clinique .row .column h3 {
    font-size: 24px;
  }
}
@media only screen and (min-width:64em) {
  .clinique .row .column h3 {
    font-size: 30px;
    margin-bottom: 36px;
  }
}
.clinique .row .column h3, .clinique .row .column p {
  opacity: 0.7;
}
.clinique .row .column p {
  font-family: "Roboto Condensed", sans-serif;
  font-size: 18px;
}
@media only screen and (min-width:45.01em) {
  .clinique .row .column p {
    font-size: 20px;
  }
}
@media only screen and (min-width:64em) {
  .clinique .row .column p {
    font-size: 22px;
  }
}
.clinique .row .column.-primary h3, .clinique .row .column.-primary p {
  color: var(--primary-color);
  opacity: 1;
}

.contact .circle-large {
  max-width: 100%;
  position: relative;
}
.contact .circle-large > div {
  text-align: center;
}
.contact .circle-large > div a {
  font-size: 20px;
  font-weight: 400;
}
@media only screen and (min-width:40.01em) {
  .contact .circle-large > div a {
    font-size: 18px;
  }
}
.contact .circle-large > div a.-email {
  font-weight: 300;
  font-style: italic;
}
.contact .circle-large > div a, .contact .circle-large > div h2, .contact .circle-large > div h3, .contact .circle-large > div span {
  color: #fff;
  display: block;
}
.contact .circle-large > div h2 {
  font-size: 28px;
  font-weight: 700;
  margin-bottom: 18px;
}
@media only screen and (min-width:40.01em) {
  .contact .circle-large > div h2 {
    font-size: 24px;
    font-weight: 400;
  }
}
.contact .circle-large > div h3 {
  font-size: 26px;
  margin-bottom: 6px;
}
@media only screen and (min-width:40.01em) {
  .contact .circle-large > div h3 {
    font-size: 24px;
    margin-bottom: 2px;
  }
}
.contact .circle-large > div span {
  font-size: 2px;
  margin-top: 12px;
}
.contact .contact__staff {
  padding: 0 0 12px 0;
}
@media only screen and (min-width:40.01em) {
  .contact .contact__staff {
    border-top: 1px solid var(--primary-color);
    padding-top: 24px;
  }
  .contact .contact__staff.--first {
    border: none;
  }
}
.contact .contact__staff ul .-center {
  text-align: center;
}
.contact .contact__staff ul li a {
  display: block;
}
.contact .contact__staff ul li:last-child {
  /*@media only screen and (min-width:64em) {
  	float: left;
  }*/
}
@media only screen and (min-width:40.01em) {
  .contact .contact__staff ul li:last-child {
    float: right;
  }
}
@media only screen and (min-width:40.01em) {
  .contact .contact__staff ul li:hover .contact__info h2, .contact .contact__staff ul li:hover .contact__info p {
    color: var(--primary-color);
    opacity: 1;
  }
  .contact .contact__staff ul li:hover .contact__photo p {
    opacity: 1;
  }
  .contact .contact__staff ul li:hover .contact__photo .cover {
    opacity: 0.95 !important;
  }
}
.contact .contact__staff .contact__info {
  background: #f2f2f2;
  padding: 18px 0;
  text-align: center;
  border: 1px solid #ccc;
  border-top: none;
}
@media only screen and (min-width:40.01em) {
  .contact .contact__staff .contact__info {
    padding: 18px 0 18px 18px;
    text-align: left;
  }
}
.contact .contact__staff .contact__info h2 {
  font-size: 15px;
  color: #888;
}
@media only screen and (min-width:40.01em) {
  .contact .contact__staff .contact__info h2 {
    font-size: 14px;
  }
}
.contact .contact__staff .contact__info p {
  color: #777;
  display: none;
  margin: 0;
  font-size: 13px;
}
@media only screen and (min-width:40.01em) {
  .contact .contact__staff .contact__info p {
    display: block;
  }
}
.contact .contact__staff .contact__photo {
  border: 1px solid #ccc;
  border-bottom: none;
  position: relative;
}
.contact .contact__staff .contact__photo img {
  width: 100%;
}
.contact .contact__staff .contact__photo p {
  color: #fff;
  display: none;
  font-size: 13px;
  left: 0;
  line-height: 1.4em;
  opacity: 0;
  padding: 0 16px;
  position: absolute;
  top: 12px;
  transition: opacity 1s ease;
  z-index: 5;
}
@media (min-width: 400px) {
  .contact .contact__staff .contact__photo p {
    font-size: 14px;
  }
}
@media only screen and (min-width:40.01em) {
  .contact .contact__staff .contact__photo p {
    display: block;
    font-size: 13px;
  }
}
@media only screen and (min-width:45.01em) {
  .contact .contact__staff .contact__photo p {
    font-size: 14px;
  }
}
@media only screen and (min-width:50.01em) {
  .contact .contact__staff .contact__photo p {
    font-size: 18px;
  }
}
@media only screen and (min-width:64em) {
  .contact .contact__staff .contact__photo p {
    font-size: 15px;
  }
}
@media only screen and (min-width:75.01em) {
  .contact .contact__staff .contact__photo p {
    font-size: 18px;
  }
}
.contact .contact__staff .contact__photo .cover {
  opacity: 0;
  display: block;
  transition: opacity 1s ease;
}

.dropdowns {
  background: #fff;
  display: none;
  z-index: 15;
}
@media only screen and (min-width:50.01em) {
  .dropdowns {
    background: var(--primary-color);
    /*padding: 12px 0px !important;*/
    width: 100%;
    text-align: left;
  }
}
.dropdowns.always-shown {
  background: var(--primary-color);
  width: 100%;
  text-align: left;
  margin-bottom: 10px;
}
.dropdowns.always-shown .dropdown__close {
  display: block;
  width: 24px;
}
.dropdowns .dropdown__close {
  color: #fff;
  cursor: pointer;
  display: none;
  opacity: 1;
  position: absolute;
  right: 12px;
  top: 12px;
  width: 15px;
  z-index: 999;
}
@media only screen and (min-width:50.01em) {
  .dropdowns .dropdown__close {
    display: block;
    width: 18px;
  }
  .dropdowns .dropdown__close:hover {
    opacity: 0.8;
  }
}
@media (min-width: 900px) {
  .dropdowns .dropdown__close {
    width: 24px;
  }
}
@media only screen and (min-width:64em) {
  .dropdowns .dropdown__close {
    width: 24px;
  }
}
.dropdowns .dropdowns__top-level {
  margin: 0;
  padding: 0;
  position: relative;
  z-index: 2;
}
.dropdowns .dropdowns__top-level:before, .dropdowns .dropdowns__top-level:after {
  content: " ";
  display: table;
}
.dropdowns .dropdowns__top-level:after {
  clear: both;
}
@media only screen and (min-width:50.01em) {
  .dropdowns .dropdowns__top-level {
    margin: 12px;
    margin-right: 24px;
  }
}
.dropdowns .dropdowns__top-level li {
  padding: 0;
  width: 100%;
}
.dropdowns .dropdowns__top-level > li {
  border-bottom: 1px solid rgba(227, 28, 24, 0.6);
  cursor: pointer;
  position: relative;
}
.dropdowns .dropdowns__top-level > li:last-child {
  border: none;
}
.dropdowns .dropdowns__top-level > li .fa-angle-down {
  color: var(--primary-color);
  display: none;
}
.dropdowns .dropdowns__top-level > li h2 {
  color: var(--primary-color);
  font-family: "Roboto Condensed", sans-serif;
  font-size: 24px;
  font-weight: 300;
  padding: 16px;
  text-transform: capitalize;
}
@media only screen and (min-width:50.01em) {
  .dropdowns .dropdowns__top-level > li h2 {
    font-size: 18px;
    color: #fff;
    cursor: auto;
    font-size: 14px;
    font-weight: 400;
    padding: 0;
    text-transform: uppercase;
  }
}
@media only screen and (min-width:64em) {
  .dropdowns .dropdowns__top-level > li h2 {
    font-size: 17px;
  }
}
@media (max-width: 783px) {
  .dropdowns .dropdowns__top-level > li ul {
    display: none;
  }
}
.dropdowns .dropdowns__top-level > li ul li {
  background: rgb(251, 221, 221);
  border-top: 1px solid rgba(227, 28, 24, 0.6);
}
@media only screen and (min-width:50.01em) {
  .dropdowns .dropdowns__top-level > li ul li {
    background: var(--primary-color);
    padding: 2px 0;
  }
}
.dropdowns .dropdowns__top-level > li ul li a {
  color: var(--primary-color);
  display: block;
  padding: 12px 0;
  text-decoration: none;
}
@media only screen and (min-width:50.01em) {
  .dropdowns .dropdowns__top-level > li ul li a {
    color: #fff;
    font-size: 14px;
    font-weight: 300;
    display: initial;
    padding: 0 20px 0 0;
  }
}
@media only screen and (min-width:64em) {
  .dropdowns .dropdowns__top-level > li ul li a {
    font-size: 16px;
  }
}
.dropdowns .dropdowns__top-level > li.active .fa-angle-down {
  display: block;
}
@media only screen and (min-width:50.01em) {
  .dropdowns .dropdowns__top-level > li.active > ul {
    display: block;
  }
}
.dropdowns .dropdowns__top-level > li.active > ul.active .fa-angle-down {
  display: block;
}
@media only screen and (min-width:50.01em) {
  .dropdowns .dropdowns__top-level > li.active > ul.active .fa-angle-down {
    display: none;
  }
}
@media only screen and (min-width:50.01em) {
  .dropdowns .dropdowns__top-level > li.active > ul.active > ul {
    display: block;
  }
}
.dropdowns ul.dropdowns_one-level li {
  background: #ffffff;
}
@media only screen and (min-width:50.01em) {
  .dropdowns ul.dropdowns_one-level li {
    background: var(--primary-color);
    padding: 2px 0;
  }
}
.dropdowns ul.dropdowns_one-level li a {
  color: var(--primary-color);
  display: block;
  position: relative;
  padding: 12px 0;
  line-height: normal;
}
@media only screen and (min-width:50.01em) {
  .dropdowns ul.dropdowns_one-level li a {
    color: #fff;
    font-size: 14px;
    font-weight: 300;
    display: initial;
    padding: 0 20px 0 0;
  }
}
@media only screen and (min-width:64em) {
  .dropdowns ul.dropdowns_one-level li a {
    font-size: 18px;
  }
}
.dropdowns hr {
  display: none;
  border: none;
  height: 20px;
  width: 100%;
  overflow: hidden;
}
@media only screen and (min-width:50.01em) {
  .dropdowns hr {
    display: block;
  }
}
.dropdowns hr.-special {
  position: absolute;
  top: 127px;
  left: 12px;
  max-width: 150px;
  z-index: 3;
}
@media only screen and (min-width:64em) {
  .dropdowns hr.-special {
    left: 24px;
    max-width: 180px;
    top: 137px;
  }
}
.dropdowns hr:after {
  color: #fff;
  content: "------------------------------------------------------------------------------------------------------------------------------------------------------------------------------";
  height: 1px;
  white-space: nowrap;
  letter-spacing: 1px;
}
@media only screen and (min-width:64em) {
  .dropdowns.-artists .dropdowns__top-level {
    margin: 12px 12px 12px 24px;
  }
}
.dropdowns.-artists .dropdowns__wrap {
  min-height: unset;
}
@media only screen and (min-width:50.01em) {
  .dropdowns.-artists ul {
    display: block !important;
    column-count: 6;
    column-gap: 12px;
    grid-template-columns: none;
    gap: 0;
  }
  .dropdowns.-artists li {
    padding-right: 0;
    width: auto;
    float: none;
    break-inside: avoid;
    -webkit-column-break-inside: avoid;
    page-break-inside: avoid;
  }
  .dropdowns.-artists li a {
    opacity: 1;
  }
  .dropdowns.-artists li a:hover {
    opacity: 0.8;
  }
}
@media only screen and (min-width:50.01em) {
  .dropdowns.-artists li.-large {
    grid-column: auto;
  }
  .dropdowns.-artists li.-large ul {
    display: block !important;
    column-count: 5;
    column-gap: 15px;
    grid-template-columns: none;
    gap: 0;
  }
  .dropdowns.-artists li.-large li {
    width: auto;
    float: none;
    padding-right: 0;
    break-inside: avoid;
    -webkit-column-break-inside: avoid;
    page-break-inside: avoid;
  }
}
.dropdowns.-search .dropdowns__news-search {
  padding: 24px;
}
.dropdowns.-search .dropdowns__news-search ul {
  margin: 0;
  display: block;
  column-count: 2;
  column-gap: 12px;
}
@media only screen and (min-width:30em) {
  .dropdowns.-search .dropdowns__news-search ul {
    column-count: 3;
  }
}
@media only screen and (min-width:50.01em) {
  .dropdowns.-search .dropdowns__news-search ul {
    column-count: 5;
  }
}
@media only screen and (min-width:64em) {
  .dropdowns.-search .dropdowns__news-search ul {
    column-count: 6;
  }
}
.dropdowns.-search .dropdowns__news-search ul li {
  break-inside: avoid;
  -webkit-column-break-inside: avoid;
  page-break-inside: avoid;
}
@media only screen and (min-width:50.01em) {
  .dropdowns.-search .dropdowns__news-search ul li {
    padding-bottom: 4px;
  }
}
.dropdowns.-search .dropdowns__news-search ul li a {
  color: #fff;
  font-weight: 300;
  opacity: 1;
  cursor: pointer;
  text-decoration: none;
  font-size: 18px;
}
@media only screen and (min-width:50.01em) {
  .dropdowns.-search .dropdowns__news-search ul li a:hover {
    opacity: 0.8;
  }
}
.dropdowns.-search .dropdowns__hashtag-menu {
  background: var(--primary-color);
  height: 100%;
  left: 0;
  overflow-y: auto;
  position: fixed;
  text-align: left;
  top: 0;
  width: 100%;
  z-index: 430;
  -webkit-overflow-scrolling: touch;
}
@media only screen and (min-width:50.01em) {
  .dropdowns.-search .dropdowns__hashtag-menu {
    float: right;
    overflow-y: visible;
    padding: 0px 0 0px 0;
    position: static;
  }
}
.dropdowns.-search .dropdowns__hashtag-menu.active {
  display: block;
}
.dropdowns.-search .dropdowns__hashtag-menu img {
  display: block;
  height: 24px;
  opacity: 1;
  position: fixed;
  right: 24px;
  top: 24px;
  width: 24px;
  z-index: 131;
}
@media only screen and (min-width:50.01em) {
  .dropdowns.-search .dropdowns__hashtag-menu img:not(.-play) {
    display: none;
  }
}
.dropdowns.-search .dropdowns__hashtag-menu ul {
  margin: 0;
}
@media only screen and (min-width:50.01em) {
  .dropdowns.-search .dropdowns__hashtag-menu ul li {
    padding-bottom: 4px;
  }
}
.dropdowns.-search .dropdowns__hashtag-menu ul li a {
  color: #fff;
  font-size: 24px;
  line-height: 1.5em;
  font-weight: 300;
  opacity: 1;
  text-decoration: none;
}
@media only screen and (min-width:50.01em) {
  .dropdowns.-search .dropdowns__hashtag-menu ul li a {
    font-size: 16px;
    opacity: 1;
  }
  .dropdowns.-search .dropdowns__hashtag-menu ul li a:hover {
    opacity: 0.8;
  }
}
.dropdowns.-search hr {
  display: none;
  border: none;
  height: 20px;
  width: 100%;
  overflow: hidden;
}
@media only screen and (min-width:50.01em) {
  .dropdowns.-search hr {
    display: block;
  }
}
.dropdowns.-search hr:after {
  color: #fff;
  content: "---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------";
  height: 1px;
  white-space: nowrap;
}
@media only screen and (min-width:50.01em) {
  .dropdowns.-search .dropdowns__top-level {
    padding-bottom: 8px;
    margin: 12px 12px 0;
    max-width: 160px;
  }
}
@media (min-width: 900px) {
  .dropdowns.-search .dropdowns__top-level {
    margin: 12px 24px 0;
  }
}
.dropdowns.-search .dropdowns__top-level hr {
  display: none;
}
.dropdowns.-search .dropdowns__top-level > li ul {
  display: none;
}
@media only screen and (min-width:50.01em) {
  .dropdowns.-search .dropdowns__top-level > li ul {
    position: absolute;
  }
}
.dropdowns.-search .dropdowns__top-level > li ul li {
  color: var(--primary-color);
  padding: 0;
  position: relative;
}
.dropdowns.-search .dropdowns__top-level > li ul li .fa-angle-down {
  display: none;
}
.dropdowns.-search .dropdowns__top-level > li ul li h2 {
  padding: 12px 0;
}
@media only screen and (min-width:50.01em) {
  .dropdowns.-search .dropdowns__top-level > li ul li h2 {
    padding: 18px 0 0;
  }
}
@media only screen and (min-width:50.01em) {
  .dropdowns.-search .dropdowns__top-level > li.active > h2 {
    opacity: 1;
  }
}
@media only screen and (min-width:50.01em) {
  .dropdowns.-search .dropdowns__top-level > li.active ul li.active > h2 {
    opacity: 1;
  }
}
.dropdowns.-search .dropdowns__top-level h2 {
  cursor: pointer;
  opacity: 1;
  padding: 12px 0;
}
@media only screen and (min-width:50.01em) {
  .dropdowns.-search .dropdowns__top-level h2 {
    opacity: 0.7;
    padding: 0 0 18px;
    text-transform: uppercase;
  }
}
@media only screen and (min-width:50.01em) {
  .dropdowns.-search .angle-down {
    display: none !important;
  }
}

.dropdowns__search {
  display: flex;
  flex-direction: column;
  margin-bottom: 15px;
}
@media only screen and (min-width:50.01em) {
  .dropdowns__search {
    flex-direction: row;
  }
}
.dropdowns__search h2, .dropdowns__search .h2 {
  color: #fff;
  margin-bottom: 12px;
  padding-bottom: 12px;
}
.dropdowns__search > div {
  margin: 10px 0;
  padding-right: 2rem;
}
@media only screen and (min-width:50.01em) {
  .dropdowns__search > div {
    margin: 0;
  }
}
.dropdowns__search > div:first-child {
  width: 100%;
}
@media only screen and (min-width:50.01em) {
  .dropdowns__search > div:first-child {
    width: 30%;
  }
  .dropdowns__search > div:first-child ul {
    column-count: 2;
  }
}
.dropdowns__search > div:last-child {
  width: 100%;
}
@media only screen and (min-width:50.01em) {
  .dropdowns__search > div:last-child ul {
    column-count: 5;
  }
}

@media only screen and (min-width:50.01em) {
  .dropdowns__wrap {
    min-height: 200px;
    margin: 24px;
  }
}
.dropdowns__wrap.-searchnews {
  margin: 0px !important;
}
@media only screen and (min-width:50.01em) {
  .dropdowns__wrap.-searchnews {
    min-height: unset;
  }
}

@media only screen and (min-width:50.01em) {
  .dropdowns.-search .dropdowns__wrap {
    margin: 0;
  }
}

.errors hr {
  margin-bottom: 24px;
}
.errors h4 {
  color: var(--primary-color);
}
.errors .errors__text {
  margin-top: 24px;
  text-align: center;
}
.errors .errors__text > p {
  font-family: "Roboto Condensed", sans-serif;
  font-size: 14px;
  color: #999;
  max-width: 965px;
  margin-left: auto;
  margin-right: auto;
}
@media only screen and (min-width:40.01em) {
  .errors .errors__text > p {
    font-size: 18px;
  }
}
@media only screen and (min-width:50.01em) {
  .errors .errors__text > p {
    font-size: 24px;
  }
}
.errors .errors__text > a {
  color: var(--primary-color);
}
.errors .errors__text > a:hover {
  color: rgba(227, 28, 24, 0.6);
}

/* Le slide sert de référentiel pour le positionnement */
.fancybox__slide {
  position: relative;
  padding: 64px 75px 20px;
}

/* On descend un peu l'image pour créer un espace au-dessus */
.fancybox__slide .fancybox__content {
  margin-top: 40px; /* ajuste la valeur à ton goût (30–60px) */
}

/* On place le nom de l’artiste au-dessus de l’image */
.fancybox__slide .fancybox__artist-name {
  position: absolute;
  top: 60px; /* distance depuis le haut du slide */
  left: 50%;
  color: var(--primary-color);
  transform: translateX(-50%);
  font-size: 22px;
  font-weight: 300;
  text-align: center;
  text-decoration: none;
}

.fancybox__artist-name a {
  color: inherit;
  text-decoration: none;
  color: var(--primary-color);
}

.fancybox__artist-name a:hover {
  text-decoration: none;
}

/* On laisse le reste de la légende en bas comme d'habitude */
.fancybox__slide .fancybox__caption {
  /* tu peux ajuster si besoin */
  padding-top: 10px;
}

/* ===== Fix Vimeo / YouTube dans Fancybox (Firefox) ===== */
/* Zone de contenu pour les slides contenant un iframe */
.fancybox__slide.has-iframe .fancybox__content {
  width: min(90vw, 1600px); /* largeur max raisonnable */
  height: 60vh !important; /* vraie hauteur visible */
  max-height: 90vh; /* éviter de dépasser l'écran */
}

/* L’iframe vidéo prend toute la place disponible */
.fancybox__slide.has-iframe .fancybox__content > .fancybox__iframe {
  width: 100% !important;
  height: 100% !important;
  display: block;
}

/* Supprimer le cadre pointillé autour du contenu Fancybox (Firefox) */
.fancybox__slide,
.fancybox__content {
  outline: none !important;
}

.fancybox__slide:focus,
.fancybox__slide:focus-visible,
.fancybox__content:focus,
.fancybox__content:focus-visible {
  outline: none !important;
}

/* au cas où ce serait un border plutôt qu’un outline */
.fancybox__content {
  padding: 0 !important;
  border: none !important;
}

/* Bouton rond */
.vo-fancybox-close {
  position: fixed;
  top: 24px; /* sous admin bar */
  right: 24px;
  z-index: 999999;
  width: 44px;
  height: 44px;
  border: 0;
  border-radius: 50%;
  background: var(--primary-color);
  cursor: pointer;
  padding: 0;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.15s ease;
}
.admin-bar .vo-fancybox-close {
  top: 56px;
}

/* La croix fine */
.vo-fancybox-close::before,
.vo-fancybox-close::after {
  content: "";
  position: absolute;
  width: 24px; /* longueur des traits */
  height: 2px; /* épaisseur ultra fine */
  background: #fff; /* couleur de la croix */
  border-radius: 1px;
}

.vo-fancybox-close::before {
  transform: rotate(45deg);
}

.vo-fancybox-close::after {
  transform: rotate(-45deg);
}

.vo-fancybox-close:hover {
  background: rgba(0, 0, 0, 0.92);
}

/* Compatibilité admin bar */
body.admin-bar .vo-fancybox-close {
  top: 52px;
}

.fancybox__artist-name--top, .fancybox__artist-name {
  font-size: 18px;
  font-weight: 600;
  text-align: center;
  margin-bottom: 12px;
}

.fancybox__artist {
  font-size: 16px;
  font-weight: 400 !important;
  margin-top: 36px;
  text-align: center;
  text-transform: uppercase;
}
@media only screen and (min-width:40.01em) {
  .fancybox__artist {
    margin-top: 16px;
  }
}

.fancybox-image {
  height: auto !important;
  width: auto !important;
  max-width: 100% !important;
  min-width: 100% !important;
  max-height: none !important;
}

.fancybox-margin {
  margin: 0 !important;
}

.fancybox-close {
  background: url("/images/close-red-thin.svg") !important;
  background-repeat: no-repeat;
  height: 24px !important;
  position: fixed !important;
  right: 24px !important;
  top: 24px !important;
  width: 24px !important;
  z-index: 9000 !important;
}
@media only screen and (min-width:50.01em) {
  .fancybox-close {
    height: 36px !important;
    right: 36px !important;
    width: 36px !important;
  }
}

.fancybox-inner {
  margin: auto !important;
  max-height: none !important;
  height: auto !important;
}

.fancybox-prev span {
  background-image: url("/images/prev.png") !important;
  left: 6px !important;
}
@media only screen and (min-width:50.01em) {
  .fancybox-prev span {
    left: 8px !important;
  }
}

.fancybox-next span {
  background-image: url("/images/next.png") !important;
  right: 6px !important;
}
@media only screen and (min-width:50.01em) {
  .fancybox-next span {
    right: 24px !important; /* right scroll bar (16px) is included in calculation */
  }
}

.fancybox-nav span {
  background-position: 0 !important;
  background-repeat: no-repeat;
  background-size: cover !important;
  bottom: 0 !important;
  height: 56px !important;
  margin-top: none !important;
  top: auto !important;
  visibility: visible !important;
  width: 56px !important;
}

.fancybox-nav {
  height: 60% !important;
  margin-top: 70px !important;
  position: fixed !important;
  width: 62px !important;
}

.fancybox-overlay {
  border-top: 4px solid var(--primary-color);
  background: #FFF none no-repeat scroll 0% 0% !important;
}

.fancybox-skin {
  background: transparent !important;
  box-shadow: 0 0 0 !important;
}

/* Fancybox v5 */
.fancybox__container .fancybox__caption {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto;
  padding: 12px 16px;
  max-height: 40vh; /* scroll if long */
  overflow: auto;
  font-size: 14px;
  line-height: 1.4;
  -webkit-font-smoothing: antialiased;
}

.fancybox__title {
  text-align: center;
  text-transform: uppercase;
  padding: 10px 0 30px;
  font-size: 16px;
}

.fancybox__tags {
  position: relative;
  text-align: center;
  display: block;
}
.fancybox__tags a, .fancybox__tags span {
  background: #DDD;
  border-radius: 3px;
  display: inline-block;
  font-size: 11px;
  font-weight: 400;
  opacity: 0.5;
  margin-right: 6px;
  margin-bottom: 6px;
  padding: 3px 10px;
  text-transform: uppercase;
  z-index: 9001;
  color: #000;
  text-decoration: none;
}
@media only screen and (min-width:50.01em) {
  .fancybox__tags a, .fancybox__tags span {
    font-size: 14px;
  }
  .fancybox__tags a:hover, .fancybox__tags span:hover {
    opacity: 0.8;
  }
}
.fancybox__tags .status {
  background: #999;
  color: #fff;
  display: none;
  padding-left: 6px;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.fancybox__tags .status span {
  padding: 0;
  margin: 0;
}
.fancybox__tags .status .fa {
  background: #999;
  color: rgb(130, 202, 156);
}
@media only screen and (min-width:50.01em) {
  .fancybox__tags .status:hover {
    background: #999;
  }
}
.fancybox__tags span {
  cursor: pointer;
}
.fancybox__tags span.-add, .fancybox__tags span.-remove {
  background: #999;
  color: #fff;
  opacity: 1;
  position: relative;
}
@media only screen and (min-width:50.01em) {
  .fancybox__tags span.-add:hover, .fancybox__tags span.-remove:hover {
    background: #888;
  }
}
.fancybox__tags span.-add {
  display: none;
}
@media only screen and (min-width:50.01em) {
  .fancybox__tags span.-add.active {
    display: inline-block;
  }
}
.fancybox__tags span.-remove {
  display: none;
}
@media only screen and (min-width:50.01em) {
  .fancybox__tags span.-remove.active {
    display: inline-block;
  }
}
@media only screen and (min-width:50.01em) {
  .fancybox__tags span:hover {
    background: #c8c8c8;
  }
}

.fancybox-title {
  color: var(--primary-color);
  font-family: "Roboto Condensed", sans-serif !important;
  font-size: 24px !important;
  font-weight: 300 !important;
  margin-bottom: 24px;
  text-align: center;
}

.fancybox__video-add {
  padding-bottom: 48px !important;
}
@media only screen and (min-width:40.01em) {
  .fancybox__video-add {
    padding-bottom: 100px !important;
  }
}

.fancybox-wrap {
  margin: auto;
  opacity: 1;
  left: 0 !important;
  /*min-width: 280px;*/
  right: 0 !important;
  transition: opacity 0.5s ease;
  /*
  @media (min-width:360px) {
  	min-width: 330px;
  }

  @media (min-width: 405px) {
  	min-width: 370px;
  }

  @media (min-width: 500px) {
  	min-width: 400px;
  }

  @media only screen and (min-width:40.01em) {
  	min-width: 500px;
  }

  @media only screen and (min-width:45.01em) {
  	min-width: 560px;
  }
  */
}
@media (min-width: 100px) {
  .fancybox-wrap {
    margin: auto !important;
  }
}

.fancybox-inner {
  height: auto !important;
  width: auto !important;
}
@media only screen and (max-width: 40em) {
  .fancybox-inner {
    margin: auto;
    max-width: 400px;
  }
}

.fancybox-skin {
  padding: 18px 6px !important;
  margin: auto !important;
}

.fancybox-video {
  display: none;
  overflow-y: hidden;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
}
.fancybox-video .fancybox-vimeo {
  text-align: center;
  position: relative;
  padding-bottom: 56.25%; /* 16:9 ratio */
  height: 0;
}
.fancybox-video .fancybox-vimeo iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.fancybox__thumb {
  border-radius: 0;
}

.fancybox__thumbs {
  --fancybox-thumbs-ratio: 1 !important;
}

.fancybox-type-inline {
  top: 50% !important;
  left: 50% !important;
  margin: -68px 0 0 -120px !important;
}
@media (min-width: 400px) {
  .fancybox-type-inline {
    margin: -95px 0 0 -170px !important;
  }
}
@media (min-width: 500px) {
  .fancybox-type-inline {
    margin: -118px 0 0 -203px !important;
  }
}
@media only screen and (min-width:40.01em) {
  .fancybox-type-inline {
    margin: -135px 0 0 -240px !important;
  }
}
@media only screen and (min-width:45.01em) {
  .fancybox-type-inline {
    margin: -180px 0 0 -320px !important;
  }
}
@media only screen and (min-width:50.01em) {
  .fancybox-type-inline {
    margin: -202px 0 0 -360px !important;
  }
}
@media only screen and (min-width:64em) {
  .fancybox-type-inline {
    margin: -265px 0 0 -470px !important;
  }
}
@media only screen and (min-width:75.01em) {
  .fancybox-type-inline {
    margin: -288px 0 0 -512px !important;
  }
}
.fancybox-type-inline .video-js, .fancybox-type-inline .fancybox-inner, .fancybox-type-inline .fancybox-outer, .fancybox-type-inline .fancybox-skin, .fancybox-type-inline.fancybox-wrap, .fancybox-type-inline.fancybox-desktop {
  min-width: 240px !important;
  height: 135px !important;
}
@media (min-width: 400px) {
  .fancybox-type-inline .video-js, .fancybox-type-inline .fancybox-inner, .fancybox-type-inline .fancybox-outer, .fancybox-type-inline .fancybox-skin, .fancybox-type-inline.fancybox-wrap, .fancybox-type-inline.fancybox-desktop {
    min-width: 340px !important;
    height: 191px !important;
  }
}
@media (min-width: 500px) {
  .fancybox-type-inline .video-js, .fancybox-type-inline .fancybox-inner, .fancybox-type-inline .fancybox-outer, .fancybox-type-inline .fancybox-skin, .fancybox-type-inline.fancybox-wrap, .fancybox-type-inline.fancybox-desktop {
    min-width: 406px !important;
    height: 236px !important;
  }
}
@media only screen and (min-width:40.01em) {
  .fancybox-type-inline .video-js, .fancybox-type-inline .fancybox-inner, .fancybox-type-inline .fancybox-outer, .fancybox-type-inline .fancybox-skin, .fancybox-type-inline.fancybox-wrap, .fancybox-type-inline.fancybox-desktop {
    min-width: 480px !important;
    height: 270px !important;
  }
}
@media only screen and (min-width:45.01em) {
  .fancybox-type-inline .video-js, .fancybox-type-inline .fancybox-inner, .fancybox-type-inline .fancybox-outer, .fancybox-type-inline .fancybox-skin, .fancybox-type-inline.fancybox-wrap, .fancybox-type-inline.fancybox-desktop {
    min-width: 640px !important;
    height: 360px !important;
  }
}
@media only screen and (min-width:50.01em) {
  .fancybox-type-inline .video-js, .fancybox-type-inline .fancybox-inner, .fancybox-type-inline .fancybox-outer, .fancybox-type-inline .fancybox-skin, .fancybox-type-inline.fancybox-wrap, .fancybox-type-inline.fancybox-desktop {
    min-width: 720px !important;
    height: 405px !important;
  }
}
@media only screen and (min-width:64em) {
  .fancybox-type-inline .video-js, .fancybox-type-inline .fancybox-inner, .fancybox-type-inline .fancybox-outer, .fancybox-type-inline .fancybox-skin, .fancybox-type-inline.fancybox-wrap, .fancybox-type-inline.fancybox-desktop {
    min-width: 940px !important;
    height: 529px !important;
  }
}
@media only screen and (min-width:75.01em) {
  .fancybox-type-inline .video-js, .fancybox-type-inline .fancybox-inner, .fancybox-type-inline .fancybox-outer, .fancybox-type-inline .fancybox-skin, .fancybox-type-inline.fancybox-wrap, .fancybox-type-inline.fancybox-desktop {
    min-width: 1024px !important;
    height: 576px !important;
  }
}
.fancybox-type-inline.fancybox-wrap {
  margin-top: -147px !important;
  left: 0 !important;
  right: 0 !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
@media (min-width: 400px) {
  .fancybox-type-inline.fancybox-wrap {
    margin-top: -176px !important;
  }
}
@media (min-width: 500px) {
  .fancybox-type-inline.fancybox-wrap {
    margin-top: -188px !important;
  }
}
@media only screen and (min-width:40.01em) {
  .fancybox-type-inline.fancybox-wrap {
    margin-top: -215px !important;
  }
}
@media only screen and (min-width:45.01em) {
  .fancybox-type-inline.fancybox-wrap {
    margin-top: -260px !important;
  }
}
@media only screen and (min-width:50.01em) {
  .fancybox-type-inline.fancybox-wrap {
    margin-top: -282px !important;
  }
}
@media only screen and (min-width:64em) {
  .fancybox-type-inline.fancybox-wrap {
    margin-top: -344px !important;
  }
}
@media only screen and (min-width:75.01em) {
  .fancybox-type-inline.fancybox-wrap {
    margin-top: -363px !important;
  }
}
.fancybox-type-inline .vjs-big-play-button {
  width: 60px !important;
  height: 60px !important;
  margin-top: -30px !important;
  margin-left: -30px !important;
  border-radius: 100px !important;
}
.fancybox-type-inline .vjs-big-play-button:before {
  line-height: 1.9em !important;
}

.filters {
  padding: 0 0 30px;
  position: relative;
  text-align: center;
}
.filters.-pad-top {
  padding: 24px 0 18px;
}
.filters li, .filters .custom-link {
  border: 1px solid #ccc;
  border-radius: 2px;
  cursor: pointer;
  display: inline-block;
  margin: 0 4px 6px 0;
  transition: all 0.2s ease;
}
@media (min-width: 440px) {
  .filters li, .filters .custom-link {
    margin: 0 6px 6px 0;
  }
}
.filters li:last-child, .filters .custom-link:last-child {
  margin-right: 0;
}
.filters li a, .filters .custom-link a {
  color: #999999;
  display: block;
  font-size: 11px;
  font-weight: 400;
  padding: 1px 6px;
  text-transform: uppercase;
  text-decoration: none;
}
@media (min-width: 440px) {
  .filters li a, .filters .custom-link a {
    font-size: 12px;
    padding: 2px 8px;
  }
}
@media only screen and (min-width:40.01em) {
  .filters li a, .filters .custom-link a {
    font-size: 13px;
  }
}
.filters li .fa.fa-angle-down, .filters .custom-link .fa.fa-angle-down {
  color: #999999;
}
.filters li.-all.active, .filters .custom-link.-all.active {
  background: #f3f3f3;
  border: 1px solid #b3b3b3;
}
.filters li.-all.active a, .filters .custom-link.-all.active a {
  color: #666666;
}
.filters li.-all.is-disabled a, .filters .custom-link.-all.is-disabled a {
  cursor: default;
}
@media only screen and (min-width:50.01em) {
  .filters li.-all:not(.is-disabled):hover, .filters .custom-link.-all:not(.is-disabled):hover {
    background: #FFF;
    border: 1px solid var(--primary-color);
  }
  .filters li.-all:not(.is-disabled):hover a, .filters .custom-link.-all:not(.is-disabled):hover a {
    color: var(--primary-color);
  }
}
.filters li.-odd, .filters .custom-link.-odd {
  display: none;
  background: #f3f3f3;
  border: 1px solid #b3b3b3;
}
@media only screen and (min-width:50.01em) {
  .filters li.-odd, .filters .custom-link.-odd {
    display: inline-block;
  }
}
.filters li.-custom-odd, .filters .custom-link.-custom-odd {
  background: #f3f3f3;
  border: 1px solid #f3f3f3;
}
.filters li.active, .filters .custom-link.active {
  border: 1px solid var(--primary-color);
  background: #fff;
}
.filters li.active a, .filters .custom-link.active a {
  color: var(--primary-color);
  opacity: 1;
}
.filters li.active .fa.fa-angle-down, .filters .custom-link.active .fa.fa-angle-down {
  color: var(--primary-color);
}
@media only screen and (min-width:50.01em) {
  .filters li:not(.is-disabled):hover, .filters .custom-link:not(.is-disabled):hover {
    border: 1px solid var(--primary-color);
    background: #fff;
  }
  .filters li:not(.is-disabled):hover a, .filters .custom-link:not(.is-disabled):hover a {
    color: var(--primary-color);
    opacity: 1;
  }
  .filters li:not(.is-disabled):hover .fa.fa-angle-down, .filters .custom-link:not(.is-disabled):hover .fa.fa-angle-down {
    color: var(--primary-color);
  }
}
.filters .filters__close {
  cursor: pointer;
  display: none;
  height: 20px;
  position: absolute;
  right: 0;
  top: 6px;
  width: 20px;
}

.taxonomy-links {
  margin: 1.25rem 0 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}
.taxonomy-links li {
  margin: 0;
}
.taxonomy-links li a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.45rem 0.9rem;
  border: 1px solid #e5e7eb;
  background: #fff;
  color: #9aa0a6;
  text-decoration: none;
  font-weight: 400;
  text-transform: uppercase;
  line-height: 1;
  font-size: 0.8125rem;
  transition: border-color 0.2s ease, color 0.2s ease, background-color 0.2s ease, transform 0.15s ease;
}
.taxonomy-links li a.has-caret::after {
  content: "▾";
  margin-left: 0.5rem;
  font-size: 0.75em;
  opacity: 0.6;
}
.taxonomy-links li a:hover {
  border-color: rgb(205.9391304348, 209.7130434783, 217.2608695652);
  transform: translateY(-1px);
}
.taxonomy-links li a:active {
  transform: translateY(0);
}
.taxonomy-links li a:focus-visible {
  outline: 2px solid rgba(var(--primary-color), 0.5);
  outline-offset: 2px;
}
.taxonomy-links li.active a, .taxonomy-links li.is-active a,
.taxonomy-links li a[aria-current=page] {
  border-color: var(--primary-color);
  color: var(--primary-color);
  background: rgba(var(--primary-color), 0.1);
}

.morewrap {
  display: flex;
  justify-content: center;
  margin: 2rem 0;
  position: relative;
}
.morewrap .grid-sentinel {
  position: absolute;
}
.morewrap .btn.btn-more,
.morewrap .js-grid-more,
.morewrap .js-loadmore, .morewrap .js-copy-toggle {
  -webkit-appearance: none;
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  height: auto !important;
  padding: 0.5rem 1rem;
  border-radius: 0;
  border: 1px solid var(--primary-color);
  background: #FFF;
  color: var(--primary-color);
  font: inherit;
  font-weight: 400;
  text-transform: uppercase;
  line-height: 1;
  text-decoration: none;
  cursor: pointer;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease, transform 0.15s ease;
}
.morewrap .btn.btn-more:hover,
.morewrap .js-grid-more:hover,
.morewrap .js-loadmore:hover, .morewrap .js-copy-toggle:hover {
  background: var(--primary-color);
  color: #000;
}
.morewrap .btn.btn-more:active,
.morewrap .js-grid-more:active,
.morewrap .js-loadmore:active, .morewrap .js-copy-toggle:active {
  transform: translateY(0);
}
.morewrap .btn.btn-more:focus-visible,
.morewrap .js-grid-more:focus-visible,
.morewrap .js-loadmore:focus-visible, .morewrap .js-copy-toggle:focus-visible {
  outline: 2px solid rgba(var(--primary-color), 0.5);
  outline-offset: 2px;
}
.morewrap .btn.btn-more.is-loading,
.morewrap .js-grid-more.is-loading,
.morewrap .js-loadmore.is-loading, .morewrap .js-copy-toggle.is-loading {
  pointer-events: none;
  opacity: 0.9;
}
.morewrap .btn.btn-more.is-loading::after,
.morewrap .js-grid-more.is-loading::after,
.morewrap .js-loadmore.is-loading::after, .morewrap .js-copy-toggle.is-loading::after {
  content: "";
  width: 1em;
  height: 1em;
  border: 2px solid currentColor;
  border-right-color: transparent;
  border-radius: 50%;
  display: inline-block;
  animation: vo-spin 0.6s linear infinite;
}

@keyframes vo-spin {
  to {
    transform: rotate(360deg);
  }
}
@media (max-width: 640px) {
  .taxonomy-links {
    gap: 0.4rem;
  }
  .taxonomy-links li a {
    padding: 0.45rem 0.8rem;
    font-size: 0.8rem;
  }
  .morewrap .btn.btn-more,
  .morewrap .js-grid-more,
  .morewrap .js-loadmore {
    padding: 0.5rem 0.9rem;
  }
}
.home {
  /* Slick shouldn’t collapse the container */
}
@media only screen and (min-width:50.01em) {
  .home hr {
    display: none;
  }
}
.home .home__splash {
  visibility: visible;
  position: relative;
  width: 100%;
  overflow: hidden;
  max-height: 280px;
  margin-bottom: 30px;
  /* ===== Square slider on mobile ===== */
}
.home .home__splash.is-pending {
  visibility: hidden;
}
.home .home__splash.is-ready {
  visibility: visible;
}
.home .home__splash.slick-initialized {
  visibility: visible !important;
}
.home .home__splash .home__splash-slide {
  position: relative;
}
.home .home__splash .home__splash-media {
  width: 100%;
}
.home .home__splash .home__splash-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.home .home__splash .home__splash-text {
  position: absolute;
  left: 10px;
  bottom: 10px;
  text-align: left;
}
.home .home__splash a.caption {
  color: #000;
  text-decoration: none;
  background: #fff;
  display: inline-block;
  margin-bottom: 5px;
  padding: 3px 12px;
  opacity: 0;
  transition: opacity 0.5s ease-in-out 0.8s;
}
.home .home__splash a.caption:nth-of-type(2) {
  background-color: var(--primary-color); /* use your theme variable */
}
@media (max-width: 600px) {
  .home .home__splash {
    /* Force a 1:1 box and let images cover it */
    aspect-ratio: 1/1;
    max-height: none; /* stop capping height */
    /* Neutralise the server-passed ratio vars on small screens */
    --splash-w: 1;
    --splash-h: 1;
    /* Ensure all slick wrappers inherit the square height */
    /* Tighter caption spacing on mobile */
  }
  .home .home__splash .slick-list,
  .home .home__splash .slick-track,
  .home .home__splash .home__splash-slide,
  .home .home__splash .home__splash-media {
    height: 100%;
  }
  .home .home__splash .home__splash-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
  }
  .home .home__splash .home__splash-text {
    left: 8px;
    right: 8px;
    bottom: 8px;
  }
  .home .home__splash a.caption {
    padding: 6px 10px;
    font-size: 14px;
    line-height: 1.2;
    opacity: 1; /* slightly stronger on small screens */
  }
}
.home .home__splash .slick-list,
.home .home__splash .slick-track {
  height: 100%;
}
.home .slick-slide {
  height: auto;
  position: relative;
}
.home .slick-active a.caption, .home .slick-current a.caption {
  opacity: 1;
}

/* Fallback for very old browsers without aspect-ratio */
@supports not (aspect-ratio: 1/1) {
  @media (max-width: 600px) {
    .home .home__splash {
      position: relative;
    }
    .home .home__splash::before {
      content: "";
      display: block;
      padding-top: 100%; /* 1:1 */
    }
    .home .home__splash .slick-list,
    .home .home__splash .slick-track,
    .home .home__splash .home__splash-slide,
    .home .home__splash .home__splash-media {
      position: absolute;
      inset: 0;
      height: 100%;
    }
  }
}
.home-firsth2 {
  text-align: center;
  margin: 2em 0 1em;
  padding-bottom: 0.5rem;
}

.home-disciplines, .home .home-metrics, .home-copy, .home-logos, .home-news, .home-faq {
  margin: 2.5rem 0;
}

.home .home-metrics {
  padding-top: 2.5rem;
  border-top: 1px solid var(--primary-color);
}
.home-metrics .metrics {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 2rem;
  list-style: none;
  padding: 0;
  margin: 0;
}
@media (max-width: 1100px) {
  .home-metrics .metrics {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 400px) {
  .home-metrics .metrics {
    grid-template-columns: 1fr;
  }
}
.home-metrics .metric-tile {
  background: #eef9f2;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  aspect-ratio: 1/1; /* always square */
}
@media (max-width: 500px) {
  .home-metrics .metric-tile {
    aspect-ratio: initial; /* always square */
  }
}
.home-metrics .metric-inner {
  padding: 1.5rem;
}
.home-metrics .metric-value {
  font-family: "Boldonse", sans-serif;
  font-size: 3.2em;
  line-height: 1;
  color: #000;
  margin-bottom: 1rem;
}
@media (max-width: 1100px) {
  .home-metrics .metric-value {
    font-size: 2em;
  }
}
.home-metrics .metric-labels {
  display: grid;
  justify-items: center;
}
.home-metrics .metric-tag {
  display: inline;
  text-transform: uppercase;
  color: #000;
  line-height: 1.2;
  background: var(--primary-color);
  padding: 0 0.3em;
  border-radius: 2px;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
}
.home-metrics .metric-sub {
  text-transform: uppercase;
}

.home-disciplines {
  overflow: hidden;
}
.home-disciplines .section-title {
  margin-bottom: 1.25rem;
}

.grid-disciplines {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 1.25rem;
}

/* ✅ 6 colonnes */
.grid-disciplines > .card {
  width: calc((100% - 6.25rem) / 6);
  max-width: 220px;
}

/* 4 colonnes */
@media (max-width: 1280px) {
  .grid-disciplines > .card {
    width: calc((100% - 3.75rem) / 4);
  }
}
/* 2 colonnes */
@media (max-width: 768px) {
  .grid-disciplines > .card {
    width: calc((100% - 1.25rem) / 2);
  }
}
/* 1 colonne */
@media (max-width: 520px) {
  .grid-disciplines > .card {
    width: min(420px, 100%);
  }
}
.card-discipline {
  width: 100%;
  max-width: 200px;
}

/* Card */
.card-discipline {
  background: #fff;
  border: 1px solid #cccccc;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.02) inset;
  transition: box-shadow 0.2s ease, transform 0.2s ease;
  padding: 0;
  /* Square thumbnail using background-image from PHP inline style */
  /* Under-text */
}
.card-discipline:hover {
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.07);
  transform: translateY(-1px);
}
.card-discipline__thumb {
  position: relative;
  display: block;
  aspect-ratio: 1/1; /* always square */
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  overflow: hidden;
  /* Centered white label */
}
.card-discipline__thumb .card-discipline__title {
  font-family: "Boldonse", sans-serif;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  background: #fff;
  color: #111;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  padding: 0.8rem 1.2rem;
  line-height: 1;
  white-space: nowrap;
}
.card-discipline .link-under {
  margin: 0.75rem 1rem 1rem;
  color: #222;
  text-align: center;
}
.card-discipline .link-under a {
  color: inherit;
  text-decoration: none;
}
.card-discipline .link-under a:hover {
  border-color: #000;
}

/* Generic multiline highlight */
.hl {
  display: inline; /* keep it inline */
  background: var(--primary-color); /* green */
  color: #000;
  padding: 0.15em 0.25em; /* subtle top/bottom + side padding */
  border-radius: 2px;
  /* replicate background/padding on every wrapped line */
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
  /* small horizontal bleed so highlight reaches line edges cleanly */
  box-shadow: 0.18em 0 0 var(--primary-color), -0.18em 0 0 var(--primary-color);
}

/* If you prefer the “marker stroke” look instead of full fill: */
.hl--marker {
  display: inline;
  background: linear-gradient(transparent 62%, var(--primary-color) 0);
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
  padding: 0 0.05em; /* optional, tiny side spacing */
}

.copy-inner {
  max-height: 30rem;
  overflow: hidden;
  transition: max-height 0.3s ease;
  font-size: 20px;
}
.copy-inner p {
  font-size: 20px;
  line-height: 1.4em;
}
.copy-inner h2, .copy-inner h3, .copy-inner h4 {
  line-height: normal;
  color: var(--primary-color);
  line-height: 1.5em;
}
.copy-inner.is-collapsed {
  max-height: 28rem;
}
.copy-inner:not(.is-collapsed) {
  max-height: none;
}
.copy-inner em {
  font-style: normal; /* remove italic if not desired */
  background: var(--primary-color); /* highlight colour */
  color: #000;
  padding: 0.05em 0.15em;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
  box-shadow: 0.18em 0 0 var(--primary-color), -0.18em 0 0 var(--primary-color); /* side bleed */
}

.home-copy h3, .home-copy h4, .home-copy h5 {
  text-transform: uppercase;
}
.home-copy .morewrap {
  justify-content: start;
  border-top: 1px solid var(--primary-color);
}
.home-copy .morewrap .btn {
  background-color: #000;
  text-transform: unset;
  border: none;
  color: #fff;
  font-size: 21px;
  font-style: italic;
  padding: 0.5rem 1.5rem;
}

.btn {
  display: inline-block;
  padding: 0.75rem 1rem;
  border: 1px solid var(--line);
}

.news-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
}

.news-card {
  background: var(--card);
  overflow: hidden;
}
.news-card img {
  width: 100%;
  display: block;
}
.news-card .h5 {
  margin: 0.75rem 1rem;
  font-size: 1.05rem;
}
.news-card time {
  color: var(--muted);
  display: block;
  margin: 0 1rem 1rem;
}

/* ============================ */
/*  Logos Clients (réassurance) */
/* ============================ */
.home-logos {
  background-color: #edf8f0;
  padding: 5rem 5rem;
  text-align: center;
  /* 4 columns */
  /* 3 columns */
  /* 2 columns */
}
.home-logos h2 {
  font-size: 16px;
  font-weight: 700;
  font-family: Roboto Condensed, sans-serif;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  margin: 0;
}
.home-logos .logos {
  /* 5 columns desktop, responsive grid */
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 3rem 3rem;
  list-style: none;
  margin: 3.5rem auto 0;
  padding: 0;
  max-width: 1200px;
}
.home-logos .logos li {
  display: grid;
  place-items: center;
  opacity: 0.85;
  transition: opacity 0.25s ease, transform 0.25s ease;
}
.home-logos .logos li:hover {
  opacity: 1;
}
.home-logos .logos li img {
  max-height: 100px; /* <= your constraint */
  max-width: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
  filter: grayscale(100%);
  transition: filter 0.25s ease;
}
.home-logos .logos li:hover img {
  filter: grayscale(0);
}
@media (max-width: 1200px) {
  .home-logos .logos {
    grid-template-columns: repeat(4, 1fr);
    gap: 2.5rem;
  }
}
@media (max-width: 900px) {
  .home-logos .logos {
    grid-template-columns: repeat(3, 1fr);
    gap: 2rem;
  }
  .home-logos h2 {
    font-size: 0.95rem;
  }
}
@media (max-width: 600px) {
  .home-logos {
    padding: 3.5rem 1.25rem;
  }
  .home-logos .logos {
    grid-template-columns: repeat(2, 1fr);
    gap: 1.5rem;
  }
  .home-logos h2 {
    font-size: 0.9rem;
  }
}

.home-faq .section-title {
  margin-bottom: 2rem;
}

.accordion .item + .item {
  margin-top: 1rem;
  padding-top: 1rem;
}

/* ============================ */
/*  Accordion FAQ Styles        */
/* ============================ */
.accordion .item {
  border: 1px solid #e0efe4;
  margin-bottom: 1rem;
  border-radius: 0;
  background-color: #fff;
  transition: background-color 0.3s ease, border-color 0.3s ease;
  /* === OPEN STATE === */
  /* OPEN STATE */
}
.accordion .item h3 {
  margin: 0;
}
.accordion .item h3 .accordion__btn {
  width: 100%;
  text-align: left;
  font-size: 1rem;
  padding: 1.4rem 1rem;
  color: #000;
  background: none;
  border: none;
  cursor: pointer;
  transition: color 0.3s ease;
  position: relative;
}
.accordion .item h3 .accordion__btn:hover {
  color: var(--primary-color, #1ea463);
}
@media only screen and (min-width:50.01em) {
  .accordion .item h3 .accordion__btn {
    font-size: 1.4rem;
  }
}
.accordion .item .accordion__panel {
  padding: 1.4rem 1rem;
}
.accordion .item .accordion__panel p {
  margin: 0;
  line-height: 1.6;
}
.accordion .item .accordion__btn[aria-expanded=true] {
  color: #000;
}
.accordion .item .accordion__btn[aria-expanded=true] + .accordion__panel {
  display: block;
}
.accordion .item.is-open {
  background-color: #edf8f0;
}
.accordion .item.is-open .accordion__panel {
  display: block;
}
.accordion .item.is-open strong {
  background-color: var(--primary-color, #6fe699);
  padding: 0 0.2em;
}

.js-grid-limit .is-hidden {
  display: none !important;
}

.home-morewrap {
  text-align: center;
  margin: 1rem 0 2rem;
}

.home-news {
  margin: 2.5rem 0;
}
.home-news .news-slider {
  padding-top: 40px;
}
.home-news .news-card {
  background: var(--card);
  overflow: hidden;
  margin: 0 0.5rem;
}
.home-news .news-card:hover a {
  color: var(--primary-color);
}
.home-news .news-thumb {
  display: block;
  position: relative;
}
.home-news .news-thumb img {
  width: 100%;
  height: auto;
  display: block;
}
.home-news .news-thumb .news-thumb__placeholder {
  width: 100%;
  padding-top: 56%;
  background: #eee;
}
.home-news .news-thumb .-play {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 48px;
  height: 48px;
  pointer-events: none;
}
.home-news .news-title {
  margin: 1.5rem 1rem 0.5rem;
  font-size: 13px;
  line-height: 1.5em;
  text-align: center;
}
.home-news .news-title a {
  color: #000;
  text-decoration: none;
}
.home-news .news-time {
  color: var(--muted);
  display: block;
  margin: 0 1rem 1rem;
}
.home-news .news-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
}

.slick-prev, .slick-next {
  width: 36px;
  height: 36px;
}

.vo-story em, .vo-hero__intro em {
  font-style: normal;
  background: var(--primary-color);
  color: #000;
  padding: 0.15em 0.25em;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
  box-shadow: 0.18em 0 0 var(--primary-color), -0.18em 0 0 var(--primary-color);
}

.vo-story {
  /* remove top margin on the very next block after a heading */
}
.vo-story h2, .vo-story h3, .vo-story h4 {
  font-style: normal;
  background: var(--primary-color);
  color: #000;
  padding: 0.15em 0.25em;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
  box-shadow: 0.18em 0 0 var(--primary-color), -0.18em 0 0 var(--primary-color);
  font-size: inherit;
  text-transform: none;
  font-family: "Roboto Condensed", sans-serif;
  margin: 0;
  line-height: normal;
  display: inline;
}
.vo-story h2 + h3,
.vo-story h2 + h4,
.vo-story h2 + p,
.vo-story h3 + h4,
.vo-story h3 + p,
.vo-story h4 + p {
  margin-top: 0 !important;
}

/* ============================ */
/*  Bloc "En quelques mots"    */
/* ============================ */
.home-about {
  padding-bottom: 0;
  /* Intro verte */
  /* Histoire */
}
.home-about .section-title {
  font-family: "Boldonse", sans-serif;
  text-transform: uppercase;
  text-align: center;
  color: var(--primary-color);
  line-height: 1.5em;
  margin: 0;
}
.home-about .about-intro {
  background-color: #f0faf4;
  padding: 3rem 2rem;
  text-align: center;
}
.home-about .about-intro .section-title {
  font-size: 26px;
  padding: 15px 0 30px 0;
}
@media only screen and (min-width:50.01em) {
  .home-about .about-intro .section-title {
    font-size: 35px;
  }
}
.home-about .about-intro .lead {
  margin: 0 auto 1rem;
}
.home-about .about-intro .lead p {
  margin: 0;
  line-height: 1.5;
  font-weight: 400;
  font-size: 17px;
}
.home-about .about-intro .lead em {
  font-style: normal;
  background: var(--primary-color);
  color: #000;
  padding: 0.15em 0.25em;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
  box-shadow: 0.18em 0 0 var(--primary-color), -0.18em 0 0 var(--primary-color);
}
.home-about .about-intro .mission {
  display: inline-block;
  background-color: var(--primary-color);
}
.home-about .about-history {
  margin-top: 2rem;
  text-align: left;
}
.home-about .about-history .history-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 2rem;
  margin-top: 2rem;
}
.home-about .about-history .history-item {
  border: none;
}
.home-about .about-history .history-item .year {
  font-family: "Boldonse", sans-serif;
  font-size: 2.3rem;
  margin-bottom: 0.8rem;
  color: #000;
}
.home-about .about-history .history-item p {
  font-weight: 400;
  line-height: 1.6;
}
@media (max-width: 768px) {
  .home-about .about-intro {
    padding: 2rem 1.2rem;
  }
  .home-about .about-history .year {
    font-size: 2rem;
  }
}

.section-divider {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.5rem; /* space between text and lines */
  width: 100%;
  text-align: center;
  color: var(--primary-color); /* same green tone as your example */
  text-transform: uppercase;
  line-height: 1.4em;
}

.section-divider::before,
.section-divider::after {
  content: "";
  flex: 1;
  height: 1px;
  background-color: var(--primary-color);
  opacity: 0.7; /* subtle transparency like your image */
}

.section-divider span {
  line-height: 1.5em;
  font-size: 21.5px;
}

.vo-philo {
  --gap: 30px;
}
.vo-philo .vo-philo__hero {
  position: relative;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  aspect-ratio: 37/9;
  margin-bottom: var(--gap);
}
.vo-philo .vo-philo__title {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  text-align: center;
  padding: 0 2rem;
  font-size: clamp(28px, 3vw, 36px);
  line-height: 1.4;
  color: #fff;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.45);
}
.vo-philo .vo-philo__cols {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--gap);
}
.vo-philo .vo-philo__cols.container {
  margin: 0;
  padding: 0;
}
.vo-philo .vo-philo__cols .vo-philo__col {
  font-size: clamp(18px, 2vw, 26px);
  line-height: 1.5;
  color: var(--primary-color, #6fe699);
}
.vo-philo .vo-philo__cols .vo-philo__col p {
  margin: 0 0 0.6em;
}
.vo-philo .vo-philo__cols .vo-philo__col ul, .vo-philo .vo-philo__cols .vo-philo__col ol {
  margin: 0.6em 0 0.6em 1.2em;
}
.vo-philo .vo-philo__cols .vo-philo__col strong {
  font-weight: 700;
}
@media (max-width: 1024px) {
  .vo-philo .vo-philo__cols {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 640px) {
  .vo-philo .vo-philo__cols {
    grid-template-columns: 1fr;
  }
  .vo-philo .vo-philo__hero {
    aspect-ratio: 16/9;
  }
}

.apropos-cta {
  text-align: center;
  margin: 80px 0;
}
.apropos-cta__title {
  text-transform: uppercase;
  color: var(--primary-color, #6fe699);
  margin: 0 0 18px;
}
.apropos-cta__subtitle {
  max-width: 900px;
  margin: 0 auto 24px;
  font-size: clamp(16px, 1.6vw, 20px);
  line-height: 1.6;
}
.apropos-cta__subtitle strong {
  font-weight: 700;
}
.apropos-cta__subtitle em {
  font-style: italic;
}
.apropos-cta__subtitle p {
  margin: 0 0 0.6em;
}
.apropos-cta__actions {
  margin-top: 18px;
}
.apropos-cta .btn {
  display: inline-block;
  padding: 10px 30px;
  font-style: italic;
  font-size: clamp(16px, 1.6vw, 22px);
  text-decoration: none;
  border: 1px solid #000;
  background: transparent;
  color: #000;
  transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.apropos-cta .btn--black {
  background: #000;
  color: #fff;
  border-color: #000;
}
.apropos-cta .btn--black:hover {
  background: transparent;
  color: #000;
}

.vo-hero__intro {
  text-align: center;
}

.elementor .hovergreen a:hover {
  color: var(--primary-color) !important;
}

.book__aimeriezaussi {
  margin-bottom: 40px;
}
.book__aimeriezaussi.more-artists-bottom {
  margin-bottom: 100px;
}
.book__aimeriezaussi .section-title {
  text-align: center;
  margin-bottom: 40px;
}
.book__aimeriezaussi ul.list {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 30px;
  list-style: none;
  margin: 0;
  padding: 0;
  position: relative;
}
@media (max-width: 1024px) {
  .book__aimeriezaussi ul.list {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media (max-width: 768px) {
  .book__aimeriezaussi ul.list {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 480px) {
  .book__aimeriezaussi ul.list {
    grid-template-columns: 1fr;
  }
}
.book__aimeriezaussi ul.list .grid-item {
  width: 100% !important;
  padding: 0;
  border: 1px solid #ccc;
}
.book__aimeriezaussi ul.list .grid-item a {
  display: block;
  text-decoration: none;
  color: inherit;
  transition: transform 0.3s ease;
}
.book__aimeriezaussi ul.list .grid-item .list__image {
  width: 100%;
  aspect-ratio: 3/4;
  overflow: hidden;
  background: #f6f6f6;
  opacity: 1;
}
.book__aimeriezaussi ul.list .grid-item .list__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.book__aimeriezaussi ul.list .grid-item .list__content {
  text-align: center;
  padding: 15px 10px 25px;
}

.slick-track {
  padding: 0px 0;
}

.list {
  text-align: center;
}
.list.-home {
  margin: -15px; /* half of 30px to balance item padding */
}
.list.-home li {
  /*float:left;*/ /* remove this */
  padding: 15px; /* half of 30px → gives 30px total gap */
  box-sizing: border-box;
  display: inline-block;
  text-align: center;
  vertical-align: top;
  width: 50%;
  /* Positionnement overlay */
  /* Style générique badge */
  /* "Nouveau" (vert, à gauche) */
  /* "Mis à jour" (blanc, à droite) */
}
.list.-home li .slick-track {
  padding: 0;
}
.list.-home li .grid-item-inner {
  border: 1px solid #ccc;
}
.list.-home li .badges {
  position: absolute;
  inset: 20px 20px auto 20px;
  pointer-events: none; /* cliquable en dessous */
  display: flex;
  gap: 20px;
  z-index: 9;
}
.list.-home li .badge {
  pointer-events: auto;
  display: inline-block;
  padding: 0.35rem 0.6rem;
  line-height: 1;
  white-space: nowrap;
}
.list.-home li .badge.-new {
  background: var(--primary-color, #6fe699); /* ton vert thème */
}
.list.-home li .badge.-updated {
  background: #fff;
}
.list.-home li.js-imgitem {
  overflow: hidden;
}
.list.-home li.js-imgitem a {
  padding-top: 15px;
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  text-decoration: none;
}
.list.-home li.js-imgitem .list__image {
  position: relative;
  width: 100%;
  aspect-ratio: 3/4;
  overflow: hidden;
  cursor: pointer;
}
.list.-home li.js-imgitem .list__image .slick-list,
.list.-home li.js-imgitem .list__image .slick-track,
.list.-home li.js-imgitem .list__image .slick-slide {
  height: 100%;
}
.list.-home li.js-imgitem .list__image .slick-slide {
  aspect-ratio: 3/4;
}
.list.-home li.js-imgitem .list__image .slick-slide .background {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.list.-home li.js-imgitem .list__content {
  text-align: center;
  padding-top: 10px;
}
@media only screen and (min-width:40.01em) {
  .list.-home li {
    width: 32.3333333%;
  }
}
@media only screen and (min-width:50.01em) {
  .list.-home li {
    width: 33.333%;
  }
}
@media only screen and (min-width:64em) {
  .list.-home li {
    width: 25%;
  }
}
@media (max-width: 30em) {
  .list.-home li {
    width: 100%;
  }
}
.list.-home .list__content {
  transition: all 0.2s ease;
  flex-shrink: 0;
  text-align: center;
  font-size: 1rem;
}
@media only screen and (min-width:40.01em) {
  .list.-home .list__content {
    padding: 25px;
  }
}
.list li {
  margin: 0;
}
.list li a {
  display: block;
}
@media only screen and (min-width:50.01em) {
  .list li:hover a {
    /*
    .list__image {
    	.cover, .-plus {
    		display: block;
    	}
    }
    */
  }
  .list li:hover a .list__content p, .list li:hover a .list__content span {
    color: var(--primary-color);
    opacity: 0.8;
  }
}
@media only screen and (min-width:50.01em) {
  .list li a:hover {
    /*
    .list__image {
    	.cover, .-plus {
    		display: block;
    	}
    }
    */
  }
  .list li a:hover .list__content p, .list li a:hover .list__content span {
    color: var(--primary-color);
    opacity: 0.8;
  }
}
.list .list__content {
  background: #FFF;
  padding: 24px 0;
  position: relative;
}
.list .list__content div {
  color: #fff;
  display: none;
  font-family: "Boldonse", sans-serif;
  font-size: 10px;
  font-weight: 700;
  line-height: 1em;
  padding: 5px 10px;
  position: absolute;
  right: 0;
  top: 0;
  text-transform: uppercase;
}
@media only screen and (min-width:40.01em) {
  .list .list__content div {
    display: block;
  }
}
.list .list__content div.-new {
  background: var(--primary-color);
}
.list .list__content div.-update {
  background: #999;
}
.list .list__content p, .list .list__content span.fullname {
  font-family: "Boldonse", sans-serif;
  line-height: 0.7em;
  margin-bottom: 0;
  color: #000;
  text-transform: uppercase;
  transition: all 0.2s ease;
}
.list .list__content span {
  display: none;
  font-size: 12px;
  font-weight: 400;
  color: #ccc;
  text-transform: uppercase;
}
@media only screen and (min-width:40.01em) {
  .list .list__content span {
    display: block;
  }
}
.list .list__content span.fullname {
  display: block;
  font-weight: inherit;
  font-size: 13px;
}
.list .list__image {
  position: relative;
  margin: 0;
}
.list .list__image img {
  width: 100%;
}
.list .list__image img.-plus {
  display: none;
  height: 36px;
  width: 36px;
  z-index: 2;
  position: absolute;
  margin: auto;
  text-align: center;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}

@media only screen and (min-width:64em) {
  .news .dropdowns.-artists {
    padding-left: 12px !important;
  }
}
.news.active-seule .grid.-seule .grid-item {
  margin: 0 auto 24px;
  right: 0 !important;
}
.news.active-seule .grid.-seule .grid-item h1 {
  padding: 20px 0;
  text-align: left;
  line-height: 1.6em;
}
.news.active-seule .news__seule {
  display: block;
}
.news .grid {
  margin-bottom: 12px;
}
.news .news__filters {
  border-bottom: 1px solid #888;
  display: none;
  margin-bottom: 24px;
  padding: 24px 0;
}
@media only screen and (min-width:50.01em) {
  .news .news__filters {
    display: block;
  }
}
@media only screen and (min-width:64em) {
  .news .news__filters {
    padding: 36px 0 16px 0;
  }
}
.news .news__filters .dropdowns {
  position: relative;
  /*margin-top: 24px;*/
  margin-bottom: 10px;
  top: 0;
  /*padding: 12px 0px;*/
}
.news .news__filters .dropdowns .dropdowns__top-level {
  margin: 0;
  padding: 24px 12px;
}
@media only screen and (min-width:50.01em) {
  .news .news__filters .dropdowns.-search {
    /*padding: 12px 0;*/
  }
}
.news .news__filters > ul {
  text-align: center;
  padding-bottom: 20px;
}
.news .news__filters > ul li {
  display: inline-block;
  font-size: 14px;
  opacity: 0.6;
  padding: 0;
  text-transform: uppercase;
}
.news .news__filters > ul li.-filter {
  cursor: pointer;
}
@media only screen and (min-width:50.01em) {
  .news .news__filters > ul li.-filter:hover {
    color: var(--primary-color);
    opacity: 1;
  }
  .news .news__filters > ul li.-filter:hover span {
    color: var(--primary-color);
    border: 1px solid var(--primary-color);
  }
}
.news .news__filters > ul li.-filter.active {
  color: var(--primary-color);
  opacity: 1;
}
.news .news__filters > ul li.-filter.active span {
  color: var(--primary-color);
  border: 1px solid var(--primary-color);
}
.news .news__filters > ul li.-filter.selected {
  color: var(--primary-color);
  opacity: 1;
}
.news .news__filters > ul li.-filter.selected span {
  color: #000;
  opacity: 0.6;
}
@media only screen and (min-width:50.01em) {
  .news .news__filters > ul li.-filter.selected:hover span {
    color: var(--primary-color);
    opacity: 1;
  }
}
.news .news__filters > ul li.-filter.set-state {
  color: var(--primary-color);
  opacity: 1;
}
.news .news__filters > ul li:first-child {
  font-weight: 400;
}
.news .news__filters > ul span {
  color: #999;
  border: 1px solid #999;
  border-radius: 3px;
  padding: 0 2px;
  margin-left: 6px;
}
.news .news__seule {
  border-top: 1px solid rgba(0, 0, 0, 0.7);
  display: none;
}
.news .news__seule h3 {
  color: var(--primary-color);
  font-size: 22px;
  font-weight: 300;
  margin: 24px 0;
  text-align: center;
}

.news-item-seule {
  opacity: 0;
  transition: opacity 1s ease;
}
.news-item-seule.-loaded {
  opacity: 1;
}

.-news {
  opacity: 0;
  transition: opacity 1s ease;
}
.-news.-loaded {
  opacity: 1;
}

.news__artist-badges {
  margin: 8px 0 14px;
}

.news__artist-badges-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 6px 0;
}

.news__artist-badges-label {
  font-weight: 600;
  opacity: 0.85;
}

.news__artist-badges-list {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.news__badge {
  display: inline-block;
  padding: 4px 10px;
  border-radius: 0;
  line-height: 1.2;
  border: 1px solid var(--primary-color);
  text-decoration: none;
}

.news__badge:hover {
  color: #999999;
  border-color: #999999;
}

.c-breadcrumbs {
  font-size: 0.875rem;
  line-height: 1.4;
  margin: 0 0 1rem;
}

.c-breadcrumbs a {
  text-decoration: none;
}

.c-breadcrumbs span {
  color: var(--primary-color);
}

.c-breadcrumbs .separator {
  margin: 0 0.4em;
  opacity: 0.6;
}

.visually-hidden {
  position: absolute !important;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.handle {
  cursor: move;
}

.pdf hr {
  margin-bottom: 24px;
}
.pdf h4 {
  color: var(--primary-color);
}
.pdf .deleteimgpdf {
  display: block;
}
.pdf .filters li {
  background: #eee;
  border: 1px solid #777;
  padding: 3px 0;
}
.pdf .filters li a {
  color: #777;
  font-size: 14px;
  font-weight: 400;
  opacity: 1;
  padding: 0 8px;
}
@media only screen and (min-width:50.01em) {
  .pdf .filters li.-telecharger:hover {
    border: 1px solid #555;
  }
  .pdf .filters li.-telecharger:hover a {
    color: #555;
  }
}
.pdf .filters li.-primary {
  background: var(--primary-color);
  border: 1px solid var(--primary-color);
}
.pdf .filters li.-primary a {
  color: #fff;
}
@media only screen and (min-width:50.01em) {
  .pdf .filters li.-primary:hover {
    opacity: 0.8;
  }
}
.pdf .pdf__empty, .pdf .pdf__full {
  margin-top: 24px;
  text-align: center;
}
.pdf .pdf__empty > p {
  font-family: "Roboto Condensed", sans-serif;
  font-size: 14px;
  color: #999;
  max-width: 965px;
  margin-left: auto;
  margin-right: auto;
}
@media only screen and (min-width:40.01em) {
  .pdf .pdf__empty > p {
    font-size: 18px;
  }
}
@media only screen and (min-width:50.01em) {
  .pdf .pdf__empty > p {
    font-size: 24px;
  }
}
.pdf .pdf__full h4 {
  margin: 0;
}
.pdf .pdf__full .pdflist {
  text-align: left;
}
.pdf .pdf__full .pdflist .pdf__img {
  width: 100%;
  aspect-ratio: 1/1;
  object-fit: cover;
  display: block;
}
.pdf .pdf__full .pdflist .pdf__close {
  width: 24px;
  height: 24px;
}
.pdf .pdf__full .pdflist span {
  color: var(--primary-color) !important;
  cursor: pointer;
  vertical-align: middle;
}
.pdf .pdf__full .pdflist span > span {
  font-family: "Roboto Condensed", sans-serif;
  font-weight: 300;
  opacity: 0;
  padding-left: 4px;
  text-transform: uppercase;
  transition: all 0.2s ease;
}
@media only screen and (min-width:50.01em) {
  .pdf .pdf__full .pdflist span:hover > span {
    opacity: 1;
  }
}
.pdf .pdf__full .pdflist span.deletepdfimg {
  padding-top: 10px;
  display: block;
  transition: all 0.2s ease;
}
.pdf .pdf__full .pdflist span.deletepdfimg svg {
  width: 26px;
  stroke: #000;
  transition: all 0.2s ease;
}
.pdf .pdf__full .pdflist span.deletepdfimg:hover svg {
  stroke: var(--primary-color);
}

/*thirdparty*/
.fancybox__container {
  z-index: 9999;
}

.fancybox__backdrop {
  background: #fff !important;
}

.fancybox__toolbar {
  display: none !important;
}

.fancybox__caption {
  display: none !important;
  color: #000;
}

.fancybox__button--close {
  position: absolute;
  top: 20px;
  right: 20px;
  width: 36px;
  height: 36px;
  background: transparent !important;
  color: #000 !important;
  transition: color 0.3s;
}
.fancybox__button--close svg {
  width: 100%;
  height: 100%;
}
.fancybox__button--close:hover {
  color: var(--primary-color) !important;
}

.fancybox__nav .carousel__button {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background-color: var(--primary-color) !important;
  color: #fff !important;
  opacity: 0.9;
  top: 50%;
  transform: translateY(-50%);
  transition: background-color 0.3s, opacity 0.3s;
  box-shadow: none !important;
}
.fancybox__nav .carousel__button svg {
  width: 24px;
  height: 24px;
  stroke: #fff;
}
.fancybox__nav .carousel__button:hover {
  opacity: 1;
  background-color: color-mix(in srgb, var(--primary-color) 85%, #000 15%);
}
.fancybox__nav .carousel__button.is-prev {
  left: 15px;
}
.fancybox__nav .carousel__button svg {
  filter: none !important;
  box-shadow: none !important;
}
.fancybox__nav .carousel__button.is-next {
  right: 15px;
}

.fancybox__thumbs .carousel__slide .fancybox__thumb::after {
  border-color: #666;
  border-radius: 0;
}

.tooltip-element.tooltip-open {
  z-index: 999;
}

.tooltip-element.tooltip-theme-arrows .tooltip-content {
  border-radius: 0;
  background: #fff;
  padding: 0.25em;
  filter: drop-shadow(0 1px 4px rgba(0, 0, 0, 0.2));
}

.tooltip-element.tooltip-theme-arrows .tooltip-content img {
  width: 140px;
}

.tooltip-element.tooltip-theme-arrows.tooltip-element-attached-bottom.tooltip-element-attached-center .tooltip-content:before {
  border-top-color: #fff;
}

.tooltip-element.tooltip-theme-arrows.tooltip-element-attached-top.tooltip-element-attached-center .tooltip-content:before {
  border-bottom-color: #fff;
}

.tooltip-element.tooltip-theme-arrows.tooltip-element-attached-right.tooltip-element-attached-middle .tooltip-content {
  margin-right: 12px;
}

.tooltip-element.tooltip-theme-arrows.tooltip-element-attached-right.tooltip-element-attached-middle .tooltip-content:before {
  border-left-color: #fff;
}

.tooltip-element.tooltip-theme-arrows.tooltip-element-attached-left.tooltip-element-attached-middle .tooltip-content:before {
  border-right-color: #fff;
}

.tooltip-element.tooltip-theme-arrows.tooltip-element-attached-top.tooltip-element-attached-left.tooltip-target-attached-bottom .tooltip-content:before {
  border-bottom-color: #fff;
}

.tooltip-element.tooltip-theme-arrows.tooltip-element-attached-top.tooltip-element-attached-right.tooltip-target-attached-bottom .tooltip-content:before {
  border-bottom-color: #fff;
}

.tooltip-element.tooltip-theme-arrows.tooltip-element-attached-bottom.tooltip-element-attached-left.tooltip-target-attached-top .tooltip-content:before {
  border-top-color: #fff;
}

.tooltip-element.tooltip-theme-arrows.tooltip-element-attached-bottom.tooltip-element-attached-right.tooltip-target-attached-top .tooltip-content:before {
  border-top-color: #fff;
}

.tooltip-element.tooltip-theme-arrows.tooltip-element-attached-top.tooltip-element-attached-right.tooltip-target-attached-left .tooltip-content {
  margin-right: 12px;
}

.tooltip-element.tooltip-theme-arrows.tooltip-element-attached-top.tooltip-element-attached-right.tooltip-target-attached-left .tooltip-content:before {
  border-left-color: #fff;
}

.tooltip-element.tooltip-theme-arrows.tooltip-element-attached-top.tooltip-element-attached-left.tooltip-target-attached-right .tooltip-content:before {
  border-right-color: #fff;
}

.tooltip-element.tooltip-theme-arrows.tooltip-element-attached-bottom.tooltip-element-attached-right.tooltip-target-attached-left .tooltip-content {
  margin-right: 12px;
}

.tooltip-element.tooltip-theme-arrows.tooltip-element-attached-bottom.tooltip-element-attached-right.tooltip-target-attached-left .tooltip-content:before {
  border-left-color: #fff;
}

.tooltip-element.tooltip-theme-arrows.tooltip-element-attached-bottom.tooltip-element-attached-left.tooltip-target-attached-right .tooltip-content:before {
  border-right-color: #fff;
}

/*!
Video.js Default Styles (http://videojs.com)
Version 4.12.12
Create your own skin at http://designer.videojs.com
*/
/* SKIN
================================================================================
The main class name for all skin-specific styles. To make your own skin,
replace all occurrences of 'vjs-default-skin' with a new name. Then add your new
skin name to your video tag instead of the default skin.
e.g. <video class="video-js my-skin-name">
*/
.vjs-default-skin {
  color: #cccccc;
}

/* Custom Icon Font
--------------------------------------------------------------------------------
The control icons are from a custom font. Each icon corresponds to a character
(e.g. "\e001"). Font icons allow for easy scaling and coloring of icons.
*/
@font-face {
  font-family: "VideoJS";
  src: url("font/vjs.eot");
  src: url("font/vjs.eot?#iefix") format("embedded-opentype"), url("font/vjs.woff") format("woff"), url("font/vjs.ttf") format("truetype"), url("font/vjs.svg#icomoon") format("svg");
  font-weight: normal;
  font-style: normal;
}
/* Base UI Component Classes
--------------------------------------------------------------------------------
*/
/* Slider - used for Volume bar and Seek bar */
.vjs-default-skin .vjs-slider {
  /* Replace browser focus highlight with handle highlight */
  outline: 0;
  position: relative;
  cursor: pointer;
  padding: 0;
  /* background-color-with-alpha */
  background-color: #333333;
  background-color: rgba(51, 51, 51, 0.9);
}

.vjs-default-skin .vjs-slider:focus {
  /* box-shadow */
  -webkit-box-shadow: 0 0 2em #ffffff;
  -moz-box-shadow: 0 0 2em #ffffff;
  box-shadow: 0 0 2em #ffffff;
}

.vjs-default-skin .vjs-slider-handle {
  position: absolute;
  /* Needed for IE6 */
  left: 0;
  top: 0;
}

.vjs-default-skin .vjs-slider-handle:before {
  content: "\e009";
  font-family: VideoJS;
  font-size: 1em;
  line-height: 1;
  text-align: center;
  text-shadow: 0em 0em 1em #fff;
  position: absolute;
  top: 0;
  left: 0;
  /* Rotate the square icon to make a diamond */
  /* transform */
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

/* Control Bar
--------------------------------------------------------------------------------
The default control bar that is a container for most of the controls.
*/
.vjs-default-skin .vjs-control-bar {
  /* Start hidden */
  display: none;
  position: absolute;
  /* Place control bar at the bottom of the player box/video.
     If you want more margin below the control bar, add more height. */
  bottom: 0;
  /* Use left/right to stretch to 100% width of player div */
  left: 0;
  right: 0;
  /* Height includes any margin you want above or below control items */
  height: 3em;
  /* background-color-with-alpha */
  background-color: #07141e;
  background-color: rgba(7, 20, 30, 0.7);
}

/* Show the control bar only once the video has started playing */
.vjs-default-skin.vjs-has-started .vjs-control-bar {
  display: block;
  /* Visibility needed to make sure things hide in older browsers too. */
  visibility: visible;
  opacity: 1;
  /* transition */
  -webkit-transition: visibility 0.1s, opacity 0.1s;
  -moz-transition: visibility 0.1s, opacity 0.1s;
  -o-transition: visibility 0.1s, opacity 0.1s;
  transition: visibility 0.1s, opacity 0.1s;
}

/* Hide the control bar when the video is playing and the user is inactive  */
.vjs-default-skin.vjs-has-started.vjs-user-inactive.vjs-playing .vjs-control-bar {
  display: block;
  visibility: hidden;
  opacity: 0;
  /* transition */
  -webkit-transition: visibility 1s, opacity 1s;
  -moz-transition: visibility 1s, opacity 1s;
  -o-transition: visibility 1s, opacity 1s;
  transition: visibility 1s, opacity 1s;
}

.vjs-default-skin.vjs-controls-disabled .vjs-control-bar {
  display: none;
}

.vjs-default-skin.vjs-using-native-controls .vjs-control-bar {
  display: none;
}

/* The control bar shouldn't show after an error */
.vjs-default-skin.vjs-error .vjs-control-bar {
  display: none;
}

/* Don't hide the control bar if it's audio */
.vjs-audio.vjs-default-skin.vjs-has-started.vjs-user-inactive.vjs-playing .vjs-control-bar {
  opacity: 1;
  visibility: visible;
}

/* IE8 is flakey with fonts, and you have to change the actual content to force
fonts to show/hide properly.
  - "\9" IE8 hack didn't work for this
  - Found in XP IE8 from http://modern.ie. Does not show up in "IE8 mode" in IE9
*/
@media \0 screen {
  .vjs-default-skin.vjs-user-inactive.vjs-playing .vjs-control-bar :before {
    content: "";
  }
}
/* General styles for individual controls. */
.vjs-default-skin .vjs-control {
  outline: none;
  position: relative;
  float: left;
  text-align: center;
  margin: 0;
  padding: 0;
  height: 3em;
  width: 4em;
}

/* Font button icons */
.vjs-default-skin .vjs-control:before {
  font-family: VideoJS;
  font-size: 1.5em;
  line-height: 2;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  text-align: center;
  text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
}

/* Replacement for focus outline */
.vjs-default-skin .vjs-control:focus:before,
.vjs-default-skin .vjs-control:hover:before {
  text-shadow: 0em 0em 1em #ffffff;
}

.vjs-default-skin .vjs-control:focus {
  /*  outline: 0; */
  /* keyboard-only users cannot see the focus on several of the UI elements when
  this is set to 0 */
}

/* Hide control text visually, but have it available for screenreaders */
.vjs-default-skin .vjs-control-text {
  /* hide-visually */
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}

/* Play/Pause
--------------------------------------------------------------------------------
*/
.vjs-default-skin .vjs-play-control {
  width: 5em;
  cursor: pointer;
}

.vjs-default-skin .vjs-play-control:before {
  content: "\e001";
}

.vjs-default-skin.vjs-playing .vjs-play-control:before {
  content: "\e002";
}

/* Playback toggle
--------------------------------------------------------------------------------
*/
.vjs-default-skin .vjs-playback-rate .vjs-playback-rate-value {
  font-size: 1.5em;
  line-height: 2;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  text-align: center;
  text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
}

.vjs-default-skin .vjs-playback-rate.vjs-menu-button .vjs-menu .vjs-menu-content {
  width: 4em;
  left: -2em;
  list-style: none;
}

/* Volume/Mute
-------------------------------------------------------------------------------- */
.vjs-default-skin .vjs-mute-control,
.vjs-default-skin .vjs-volume-menu-button {
  cursor: pointer;
  float: right;
}

.vjs-default-skin .vjs-mute-control:before,
.vjs-default-skin .vjs-volume-menu-button:before {
  content: "\e006";
}

.vjs-default-skin .vjs-mute-control.vjs-vol-0:before,
.vjs-default-skin .vjs-volume-menu-button.vjs-vol-0:before {
  content: "\e003";
}

.vjs-default-skin .vjs-mute-control.vjs-vol-1:before,
.vjs-default-skin .vjs-volume-menu-button.vjs-vol-1:before {
  content: "\e004";
}

.vjs-default-skin .vjs-mute-control.vjs-vol-2:before,
.vjs-default-skin .vjs-volume-menu-button.vjs-vol-2:before {
  content: "\e005";
}

.vjs-default-skin .vjs-volume-control {
  width: 5em;
  float: right;
}

.vjs-default-skin .vjs-volume-bar {
  width: 5em;
  height: 0.6em;
  margin: 1.1em auto 0;
}

.vjs-default-skin .vjs-volume-level {
  position: absolute;
  top: 0;
  left: 0;
  height: 0.5em;
  /* assuming volume starts at 1.0 */
  width: 100%;
  background: #66a8cc url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAGCAYAAADgzO9IAAAAP0lEQVQIHWWMAQoAIAgDR/QJ/Ub//04+w7ZICBwcOg5FZi5iBB82AGzixEglJrd4TVK5XUJpskSTEvpdFzX9AB2pGziSQcvAAAAAAElFTkSuQmCC) -50% 0 repeat;
}

.vjs-default-skin .vjs-volume-bar .vjs-volume-handle {
  width: 0.5em;
  height: 0.5em;
  /* Assumes volume starts at 1.0. If you change the size of the
     handle relative to the volume bar, you'll need to update this value
     too. */
  left: 4.5em;
}

.vjs-default-skin .vjs-volume-handle:before {
  font-size: 0.9em;
  top: -0.2em;
  left: -0.2em;
  width: 1em;
  height: 1em;
}

/* The volume menu button is like menu buttons (captions/subtitles) but works
    a little differently. It needs to be possible to tab to the volume slider
    without hitting space bar on the menu button. To do this we're not using
    display:none to hide the slider menu by default, and instead setting the
    width and height to zero. */
.vjs-default-skin .vjs-volume-menu-button .vjs-menu {
  display: block;
  width: 0;
  height: 0;
  border-top-color: transparent;
}

.vjs-default-skin .vjs-volume-menu-button .vjs-menu .vjs-menu-content {
  height: 0;
  width: 0;
}

.vjs-default-skin .vjs-volume-menu-button:hover .vjs-menu,
.vjs-default-skin .vjs-volume-menu-button .vjs-menu.vjs-lock-showing {
  border-top-color: rgba(7, 40, 50, 0.5);
  /* Same as ul background */
}

.vjs-default-skin .vjs-volume-menu-button:hover .vjs-menu .vjs-menu-content,
.vjs-default-skin .vjs-volume-menu-button .vjs-menu.vjs-lock-showing .vjs-menu-content {
  height: 2.9em;
  width: 10em;
}

/* Progress
--------------------------------------------------------------------------------
*/
.vjs-default-skin .vjs-progress-control {
  position: absolute;
  left: 0;
  right: 0;
  width: auto;
  font-size: 0.3em;
  height: 1em;
  /* Set above the rest of the controls. */
  top: -1em;
  /* Shrink the bar slower than it grows. */
  /* transition */
  -webkit-transition: all 0.4s;
  -moz-transition: all 0.4s;
  -o-transition: all 0.4s;
  transition: all 0.4s;
}

/* On hover, make the progress bar grow to something that's more clickable.
    This simply changes the overall font for the progress bar, and this
    updates both the em-based widths and heights, as wells as the icon font */
.vjs-default-skin:hover .vjs-progress-control {
  font-size: 0.9em;
  /* Even though we're not changing the top/height, we need to include them in
      the transition so they're handled correctly. */
  /* transition */
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s;
}

/* Box containing play and load progresses. Also acts as seek scrubber. */
.vjs-default-skin .vjs-progress-holder {
  height: 100%;
}

/* Progress Bars */
.vjs-default-skin .vjs-progress-holder .vjs-play-progress,
.vjs-default-skin .vjs-progress-holder .vjs-load-progress,
.vjs-default-skin .vjs-progress-holder .vjs-load-progress div {
  position: absolute;
  display: block;
  height: 100%;
  margin: 0;
  padding: 0;
  /* updated by javascript during playback */
  width: 0;
  /* Needed for IE6 */
  left: 0;
  top: 0;
}

.vjs-default-skin .vjs-play-progress {
  /*
    Using a data URI to create the white diagonal lines with a transparent
      background. Surprisingly works in IE8.
      Created using http://www.patternify.com
    Changing the first color value will change the bar color.
    Also using a paralax effect to make the lines move backwards.
      The -50% left position makes that happen.
  */
  background: #66a8cc url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAGCAYAAADgzO9IAAAAP0lEQVQIHWWMAQoAIAgDR/QJ/Ub//04+w7ZICBwcOg5FZi5iBB82AGzixEglJrd4TVK5XUJpskSTEvpdFzX9AB2pGziSQcvAAAAAAElFTkSuQmCC) -50% 0 repeat;
}

.vjs-default-skin .vjs-load-progress {
  background: #646464;
  background: rgba(255, 255, 255, 0.2);
}

/* there are child elements of the load progress bar that represent the
   specific time ranges that have been buffered */
.vjs-default-skin .vjs-load-progress div {
  background: #787878;
  background: rgba(255, 255, 255, 0.1);
}

.vjs-default-skin .vjs-seek-handle {
  width: 1.5em;
  height: 100%;
}

.vjs-default-skin .vjs-seek-handle:before {
  padding-top: 0.1em;
}

/* Live Mode
--------------------------------------------------------------------------------
*/
.vjs-default-skin.vjs-live .vjs-time-controls,
.vjs-default-skin.vjs-live .vjs-time-divider,
.vjs-default-skin.vjs-live .vjs-progress-control {
  display: none;
}

.vjs-default-skin.vjs-live .vjs-live-display {
  display: block;
}

/* Live Display
--------------------------------------------------------------------------------
*/
.vjs-default-skin .vjs-live-display {
  display: none;
  font-size: 1em;
  line-height: 3em;
}

/* Time Display
--------------------------------------------------------------------------------
*/
.vjs-default-skin .vjs-time-controls {
  font-size: 1em;
  /* Align vertically by making the line height the same as the control bar */
  line-height: 3em;
}

.vjs-default-skin .vjs-current-time {
  float: left;
}

.vjs-default-skin .vjs-duration {
  float: left;
}

/* Remaining time is in the HTML, but not included in default design */
.vjs-default-skin .vjs-remaining-time {
  display: none;
  float: left;
}

.vjs-time-divider {
  float: left;
  line-height: 3em;
}

/* Fullscreen
--------------------------------------------------------------------------------
*/
.vjs-default-skin .vjs-fullscreen-control {
  width: 3.8em;
  cursor: pointer;
  float: right;
}

.vjs-default-skin .vjs-fullscreen-control:before {
  content: "\e000";
}

/* Switch to the exit icon when the player is in fullscreen */
.vjs-default-skin.vjs-fullscreen .vjs-fullscreen-control:before {
  content: "\e00b";
}

/* Big Play Button (play button at start)
--------------------------------------------------------------------------------
Positioning of the play button in the center or other corners can be done more
easily in the skin designer. http://designer.videojs.com/
*/
.vjs-default-skin .vjs-big-play-button {
  left: 0.5em;
  top: 0.5em;
  font-size: 3em;
  display: block;
  z-index: 2;
  position: absolute;
  width: 4em;
  height: 2.6em;
  text-align: center;
  vertical-align: middle;
  cursor: pointer;
  opacity: 1;
  /* Need a slightly gray bg so it can be seen on black backgrounds */
  /* background-color-with-alpha */
  background-color: #07141e;
  background-color: rgba(7, 20, 30, 0.7);
  border: 0.1em solid #3b4249;
  /* border-radius */
  -webkit-border-radius: 0.8em;
  -moz-border-radius: 0.8em;
  border-radius: 0.8em;
  /* box-shadow */
  -webkit-box-shadow: 0px 0px 1em rgba(255, 255, 255, 0.25);
  -moz-box-shadow: 0px 0px 1em rgba(255, 255, 255, 0.25);
  box-shadow: 0px 0px 1em rgba(255, 255, 255, 0.25);
  /* transition */
  -webkit-transition: all 0.4s;
  -moz-transition: all 0.4s;
  -o-transition: all 0.4s;
  transition: all 0.4s;
}

/* Optionally center */
.vjs-default-skin.vjs-big-play-centered .vjs-big-play-button {
  /* Center it horizontally */
  left: 50%;
  margin-left: -2.1em;
  /* Center it vertically */
  top: 50%;
  margin-top: -1.4em;
}

/* Hide if controls are disabled */
.vjs-default-skin.vjs-controls-disabled .vjs-big-play-button {
  display: none;
}

/* Hide when video starts playing */
.vjs-default-skin.vjs-has-started .vjs-big-play-button {
  display: none;
}

/* Hide on mobile devices. Remove when we stop using native controls
    by default on mobile  */
.vjs-default-skin.vjs-using-native-controls .vjs-big-play-button {
  display: none;
}

.vjs-default-skin:hover .vjs-big-play-button,
.vjs-default-skin .vjs-big-play-button:focus {
  outline: 0;
  border-color: #fff;
  /* IE8 needs a non-glow hover state */
  background-color: #505050;
  background-color: rgba(50, 50, 50, 0.75);
  /* box-shadow */
  -webkit-box-shadow: 0 0 3em #ffffff;
  -moz-box-shadow: 0 0 3em #ffffff;
  box-shadow: 0 0 3em #ffffff;
  /* transition */
  -webkit-transition: all 0s;
  -moz-transition: all 0s;
  -o-transition: all 0s;
  transition: all 0s;
}

.vjs-default-skin .vjs-big-play-button:before {
  content: "\e001";
  font-family: VideoJS;
  /* In order to center the play icon vertically we need to set the line height
     to the same as the button height */
  line-height: 2.6em;
  text-shadow: 0.05em 0.05em 0.1em #000;
  text-align: center;
  position: absolute;
  left: 0;
  width: 100%;
  height: 100%;
}

.vjs-error .vjs-big-play-button {
  display: none;
}

/* Error Display
--------------------------------------------------------------------------------
*/
.vjs-error-display {
  display: none;
}

.vjs-error .vjs-error-display {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}

.vjs-error .vjs-error-display:before {
  content: "X";
  font-family: Arial;
  font-size: 4em;
  color: #666666;
  /* In order to center the play icon vertically we need to set the line height
     to the same as the button height */
  line-height: 1;
  text-shadow: 0.05em 0.05em 0.1em #000;
  text-align: center;
  vertical-align: middle;
  position: absolute;
  left: 0;
  top: 50%;
  margin-top: -0.5em;
  width: 100%;
}

.vjs-error-display div {
  position: absolute;
  bottom: 1em;
  right: 0;
  left: 0;
  font-size: 1.4em;
  text-align: center;
  padding: 3px;
  background: #000000;
  background: rgba(0, 0, 0, 0.5);
}

.vjs-error-display a,
.vjs-error-display a:visited {
  color: #F4A460;
}

/* Loading Spinner
--------------------------------------------------------------------------------
*/
.vjs-loading-spinner {
  /* Should be hidden by default */
  display: none;
  position: absolute;
  top: 50%;
  left: 50%;
  font-size: 4em;
  line-height: 1;
  width: 1em;
  height: 1em;
  margin-left: -0.5em;
  margin-top: -0.5em;
  opacity: 0.75;
}

/* Show the spinner when waiting for data and seeking to a new time */
.vjs-waiting .vjs-loading-spinner,
.vjs-seeking .vjs-loading-spinner {
  display: block;
  /* only animate when showing because it can be processor heavy */
  /* animation */
  -webkit-animation: spin 1.5s infinite linear;
  -moz-animation: spin 1.5s infinite linear;
  -o-animation: spin 1.5s infinite linear;
  animation: spin 1.5s infinite linear;
}

/* Errors are unrecoverable without user interaction so hide the spinner */
.vjs-error .vjs-loading-spinner {
  display: none;
  /* ensure animation doesn't continue while hidden */
  /* animation */
  -webkit-animation: none;
  -moz-animation: none;
  -o-animation: none;
  animation: none;
}

.vjs-default-skin .vjs-loading-spinner:before {
  content: "\e01e";
  font-family: VideoJS;
  position: absolute;
  top: 0;
  left: 0;
  width: 1em;
  height: 1em;
  text-align: center;
  text-shadow: 0em 0em 0.1em #000;
}

@-moz-keyframes spin {
  0% {
    -moz-transform: rotate(0deg);
  }
  100% {
    -moz-transform: rotate(359deg);
  }
}
@-webkit-keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(359deg);
  }
}
@-o-keyframes spin {
  0% {
    -o-transform: rotate(0deg);
  }
  100% {
    -o-transform: rotate(359deg);
  }
}
@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(359deg);
  }
}
/* Menu Buttons (Captions/Subtitles/etc.)
--------------------------------------------------------------------------------
*/
.vjs-default-skin .vjs-menu-button {
  float: right;
  cursor: pointer;
}

.vjs-default-skin .vjs-menu {
  display: none;
  position: absolute;
  bottom: 0;
  left: 0em;
  /* (Width of vjs-menu - width of button) / 2 */
  width: 0em;
  height: 0em;
  margin-bottom: 3em;
  border-left: 2em solid transparent;
  border-right: 2em solid transparent;
  border-top: 1.55em solid #000000;
  /* Same width top as ul bottom */
  border-top-color: rgba(7, 40, 50, 0.5);
  /* Same as ul background */
}

/* Button Pop-up Menu */
.vjs-default-skin .vjs-menu-button .vjs-menu .vjs-menu-content {
  display: block;
  padding: 0;
  margin: 0;
  position: absolute;
  width: 10em;
  bottom: 1.5em;
  /* Same bottom as vjs-menu border-top */
  max-height: 15em;
  overflow: auto;
  left: -5em;
  /* Width of menu - width of button / 2 */
  /* background-color-with-alpha */
  background-color: #07141e;
  background-color: rgba(7, 20, 30, 0.7);
  /* box-shadow */
  -webkit-box-shadow: -0.2em -0.2em 0.3em rgba(255, 255, 255, 0.2);
  -moz-box-shadow: -0.2em -0.2em 0.3em rgba(255, 255, 255, 0.2);
  box-shadow: -0.2em -0.2em 0.3em rgba(255, 255, 255, 0.2);
}

.vjs-default-skin .vjs-menu-button:hover .vjs-control-content .vjs-menu,
.vjs-default-skin .vjs-control-content .vjs-menu.vjs-lock-showing {
  display: block;
}

/* prevent menus from opening while scrubbing (FF, IE) */
.vjs-default-skin.vjs-scrubbing .vjs-menu-button:hover .vjs-control-content .vjs-menu {
  display: none;
}

.vjs-default-skin .vjs-menu-button ul li {
  list-style: none;
  margin: 0;
  padding: 0.3em 0 0.3em 0;
  line-height: 1.4em;
  font-size: 1.2em;
  text-align: center;
  text-transform: lowercase;
}

.vjs-default-skin .vjs-menu-button ul li.vjs-selected {
  background-color: #000;
}

.vjs-default-skin .vjs-menu-button ul li:focus,
.vjs-default-skin .vjs-menu-button ul li:hover,
.vjs-default-skin .vjs-menu-button ul li.vjs-selected:focus,
.vjs-default-skin .vjs-menu-button ul li.vjs-selected:hover {
  outline: 0;
  color: #111;
  /* background-color-with-alpha */
  background-color: #ffffff;
  background-color: rgba(255, 255, 255, 0.75);
  /* box-shadow */
  -webkit-box-shadow: 0 0 1em #ffffff;
  -moz-box-shadow: 0 0 1em #ffffff;
  box-shadow: 0 0 1em #ffffff;
}

.vjs-default-skin .vjs-menu-button ul li.vjs-menu-title {
  text-align: center;
  text-transform: uppercase;
  font-size: 1em;
  line-height: 2em;
  padding: 0;
  margin: 0 0 0.3em 0;
  font-weight: bold;
  cursor: default;
}

/* Subtitles Button */
.vjs-default-skin .vjs-subtitles-button:before {
  content: "\e00c";
}

/* Captions Button */
.vjs-default-skin .vjs-captions-button:before {
  content: "\e008";
}

/* Chapters Button */
.vjs-default-skin .vjs-chapters-button:before {
  content: "\e00c";
}

.vjs-default-skin .vjs-chapters-button.vjs-menu-button .vjs-menu .vjs-menu-content {
  width: 24em;
  left: -12em;
}

/* Replacement for focus outline */
.vjs-default-skin .vjs-captions-button:focus .vjs-control-content:before,
.vjs-default-skin .vjs-captions-button:hover .vjs-control-content:before {
  /* box-shadow */
  -webkit-box-shadow: 0 0 1em #ffffff;
  -moz-box-shadow: 0 0 1em #ffffff;
  box-shadow: 0 0 1em #ffffff;
}

/*
REQUIRED STYLES (be careful overriding)
================================================================================
When loading the player, the video tag is replaced with a DIV,
that will hold the video tag or object tag for other playback methods.
The div contains the video playback element (Flash or HTML5) and controls,
and sets the width and height of the video.

** If you want to add some kind of border/padding (e.g. a frame), or special
positioning, use another containing element. Otherwise you risk messing up
control positioning and full window mode. **
*/
.video-js {
  background-color: #000;
  position: relative;
  padding: 0;
  /* Start with 10px for base font size so other dimensions can be em based and
     easily calculable. */
  font-size: 10px;
  /* Allow poster to be vertically aligned. */
  vertical-align: middle;
  /*  display: table-cell; */
  /*This works in Safari but not Firefox.*/
  /* Provide some basic defaults for fonts */
  font-weight: normal;
  font-style: normal;
  /* Avoiding helvetica: issue #376 */
  font-family: Arial, sans-serif;
  /* Turn off user selection (text highlighting) by default.
     The majority of player components will not be text blocks.
     Text areas will need to turn user selection back on. */
  /* user-select */
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* Playback technology elements expand to the width/height of the containing div
    <video> or <object> */
.video-js .vjs-tech {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/* Fix for Firefox 9 fullscreen (only if it is enabled). Not needed when
   checking fullScreenEnabled. */
.video-js:-moz-full-screen {
  position: absolute;
}

/* Fullscreen Styles */
body.vjs-full-window {
  padding: 0;
  margin: 0;
  height: 100%;
  /* Fix for IE6 full-window. http://www.cssplay.co.uk/layouts/fixed.html */
  overflow-y: auto;
}

.video-js.vjs-fullscreen {
  position: fixed;
  overflow: hidden;
  z-index: 1000;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  width: 100% !important;
  height: 100% !important;
  /* IE6 full-window (underscore hack) */
  _position: absolute;
}

.video-js:-webkit-full-screen {
  width: 100% !important;
  height: 100% !important;
}

.video-js.vjs-fullscreen.vjs-user-inactive {
  cursor: none;
}

/* Poster Styles */
.vjs-poster {
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: contain;
  background-color: #000000;
  cursor: pointer;
  margin: 0;
  padding: 0;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}

.vjs-poster img {
  display: block;
  margin: 0 auto;
  max-height: 100%;
  padding: 0;
  width: 100%;
}

/* Hide the poster after the video has started playing */
.video-js.vjs-has-started .vjs-poster {
  display: none;
}

/* Don't hide the poster if we're playing audio */
.video-js.vjs-audio.vjs-has-started .vjs-poster {
  display: block;
}

/* Hide the poster when controls are disabled because it's clickable
    and the native poster can take over */
.video-js.vjs-controls-disabled .vjs-poster {
  display: none;
}

/* Hide the poster when native controls are used otherwise it covers them */
.video-js.vjs-using-native-controls .vjs-poster {
  display: none;
}

/* Text Track Styles */
/* Overall track holder for both captions and subtitles */
.video-js .vjs-text-track-display {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 3em;
  right: 0;
  pointer-events: none;
}

/* Captions Settings Dialog */
.vjs-caption-settings {
  position: relative;
  top: 1em;
  background-color: #000;
  opacity: 0.75;
  color: #FFF;
  margin: 0 auto;
  padding: 0.5em;
  height: 15em;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 12px;
  width: 40em;
}

.vjs-caption-settings .vjs-tracksettings {
  top: 0;
  bottom: 2em;
  left: 0;
  right: 0;
  position: absolute;
  overflow: auto;
}

.vjs-caption-settings .vjs-tracksettings-colors,
.vjs-caption-settings .vjs-tracksettings-font {
  float: left;
}

.vjs-caption-settings .vjs-tracksettings-colors:after,
.vjs-caption-settings .vjs-tracksettings-font:after,
.vjs-caption-settings .vjs-tracksettings-controls:after {
  clear: both;
}

.vjs-caption-settings .vjs-tracksettings-controls {
  position: absolute;
  bottom: 1em;
  right: 1em;
}

.vjs-caption-settings .vjs-tracksetting {
  margin: 5px;
  padding: 3px;
  min-height: 40px;
}

.vjs-caption-settings .vjs-tracksetting label {
  display: block;
  width: 100px;
  margin-bottom: 5px;
}

.vjs-caption-settings .vjs-tracksetting span {
  display: inline;
  margin-left: 5px;
}

.vjs-caption-settings .vjs-tracksetting > div {
  margin-bottom: 5px;
  min-height: 20px;
}

.vjs-caption-settings .vjs-tracksetting > div:last-child {
  margin-bottom: 0;
  padding-bottom: 0;
  min-height: 0;
}

.vjs-caption-settings label > input {
  margin-right: 10px;
}

.vjs-caption-settings input[type=button] {
  width: 40px;
  height: 40px;
}

/* Hide disabled or unsupported controls */
.vjs-hidden {
  display: none !important;
}

.vjs-lock-showing {
  display: block !important;
  opacity: 1;
  visibility: visible;
}

/*  In IE8 w/ no JavaScript (no HTML5 shim), the video tag doesn't register.
    The .video-js classname on the video tag also isn't considered.
    This optional paragraph inside the video tag can provide a message to users
    about what's required to play video. */
.vjs-no-js {
  padding: 2em;
  color: #ccc;
  background-color: #333;
  font-size: 1.8em;
  font-family: Arial, sans-serif;
  text-align: center;
  width: 30em;
  height: 15em;
  margin: 0 auto;
}

.vjs-no-js a,
.vjs-no-js a:visited {
  color: #F4A460;
}

/* -----------------------------------------------------------------------------
The original source of this file lives at
https://github.com/videojs/video.js/blob/master/src/css/video-js.less */

/*# sourceMappingURL=main.css.map */