@charset "UTF-8";
.picker {
  font-size: 16px;
  text-align: left;
  line-height: 1.2;
  color: black;
  position: absolute;
  z-index: 10000;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none; }

.picker__input {
  cursor: default; }

.picker__input.picker__input--active {
  border-color: #0089ec; }

.picker__holder {
  width: 100%;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  position: fixed;
  transition: background .15s ease-out, transform 0s .15s;
  -webkit-backface-visibility: hidden; }

/*!
 * Default mobile-first, responsive styling for pickadate.js
 * Demo: http://amsul.github.io/pickadate.js
 */
.picker__frame, .picker__holder {
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  transform: translateY(100%); }

.picker__frame {
  position: absolute;
  margin: 0 auto;
  min-width: 256px;
  max-width: 666px;
  width: 100%;
  filter: alpha(opacity=0);
  -moz-opacity: 0;
  opacity: 0;
  transition: all .15s ease-out; }

.picker__wrap {
  display: table;
  width: 100%;
  height: 100%; }

@media (min-height: 33.875em) {
  .picker__frame {
    overflow: visible;
    top: auto;
    bottom: -100%;
    max-height: 80%; }
  .picker__wrap {
    display: block; } }

.picker__box {
  background: #fff;
  display: table-cell;
  vertical-align: middle;
  padding: 0 1em; }

@media (min-height: 26.5em) {
  .picker__box {
    font-size: 1.25em; } }

@media (min-height: 33.875em) {
  .picker__box {
    display: block;
    font-size: 1.33em;
    border: 1px solid #777;
    border-top-color: #898989;
    border-bottom-width: 0;
    border-radius: 5px 5px 0 0;
    box-shadow: 0 12px 36px 16px rgba(0, 0, 0, 0.24); } }

@media (min-height: 40.125em) {
  .picker__frame {
    margin-bottom: 7.5%; }
  .picker__box {
    font-size: 1.5em;
    border-bottom-width: 1px;
    border-radius: 5px; } }

.picker--opened .picker__holder {
  transform: translateY(0);
  zoom: 1;
  background: rgba(0, 0, 0, 0.32);
  transition: background .15s ease-out; }

.picker--opened .picker__frame {
  transform: translateY(0);
  filter: alpha(opacity=100);
  -moz-opacity: 1;
  opacity: 1; }

@media (min-height: 33.875em) {
  .picker--opened .picker__frame {
    top: auto;
    bottom: 0; } }

.picker__footer, .picker__header, .picker__table {
  text-align: center; }

.picker__day--highlighted, .picker__select--month:focus, .picker__select--year:focus {
  border-color: #0089ec; }

.picker__header {
  position: relative;
  margin-top: .75em; }

.picker__month, .picker__year {
  font-weight: 500;
  display: inline-block;
  margin-left: .25em;
  margin-right: .25em; }

.picker__year {
  color: #999;
  font-size: .8em;
  font-style: italic; }

.picker__select--month, .picker__select--year {
  border: 1px solid #b7b7b7;
  height: 2em;
  padding: .5em;
  margin-left: .25em;
  margin-right: .25em;
  font-size: 17px; }
  @media screen and (min-width: 664px) {
    .picker__select--month, .picker__select--year {
      font-size: 24px; } }

.picker__select--month {
  width: 43%; }
  @media screen and (min-width: 664px) {
    .picker__select--month {
      width: 33%; } }

.picker__select--year {
  width: 27%; }
  @media screen and (min-width: 664px) {
    .picker__select--year {
      width: 23%; } }

.picker__nav--next, .picker__nav--prev {
  position: absolute;
  padding: .5em 0.75em;
  width: 1em;
  height: 1em;
  box-sizing: content-box;
  top: -.25em; }

.picker__nav--prev {
  left: -1em;
  padding-right: 0.75em; }

.picker__nav--next {
  right: -1em;
  padding-left: 0.75em; }

@media (440px) {
  .picker__select--month, .picker__select--year {
    margin-top: -.5em; }
  .picker__nav--next, .picker__nav--prev {
    top: -.33em; }
  .picker__nav--prev {
    padding-right: 1.5em; }
  .picker__nav--next {
    padding-left: 1.5em; } }

.picker__nav--next:before, .picker__nav--prev:before {
  content: " ";
  border-top: .5em solid transparent;
  border-bottom: .5em solid transparent;
  border-right: .75em solid #000;
  width: 0;
  height: 0;
  display: block;
  margin: 0 auto; }

.picker__nav--next:before {
  border-right: 0;
  border-left: .75em solid #000; }

.picker__nav--next:hover, .picker__nav--prev:hover {
  cursor: pointer;
  color: #000;
  background: #b1dcfb; }

.picker__nav--disabled, .picker__nav--disabled:before, .picker__nav--disabled:before:hover, .picker__nav--disabled:hover {
  cursor: default;
  background: 0 0;
  border-right-color: #f5f5f5;
  border-left-color: #f5f5f5; }

.picker--focused .picker__day--highlighted, .picker__day--highlighted:hover, .picker__day--infocus:hover, .picker__day--outfocus:hover {
  color: #000;
  cursor: pointer;
  background: #b1dcfb; }

.picker__table {
  border-collapse: collapse;
  border-spacing: 0;
  table-layout: fixed;
  font-size: inherit;
  width: 100%;
  margin-top: .75em;
  margin-bottom: .5em; }

@media (min-height: 33.875em) {
  .picker__table {
    margin-bottom: .75em; } }

.picker__table td {
  margin: 0;
  padding: 0; }

.picker__weekday {
  width: 14.285714286%;
  font-size: .75em;
  padding-bottom: .25em;
  color: #999;
  font-weight: 500; }

@media (min-height: 33.875em) {
  .picker__weekday {
    padding-bottom: .5em; } }

.picker__day {
  padding: .3125em 0;
  font-weight: 200;
  border: 1px solid transparent; }

.picker__day--today {
  position: relative; }

.picker__day--today:before {
  content: " ";
  position: absolute;
  top: 2px;
  right: 2px;
  width: 0;
  height: 0;
  border-top: .5em solid #0059bc;
  border-left: .5em solid transparent; }

.picker__day--disabled:before {
  border-top-color: #aaa; }

.picker__day--outfocus {
  color: #ddd; }

.picker--focused .picker__day--selected, .picker__day--selected, .picker__day--selected:hover {
  background: #0089ec;
  color: #fff; }

.picker--focused .picker__day--disabled, .picker__day--disabled, .picker__day--disabled:hover {
  background: #f5f5f5;
  border-color: #f5f5f5;
  color: #ddd;
  cursor: default; }

.picker__day--highlighted.picker__day--disabled, .picker__day--highlighted.picker__day--disabled:hover {
  background: #bbb; }

.picker__button--clear, .picker__button--close, .picker__button--today {
  border: 1px solid #fff;
  background: #fff;
  font-size: .8em;
  padding: .66em 0;
  font-weight: 700;
  width: 33%;
  display: inline-block;
  vertical-align: bottom; }

.picker__button--clear:hover, .picker__button--close:hover, .picker__button--today:hover {
  cursor: pointer;
  color: #000;
  background: #b1dcfb;
  border-bottom-color: #b1dcfb; }

.picker__button--clear:focus, .picker__button--close:focus, .picker__button--today:focus {
  background: #b1dcfb;
  border-color: #0089ec;
  outline: 0; }

.picker__button--clear:before, .picker__button--close:before, .picker__button--today:before {
  position: relative;
  display: inline-block;
  height: 0; }

.picker__button--clear:before, .picker__button--today:before {
  content: " ";
  margin-right: .45em; }

.picker__button--today:before {
  top: -.05em;
  width: 0;
  border-top: .66em solid #0059bc;
  border-left: .66em solid transparent; }

.picker__button--clear:before {
  top: -.25em;
  width: .66em;
  border-top: 3px solid #e20; }

.picker__button--close:before {
  content: "\D7";
  top: -.1em;
  vertical-align: top;
  font-size: 1.1em;
  margin-right: .35em;
  color: #777; }

.picker__button--today[disabled], .picker__button--today[disabled]:hover {
  background: #f5f5f5;
  border-color: #f5f5f5;
  color: #ddd;
  cursor: default; }

.picker__button--today[disabled]:before {
  border-top-color: #aaa; }

.smartbanner-show {
  margin-top: 80px; }

.smartbanner-show .smartbanner {
  display: block; }

/** Default **/
.smartbanner {
  position: absolute;
  left: 0;
  top: 0;
  display: none;
  width: 100%;
  height: 80px;
  line-height: 80px;
  font-family: 'Helvetica Neue', sans-serif;
  background: #f4f4f4;
  z-index: 9998;
  -webkit-font-smoothing: antialiased;
  overflow: hidden;
  -webkit-text-size-adjust: none; }

.smartbanner-container {
  margin: 0 auto;
  white-space: nowrap; }

.smartbanner-close {
  display: inline-block;
  vertical-align: middle;
  margin: 0 5px 0 5px;
  font-family: 'ArialRoundedMTBold', Arial;
  font-size: 20px;
  text-align: center;
  color: #888;
  text-decoration: none;
  border: 0;
  border-radius: 14px;
  -webkit-font-smoothing: subpixel-antialiased; }

.smartbanner-close:active,
.smartbanner-close:hover {
  color: #aaa; }

.smartbanner-icon {
  display: inline-block;
  vertical-align: middle;
  width: 57px;
  height: 57px;
  margin-right: 12px;
  background-size: cover;
  border-radius: 10px; }

.smartbanner-info {
  display: inline-block;
  vertical-align: middle;
  width: 44%;
  font-size: 11px;
  line-height: 1.2em;
  font-weight: bold; }

.smartbanner-title {
  font-size: 13px;
  line-height: 18px; }

.smartbanner-button {
  position: absolute;
  right: 20px;
  top: 0;
  bottom: 0;
  margin: auto 0;
  height: 24px;
  font-size: 14px;
  line-height: 24px;
  text-align: center;
  font-weight: bold;
  color: #6a6a6a;
  text-transform: uppercase;
  text-decoration: none;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.8); }

.smartbanner-button:active, .smartbanner-button:hover {
  color: #aaa; }

/** iOS **/
.smartbanner-ios {
  background: #f4f4f4;
  background: linear-gradient(to bottom, #f4f4f4, #cdcdcd);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
  line-height: 80px; }

.smartbanner-ios .smartbanner-close {
  border: 0;
  width: 18px;
  height: 18px;
  line-height: 18px;
  color: #888;
  text-shadow: 0 1px 0 white; }

.smartbanner-ios .smartbanner-close:active,
.smartbanner-ios .smartbanner-close:hover {
  color: #aaa; }

.smartbanner-ios .smartbanner-icon {
  background: rgba(0, 0, 0, 0.6);
  background-size: cover;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3); }

.smartbanner-ios .smartbanner-info {
  color: #6a6a6a;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.8); }

.smartbanner-ios .smartbanner-title {
  color: #4d4d4d;
  font-weight: bold; }

.smartbanner-ios .smartbanner-button {
  padding: 0 10px;
  min-width: 10%;
  color: #6a6a6a;
  background: #efefef;
  background: linear-gradient(to bottom, #efefef, #dcdcdc);
  border-radius: 3px;
  box-shadow: inset 0 0 0 1px #bfbfbf, 0 1px 0 rgba(255, 255, 255, 0.6), 0 2px 0 rgba(255, 255, 255, 0.7) inset; }

.smartbanner-ios .smartbanner-button:active,
.smartbanner-ios .smartbanner-button:hover {
  background: #dcdcdc;
  background: linear-gradient(to bottom, #dcdcdc, #efefef); }

/** Android **/
.smartbanner-android {
  background: #3d3d3d url(data:image/gif;base64,R0lGODlhCAAIAIABAFVVVf///yH5BAEHAAEALAAAAAAIAAgAAAINRG4XudroGJBRsYcxKAA7);
  box-shadow: inset 0 4px 0 #88B131;
  line-height: 82px; }

.smartbanner-android .smartbanner-close {
  border: 0;
  width: 17px;
  height: 17px;
  line-height: 17px;
  margin-right: 7px;
  color: #b1b1b3;
  background: #1c1e21;
  text-shadow: 0 1px 1px #000;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.8) inset, 0 1px 1px rgba(255, 255, 255, 0.3); }

.smartbanner-android .smartbanner-close:active,
.smartbanner-android .smartbanner-close:hover {
  color: #eee; }

.smartbanner-android .smartbanner-icon {
  background-color: transparent;
  box-shadow: none; }

.smartbanner-android .smartbanner-info {
  color: #ccc;
  text-shadow: 0 1px 2px #000; }

.smartbanner-android .smartbanner-title {
  color: #fff;
  font-weight: bold; }

.smartbanner-android .smartbanner-button {
  min-width: 12%;
  color: #d1d1d1;
  padding: 0;
  background: none;
  border-radius: 0;
  box-shadow: 0 0 0 1px #333, 0 0 0 2px #DDDCDC; }

.smartbanner-android .smartbanner-button:active,
.smartbanner-android .smartbanner-button:hover {
  background: none; }

.smartbanner-android .smartbanner-button-text {
  text-align: center;
  display: block;
  padding: 0 10px;
  background: #42B6C9;
  background: linear-gradient(to bottom, #42B6C9, #39A9BB);
  text-transform: none;
  text-shadow: none;
  box-shadow: none; }

.smartbanner-android .smartbanner-button-text:active,
.smartbanner-android .smartbanner-button-text:hover {
  background: #2AC7E1; }

/** Windows **/
.smartbanner-windows {
  background: #f4f4f4;
  background: linear-gradient(to bottom, #f4f4f4, #cdcdcd);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
  line-height: 80px; }

.smartbanner-windows .smartbanner-close {
  border: 0;
  width: 18px;
  height: 18px;
  line-height: 18px;
  color: #888;
  text-shadow: 0 1px 0 white; }

.smartbanner-windows .smartbanner-close:active,
.smartbanner-windows .smartbanner-close:hover {
  color: #aaa; }

.smartbanner-windows .smartbanner-icon {
  background: rgba(0, 0, 0, 0.6);
  background-size: cover;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3); }

.smartbanner-windows .smartbanner-info {
  color: #6a6a6a;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.8); }

.smartbanner-windows .smartbanner-title {
  color: #4d4d4d;
  font-weight: bold; }

.smartbanner-windows .smartbanner-button {
  padding: 0 10px;
  min-width: 10%;
  color: #6a6a6a;
  background: #efefef;
  background: linear-gradient(to bottom, #efefef, #dcdcdc);
  border-radius: 3px;
  box-shadow: inset 0 0 0 1px #bfbfbf, 0 1px 0 rgba(255, 255, 255, 0.6), 0 2px 0 rgba(255, 255, 255, 0.7) inset; }

.smartbanner-windows .smartbanner-button:active,
.smartbanner-windows .smartbanner-button:hover {
  background: #dcdcdc;
  background: linear-gradient(to bottom, #dcdcdc, #efefef); }

/* ==========================================================================
   Normalize.scss settings
   ========================================================================== */
/**
 * Includes legacy browser support IE6/7
 *
 * Set to false if you want to drop support for IE6 and IE7
 */
/* Base
   ========================================================================== */
/**
 * 1. Set default font family to sans-serif.
 * 2. Prevent iOS and IE text size adjust after device orientation change,
 *    without disabling user zoom.
 * 3. Corrects text resizing oddly in IE 6/7 when body `font-size` is set using
 *  `em` units.
 */
html {
  font-family: sans-serif;
  /* 1 */
  -ms-text-size-adjust: 100%;
  /* 2 */
  -webkit-text-size-adjust: 100%;
  /* 2 */ }

/**
 * Remove default margin.
 */
body {
  margin: 0; }

/* HTML5 display definitions
   ========================================================================== */
/**
 * Correct `block` display not defined for any HTML5 element in IE 8/9.
 * Correct `block` display not defined for `details` or `summary` in IE 10/11
 * and Firefox.
 * Correct `block` display not defined for `main` in IE 11.
 */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
  display: block; }

/**
 * 1. Correct `inline-block` display not defined in IE 6/7/8/9 and Firefox 3.
 * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.
 */
audio,
canvas,
progress,
video {
  display: inline-block;
  /* 1 */
  vertical-align: baseline;
  /* 2 */ }

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

/**
 * Address `[hidden]` styling not present in IE 8/9/10.
 * Hide the `template` element in IE 8/9/10/11, Safari, and Firefox < 22.
 */
[hidden],
template {
  display: none; }

/* Links
   ========================================================================== */
/**
 * Remove the gray background color from active links in IE 10.
 */
a {
  background-color: transparent; }

/**
 * Improve readability of focused elements when they are also in an
 * active/hover state.
 */
a:active, a:hover {
  outline: 0; }

/* Text-level semantics
   ========================================================================== */
/**
 * Address styling not present in IE 8/9/10/11, Safari, and Chrome.
 */
abbr[title] {
  border-bottom: 1px dotted; }

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

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

/**
 * Address variable `h1` font-size and margin within `section` and `article`
 * contexts in Firefox 4+, Safari, and Chrome.
 */
h1 {
  font-size: 2em;
  margin: 0.67em 0; }

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

/**
 * 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; }

/* Embedded content
   ========================================================================== */
/**
 * 1. Remove border when inside `a` element in IE 8/9/10.
 * 2. Improves image quality when scaled in IE 7.
 */
img {
  border: 0; }

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

/* Grouping content
   ========================================================================== */
/**
 * Address margin not present in IE 8/9 and Safari.
 */
figure {
  margin: 1em 40px; }

/**
 * Address differences between Firefox and other browsers.
 */
hr {
  box-sizing: content-box;
  height: 0; }

/**
 * Contain overflow in all browsers.
 */
pre {
  overflow: auto; }

/**
 * Address odd `em`-unit font size rendering in all browsers.
 * Correct font family set oddly in IE 6, Safari 4/5, and Chrome.
 */
code,
kbd,
pre,
samp {
  font-family: monospace, monospace;
  font-size: 1em; }

/* Forms
   ========================================================================== */
/**
 * Known limitation: by default, Chrome and Safari on OS X allow very limited
 * styling of `select`, unless a `border` property is set.
 */
/**
 * 1. Correct color not being inherited.
 *  Known issue: affects color of disabled elements.
 * 2. Correct font properties not being inherited.
 * 3. Address margins set differently in Firefox 4+, Safari, and Chrome.
 * 4. Improves appearance and consistency in all browsers.
 */
button,
input,
optgroup,
select,
textarea {
  color: inherit;
  /* 1 */
  font: inherit;
  /* 2 */
  margin: 0;
  /* 3 */ }

/**
 * Address `overflow` set to `hidden` in IE 8/9/10/11.
 */
button {
  overflow: visible; }

/**
 * 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 Firefox, IE 8/9/10/11, and Opera.
 * Correct `select` style inheritance in Firefox.
 */
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. Removes 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 */ }

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

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

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

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

/**
 * Fix the cursor style for Chrome's increment/decrement buttons. For certain
 * `font-size` values of the `input`, it causes the cursor style of the
 * decrement button to change from `default` to `text`.
 */
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  height: auto; }

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

/**
 * Remove inner padding and search cancel button in Safari and Chrome on OS X.
 * Safari (but not Chrome) clips the cancel button when the search input has
 * padding (and `textfield` appearance).
 */
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none; }

/**
 * 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 8/9/10/11.
 * 2. Remove padding so people aren't caught out if they zero out fieldsets.
 * 3. Corrects text not wrapping in Firefox 3.
 * 4. Corrects alignment displayed oddly in IE 6/7.
 */
legend {
  border: 0;
  /* 1 */
  padding: 0;
  /* 2 */ }

/**
 * Remove default vertical scrollbar in IE 8/9/10/11.
 */
textarea {
  overflow: auto; }

/**
 * Don't inherit the `font-weight` (applied by a rule above).
 * NOTE: the default cannot safely be changed in Chrome and Safari on OS X.
 */
optgroup {
  font-weight: bold; }

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

td,
th {
  padding: 0; }

/* hide close buttons when closed so they wont show up in tabindex */
.rm-closed {
  display: none; }

/* Accessible hide the menu itself */
.responsive-wrapper.rm-closed {
  position: absolute;
  overflow: hidden;
  clip: rect(0 0 0 0);
  height: 1px;
  width: 1px;
  margin: -1px;
  padding: 0;
  border: 0; }

/* Mobile indicator styling */
#rm-mobile-indicator {
  position: absolute;
  overflow: hidden;
  clip: rect(0 0 0 0);
  height: 1px;
  width: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
  z-index: 0; }
  @media (min-width: 988px) {
    #rm-mobile-indicator {
      z-index: 1; } }

/**
 * When JS is enabled
 *
 * 1. We can use display none because we set display block again with JS immediately after initiating the menu
 * 2. Display menu when initiated
 * 3. Display menu on "desktop"
 * 4. Display focused items
 */
.js .navigation_container {
  display: none;
  /* 1 */ }
  .js .navigation_container.rm-initiated {
    display: block;
    /* 2 */ }
  @media (min-width: 988px) {
    .js .navigation_container {
      display: block;
      /* 3 */ } }
  .js .navigation_container .rm-focused {
    overflow: visible;
    /* 4 */ }

/*
 * Ster advertentie container
 * Use to hide the parent container that might have styling (padding, margin, border etc.)
 */
.sterad-container {
  display: none;
  overflow: hidden; }

@media screen and (min-width: 0) and (max-width: 663px) {
  .sterad-container[data-display*="mobile"] {
    display: block; } }

@media screen and (min-width: 664px) and (max-width: 987px) {
  .sterad-container[data-display*="tablet"] {
    display: block; } }

@media screen and (min-width: 988px) {
  .sterad-container[data-display*="desktop"] {
    display: block; } }

/*
 * Ster advertentie
 *
 * Align head and iframe in center
 */
.sterad {
  text-align: center;
  /* Placeholder styling until iframe has loaded */ }
  .sterad iframe {
    background: rgba(0, 0, 0, 0.1);
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.1);
    vertical-align: middle;
    border: none; }

.sterad__content {
  opacity: 0;
  /* Hide until banner is loaded, will be re-enabled by JS */ }

/*
 * Ster advertentie
 *
 * Small uppercase font for advertisement heading
 */
.sterad__header {
  font-size: 12px;
  text-transform: uppercase; }

/*
 * Iframe wrapper
 *
 * Display inline-block to align center and set transform-origin to top left
 */
.sterad__wrap {
  display: inline-block;
  vertical-align: middle;
  transform-origin: 0 0; }

.rm-togglebutton .hamburger {
  position: relative;
  z-index: 3;
  width: 33px;
  height: 33px;
  padding: 0;
  border: none;
  color: #003576;
  display: inline-block;
  vertical-align: middle;
  /**
   * Styling the hamburger bars
   */ }
  .rm-togglebutton .hamburger .bar1,
  .rm-togglebutton .hamburger .bar2,
  .rm-togglebutton .hamburger .bar3 {
    position: absolute;
    left: 9px;
    display: block;
    width: 15px;
    height: 3px;
    border-radius: 1px;
    background: #003576;
    vertical-align: middle;
    transition: all 0.2s cubic-bezier(0.195, 0.4, 0.45, 0.785); }
  .rm-togglebutton .hamburger .bar1 {
    top: 9px; }
  .rm-togglebutton .hamburger .bar2 {
    top: 15px; }
  .rm-togglebutton .hamburger .bar3 {
    top: 21px; }

/**
 * Transform hamburger into a cross when the sidebar is opened
 */
.rm-togglebutton--closed .hamburger .bar1 {
  top: 15px;
  transform: rotate(45deg); }

.rm-togglebutton--closed .hamburger .bar2 {
  opacity: 0;
  transform: scale(0); }

.rm-togglebutton--closed .hamburger .bar3 {
  top: 15px;
  transform: rotate(-45deg); }

@keyframes plyr-progress {
  to {
    background-position: 25px 0; } }

.plyr {
  position: relative;
  max-width: 100%;
  min-width: 200px;
  font-family: Avenir, "Avenir Next", "Helvetica Neue", "Segoe UI", Helvetica, Arial, sans-serif;
  direction: ltr; }
  .plyr a, .plyr button, .plyr input, .plyr label {
    -ms-touch-action: manipulation;
        touch-action: manipulation; }
  .plyr:focus {
    outline: 0; }
  .plyr video,
  .plyr audio {
    width: 100%;
    height: auto;
    vertical-align: middle;
    border-radius: inherit; }
  .plyr input[type='range'] {
    display: block;
    height: 20px;
    width: 100%;
    margin: 0;
    padding: 0;
    vertical-align: middle;
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
    cursor: pointer;
    border: none;
    background: transparent; }
    .plyr input[type='range']::-webkit-slider-runnable-track {
      height: 8px;
      background: transparent;
      border: 0;
      border-radius: 4px;
      -webkit-user-select: none;
              user-select: none; }
    .plyr input[type='range']::-webkit-slider-thumb {
      -webkit-appearance: none;
      margin-top: -4px;
      position: relative;
      height: 16px;
      width: 16px;
      background: #fff;
      border: 2px solid transparent;
      border-radius: 100%;
      transition: background .2s ease, border .2s ease, transform .2s ease;
      box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15), 0 0 0 1px rgba(0, 0, 0, 0.15);
      box-sizing: border-box; }
    .plyr input[type='range']::-moz-range-track {
      height: 8px;
      background: transparent;
      border: 0;
      border-radius: 4px;
      -moz-user-select: none;
           user-select: none; }
    .plyr input[type='range']::-moz-range-thumb {
      position: relative;
      height: 16px;
      width: 16px;
      background: #fff;
      border: 2px solid transparent;
      border-radius: 100%;
      transition: background .2s ease, border .2s ease, transform .2s ease;
      box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15), 0 0 0 1px rgba(0, 0, 0, 0.15);
      box-sizing: border-box; }
    .plyr input[type='range']::-ms-track {
      height: 8px;
      background: transparent;
      border: 0;
      color: transparent; }
    .plyr input[type='range']::-ms-fill-upper {
      height: 8px;
      background: transparent;
      border: 0;
      border-radius: 4px;
      -ms-user-select: none;
          user-select: none; }
    .plyr input[type='range']::-ms-fill-lower {
      height: 8px;
      background: transparent;
      border: 0;
      border-radius: 4px;
      -ms-user-select: none;
          user-select: none;
      background: #00b9e6; }
    .plyr input[type='range']::-ms-thumb {
      position: relative;
      height: 16px;
      width: 16px;
      background: #fff;
      border: 2px solid transparent;
      border-radius: 100%;
      transition: background .2s ease, border .2s ease, transform .2s ease;
      box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15), 0 0 0 1px rgba(0, 0, 0, 0.15);
      box-sizing: border-box;
      margin-top: 0; }
    .plyr input[type='range']::-ms-tooltip {
      display: none; }
    .plyr input[type='range']:focus {
      outline: 0; }
    .plyr input[type='range']::-moz-focus-outer {
      border: 0; }
    .plyr input[type='range'].tab-focus:focus {
      outline-offset: 3px; }
    .plyr input[type='range']:active::-webkit-slider-thumb {
      background: #00b9e6;
      border-color: #fff;
      transform: scale(1.25); }
    .plyr input[type='range']:active::-moz-range-thumb {
      background: #00b9e6;
      border-color: #fff;
      transform: scale(1.25); }
    .plyr input[type='range']:active::-ms-thumb {
      background: #00b9e6;
      border-color: #fff;
      transform: scale(1.25); }

.plyr--video input[type='range'].tab-focus:focus {
  outline: 1px dotted rgba(255, 255, 255, 0.5); }

.plyr--audio input[type='range'].tab-focus:focus {
  outline: 1px dotted rgba(86, 93, 100, 0.5); }

.plyr__sr-only {
  clip: rect(1px, 1px, 1px, 1px);
  overflow: hidden;
  position: absolute;
  padding: 0;
  border: 0;
  height: 1px;
  width: 1px; }

.plyr__video-wrapper {
  position: relative;
  background: #000;
  border-radius: inherit; }

.plyr__video-embed {
  padding-bottom: 56.25%;
  /* 16:9 */
  height: 0;
  border-radius: inherit;
  overflow: hidden;
  z-index: 0; }
  .plyr__video-embed iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none; }
  .plyr__video-embed > div {
    position: relative;
    padding-bottom: 200%;
    transform: translateY(-35.95%); }

.plyr .plyr__video-embed iframe {
  pointer-events: none; }

.plyr video::-webkit-media-text-track-container {
  display: none; }

.plyr__captions {
  display: none;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  padding: 20px;
  transform: translateY(-60px);
  transition: transform .3s ease;
  color: #fff;
  font-size: 16px;
  text-align: center;
  font-weight: 400; }
  .plyr__captions span {
    border-radius: 2px;
    padding: 3px 10px;
    background: rgba(0, 0, 0, 0.7);
    -webkit-box-decoration-break: clone;
            box-decoration-break: clone;
    line-height: 150%; }
  .plyr__captions span:empty {
    display: none; }
  @media (min-width: 768px) {
    .plyr__captions {
      font-size: 24px; } }

.plyr--captions-active .plyr__captions {
  display: block; }

.plyr--hide-controls .plyr__captions {
  transform: translateY(-20px); }

@media (min-width: 1024px) {
  .plyr--fullscreen-active .plyr__captions {
    font-size: 32px; } }

.plyr ::-webkit-media-controls {
  display: none; }

.plyr__controls {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
  line-height: 1;
  text-align: center; }
  .plyr__controls > button,
  .plyr__controls .plyr__progress,
  .plyr__controls .plyr__time {
    margin-left: 5px; }
    .plyr__controls > button:first-child,
    .plyr__controls .plyr__progress:first-child,
    .plyr__controls .plyr__time:first-child {
      margin-left: 0; }
  .plyr__controls .plyr__volume {
    margin-left: 5px; }
  .plyr__controls [data-plyr="pause"] {
    margin-left: 0; }
  .plyr__controls button {
    position: relative;
    display: inline-block;
    -ms-flex-negative: 0;
        flex-shrink: 0;
    overflow: visible;
    vertical-align: middle;
    padding: 7px;
    border: 0;
    background: transparent;
    border-radius: 3px;
    cursor: pointer;
    transition: background .3s ease, color .3s ease, opacity .3s ease;
    color: inherit; }
    .plyr__controls button svg {
      width: 18px;
      height: 18px;
      display: block;
      fill: currentColor; }
    .plyr__controls button:focus {
      outline: 0; }
  .plyr__controls .icon--exit-fullscreen,
  .plyr__controls .icon--muted,
  .plyr__controls .icon--captions-on {
    display: none; }
  @media (min-width: 480px) {
    .plyr__controls > button,
    .plyr__controls .plyr__progress,
    .plyr__controls .plyr__time {
      margin-left: 10px; } }

.plyr--hide-controls .plyr__controls {
  opacity: 0;
  pointer-events: none; }

.plyr--video .plyr__controls {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 50px 10px 10px;
  background: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5));
  border-bottom-left-radius: inherit;
  border-bottom-right-radius: inherit;
  color: #fff;
  transition: opacity .3s ease; }
  .plyr--video .plyr__controls button.tab-focus:focus, .plyr--video .plyr__controls button:hover {
    background: #00b9e6;
    color: #fff; }

.plyr--audio .plyr__controls {
  padding: 10px;
  border-radius: inherit;
  background: #fff;
  border: none;
  color: #565D64; }
  .plyr--audio .plyr__controls button.tab-focus:focus, .plyr--audio .plyr__controls button:hover {
    background: #00b9e6;
    color: #fff; }

.plyr__play-large {
  display: none;
  position: absolute;
  z-index: 1;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  padding: 10px;
  background: #00b9e6;
  border: 4px solid currentColor;
  border-radius: 100%;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15);
  color: #fff;
  transition: all .3s ease; }
  .plyr__play-large svg {
    position: relative;
    left: 2px;
    width: 20px;
    height: 20px;
    display: block;
    fill: currentColor; }
  .plyr__play-large:focus {
    outline: 1px dotted rgba(255, 255, 255, 0.5); }

.plyr .plyr__play-large {
  display: inline-block; }

.plyr--audio .plyr__play-large {
  display: none; }

.plyr--playing .plyr__play-large {
  opacity: 0;
  visibility: hidden; }

.plyr__controls [data-plyr='pause'],
.plyr--playing .plyr__controls [data-plyr='play'] {
  display: none; }

.plyr--playing .plyr__controls [data-plyr='pause'] {
  display: inline-block; }

.plyr--fullscreen-active .icon--exit-fullscreen,
.plyr--muted .plyr__controls .icon--muted,
.plyr--captions-active .plyr__controls .icon--captions-on {
  display: block; }
  .plyr--fullscreen-active .icon--exit-fullscreen + svg,
  .plyr--muted .plyr__controls .icon--muted + svg,
  .plyr--captions-active .plyr__controls .icon--captions-on + svg {
    display: none; }

.plyr [data-plyr='captions'],
.plyr [data-plyr='fullscreen'] {
  display: none; }

.plyr--captions-enabled [data-plyr='captions'],
.plyr--fullscreen-enabled [data-plyr='fullscreen'] {
  display: inline-block; }

.plyr__tooltip {
  position: absolute;
  z-index: 2;
  bottom: 100%;
  margin-bottom: 10px;
  padding: 5px 7.5px;
  pointer-events: none;
  opacity: 0;
  background: white;
  border-radius: 3px;
  color: black;
  font-size: 14px;
  line-height: 1.3;
  transform: translate(-50%, 10px) scale(0.8);
  transform-origin: 50% 100%;
  transition: transform .2s .1s ease, opacity .2s .1s ease; }
  .plyr__tooltip::before {
    content: '';
    position: absolute;
    width: 0;
    height: 0;
    left: 50%;
    transform: translateX(-50%);
    bottom: -4px;
    border-right: 4px solid transparent;
    border-top: 4px solid white;
    border-left: 4px solid transparent;
    z-index: 2; }

.plyr button:hover .plyr__tooltip,
.plyr button.tab-focus:focus .plyr__tooltip,
.plyr__tooltip--visible {
  opacity: 1;
  transform: translate(-50%, 0) scale(1); }

.plyr button:hover .plyr__tooltip {
  z-index: 3; }

.plyr__controls button:first-child .plyr__tooltip {
  left: 0;
  transform: translate(0, 10px) scale(0.8);
  transform-origin: 0 100%; }
  .plyr__controls button:first-child .plyr__tooltip::before {
    left: 16px; }

.plyr__controls button:last-child .plyr__tooltip {
  right: 0;
  transform: translate(0, 10px) scale(0.8);
  transform-origin: 100% 100%; }
  .plyr__controls button:last-child .plyr__tooltip::before {
    left: auto;
    right: 16px;
    transform: translateX(50%); }

.plyr__controls button:first-child:hover .plyr__tooltip,
.plyr__controls button:first-child.tab-focus:focus .plyr__tooltip,
.plyr__controls button:first-child .plyr__tooltip--visible,
.plyr__controls button:last-child:hover .plyr__tooltip,
.plyr__controls button:last-child.tab-focus:focus .plyr__tooltip,
.plyr__controls button:last-child .plyr__tooltip--visible {
  transform: translate(0, 0) scale(1); }

.plyr__progress {
  display: none;
  position: relative;
  -ms-flex: 1;
      flex: 1; }
  .plyr__progress input[type="range"] {
    position: relative;
    z-index: 2; }
    .plyr__progress input[type="range"]::-webkit-slider-runnable-track {
      background: transparent; }
    .plyr__progress input[type="range"]::-moz-range-track {
      background: transparent; }
    .plyr__progress input[type="range"]::-ms-fill-upper {
      background: transparent; }
  .plyr__progress .plyr__tooltip {
    left: 0; }

.plyr .plyr__progress {
  display: inline-block; }

.plyr__progress--buffer,
.plyr__progress--played,
.plyr__volume--display {
  position: absolute;
  left: 0;
  top: 50%;
  width: 100%;
  height: 8px;
  margin: -4px 0 0;
  padding: 0;
  vertical-align: top;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  border: none;
  border-radius: 100px; }
  .plyr__progress--buffer::-webkit-progress-bar,
  .plyr__progress--played::-webkit-progress-bar,
  .plyr__volume--display::-webkit-progress-bar {
    background: transparent; }
  .plyr__progress--buffer::-webkit-progress-value,
  .plyr__progress--played::-webkit-progress-value,
  .plyr__volume--display::-webkit-progress-value {
    background: currentColor;
    border-radius: 100px;
    min-width: 8px; }
  .plyr__progress--buffer::-moz-progress-bar,
  .plyr__progress--played::-moz-progress-bar,
  .plyr__volume--display::-moz-progress-bar {
    background: currentColor;
    border-radius: 100px;
    min-width: 8px; }
  .plyr__progress--buffer::-ms-fill,
  .plyr__progress--played::-ms-fill,
  .plyr__volume--display::-ms-fill {
    border-radius: 100px; }

.plyr__progress--played,
.plyr__volume--display {
  z-index: 1;
  color: #00b9e6;
  background: transparent;
  transition: none; }
  .plyr__progress--played::-webkit-progress-value,
  .plyr__volume--display::-webkit-progress-value {
    min-width: 8px;
    max-width: 99%;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    transition: none; }
  .plyr__progress--played::-moz-progress-bar,
  .plyr__volume--display::-moz-progress-bar {
    min-width: 8px;
    max-width: 99%;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    transition: none; }
  .plyr__progress--played::-ms-fill,
  .plyr__volume--display::-ms-fill {
    display: none; }

.plyr__progress--buffer::-webkit-progress-value {
  transition: width .2s ease; }

.plyr__progress--buffer::-moz-progress-bar {
  transition: width .2s ease; }

.plyr__progress--buffer::-ms-fill {
  transition: width .2s ease; }

.plyr--video .plyr__progress--buffer,
.plyr--video .plyr__volume--display {
  background: rgba(255, 255, 255, 0.25); }

.plyr--video .plyr__progress--buffer {
  color: rgba(255, 255, 255, 0.25); }

.plyr--audio .plyr__progress--buffer,
.plyr--audio .plyr__volume--display {
  background: rgba(198, 214, 219, 0.67); }

.plyr--audio .plyr__progress--buffer {
  color: rgba(198, 214, 219, 0.67); }

.plyr--loading .plyr__progress--buffer {
  animation: plyr-progress 1s linear infinite;
  background-size: 25px 25px;
  background-repeat: repeat-x;
  background-image: linear-gradient(-45deg, rgba(0, 0, 0, 0.15) 25%, transparent 25%, transparent 50%, rgba(0, 0, 0, 0.15) 50%, rgba(0, 0, 0, 0.15) 75%, transparent 75%, transparent);
  color: transparent; }

.plyr--video.plyr--loading .plyr__progress--buffer {
  background-color: rgba(255, 255, 255, 0.25); }

.plyr--audio.plyr--loading .plyr__progress--buffer {
  background-color: rgba(198, 214, 219, 0.67); }

.plyr__time {
  display: inline-block;
  vertical-align: middle;
  font-size: 14px; }

.plyr__time + .plyr__time {
  display: none; }
  @media (min-width: 768px) {
    .plyr__time + .plyr__time {
      display: inline-block; } }
  .plyr__time + .plyr__time::before {
    content: '\2044';
    margin-right: 10px; }

.plyr__volume {
  display: none; }

.plyr .plyr__volume {
  -ms-flex: 1;
      flex: 1;
  position: relative; }
  .plyr .plyr__volume input[type="range"] {
    position: relative;
    z-index: 2; }
  @media (min-width: 480px) {
    .plyr .plyr__volume {
      display: block;
      max-width: 60px; } }
  @media (min-width: 768px) {
    .plyr .plyr__volume {
      max-width: 100px; } }

.plyr--is-ios .plyr__volume,
.plyr--is-ios [data-plyr='mute'] {
  display: none !important; }

.plyr--fullscreen-active {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  height: 100%;
  width: 100%;
  z-index: 10000000;
  background: #000;
  border-radius: 0 !important; }
  .plyr--fullscreen-active video {
    height: 100%; }
  .plyr--fullscreen-active .plyr__video-wrapper {
    height: 100%;
    width: 100%; }
  .plyr--fullscreen-active .plyr__video-embed {
    overflow: visible; }
  .plyr--fullscreen-active .plyr__controls {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0; }
  .plyr--fullscreen-active.plyr--vimeo .plyr__video-wrapper {
    height: 0;
    top: 50%;
    transform: translateY(-50%); }

/* Tipso Bubble */
.tipso_bubble {
  position: absolute;
  text-align: center;
  border-radius: 4px;
  z-index: 999;
  max-width: 300px;
  pointer-events: none; }

.tipso_title {
  border-radius: 6px 6px 0 0; }

.tipso_content {
  padding: 5px 10px;
  border-radius: 4px;
  font-size: 16px;
  line-height: 24px; }

/* Tipso Bubble Div */
.tipso_bubble > .tipso_arrow {
  position: absolute;
  width: 0;
  height: 0;
  border: 8px solid;
  pointer-events: none; }

.tipso_bubble.top > .tipso_arrow {
  border-top-color: #000;
  border-right-color: transparent;
  border-left-color: transparent;
  border-bottom-color: transparent;
  top: 100%;
  right: 17px;
  margin-left: -8px; }

.tipso_bubble.bottom > .tipso_arrow {
  border-bottom-color: #000;
  border-right-color: transparent;
  border-left-color: transparent;
  border-top-color: transparent;
  bottom: 100%;
  right: 17px;
  margin-left: -8px; }

.tipso_bubble.left > .tipso_arrow {
  border-left-color: #000;
  border-top-color: transparent;
  border-bottom-color: transparent;
  border-right-color: transparent;
  top: 50%;
  left: 100%;
  margin-top: -8px; }

.tipso_bubble.right > .tipso_arrow {
  border-right-color: #000;
  border-top-color: transparent;
  border-bottom-color: transparent;
  border-left-color: transparent;
  top: 50%;
  right: 100%;
  margin-top: -8px; }

.tipso_bubble .top_right_corner .tipso_arrow,
.tipso_bubble.top_right_corner .tipso_arrow {
  left: auto;
  right: 13px; }

.tipso_bubble .top_left_corner .tipso_arrow,
.tipso_bubble.top_left_corner .tipso_arrow {
  left: auto;
  right: 13px; }

/*!
 * animate.css -http://daneden.me/animate
 * Version - 3.5.1
 * Licensed under the MIT license - http://opensource.org/licenses/MIT
 *
 * Copyright (c) 2016 Daniel Eden
 */
.animated {
  animation-duration: .5s;
  animation-fill-mode: both; }

@keyframes fadeInDown {
  from {
    opacity: 0;
    transform: translate3d(0, -50%, 0); }
  to {
    opacity: 1;
    transform: none; } }

.fadeInDown {
  animation-name: fadeInDown; }

@keyframes fadeOutUp {
  from {
    opacity: 1; }
  to {
    opacity: 0;
    transform: translate3d(0, -50%, 0); } }

.fadeOutUp {
  animation-name: fadeOutUp; }

.tipso {
  position: relative; }
  .tipso:after {
    display: block;
    position: absolute;
    content: " ";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1; }
  .tipso svg {
    z-index: 0; }

body.npo-studio-messenger-opened {
  overflow: hidden; }

.npo-studio-messenger .messenger-page-mask {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1000;
  transform: translateX(100%);
  transition: opacity .4s ease-in-out, transform 0s linear .4s;
  opacity: 0;
  background: rgba(0, 0, 0, 0.4); }

.npo-studio-messenger .messenger-pages {
  position: fixed;
  top: 0;
  bottom: 0;
  right: 0;
  transform: translateX(100%);
  z-index: 2000;
  width: 500px;
  max-width: 100vw;
  transition: transform .4s ease-in-out; }

.npo-studio-messenger.messenger-opened {
  display: block; }

.npo-studio-messenger.messenger-opened .messenger-page-mask {
  transform: translateX(0);
  opacity: 1;
  transition: opacity .4s ease-in-out; }

.npo-studio-messenger.messenger-opened .messenger-pages {
  transform: translateX(0); }

.npo-studio-messenger * {
  box-sizing: border-box; }

.npo-studio-messenger svg {
  width: auto;
  height: 100%; }

.npo-studio-messenger .page-profile-create, .npo-studio-messenger .page-profile-update, .npo-studio-messenger .page-messages {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column;
  position: relative;
  height: 100%;
  background: #ffffff; }

.npo-studio-messenger .messenger-page-header {
  -ms-flex: 0 0 auto;
      flex: 0 0 auto;
  height: 70px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: row;
      flex-direction: row;
  -ms-flex-align: center;
      align-items: center;
  font-size: 24px;
  background: #003576;
  color: #ffffff; }
  .npo-studio-messenger .messenger-page-header .button-messenger-close, .npo-studio-messenger .messenger-page-header .button-messenger-back, .npo-studio-messenger .messenger-page-header .button-messenger-profile-update {
    -ms-flex: 0 0 auto;
        flex: 0 0 auto;
    height: 70px;
    width: 70px;
    outline: 0;
    padding: 0;
    margin: 0;
    border: 0;
    cursor: pointer;
    background: transparent;
    transition: transform .2s ease-in-out; }
    .npo-studio-messenger .messenger-page-header .button-messenger-close svg, .npo-studio-messenger .messenger-page-header .button-messenger-back svg, .npo-studio-messenger .messenger-page-header .button-messenger-profile-update svg {
      fill: #ffffff;
      max-height: 40%; }
  .npo-studio-messenger .messenger-page-header .button-messenger-close:hover, .npo-studio-messenger .messenger-page-header .button-messenger-back:hover, .npo-studio-messenger .messenger-page-header .button-messenger-profile-update:hover {
    transform: scale(1.1); }
  .npo-studio-messenger .messenger-page-header .messenger-page-title {
    -ms-flex: 1 1 auto;
        flex: 1 1 auto; }

.npo-studio-messenger .messenger-page-content {
  -ms-flex: 1 1 auto;
      flex: 1 1 auto; }

.npo-studio-messenger .messenger-errors {
  color: red; }

.npo-studio-messenger .page-profile-create .messenger-page-content, .npo-studio-messenger .page-profile-update .messenger-page-content {
  overflow: hidden;
  overflow-y: auto;
  padding: 10px; }

.npo-studio-messenger .page-profile-create .profile-create-intro, .npo-studio-messenger .page-profile-update .profile-create-intro {
  margin: 0 0 20px 0; }

.npo-studio-messenger .page-profile-create p, .npo-studio-messenger .page-profile-update p {
  margin: 12px 0; }

.npo-studio-messenger .page-profile-create label, .npo-studio-messenger .page-profile-update label {
  display: block;
  color: #003576;
  margin: 20px 0 3px 0; }

.npo-studio-messenger .page-profile-create input[type=checkbox], .npo-studio-messenger .page-profile-update input[type=checkbox] {
  margin: 3px; }

.npo-studio-messenger .page-profile-create input[type=text], .npo-studio-messenger .page-profile-create input[type=tel], .npo-studio-messenger .page-profile-create input[type=email], .npo-studio-messenger .page-profile-update input[type=text], .npo-studio-messenger .page-profile-update input[type=tel], .npo-studio-messenger .page-profile-update input[type=email] {
  display: block;
  width: 100%;
  padding: 10px;
  border: 1px solid #003576;
  border-radius: 3px; }

.npo-studio-messenger .page-profile-create button[type=submit], .npo-studio-messenger .page-profile-update button[type=submit] {
  display: block;
  width: 100%;
  height: 40px;
  margin: 20px 0;
  font-size: 16px;
  font-weight: bold;
  cursor: pointer;
  border: 2px solid #003576;
  background: #ffffff;
  color: #003576; }

.npo-studio-messenger .page-profile-create button[type=submit]:hover, .npo-studio-messenger .page-profile-update button[type=submit]:hover {
  background: #003576;
  color: #ffffff; }

.npo-studio-messenger .page-messages .messages-list {
  -ms-flex: 1 1 auto;
      flex: 1 1 auto;
  overflow-y: auto; }

.npo-studio-messenger .page-messages .message-new {
  -ms-flex: 0 0 auto;
      flex: 0 0 auto; }

.npo-studio-messenger .messages-list ul {
  margin: 0;
  padding: 0;
  list-style: none;
  overflow: hidden; }

.npo-studio-messenger .messages-list li {
  margin: 0;
  padding: 10px 0 0 0;
  clear: both; }
  .npo-studio-messenger .messages-list li .message {
    color: #003576;
    max-width: 75%; }
  .npo-studio-messenger .messages-list li .message-content {
    padding: 10px; }
  .npo-studio-messenger .messages-list li .message-avatar {
    float: left;
    width: 44px;
    height: 44px;
    margin-left: 10px;
    border-radius: 22px; }
  .npo-studio-messenger .messages-list li .message-name {
    font-weight: bold;
    margin-bottom: 5px; }
  .npo-studio-messenger .messages-list li .message-body img, .npo-studio-messenger .messages-list li .message-body video, .npo-studio-messenger .messages-list li .message-body audio {
    display: block;
    max-width: 100%;
    margin-bottom: 10px; }
  .npo-studio-messenger .messages-list li .message-body *:last-child {
    margin-bottom: 0; }
  .npo-studio-messenger .messages-list li .message-time {
    font-size: 11px;
    margin: 5px 10px; }
  .npo-studio-messenger .messages-list li.from-server .message {
    float: left; }
  .npo-studio-messenger .messages-list li.from-server .message-content {
    margin-left: 65px;
    background: #ffffff;
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.15);
    border-radius: 3px 10px 10px 10px; }
  .npo-studio-messenger .messages-list li.from-server .message-time {
    margin-left: 65px; }
  .npo-studio-messenger .messages-list li.from-client .message {
    float: right; }
  .npo-studio-messenger .messages-list li.from-client .message-content {
    margin-right: 10px;
    margin-bottom: 4px;
    float: right;
    background: #F1F4F7;
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.15);
    border-radius: 10px 10px 3px 10px; }
  .npo-studio-messenger .messages-list li.from-client .message-time {
    clear: right;
    text-align: right; }

.npo-studio-messenger a.message-content-link {
  display: block;
  text-decoration: none;
  color: #000; }
  .npo-studio-messenger a.message-content-link img.link-image {
    float: right;
    max-width: 25%;
    margin-left: 10px; }
  .npo-studio-messenger a.message-content-link .link-title {
    display: block;
    font-weight: bold;
    font-size: 16px; }
  .npo-studio-messenger a.message-content-link:hover .link-title {
    text-decoration: underline; }
  .npo-studio-messenger a.message-content-link .link-description {
    display: block;
    padding-top: 10px;
    font-size: 14px; }
  .npo-studio-messenger a.message-content-link .link-url {
    clear: both;
    display: block;
    padding-top: 10px;
    color: #00B9E6;
    text-decoration: underline;
    font-size: 14px; }

.npo-studio-messenger .message-new {
  background: #003576;
  padding: 10px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: row;
      flex-direction: row;
  -ms-flex-align: end;
      align-items: flex-end;
  -ms-flex-line-pack: stretch;
      align-content: stretch;
  overflow: hidden;
  width: 100%;
  z-index: 2; }
  .npo-studio-messenger .message-new-inputwrapper {
    -ms-flex: 1 1 auto;
        flex: 1 1 auto;
    border-radius: 3px;
    font-size: 16px;
    background: #ffffff;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
        flex-direction: row;
    -ms-flex-align: end;
        align-items: flex-end;
    -ms-flex-line-pack: stretch;
        align-content: stretch; }
    .npo-studio-messenger .message-new-inputwrapper textarea {
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
      resize: none;
      margin: 0;
      padding: 10px;
      border: 0;
      outline: none;
      font-family: inherit;
      font-size: 16px;
      line-height: 18px;
      color: #000000;
      background: #ffffff; }
    .npo-studio-messenger .message-new-inputwrapper .inputbuttons-right {
      -ms-flex: 0 0 auto;
          flex: 0 0 auto; }
      .npo-studio-messenger .message-new-inputwrapper .inputbuttons-right .button-message-photo-add {
        width: 30px;
        height: 30px;
        margin: 5px 10px; }
        .npo-studio-messenger .message-new-inputwrapper .inputbuttons-right .button-message-photo-add svg {
          fill: #003576;
          height: 75%; }
  .npo-studio-messenger .message-new button {
    margin: 0;
    padding: 0;
    outline: none;
    border: 0;
    display: block;
    background: transparent; }
  .npo-studio-messenger .message-new .button-message-audio-add {
    -ms-flex: 0 0 auto;
        flex: 0 0 auto;
    width: 40px;
    height: 40px;
    border-radius: 20px;
    margin: 0 0 0 10px;
    background: #ffffff; }
    .npo-studio-messenger .message-new .button-message-audio-add svg {
      fill: #003576;
      height: 60%; }
    .npo-studio-messenger .message-new .button-message-audio-add-hidden {
      display: none; }
  .npo-studio-messenger .message-new .button-message-send {
    -ms-flex: 0 0 auto;
        flex: 0 0 auto;
    width: 40px;
    height: 40px;
    border-radius: 20px;
    margin: 0 0 0 10px;
    background: #ffffff; }
    .npo-studio-messenger .message-new .button-message-send svg {
      fill: #003576;
      height: 55%; }
    .npo-studio-messenger .message-new .button-message-send-hidden {
      display: none; }
  .npo-studio-messenger .message-new .button-message-photo-add, .npo-studio-messenger .message-new .button-message-audio-add, .npo-studio-messenger .message-new .button-message-send {
    transition: transform .2s ease-in-out;
    cursor: pointer; }
  .npo-studio-messenger .message-new .button-message-photo-add:hover, .npo-studio-messenger .message-new .button-message-audio-add:hover, .npo-studio-messenger .message-new .button-message-send:hover, .npo-studio-messenger .message-new .button-message-photo-add:active, .npo-studio-messenger .message-new .button-message-audio-add:active, .npo-studio-messenger .message-new .button-message-send:active {
    transform: scale(1.1); }

.npo-studio-messenger .photo-new {
  display: none;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1000;
  background: rgba(0, 0, 0, 0.7); }
  .npo-studio-messenger .photo-new .button-photo-close {
    position: absolute;
    top: 1%;
    left: 1%;
    height: 60px;
    width: 60px;
    outline: 0;
    padding: 0;
    margin: 0;
    border: 0;
    cursor: pointer;
    background: transparent;
    transition: transform .2s ease-in-out; }
    .npo-studio-messenger .photo-new .button-photo-close svg {
      fill: #fff;
      height: 80%; }
  .npo-studio-messenger .photo-new .button-photo-close:hover {
    transform: scale(1.1); }
  .npo-studio-messenger .photo-new .photo-new-input {
    display: none; }
  .npo-studio-messenger .photo-new .photo-container {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 80%;
    transform: translate(-50%, -50%); }
  .npo-studio-messenger .photo-new .photo-container-title {
    background: #003576;
    color: #ffffff;
    height: 60px;
    line-height: 60px;
    padding: 0 20px;
    font-size: 18px; }
  .npo-studio-messenger .photo-new .photo-preview {
    background: #000; }
    .npo-studio-messenger .photo-new .photo-preview img {
      display: block;
      margin: 0 auto;
      max-width: 100%;
      max-height: 65vh; }
  .npo-studio-messenger .photo-new .photo-text-container {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
        flex-direction: row;
    -ms-flex-align: end;
        align-items: flex-end;
    -ms-flex-line-pack: stretch;
        align-content: stretch;
    padding: 10px;
    background: #003576; }
  .npo-studio-messenger .photo-new .photo-text-input {
    -ms-flex: 1 1 auto;
        flex: 1 1 auto;
    border-radius: 3px;
    font-size: 16px;
    resize: none;
    margin: 0;
    padding: 10px;
    border: 0;
    outline: none;
    font-size: 16px;
    background: #fff; }
  .npo-studio-messenger .photo-new .button-photo-send {
    -ms-flex: 0 0 auto;
        flex: 0 0 auto;
    width: 40px;
    height: 40px;
    border-radius: 20px;
    margin: 0 0 0 10px;
    background: #ffffff; }
    .npo-studio-messenger .photo-new .button-photo-send svg {
      fill: #003576;
      height: 55%; }

.npo-studio-messenger .audio-new {
  display: none;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1000;
  background: rgba(0, 0, 0, 0.7); }
  .npo-studio-messenger .audio-new .button-audio-close {
    position: absolute;
    top: 1.5%;
    left: 1.5%;
    height: 70px;
    width: 70px;
    outline: 0;
    padding: 0;
    margin: 0;
    border: 0;
    cursor: pointer;
    background: transparent;
    transition: transform .2s ease-in-out; }
    .npo-studio-messenger .audio-new .button-audio-close svg {
      fill: #fff;
      height: 80%; }
  .npo-studio-messenger .audio-new .button-audio-close:hover {
    transform: scale(1.1); }
  .npo-studio-messenger .audio-new .audio-permission-explanation {
    position: absolute;
    top: 50%;
    left: 10%;
    width: 80%;
    transform: translateY(-50%);
    color: #fff; }
  .npo-studio-messenger .audio-new .audio-permission-error {
    display: none;
    position: absolute;
    top: 50%;
    left: 10%;
    width: 80%;
    transform: translateY(-50%);
    color: #f00;
    font-weight: bold; }
  .npo-studio-messenger .audio-new .button-audio-start, .npo-studio-messenger .audio-new .button-audio-stop {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 200px;
    height: 200px;
    transform: translate(-50%, -50%);
    padding: 50px;
    font-size: 18px;
    border: 0;
    border-radius: 100px;
    background: #fff; }
    .npo-studio-messenger .audio-new .button-audio-start span, .npo-studio-messenger .audio-new .button-audio-stop span {
      display: block; }
    .npo-studio-messenger .audio-new .button-audio-start svg, .npo-studio-messenger .audio-new .button-audio-stop svg {
      max-height: 60%;
      margin: -10px 0 10px 0; }
  .npo-studio-messenger .audio-new .button-audio-stop {
    color: #E42312; }
    .npo-studio-messenger .audio-new .button-audio-stop .audio-recording-duration {
      position: absolute;
      bottom: 0;
      left: 0;
      width: 100%;
      padding: 10px;
      font-weight: bold; }
    .npo-studio-messenger .audio-new .button-audio-stop svg {
      fill: #E42312; }
  .npo-studio-messenger .audio-new .audio-confirm {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%); }
  .npo-studio-messenger .audio-new .audio-confirm-container {
    background: #fff;
    margin-bottom: 10px; }
  .npo-studio-messenger .audio-new .audio-confirm-title {
    background: #003576;
    color: #ffffff;
    height: 60px;
    line-height: 60px;
    padding: 0 20px;
    font-size: 18px; }
  .npo-studio-messenger .audio-new .audio-preview {
    padding: 5px;
    border: 1px solid #003576; }
  .npo-studio-messenger .audio-new .button-audio-send {
    width: 100%;
    height: 40px;
    font-size: 20px;
    border: 2px solid #003576;
    background: #ffffff;
    color: #003576; }

/* Slider */
.slick-slider {
  position: relative;
  display: block;
  box-sizing: border-box;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -ms-touch-action: pan-y;
  touch-action: pan-y;
  -webkit-tap-highlight-color: transparent; }

.slick-list {
  position: relative;
  overflow: hidden;
  display: block;
  margin: 0;
  padding: 0; }
  .slick-list:focus {
    outline: none; }
  .slick-list.dragging {
    cursor: pointer;
    cursor: hand; }

.slick-slider .slick-track,
.slick-slider .slick-list {
  transform: translate3d(0, 0, 0); }

.slick-track {
  position: relative;
  left: 0;
  top: 0;
  display: block;
  margin-left: auto;
  margin-right: auto; }
  .slick-track:before, .slick-track:after {
    content: "";
    display: table; }
  .slick-track:after {
    clear: both; }
  .slick-loading .slick-track {
    visibility: hidden; }

.slick-slide {
  float: left;
  height: 100%;
  min-height: 1px;
  display: none; }
  [dir="rtl"] .slick-slide {
    float: right; }
  .slick-slide img {
    display: block; }
  .slick-slide.slick-loading img {
    display: none; }
  .slick-slide.dragging img {
    pointer-events: none; }
  .slick-initialized .slick-slide {
    display: block; }
  .slick-loading .slick-slide {
    visibility: hidden; }
  .slick-vertical .slick-slide {
    display: block;
    height: auto;
    border: 1px solid transparent; }

.slick-arrow.slick-hidden {
  display: none; }

/* Three times to win over most other classes without using !important */
.visually-hidden.visually-hidden.visually-hidden, .html.js .faq__item__content.is-closed {
  position: absolute;
  overflow: hidden;
  clip: rect(0 0 0 0);
  height: 1px;
  width: 1px;
  margin: -1px;
  padding: 0;
  border: 0; }

/* Default link styling */
a {
  color: #00b9e6; }
  a:focus, a:hover {
    text-decoration: none; }

/* Default address styling */
address {
  font-style: normal;
  margin-bottom: 15px; }
  address:last-child {
    margin-bottom: 0; }

/* Default blockquote styling */
blockquote {
  padding: 0;
  margin-top: 0;
  margin-left: 0;
  margin-right: 0;
  font-family: "aleo", "Calibri", "Gill Sans", "Trebuchet MS", Arial, sans-serif;
  font-weight: 700;
  font-size: 24px;
  line-height: 35px;
  margin-bottom: 15px; }
  blockquote:last-child {
    margin-bottom: 0; }
  @media screen and (min-width: 664px) {
    blockquote {
      font-size: 30px;
      line-height: 37px; } }

html {
  height: 100%; }

/* Default body styling */
body {
  height: 100%;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 17px;
  line-height: 25px;
  font-weight: 400;
  color: #3c3c3c;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  background: #f1f4f7;
  /* Creating a 1 column centered layout for non-media-querie browsers */
  width: 500px;
  margin: auto;
  border-left: 1px solid #ccc;
  border-right: 1px solid #ccc; }
  @media screen and (min-width: 0) {
    body {
      width: auto;
      border-left: none;
      border-right: none; } }

#wrapper {
  min-height: 100%; }

@supports ((display: -ms-flexbox) or (display: flex)) {
  #wrapper {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column; } }

else #wrapper {
  display: inline-block; }

.wrapper2 {
  -ms-flex: 1;
      flex: 1; }

/* Box size everything */
*, *:before, *:after {
  box-sizing: border-box; }

/* Default fieldset styling */
fieldset {
  margin: 0;
  padding: 0;
  list-style: none;
  border: none;
  background: transparent; }

/* Default heading styling */
h1, h2, h3, h4, h5, h6 {
  font-family: "aleo", "Calibri", "Gill Sans", "Trebuchet MS", Arial, sans-serif;
  margin-top: 0;
  margin-bottom: 15px; }
  h1:last-child, h2:last-child, h3:last-child, h4:last-child, h5:last-child, h6:last-child {
    margin-bottom: 0; }

/* Default HR styling */
hr {
  width: 100%;
  height: 1px;
  overflow: hidden;
  border: none;
  margin: 1em auto;
  background: #aaaaaa; }

/* Default image styling */
img {
  max-width: 100%;
  height: auto; }
  img:only-child {
    vertical-align: middle; }

/* Default paragraph styling */
p {
  margin-top: 0;
  margin-bottom: 25px; }
  p:last-child {
    margin-bottom: 0; }

/* Default strong styling */
strong {
  font-weight: 700; }

/* Default svg styling */
/* Hide SVG sprite */
.svg-sprite {
  display: none; }

/* Make SVG as big as parent font-size */
svg {
  width: 1em;
  height: 1em;
  fill: currentColor; }

/* Default video styling */
video {
  max-width: 100%; }

/**
 * Live buttons
 */
.live {
  position: relative;
  padding-top: 8px;
  white-space: nowrap;
  font-size: 0;
  overflow: hidden;
  height: 48px;
  top: 0;
  margin-left: 60px;
  padding-left: 0;
  background: transparent;
  /* Individual buttons */
  /* SVG icons */
  /* Text on the buttons */
  /* Show and Hide "live" and "'je" form app'je */ }
  @media screen and (min-width: 440px) {
    .live {
      padding-left: 0; } }
  @media screen and (min-width: 664px) {
    .live {
      padding-top: 10px;
      height: 56px;
      margin-left: 72px; } }
  @media screen and (min-width: 988px) {
    .live {
      margin-left: 0;
      -ms-flex-negative: 0;
          flex-shrink: 0;
      -ms-flex-order: 1;
          order: 1;
      position: absolute;
      top: 100%;
      left: 28px;
      height: 56px;
      padding-top: 10px; } }
  @media screen and (min-width: 1144px) {
    .live {
      height: 72px;
      padding-top: 18px; } }
  .live .button, .live .block-share__item {
    padding: 0 5px;
    height: 32px;
    line-height: 28px;
    margin-right: 6px;
    background: white;
    border: 2px solid #003576;
    color: #003576;
    font-size: 15px;
    /* Make small buttons when screen is very small, doing it with min-width max-width query so we stay mobile first */ }
    .live .button:focus, .live .block-share__item:focus, .live .button:hover, .live .block-share__item:hover {
      background: #003576;
      border: 2px solid #003576;
      color: white; }
    .live .button:last-child, .live .block-share__item:last-child {
      margin-right: 0; }
    @media screen and (min-width: 0) {
      .live .button, .live .block-share__item {
        width: 32px;
        max-width: 32px; } }
    @media screen and (min-width: 320px) {
      .live .button, .live .block-share__item {
        width: auto;
        max-width: none; } }
    @media screen and (min-width: 440px) {
      .live .button, .live .block-share__item {
        padding: 0 5px;
        margin-right: 8px; } }
    @media screen and (min-width: 664px) {
      .live .button, .live .block-share__item {
        padding: 0 10px;
        height: 36px;
        line-height: 32px;
        margin-right: 10px; } }
    @media screen and (min-width: 768px) {
      .live .button:focus, .live .block-share__item:focus, .live .button:hover, .live .block-share__item:hover {
        border: 2px solid white; } }
  .live .button__icon,
  .live .button svg,
  .live .block-share__item svg {
    display: inline-block; }
    @media screen and (min-width: 440px) {
      .live .button__icon,
      .live .button svg,
      .live .block-share__item svg {
        display: inline-block;
        width: 1em;
        height: 1em; } }
  .live .button__icon + .button__text,
  .live .button svg + .button__text,
  .live .block-share__item svg + .button__text {
    padding-left: 2px; }
    @media screen and (min-width: 0) {
      .live .button__icon + .button__text,
      .live .button svg + .button__text,
      .live .block-share__item svg + .button__text {
        display: none; } }
    @media screen and (min-width: 320px) {
      .live .button__icon + .button__text,
      .live .button svg + .button__text,
      .live .block-share__item svg + .button__text {
        display: inline-block; } }
    @media screen and (min-width: 440px) {
      .live .button__icon + .button__text,
      .live .button svg + .button__text,
      .live .block-share__item svg + .button__text {
        margin-left: 4px; } }
    @media screen and (min-width: 664px) {
      .live .button__icon + .button__text,
      .live .button svg + .button__text,
      .live .block-share__item svg + .button__text {
        margin-left: .33em; } }
  .live .hidden-mobile {
    display: none; }
    @media screen and (min-width: 440px) {
      .live .hidden-mobile {
        display: inline; } }
    @media screen and (min-width: 988px) {
      .live .hidden-mobile {
        display: none; } }
    @media screen and (min-width: 1144px) {
      .live .hidden-mobile {
        display: inline; } }

/**
 * Logo
 */
.logo {
  position: absolute;
  z-index: 2;
  width: 36px;
  height: 24px;
  margin: 12px;
  bottom: 32px;
  left: 0; }
  .logo a {
    display: block;
    line-height: 1; }
  .logo img {
    vertical-align: middle; }
  @media screen and (min-width: 664px) {
    .logo {
      width: 48px;
      height: 32px;
      bottom: 40px; } }
  @media screen and (min-width: 988px) {
    .logo {
      width: 60px;
      height: 40px;
      margin: 0;
      left: 28px;
      bottom: 20px; } }
  @media screen and (min-width: 1144px) {
    .logo {
      width: 120px;
      height: 80px;
      margin: 0;
      left: 28px;
      bottom: 20px; } }

/**
 * Wrapping the navigation and live buttons in the header
 */
@media screen and (min-width: 988px) {
  .navigation-wrapper {
    position: relative;
    height: 80px;
    display: -ms-flexbox;
    display: flex;
    margin-left: auto;
    margin-right: auto;
    max-width: 1316px;
    padding-left: 28px;
    padding-right: 28px; }
    .navigation-wrapper:before, .navigation-wrapper:after {
      display: table;
      content: " "; }
    .navigation-wrapper:after {
      clear: both; }
    .no-flexbox .navigation-wrapper,
    .no-flexboxlegacy .navigation-wrapper {
      display: block; } }

@media screen and (min-width: 1144px) {
  .navigation-wrapper {
    height: 120px; } }

/**
 * Search
 *
 * 1. To position the search button properly
 * 2. Spacing on mobile
 * 3. Position when menu is visible
 */
.search {
  position: relative;
  /* 1 */
  margin: 6px;
  /* 2 */
  margin-right: 40px; }
  @media screen and (min-width: 664px) {
    .search {
      -ms-flex-order: 2;
          order: 2;
      -ms-flex-negative: 1;
          flex-shrink: 1;
      margin: 10px 100px 6px 10px; } }
  @media screen and (min-width: 988px) {
    .search {
      position: absolute;
      /* 3 */
      top: 0;
      z-index: 1;
      width: 200px;
      right: -220px;
      margin: 3px 0; } }
  @media screen and (min-width: 1144px) {
    .search {
      width: 300px;
      right: -320px;
      margin: 20px 0; } }

/**
 * Search field
 *
 * 1. Appear normal on all devices
 * 2. Set box-sizing to border box for easier styling
 * 3. Cover whole parent
 */
.search__field[type] {
  -webkit-appearance: none;
  /* 1 */
  box-sizing: border-box;
  /* 2 */
  width: 100%;
  /*3 */
  height: 33px;
  line-height: 31px;
  padding: 0 33px 0 0.5em;
  border-radius: 0;
  border: none;
  margin: 0;
  background: white; }
  @media screen and (min-width: 664px) {
    .search__field[type] {
      height: 36px;
      line-height: 36px; } }
  @media screen and (min-width: 1144px) {
    .search__field[type] {
      height: 40px;
      line-height: 38px; } }
  .search__field[type]:-ms-input-placeholder {
    /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: #003576;
    opacity: 1;
    /* Firefox */ }
  .search__field[type]::placeholder {
    /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: #003576;
    opacity: 1;
    /* Firefox */ }
  .search__field[type]:-ms-input-placeholder {
    /* Internet Explorer 10-11 */
    color: #003576; }
  .search__field[type]::-ms-input-placeholder {
    /* Microsoft Edge */
    color: #003576; }

/**
 * Search field
 *
 * 1. Appear normal on all devices
 * 2. Position at the end of input field
 * 3. As large as input field
 */
.search__button {
  margin: 0;
  padding: 0;
  list-style: none;
  border: none;
  background: transparent;
  -webkit-appearance: none;
  /* 1 */
  position: absolute;
  /* 2 */
  top: 0;
  /* 2 */
  right: 0;
  /* 2 */
  width: 33px;
  /* 3 */
  height: 33px;
  /* 3 */
  /**
   * Search icon
   */ }
  @media screen and (min-width: 1144px) {
    .search__button {
      height: 40px;
      width: 40px; } }
  .search__button svg {
    fill: #003576;
    width: 16px;
    height: 16px;
    margin: 8.5px; }
    @media screen and (min-width: 1144px) {
      .search__button svg {
        margin: 12px; } }

/**
 * Nu live
 */
.nulive {
  background: #003576;
  color: white;
  height: 32px;
  line-height: 32px;
  font-family: "aleo", "Calibri", "Gill Sans", "Trebuchet MS", Arial, sans-serif; }
  @media screen and (min-width: 664px) {
    .nulive {
      height: 40px;
      line-height: 40px;
      font-size: 18px; } }
  @media screen and (min-width: 988px) {
    .nulive {
      height: 56px;
      line-height: 56px;
      text-align: right;
      font-size: 19px; } }
  @media screen and (min-width: 1144px) {
    .nulive {
      height: 72px;
      line-height: 72px;
      font-size: 22px; } }

.nulive__content {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  padding-left: 10px; }
  .nulive__content-divider {
    margin: 0 10px; }
  .nulive__content a:focus .nulive__content-title,
  .nulive__content a:hover .nulive__content-title {
    text-decoration: underline; }
  @media screen and (min-width: 664px) {
    .nulive__content {
      padding-left: 19px; } }
  @media screen and (min-width: 988px) {
    .nulive__content {
      margin-left: auto;
      margin-right: auto;
      max-width: 1316px;
      padding-left: 308px;
      padding-right: 28px; } }
  @media screen and (min-width: 1144px) {
    .nulive__content {
      padding-left: 348px; } }
  .nulive__content a {
    color: inherit;
    text-decoration: none; }

/* The main container to wrap grid items */
.container {
  position: relative;
  z-index: 1;
  margin-left: auto;
  margin-right: auto;
  max-width: 1280px;
  padding-left: 10px;
  padding-right: 10px; }
  .container:before, .container:after {
    display: table;
    content: " "; }
  .container:after {
    clear: both; }
  @media screen and (min-width: 664px) {
    .container {
      max-width: 1298px;
      padding-left: 19px;
      padding-right: 19px; } }
  @media screen and (min-width: 988px) {
    .container {
      max-width: 1316px;
      padding-left: 28px;
      padding-right: 28px; } }

.container--mobile-full {
  padding-left: 0;
  padding-right: 0; }
  @media screen and (min-width: 664px) {
    .container--mobile-full {
      max-width: 1298px;
      padding-left: 19px;
      padding-right: 19px; } }
  @media screen and (min-width: 988px) {
    .container--mobile-full {
      max-width: 1316px;
      padding-left: 28px;
      padding-right: 28px; } }

.container--mobile-full__item {
  padding-left: 10px;
  padding-right: 10px; }
  @media screen and (min-width: 664px) {
    .container--mobile-full__item {
      padding-left: 0;
      padding-right: 0; } }

/* Regular 2 columns layout 2/3 - 1/3 */
@media screen and (min-width: 988px) {
  .main {
    float: left;
    display: block;
    margin-right: 2.4390243902%;
    width: 65.8536585366%; }
    .main:last-child {
      margin-right: 0; } }

.sidebar {
  clear: right;
  padding-bottom: 10px; }
  .sidebar:before, .sidebar:after {
    display: table;
    content: " "; }
  .sidebar:after {
    clear: both; }
  @media screen and (min-width: 664px) {
    .sidebar {
      padding-bottom: 3.7037037037%; } }
  @media screen and (min-width: 988px) {
    .sidebar {
      width: 31.7073170732%;
      float: right;
      padding-bottom: 2.4390243902%; } }
  .sidebar .modules {
    padding-bottom: 10px; }
    .sidebar .modules:before, .sidebar .modules:after {
      display: table;
      content: " "; }
    .sidebar .modules:after {
      clear: both; }
    @media screen and (min-width: 664px) {
      .sidebar .modules {
        padding-bottom: 3.7037037037%; } }
    @media screen and (min-width: 988px) {
      .sidebar .modules {
        padding-bottom: 7.6923076923%; } }
    .sidebar .modules:last-child {
      padding-bottom: 0; }
  .sidebar .module {
    padding-bottom: 10px; }
    @media screen and (min-width: 664px) {
      .sidebar .module {
        float: left;
        display: block;
        margin-right: 3.7037037037%;
        width: 48.1481481481%;
        padding-bottom: 3.7037037037%; }
        .sidebar .module:nth-child(n+1) {
          clear: none;
          margin-right: 3.7037037037%; }
        .sidebar .module:last-child {
          margin-right: 0; }
        .sidebar .module:nth-child(2n) {
          margin-right: 0; }
        .sidebar .module:nth-child(2n+1) {
          clear: left; } }
    @media screen and (min-width: 988px) {
      .sidebar .module {
        float: left;
        display: block;
        margin-right: 2.4390243902%;
        width: 100%;
        padding-bottom: 7.6923076923%; }
        .sidebar .module:nth-child(n+1) {
          clear: none;
          margin-right: 2.4390243902%; }
        .sidebar .module:last-child {
          margin-right: 0; }
        .sidebar .module:nth-child(1n) {
          margin-right: 0; }
        .sidebar .module:nth-child(1n+1) {
          clear: left; } }
    .sidebar .module:last-child {
      padding-bottom: 0; }
    .sidebar .module .module, .sidebar .module .module:nth-child(n) {
      clear: none;
      float: none;
      width: 100%;
      padding-bottom: 10px; }
      @media screen and (min-width: 664px) {
        .sidebar .module .module, .sidebar .module .module:nth-child(n) {
          padding-bottom: 19px; } }
      @media screen and (min-width: 768px) {
        .sidebar .module .module, .sidebar .module .module:nth-child(n) {
          padding-bottom: 7.6923076923%; } }
    .sidebar .module .module:last-child {
      padding-bottom: 0; }

/* Shared grid-row styling */
@media screen and (min-width: 440px) {
  .grid-row {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap; } }

.grid-row .column__content {
  margin-bottom: 10px;
  /* Fake white background to make it seem stretched to the bottom and still make it work on IE Edge */ }
  .grid-row .column__content:before {
    display: block;
    position: absolute;
    content: " ";
    margin-bottom: 0;
    width: 100%;
    height: 80%;
    bottom: 0;
    background: white;
    z-index: -1; }
  @media screen and (min-width: 440px) {
    .grid-row .column__content {
      margin-bottom: 10.5263157895%; }
      .grid-row .column__content:before {
        margin-bottom: 10.5263157895%; } }
  @media screen and (min-width: 664px) {
    .grid-row .column__content {
      margin-bottom: 12.9032258065%; }
      .grid-row .column__content:before {
        margin-bottom: 12.9032258065%; } }

/* 4 columns on $desktop */
.grid--4columns .column {
  position: relative;
  z-index: 1; }
  @media screen and (min-width: 440px) {
    .grid--4columns .column {
      float: left;
      display: block;
      margin-right: 5%;
      width: 47.5%; }
      .grid--4columns .column:nth-child(n+1) {
        clear: none;
        margin-right: 5%; }
      .grid--4columns .column:last-child {
        margin-right: 0; }
      .grid--4columns .column:nth-child(2n) {
        margin-right: 0; }
      .grid--4columns .column:nth-child(2n+1) {
        clear: left; } }
  @media screen and (min-width: 768px) {
    .grid--4columns .column {
      float: left;
      display: block;
      margin-right: 3.9603960396%;
      width: 30.6930693069%; }
      .grid--4columns .column:nth-child(n+1) {
        clear: none;
        margin-right: 3.9603960396%; }
      .grid--4columns .column:last-child {
        margin-right: 0; }
      .grid--4columns .column:nth-child(3n) {
        margin-right: 0; }
      .grid--4columns .column:nth-child(3n+1) {
        clear: left; } }

.grid--4columns .content-wrapper {
  padding: 10px; }
  @media screen and (min-width: 440px) {
    .grid--4columns .content-wrapper {
      padding: 7.6923076923%; } }
  @media screen and (min-width: 664px) {
    .grid--4columns .content-wrapper {
      padding: 8.8888888889%; } }

@media screen and (min-width: 988px) {
  .grid--4columns .column {
    float: left;
    display: block;
    margin-right: 2.4390243902%;
    width: 23.1707317073%; }
    .grid--4columns .column:nth-child(n+1) {
      clear: none;
      margin-right: 2.4390243902%; }
    .grid--4columns .column:last-child {
      margin-right: 0; }
    .grid--4columns .column:nth-child(4n) {
      margin-right: 0; }
    .grid--4columns .column:nth-child(4n+1) {
      clear: left; }
  .grid--4columns .column__content {
    margin-bottom: 10.5263157895%; }
    .grid--4columns .column__content:before {
      margin-bottom: 10.5263157895%; } }

/* A row to group items within .main column */
.main .row {
  padding-bottom: 10px; }
  .main .row:before, .main .row:after {
    display: table;
    content: " "; }
  .main .row:after {
    clear: both; }
  @media screen and (min-width: 664px) {
    .main .row {
      padding-bottom: 3.7037037037%; } }

.main a.row {
  display: block; }

/* Flexing row */
@media screen and (min-width: 664px) {
  .row--flex {
    display: -ms-flexbox;
    display: flex; } }

/* Default half column */
.main__half {
  background: white; }
  .main__half:before, .main__half:after {
    display: table;
    content: " "; }
  .main__half:after {
    clear: both; }
  @media screen and (min-width: 664px) {
    .main__half {
      float: left;
      display: block;
      margin-right: 3.7037037037%;
      width: 48.1481481481%; }
      .main__half:nth-child(n+1) {
        clear: none;
        margin-right: 3.7037037037%; }
      .main__half:last-child {
        margin-right: 0; }
      .main__half:nth-child(2n) {
        margin-right: 0; }
      .main__half:nth-child(2n+1) {
        clear: left; } }
  .main__half + .main__half {
    margin-top: 10px; }
    @media screen and (min-width: 664px) {
      .main__half + .main__half {
        margin-top: 0; } }
  .main__half + .main__half--pull {
    margin-top: 0; }
  .main__half .content-wrapper {
    padding: 10px; }
    @media screen and (min-width: 664px) {
      .main__half .content-wrapper {
        padding: 7.6923076923%; } }

/* Add fake padding left to connect two halfs */
@media screen and (min-width: 664px) {
  .main__half--pull {
    margin-top: 0;
    position: relative; }
    .main__half--pull:before {
      display: block;
      position: absolute;
      content: " ";
      width: 7.6923076923%;
      height: 100%;
      left: -7.6923076923%;
      background: white; } }

@media screen and (min-width: 664px) {
  .main__half--pull .content-wrapper {
    padding-left: 0; } }

.main__half--pull .link-coverall:after {
  left: -100%;
  margin-left: -7.6923076923%; }

/* Irregular width halfs */
.large__half + .small__half {
  margin-top: 10px; }

@media screen and (min-width: 664px) {
  .large__half {
    float: left;
    display: block;
    margin-right: 3.7037037037%;
    width: 61.1111111111%; }
    .large__half:nth-child(n+1) {
      clear: none;
      margin-right: 3.7037037037%; }
    .large__half:last-child {
      margin-right: 0; }
    .large__half:nth-child(1.6n) {
      margin-right: 0; }
    .large__half:nth-child(1.6n+1) {
      clear: left; }
    .large__half + .small__half:nth-child(n) {
      margin-top: 0;
      margin-right: 0; } }

.small__half + .large__half {
  margin-top: 10px; }

@media screen and (min-width: 664px) {
  .small__half {
    float: left;
    display: block;
    margin-right: 3.7037037037%;
    width: 35.1851851852%; }
    .small__half:nth-child(n+1) {
      clear: none;
      margin-right: 3.7037037037%; }
    .small__half:last-child {
      margin-right: 0; }
    .small__half:nth-child(2.6666666667n) {
      margin-right: 0; }
    .small__half:nth-child(2.6666666667n+1) {
      clear: left; }
    .small__half + .large__half:nth-child(n) {
      margin-top: 0;
      margin-right: 0; } }

/* Make sure tooltips parent have higher z-index than sibling parents */
.column:hover, .column:focus {
  z-index: 2; }

/* Flexing containers, be sure to always test on IE Edge and Firefox */
@media screen and (min-width: 664px) {
  .container .flex-block {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column; }
    .container .flex-block .image-wrapper {
      -ms-flex-positive: 0;
          flex-grow: 0;
      -ms-flex-negative: 0;
          flex-shrink: 0; } }

@media screen and (min-width: 664px) {
  .container .flex-block__grow {
    -ms-flex-positive: 1;
        flex-grow: 1;
    -ms-flex-negative: 0;
        flex-shrink: 0; } }

@media screen and (min-width: 664px) {
  .container .flex-block__center {
    display: -ms-flexbox;
    display: flex;
    text-align: center;
    -ms-flex-align: center;
        align-items: center; }
    .container .flex-block__center .center-wrapper {
      width: 100%; } }

.container--1column {
  padding-bottom: 10px; }
  @media screen and (min-width: 664px) {
    .container--1column {
      padding-bottom: 19px; } }
  @media screen and (min-width: 768px) {
    .container--1column {
      padding-bottom: 30px; } }
  .container--1column .row {
    background: white;
    padding-left: 10px;
    padding-bottom: 10px;
    padding-right: 10px; }
    @media screen and (min-width: 664px) {
      .container--1column .row {
        padding-left: 2.4390243902%;
        padding-bottom: 2.4390243902%;
        padding-right: 2.4390243902%; } }
  .container--1column .row--padding-top {
    padding-top: 10px; }
    @media screen and (min-width: 664px) {
      .container--1column .row--padding-top {
        padding-top: 2.4390243902%; } }
  .container--1column .row__content {
    max-width: 800px;
    margin-left: auto;
    margin-right: auto; }

.omroep-list {
  margin: 0;
  padding: 0;
  list-style: none;
  border: none;
  background: transparent; }
  .omroep-list:before, .omroep-list:after {
    display: table;
    content: " "; }
  .omroep-list:after {
    clear: both; }
  .omroep-list li {
    position: relative;
    background: white;
    border: 1px solid transparent;
    border-radius: 4px;
    transition: all 0.2s cubic-bezier(0.195, 0.4, 0.45, 0.785); }
    .omroep-list li:hover {
      border-color: #003576; }
  .omroep-list .zender {
    padding: 15px;
    margin-bottom: 10px; }
    @media screen and (min-width: 664px) {
      .omroep-list .zender {
        margin-bottom: 19px;
        float: left;
        display: block;
        margin-right: 3.7037037037%;
        width: 48.1481481481%; }
        .omroep-list .zender:nth-child(n+1) {
          clear: none;
          margin-right: 3.7037037037%; }
        .omroep-list .zender:last-child {
          margin-right: 0; }
        .omroep-list .zender:nth-child(2n) {
          margin-right: 0; }
        .omroep-list .zender:nth-child(2n+1) {
          clear: left; } }
    @media screen and (min-width: 768px) {
      .omroep-list .zender {
        margin-bottom: 28px;
        float: left;
        display: block;
        margin-right: 2.4390243902%;
        width: 100%; }
        .omroep-list .zender:nth-child(n+1) {
          clear: none;
          margin-right: 2.4390243902%; }
        .omroep-list .zender:last-child {
          margin-right: 0; }
        .omroep-list .zender:nth-child(1n) {
          margin-right: 0; }
        .omroep-list .zender:nth-child(1n+1) {
          clear: left; } }
    @media screen and (min-width: 988px) {
      .omroep-list .zender {
        margin-bottom: 7.6923076923%; } }
  .omroep-list .zender__name__logo {
    float: right; }

.block-broadcast-live__content {
  background: white;
  padding: 10px;
  margin-bottom: 10px; }
  @media screen and (min-width: 664px) {
    .block-broadcast-live__content {
      padding: 19px;
      margin-bottom: 19px; } }
  @media screen and (min-width: 768px) {
    .block-broadcast-live__content {
      padding: 28px;
      margin-bottom: 28px; } }
  @media screen and (min-width: 988px) {
    .block-broadcast-live__content {
      padding: 3.7037037037%;
      margin-bottom: 3.7037037037%; } }

/**
 * Header above broadcasts (and podcasts)
 */
.broadcasts-header {
  margin-bottom: 10px; }
  .broadcasts-header .input-filter {
    margin: 0;
    width: 220px;
    max-width: 100%;
    background: white;
    border: 1px solid #cbd0d3;
    border-radius: 4px;
    padding: 5px;
    font-size: 16px;
    line-height: 22px;
    height: auto;
    box-sizing: border-box; }
    @media screen and (min-width: 664px) {
      .broadcasts-header .input-filter {
        width: 160px; } }
    @media screen and (min-width: 768px) {
      .broadcasts-header .input-filter {
        width: 220px; } }
  .broadcasts-header .button, .broadcasts-header .block-share__item {
    padding: 8px; }

/**
 * Hide SVG on header buttons on smaller screens
 */
.broadcasts-buttons {
  display: inline-block; }
  .broadcasts-buttons .button, .broadcasts-buttons .block-share__item {
    margin-bottom: 0.5em; }
    @media screen and (min-width: 664px) {
      .broadcasts-buttons .button, .broadcasts-buttons .block-share__item {
        margin-bottom: 0; } }
  .broadcasts-buttons svg {
    display: none; }
    @media screen and (min-width: 768px) {
      .broadcasts-buttons svg {
        display: inline-block; } }

.podcasts-highlighted {
  position: relative;
  z-index: 1;
  background: #003576;
  padding-top: 30px;
  margin-bottom: 30px;
  color: white; }
  .podcasts-highlighted .responsive-item__body {
    background: white; }

.programme-header-container {
  position: relative;
  z-index: 1;
  border-bottom: 1px solid white;
  background: #d5dee8;
  color: #003576; }
  @media screen and (min-width: 664px) {
    .programme-header-container {
      margin-bottom: 2.4390243902%;
      border-bottom: none; } }

.programme-header {
  position: relative;
  margin-left: auto;
  margin-right: auto; }
  .programme-header:before, .programme-header:after {
    display: table;
    content: " "; }
  .programme-header:after {
    clear: both; }
  @media screen and (min-width: 664px) {
    .programme-header {
      max-width: 1298px;
      padding-left: 19px;
      padding-right: 19px; } }
  @media screen and (min-width: 988px) {
    .programme-header {
      max-width: 1316px;
      padding-left: 28px;
      padding-right: 28px; } }
  .programme-header p, .programme-header a, .programme-header h1, .programme-header h2, .programme-header h3, .programme-header h4 {
    color: inherit; }

.programme-header__title {
  float: left;
  padding: 15px;
  width: 50%; }
  @media screen and (min-width: 664px) {
    .programme-header__title {
      padding: 15px 0 30px;
      float: left;
      display: block;
      margin-right: 5%;
      width: 47.5%;
      margin: 0; }
      .programme-header__title:last-child {
        margin-right: 0; } }
  @media screen and (min-width: 768px) {
    .programme-header__title {
      padding: 30px 0;
      float: left;
      display: block;
      margin-right: 2.4390243902%;
      width: 48.7804878049%;
      margin: 0; }
      .programme-header__title:last-child {
        margin-right: 0; } }
  .programme-header__title .programme-header__subtitle {
    position: absolute;
    font-size: 16px;
    margin-top: -1em;
    margin-bottom: 0; }

@media screen and (min-width: 988px) {
  .programme-header--small .programme-header__title {
    padding: 30px 0; } }

.programme-header__graphic {
  width: 50%;
  float: right; }
  @media screen and (min-width: 664px) {
    .programme-header__graphic {
      float: left;
      display: block;
      margin-right: 5%;
      width: 47.5%;
      margin: 0;
      float: right; }
      .programme-header__graphic:before {
        display: block;
        content: " ";
        padding-top: 56.25%; }
      .programme-header__graphic:last-child {
        margin-right: 0; }
      .programme-header__graphic .image-wrapper {
        position: absolute;
        left: 52.5%;
        bottom: 0;
        right: 19px;
        min-width: 0; } }
  @media screen and (min-width: 768px) {
    .programme-header__graphic {
      float: left;
      display: block;
      margin-right: 2.4390243902%;
      width: 48.7804878049%;
      margin: 0;
      float: right; }
      .programme-header__graphic:last-child {
        margin-right: 0; }
      .programme-header__graphic .image-wrapper {
        left: 51.2195121951%; } }
  @media screen and (min-width: 988px) {
    .programme-header__graphic .image-wrapper {
      right: 28px; } }

.programme-header__broadcast {
  position: absolute;
  top: 15px;
  right: 10px;
  background: white;
  border-radius: 4px; }
  @media screen and (min-width: 664px) {
    .programme-header__broadcast {
      top: 19px;
      right: 19px; } }
  @media screen and (min-width: 988px) {
    .programme-header__broadcast {
      right: 28px; } }
  .programme-header__broadcast .programma__logos,
  .programme-header__broadcast .programma__logo {
    display: block;
    margin: 5px 10px; }
  .programme-header__broadcast .programma__logos .programma__logo {
    display: block;
    margin: 0; }

.programme-header__body {
  clear: both;
  border-top: 1px solid white;
  padding: 15px; }
  @media screen and (min-width: 664px) {
    .programme-header__body {
      clear: left;
      float: left;
      border-top: none;
      padding: 0 0 15px;
      float: left;
      display: block;
      margin-right: 5%;
      width: 47.5%;
      margin: 0; }
      .programme-header__body:last-child {
        margin-right: 0; } }
  @media screen and (min-width: 768px) {
    .programme-header__body {
      padding-bottom: 30px;
      float: left;
      display: block;
      margin-right: 2.4390243902%;
      width: 48.7804878049%;
      margin: 0; }
      .programme-header__body:last-child {
        margin-right: 0; } }

.block-article-quote {
  position: relative;
  padding-top: 15px; }
  .block-article-quote > svg {
    position: absolute;
    top: 0;
    width: 45px;
    height: 45px; }
    .block-article-quote > svg path {
      fill: #e6e6e6; }
  .block-article-quote .flag-object-beta {
    padding-left: 60px; }
  .block-article-quote__content p.heading:first-of-type {
    font-style: italic;
    color: #00b9e6; }
  .block-article-quote .heading {
    font-family: Arial, Helvetica, sans-serif; }

/* Share block */
.block-share .button, .block-share .block-share__item {
  margin-right: 10px; }

.block-share .button__text {
  display: none; }
  @media screen and (min-width: 664px) {
    .block-share .button__text {
      display: inline-block; } }

.block-share--header {
  display: none;
  float: right; }
  @media screen and (min-width: 664px) {
    .block-share--header {
      display: block; } }

.block-share__item {
  color: white; }
  .block-share__item svg {
    width: 1em;
    height: 1em; }
  .block-share__item svg {
    fill: currentColor; }
  .block-share__item svg {
    position: relative;
    z-index: 1;
    display: inline-block;
    vertical-align: top;
    margin-top: -1px; }
  .block-share__item + .block-share__item {
    margin-left: 5px; }
  .block-share__item span {
    position: absolute;
    overflow: hidden;
    clip: rect(0 0 0 0);
    height: 1px;
    width: 1px;
    margin: -1px;
    padding: 0;
    border: 0; }
  .block-share__item[data-service=mail] {
    background-color: #7ea54e; }
    .block-share__item[data-service=mail]:hover {
      background-color: #003576; }
  .block-share__item[data-service=facebook] {
    background-color: #3b5998; }
  .block-share__item[data-service=googleplus] {
    background-color: #dd4b39; }
  .block-share__item[data-service=linkedin] {
    background-color: #007bb5; }
  .block-share__item[data-service=twitter] {
    background-color: #55acee; }
  .block-share__item[data-service=whatsapp] {
    background-color: #4dc247; }
    @media screen and (min-width: 768px) {
      .block-share__item[data-service=whatsapp] {
        display: none; } }

/* Social block */
.block-social {
  background: white;
  font-size: 16px;
  display: none; }
  @media screen and (min-width: 664px) {
    .block-social {
      display: block; } }

.block-social__header {
  padding: 10px;
  border-bottom: 1px solid #e6e6e6; }

.block-social__scroll-container {
  position: relative;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  min-height: 220px; }

.block-social__scroll {
  position: absolute;
  top: 100%;
  border-top: 1px solid #e6e6e6;
  max-width: 100%; }

.block-social__item {
  padding: 10px;
  border-top: 1px solid #e6e6e6; }
  .block-social__item:first-child {
    border-top: none; }

.block-social__item__header {
  display: table;
  line-height: 24px; }

.block-social__item__header__left,
.block-social__item__header__right {
  display: table-cell;
  vertical-align: top; }

.block-social__item__header__right {
  width: 1%;
  white-space: nowrap;
  color: #aaaaaa; }

.block-social__item__header__left:focus .block-social__item__header__name,
.block-social__item__header__left:focus .block-social__item__header__handler, .block-social__item__header__left:hover .block-social__item__header__name,
.block-social__item__header__left:hover .block-social__item__header__handler {
  text-decoration: none; }

.block-social__item__header__name,
.block-social__item__header__handler {
  text-decoration: underline; }

.block-social__item__header__handler {
  color: #777777; }

.block-social__item__body {
  padding: 0 10px 10px; }

.block-social__avatar {
  width: 50px; }

.icon-square {
  display: inline-block;
  width: 26px;
  height: 26px;
  line-height: 18px;
  border-radius: 4px;
  background: #003576;
  padding: 4px; }
  .icon-square svg {
    width: 18px;
    height: 18px;
    fill: white; }

.block-social__item__body__image {
  display: inline-block; }

.profile_picture {
  display: inline-block;
  width: 50px;
  height: 50px;
  vertical-align: middle; }

/* Video block */
.block-videos:before, .block-videos:after {
  display: table;
  content: " "; }

.block-videos:after {
  clear: both; }

@media (min-width: 664px) and (min-height: 320px) {
  .flexbox .block-videos,
  .flexboxlegacy .block-videos {
    position: relative;
    -ms-flex-negative: 1;
        flex-shrink: 1;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column; } }

.video-item {
  padding-bottom: 10px; }
  @media (min-width: 664px) and (min-height: 320px) {
    .flexbox .video-item,
    .flexboxlegacy .video-item {
      float: none;
      width: 100%;
      margin: 0;
      padding-left: 0;
      padding-right: 0;
      padding-bottom: 10.5263157895%;
      -ms-flex-positive: 0;
          flex-grow: 0;
      -ms-flex-negative: 1;
          flex-shrink: 1;
      display: -ms-flexbox;
      display: flex; } }
  .video-item.video-item--active {
    -ms-flex-positive: 1;
        flex-grow: 1; }
    .video-item.video-item--active .video-item__body {
      background: rgba(0, 185, 230, 0.85);
      overflow: visible;
      white-space: normal;
      padding-top: 26px; }
      @media screen and (min-width: 1260px) {
        .video-item.video-item--active .video-item__body {
          font-size: 17px;
          line-height: 24px; } }
    .video-item.video-item--active .video-item__body__now {
      display: block; }

.video-wrapper {
  display: block;
  position: relative;
  background-size: cover;
  background-position: center;
  text-decoration: none;
  width: 100%;
  overflow: hidden; }
  @media (min-width: 664px) and (min-height: 320px) {
    .flexbox .video-wrapper,
    .flexboxlegacy .video-wrapper {
      display: -ms-flexbox;
      display: flex;
      -ms-flex-positive: 1;
          flex-grow: 1;
      -ms-flex-negative: 1;
          flex-shrink: 1; } }

.video-item__body {
  display: block;
  background: rgba(0, 53, 118, 0.75);
  color: white;
  padding: 15px;
  font-family: "aleo", "Calibri", "Gill Sans", "Trebuchet MS", Arial, sans-serif;
  font-weight: 700;
  transition: all 0.2s cubic-bezier(0.195, 0.4, 0.45, 0.785);
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: 16px;
  line-height: 24px;
  width: 100%; }
  @media screen and (min-width: 664px) {
    .video-item__body {
      padding: 10px; } }
  @media screen and (min-width: 1260px) {
    .video-item__body {
      padding: 15px; } }

.video-item__body__now {
  position: absolute;
  top: 10px;
  left: 15px;
  display: none;
  font-size: 13px;
  margin-top: -.5em;
  font-family: Arial, Helvetica, sans-serif;
  transition: all 0.2s cubic-bezier(0.195, 0.4, 0.45, 0.785); }
  @media screen and (min-width: 664px) {
    .video-item__body__now {
      left: 10px; } }
  @media screen and (min-width: 1260px) {
    .video-item__body__now {
      left: 15px; } }

.video-wrapper:hover .video-item__body, .video-wrapper:focus .video-item__body {
  background: rgba(0, 185, 230, 0.85); }

.video-wrapper:hover .video-item__body__content, .video-wrapper:focus .video-item__body__content {
  text-decoration: underline; }

/* Win block */
.block-win {
  display: block;
  position: relative;
  margin-bottom: 10px; }
  .block-win:last-child {
    margin-bottom: 0; }
  @media screen and (min-width: 664px) {
    .block-win {
      margin-bottom: 19px; } }
  @media screen and (min-width: 768px) {
    .block-win {
      margin-bottom: 28px; } }
  @media screen and (min-width: 988px) {
    .block-win {
      margin-bottom: 7.6923076923%; } }
  .block-win:hover .button, .block-win:hover .block-share__item, .block-win:focus .button, .block-win:focus .block-share__item {
    background: white;
    color: #003576; }

.block-win__title,
.block-win__button {
  position: absolute;
  right: 0;
  left: 0;
  padding: 30px; }

.block-win__title {
  top: 0;
  background: rgba(0, 53, 118, 0.75); }

.block-win__button {
  bottom: 0; }

.block-button {
  display: block;
  position: relative;
  margin-bottom: 10px; }
  .block-button:last-child {
    margin-bottom: 0; }
  @media screen and (min-width: 664px) {
    .block-button {
      margin-bottom: 19px; } }
  @media screen and (min-width: 768px) {
    .block-button {
      margin-bottom: 28px; } }
  @media screen and (min-width: 988px) {
    .block-button {
      margin-bottom: 7.6923076923%; } }
  .block-button:hover .button, .block-button:hover .block-share__item, .block-button:focus .button, .block-button:focus .block-share__item {
    background: white;
    color: #003576; }

.block-button__title,
.block-button__button {
  position: absolute;
  right: 0;
  left: 0;
  padding: 30px; }

.block-button__title {
  top: 0;
  background: rgba(0, 53, 118, 0.75); }

.block-button__button {
  bottom: 0; }

/* Custom styling for some home blocks */
.block-quiz.block-quiz, .block-quiz.block-quote,
.block-quiz .content-wrapper,
.block-quote.block-quiz,
.block-quote.block-quote,
.block-quote .content-wrapper {
  background: #003576;
  color: white; }

.block-quote {
  margin-bottom: 30px; }

.block-quiz .rp-answer input[type="radio"],
.block-quiz .rp-btn-vote {
  display: none; }

/**
 * Block image
 */
.block__image {
  overflow: hidden;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  display: block;
  transition: all 0.2s cubic-bezier(0.195, 0.4, 0.45, 0.785); }
  .block__image img {
    position: absolute;
    display: block;
    top: -1px;
    right: -1px;
    bottom: -1px;
    left: -1px;
    max-width: none;
    min-width: 100%; }
    csscalc .block__image img {
      min-width: calc(100% + 2px);
      max-width: calc(100% + 2px); }

/**
 * Block intro
 */
.block__intro {
  display: none;
  font-size: 14px;
  line-height: 18px; }
  @media screen and (min-width: 664px) {
    .block__intro {
      display: block; } }

/**
 * Block label
 */
.block__label {
  display: block;
  background: white;
  color: black;
  font-size: 12px;
  line-height: 1.5; }
  @media screen and (min-width: 664px) {
    .block__label {
      position: absolute;
      bottom: 100%;
      padding: 0.5em; }
      .block__label:after {
        display: block;
        position: absolute;
        content: " ";
        width: 100px;
        height: 100px;
        left: 100%;
        top: 0;
        background: inherit;
        z-index: -1;
        transform-origin: 0 0;
        transform: rotate(45deg); } }

/**
 * Block title
 */
.block__title {
  font-size: 15px;
  line-height: 1.2em;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column;
  -ms-flex-pack: center;
      justify-content: center;
  margin-bottom: 0;
  color: inherit; }
  @media screen and (min-width: 664px) {
    .block__title {
      margin-bottom: 0; } }
  .block__title h3, .block__title h4 {
    margin: 0;
    color: inherit; }
  @media screen and (min-width: 768px) {
    .block__title {
      font-size: 16px; } }
  @media screen and (min-width: 988px) {
    .block__title {
      font-size: 17px; } }
  @media screen and (min-width: 1144px) {
    .block__title {
      font-size: 18px; } }
  .block__title h4 {
    font-size: 13px; }

/**
 * Responsive block
 */
.responsive-block {
  color: inherit;
  display: block;
  position: relative;
  overflow: hidden;
  text-decoration: none;
  /* Hover */
  /**
   * Transform into a block
   */ }
  .responsive-block:focus .block__title, .responsive-block:hover .block__title {
    text-decoration: underline; }
  .responsive-block .block__image {
    position: absolute; }
  .responsive-block .block__logo {
    position: absolute;
    top: 50px;
    left: 0;
    transform: scale(0.85);
    transform-origin: 0 0; }
    @media screen and (min-width: 664px) {
      .responsive-block .block__logo {
        transform: none; } }
    .responsive-block .block__logo ~ .block__content {
      min-height: 80px; }
      @media screen and (min-width: 664px) {
        .responsive-block .block__logo ~ .block__content {
          min-height: 0; } }
  .responsive-block .block__content {
    margin-left: 96px; }
    @media screen and (min-width: 664px) {
      .responsive-block .block__content {
        margin-left: 0; } }
  .responsive-block + .block__label {
    position: relative;
    top: -14px;
    font-size: smaller;
    padding: 0;
    left: 96px;
    background: transparent; }
    @media screen and (min-width: 664px) {
      .responsive-block + .block__label {
        position: absolute;
        top: 10px;
        font-size: inherit;
        left: auto;
        padding: 0.5em;
        background: white; } }
  @media screen and (min-width: 664px) {
    .responsive-block {
      /**
     * Block content
     */
      /**
     * Block title
     */
      /**
     * Block intro
     */
      /**
     * Block image
     */ }
      .responsive-block .block__content {
        position: absolute;
        z-index: 1;
        right: 0;
        bottom: 0;
        left: 0; }
      .responsive-block .block__title {
        width: 100%;
        margin: 0;
        padding: 11px 10px 9px;
        background: white;
        line-height: 1.2em;
        font-size: 16px; } }
    @media screen and (min-width: 664px) and (min-width: 664px) {
      .responsive-block .block__title {
        padding: 10px 0 0; } }
  @media screen and (min-width: 664px) {
      .responsive-block .block__intro {
        padding: 0 10px;
        background: white; } }
    @media screen and (min-width: 664px) and (min-width: 664px) {
      .responsive-block .block__intro {
        padding: 4px 0 0; } }
  @media screen and (min-width: 664px) {
      .responsive-block .block__image {
        position: relative; }
        .responsive-block .block__image.block__image--coverall {
          position: static; }
          .responsive-block .block__image.block__image--coverall:after {
            display: block;
            position: absolute;
            content: " ";
            position: absolute;
            top: 0;
            right: 0;
            bottom: 0;
            left: 0;
            z-index: 2; } }

/**
 * 1 by 1 responsive block
 */
.responsive-block--1by1 {
  /* Hover */ }
  .responsive-block--1by1 .block__image {
    width: 80px;
    height: 80px; }
    @media screen and (min-width: 664px) {
      .responsive-block--1by1 .block__image {
        width: auto;
        height: auto; } }
  .responsive-block--1by1 .block__image-container {
    position: absolute;
    overflow: hidden;
    width: 80px;
    height: 60px; }
    @media screen and (min-width: 664px) {
      .responsive-block--1by1 .block__image-container {
        width: 100%;
        height: 0;
        padding-top: 65%; } }
  .responsive-block--1by1 .block__image--smaller {
    width: 80px;
    height: 60px; }
    .responsive-block--1by1 .block__image--smaller + .block__content {
      min-height: 60px; }
    @media screen and (min-width: 664px) {
      .responsive-block--1by1 .block__image--smaller {
        width: auto;
        height: auto; } }
  .responsive-block--1by1 .block__content {
    min-height: 80px; }
    @media screen and (min-width: 664px) {
      .responsive-block--1by1 .block__content {
        position: relative;
        min-height: 0;
        margin-bottom: 0;
        margin-top: 65%; } }
  @media screen and (min-width: 664px) {
    .responsive-block--1by1 .block__image {
      position: absolute;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0; }
      .responsive-block--1by1 .block__image:before {
        display: block;
        content: " ";
        padding-top: 100%; }
    .responsive-block--1by1 .block__label {
      transform: none; }
    .responsive-block--1by1 .block__image--smaller:before {
      padding-top: 56%; } }
  a.responsive-block--1by1:focus .block__image, a.responsive-block--1by1:hover .block__image {
    transform: scale(1.1); }

/* Placeholder image */
.responsive-block--1by1 .block__image-container {
  background-image: url("../images/image-placeholder-1-1.png");
  background-size: cover; }

/* Items */
.responsive-items {
  position: relative;
  z-index: 1;
  width: 100%;
  /* Layout */ }
  .responsive-items:before, .responsive-items:after {
    display: table;
    content: " "; }
  .responsive-items:after {
    clear: both; }
  @media screen and (min-width: 664px) {
    .responsive-items .responsive-item--square,
    .responsive-items .responsive-item--stacked {
      float: left;
      display: block;
      margin-right: 3.7037037037%;
      width: 48.1481481481%;
      margin-bottom: 30px; }
      .responsive-items .responsive-item--square:nth-child(n+1),
      .responsive-items .responsive-item--stacked:nth-child(n+1) {
        clear: none;
        margin-right: 3.7037037037%; }
      .responsive-items .responsive-item--square:last-child,
      .responsive-items .responsive-item--stacked:last-child {
        margin-right: 0; }
      .responsive-items .responsive-item--square:nth-child(2n),
      .responsive-items .responsive-item--stacked:nth-child(2n) {
        margin-right: 0; }
      .responsive-items .responsive-item--square:nth-child(2n+1),
      .responsive-items .responsive-item--stacked:nth-child(2n+1) {
        clear: left; } }
  @media screen and (min-width: 768px) {
    .responsive-items .responsive-item--square,
    .responsive-items .responsive-item--stacked {
      float: left;
      display: block;
      margin-right: 2.4390243902%;
      width: 31.7073170732%; }
      .responsive-items .responsive-item--square:nth-child(n+1),
      .responsive-items .responsive-item--stacked:nth-child(n+1) {
        clear: none;
        margin-right: 2.4390243902%; }
      .responsive-items .responsive-item--square:last-child,
      .responsive-items .responsive-item--stacked:last-child {
        margin-right: 0; }
      .responsive-items .responsive-item--square:nth-child(3n),
      .responsive-items .responsive-item--stacked:nth-child(3n) {
        margin-right: 0; }
      .responsive-items .responsive-item--square:nth-child(3n+1),
      .responsive-items .responsive-item--stacked:nth-child(3n+1) {
        clear: left; } }
  @media screen and (min-width: 988px) {
    .responsive-items .responsive-item--square,
    .responsive-items .responsive-item--stacked {
      float: left;
      display: block;
      margin-right: 2.4390243902%;
      width: 23.1707317073%; }
      .responsive-items .responsive-item--square:nth-child(n+1),
      .responsive-items .responsive-item--stacked:nth-child(n+1) {
        clear: none;
        margin-right: 2.4390243902%; }
      .responsive-items .responsive-item--square:last-child,
      .responsive-items .responsive-item--stacked:last-child {
        margin-right: 0; }
      .responsive-items .responsive-item--square:nth-child(4n),
      .responsive-items .responsive-item--stacked:nth-child(4n) {
        margin-right: 0; }
      .responsive-items .responsive-item--square:nth-child(4n+1),
      .responsive-items .responsive-item--stacked:nth-child(4n+1) {
        clear: left; } }

@media screen and (min-width: 664px) {
  .responsive-items--padded {
    padding: 19px 19px 0; } }

@media screen and (min-width: 768px) {
  .responsive-items--padded {
    padding: 28px 28px 0; } }

@media screen and (min-width: 664px) {
  .responsive-items--padded-top {
    padding: 19px 0 0; } }

@media screen and (min-width: 768px) {
  .responsive-items--padded-top {
    padding: 28px 0 0; } }

.listen-back + .responsive-items {
  padding-top: 0; }

.responsive-items--2col:before, .responsive-items--2col:after {
  display: table;
  content: " "; }

.responsive-items--2col:after {
  clear: both; }

@media screen and (min-width: 664px) {
  .responsive-items--2col .responsive-item--square,
  .responsive-items--2col .responsive-item--stacked {
    float: left;
    display: block;
    margin-right: 3.7037037037%;
    width: 48.1481481481%;
    margin-bottom: 30px; }
    .responsive-items--2col .responsive-item--square:nth-child(n+1),
    .responsive-items--2col .responsive-item--stacked:nth-child(n+1) {
      clear: none;
      margin-right: 3.7037037037%; }
    .responsive-items--2col .responsive-item--square:last-child,
    .responsive-items--2col .responsive-item--stacked:last-child {
      margin-right: 0; }
    .responsive-items--2col .responsive-item--square:nth-child(2n),
    .responsive-items--2col .responsive-item--stacked:nth-child(2n) {
      margin-right: 0; }
    .responsive-items--2col .responsive-item--square:nth-child(2n+1),
    .responsive-items--2col .responsive-item--stacked:nth-child(2n+1) {
      clear: left; } }

@media screen and (min-width: 768px) {
  .responsive-items--2col .responsive-item--square,
  .responsive-items--2col .responsive-item--stacked {
    float: left;
    display: block;
    margin-right: 3.7037037037%;
    width: 48.1481481481%; }
    .responsive-items--2col .responsive-item--square:nth-child(n+1),
    .responsive-items--2col .responsive-item--stacked:nth-child(n+1) {
      clear: none;
      margin-right: 3.7037037037%; }
    .responsive-items--2col .responsive-item--square:last-child,
    .responsive-items--2col .responsive-item--stacked:last-child {
      margin-right: 0; }
    .responsive-items--2col .responsive-item--square:nth-child(2n),
    .responsive-items--2col .responsive-item--stacked:nth-child(2n) {
      margin-right: 0; }
    .responsive-items--2col .responsive-item--square:nth-child(2n+1),
    .responsive-items--2col .responsive-item--stacked:nth-child(2n+1) {
      clear: left; } }

@media screen and (min-width: 988px) {
  .responsive-items--2col .responsive-item--square,
  .responsive-items--2col .responsive-item--stacked {
    float: left;
    display: block;
    margin-right: 3.7037037037%;
    width: 48.1481481481%; }
    .responsive-items--2col .responsive-item--square:nth-child(n+1),
    .responsive-items--2col .responsive-item--stacked:nth-child(n+1) {
      clear: none;
      margin-right: 3.7037037037%; }
    .responsive-items--2col .responsive-item--square:last-child,
    .responsive-items--2col .responsive-item--stacked:last-child {
      margin-right: 0; }
    .responsive-items--2col .responsive-item--square:nth-child(2n),
    .responsive-items--2col .responsive-item--stacked:nth-child(2n) {
      margin-right: 0; }
    .responsive-items--2col .responsive-item--square:nth-child(2n+1),
    .responsive-items--2col .responsive-item--stacked:nth-child(2n+1) {
      clear: left; } }

.responsive-items--3col:before, .responsive-items--3col:after {
  display: table;
  content: " "; }

.responsive-items--3col:after {
  clear: both; }

@media screen and (min-width: 988px) {
  .responsive-items--3col .responsive-item--square,
  .responsive-items--3col .responsive-item--stacked {
    float: left;
    display: block;
    margin-right: 3.8022813688%;
    width: 30.7984790875%;
    margin-bottom: 30px; }
    .responsive-items--3col .responsive-item--square:nth-child(n+1),
    .responsive-items--3col .responsive-item--stacked:nth-child(n+1) {
      clear: none;
      margin-right: 3.8022813688%; }
    .responsive-items--3col .responsive-item--square:last-child,
    .responsive-items--3col .responsive-item--stacked:last-child {
      margin-right: 0; }
    .responsive-items--3col .responsive-item--square:nth-child(3n),
    .responsive-items--3col .responsive-item--stacked:nth-child(3n) {
      margin-right: 0; }
    .responsive-items--3col .responsive-item--square:nth-child(3n+1),
    .responsive-items--3col .responsive-item--stacked:nth-child(3n+1) {
      clear: left; } }

.responsive-items--5col:before, .responsive-items--5col:after {
  display: table;
  content: " "; }

.responsive-items--5col:after {
  clear: both; }

@media screen and (min-width: 988px) {
  .responsive-items--5col .responsive-item--square,
  .responsive-items--5col .responsive-item--stacked {
    float: left;
    display: block;
    margin-right: 2.4390243902%;
    width: 18.0487804878%;
    margin-bottom: 30px; }
    .responsive-items--5col .responsive-item--square:nth-child(n+1),
    .responsive-items--5col .responsive-item--stacked:nth-child(n+1) {
      clear: none;
      margin-right: 2.4390243902%; }
    .responsive-items--5col .responsive-item--square:last-child,
    .responsive-items--5col .responsive-item--stacked:last-child {
      margin-right: 0; }
    .responsive-items--5col .responsive-item--square:nth-child(5n),
    .responsive-items--5col .responsive-item--stacked:nth-child(5n) {
      margin-right: 0; }
    .responsive-items--5col .responsive-item--square:nth-child(5n+1),
    .responsive-items--5col .responsive-item--stacked:nth-child(5n+1) {
      clear: left; } }

@media (min-width: 664px) and (min-height: 0) {
  .flexbox .responsive-items--flex,
  .flexboxlegacy .responsive-items--flex {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap; }
    .flexbox .responsive-items--flex:before, .flexbox .responsive-items--flex:after,
    .flexboxlegacy .responsive-items--flex:before,
    .flexboxlegacy .responsive-items--flex:after {
      display: none; } }

/* Item */
.responsive-item {
  position: relative;
  display: table;
  width: 100%;
  border-top: 1px solid rgba(0, 0, 0, 0.15);
  padding-top: 10px;
  padding-bottom: 10px;
  text-decoration: none;
  overflow: hidden; }
  @media screen and (min-width: 664px) {
    .responsive-item .image-placeholder-1-1,
    .responsive-item .image-placeholder-4-3 {
      transition: all 0.2s cubic-bezier(0.195, 0.4, 0.45, 0.785); }
    .responsive-item:hover .image-placeholder-1-1,
    .responsive-item:hover .image-placeholder-4-3 {
      transform: scale(1.1); } }

.path-home .responsive-item:first-child {
  border-top: 1px solid rgba(0, 0, 0, 0.15); }
  @media screen and (min-width: 664px) {
    .path-home .responsive-item:first-child {
      border-top: none; } }

.path-home .main__heading + .responsive-item {
  border-top: none; }

.responsive-item__image {
  display: table-cell;
  vertical-align: top;
  width: 80px;
  overflow: hidden; }
  .responsive-item__image .image-wrapper {
    overflow: hidden; }

.responsive-item__body {
  display: table-cell;
  vertical-align: top;
  padding-left: 10px;
  text-decoration: none; }
  .responsive-item__body a {
    text-decoration: none; }
    .responsive-item__body a:focus, .responsive-item__body a:hover {
      text-decoration: underline; }

.responsive-item__buttons {
  display: table-cell;
  vertical-align: top;
  padding-left: 10px; }
  .responsive-item__buttons.button-group--vertical {
    position: relative; }
    @media screen and (min-width: 664px) {
      .responsive-item__buttons.button-group--vertical {
        position: absolute; } }

.responsive-item__content,
.responsive-item__slidein {
  color: inherit;
  transition: all 0.2s cubic-bezier(0.195, 0.4, 0.45, 0.785);
  margin-bottom: 15px; }
  .responsive-item__content:last-child,
  .responsive-item__slidein:last-child {
    margin-bottom: 0; }
  @media screen and (min-width: 664px) {
    .responsive-item__content,
    .responsive-item__slidein {
      background: white; } }

.responsive-item__content.link-coverall:after {
  top: -999px;
  bottom: -999px; }

/* Blocks */
@media screen and (min-width: 664px) {
  .responsive-item--square,
  .responsive-item--stacked {
    display: block;
    width: auto;
    border: none;
    padding: 0;
    background: white; }
    .responsive-item--square .responsive-item__image,
    .responsive-item--stacked .responsive-item__image {
      display: block;
      width: auto; }
    .responsive-item--square .responsive-item__body,
    .responsive-item--stacked .responsive-item__body {
      display: block; }
    .responsive-item--square .responsive-item__buttons,
    .responsive-item--stacked .responsive-item__buttons {
      display: block;
      padding: 0; }
    .responsive-item--square .responsive-item__content,
    .responsive-item--square .responsive-item__slidein,
    .responsive-item--stacked .responsive-item__content,
    .responsive-item--stacked .responsive-item__slidein {
      padding: 30px; } }

/* Square */
@media screen and (min-width: 664px) {
  .responsive-item--square:before {
    display: block;
    content: " ";
    padding-top: 100%; }
  .responsive-item--square .responsive-item__image {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0; }
  .responsive-item--square .responsive-item__body {
    padding-left: 0; } }

@media screen and (min-width: 664px) {
  .responsive-item--square .responsive-item__content,
  .responsive-item--square .responsive-item__slidein {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    min-height: 25px; } }

.responsive-item--square .responsive-item__content {
  position: relative;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-align: center;
  -ms-flex-align: center;
  align-items: center;
  min-height: 85px;
  padding: 0 40px 0 20px; }

.responsive-item--square .responsive-item__slidein {
  padding: 0 40px 10px 20px;
  margin-top: -1em; }
  @media screen and (min-width: 664px) {
    .responsive-item--square .responsive-item__slidein {
      margin-top: 0; } }

.responsive-item--square .responsive-item__image {
  position: relative; }

.responsive-item--square:before {
  padding: 0; }

/* Stacked */
@media screen and (min-width: 664px) {
  .responsive-item--stacked .responsive-item__body {
    padding: 0; } }

/* Row */
.responsive-item--row {
  overflow: visible; }
  @media screen and (min-width: 664px) {
    .responsive-item--row {
      border: none;
      padding: 0;
      margin-bottom: 30px; }
      .responsive-item--row .responsive-item__image {
        width: 20%; }
      .responsive-item--row .responsive-item__body {
        background: white;
        padding: 15px; } }
    @media screen and (min-width: 664px) and (min-width: 664px) {
      .responsive-item--row .responsive-item__body {
        padding: 30px; } }

/* Inline */
.responsive-item--inline {
  overflow: hidden; }
  @media screen and (min-width: 664px) {
    .responsive-item--inline {
      background: white;
      border: none;
      padding: 0;
      margin-bottom: 30px; }
      .responsive-item--inline .responsive-item__image {
        float: left;
        display: block;
        margin-right: 3.7037037037%;
        width: 48.1481481481%;
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0; }
        .responsive-item--inline .responsive-item__image:last-child {
          margin-right: 0; }
        .responsive-item--inline .responsive-item__image .image-wrapper,
        .responsive-item--inline .responsive-item__image .image-placeholder-4-3 {
          position: absolute;
          top: 0;
          right: 0;
          bottom: 0;
          left: 0; }
      .responsive-item--inline .responsive-item__body {
        float: left;
        display: block;
        margin-right: 3.7037037037%;
        width: 48.1481481481%;
        float: right;
        background: white;
        padding: 30px 30px 30px 0; }
        .responsive-item--inline .responsive-item__body:last-child {
          margin-right: 0; } }

/* Flexbox */
@media screen and (min-width: 664px) {
  .responsive-item--flex.responsive-item--flex.responsive-item--flex,
  .responsive-item--flex .responsive-item__body,
  .responsive-item--flex .responsive-item__content-wrapper,
  .responsive-item--flex .responsive-item__content {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column;
    -ms-flex: 1 1 auto;
        flex: 1 1 auto; } }

@media screen and (min-width: 664px) {
  .responsive-item__flex {
    -ms-flex: 1 1 auto;
        flex: 1 1 auto; } }

/* Animation */
@media screen and (min-width: 664px) {
  .responsive-item--animated {
    /* Square */ }
    .responsive-item--animated.responsive-item--square .responsive-item__body {
      position: absolute;
      top: -1px;
      right: -1px;
      bottom: -1px;
      left: -1px;
      padding: 1px;
      overflow: hidden; }
      .responsive-item--animated.responsive-item--square .responsive-item__body:focus:after {
        outline-offset: -3px; }
    .responsive-item--animated.responsive-item--square .responsive-item__content-wrapper {
      display: block;
      position: absolute;
      right: 0;
      bottom: 0;
      left: 0;
      transition: all 0.2s cubic-bezier(0.195, 0.4, 0.45, 0.785);
      transform: translate(0, 100%); }
      .responsive-item--animated.responsive-item--square .responsive-item__content-wrapper .responsive-item__content:first-child {
        display: block;
        position: absolute;
        bottom: 100%;
        background: white;
        margin: 0;
        text-decoration: none; }
      .responsive-item--animated.responsive-item--square .responsive-item__content-wrapper .responsive-item__slidein {
        display: block;
        padding-top: 0; }
    .responsive-item--animated.responsive-item--square .responsive-item__content,
    .responsive-item--animated.responsive-item--square .responsive-item__slidein {
      position: relative; }
    .responsive-item--animated.responsive-item--square:hover .responsive-item__content-wrapper {
      transform: translate(0, 0); } }

/* Podcast item */
.podcast-item-square .favorite-button {
  position: absolute;
  right: 10px;
  bottom: 10px;
  z-index: 2;
  height: 39px;
  width: 39px;
  border-radius: 4px;
  color: #003576;
  bottom: 33px; }
  @media screen and (min-width: 664px) {
    .podcast-item-square .favorite-button {
      bottom: 23px; } }
  .podcast-item-square .favorite-button:focus, .podcast-item-square .favorite-button:hover {
    background: #003576;
    color: white; }
  .podcast-item-square .favorite-button .favorite-button__closed,
  .podcast-item-square .favorite-button .favorite-button__open {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 1em;
    height: 1em;
    font-size: 1em;
    margin-top: -0.5em;
    margin-left: -0.5em; }

.sidebar .podcast-item-square + .podcast-item-square {
  margin-top: 30px; }

/* Small podcast item */
.podcast--small .responsive-item__body {
  padding: 25px;
  vertical-align: middle; }

/* Broadcast item */
.podcast-item-square,
.broadcast-item {
  color: #003576; }
  .podcast-item-square .responsive-item__body, .podcast-item-square .responsive-item__body a,
  .broadcast-item .responsive-item__body,
  .broadcast-item .responsive-item__body a {
    color: #003576; }
  .podcast-item-square .responsive-item__content,
  .broadcast-item .responsive-item__content {
    font-family: "aleo", "Calibri", "Gill Sans", "Trebuchet MS", Arial, sans-serif;
    font-weight: 700; }
  .podcast-item-square .responsive-item__slidein,
  .broadcast-item .responsive-item__slidein {
    font-family: "npo-sans", "Calibri", "Gill Sans", "Trebuchet MS", Arial, sans-serif;
    font-weight: 700;
    font-size: 14px;
    line-height: 16px; }

.thema-item .responsive-item__flex h2 {
  margin-bottom: 4px; }

@media screen and (min-width: 664px) {
  .thema-item .responsive-item__flex {
    margin-bottom: 30px; }
    .thema-item .responsive-item__flex h2 {
      margin-bottom: 15px; } }

@media screen and (min-width: 664px) {
  .column-item .responsive-item__image {
    float: left;
    width: 25%;
    margin: 30px; } }

.column-item .column-item__author,
.column-item .block-column__content {
  display: none; }
  @media screen and (min-width: 664px) {
    .column-item .column-item__author,
    .column-item .block-column__content {
      display: block; } }

.column-item h2 {
  margin-bottom: 4px; }
  @media screen and (min-width: 664px) {
    .column-item h2 {
      margin-bottom: 15px; } }

.favorite-button {
  display: inline-block;
  vertical-align: middle;
  cursor: pointer;
  width: 1em;
  height: 1em;
  line-height: 1em; }
  .favorite-button .favorite-button__open,
  .favorite-button .favorite-button__closed {
    position: absolute;
    top: 0;
    left: 0;
    width: 1em;
    height: 1em;
    line-height: 1em;
    overflow: hidden; }
  .favorite-button .favorite-button__open {
    display: block; }
  .favorite-button .favorite-button__closed {
    display: none; }
  .favorite-button.is-favorite .favorite-button__open {
    display: none; }
  .favorite-button.is-favorite .favorite-button__closed {
    display: block; }
  .favorite-button svg {
    display: block; }

.js-favorite-podcast svg .star-filled {
  display: none; }

.js-favorite-podcast svg .star-open {
  display: inline-block; }

.js-favorite-podcast.is-favorite svg .star-filled {
  display: inline-block; }

.js-favorite-podcast.is-favorite svg .star-open {
  display: none; }

.js-favorite-podcast.button svg, .js-favorite-podcast.block-share__item svg {
  top: -2px;
  width: 2em;
  height: 2em; }

.toggle-favorites .toggle-favorites-off {
  display: inline-block; }

.toggle-favorites .toggle-favorites-on {
  display: none; }

.toggle-favorites.is-active .toggle-favorites-on {
  display: inline-block; }

.toggle-favorites.is-active .toggle-favorites-off {
  display: none; }

/* Ster advertentie styling */
.sterad-r1-home[data-display*="mobile"] {
  background: white; }

.sterad-r1-article {
  position: relative;
  z-index: 99; }
  .sterad-r1-article[data-display*="mobile"] {
    position: relative;
    z-index: 1;
    margin-bottom: 24px; }
  .sterad-r1-article[data-display*="desktop"] {
    position: absolute;
    top: 0;
    right: 0;
    padding: 2.4390243902%;
    left: calc(((100% - 600px) / 2) + 600px);
    text-align: right; }
    .sterad-r1-article[data-display*="desktop"] .sterad__header,
    .sterad-r1-article[data-display*="desktop"] .sterad__body {
      max-width: 160px;
      text-align: center;
      margin-left: auto; }

.sterad-r1-popuplive {
  margin-bottom: 24px; }

.sterad__header {
  font-family: "npo-sans", "Calibri", "Gill Sans", "Trebuchet MS", Arial, sans-serif;
  font-weight: 700;
  color: #003576; }

@media screen and (min-width: 988px) {
  .thema__content.thema__content {
    min-height: 680px; } }

/**
 * Buttons
 *
 * 1. To position tooltip
 */
.button, .block-share__item {
  display: inline-block;
  border-radius: 0;
  font-family: "npo-sans", "Calibri", "Gill Sans", "Trebuchet MS", Arial, sans-serif;
  font-weight: 700;
  text-decoration: none;
  text-align: center;
  cursor: pointer;
  backface-visibility: visible;
  transition: background 0.2s cubic-bezier(0.195, 0.4, 0.45, 0.785), color 0.2s cubic-bezier(0.195, 0.4, 0.45, 0.785);
  -webkit-text-size-adjust: none;
      -ms-text-size-adjust: none;
          text-size-adjust: none;
  padding: 9px;
  font-size: 18px;
  line-height: 18px;
  /* Hover and focus state */
  /* SVG */ }
  .button:hover, .block-share__item:hover, .button:focus, .block-share__item:focus {
    background: #003576;
    color: white;
    outline: none; }
  .button:active, .block-share__item:active {
    outline: 1px dotted #003576; }
  .button .button__icon, .block-share__item .button__icon,
  .button svg,
  .block-share__item svg {
    fill: currentColor; }

/* Button content */
.button__icon,
.button svg,
.block-share__item svg {
  position: relative;
  z-index: 1;
  top: -1px;
  display: inline-block;
  vertical-align: middle;
  width: 1em;
  height: 1em; }

/* Spacing icon (before or after text) */
.button__text + .button__icon,
.button__text + svg {
  margin-left: .33em; }

.button__icon + .button__text,
.button svg + .button__text,
.block-share__item svg + .button__text {
  padding-left: .33em; }

/**
 * Button styles
 */
/* Block button */
.button--block {
  display: block;
  width: 100%;
  text-align: center; }

.button--block-to-third {
  display: block;
  width: 100%;
  text-align: center; }
  @media screen and (min-width: 664px) {
    .button--block-to-third {
      width: 31.7073170732%;
      margin-left: auto;
      margin-right: auto; } }

/* Small button */
.button--small {
  padding: 6px;
  font-size: 16px;
  line-height: 16px; }

/* Large button */
.button--large {
  /* Smaller font size for mobile views */
  font-size: 21px;
  line-height: 21px;
  padding: 10px;
  /* Larger font on desktop views */ }
  @media screen and (min-width: 664px) {
    .button--large {
      font-size: 24px;
      line-height: 24px;
      padding: 12px; } }

/* No radius button */
.button--no-radius {
  border-radius: 0; }

/* round button */
.button--round, .block-share__item {
  border-radius: 100%; }

/* Button with primary background */
.button--primary {
  border: none;
  background: #003576;
  color: white; }
  .button--primary:hover, .button--primary:focus {
    background: #00b9e6; }

/* Button without border nor background */
.button--clean {
  border: none;
  background: transparent;
  color: #003576; }

/* Button with light primary background */
.button--primary-lighter {
  border: none;
  background: #d5dee8;
  color: #003576; }

/* Button with accent background */
.button--accent {
  border: none;
  background: #00b9e6;
  color: white; }

/* For buttons on dark backgrounds */
.button--hover-inverse:focus, .button--hover-inverse:hover {
  background: white;
  color: #003576; }

/* Line buttons */
.button--line {
  border: 2px solid #003576;
  background: transparent;
  color: #003576;
  line-height: 14px; }
  .button--line.button--large {
    line-height: 17px; }
    @media screen and (min-width: 440px) {
      .button--line.button--large {
        line-height: 20px; } }

.button--line-white {
  border: 2px solid white;
  background: transparent;
  color: white;
  line-height: 14px; }
  .button--line-white:focus, .button--line-white:hover {
    background: white;
    color: #003576; }

/* White buttons */
.button--white {
  border: 1px solid #003576;
  background: white;
  color: #003576;
  line-height: 16px; }
  .button--white.button--large {
    line-height: 19px;
    margin-right: 1em; }
    .button--white.button--large:last-child {
      margin-right: 0; }
    @media screen and (min-width: 440px) {
      .button--white.button--large {
        line-height: 22px; } }

.button--line-white-inverse {
  border: 1px solid #aaaaaa;
  background: transparent;
  line-height: 14px;
  color: #aaaaaa; }
  .button--line-white-inverse.button--hover-inverse {
    border-color: white; }

/* Inactive buttons */
.button--inactive {
  background: white;
  border: 1px solid #aaaaaa;
  color: #aaaaaa;
  cursor: default;
  transition: none;
  /* No hover styling for inactive buttons */
  /*
   * 1. Always display for inactive items
   */ }
  .button--inactive:hover {
    background: white;
    outline: none; }
  .button--inactive:focus {
    background: #F1F4F7;
    outline: none; }
  .button--inactive .button__icon,
  .button--inactive svg {
    fill: #aaaaaa; }

/**
 * Button group horizontal
 *
 * 1. Font-size: 0 for aligning display: inline-blocks items without spacing
 *    Font-size will be set on the buttons itself
 */
.button-group {
  font-size: 0; }
  .button-group .button, .button-group .block-share__item {
    border-radius: 0;
    margin-left: 1px; }
    .button-group .button:first-child, .button-group .block-share__item:first-child {
      border-radius: 4px 0 0 4px;
      margin-left: 0; }
    .button-group .button:last-child, .button-group .block-share__item:last-child {
      border-radius: 0 4px 4px 0; }
  .button-group .button--inactive:first-child {
    border-right: none; }
  .button-group .button--inactive:last-child {
    margin-left: 0;
    border-left: 1px solid #aaaaaa; }
  .button-group .button--inactive.button--large {
    padding: 11px; }
  .button-group .button--accent + .button--inactive {
    margin-left: 1px; }

/**
 * Button group vertical
 */
.button-group--vertical {
  position: absolute;
  top: 0;
  right: 0;
  /**
   * Safari hover bug
   *
   * 1. Set group to cover complete parent
   * 2. Set pointer events to 0 to make sure entire parent is clickable
   */
  left: 0;
  pointer-events: none; }
  .button-group--vertical .button, .button-group--vertical .block-share__item {
    display: block;
    z-index: 9;
    /**
     * Safari hover bug
     *
     * 1. Re-set pointer events so buttons ar clickable
     * 2. Float buttons to the right now
     * 3. Clear buttons to stack em instead of float em
     */
    pointer-events: auto;
    float: right;
    clear: both; }
    .button-group--vertical .button:nth-child(n), .button-group--vertical .block-share__item:nth-child(n) {
      border-radius: 0; }
    .button-group--vertical .button:last-child, .button-group--vertical .block-share__item:last-child {
      border-radius: 0 0 0 4px;
      margin-left: 0;
      margin-top: 1px; }
    .button-group--vertical .button:first-child, .button-group--vertical .block-share__item:first-child {
      margin-top: 0; }
  .button-group--vertical .button--large {
    padding: 12px; }
  .button-group--vertical .button--inactive:first-child, .button-group--vertical .button--inactive:last-child {
    border: none; }
  .button-group--vertical .button--inactive.button--large {
    padding: 12px; }
  .button-group--vertical .button--accent + .button--inactive {
    margin-left: 0; }

/**
 * button list
 */
.dropdown {
  position: relative;
  z-index: 2;
  overflow: visible;
  display: inline-block;
  vertical-align: middle;
  /* When dropdown is active */ }
  .dropdown.is-active {
    overflow: visible;
    z-index: 3; }
    .dropdown.is-active .button-list {
      visibility: visible; }
    .dropdown.is-active .dropdown__button {
      border-radius: 4px 4px 0 0;
      background: #003576;
      color: white; }
      .dropdown.is-active .dropdown__button svg {
        fill: white;
        transform: rotate(180deg); }

.button-list {
  position: absolute;
  left: 0;
  right: 0;
  visibility: hidden; }
  .button-list .button, .button-list .block-share__item {
    position: relative;
    border-top: 1px solid white;
    border-radius: 0;
    width: 100%;
    text-align: left;
    padding-right: 2em; }
    .button-list .button svg, .button-list .block-share__item svg {
      position: absolute;
      top: 9px;
      right: 9px;
      display: none; }
    .button-list .button:hover svg, .button-list .block-share__item:hover svg, .button-list .button:focus svg, .button-list .block-share__item:focus svg {
      display: block; }

.button--whatsapp {
  display: none; }
  body.mobile .button--whatsapp {
    display: inline-block; }

.inline-button-group {
  margin-bottom: 5px; }
  .inline-button-group:last-child {
    margin-bottom: 0; }
  .inline-button-group .button, .inline-button-group .block-share__item {
    margin: 0 10px 10px 0;
    vertical-align: top; }

.button--yesterday {
  height: 36px; }

.yesterday {
  display: none; }
  @media screen and (min-width: 664px) {
    .yesterday {
      display: inline; } }

/* Extra content loading button */
.button--extracontent.is-loading:before {
  content: " ";
  display: inline-block;
  width: 15px;
  height: 15px;
  vertical-align: middle;
  border-radius: 50%;
  margin-right: 1em;
  border-top: 3px groove;
  animation: rotate .75s infinite linear;
  transform: rotate(0deg);
  background: transparent; }

.button--link {
  color: #003576; }
  .button--link:hover, .button--link:focus {
    background: transparent;
    color: #00b9e6;
    outline: none; }
    .responsive-item__body .button--link:hover, .responsive-item__body .button--link:focus {
      text-decoration: none; }
  .button--link:active {
    outline: 1px dotted #003576; }

.calendar-button {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  border: none;
  width: 100%;
  display: block;
  text-decoration: none;
  cursor: pointer;
  transition: all 0.2s cubic-bezier(0.195, 0.4, 0.45, 0.785); }
  .calendar-button:focus, .calendar-button:hover {
    background: #00b9e6; }

/* ==========================================================================
   CSS only styled checkboxes
   ========================================================================== */
.appearance.checked {
  /* Put some space between the box and the label */ }
  .appearance.checked .styled-checkbox {
    /**
     * 1. Resetting the default styling used by browsers. Don't do this for -moz-
          because the checkbox and radio box will look very ugly
     * 2. Positioning relative to position psuedo before element nicely
     * 3. Vertically positioning next to text
     * 4. Aligning vertically next to labels
     * 5. Indicate that element is clickable
     */
    -webkit-appearance: none;
    /* 1 */
    /* -moz-appearance: don't set this; /* 1 */
    position: relative;
    /* 2 */
    height: 20px;
    width: 20px;
    margin-top: -1px;
    /* 3 */
    margin-bottom: 2px;
    /* 3 */
    margin-left: 0;
    margin-right: .33em;
    border: 1px solid #555;
    padding: 0;
    background: #333;
    display: inline-block;
    vertical-align: middle;
    cursor: pointer;
    /* 5 */
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15);
    border-radius: 3px;
    transition: background 0.2s cubic-bezier(0.195, 0.4, 0.45, 0.785);
    /* Hover to indicate element is clickable */
    /* Set disabled border color a bit lighter so it won't appear to be larger */
    /**
     * 1. Position psuedo element absolute to have full control
     * 2. Position top-left, margin, width and height will take care of centering
     */ }
    .appearance.checked .styled-checkbox:hover {
      background: #222;
      border-color: #666; }
    .appearance.checked .styled-checkbox:focus, .appearance.checked .styled-checkbox:focus:checked {
      outline: 0;
      border-color: #00b9e6; }
    .appearance.checked .styled-checkbox:disabled {
      border-color: #bbb; }
    .appearance.checked .styled-checkbox:before {
      position: absolute;
      /* 1 */
      top: 0;
      /* 2 */
      left: 0;
      /* 2 */
      display: block;
      text-align: center;
      vertical-align: middle;
      background: black;
      color: #00b9e6;
      content: ' ';
      width: 16px;
      height: 16px;
      margin: 1px;
      font-size: 14px;
      background: #444;
      transform: scale(0, 0);
      border-radius: 2px;
      transition: all 0.2s cubic-bezier(0.195, 0.4, 0.45, 0.785); }
    .appearance.checked .styled-checkbox:checked {
      border-color: #ccc; }
      .appearance.checked .styled-checkbox:checked:before {
        background: #00b9e6;
        transform: scale(1, 1); }
  .appearance.checked label {
    /**
     * <input id="input1">
     * <label for="input1">Label 1</label>
     * <input id="input2">
     * <label for="input2">Label 2</label>
     */
    /**
     * <label><input id="input1"> Label 1</label>
     * <label><input id="input2"> Label 2</label>
     */ }
    .appearance.checked label + input[type="checkbox"] {
      margin-left: 1em; }
    .appearance.checked label + label {
      margin-left: 1em; }

/* Pickadate overrides */
#js-pickadate-container {
  display: block;
  visibility: visible; }
  #js-pickadate-container .picker__holder {
    display: none; }
  #js-pickadate-container .picker--opened .picker__holder {
    display: block; }

.datepicker-button span, .datepicker-button svg {
  pointer-events: none; }

.picker__frame.picker__frame {
  max-width: 520px; }

.picker__frame .picker__weekday {
  color: #333; }
  .picker__frame .picker__weekday:nth-last-child(-n+2) {
    color: #898989; }

.picker__table td:nth-last-child(-n+2) .picker__day {
  color: #898989; }

.picker__table td:nth-last-child(-n+2) .picker__day--disabled {
  color: #ddd; }

/* Column list
 *
 * Progressive enhanced alphabetical from top to bottom list
 * Non "css columns" browsers get a left to right list
 * Needs modernizr csscolumns class to work properly
 */
.column-list {
  padding: 0;
  list-style: none;
  border: none;
  background: transparent;
  margin-top: 15px;
  margin-left: -1.2195121951%;
  margin-right: -1.2195121951%;
  margin-bottom: 15px;
  font-family: "npo-sans", "Calibri", "Gill Sans", "Trebuchet MS", Arial, sans-serif; }
  .column-list:before, .column-list:after {
    display: table;
    content: " "; }
  .column-list:after {
    clear: both; }
  .csscolumns .column-list {
    margin-left: auto;
    margin-right: auto; }
    @media screen and (min-width: 440px) {
      .csscolumns .column-list {
        columns: 220px 4;
        column-gap: 15px;
        line-height: 0; } }

.column-list__item {
  display: block;
  padding-left: 1.2195121951%;
  padding-right: 1.2195121951%; }
  @media screen and (min-width: 440px) {
    .column-list__item {
      float: left;
      width: 50%; } }
  @media screen and (min-width: 664px) {
    .column-list__item {
      width: 33.333333333%; } }
  @media screen and (min-width: 988px) {
    .column-list__item {
      width: 25%; } }
  .csscolumns .column-list__item {
    float: none;
    display: inline-block;
    padding: 0;
    width: 100%;
    line-height: 25px; }

.column-list__content {
  display: block; }

.column-list.podcasts .programma__icon {
  width: 20px;
  background-size: contain; }

/*
 * Flag object from mobile to desktop
 */
.flag-object {
  display: table;
  width: 100%; }
  .flag-object .flag-object__body,
  .flag-object .flag-object__aside {
    display: table-cell;
    vertical-align: middle; }
  .flag-object .flag-object__aside {
    width: 1%;
    white-space: nowrap;
    padding-right: 10px; }
    .flag-object .flag-object__aside--right {
      padding-right: 0;
      padding-left: 10px;
      text-align: right; }
    .flag-object .flag-object__aside img {
      min-width: 100%;
      max-width: none; }
    .flag-object .flag-object__aside > img,
    .flag-object .flag-object__aside > svg,
    .flag-object .flag-object__aside > [class*="icon"] {
      display: block; }
    .flag-object .flag-object__aside .button, .flag-object .flag-object__aside .block-share__item {
      vertical-align: top; }
  .flag-object .flag-object__body + .flag-object__aside {
    padding-left: 10px; }
  .flag-object.flag-object--top .flag-object__body,
  .flag-object.flag-object--top .flag-object__aside {
    vertical-align: top; }
  .flag-object.flag-object--right .flag-object__aside {
    padding-right: 0;
    padding-left: 10px;
    text-align: right; }
  .flag-object.flag-object--inline {
    width: auto; }
    .flag-object.flag-object--inline .flag-object__body,
    .flag-object.flag-object--inline .flag-object__aside {
      width: auto; }
  .flag-object.flag-object--center {
    margin-left: auto;
    margin-right: auto; }

.flag-object__aside--buttons {
  font-size: 0; }

/*
 * Flag object from alpha-plus to desktop
 */
@media screen and (min-width: 440px) {
  .flag-object-alpha-plus {
    display: table;
    width: 100%; }
    .flag-object-alpha-plus.flag-object--right .flag-object__aside {
      text-align: right; }
    .flag-object-alpha-plus.flag-object--top .flag-object__body,
    .flag-object-alpha-plus.flag-object--top .flag-object__aside {
      vertical-align: top; }
    .flag-object-alpha-plus.flag-object--right > .flag-object__aside {
      padding-right: 0;
      padding-left: 10px;
      text-align: right; } }
  @media screen and (min-width: 440px) and (min-width: 440px) {
    .flag-object-alpha-plus .flag-object__body,
    .flag-object-alpha-plus .flag-object__aside {
      display: table-cell;
      vertical-align: middle; } }

@media screen and (min-width: 440px) {
    .flag-object-alpha-plus .flag-object__aside {
      width: 1%;
      white-space: nowrap;
      padding-right: 10px;
      padding-top: 10px; } }
    @media screen and (min-width: 440px) and (min-width: 440px) {
      .flag-object-alpha-plus .flag-object__aside {
        padding-top: 0; } }

/*
 * Flag object from beta to desktop
 */
.flag-object-beta > .flag-object__body {
  padding-top: 10px; }
  @media screen and (min-width: 664px) {
    .flag-object-beta > .flag-object__body {
      padding-top: 0; } }

.flag-object-beta.flag-object--right > .flag-object__body {
  padding-top: 0; }

.flag-object-beta.flag-object--right > .flag-object__aside {
  padding-top: 10px; }
  @media screen and (min-width: 664px) {
    .flag-object-beta.flag-object--right > .flag-object__aside {
      text-align: right; } }

@media screen and (min-width: 664px) {
  .flag-object-beta {
    display: table;
    width: 100%; }
    .flag-object-beta .flag-object__body,
    .flag-object-beta .flag-object__aside {
      display: table-cell;
      vertical-align: middle; }
    .flag-object-beta > .flag-object__aside {
      width: 1%;
      white-space: nowrap;
      padding-right: 10px;
      padding-top: 0; }
    .flag-object-beta.flag-object--top .flag-object__body,
    .flag-object-beta.flag-object--top .flag-object__aside {
      vertical-align: top; }
    .flag-object-beta.flag-object--right > .flag-object__aside {
      padding-right: 0;
      padding-left: 10px; }
    .flag-object-beta .flag-object__aside--select {
      width: unset; } }

.tabs--frequenties .tabs__content {
  background: white; }

.tabs--frequenties .tabs__tab {
  border: none;
  background: transparent;
  display: table-cell;
  width: 50%;
  margin: 0;
  padding: 0; }
  .tabs--frequenties .tabs__tab .heading {
    display: block;
    background: #E6E6E6;
    color: #AAAAAA;
    padding: 15px; }
  .tabs--frequenties .tabs__tab:first-child {
    padding-right: 5px; }
  .tabs--frequenties .tabs__tab:last-child {
    padding-left: 5px; }
  .tabs--frequenties .tabs__tab.is-active span {
    background: white;
    color: #003576; }

.tabs--frequenties .tabs__item {
  padding: 10px; }
  @media screen and (min-width: 664px) {
    .tabs--frequenties .tabs__item {
      padding: 19px; } }
  @media screen and (min-width: 768px) {
    .tabs--frequenties .tabs__item {
      padding: 28px; } }

/**
 * Filter
 *
 * Right positioned input field to filter presenters and programmes
 */
.filter-container {
  margin-bottom: 15px;
  text-align: right; }
  @media screen and (min-width: 664px) {
    .filter-container {
      width: 350px;
      max-width: 60%;
      position: absolute;
      top: 0;
      right: 0; } }
  @media screen and (min-width: 768px) {
    .filter-container {
      width: 400px; }
      .filter-container.filter-container--presenters {
        width: 320px; } }
  @media screen and (min-width: 988px) {
    .filter-container {
      width: 500px; } }
  .filter-container input {
    width: 100%;
    background: white;
    border: 1px solid #cbd0d3;
    border-radius: 4px;
    padding: 5px 10px;
    font-size: 16px;
    line-height: 24px;
    height: auto;
    box-sizing: border-box;
    float: right; }

/* Heading styling */
.heading,
.heading-sans,
h1, h2, h3, h4, h5, h6 {
  display: block;
  color: #003576;
  margin-bottom: 15px; }
  .heading:last-child,
  .heading-sans:last-child,
  h1:last-child, h2:last-child, h3:last-child, h4:last-child, h5:last-child, h6:last-child {
    margin-bottom: 0; }
  .heading a,
  .heading-sans a,
  h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
    text-decoration: none;
    color: inherit; }
    .heading a:focus, .heading a:hover,
    .heading-sans a:focus,
    .heading-sans a:hover,
    h1 a:focus,
    h1 a:hover, h2 a:focus, h2 a:hover, h3 a:focus, h3 a:hover, h4 a:focus, h4 a:hover, h5 a:focus, h5 a:hover, h6 a:focus, h6 a:hover {
      text-decoration: underline; }
    .heading a:active,
    .heading-sans a:active,
    h1 a:active, h2 a:active, h3 a:active, h4 a:active, h5 a:active, h6 a:active {
      outline: 1px dotted #003576; }

.heading, h1, h3, h5 {
  font-family: "aleo", "Calibri", "Gill Sans", "Trebuchet MS", Arial, sans-serif;
  font-weight: 700; }

.heading--tiny {
  font-size: 16px;
  line-height: 24px;
  font-weight: 700; }

.heading--small, h5 {
  font-size: 18px;
  line-height: 27px; }
  @media screen and (min-width: 664px) {
    .heading--small, h5 {
      font-size: 20px;
      line-height: 30px; } }

.heading--medium, h3 {
  font-size: 20px;
  line-height: 30px; }
  @media screen and (min-width: 664px) {
    .heading--medium, h3 {
      font-size: 22px;
      line-height: 33px; } }
  @media screen and (min-width: 988px) {
    .heading--medium, h3 {
      font-size: 24px;
      line-height: 36px; } }

.heading--large, h1 {
  font-size: 18px;
  line-height: 27px; }
  @media screen and (min-width: 440px) {
    .heading--large, h1 {
      font-size: 20px;
      line-height: 30px; } }
  @media screen and (min-width: 664px) {
    .heading--large, h1 {
      font-size: 22px;
      line-height: 33px; } }
  @media screen and (min-width: 768px) {
    .heading--large, h1 {
      font-size: 30px;
      line-height: 37px; } }

.heading--huge {
  font-size: 18px;
  line-height: 27px; }
  @media screen and (min-width: 440px) {
    .heading--huge {
      font-size: 20px;
      line-height: 30px; } }
  @media screen and (min-width: 664px) {
    .heading--huge {
      font-size: 22px;
      line-height: 33px; } }
  @media screen and (min-width: 768px) {
    .heading--huge {
      font-size: 30px;
      line-height: 37px; } }
  @media screen and (min-width: 988px) {
    .heading--huge {
      font-size: 45px;
      line-height: 50px; } }

.heading-sans, h2, h4, h6 {
  font-family: "npo-sans", "Calibri", "Gill Sans", "Trebuchet MS", Arial, sans-serif;
  font-weight: 700; }

.heading-sans--small, h6 {
  font-size: 14px;
  line-height: 15px; }

.heading-sans--medium, h4 {
  font-size: 18px;
  line-height: 27px; }

.heading-sans--large, h2 {
  font-size: 20px;
  line-height: 29px; }
  @media screen and (min-width: 664px) {
    .heading-sans--large, h2 {
      font-size: 25px;
      line-height: 31px; } }

.heading--accent {
  color: #00b9e6; }

.heading--white {
  color: white; }

.heading--black {
  color: black; }

.heading--white-inverse {
  color: #aaaaaa; }

.heading--bordered {
  text-align: center;
  overflow: hidden;
  white-space: nowrap; }
  .heading--bordered span {
    display: inline-block;
    vertical-align: middle;
    transform: translateX(-50%); }
    .heading--bordered span:before, .heading--bordered span:after {
      content: " ";
      display: inline-block;
      vertical-align: middle;
      height: 2px;
      width: 50%;
      background: #00b9e6;
      margin: -1px 10px 0; }

.heading--bottom-border {
  border-bottom: 1px solid #ccc;
  padding-bottom: 15px; }

/* Image placeholders */
.image-placeholder-1-1,
.image-placeholder-3-1,
.image-placeholder-3-4,
.image-placeholder-4-3,
.image-placeholder-16-9 {
  width: 100%;
  background-color: transparent;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat; }
  .image-placeholder-1-1.image-coverall,
  .image-placeholder-3-1.image-coverall,
  .image-placeholder-3-4.image-coverall,
  .image-placeholder-4-3.image-coverall,
  .image-placeholder-16-9.image-coverall {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    /* No coverall when flexbox isn't working */ }
    .no-flexbox, .no-flexboxlegacy .image-placeholder-1-1.image-coverall, .no-flexboxlegacy
    .image-placeholder-3-1.image-coverall, .no-flexboxlegacy
    .image-placeholder-3-4.image-coverall, .no-flexboxlegacy
    .image-placeholder-4-3.image-coverall, .no-flexboxlegacy
    .image-placeholder-16-9.image-coverall {
      position: relative;
      top: auto;
      right: auto;
      bottom: auto;
      left: auto; }
  @media screen and (min-width: 664px) {
    .image-placeholder-1-1.image-coverall-beta,
    .image-placeholder-3-1.image-coverall-beta,
    .image-placeholder-3-4.image-coverall-beta,
    .image-placeholder-4-3.image-coverall-beta,
    .image-placeholder-16-9.image-coverall-beta {
      position: absolute;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      /* No coverall when flexbox isn't working */ }
      .no-flexbox, .no-flexboxlegacy .image-placeholder-1-1.image-coverall-beta, .no-flexboxlegacy
      .image-placeholder-3-1.image-coverall-beta, .no-flexboxlegacy
      .image-placeholder-3-4.image-coverall-beta, .no-flexboxlegacy
      .image-placeholder-4-3.image-coverall-beta, .no-flexboxlegacy
      .image-placeholder-16-9.image-coverall-beta {
        position: relative;
        top: auto;
        right: auto;
        bottom: auto;
        left: auto; } }

.image-placeholder-1-1 {
  background-image: url("../images/image-placeholder-1-1.png"); }
  .image-placeholder-1-1:before {
    display: block;
    content: " ";
    padding-top: 100%; }

.image-placeholder-3-1 {
  background-image: url("../images/image-placeholder-3-1.png"); }
  .image-placeholder-3-1:before {
    display: block;
    content: " ";
    padding-top: 33.3333333333%; }

.image-placeholder-3-4 {
  background-image: url("../images/image-placeholder-3-4.png"); }
  .image-placeholder-3-4:before {
    display: block;
    content: " ";
    padding-top: 133.333333333%; }

.image-placeholder-4-3 {
  background-image: url("../images/image-placeholder-4-3.png"); }
  .image-placeholder-4-3:before {
    display: block;
    content: " ";
    padding-top: 75%; }

.image-placeholder-4-3::before {
  padding-top: 100%; }

.image-placeholder-16-9 {
  background-image: url("../images/image-placeholder-16-9.png"); }
  .image-placeholder-16-9:before {
    display: block;
    content: " ";
    padding-top: 56.25%; }

/* IMage classes */
.image-left {
  width: 100%;
  max-width: 33%;
  float: left;
  margin: 0 1em .5em 0; }

.image {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: #aaaaaa;
  background-position: center;
  background-size: cover; }

.image-wrapper {
  -ms-flex-positive: 0;
      flex-grow: 0;
  position: relative;
  min-width: 100%; }

.label {
  background: transparent;
  color: #003576;
  vertical-align: middle;
  margin-top: -1.25em;
  border-radius: 4px;
  display: inline-block;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 10px;
  line-height: 16px;
  padding: 0 5px;
  text-transform: uppercase; }
  @media screen and (min-width: 768px) {
    .label {
      font-size: 12px;
      line-height: 20px;
      padding: 0 7px; } }
  .label.label--new {
    background-color: red;
    color: white; }

/**
 * Cover complete parent link
 *
 * Looks like the complete block is clickable
 * Using it like this makes sure you can have multiple links (like playlist buttons, social buttons)
   inside the same full clickable block
 */
.link-coverall:after {
  display: block;
  content: " ";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: transparent;
  transition: all 0.2s cubic-bezier(0.195, 0.4, 0.45, 0.785);
  z-index: 2; }

.link-coverall:focus {
  outline: none; }
  .link-coverall:focus:after {
    outline: 2px solid #00b9e6;
    outline-offset: -1px; }

.link-coverall--bottom {
  display: block; }
  .link-coverall--bottom:after {
    margin-bottom: 0; }
    @media screen and (min-width: 440px) {
      .link-coverall--bottom:after {
        margin-bottom: 10.5263157895%; } }
    @media screen and (min-width: 664px) {
      .link-coverall--bottom:after {
        margin-bottom: 12.9032258065%; } }
    @media screen and (min-width: 768px) {
      .link-coverall--bottom:after {
        margin-bottom: 16.6666666667%; } }
    @media screen and (min-width: 988px) {
      .link-coverall--bottom:after {
        margin-bottom: 13.5135135135%; } }

/**
 * Links on top of coverall links
 *
 * Make sure to add this class to any other links inside the fake full clickable block
 */
.link-ontop {
  position: relative;
  z-index: 3;
  display: inline-block; }

/**
 * Listen back
 */
.listen-back {
  padding: 10px 10px 0; }
  @media screen and (min-width: 664px) {
    .listen-back {
      padding: 20px 19px 10px; } }
  @media screen and (min-width: 768px) {
    .listen-back {
      padding: 2.4390243902% 2.4390243902% 10px; } }

@media screen and (min-width: 664px) {
  .listen-back__heading,
  .listen-back__buttons {
    display: inline-block; } }

.listen-back__buttons {
  vertical-align: middle;
  font-size: 0; }
  @media screen and (min-width: 664px) {
    .listen-back__buttons:not(:first-child) {
      padding-left: 10px; } }
  .listen-back__buttons .button, .listen-back__buttons .block-share__item {
    margin-bottom: 10px;
    font-size: 15px; }

@media screen and (min-width: 664px) {
  .listen-back__extra {
    display: none; } }

/**
 * When there's nothing to lusten back to
 */
.sticky-section.has-no-items {
  margin-bottom: 1px; }
  @media screen and (min-width: 664px) {
    .sticky-section.has-no-items {
      margin-bottom: 19px; } }
  @media screen and (min-width: 768px) {
    .sticky-section.has-no-items {
      margin-bottom: 28px; } }
  .sticky-section.has-no-items .listen-back {
    background: white; }

/* Live player container */
.live_container {
  position: relative;
  height: 0;
  padding-bottom: 56.25%; }

.live_container .npoplayer {
  position: absolute !important;
  display: block;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%; }

/* Live label on live and gids pages */
.label-live {
  background: red;
  color: white;
  vertical-align: middle;
  margin-top: -.25em;
  border-radius: 4px;
  display: inline-block;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 12px;
  line-height: 20px;
  padding: 0 5px; }
  @media screen and (min-width: 768px) {
    .label-live {
      font-size: 14px;
      line-height: 24px;
      padding: 0 7px; } }
  .label-live svg {
    display: inline-block;
    fill: white;
    vertical-align: middle;
    width: 10px;
    height: 10px; }
    @media screen and (min-width: 768px) {
      .label-live svg {
        width: 12px;
        height: 12px; } }

#liveblog_container, #liveblog_detail_container {
  display: block;
  position: relative;
  margin: 20px auto; }

#liveblog_messages, #liveblog_message {
  margin: 0;
  padding: 0;
  list-style: none; }

#liveblog_messages > li, #liveblog_message {
  margin: 20px 0;
  padding: 0;
  position: relative;
  overflow: hidden; }

#liveblog_messages .message-container, #liveblog_message .message-container {
  margin: 0 20px;
  padding: 0;
  overflow: hidden; }

#liveblog_messages .message-container:before, #liveblog_message .message-container:before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 50%;
  bottom: 0;
  width: 1px;
  background: #003576; }

#liveblog_messages .message, #liveblog_message .message {
  margin-top: 50px;
  padding: 15px;
  border: 1px solid #e6e6e6;
  background: #fff;
  font-size: 16px;
  color: #454e59;
  position: relative;
  z-index: 2; }

#liveblog_messages .datetime, #liveblog_message .datetime {
  position: absolute;
  top: 8px;
  left: 35px;
  padding: 2px 0;
  color: #003576;
  font-family: aleo;
  text-decoration: none; }

#liveblog_messages .datetime .date, #liveblog_message .datetime .date {
  display: none !important;
  font-size: 20px;
  font-weight: bold; }

#liveblog_messages .datetime .time, #liveblog_message .datetime .time {
  display: block;
  color: #00b9e6;
  font-size: 17px; }

#liveblog_messages .category, #liveblog_message .category {
  position: absolute;
  top: 0;
  left: 50%;
  width: 40px;
  height: 40px;
  margin-left: -20px;
  background: #003576 no-repeat center center;
  background-size: 100% 100%;
  overflow: hidden;
  text-indent: -3333px; }

#liveblog_messages .category:before, #liveblog_message .category:before {
  content: "";
  display: block;
  width: 40px;
  height: 40px;
  background: no-repeat center center;
  background-size: 100% 100%; }

#liveblog_messages .category.category-tekst:before, #liveblog_message .category.category-tekst:before {
  background-image: url("//liveblog.npo.nl/static/img/npo3fm-icon-article.png"); }

#liveblog_messages .category.category-actie:before, #liveblog_message .category.category-actie:before {
  background-image: url("//liveblog.npo.nl/static/img/npo3fm-icon-shout.png"); }

#liveblog_messages .category.category-foto:before, #liveblog_message .category.category-foto:before {
  background-image: url("//liveblog.npo.nl/static/img/npo3fm-icon-photo.png"); }

#liveblog_messages .category.category-video:before, #liveblog_message .category.category-video:before {
  background-image: url("//liveblog.npo.nl/static/img/npo3fm-icon-video.png"); }

#liveblog_messages .category.category-audio:before, #liveblog_message .category.category-audio:before {
  background-image: url("//liveblog.npo.nl/static/img/npo3fm-icon-audio.png"); }

#liveblog_messages .category.category-muziek:before, #liveblog_message .category.category-muziek:before {
  background-image: url("//liveblog.npo.nl/static/img/npo3fm-icon-music.png"); }

#liveblog_messages .category.category-reacties:before, #liveblog_message .category.category-reacties:before {
  background-image: url("//liveblog.npo.nl/static/img/npo3fm-icon-comments.png"); }

#liveblog_messages .share, #liveblog_message .share {
  float: left;
  position: relative;
  top: -30px;
  left: 15px;
  z-index: 10; }

#liveblog_messages .share-twitter, #liveblog_message .share-twitter {
  display: inline-block;
  overflow: hidden;
  text-indent: -3333px;
  width: 27px;
  height: 25px;
  background: url("//liveblog.npo.nl/static/img/npo3fm-icon-twitter.png") no-repeat center center;
  background-size: auto 15px;
  margin: 0 5px 0 0; }

#liveblog_messages .share-facebook, #liveblog_message .share-facebook {
  display: inline-block;
  overflow: hidden;
  text-indent: -3333px;
  width: 25px;
  height: 25px;
  background: url("//liveblog.npo.nl/static/img/npo3fm-icon-facebook.png") no-repeat center center;
  background-size: auto 15px;
  margin: 0 5px 0 0; }

#liveblog_messages .share-link, #liveblog_message .share-link {
  display: inline-block;
  overflow: hidden;
  text-indent: -3333px;
  width: 25px;
  height: 25px;
  background: url("//liveblog.npo.nl/static/img/npo3fm-icon-link.png") no-repeat center center;
  background-size: auto 15px;
  margin: 0 5px 0 0; }

#liveblog_messages .share-embed-toggle, #liveblog_message .share-embed-toggle {
  display: inline-block;
  overflow: hidden;
  text-indent: -3333px;
  width: 35px;
  height: 25px;
  background: url("//liveblog.npo.nl/static/img/npo3fm-icon-embed.png") no-repeat center center;
  background-size: auto 15px;
  margin: 0 5px 0 0; }

#liveblog_messages .embed-code, #liveblog_message .embed-code {
  display: none;
  margin: 10px 0 0 0; }

#liveblog_messages .embed-code input, #liveblog_message .embed-code input {
  display: block;
  width: 98%;
  padding: 3px 1%;
  font-family: monospace; }

#liveblog_messages .author, #liveblog_message .author {
  display: none; }

#liveblog_container .liveblog-pagination {
  display: block;
  padding: 10px 0;
  text-align: center;
  background: #fff; }

#liveblog_container #liveblog_pagination_top {
  display: none; }

#liveblog_container #liveblog_pagination_bottom {
  padding-bottom: 50px; }

#liveblog_messages .category, #liveblog_message .category {
  left: 30px;
  width: 25px;
  height: 25px; }

#liveblog_messages .category:before, #liveblog_message .category:before {
  width: 25px;
  height: 25px; }

#liveblog_messages .message-container:before, #liveblog_message .message-container:before {
  left: 21px; }

#liveblog_messages .message, #liveblog_message .message {
  margin-top: 5px; }

#liveblog_messages .datetime, #liveblog_message .datetime {
  top: 0;
  left: 45px; }

#liveblog_messages .datetime .date, #liveblog_messages .datetime .time, #liveblog_message .datetime .date, #liveblog_message .datetime .time {
  display: inline; }

#liveblog_messages .message-container, #liveblog_message .message-container {
  margin-left: 40px;
  margin-top: 30px; }

/**
 * Load more button
 */
.loadmore {
  display: table;
  width: 100%;
  padding-top: 10px;
  padding-bottom: 10px; }
  @media screen and (min-width: 664px) {
    .loadmore {
      padding-top: 0;
      padding-bottom: 19px; } }
  @media screen and (min-width: 768px) {
    .loadmore {
      padding-bottom: 28px; } }
  .loadmore .button, .loadmore .block-share__item {
    display: table-cell; }
  .loadmore .button.is-loading:before, .loadmore .is-loading.block-share__item:before {
    content: " ";
    display: inline-block;
    width: 15px;
    height: 15px;
    vertical-align: middle;
    border-radius: 50%;
    margin-right: 1em;
    border-top: 3px groove;
    animation: rotate .75s infinite linear;
    transform: rotate(0deg);
    background: transparent; }

.media-container {
  margin-bottom: 25px; }
  .media-container:last-child {
    margin-bottom: 0; }
  .media-container .player_container img {
    vertical-align: middle; }
  .media-container iframe,
  .media-container object,
  .media-container embed {
    width: 100%;
    border: none; }
  .media-container .media-container__body .plyr {
    margin: 0; }
  .media-container .media-container__caption {
    display: block;
    font-size: 15px;
    font-style: italic;
    margin-top: 5px; }
  .media-container .media-container__custom-ratio {
    position: relative;
    height: 0; }
    .media-container .media-container__custom-ratio iframe,
    .media-container .media-container__custom-ratio object,
    .media-container .media-container__custom-ratio embed {
      overflow: hidden;
      position: absolute;
      top: 0;
      left: 0;
      width: 100% !important;
      height: 100% !important;
      border: none; }

.video_container {
  position: relative;
  height: 0;
  padding-bottom: 56.25%;
  /* 16:9 */
  padding-top: 25px; }
  .video_container iframe,
  .video_container object,
  .video_container embed,
  .video_container .npoplayer_wrapper {
    overflow: hidden;
    position: absolute;
    top: 0;
    left: 0;
    width: 100% !important;
    height: 100% !important;
    border: none; }

/* Media object */
.media,
.media .media__body {
  overflow: hidden; }

.media .media__image {
  float: left; }
  .media .media__image img {
    display: block; }

.media .media__image--right {
  float: right;
  overflow: hidden; }
  .media .media__image--right img {
    display: block; }

.media__image--small {
  width: 100%;
  max-width: 100px; }
  .media__image--small img {
    display: block; }

.media--news {
  position: relative; }
  .media--news + .media--news {
    border-top: 1px solid #aaaaaa;
    padding-top: 0.5em;
    margin-top: 0.5em; }
  .media--news .media__image {
    padding-right: 0.8em;
    padding-top: 5px; }
  .media--news a {
    color: #003576;
    text-decoration: none; }
    .media--news a:focus, .media--news a:hover {
      text-decoration: underline; }

/* Module with accent background */
.module--accent .content-wrapper {
  background: #00b9e6;
  color: white;
  padding: 15px; }

.newsletter-module .heading {
  margin-bottom: 5px; }

.newsletter-module input[type="email"] {
  width: 100%;
  margin-bottom: 15px;
  border-radius: 0;
  border: none;
  padding: 9px;
  color: inherit;
  background: #f1f4f7; }

.newsletter-module .status:empty {
  margin: 0; }

/* NOS Nieuws tabs */
.nos-nieuws .content-wrapper {
  background: white;
  padding: 7.6923076923%; }

.tabs--news {
  background: white;
  font-family: "npo-sans", "Calibri", "Gill Sans", "Trebuchet MS", Arial, sans-serif; }
  .tabs--news .tabs__tab {
    position: relative;
    display: table-cell;
    width: 50%;
    border: none;
    margin: 0;
    padding: 10px;
    background: #aaaaaa;
    color: white;
    font-weight: 700;
    font-size: 20px;
    line-height: 31px; }
    @media screen and (min-width: 664px) {
      .tabs--news .tabs__tab {
        font-size: 25px;
        line-height: 31px; } }
    .tabs--news .tabs__tab:after {
      border-left: 8px solid transparent;
      border-right: 8px solid transparent;
      border-bottom: 8px solid;
      border-bottom-color: white;
      position: absolute;
      content: " ";
      bottom: 0;
      left: 50%;
      margin-left: -8px;
      display: none; }
  .tabs--news .tabs__tab.is-active {
    background: #003576; }
    .tabs--news .tabs__tab.is-active:after {
      display: block; }

.nos-nieuws__item {
  position: relative;
  padding: 15px 30px;
  border-bottom: 1px solid #aaaaaa;
  transition: all 0.2s cubic-bezier(0.195, 0.4, 0.45, 0.785); }
  .nos-nieuws__item:last-child {
    border-bottom: none; }
  .nos-nieuws__item:hover, .nos-nieuws__item:focus {
    background: #f9f9fb; }
  .nos-nieuws__item a {
    color: inherit;
    text-decoration: none; }
    .nos-nieuws__item a:hover, .nos-nieuws__item a:focus {
      text-decoration: underline; }

.nos-nieuws__time {
  width: 60px;
  float: left;
  font-weight: 700;
  color: #003576; }

.nos-nieuws__content {
  margin-left: 60px; }

.nos-nieuws__image {
  margin-top: 15px;
  margin-bottom: -15px; }
  .nos-nieuws__image img {
    vertical-align: middle;
    max-width: none;
    width: 100%; }

/* Now playing */
.now-playing:before, .now-playing:after {
  display: table;
  content: " "; }

.now-playing:after {
  clear: both; }

.now-playing__item {
  position: relative;
  /* For the link-coverall */
  /* Only styling for the first-child */ }
  .now-playing__item:first-child {
    padding-bottom: 15px;
    border-bottom: 1px solid #aaaaaa;
    margin-bottom: 15px; }
  @media screen and (min-width: 768px) {
    .now-playing__item {
      float: left;
      width: 48.1481481481%;
      /* First child styling */
      /* Last child styling */ }
      .now-playing__item:first-child {
        margin-bottom: 0;
        margin-right: 3.7037037037%; }
      .now-playing__item:last-child {
        padding-bottom: 15px;
        border-bottom: 1px solid #aaaaaa; } }
  @media screen and (min-width: 988px) {
    .now-playing__item {
      float: none;
      width: 100%;
      /* First child styling */
      /* Last child styling */ }
      .now-playing__item:first-child {
        margin-bottom: 15px;
        margin-right: 0; }
      .now-playing__item:last-child {
        padding-bottom: 0;
        border-bottom: none; } }
  .now-playing__item .image-wrapper {
    width: 100px;
    transition: all 0.2s cubic-bezier(0.195, 0.4, 0.45, 0.785); }
  .now-playing__item:hover .image-wrapper {
    transform: scale(1.1); }

/**
 * Overlay
 *
 * Overlay on the bottom of the document.
 * Can be used for different sorts of items that need highlighting with a transparent dark background behind it
 */
.general-overlay {
  opacity: 0;
  background: rgba(0, 0, 0, 0.8);
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  display: block;
  width: auto;
  height: auto;
  margin: 0;
  padding: 0;
  z-index: -1;
  transition: all 0.2s cubic-bezier(0.195, 0.4, 0.45, 0.785); }

/**
 * Pagination
 *
 * Center by default for non-flexbox browsers
 */
.pagination {
  text-align: center; }

/**
 * Pagination list
 *
 * Reset font-size nad line-height dis we can use inline block to center items on non-flexbox browsers
 */
.pagination__list {
  padding: 0;
  list-style: none;
  border: none;
  background: transparent;
  font-size: 0;
  line-height: 0;
  display: inline-block;
  margin: 0 0 30px 0; }
  @media (min-width: 320px) and (min-height: 320px) {
    .flexbox .pagination__list,
    .flexboxlegacy .pagination__list {
      display: -ms-flexbox;
      display: flex;
      -ms-flex-pack: center;
          justify-content: center; } }

/**
 * Items
 *
 * 1. Hide items by default for slim pagination on mobile
 * 2. Re-set font-size and line-height
 * 3. nowrap items so the whole pagination stays neatly on one line
 * 4. Display items from $beta viewport
 * 5. Always display first, prev, active, next and last items
 */
.pagination__item {
  display: none;
  /* 1 */
  font-size: 18px;
  /* 2 */
  line-height: 27px;
  /* 2 */
  margin-left: 1px;
  white-space: nowrap;
  /* 3 */
  /* 5 */
  /**
   * Pagination content
   */
  /**
   * Space icons
   *
   * Only space from $site-width breakpoint because text isn't visible before this breakpoint
   */
  /**
   * Hidden on mobile
   *
   * We're hiding text on mobile so we get a neat little paginator
   */ }
  @media screen and (min-width: 664px) {
    .pagination__item {
      display: inline-block;
      /* 4 */ } }
  .pagination__item.pagination--first, .pagination__item.pagination--prev, .pagination__item.pagination--active, .pagination__item.pagination--next, .pagination__item.pagination--last {
    display: inline-block; }
  @media (min-width: 320px) and (min-height: 320px) {
    .flexbox .pagination__item,
    .flexboxlegacy .pagination__item {
      -ms-flex-positive: 1;
          flex-grow: 1;
      -ms-flex-negative: 1;
          flex-shrink: 1; } }
  .pagination__item:first-child {
    margin-left: 0; }
    .pagination__item:first-child .pagination__item__content {
      border-radius: 4px 0 0 4px; }
  .pagination__item:last-child .pagination__item__content {
    border-radius: 0 4px 4px 0; }
  .pagination__item .pagination__item__content {
    display: block;
    background: white;
    padding: 5px 10px;
    text-decoration: none;
    font-weight: 700;
    transition: all 0.2s cubic-bezier(0.195, 0.4, 0.45, 0.785); }
  .pagination__item.pagination--first .pagination__item__content, .pagination__item.pagination--prev .pagination__item__content, .pagination__item.pagination--next .pagination__item__content, .pagination__item.pagination--last .pagination__item__content {
    font-weight: 400; }
  .pagination__item a.pagination__item__content {
    color: #003576; }
    .pagination__item a.pagination__item__content svg {
      fill: #003576; }
    .pagination__item a.pagination__item__content:focus, .pagination__item a.pagination__item__content:hover {
      background: #003576;
      color: white; }
      .pagination__item a.pagination__item__content:focus svg, .pagination__item a.pagination__item__content:hover svg {
        fill: white; }
  .pagination__item span.pagination__item__content {
    color: #aaaaaa; }
    .pagination__item span.pagination__item__content svg {
      fill: #aaaaaa; }
  .pagination__item svg {
    padding: 2px;
    vertical-align: middle; }
  @media screen and (min-width: 1260px) {
    .pagination__item svg + span {
      margin-left: 5px; }
    .pagination__item span + svg {
      margin-left: 5px; } }
  @media screen and (min-width: 440px) {
    .pagination__item .hidden-mobile {
      display: none; } }
  @media screen and (min-width: 1260px) {
    .pagination__item .hidden-mobile {
      display: inline; } }

.plyr {
  min-width: 280px; }
  .plyr--small .plyr {
    min-width: unset;
    max-width: unset; }
    @media screen and (min-width: 768px) {
      .plyr--small .plyr .plyr__volume {
        max-width: 66px; } }
  .plyr .plyr__mute,
  .plyr .plyr__volume {
    display: none; }
  .plyr.plyr--playing .plyr__mute,
  .plyr.plyr--playing .plyr__mute .icon--pressed,
  .plyr.plyr--playing .plyr__volume {
    display: block; }
  .plyr.plyr--playing .plyr__mute .icon--not-pressed {
    display: none; }
  .plyr.plyr--muted .plyr__mute .icon--not-pressed {
    display: block; }
  .plyr.plyr--muted .plyr__mute .icon--pressed {
    display: none; }

.plyr__controls {
  -ms-flex-pack: justify;
      justify-content: space-between; }
  .plyr__controls .plyr__control:first-child,
  .plyr__controls .plyr__control:first-child + [data-plyr=pause],
  .plyr__controls > .plyr__control:first-child,
  .plyr__controls > .plyr__control:first-child + [data-plyr=pause] {
    margin-right: 10px; }

.plyr .plyr__progress {
  display: block; }

.plyr__info {
  -ms-flex: 1 0 100px;
      flex: 1 0 100px; }

.plyr__volume {
  -ms-flex: 0 0 100px;
      flex: 0 0 100px; }
  @media screen and (min-width: 768px) {
    .plyr__volume {
      -ms-flex: 1 1 100px;
          flex: 1 1 100px;
      max-width: 100px; } }
  .plyr__volume input[type='range'] {
    margin-left: 0; }

@media screen and (max-width: 664px) {
  .plyr__controls {
    -ms-flex-wrap: wrap;
        flex-wrap: wrap; }
  .plyr__control {
    -ms-flex-order: 2;
        order: 2; }
  .plyr__info {
    -ms-flex: 1 0 100%;
        flex: 1 0 100%;
    -ms-flex-order: 1;
        order: 1; }
  .plyr__time {
    -ms-flex-order: 3;
        order: 3; }
    .plyr__time + .plyr__time {
      display: block; }
  .plyr__time--duration {
    -ms-flex-order: 4;
        order: 4;
    margin-right: auto; }
  .plyr__mute {
    -ms-flex-order: 5;
        order: 5; }
  .plyr__volume {
    -ms-flex-order: 6;
        order: 6; } }

.plyr--small {
  display: block; }
  .plyr--small .plyr__controls {
    -ms-flex-wrap: wrap;
        flex-wrap: wrap; }
    .plyr--small .plyr__controls .plyr__progress {
      margin-left: unset; }
  .plyr--small .plyr__control {
    -ms-flex-order: 2;
        order: 2; }
  .plyr--small .plyr__info {
    -ms-flex: 1 0 100%;
        flex: 1 0 100%;
    -ms-flex-order: 1;
        order: 1; }
  .plyr--small .plyr__title,
  .plyr--small .plyr__subtitle {
    position: absolute;
    overflow: hidden;
    clip: rect(0 0 0 0);
    height: 1px;
    width: 1px;
    margin: -1px;
    padding: 0;
    border: 0; }
  .plyr--small .plyr__time {
    -ms-flex-order: 3;
        order: 3; }
    .plyr--small .plyr__time + .plyr__time {
      display: block; }
  .plyr--small .plyr__time--duration {
    -ms-flex-order: 4;
        order: 4;
    margin-right: auto; }
  .plyr--small .plyr__mute {
    -ms-flex-order: 5;
        order: 5; }
  .plyr--small .plyr__volume {
    -ms-flex-order: 6;
        order: 6; }

.plyr--mini .plyr__title,
.plyr--mini .plyr__subtitle,
.plyr--mini .plyr__time,
.plyr--mini .plyr__mute,
.plyr--mini .plyr__volume {
  position: absolute;
  overflow: hidden;
  clip: rect(0 0 0 0);
  height: 1px;
  width: 1px;
  margin: -1px;
  padding: 0;
  border: 0; }

.plyr--mini .plyr__controls {
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap; }

.plyr--mini .plyr__control {
  -ms-flex-order: 1;
      order: 1; }

.plyr--mini .plyr__info {
  -ms-flex: 1 1 100%;
      flex: 1 1 100%;
  -ms-flex-order: 2;
      order: 2; }

@media screen and (min-width: 664px) {
  .plyr--mini {
    margin-left: auto; } }

/* Hide class for plyr */
.js-plyr-hidden.js-plyr-hidden.js-plyr-hidden {
  display: none; }

.plyr__tooltip {
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15); }

/* Variables */
/* Main white body background (as per new design) */
.view-podcasts {
  background: white; }

/* Slider */
.slick-wrapper {
  padding: 8px 0;
  margin: 0 -8px; }
  @media screen and (min-width: 664px) {
    .slick-wrapper {
      padding: 12px 0;
      margin: 0 -12px; } }
  @media screen and (min-width: 988px) {
    .slick-wrapper {
      padding: 19px 0;
      margin: 0 -19px; } }

.slick-arrow {
  position: absolute;
  z-index: 2;
  top: 0;
  bottom: 75%;
  background: rgba(0, 53, 118, 0.75);
  border: none;
  padding: 0;
  color: white;
  width: 56px;
  text-indent: -9999px;
  overflow: hidden;
  transition: all 200ms ease-in-out; }
  @media screen and (min-width: 1392px) {
    .slick-arrow {
      bottom: 0; } }
  .slick-arrow:hover, .slick-arrow:focus {
    background: #003576; }
  .slick-arrow:before, .slick-arrow:after {
    position: absolute;
    top: calc(50% - 3px);
    display: block;
    content: " ";
    width: 32px;
    height: 6px;
    border-radius: 3px;
    background: white;
    transform-origin: 100% 50%; }
  .slick-arrow:before {
    transform: rotate(45deg) translateY(2px); }
  .slick-arrow:after {
    transform: rotate(-45deg) translateY(-2px); }
  .slick-arrow.slick-disabled {
    opacity: 0;
    pointer-events: none; }

/* Previous arrow */
.slick-prev {
  left: 12px; }
  @media screen and (min-width: 988px) {
    .slick-prev {
      left: 19px; } }
  @media screen and (min-width: 1392px) {
    .slick-prev {
      left: calc(-56px + 11px); } }
  .slick-prev:before, .slick-prev:after {
    right: calc(50% - 18px);
    transform-origin: 0 50%; }
  .slick-prev:before {
    transform: rotate(-45deg) translateY(2px); }
  .slick-prev:after {
    transform: rotate(45deg) translateY(-2px); }

/* Next arrow */
.slick-next {
  right: 12px; }
  @media screen and (min-width: 988px) {
    .slick-next {
      right: 19px; } }
  @media screen and (min-width: 1392px) {
    .slick-next {
      right: calc(-56px + 11px); } }
  .slick-next:before, .slick-next:after {
    left: calc(50% - 18px);
    transform-origin: 100% 50%; }
  .slick-next:before {
    transform: rotate(45deg) translateY(2px); }
  .slick-next:after {
    transform: rotate(-45deg) translateY(-2px); }

/* Flexbox for slider to stretch items */
.slick-track {
  margin-left: 0;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: stretch;
      align-items: stretch; }
  .slick-track:before, .slick-track:after {
    display: none; }

.slick-slide {
  -ms-flex: 1 1 auto;
      flex: 1 1 auto;
  float: none;
  height: auto; }

/* Lane container */
.lane-container {
  overflow: hidden;
  margin-bottom: 15px; }
  @media screen and (min-width: 1392px) {
    .lane-container {
      overflow: visible;
      margin-bottom: 30px; } }
  .lane-container > .container {
    padding: 0; }

/* Responsive lane blocks */
/* This is basically overriding the `responsive-item` + `.responsive-item--square` styling, best to refactor when those blocks are not being used anymore */
.podcast-lane-item {
  margin: 0 8px;
  padding: 0;
  border: none;
  display: block;
  width: auto;
  background: transparent;
  /* Restyled favorite buttons */ }
  @media screen and (min-width: 664px) {
    .podcast-lane-item {
      background: #f1f4f7;
      margin: 0 12px; } }
  @media screen and (min-width: 988px) {
    .podcast-lane-item {
      margin: 0 19px; } }
  .podcast-lane-item .responsive-item__image {
    display: block;
    width: 100%; }
  .podcast-lane-item .responsive-item__body {
    display: block;
    padding: 0;
    background: transparent; }
  .podcast-lane-item .responsive-item__content {
    padding: 8px 0 0;
    min-height: 0;
    background: transparent;
    font-size: 14px;
    line-height: 1.47em; }
    @media screen and (min-width: 664px) {
      .podcast-lane-item .responsive-item__content {
        padding: 24px;
        padding-right: 32px;
        font-size: 16px; } }
    @media screen and (min-width: 768px) {
      .podcast-lane-item .responsive-item__content {
        font-size: 17px; } }
  .podcast-lane-item .favorite-button {
    top: 0;
    right: 0; }
    @media screen and (min-width: 664px) {
      .podcast-lane-item .favorite-button {
        top: auto;
        right: 5px;
        bottom: calc(2em - 20px); } }
    .podcast-lane-item .favorite-button:focus, .podcast-lane-item .favorite-button:hover {
      background: transparent;
      color: inherit; }
    .podcast-lane-item .favorite-button .favorite-button__closed,
    .podcast-lane-item .favorite-button .favorite-button__open {
      font-size: 21px; }
    .podcast-lane-item .favorite-button .favorite-button__open {
      z-index: 2; }
  .podcast-lane-item .favorite-button__closed {
    display: block;
    z-index: 1;
    color: white; }
  .podcast-lane-item .favorite-button__open {
    display: block;
    z-index: 2; }
  .podcast-lane-item .favorite-button.is-favorite .favorite-button__closed {
    color: #003576; }
  .podcast-lane-item .favorite-button.is-favorite .favorite-button__open {
    display: block;
    color: white; }

/* Highlighted container */
.container--highlighted {
  /* Slider arrows white instead of primary color */ }
  .container--highlighted .podcast-lane-item {
    color: white; }
    @media screen and (min-width: 664px) {
      .container--highlighted .podcast-lane-item {
        background: white;
        color: #003576; } }
  .container--highlighted .responsive-item__body {
    color: white; }
    @media screen and (min-width: 664px) {
      .container--highlighted .responsive-item__body {
        color: #003576; } }
  .container--highlighted .slick-arrow {
    background: rgba(255, 255, 255, 0.75);
    color: black; }
    .container--highlighted .slick-arrow:before, .container--highlighted .slick-arrow:after {
      background: #003576; }
    .container--highlighted .slick-arrow:hover, .container--highlighted .slick-arrow:focus {
      background: white; }

/* When slick is intialized show items and flexbox the whole shabang */
[data-slick],
.js-podcasts-favorites {
  height: 0;
  overflow: hidden; }

.slick-initialized {
  height: auto;
  overflow: visible; }
  .slick-initialized .slick-slide {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column;
    -ms-flex-align: stretch;
        align-items: stretch; }
    .slick-initialized .slick-slide .responsive-item {
      display: -ms-flexbox;
      display: flex;
      -ms-flex-direction: column;
          flex-direction: column;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto; }
    .slick-initialized .slick-slide .responsive-item__body {
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
      display: -ms-flexbox;
      display: flex;
      -ms-flex-align: start;
          align-items: flex-start;
      min-height: 4em; }
      @media screen and (min-width: 664px) {
        .slick-initialized .slick-slide .responsive-item__body {
          -ms-flex-align: center;
              align-items: center; } }
    .slick-initialized .slick-slide .responsive-item__content {
      padding-top: 8px;
      padding-bottom: 8px; }

/* Video item lane */
.podcast-video-item {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap; }
  @media screen and (min-width: 664px) {
    .podcast-video-item {
      -ms-flex-wrap: nowrap;
          flex-wrap: nowrap; } }

.podcast-video-item__content,
.podcast-video-item__video {
  -ms-flex: 1 1 100%;
      flex: 1 1 100%; }
  @media screen and (min-width: 664px) {
    .podcast-video-item__content,
    .podcast-video-item__video {
      -ms-flex-preferred-size: 50%;
          flex-basis: 50%; } }

.podcast-video-item__content {
  margin-bottom: 1em; }
  .podcast-video-item__content p:first-of-type {
    font-weight: 700;
    color: #003576; }
  @media screen and (min-width: 664px) {
    .podcast-video-item__content {
      padding-right: 12px;
      margin-bottom: 0; } }
  @media screen and (min-width: 988px) {
    .podcast-video-item__content {
      padding-right: 19px; } }

@media screen and (min-width: 664px) {
  .podcast-video-item__video {
    padding-left: 12px; } }

@media screen and (min-width: 988px) {
  .podcast-video-item__video {
    padding-left: 19px; } }

/* Utilities */
.overflow-hidden {
  overflow: hidden; }

.section {
  padding-top: 24px;
  margin-bottom: 24px; }

.section--blue-light {
  background: #f1f4f7; }

/* Presenters */
.presenters .column-list__item {
  margin-bottom: 15px; }

.presenter .flag-object {
  position: relative;
  background: white;
  border-radius: 4px;
  transition: all 0.2s cubic-bezier(0.195, 0.4, 0.45, 0.785); }
  .presenter .flag-object:hover {
    background: #d5dee8; }

.presenter .image-placeholder-1-1 {
  width: 51px;
  border-radius: 4px 0 0 4px; }

.presenter a {
  font-weight: 700;
  color: #003576;
  text-decoration: none; }

.presenter .flag-object__aside {
  padding-right: 1em; }

.presenter-avatar {
  float: left;
  margin: 0 30px 15px 0;
  vertical-align: middle; }

/* Programma */
.programma {
  display: block;
  background: white;
  position: relative;
  color: #003576;
  font-weight: 700;
  border: 1px solid white;
  margin-bottom: 15px;
  padding: 5px;
  border-radius: 4px;
  text-decoration: none;
  transition: all 0.2s cubic-bezier(0.195, 0.4, 0.45, 0.785); }
  .programma:hover, .programma:focus {
    outline: none;
    border-color: #003576; }
  .programma:active {
    outline: 1px dotted #003576; }
  .programma .programma__content {
    display: block;
    color: inherit;
    text-decoration: none;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    padding-right: 34px; }
  .programma .programma__logos,
  .programma .programma__logo {
    position: relative; }
  .programma .programma__logo {
    top: 9px; }
    .programma .programma__logo.logo-pown {
      top: 11px !important; }
  .programma .programma__logos .programma__logo {
    top: 0; }

/* Position items on programma page */
.column-list__item {
  position: relative; }
  .column-list__item .programma__logos,
  .column-list__item .programma__logo {
    position: absolute;
    top: 9px; }

@keyframes pulse {
  0% {
    opacity: 1; }
  35% {
    opacity: 1; }
  50% {
    opacity: 0; }
  85% {
    opacity: 0; }
  100% {
    opacity: 1; } }

.programma__logos,
.programma__logo {
  margin: 0 5px; }

.programma__logos {
  display: inline-block;
  vertical-align: middle;
  position: relative;
  width: 36px;
  height: 20px; }
  .programma__logos .programma__logo {
    display: inline-block;
    margin: 0;
    position: absolute;
    top: 0;
    left: 0;
    background-color: white;
    will-change: opacity; }
    .programma__logos .programma__logo:last-child {
      opacity: 1;
      animation-name: pulse;
      animation-duration: 10s;
      animation-iteration-count: infinite; }

.programma__favorite {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 15px;
  z-index: 2;
  width: 39px;
  border-radius: 0 4px 4px 0;
  color: #003576;
  height: auto; }
  .programma__favorite:focus, .programma__favorite:hover {
    background: #003576;
    color: white; }
  .programma__favorite .favorite-button__closed,
  .programma__favorite .favorite-button__open {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 1em;
    height: 1em;
    font-size: 1em;
    margin-top: -0.5em;
    margin-left: -0.5em; }

.programma__name {
  display: inline;
  vertical-align: top;
  padding-left: 50px; }

.column-list--archived .programma__logo {
  filter: grayscale(100%); }

.column-list--archived .programma__name {
  color: #222222; }

.progress-container {
  width: 100%;
  display: table;
  margin-top: 10px;
  margin-bottom: 15px; }
  .progress-container:last-child {
    margin-bottom: 0; }

.progress-container__visual,
.progress-container__textual {
  display: table-cell;
  vertical-align: middle; }

.progress-container__visual {
  height: 18px;
  width: 100%;
  background: white;
  position: relative; }

.progress-container__progress {
  background: #00b9e6;
  position: absolute;
  height: 100%;
  top: 0; }

.progress-container__textual {
  color: #00b9e6;
  font-weight: 700;
  padding-left: 1em;
  line-height: 18px; }

.styled__radio:not(:checked),
.styled__radio:checked {
  display: none; }
  .styled__radio:not(:checked):checked ~ .styled__radio__label:after,
  .styled__radio:checked:checked ~ .styled__radio__label:after {
    transform: scale(1);
    opacity: 1; }

form .styled__radio__label {
  display: block;
  color: inherit;
  margin-left: 40px;
  position: relative;
  padding: .2em .4em; }
  form .styled__radio__label:before, form .styled__radio__label:after {
    position: absolute;
    top: 50%;
    display: block;
    content: " ";
    border-radius: 50%; }
  form .styled__radio__label:before {
    left: -40px;
    margin-top: -12px;
    background: white;
    width: 24px;
    height: 24px;
    box-shadow: 0 0 1px rgba(0, 0, 0, 0.45); }
  form .styled__radio__label:after {
    background: #00b9e6;
    transition: all 0.2s cubic-bezier(0.195, 0.4, 0.45, 0.785);
    position: absolute;
    top: 50%;
    left: -36px;
    margin-top: -8px;
    display: block;
    content: " ";
    background: #00b9e6;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    transform: scale(0);
    opacity: 0;
    transition: all 0.2s ease-in; }
  form .styled__radio__label--voted {
    margin-left: 0; }
    form .styled__radio__label--voted:before {
      display: none; }
  form .styled__radio__label--white {
    background: white;
    box-shadow: 0 0 1px rgba(0, 0, 0, 0.45); }

.styled__radio__label__title,
.styled__radio__label__subtitle,
.styled__radio__label__amount {
  display: block; }

/* Readmore buttons */
.readmore-right,
.buttons-right {
  text-align: right;
  margin-top: 15px; }

.readmore-right svg {
  display: inline-block;
  width: 16px;
  height: 16px;
  margin-left: 5px;
  vertical-align: middle; }

.result-list {
  margin: 0;
  padding: 0;
  list-style: none;
  border: none;
  background: transparent; }
  .result-list li {
    position: relative;
    padding: 10px;
    margin: 0 -10px;
    color: #003576;
    transition: all 0.2s cubic-bezier(0.195, 0.4, 0.45, 0.785); }
    .result-list li:hover {
      background: #d5dee8; }
    @media screen and (min-width: 664px) {
      .result-list li {
        padding: 2.5477707006%;
        margin: 0 -2.5477707006%; } }

/**
 * BASICS
 * main component code (required)
 */
/* Container used for styling the custom select, the buttom class below adds the
 * bg gradient, corners, etc. */
.custom-select {
  position: relative;
  display: block; }

/* This is the native select, we're making everything but the text invisible so
 * we can see the button styles in the wrapper */
.custom-select select {
  width: 100%;
  margin: 0;
  outline: none;
  padding: .6em .8em .5em .8em;
  /* Prefixed box-sizing rules necessary for older browsers */
  box-sizing: border-box;
  /* Font size must be 16px to prevent iOS page zoom on focus */
  font-size: 16px; }

/* Custom arrow sits on top of the select - could be an image, SVG, icon font,
 * etc. or the arrow could just baked into the bg image on the select. */
.custom-select::after {
  content: " ";
  position: absolute;
  top: 50%;
  right: 1em;
  z-index: 2;
  /* These hacks make the select behind the arrow clickable in some browsers */
  pointer-events: none;
  display: none; }

/* Firefox <= 34 has a false positive on @supports( -moz-appearance: none )
 * @supports ( mask-type: alpha ) is Firefox 35+
 */
@supports (appearance: none) or (-moz-appearance: none) and (mask-type: alpha) {
  /* Show custom arrow */
  .custom-select::after {
    display: block; }
  /* Remove select styling */
  .custom-select select {
    padding-right: 2em;
    /* Match-01 */
    /* inside @supports so that iOS <= 8 display the native arrow */
    background: none;
    /* Match-04 */
    /* inside @supports so that Android <= 4.3 display the native arrow */
    border: 1px solid transparent;
    /* Match-05 */
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none; }
  .custom-select select:focus {
    border-color: #aaa;
    /* Match-03 */ } }

/**
 *  ARROW
 * adds a CSS triangle arrow to the wrapper element. Don’t include this file and style .custom-select::after yourself to customize your own arrow. Could use a background image bitmap, SVG, icon font content, etc.
 */
.custom-select::after {
  width: 0;
  height: 0;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 7px solid #666;
  margin-top: -3px; }

/**
 * B-grade support
 * expanded B-Grade browser support
 */
/* Adds Firefox < 35 support */
/* FIREFOX won't let us hide the native select arrow, so we have to make it wider than needed and clip it via overflow on the parent container. The percentage width is a fallback since FF 4+ supports calc() so we can just add a fixed amount of extra width to push the native arrow out of view. We're applying this hack across all FF versions because all the previous hacks were too fragile and complex. You might want to consider not using this hack and using the native select arrow in FF. Note this makes the menus wider than the select button because they display at the specified width and aren't clipped. Targeting hack via http://browserhacks.com/#hack-758bff81c5c32351b02e10480b5ed48e */
/* Show only the native arrow */
@-moz-document url-prefix() {
  /* Warning: this kills the focus outline style */
  .custom-select {
    overflow: hidden; }
  .custom-select::after {
    display: block; }
  /* Make the native select extra wide so the arrow is clipped. 1.5em seems to be enough to safely clip it */
  .custom-select select {
    overflow: -moz-hidden-unscrollable;
    padding-right: .4em;
    background: none;
    /* Match-04 */
    border: 1px solid transparent;
    /* Match-05 */
    /* Firefox < 4 */
    min-width: 6em;
    width: 130%;
    /* Firefox 4-15 */
    min-width: -moz-calc(0em);
    width: -moz-calc(100% + 2.4em);
    /* Firefox 16+ */
    min-width: calc(0em);
    width: calc(100% + 2.4em); }
  /* Firefox 35+ that supports hiding the native select can have a proper 100% width, no need for the overflow clip trick */
  @supports (mask-type: alpha) {
    .custom-select {
      overflow: visible; }
    .custom-select select {
      -moz-appearance: none;
      width: 100%;
      padding-right: 2em;
      /* Match-01 padding-right */ } } }

/* Firefox focus has odd artifacts around the text, this kills that. See https://developer.mozilla.org/en-US/docs/Web/CSS/:-moz-focusring */
.custom-select select:-moz-focusring {
  color: transparent;
  text-shadow: 0 0 0 #000; }

/* IE 10/11+ - This hides native dropdown button arrow so it will have the custom appearance. Targeting media query hack via http://browserhacks.com/#hack-28f493d247a12ab654f6c3637f6978d5 - looking for better ways to achieve this targeting */
/* The second rule removes the odd blue bg color behind the text in the select button in IE 10/11 and sets the text color to match the focus style's - fix via http://stackoverflow.com/questions/17553300/change-ie-background-color-on-unopened-focused-select-box */
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
  .custom-select select::-ms-expand {
    display: none; }
  .custom-select select:focus {
    border-color: #aaa;
    /* Match-03 */ }
  .custom-select select:focus::-ms-value {
    background: transparent;
    color: #222;
    /* Match-02*/ }
  .custom-select select {
    padding-right: 2em;
    /* Match-01 */
    background: none;
    /* Match-04 */
    border: 1px solid transparent;
    /* Match-05 */ }
  .custom-select::after {
    display: block; } }

/**
 * CUSTOM THEME
 */
/* These are the "theme" styles for our button applied via separate button class, style as you like */
/* Set the background fallback to solid #fff so Firefox renders the <option> list readably. */
.custom-select {
  border: 1px solid #bbb;
  border-radius: .3em;
  box-shadow: 0 1px 0 1px rgba(0, 0, 0, 0.04); }

.custom-select select {
  /* General select styles: change as needed */
  font-family: sans-serif;
  font-weight: 700;
  color: #444;
  line-height: 1.3;
  border-radius: .2em; }

/* Hover style */
.custom-select:hover {
  border-color: #888; }

/* Focus style */
.custom-select select:focus {
  /* It'd be nice to use -webkit-focus-ring-color here but it doesn't work on box-shadow */
  box-shadow: 0 0 1px 3px rgba(59, 153, 252, 0.7);
  box-shadow: 0 0 0 3px -moz-mac-focusring;
  color: #222;
  /* Match-02 */ }

@supports (box-shadow: none) {
  .custom-select select:focus {
    outline: none; } }

/* Set options to normal weight */
.custom-select option {
  font-weight: normal; }

/* Navigation lists on the side */
.navigation-list,
.thema-list {
  font-family: "npo-sans", "Calibri", "Gill Sans", "Trebuchet MS", Arial, sans-serif;
  margin: 0;
  padding: 0;
  list-style: none;
  border: none;
  background: transparent;
  transition: all 0.2s cubic-bezier(0.195, 0.4, 0.45, 0.785); }
  .navigation-list:before, .navigation-list:after,
  .thema-list:before,
  .thema-list:after {
    display: table;
    content: " "; }
  .navigation-list:after,
  .thema-list:after {
    clear: both; }
  @media (min-width: 664px) and (min-height: 0) {
    .flexbox .navigation-list,
    .flexboxlegacy .navigation-list, .flexbox
    .thema-list,
    .flexboxlegacy
    .thema-list {
      display: -ms-flexbox;
      display: flex;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap; } }
  @media screen and (min-width: 664px) {
    .navigation-list,
    .thema-list {
      margin-left: 0;
      margin-right: 0;
      margin-bottom: 1.5em; }
      .navigation-list:last-child,
      .thema-list:last-child {
        margin-bottom: 0; } }
  .navigation-list li,
  .thema-list li {
    position: relative;
    /**
     * Float items next to each other when there's space
     */
    /**
     * Unfloat on desktop since nav-list sits in sidebar
     */
    /**
     * On hover
     */
    /**
     * Active items
     */ }
    @media screen and (min-width: 664px) {
      .navigation-list li,
      .thema-list li {
        float: left;
        width: 50%; } }
  @media screen and (min-width: 664px) and (min-width: 664px) and (min-height: 0) {
    .flexbox .navigation-list li,
    .flexboxlegacy .navigation-list li, .flexbox
    .thema-list li,
    .flexboxlegacy
    .thema-list li {
      -ms-flex: 1 1 auto;
          flex: 1 1 auto; } }
    @media screen and (min-width: 768px) {
      .navigation-list li,
      .thema-list li {
        float: left;
        width: 33.333333333%; } }
    @media screen and (min-width: 988px) {
      .navigation-list li,
      .thema-list li {
        float: none;
        width: 100%; } }
    .navigation-list li:hover:focus a, .navigation-list li:hover:hover a,
    .thema-list li:hover:focus a,
    .thema-list li:hover:hover a {
      transform: scale(1); }
    .navigation-list li.active a,
    .thema-list li.active a {
      color: white;
      transform: scale(1); }
  .navigation-list a,
  .thema-list a {
    display: block;
    font-weight: 700;
    text-decoration: none;
    padding: 8px 12px;
    transition: all 0.2s cubic-bezier(0.195, 0.4, 0.45, 0.785); }
    @media screen and (min-width: 1260px) {
      .navigation-list a,
      .thema-list a {
        font-size: 22px;
        line-height: 32px; } }
  .navigation-list:hover a,
  .thema-list:hover a {
    transform: scale(0.85); }

/* The navigation list */
@media screen and (min-width: 664px) {
  .navigation-list {
    border-radius: 4px;
    overflow: hidden; } }

.navigation-list li {
  background: #003576;
  margin-bottom: 1px;
  /**
     * Only child
     */
  /**
     * First child is always 100%
     */
  /**
     * Add vertical 1px spacing between beta and delta breakpoints to separate floats
     */
  /**
     * Uneven children
     *
     * If there are an uneven amount of children we want the last item to be 100% of width, no margin-right, and have the border-radius to the bottom
     */ }
  .navigation-list li:only-child {
    margin: 0; }
  .navigation-list li:first-child {
    width: 100%; }
  @media screen and (min-width: 664px) {
    .navigation-list li:nth-child(even):not(:first-child) {
      border-right: 1px solid white; } }
  @media screen and (min-width: 768px) {
    .navigation-list li:nth-child(n):not(:first-child) {
      border-right: 1px solid white; }
    .navigation-list li:nth-child(3n+4):not(:first-child) {
      border-right: none; } }
  @media screen and (min-width: 988px) {
    .navigation-list li:nth-child(n):not(:first-child) {
      border-right: none; } }
  .navigation-list li:nth-child(odd):last-child:not(:only-child) {
    border-right: none; }

.navigation-list a {
  color: #b2edf9;
  transform-origin: 0 50%; }

.navigation-list .navigation-list__inline {
  margin-bottom: 0;
  background: transparent; }

.navigation-list svg {
  vertical-align: middle; }

.navigation-list--accent li {
  background: #00b9e6; }

.navigation-list--accent a {
  color: white; }

.navigation-list--center a {
  text-align: center;
  transform-origin: 50% 50%; }

.navigation-list--toggle.is-toggled li:not(:first-child) {
  display: none; }
  @media screen and (min-width: 988px) {
    .navigation-list--toggle.is-toggled li:not(:first-child) {
      display: block; } }

.navigation-list--toggle.is-toggled li.is-visible {
  display: block; }

.navigation-list--toggle.is-toggled + .sidebar-navigation__social {
  display: none; }
  @media screen and (min-width: 988px) {
    .navigation-list--toggle.is-toggled + .sidebar-navigation__social {
      display: block; } }

/**
 * Remove border radius on second-to-last item when list has a social bottom
 */
.sidebar-navigation--with-social .navigation-list {
  margin-bottom: 0;
  border-radius: 4px 4px 0 0; }

.sidebar-navigation__social {
  margin: 0;
  padding: 0;
  list-style: none;
  border: none;
  background: transparent;
  /**
   * Doing this manually on even items to make sure the width border lines up with the above item
   */ }
  .sidebar-navigation__social:before, .sidebar-navigation__social:after {
    display: table;
    content: " "; }
  .sidebar-navigation__social:after {
    clear: both; }
  @media (min-width: 0) and (min-height: 0) {
    .flexbox .sidebar-navigation__social,
    .flexboxlegacy .sidebar-navigation__social {
      display: -ms-flexbox;
      display: flex; } }
  @media screen and (min-width: 664px) {
    .sidebar-navigation__social {
      margin-left: 0;
      margin-right: 0; } }
  .sidebar-navigation__social li {
    float: left;
    width: auto;
    margin: 0;
    text-align: center;
    background: #d5dee8;
    transition: all 0.2s cubic-bezier(0.195, 0.4, 0.45, 0.785); }
    .sidebar-navigation__social li:nth-child(n) {
      border-radius: 0;
      border-right: 1px solid white; }
    @media screen and (min-width: 664px) {
      .sidebar-navigation__social li:first-child {
        border-radius: 0 0 0 4px; }
      .sidebar-navigation__social li:last-child {
        border-right: none;
        border-radius: 0 0 4px 0; } }
    @media (min-width: 0) and (min-height: 0) {
      .flexbox .sidebar-navigation__social li,
      .flexboxlegacy .sidebar-navigation__social li {
        -ms-flex: 1 1 auto;
            flex: 1 1 auto; } }
    .sidebar-navigation__social li:focus, .sidebar-navigation__social li:hover {
      background: white; }
  .sidebar-navigation__social a {
    display: block;
    font-weight: 700;
    text-decoration: none;
    padding: 12px;
    height: 48px;
    color: #003576;
    font-size: 20px;
    transition: all 0.2s cubic-bezier(0.195, 0.4, 0.45, 0.785); }
    .sidebar-navigation__social a:nth-child(n) {
      transform: scale(1); }
  .sidebar-navigation__social li:nth-last-child(2):first-child,
  .sidebar-navigation__social li:nth-last-child(2):first-child ~ li {
    width: 50%; }
  .sidebar-navigation__social li:nth-last-child(3):first-child,
  .sidebar-navigation__social li:nth-last-child(3):first-child ~ li {
    width: 33.3333333333%; }
  .sidebar-navigation__social li:nth-last-child(4):first-child,
  .sidebar-navigation__social li:nth-last-child(4):first-child ~ li {
    width: 25%; }
  .sidebar-navigation__social li:nth-last-child(5):first-child,
  .sidebar-navigation__social li:nth-last-child(5):first-child ~ li {
    width: 20%; }
  .sidebar-navigation__social li:nth-last-child(6):first-child,
  .sidebar-navigation__social li:nth-last-child(6):first-child ~ li {
    width: 16.6666666667%; }

.navigation-list__toggle {
  display: table; }
  .navigation-list__toggle a {
    width: auto; }

.navigation-list__toggle,
.navigation-list__programme,
.navigation-list__fav {
  display: table-cell; }

.navigation-list__toggle,
.navigation-list__fav {
  width: 1%;
  white-space: nowrap;
  vertical-align: middle; }

.navigation-list__toggle {
  border-right: 1px solid white; }
  @media screen and (min-width: 664px) {
    .navigation-list__toggle {
      border-radius: 4px 0 0 0; } }
  @media screen and (min-width: 988px) {
    .navigation-list__toggle {
      display: none; } }

.navigation-list.is-toggled .navigation-list__toggle svg {
  transform: rotate(-90deg); }

.navigation-list__fav {
  border-left: 1px solid white; }
  @media screen and (min-width: 664px) {
    .navigation-list__fav {
      border-radius: 0 4px 0 0; } }

/* The thema list */
.thema-list {
  border-top: 1px solid #ccc; }
  @media screen and (min-width: 988px) {
    .thema-list {
      border-top: none; } }
  .thema-list li {
    border-bottom: 1px solid #ccc;
    /**
     * Add vertical 1px spacing between beta and delta breakpoints to separate floats
     */
    /**
     * Last child
     *
     * 1. No bottom border for last child
     */ }
    @media screen and (min-width: 664px) {
      .thema-list li:nth-child(odd) {
        border-right: 1px solid #ccc; } }
    @media screen and (min-width: 988px) {
      .thema-list li:nth-child(odd) {
        border-right: none; } }
    .thema-list li:last-child {
      border-right: none; }
      @media screen and (min-width: 988px) {
        .thema-list li:last-child {
          border-bottom: none; } }
  .thema-list a {
    color: #003576;
    padding-left: 12px;
    transform-origin: 0 50%; }
  .thema-list ul {
    margin: 0;
    list-style: none;
    border: none;
    background: transparent;
    border-top: 1px solid #ccc;
    padding: 8px 0 8px 1em; }
    @media screen and (min-width: 664px) and (max-width: 988px) {
      .thema-list ul {
        display: none; } }
  .thema-list li li {
    border-bottom: none; }
    .thema-list li li a {
      font-size: 1em;
      padding-top: 0;
      padding-bottom: 0; }
      .thema-list li li a:hover, .thema-list li li a:focus {
        color: #00b9e6; }

/**
 * Skip to content link
 *
 * 1. Hide by default
 * 2. Display on focus
 */
.skip {
  position: relative;
  z-index: 33; }
  .skip a {
    display: inline-block;
    padding: 0 24px;
    color: white;
    position: absolute;
    top: 0;
    left: -9999em;
    /* 1 */
    z-index: 9;
    background: #003576; }
    .skip a:focus {
      margin: 7px;
      height: 36px;
      width: 50%;
      line-height: 34px;
      left: 0;
      /* 2 */
      text-align: center; }

/* Styled ul, with large colored circles */
.styled-ul {
  padding: 0;
  list-style: none;
  border: none;
  background: transparent;
  margin-bottom: 30px; }
  .styled-ul:last-child {
    margin-bottom: 0; }
  .styled-ul li {
    position: relative;
    margin: 0;
    padding: 0 0 0 30px; }
    .styled-ul li:before {
      position: absolute;
      top: 8px;
      left: 0;
      content: ' ';
      display: block;
      width: 12px;
      height: 12px;
      border-radius: 50%;
      background: #003576; }

.tabs__navigation {
  display: none; }

.js .tabs__navigation {
  display: table;
  width: 100%; }

.js .tabs__item.is-hidden {
  display: none; }

/**
 * Top right on desktop, top on mobile
 *
 * Position blocks on top on mobile view, but position them on the top right on larger displays
 */
.top-right-desktop {
  margin-bottom: 10px; }
  .top-right-desktop:before, .top-right-desktop:after {
    display: table;
    content: " "; }
  .top-right-desktop:after {
    clear: both; }
  @media screen and (min-width: 664px) {
    .top-right-desktop {
      margin-bottom: 19px; } }
  @media screen and (min-width: 768px) {
    .top-right-desktop {
      margin-bottom: 28px; } }
  @media screen and (min-width: 988px) {
    .top-right-desktop {
      width: 31.7073170732%;
      float: right;
      margin-right: 0;
      margin-bottom: 2.4390243902%; } }

@media screen and (min-width: 988px) {
  .top-right-desktop--offset {
    margin-top: 46px; } }

.zender {
  padding: 15px;
  margin-bottom: 10px; }
  @media screen and (min-width: 664px) {
    .zender {
      margin-bottom: 2.4390243902%; } }
  @media screen and (min-width: 1260px) {
    .zender {
      padding: 30px; } }

.zender__name,
.zender__url {
  display: block; }

.zender__name__logo,
.zender__name__content {
  display: inline-block;
  vertical-align: middle; }

.zender__name__logo {
  margin-right: 5px; }

@media screen and (min-width: 1260px) {
  .zender__name__content {
    font-size: 25px;
    line-height: 31px; } }

.zender__url a {
  color: inherit; }

/* Article styling */
.article {
  padding-bottom: 10px; }
  .article:before, .article:after {
    display: table;
    content: " "; }
  .article:after {
    clear: both; }
  @media screen and (min-width: 664px) {
    .article {
      padding-bottom: 3.7037037037%; } }
  .article .content-wrapper {
    padding: 10px 15px 15px; }
    @media screen and (min-width: 664px) {
      .article .content-wrapper {
        padding: 2.4390243902%; } }

.intro {
  font-weight: 700;
  color: #003576; }

/*
 * FAQ
 */
.faq__items {
  margin-bottom: 30px; }

.faq__content {
  background: white;
  padding: 10px; }
  @media screen and (min-width: 664px) {
    .faq__content {
      padding: 2.4390243902%; } }

.faq-wrapper {
  max-width: 800px;
  margin-left: auto;
  margin-right: auto; }

.faq__item {
  border-radius: 4px;
  padding: 8px 30px;
  margin-bottom: 5px;
  color: #003576;
  transition: all 0.2s cubic-bezier(0.195, 0.4, 0.45, 0.785); }
  .faq__item.is-active {
    background: #d5dee8; }
    .faq__item.is-active svg {
      transform: rotate(90deg); }

.faq__item__title {
  margin: 0;
  padding: 0;
  list-style: none;
  border: none;
  background: transparent;
  font-weight: 700;
  cursor: pointer;
  transition: all 0.2s cubic-bezier(0.195, 0.4, 0.45, 0.785); }
  .faq__item__title svg {
    width: 12px;
    height: 12px;
    fill: #003576;
    transition: all 0.2s cubic-bezier(0.195, 0.4, 0.45, 0.785); }
  .faq__item__title:hover, .faq__item__title:focus {
    color: #00b9e6; }
    .faq__item__title:hover svg, .faq__item__title:focus svg {
      fill: #00b9e6; }

.faq__item__content {
  padding-top: 5px;
  padding-bottom: 5px; }
  .js .faq__item__content {
    display: none; }
  .html.js .faq__item__content.is-closed {
    display: block; }
  .faq__item__content a {
    color: inherit; }

/* Footer */
.footer {
  clear: both;
  position: relative;
  overflow: hidden;
  z-index: 1;
  padding-top: 30px;
  background: white;
  color: #002964;
  box-shadow: 0 -2px 25px -5px rgba(0, 0, 0, 0.25);
  font-size: 16px; }
  .footer .module__header {
    margin-bottom: 5px; }
  .footer a {
    color: inherit;
    text-decoration: none; }
    .footer a:hover, .footer a:focus {
      text-decoration: underline; }
  .footer ul {
    margin: 0;
    padding: 0;
    list-style: none;
    border: none;
    background: transparent; }
    .footer ul:before, .footer ul:after {
      display: table;
      content: " "; }
    .footer ul:after {
      clear: both; }
  .footer li {
    margin: 0;
    float: left;
    width: 50%; }
    @media screen and (min-width: 372px) and (max-width: 560px) {
      .footer li {
        float: none;
        width: 100%; } }
    @media screen and (min-width: 768px) {
      .footer li {
        float: none;
        width: 100%; } }
  .footer .module {
    margin-bottom: 30px; }
    .footer .module:last-child {
      margin-bottom: 0; }
    @media screen and (min-width: 372px) {
      .footer .module {
        float: left;
        display: block;
        margin-right: 3.7037037037%;
        width: 48.1481481481%; }
        .footer .module:nth-child(n+1) {
          clear: none;
          margin-right: 3.7037037037%; }
        .footer .module:last-child {
          margin-right: 0; }
        .footer .module:nth-child(2n) {
          margin-right: 0; }
        .footer .module:nth-child(2n+1) {
          clear: left; }
        .footer .module:nth-last-child(2) {
          margin-bottom: 0; } }
    @media screen and (min-width: 768px) {
      .footer .module {
        float: left;
        display: block;
        margin-right: 2.4390243902%;
        width: 23.1707317073%; }
        .footer .module:nth-child(n+1) {
          clear: none;
          margin-right: 2.4390243902%; }
        .footer .module:last-child {
          margin-right: 0; }
        .footer .module:nth-child(4n) {
          margin-right: 0; }
        .footer .module:nth-child(4n+1) {
          clear: left; } }
    @media screen and (min-width: 988px) {
      .footer .module {
        float: left;
        display: block;
        margin-right: 3.7037037037%;
        width: 22.2222222222%;
        margin-bottom: 0; }
        .footer .module:nth-child(n+1) {
          clear: none;
          margin-right: 3.7037037037%; }
        .footer .module:last-child {
          margin-right: 0; }
        .footer .module:nth-child(4n) {
          margin-right: 0; }
        .footer .module:nth-child(4n+1) {
          clear: left; } }
  .footer .newsletter-module {
    margin-bottom: 30px; }
    @media screen and (min-width: 664px) {
      .footer .newsletter-module {
        float: left;
        display: block;
        margin-right: 3.7037037037%;
        width: 100%; }
        .footer .newsletter-module:nth-child(n+1) {
          clear: none;
          margin-right: 3.7037037037%; }
        .footer .newsletter-module:last-child {
          margin-right: 0; }
        .footer .newsletter-module:nth-child(1n) {
          margin-right: 0; }
        .footer .newsletter-module:nth-child(1n+1) {
          clear: left; } }
    @media screen and (min-width: 768px) {
      .footer .newsletter-module {
        float: left;
        display: block;
        margin-right: 2.4390243902%;
        width: 100%; }
        .footer .newsletter-module:nth-child(n+1) {
          clear: none;
          margin-right: 2.4390243902%; }
        .footer .newsletter-module:last-child {
          margin-right: 0; }
        .footer .newsletter-module:nth-child(1n) {
          margin-right: 0; }
        .footer .newsletter-module:nth-child(1n+1) {
          clear: left; } }
    @media screen and (min-width: 988px) {
      .footer .newsletter-module {
        float: left;
        display: block;
        margin-right: 2.4390243902%;
        width: 23.1707317073%; }
        .footer .newsletter-module:last-child {
          margin-right: 0; }
        .footer .newsletter-module + .footer__modules {
          float: left;
          display: block;
          margin-right: 2.4390243902%;
          width: 65.8536585366%;
          margin-left: 8.5365853659%; }
          .footer .newsletter-module + .footer__modules:last-child {
            margin-right: 0; } }

.footer__content {
  position: relative;
  z-index: 2; }

.form__body:before, .form__body:after {
  display: table;
  content: " "; }

.form__body:after {
  clear: both; }

@media screen and (min-width: 440px) {
  .form__body .form__input,
  .form__body .form__button {
    float: left;
    display: block;
    margin-right: 2.4390243902%;
    width: 48.7804878049%; }
    .form__body .form__input:last-child,
    .form__body .form__button:last-child {
      margin-right: 0; } }

@media screen and (min-width: 988px) {
  .form__body .form__input,
  .form__body .form__button {
    float: none;
    width: 100%;
    margin: 0; } }

.footer__fx {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
  -ms-flex-pack: start;
      justify-content: flex-start;
  padding: 20px 0;
  margin-top: 24px; }
  @media screen and (min-width: 664px) {
    .footer__fx {
      padding: 32px 0; } }
  @media screen and (min-width: 988px) {
    .footer__fx {
      padding: 44px 0; } }

.footer__logo {
  position: relative;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
  width: 100%;
  height: 24px; }
  @media screen and (min-width: 372px) {
    .footer__logo {
      height: 32px; } }
  @media screen and (min-width: 664px) {
    .footer__logo {
      height: 48px; } }
  .footer__logo .footer__slogan,
  .footer__logo img {
    position: relative;
    z-index: 2; }
  .footer__logo img {
    width: 36px;
    height: 24px; }
    @media screen and (min-width: 372px) {
      .footer__logo img {
        width: 48px;
        height: 32px; } }
    @media screen and (min-width: 664px) {
      .footer__logo img {
        width: 72px;
        height: 48px; } }
  .footer__logo .footer__slogan {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    padding-left: 12px;
    font-family: "aleo", "Calibri", "Gill Sans", "Trebuchet MS", Arial, sans-serif;
    font-size: 17px; }
    @media screen and (min-width: 372px) {
      .footer__logo .footer__slogan {
        font-size: 18px; } }
    @media screen and (min-width: 664px) {
      .footer__logo .footer__slogan {
        font-size: 20px; } }
    @media screen and (min-width: 988px) {
      .footer__logo .footer__slogan {
        font-size: 24px; } }

.footer__fx1,
.footer__fx2 {
  position: absolute;
  bottom: -24px;
  width: 2000px;
  height: 2000px;
  transform: rotate(-45deg);
  transform-origin: 100% 100%; }
  @media screen and (min-width: 664px) {
    .footer__fx1,
    .footer__fx2 {
      bottom: -32px; } }
  @media screen and (min-width: 988px) {
    .footer__fx1,
    .footer__fx2 {
      bottom: -44px; } }

.footer__fx1 {
  right: calc(100% - 86px);
  background: #e1e2e3; }
  @media screen and (min-width: 372px) {
    .footer__fx1 {
      right: calc(100% - 110px); } }
  @media screen and (min-width: 664px) {
    .footer__fx1 {
      right: calc(100% - 158px); } }
  @media screen and (min-width: 988px) {
    .footer__fx1 {
      right: calc(100% - 170px); } }

.footer__fx2 {
  right: calc(100% - 56px);
  background: #002964; }
  @media screen and (min-width: 372px) {
    .footer__fx2 {
      right: calc(100% - 64px); } }
  @media screen and (min-width: 664px) {
    .footer__fx2 {
      right: calc(100% - 92px); } }
  @media screen and (min-width: 988px) {
    .footer__fx2 {
      right: calc(100% - 104px); } }

.footer__border {
  position: absolute;
  top: 24px;
  left: 10px;
  right: 10px;
  height: 1px;
  background: #002964; }
  @media screen and (min-width: 664px) {
    .footer__border {
      left: 19px;
      right: 19px; } }
  @media screen and (min-width: 988px) {
    .footer__border {
      left: 28px;
      right: 28px; } }

.form-group {
  margin-bottom: 15px; }
  .form-group:before, .form-group:after {
    display: table;
    content: " "; }
  .form-group:after {
    clear: both; }
  .form-group:last-child {
    margin-bottom: 0; }
  .form-group label {
    color: #003576;
    font-weight: 700;
    margin-bottom: 10px;
    padding-top: 0;
    width: 100%;
    float: none;
    text-align: left; }
  .form-group textarea,
  .form-group input[type="tel"],
  .form-group input[type="email"],
  .form-group input[type="text"] {
    margin-bottom: 0;
    width: 100%;
    background: #f5f5f5;
    border: 1px solid #cbd0d3;
    border-radius: 4px;
    padding: 5px;
    font-size: 18px;
    line-height: 1em;
    height: auto;
    box-sizing: border-box; }
  .form-group p {
    margin-bottom: 5px; }

/* App de studio */
.npo-studio-messenger .messenger-page-header .messenger-page-title, .npo-studio-messenger .page-profile-create button[type=submit], .npo-studio-messenger .page-profile-update button[type=submit] {
  font-family: "npo-sans", "Calibri", "Gill Sans", "Trebuchet MS", Arial, sans-serif; }

.npo-studio-messenger button {
  line-height: normal; }

.frequentie-list {
  margin: 0;
  padding: 0;
  list-style: none;
  border: none;
  background: transparent; }
  .frequentie-list:before, .frequentie-list:after {
    display: table;
    content: " "; }
  .frequentie-list:after {
    clear: both; }
  .frequentie-list li {
    position: relative;
    border-top: 1px solid #e6e6e6;
    padding: 5px; }
    @media screen and (min-width: 440px) {
      .frequentie-list li {
        float: left;
        display: block;
        margin-right: 5%;
        width: 47.5%; }
        .frequentie-list li:nth-child(n+1) {
          clear: none;
          margin-right: 5%; }
        .frequentie-list li:last-child {
          margin-right: 0; }
        .frequentie-list li:nth-child(2n) {
          margin-right: 0; }
        .frequentie-list li:nth-child(2n+1) {
          clear: left; } }
    @media screen and (min-width: 768px) {
      .frequentie-list li {
        float: left;
        display: block;
        margin-right: 2.4390243902%;
        width: 31.7073170732%; }
        .frequentie-list li:nth-child(n+1) {
          clear: none;
          margin-right: 2.4390243902%; }
        .frequentie-list li:last-child {
          margin-right: 0; }
        .frequentie-list li:nth-child(3n) {
          margin-right: 0; }
        .frequentie-list li:nth-child(3n+1) {
          clear: left; } }
    @media screen and (min-width: 1144px) {
      .frequentie-list li {
        float: left;
        display: block;
        margin-right: 2.4390243902%;
        width: 23.1707317073%; }
        .frequentie-list li:nth-child(n+1) {
          clear: none;
          margin-right: 2.4390243902%; }
        .frequentie-list li:last-child {
          margin-right: 0; }
        .frequentie-list li:nth-child(4n) {
          margin-right: 0; }
        .frequentie-list li:nth-child(4n+1) {
          clear: left; } }
  .frequentie-list .frequentie-list__city,
  .frequentie-list .frequentie-list__mhz {
    display: inline-block; }
  .frequentie-list .frequentie-list__city {
    margin-right: 36px; }
  .frequentie-list .frequentie-list__mhz {
    position: absolute;
    top: 5px;
    right: 0; }

/**
 * Header
 *
 * 1. container side-spacing minus wrapper top-padding
 */
.header {
  position: relative;
  z-index: 2;
  background: #f1f4f7;
  font-family: "npo-sans", "Calibri", "Gill Sans", "Trebuchet MS", Arial, sans-serif;
  box-shadow: 0 2px 35px -5px rgba(0, 0, 0, 0.75);
  margin-bottom: 5px;
  /* 1 */ }
  @media screen and (min-width: 664px) {
    .header {
      margin-bottom: 9.5px;
      /* 1 */ } }
  @media screen and (min-width: 988px) {
    .header {
      margin-bottom: 18.5px;
      /* 1 */ } }

/**
 * Header content
 *
 * position:relative to position logo, menu, search and live buttons properly
 */
.header__content {
  position: relative; }

@media screen and (min-width: 664px) {
  .bpopup-open {
    height: auto;
    overflow: auto; } }

.bpopup-open .app-de-studio-container {
  width: 100%;
  height: 100%;
  overflow: auto; }
  @media screen and (min-width: 0) and (max-width: 663px) {
    .bpopup-open .app-de-studio-container {
      position: fixed !important;
      top: 0 !important;
      left: 0 !important; } }
  @media screen and (min-width: 664px) {
    .bpopup-open .app-de-studio-container {
      width: auto;
      height: auto;
      overflow: visible; } }

.bpopup-open .app-de-studio-content {
  width: 100%;
  height: 100%;
  overflow: auto; }
  @media screen and (min-width: 664px) {
    .bpopup-open .app-de-studio-content {
      width: auto;
      height: auto; } }

.modal-close {
  margin: 0;
  padding: 0;
  list-style: none;
  transition: all 0.2s cubic-bezier(0.195, 0.4, 0.45, 0.785);
  cursor: pointer;
  position: absolute;
  right: 10px;
  top: 10px;
  background: #e6e6e6;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  border: 1px solid #aaaaaa;
  display: none; }
  .modal-close svg {
    width: 12px;
    height: 12px;
    margin: 9px; }
  .modal-close:hover, .modal-close:focus {
    background: #aaaaaa; }
  .js .modal-close {
    display: block; }

/**
 * Navigation
 */
.navigation_container {
  position: relative;
  z-index: 1;
  background: #f1f4f7;
  /* Float right on desktop */
  /* Float items next to each other */ }
  @media screen and (min-width: 768px) {
    .navigation_container {
      -ms-flex-order: 2;
          order: 2;
      -ms-flex-positive: 1;
          flex-grow: 1;
      -ms-flex-negative: 0;
          flex-shrink: 0; }
      .navigation_container .menu {
        -ms-flex-order: 1;
            order: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
        -ms-flex-negative: 0;
            flex-shrink: 0;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-align: center;
            align-items: center; } }
  @media screen and (min-width: 988px) {
    .navigation_container {
      float: right;
      clear: right;
      background: transparent;
      margin: 20px 0;
      padding-left: 80px;
      padding-right: 220px; } }
  @media screen and (min-width: 1144px) {
    .navigation_container {
      padding-left: 140px;
      padding-right: 320px; } }
  @media screen and (min-width: 664px) {
    .navigation_container .flax-wrapper {
      display: -ms-flexbox;
      display: flex; } }
  .navigation_container.rm-initiated .responsive-wrapper {
    display: none; }
    @media screen and (min-width: 988px) {
      .navigation_container.rm-initiated .responsive-wrapper {
        display: block; } }
    .navigation_container.rm-initiated .responsive-wrapper.rm-closed {
      display: block; }
  .navigation_container ul {
    margin: 0;
    list-style: none;
    border: none;
    background: transparent;
    padding: 10px 0;
    /* Space between menu and tagline */ }
    .navigation_container ul:before, .navigation_container ul:after {
      display: table;
      content: " "; }
    .navigation_container ul:after {
      clear: both; }
    @media screen and (min-width: 664px) {
      .navigation_container ul {
        display: -ms-flexbox;
        display: flex;
        -ms-flex-positive: 1;
            flex-grow: 1; } }
    @media screen and (min-width: 988px) {
      .navigation_container ul {
        padding: 0; } }
  .navigation_container li {
    display: block;
    float: left;
    width: 50%;
    /* Don't float on very small screens, keeping it mobile-first */
    /* Don't float but put them inline instead */
    /* Hover state */ }
    @media screen and (min-width: 0) {
      .navigation_container li {
        width: 100%;
        float: none; } }
    @media screen and (min-width: 320px) {
      .navigation_container li {
        width: 50%;
        float: left; } }
    @media screen and (min-width: 440px) {
      .navigation_container li {
        width: 33%;
        text-align: center; } }
    @media screen and (min-width: 664px) {
      .navigation_container li {
        display: inline-block;
        text-align: center;
        float: none;
        width: auto;
        vertical-align: top; } }
    .navigation_container li:hover a {
      color: #00b9e6; }
    @media screen and (min-width: 988px) {
      .navigation_container li:last-child a {
        padding-right: 0; }
        .navigation_container li:last-child a:after {
          right: 0; } }
  .navigation_container a {
    display: inline-block;
    padding: 5px 10px;
    text-decoration: none;
    color: #003576;
    font-weight: 700;
    transition: all 0.2s cubic-bezier(0.195, 0.4, 0.45, 0.785); }
    @media screen and (min-width: 988px) {
      .navigation_container a {
        padding: 0 10px;
        font-size: 17px;
        line-height: 40px;
        position: relative; }
        .navigation_container a:after {
          display: block;
          position: absolute;
          content: " ";
          height: 2px;
          background: transparent;
          bottom: 7px;
          left: 10px;
          right: 10px; } }
    @media screen and (min-width: 1144px) {
      .navigation_container a {
        padding: 20px 12px;
        font-size: 20px; }
        .navigation_container a:after {
          left: 12px;
          right: 12px;
          bottom: 23px; } }
    @media screen and (min-width: 1260px) {
      .navigation_container a {
        padding: 25px 16px;
        font-size: 24px;
        line-height: 30px; }
        .navigation_container a:after {
          left: 16px;
          right: 16px;
          bottom: 21px; } }
    .navigation_container a:focus {
      color: #00b9e6;
      outline: none; }
      .navigation_container a:focus:after {
        background: #aaaaaa; }
  .navigation_container .current a,
  .navigation_container .active a {
    color: #00b9e6; }
    .navigation_container .current a:after,
    .navigation_container .active a:after {
      background: #00b9e6; }
    .navigation_container .current a:focus:after,
    .navigation_container .active a:focus:after {
      background: #003576; }

/**
 * Responsive menu animations
 *
 * 1. Default max-height to 0
 * 2. Transition on max-height to fake slideDown
 * 3. Remove max-height on desktop
 * 4. Set max-height to something larger than expanded height
      But not to large since the transition time will transition to this unit
 */
.responsive-wrapper {
  position: relative;
  /**
   * Menu items
   *
   * Transition individual menu items (only when JS is enabled)
   *
   * 1. Set default opacity to 0 when JS is enabled
   * 2. Move all items to the right with translate
   */
  /**
   * When menu is opened display and position all items
   */ }
  .responsive-wrapper:before, .responsive-wrapper:after {
    display: table;
    content: " "; }
  .responsive-wrapper:after {
    clear: both; }
  .js .responsive-wrapper {
    max-height: 0px;
    /* 1 */
    transition: max-height 0.5s cubic-bezier(0.195, 0.4, 0.45, 0.785);
    /* 2 */ }
    .js .responsive-wrapper.is-opening, .js .responsive-wrapper.rm-opened {
      display: block;
      max-height: 364px;
      /* 4 */ }
    .js .responsive-wrapper.is-closing {
      display: block;
      max-height: 0px;
      /* 1 */ }
    @media screen and (min-width: 320px) {
      .js .responsive-wrapper.rm-opened {
        max-height: 253px;
        /* 4 */ }
      .js .responsive-wrapper.is-closing {
        max-height: 0px;
        /* 1 */ } }
    @media screen and (min-width: 440px) {
      .js .responsive-wrapper.is-opening, .js .responsive-wrapper.rm-opened {
        max-height: 216px;
        /* 4 */ }
      .js .responsive-wrapper.is-closing {
        max-height: 0px;
        /* 1 */ } }
    @media screen and (min-width: 664px) {
      .js .responsive-wrapper.is-opening, .js .responsive-wrapper.rm-opened {
        max-height: 100px;
        /* 4 */ }
      .js .responsive-wrapper.is-closing {
        max-height: 0px;
        /* 1 */ } }
    @media screen and (min-width: 988px) {
      .js .responsive-wrapper {
        display: block;
        max-height: none;
        /* 3 */
        padding-right: 0px; } }
  @media screen and (min-width: 768px) {
    .responsive-wrapper {
      display: -ms-flexbox;
      display: flex; } }
  .responsive-wrapper.is-opening, .responsive-wrapper.is-closing {
    overflow: hidden; }
  .responsive-wrapper li {
    /**
     * On desktop display and position all items
     */ }
    .csstransforms .responsive-wrapper li {
      opacity: 0;
      transform: translateX(-50px);
      transition: all 0.3s cubic-bezier(0.195, 0.4, 0.45, 0.785); }
      .csstransforms .responsive-wrapper li:nth-child(2) {
        transition: all 0.35s cubic-bezier(0.195, 0.4, 0.45, 0.785); }
      .csstransforms .responsive-wrapper li:nth-child(3) {
        transition: all 0.4s cubic-bezier(0.195, 0.4, 0.45, 0.785); }
      .csstransforms .responsive-wrapper li:nth-child(4) {
        transition: all 0.45s cubic-bezier(0.195, 0.4, 0.45, 0.785); }
      .csstransforms .responsive-wrapper li:nth-child(5) {
        transition: all 0.5s cubic-bezier(0.195, 0.4, 0.45, 0.785); }
      .csstransforms .responsive-wrapper li:nth-child(6) {
        transition: all 0.55s cubic-bezier(0.195, 0.4, 0.45, 0.785); }
      .csstransforms .responsive-wrapper li:nth-child(7) {
        transition: all 0.6s cubic-bezier(0.195, 0.4, 0.45, 0.785); }
      .csstransforms .responsive-wrapper li:nth-child(8) {
        transition: all 0.65s cubic-bezier(0.195, 0.4, 0.45, 0.785); }
    @media screen and (min-width: 988px) {
      .csstransforms .responsive-wrapper li {
        opacity: 1;
        transform: translateX(0); } }
  .csstransforms .responsive-wrapper.rm-opened li {
    opacity: 1;
    transform: translateX(0); }
  .csstransforms .responsive-wrapper.is-closing li {
    opacity: 0;
    transform: translateX(-50px); }

/**
 * The toggle button
 */
.rm-togglebutton {
  margin: 0;
  padding: 0;
  list-style: none;
  border: none;
  background: transparent;
  transition: all 0.2s cubic-bezier(0.195, 0.4, 0.45, 0.785);
  position: absolute;
  top: 7px;
  right: 7px;
  z-index: 1;
  /* Brighten the button up */
  /* Hide toggle text be default */ }
  @media screen and (min-width: 664px) {
    .rm-togglebutton {
      background: #00b9e6;
      top: 10px;
      right: 10px;
      padding-top: 2px;
      padding-bottom: 1px;
      padding-left: 10px;
      color: white; }
      .rm-togglebutton .hamburger .bar1,
      .rm-togglebutton .hamburger .bar2,
      .rm-togglebutton .hamburger .bar3 {
        background: white; } }
  .rm-togglebutton .toggle-text {
    display: none;
    /* Display when there's room for it */ }
    @media screen and (min-width: 664px) {
      .rm-togglebutton .toggle-text {
        display: inline-block; } }

.formResponsive fieldset,
.formResponsive .formContainer,
.formResponsive .formHorzontal {
  min-width: 0; }

.formResponsive .rsform-block.rsform-block.rsform-block {
  margin-bottom: 30px; }
  .formResponsive .rsform-block.rsform-block.rsform-block:last-child {
    margin-bottom: 0; }

.formResponsive .formValidation.formValidation.formValidation {
  display: block; }

.formResponsive .formError.formError {
  height: auto;
  padding: 0;
  margin: 5px 0 0; }

.formResponsive .formNoError.formNoError {
  display: none; }

.formResponsive .rsform-input-box.rsform-input-box,
.formResponsive .rsform-text-box.rsform-text-box,
.formResponsive .rsform-select-box.rsform-select-box {
  margin-bottom: 0;
  width: 400px;
  max-width: 100%;
  background: #f5f5f5;
  border: 1px solid #cbd0d3;
  border-radius: 4px;
  padding: 5px;
  font-size: 18px;
  line-height: 1em;
  height: auto;
  box-sizing: border-box; }

.formResponsive .rsform-select-box.rsform-select-box {
  color: #003576;
  font-size: 18px;
  line-height: 1em;
  height: auto;
  padding: 5px;
  box-sizing: border-box; }

.formResponsive .rsform-submit-button.rsform-submit-button.rsform-submit-button {
  /* Smaller font size for mobile views */
  font-size: 21px;
  line-height: 21px;
  padding: 10px;
  /* Larger font on desktop views */
  border: none;
  background: #00b9e6;
  color: white;
  text-shadow: none;
  font-weight: 700;
  font-family: "npo-sans", "Calibri", "Gill Sans", "Trebuchet MS", Arial, sans-serif; }
  @media screen and (min-width: 664px) {
    .formResponsive .rsform-submit-button.rsform-submit-button.rsform-submit-button {
      font-size: 24px;
      line-height: 24px;
      padding: 12px; } }

.formResponsive .formControlLabel.formControlLabel.formControlLabel {
  color: #003576;
  font-weight: 700;
  font-family: "npo-sans", "Calibri", "Gill Sans", "Trebuchet MS", Arial, sans-serif;
  margin-bottom: 10px;
  padding-top: 0;
  width: 100%;
  float: none;
  text-align: left; }

.formResponsive .formDescription.formDescription.formDescription {
  margin: 0; }

.formResponsive .formControls.formControls.formControls {
  margin-left: 0; }

.formResponsive--fullwidth .rsform-input-box.rsform-input-box,
.formResponsive--fullwidth .rsform-text-box.rsform-text-box,
.formResponsive--fullwidth .rsform-select-box.rsform-select-box {
  width: 100%; }

.search-page-form {
  max-width: 400px;
  margin-bottom: 15px;
  position: relative; }

.searchintro {
  margin-bottom: 15px; }
  .searchintro p:first-child {
    margin-bottom: 0; }

.search-labels label {
  margin-right: 10px; }
  .search-labels label:last-child {
    margin-right: 0; }

.search-labels input {
  margin-right: 5px; }

/**
 * Stand logo
 */
.stand-logo {
  font-size: 30px;
  line-height: 1em;
  color: white; }
  @media screen and (min-width: 664px) {
    .stand-logo {
      font-size: 60px; } }
  .stand-logo span {
    color: #bd081c; }
  .stand-logo + p {
    margin-top: -0.75em;
    margin-bottom: 1em; }

.stand-button {
  min-width: 140px;
  text-align: center; }
  .stand-button svg {
    font-size: 20px;
    line-height: 22px;
    margin-left: 10px;
    vertical-align: middle; }

.stand-vote-as {
  text-decoration: underline;
  cursor: pointer;
  font-size: 16px;
  color: white; }
  .stand-vote-as:focus, .stand-vote-as:hover {
    text-decoration: none; }

.statement-container {
  text-align: center; }

.stand-personal-options {
  position: fixed;
  width: 300px;
  height: auto;
  z-index: -1;
  opacity: 0;
  transition: all 0.2s cubic-bezier(0.195, 0.4, 0.45, 0.785); }
  .stand-personal-options .bClose {
    margin: 0;
    padding: 0;
    list-style: none;
    transition: all 0.2s cubic-bezier(0.195, 0.4, 0.45, 0.785);
    cursor: pointer;
    position: absolute;
    right: -10px;
    top: -10px;
    background: transparent;
    width: 26px;
    height: 0;
    padding-top: 24px;
    border-radius: 50%;
    border: 1px solid #aaaaaa;
    display: none;
    background: #e6e6e6;
    overflow: hidden;
    vertical-align: middle; }
    .stand-personal-options .bClose:after {
      font-size: 14px;
      position: absolute;
      top: 50%;
      left: 50%;
      margin-top: -9px;
      margin-left: -4px;
      content: "✖";
      display: block; }
    .stand-personal-options .bClose:hover, .stand-personal-options .bClose:focus {
      background: #aaaaaa; }
    .js .stand-personal-options .bClose {
      display: inline-block; }

.stand-personal-options__intro {
  background: white;
  padding: 0.8em;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 15px;
  line-height: 1.35em;
  margin: 0;
  border-bottom: 1px solid #b8b8b8; }
  .stand-personal-options__intro:first-child {
    border-radius: 4px 4px 0 0; }

.stand-personal-options__heading {
  background: white;
  padding: 0.8em;
  color: #003576;
  font-family: "aleo", "Calibri", "Gill Sans", "Trebuchet MS", Arial, sans-serif;
  margin: 0;
  border-bottom: 1px solid #b8b8b8; }
  .stand-personal-options__heading:first-child {
    border-radius: 4px 4px 0 0; }

.stand-personal-options__close-button {
  border-radius: 0 0 4px 4px; }

.stand-personal-options__list {
  margin: 0;
  padding: 0;
  list-style: none;
  border: none;
  background: transparent;
  background: white;
  border-bottom: 1px solid #b8b8b8;
  padding-top: 0.2em;
  padding-bottom: 0.2em; }
  .stand-personal-options__list:last-child {
    border-bottom: none; }
  .stand-personal-options__list label {
    display: block;
    padding: 0.1em 0.7em; }
  .stand-personal-options__list input {
    margin-right: 0.5em; }

.stand-article p:first-of-type {
  font-weight: 700;
  color: #003576; }

/**
 * The sticky parent
 *
 * Replacement for the default .container
 * Can hold several sticky holders
 */
.sticky-container {
  position: relative;
  z-index: 1;
  margin-left: auto;
  margin-right: auto;
  max-width: 1280px; }
  .sticky-container:before, .sticky-container:after {
    display: table;
    content: " "; }
  .sticky-container:after {
    clear: both; }
  @media screen and (min-width: 988px) {
    .sticky-container {
      max-width: 1316px;
      padding-left: 28px;
      padding-right: 28px; } }

.sticky-container--padded {
  padding-left: 10px;
  padding-right: 10px; }
  @media screen and (min-width: 664px) {
    .sticky-container--padded {
      padding-left: 19px;
      padding-right: 19px; } }

/**
 * The sticky holder
 *
 * This container is used for bottoming out so make sure this always surrounds the content as well
 */
.sticky-holder {
  position: relative;
  z-index: 1; }
  .sticky-holder:before, .sticky-holder:after {
    display: table;
    content: " "; }
  .sticky-holder:after {
    clear: both; }

/**
 * The container that gets position sticky and is used for stickykit (JS)
 */
.sticky-header-wrapper {
  width: 100%;
  /* Different top for when JS is disabled */
  /* Give sticky position to items that shoudl stick */
  /* Stuck styling (add bottom shadow) for items that are stuck */ }
  .sticky-header-wrapper.level2 {
    top: 40px; }
  .sticky-header-wrapper.should-stick {
    z-index: 10; }
  .sticky-header-wrapper.is-stuck .sticky-header:before {
    opacity: 1;
    transform: translateY(0);
    transition: all 0.2s cubic-bezier(0.195, 0.4, 0.45, 0.785); }

/**
 * The sticky header itself, holding the psuedo shadow element and the content
 */
.sticky-header {
  position: relative;
  z-index: 1;
  /**
   * Psuedo shadow element, this is faster to animate than a real box-shadow
   *
   * 1. Disappear slower for optical better transition
   */
  /**
   * Sticky header image
   */
  /**
   * Prev button in sticky header
   */ }
  .sticky-header:before {
    position: absolute;
    z-index: 2;
    content: " ";
    display: block;
    height: 8px;
    bottom: -8px;
    left: 0;
    right: 0;
    border-top: 1px solid rgba(0, 0, 0, 0.24);
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.18), rgba(0, 0, 0, 0));
    opacity: 0;
    transform: translateY(-100%);
    transition: all 0.8s cubic-bezier(0.195, 0.4, 0.45, 0.785);
    /* 1 */ }
  @media screen and (min-width: 664px) {
    .sticky-header .sticky-header__image {
      padding-right: 20px; } }
  .sticky-header .sticky-header__image .image-placeholder-4-3 {
    width: 110px; }
    @media screen and (min-width: 664px) {
      .sticky-header .sticky-header__image .image-placeholder-4-3 {
        width: 120px; } }
    @media screen and (min-width: 768px) {
      .sticky-header .sticky-header__image .image-placeholder-4-3 {
        width: 125px; } }
  .sticky-header .flag-object__aside--prev {
    position: absolute;
    z-index: 10;
    top: 2px;
    left: 2px; }

/**
 * Sticky header content, styling and z-index to cover the psuedo shadow
 */
.sticky-header__content {
  position: relative;
  z-index: 2;
  padding: 7px 10px;
  min-height: 40px; }
  .sticky-header__content.sticky-header__content--spaced {
    padding: 10px; }
    @media screen and (min-width: 664px) {
      .sticky-header__content.sticky-header__content--spaced {
        padding: 19px; } }

/**
 * Default top settings for position: sticky when we have a sticky playlist
 */
.has-sticky-player .sticky-header-wrapper {
  top: 50px; }
  .has-sticky-player .sticky-header-wrapper.level2 {
    top: 90px; }

/**
 * Styling for different header layers
 */
.level1 .sticky-header__content {
  background: #003576;
  color: white; }

.level2 .sticky-header__content {
  background: #d5dee8; }

/**
 * The sticky content
 */
.sticky-content {
  position: relative;
  z-index: 1;
  background: white; }
  @media screen and (min-width: 664px) {
    .sticky-content {
      background: transparent; } }

.sticky-plyr {
  background: white;
  padding: 10px; }

/**
 * Sticky section
 */
@media screen and (min-width: 664px) {
  .cssgradients .sticky-section {
    position: relative; }
    .cssgradients .sticky-section:before {
      display: block;
      position: absolute;
      content: " ";
      top: 0;
      left: 0;
      z-index: -1;
      width: 100%;
      height: 200px;
      max-height: 100%;
      background: white;
      background-image: linear-gradient(to bottom, white 0%, #f1f4f7 100%); } }

.sticky-section.has-no-items:before {
  display: none; }

.thema__image {
  overflow: hidden;
  position: relative; }
  .cssfilters .thema__image .image-blur {
    display: block;
    filter: blur(10px); }
  .thema__image .image-blur-ontop--background {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: #d5dee8; }
    .cssfilters .thema__image .image-blur-ontop--background {
      background: rgba(0, 53, 118, 0.5); }
  .thema__image .image-blur-ontop {
    position: absolute;
    top: -50%;
    width: 100%; }
    @media screen and (min-width: 768px) {
      .thema__image .image-blur-ontop {
        width: 600px;
        top: 50%;
        left: 50%;
        margin-top: -225px;
        margin-left: -300px; } }

.thema__image__source-background {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-image: linear-gradient(to bottom, rgba(0, 53, 118, 0) 0%, rgba(0, 53, 118, 0) 50%, rgba(0, 53, 118, 0.5) 100%); }

.thema__image__source {
  position: absolute;
  bottom: 0;
  right: 0;
  color: white;
  padding: 10px 15px;
  font-size: 15px;
  text-transform: uppercase;
  text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5);
  font-weight: 700;
  background: #003576;
  left: 0;
  text-align: right; }
  .cssgradients .thema__image__source {
    background: none; }

.thema__content {
  position: relative;
  background: white;
  min-height: 300px;
  padding: 10px; }
  .thema__content:after {
    display: block;
    position: absolute;
    content: " ";
    bottom: 0;
    left: 0;
    z-index: 0;
    width: 100%;
    height: 200px;
    background: white;
    background-image: linear-gradient(to bottom, white 0%, #f1f4f7 100%); }
  @media screen and (min-width: 664px) {
    .thema__content {
      padding: 19px; } }
  @media screen and (min-width: 768px) {
    .thema__content {
      padding: 2.4390243902%; } }

.thema__content__header {
  color: #003576;
  font-size: 14px;
  line-height: 19px;
  vertical-align: middle; }
  .thema__content__header a {
    color: #003576; }

.thema__content__header,
.thema__content__body,
.thema__content__footer {
  margin-bottom: 30px;
  position: relative;
  z-index: 1;
  max-width: 600px;
  margin-left: auto;
  margin-right: auto; }

.thema__content__body p:first-of-type {
  font-weight: 700;
  color: #003576; }

.thema-header {
  max-width: 600px;
  margin-left: auto;
  margin-right: auto; }

.thema-articles {
  background: #CBD7E3; }

.thema__content__header__date,
.thema__content__header__omroep,
.thema__content__header__author,
.thema__content__header__separator,
.omroep-logo,
.omroep-name {
  display: inline-block;
  vertical-align: top;
  font-weight: 700; }

.thema__content__header__separator {
  margin: 0 5px; }

.thema__content__header__omroep {
  text-decoration: none; }
  .thema__content__header__omroep:hover .omroep-name, .thema__content__header__omroep:focus .omroep-name {
    text-decoration: none; }

.block-thema-related .content-wrapper {
  top: -2px;
  right: -2px;
  bottom: -2px;
  left: -2px;
  overflow: hidden;
  backface-visibility: hidden;
  padding: 0; }

.block-thema-related .block-square__titles {
  position: relative;
  display: block;
  width: 102%;
  height: 102%;
  border: none;
  margin: -1%;
  padding: 0;
  min-height: 25%; }

.block-thema-related .block-square__titles__content {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  min-height: 25%;
  background: white; }
  @media (min-width: 320px) and (min-height: 320px) {
    .flexbox .block-thema-related .block-square__titles__content,
    .flexboxlegacy .block-thema-related .block-square__titles__content {
      background: transparent;
      top: 0;
      display: -ms-flexbox;
      display: flex;
      -ms-flex-align: end;
          align-items: flex-end; } }

.block-thema-related .block-square__titles__spacing {
  padding: 10px;
  backface-visibility: hidden; }
  @media (min-width: 320px) and (min-height: 320px) {
    .flexbox .block-thema-related .block-square__titles__spacing,
    .flexboxlegacy .block-thema-related .block-square__titles__spacing {
      background: white;
      width: 100%;
      min-height: 30%; } }
  @media screen and (min-width: 440px) {
    .block-thema-related .block-square__titles__spacing {
      padding: 7.6923076923%; } }
  @media screen and (min-width: 664px) {
    .block-thema-related .block-square__titles__spacing {
      padding: 8.8888888889%; } }

.block-thema-related .block-square__subtitle {
  display: inline; }

.block-thema-popular {
  position: relative;
  margin-bottom: 5px; }
  .block-thema-popular:last-child {
    margin-bottom: 0; }
  .block-thema-popular .heading--small {
    line-height: 1.2em; }

.block-thema-animate {
  position: relative; }
  .block-thema-animate .block-square {
    overflow: hidden;
    backface-visibility: hidden; }
  .block-thema-animate .column__content {
    overflow: hidden;
    backface-visibility: hidden; }
    .block-thema-animate .column__content:before {
      display: none; }
  .block-thema-animate .block-square__image {
    top: -2px;
    right: -2px;
    left: -2px; }
  .block-thema-animate .image-wrapper {
    overflow: hidden;
    backface-visibility: hidden; }
  .block-thema-animate .image-placeholder-4-3 {
    transition: all 0.2s cubic-bezier(0.195, 0.4, 0.45, 0.785);
    backface-visibility: hidden; }
  .block-thema-animate:hover .image-placeholder-4-3 {
    transform: scale(1.1); }

.omroep-logo {
  margin-right: 5px; }

.thema-poster {
  position: relative;
  display: block;
  overflow: hidden; }
  .thema-poster .image-placeholder-16-9 {
    transition: all 0.2s cubic-bezier(0.195, 0.4, 0.45, 0.785); }
  .thema-poster:hover .image-placeholder-16-9, .thema-poster:focus .image-placeholder-16-9 {
    transform: scale(1.1); }

.thema-poster__text {
  position: absolute;
  bottom: 0;
  display: block;
  padding: 3.7037037037%;
  text-shadow: 0 0 1px rgba(0, 0, 0, 0.5); }

@media screen and (min-width: 0) and (max-width: 664px) {
  .row.block-thema .main__half {
    background: transparent; }
    .row.block-thema .main__half .flex-block__grow {
      width: 100%; }
    .row.block-thema .main__half:first-child {
      float: left;
      display: block;
      margin-right: 5%;
      width: 30%; }
      .row.block-thema .main__half:first-child:last-child {
        margin-right: 0; }
    .row.block-thema .main__half:last-child {
      float: left;
      display: block;
      margin-right: 5%;
      width: 65%; }
      .row.block-thema .main__half:last-child:last-child {
        margin-right: 0; } }

.row.block-thema .image-wrapper {
  -ms-flex-positive: 1;
      flex-grow: 1;
  min-width: 100%; }

@media screen and (min-width: 0) and (max-width: 664px) {
  .block-thema {
    border-top: 1px solid #aaaaaa;
    padding-top: 10px; }
    .block-thema.main__half {
      background: transparent; }
    .block-thema .image-wrapper {
      float: left;
      display: block;
      margin-right: 5%;
      width: 30%;
      min-width: 0; }
      .block-thema .image-wrapper:last-child {
        margin-right: 0; }
    .block-thema .flex-block__grow {
      float: left;
      display: block;
      margin-right: 5%;
      width: 65%;
      margin-right: 0; }
      .block-thema .flex-block__grow:last-child {
        margin-right: 0; }
    .block-thema .content-wrapper {
      background: transparent;
      padding: 0; }
    .block-thema h2 {
      margin-bottom: 0;
      font-weight: 400;
      font-family: inherit; }
    .block-thema .flex-block--static {
      display: none; } }

@media screen and (min-width: 0) and (max-width: 664px) {
  .row:last-child .block-thema:last-child {
    border-bottom: 1px solid #aaaaaa;
    padding-bottom: 10px; } }

.block-thema__content {
  display: none; }
  @media screen and (min-width: 664px) {
    .block-thema__content {
      display: block; } }

/* The content wrapper */
.wrapper {
  padding-top: 5px;
  /* Remove focus styling */ }
  .wrapper:focus {
    outline: none; }
  @media screen and (min-width: 664px) {
    .wrapper {
      padding-top: 9.5px; } }
  .wrapper .container {
    position: relative;
    z-index: 1; }

html.has-app-overlay {
  background: red;
  overflow: hidden; }

.app-overlay-notification,
.app-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 999;
  background: red;
  color: white;
  display: none;
  transition: all 0.5s cubic-bezier(0.17, 0.67, 0.18, 0.95);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; }
  .app-overlay-notification.is-animating,
  .app-overlay.is-animating {
    display: block; }

.app-overlay-notification {
  transform: translateY(-100%); }
  .app-overlay-notification.is-open {
    display: block;
    transform: translateY(0%); }

.app-overlay {
  bottom: 0;
  opacity: 0;
  transform: scale(0); }
  .app-overlay.is-open {
    display: block;
    opacity: 1;
    transform: scale(1); }
  .app-overlay.is-closed {
    display: block;
    transition: all 0.5s ease-in;
    opacity: 0;
    transform: scale(1.2); }

.app-overlay__container {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column;
  -ms-flex-pack: justify;
      justify-content: space-between;
  width: 100%;
  height: 100%; }

.app-overlay-notification__image {
  position: relative;
  display: block;
  width: 56px;
  height: 56px;
  background-position: center;
  background-size: cover;
  float: left; }
  .app-overlay-notification__image + .app-overlay-notification__title {
    margin-left: 56px; }

.app-overlay-notification__title {
  padding: 1em; }

.app-overlay__title,
.app-overlay__footer {
  -ms-flex: 0 0 auto;
      flex: 0 0 auto;
  padding: 1em; }

.app-overlay__body {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column;
  -ms-flex: 1 1 auto;
      flex: 1 1 auto;
  overflow: auto;
  -webkit-overflow-scrolling: touch; }

.app-overlay__wrapper,
.app-overlay__poll {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column;
  -ms-flex: 1 0 auto;
      flex: 1 0 auto;
  -ms-flex-pack: distribute;
      justify-content: space-around; }

.app-overlay__title h2 {
  line-height: 1.25em;
  margin: 0;
  font-size: 1.5em; }

.app-overlay__content {
  -ms-flex: 0 0 auto;
      flex: 0 0 auto;
  padding: 0 1em;
  margin: 0.5em 0; }
  .app-overlay__content:first-child {
    margin-top: 0; }
  .app-overlay__content:last-child {
    margin-bottom: 0; }

.no-transition {
  transition: none !important; }

.app-overlay__content .styled__radio__label {
  padding: 0; }

.app-overlay__content .progress-container__textual {
  color: white; }

.app-overlay-close-button {
  margin: 0;
  padding: 0;
  list-style: none;
  border: none;
  background: transparent;
  position: absolute;
  top: 0;
  right: 0;
  z-index: 1000;
  width: 44px;
  height: 44px;
  margin: 4px; }

.logo-avro {
  display: inline-block;
  vertical-align: middle;
  background-image: url(../images/sprite.png?123);
  background-position: -36px -32px;
  width: 36px;
  height: 20px; }
  @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    .logo-avro {
      background-image: url(../images/sprite.retina.png?123);
      background-size: 144px 112px; } }

.logo-avrotros {
  display: inline-block;
  vertical-align: middle;
  background-image: url(../images/sprite.png?123);
  background-position: -36px -72px;
  width: 36px;
  height: 20px; }
  @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    .logo-avrotros {
      background-image: url(../images/sprite.retina.png?123);
      background-size: 144px 112px; } }

.logo-bnn {
  display: inline-block;
  vertical-align: middle;
  background-image: url(../images/sprite.png?123);
  background-position: -108px 0px;
  width: 36px;
  height: 20px; }
  @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    .logo-bnn {
      background-image: url(../images/sprite.retina.png?123);
      background-size: 144px 112px; } }

.logo-bnnvara {
  display: inline-block;
  vertical-align: middle;
  background-image: url(../images/sprite.png?123);
  background-position: -32px 0px;
  width: 40px;
  height: 20px; }
  @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    .logo-bnnvara {
      background-image: url(../images/sprite.retina.png?123);
      background-size: 144px 112px; } }

.logo-eo {
  display: inline-block;
  vertical-align: middle;
  background-image: url(../images/sprite.png?123);
  background-position: 0px -52px;
  width: 36px;
  height: 20px; }
  @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    .logo-eo {
      background-image: url(../images/sprite.retina.png?123);
      background-size: 144px 112px; } }

.logo-huma {
  display: inline-block;
  vertical-align: middle;
  background-image: url(../images/sprite.png?123);
  background-position: -36px -52px;
  width: 36px;
  height: 20px; }
  @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    .logo-huma {
      background-image: url(../images/sprite.retina.png?123);
      background-size: 144px 112px; } }

.logo-ikon {
  display: inline-block;
  vertical-align: middle;
  background-image: url(../images/sprite.png?123);
  background-position: -72px 0px;
  width: 36px;
  height: 20px; }
  @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    .logo-ikon {
      background-image: url(../images/sprite.retina.png?123);
      background-size: 144px 112px; } }

.logo-kro-ncrv {
  display: inline-block;
  vertical-align: middle;
  background-image: url(../images/sprite.png?123);
  background-position: -72px -20px;
  width: 36px;
  height: 20px; }
  @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    .logo-kro-ncrv {
      background-image: url(../images/sprite.retina.png?123);
      background-size: 144px 112px; } }

.logo-kro {
  display: inline-block;
  vertical-align: middle;
  background-image: url(../images/sprite.png?123);
  background-position: -72px -40px;
  width: 36px;
  height: 20px; }
  @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    .logo-kro {
      background-image: url(../images/sprite.retina.png?123);
      background-size: 144px 112px; } }

.logo-max {
  display: inline-block;
  vertical-align: middle;
  background-image: url(../images/sprite.png?123);
  background-position: 0px -72px;
  width: 36px;
  height: 20px; }
  @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    .logo-max {
      background-image: url(../images/sprite.retina.png?123);
      background-size: 144px 112px; } }

.logo-ncrv {
  display: inline-block;
  vertical-align: middle;
  background-image: url(../images/sprite.png?123);
  background-position: 0px -32px;
  width: 36px;
  height: 20px; }
  @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    .logo-ncrv {
      background-image: url(../images/sprite.retina.png?123);
      background-size: 144px 112px; } }

.logo-nos {
  display: inline-block;
  vertical-align: middle;
  background-image: url(../images/sprite.png?123);
  background-position: -72px -72px;
  width: 36px;
  height: 20px; }
  @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    .logo-nos {
      background-image: url(../images/sprite.retina.png?123);
      background-size: 144px 112px; } }

.logo-npo {
  display: inline-block;
  vertical-align: middle;
  background-image: url(../images/sprite.png?123);
  background-position: 0px 0px;
  width: 32px;
  height: 32px; }
  @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    .logo-npo {
      background-image: url(../images/sprite.retina.png?123);
      background-size: 144px 112px; } }

.logo-ntr {
  display: inline-block;
  vertical-align: middle;
  background-image: url(../images/sprite.png?123);
  background-position: -108px -20px;
  width: 36px;
  height: 20px; }
  @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    .logo-ntr {
      background-image: url(../images/sprite.retina.png?123);
      background-size: 144px 112px; } }

.logo-pown {
  display: inline-block;
  vertical-align: middle;
  background-image: url(../images/sprite.png?123);
  background-position: -108px -92px;
  width: 36px;
  height: 13px; }
  @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    .logo-pown {
      background-image: url(../images/sprite.retina.png?123);
      background-size: 144px 112px; } }

.logo-rad1 {
  display: inline-block;
  vertical-align: middle;
  background-image: url(../images/sprite.png?123);
  background-position: -108px -60px;
  width: 36px;
  height: 20px; }
  @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    .logo-rad1 {
      background-image: url(../images/sprite.retina.png?123);
      background-size: 144px 112px; } }

.logo-tros {
  display: inline-block;
  vertical-align: middle;
  background-image: url(../images/sprite.png?123);
  background-position: 0px -92px;
  width: 36px;
  height: 20px; }
  @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    .logo-tros {
      background-image: url(../images/sprite.retina.png?123);
      background-size: 144px 112px; } }

.logo-vara {
  display: inline-block;
  vertical-align: middle;
  background-image: url(../images/sprite.png?123);
  background-position: -36px -92px;
  width: 36px;
  height: 20px; }
  @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    .logo-vara {
      background-image: url(../images/sprite.retina.png?123);
      background-size: 144px 112px; } }

.logo-vpro {
  display: inline-block;
  vertical-align: middle;
  background-image: url(../images/sprite.png?123);
  background-position: -108px -40px;
  width: 36px;
  height: 20px; }
  @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    .logo-vpro {
      background-image: url(../images/sprite.retina.png?123);
      background-size: 144px 112px; } }

.logo-wnl {
  display: inline-block;
  vertical-align: middle;
  background-image: url(../images/sprite.png?123);
  background-position: -72px -92px;
  width: 36px;
  height: 20px; }
  @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    .logo-wnl {
      background-image: url(../images/sprite.retina.png?123);
      background-size: 144px 112px; } }

/* Space poll result from each other */
.rp-answer {
  margin-bottom: 30px; }
  .rp-answer:last-child {
    margin-bottom: 0; }

/* Do not show player on non-html5-player capable browsers */
.disable-player .thema-audiofragment,
.disable-player .button-group.button-group.button-group {
  display: none; }

/* Responsive menu */
#rm-mobile-indicator {
  display: block; }
  @media screen and (min-width: 988px) {
    #rm-mobile-indicator {
      display: none;
      visibility: hidden; } }

.top-right-desktop .moduletable {
  margin-bottom: 7.6923076923%; }

.top-right-desktop .module + .moduletable {
  margin-top: 7.6923076923%;
  margin-bottom: 0; }

.modules .nos-nieuws + .moduletable + .module {
  margin-top: 7.6923076923%; }

.modules .module .moduletable {
  margin-bottom: 7.6923076923%; }

.rp-poll-messages {
  margin-bottom: 30px; }

/**
 * Finish Alert
 */
.block-alert {
  margin-bottom: 30px; }
  .block-alert__text > p {
    font-size: 14px;
    line-height: 21px; }

.button--alert {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
  background-image: linear-gradient(45deg, #f5b804 25%, transparent 25%), linear-gradient(-45deg, #f5b804 25%, transparent 25%), linear-gradient(45deg, transparent 75%, #f5b804 75%), linear-gradient(-45deg, transparent 75%, #f5b804 75%);
  background-size: 20px 20px;
  background-position: 0 0, 0 10px, 10px -10px, -10px 0;
  border: none;
  color: #ffffff;
  padding: 0;
  position: relative; }
  .button--alert:before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: linear-gradient(to right, transparent 45px, #f5b804 45px, #f5b804 65%, rgba(245, 184, 4, 0.5) 100%);
    border-radius: 4px; }
  .button--alert:focus:before, .button--alert:hover:before {
    background: linear-gradient(to right, transparent 45px, #f5b804 45px, #f5b804 100%); }
  .button--alert .button__icon-action {
    -ms-flex: 0 0 45px;
        flex: 0 0 45px;
    color: #ffffff;
    border-radius: 4px 0 0 4px;
    padding: 11px .75em; }
    .button--alert .button__icon-action svg {
      fill: #ffffff; }
  .button--alert--on .button__icon-action {
    background-color: #00ac00; }
  .button--alert--off .button__icon-action {
    background-color: red; }
  .button--alert .button__text {
    padding: .5em 0 .5em .5em;
    -ms-flex: 1 1 0;
        flex: 1 1 0;
    z-index: 1; }
  .button--alert > svg {
    -ms-flex: 0 0 40px;
        flex: 0 0 40px;
    margin-right: .25em;
    height: 40px;
    width: 40px; }
    .button--alert > svg .ttf-dot {
      fill: #ffffff; }

.block-alert__action {
  margin-bottom: 15px; }
  .block-alert__action:last-child {
    margin-bottom: 0; }

.thema__content__header__author .button--line {
  border: none;
  padding: 3px;
  margin-top: -4px;
  margin-left: 3px; }

.js .trigger-click-container {
  cursor: pointer; }

/* Element we use to animate the jump from button to queue playlist */
.jump-to-fav {
  position: absolute;
  z-index: 10;
  display: none;
  vertical-align: middle;
  width: 18px;
  height: 18px;
  font-size: 18px;
  line-height: 1em;
  margin-left: -1px;
  margin-top: -1px;
  color: #00b9e6; }

.content-wrapper--spaced {
  padding: 10px 15px 15px; }
  @media screen and (min-width: 664px) {
    .content-wrapper--spaced {
      padding: 2.4390243902%; } }

.toggle-favorites.is-active .js-favorites-count {
  display: none; }

/* Only show buttons on app */
.container-utilities {
  position: fixed;
  bottom: 10px;
  right: 10px;
  left: 10px;
  z-index: 999; }
  .container-utilities .back-button {
    display: none;
    position: absolute;
    bottom: 0;
    left: 0; }
  .container-utilities .backtotop-button {
    position: absolute;
    bottom: 0;
    right: 0;
    opacity: 1;
    transform: translateY(0);
    transition: all 0.2s cubic-bezier(0.195, 0.4, 0.45, 0.785);
    display: block; }
    .container-utilities .backtotop-button.is-hidden {
      display: block;
      opacity: 0;
      z-index: -1;
      transform: translateY(60px); }
    .container-utilities .backtotop-button .button__text {
      position: absolute;
      overflow: hidden;
      backface-visibility: hidden;
      clip: rect(0 0 0 0);
      height: 1px;
      width: 1px;
      margin: -1px;
      padding: 0;
      border: 0; }

.has-hidden-back-button .app .container-utilities .back-button {
  display: none; }

.article-poll {
  background: #f1f4f7;
  padding: 15px 15px 7px; }
  .article-poll p {
    margin-bottom: 15px; }
  .article-poll .progress-container {
    margin-top: -5px;
    margin-bottom: 20px; }
    .article-poll .progress-container:nth-child(n) {
      margin-bottom: 20px; }
  .article-poll label {
    display: block;
    border-radius: 4px;
    font-weight: 700;
    text-decoration: none;
    vertical-align: middle;
    text-align: center;
    cursor: pointer;
    backface-visibility: hidden;
    transition: background 0.2s cubic-bezier(0.195, 0.4, 0.45, 0.785), color 0.2s cubic-bezier(0.195, 0.4, 0.45, 0.785);
    border: none;
    background: #00b9e6;
    color: white;
    padding: 6px;
    font-size: 16px;
    line-height: 16px;
    margin-bottom: 8px;
    /* Hover and focus state */ }
    .article-poll label:hover, .article-poll label:focus {
      background: #003576;
      color: white;
      outline: none; }
    .article-poll label:active {
      outline: 1px dotted #003576; }
    .article-poll label input {
      position: absolute;
      overflow: hidden;
      backface-visibility: hidden;
      clip: rect(0 0 0 0);
      height: 1px;
      width: 1px;
      margin: -1px;
      padding: 0;
      border: 0; }

/**
 * Animated success message
 */
.action-message {
  display: none;
  /* Hide by default */ }

.message-block {
  display: block;
  padding: 15px;
  background-color: #3498db;
  color: #333;
  margin-bottom: 15px; }
  .message-block:last-child {
    margin-bottom: 0; }
  .message-block--animated {
    animation-name: fade-in;
    animation-duration: 1.5s;
    animation-timing-function: ease-in-out; }

.message-block--error {
  background-color: red;
  color: white; }

.message-block--success {
  background-color: #00ac00;
  color: white; }

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

.main__heading {
  border-top: 1px solid #aaaaaa;
  padding-top: 10px; }
  @media screen and (min-width: 664px) {
    .main__heading {
      display: none; } }
  .main__heading + .block-thema {
    border-top: none;
    padding-top: 0; }

.row-responsive {
  margin-bottom: 15px;
  text-decoration: none; }
  .row-responsive:before, .row-responsive:after {
    display: table;
    content: " "; }
  .row-responsive:after {
    clear: both; }
  @media screen and (min-width: 664px) {
    .row-responsive {
      margin-bottom: 30px; } }
  @media (min-width: 0) and (min-height: 0) {
    .flexbox .row-responsive,
    .flexboxlegacy .row-responsive {
      display: -ms-flexbox;
      display: flex; }
      .flexbox .row-responsive:before, .flexbox .row-responsive:after,
      .flexboxlegacy .row-responsive:before,
      .flexboxlegacy .row-responsive:after {
        display: none; } }

.row-responsive__image {
  float: left;
  width: 33%; }
  .row-responsive__image .image-wrapper {
    overflow: hidden; }
  .row-responsive__image .image-placeholder-4-3 {
    transition: all 0.2s cubic-bezier(0.195, 0.4, 0.45, 0.785); }
  @media screen and (min-width: 664px) {
    .row-responsive__image {
      width: 25%; } }
  @media screen and (min-width: 768px) {
    .row-responsive__image {
      width: 20%; } }

.row-responsive__body {
  background: white;
  float: left;
  width: 67%; }
  @media screen and (min-width: 664px) {
    .row-responsive__body {
      width: 75%; } }
  @media screen and (min-width: 768px) {
    .row-responsive__body {
      width: 80%; } }
  .row-responsive__body .content-wrapper {
    padding: 15px; }
    @media screen and (min-width: 664px) {
      .row-responsive__body .content-wrapper {
        padding: 30px; } }

.row-responsive--animated:hover .image-placeholder-4-3 {
  transform: scale(1.1); }

.item-block__content,
.item-block__heading {
  padding: 30px;
  background: #f1f4f7;
  line-height: 24px; }

.item-block__heading {
  font-family: inherit;
  font-size: 16px;
  line-height: inherit;
  font-weight: 700;
  color: #003576;
  margin: 0;
  padding-bottom: 0; }

.item-block__content {
  margin-bottom: 30px;
  font-size: 15px; }
  .item-block__content:last-child {
    margin-bottom: 0; }
  .item-block__content p:first-of-type {
    font-weight: inherit;
    color: inherit; }
  .item-block__content + .item-block__content {
    margin-top: -30px;
    padding-top: 0; }

.item-block__heading + .item-block__content {
  padding-top: 15px; }

.nporadio1_form {
  background: #f1f4f7;
  padding: 30px; }

.answers {
  margin-bottom: 15px; }
  .answers:last-child {
    margin-bottom: 0; }

.answers__answer {
  display: block; }

.poll-result {
  background: white;
  height: 16px;
  width: 100%;
  min-width: 160px;
  border-radius: 4px;
  overflow: hidden;
  border: 1px solid white;
  margin-bottom: 1em;
  margin-top: 4px; }

.poll-result__fill {
  border-radius: 4px;
  background: #003576 linear-gradient(to bottom, #003576 0%, #003576 100%);
  height: 14px;
  box-shadow: inset 0 0 0 0px #fff; }

.block-tags {
  display: -ms-flexbox;
  display: flex;
  max-width: 100%;
  font-size: 16px;
  line-height: 24px; }
  .block-tags:not(:first-child) {
    margin-top: 1.5em; }

.block-tags__title {
  -ms-flex: 0 0 auto;
      flex: 0 0 auto;
  font-weight: 700; }

.block-tags__list {
  margin: 0;
  padding: 0;
  list-style: none;
  border: none;
  background: transparent;
  -ms-flex: 1 1 auto;
      flex: 1 1 auto;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap; }
  .block-tags__list li {
    margin-left: 1em; }

#flax-component input#email-over {
  border: 1px solid #aaa; }

.js-podcast-sorter svg {
  display: none; }

.js-podcast-sorter.sort-asc svg, .js-podcast-sorter.sort-desc svg {
  display: inline-block; }

.js-podcast-sorter.sort-asc .sorter--down {
  display: none; }

.js-podcast-sorter.sort-desc .sorter--up {
  display: none; }

.npo_cc_placeholder_social_embed {
  display: none; }

.npo_cc_placeholder {
  font-size: 14px;
  padding: 15px;
  margin-bottom: 10px;
  text-align: center;
  background: #ddd; }

#ccm_notification svg {
  width: auto;
  height: auto; }

.video_container {
  overflow: hidden; }

.video_container__still {
  margin-top: -25px; }
  .video_container__still:before {
    display: block;
    position: absolute;
    content: " ";
    top: 50%;
    left: 50%;
    width: 72px;
    height: 72px;
    background: black;
    border-radius: 50%;
    opacity: 0.4;
    margin: -36px 0 0 -36px;
    transition: transform 0.2s cubic-bezier(0.195, 0.4, 0.45, 0.785);
    cursor: pointer; }
  .video_container__still:after {
    display: block;
    position: absolute;
    content: " ";
    top: 50%;
    left: 50%;
    border-top: 32px solid transparent;
    border-bottom: 32px solid transparent;
    border-left: 32px solid white;
    transform: scale(1.1, 0.7);
    margin: -32px 0 0 -12px;
    cursor: pointer;
    transition: transform 0.2s cubic-bezier(0.195, 0.4, 0.45, 0.785); }
  .video_container__still:hover:before, .video_container__still:focus:before {
    transform: scale(1.2);
    opacity: 0.5; }
  .video_container__still:hover:after, .video_container__still:focus:after {
    transform: scale(1.3, 0.9); }

.broadcasts-header__buttons-right {
  margin-bottom: 1em; }
  @media screen and (min-width: 664px) {
    .broadcasts-header__buttons-right {
      float: right;
      margin-bottom: -34px; } }
  @media screen and (min-width: 664px) {
    .broadcasts-header__buttons-right + .flag-object-beta {
      padding-right: 200px; } }

/**
 * Reset
 */
button {
  padding: 1px 7px 2px; }

/**
 * Homepage white background
 * Other pages still have the lightblue background, they still need to be redeisgned
 */
.view-homepage {
  background: white; }

/**
 * Sticky news grid
 */
.sticky-news-grid .grid__item {
  position: relative;
  margin-bottom: 10px; }
  .sticky-news-grid .grid__item:before {
    display: block;
    content: " ";
    padding-top: 56.25%; }
  .sticky-news-grid .grid__item:first-child {
    font-size: 24px; }
  .sticky-news-grid .grid__item:not(:first-child):before {
    padding-top: 33%; }
    @media screen and (min-width: 664px) {
      .sticky-news-grid .grid__item:not(:first-child):before {
        padding-top: 56.25%; } }
  @media screen and (min-width: 664px) {
    .sticky-news-grid .grid__item {
      margin-bottom: 28px; }
      .sticky-news-grid .grid__item:first-child {
        float: left;
        display: block;
        margin-right: 2.4390243902%;
        width: 65.8536585366%; }
        .sticky-news-grid .grid__item:first-child:last-child {
          margin-right: 0; }
        .sticky-news-grid .grid__item:first-child .block__content {
          font-size: 32px; }
      .sticky-news-grid .grid__item:not(:first-child) {
        float: left;
        display: block;
        margin-right: 2.4390243902%;
        width: 31.7073170732%;
        float: none;
        margin-right: 0;
        margin-left: 68.2926829268%; }
        .sticky-news-grid .grid__item:not(:first-child):last-child {
          margin-right: 0; }
      .sticky-news-grid .grid__item:last-child {
        position: absolute;
        bottom: 0;
        right: 0; } }

/**
 * Sticky news items
 */
.sticky-news-items {
  position: relative; }
  .sticky-news-items:before, .sticky-news-items:after {
    display: table;
    content: " "; }
  .sticky-news-items:after {
    clear: both; }
  .sticky-news-items .sticky-news-block {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0; }

/**
 * Grid
 */
.grid:before, .grid:after {
  display: table;
  content: " "; }

.grid:after {
  clear: both; }

/**
 * Three column grid
 */
.grid--1-1-1 {
  margin-bottom: -10px; }
  @media screen and (min-width: 664px) {
    .grid--1-1-1 {
      margin-bottom: -2.4390243902%; } }
  .grid--1-1-1 .grid__item {
    float: left;
    width: 100%;
    margin-bottom: 10px; }
    @media screen and (min-width: 664px) {
      .grid--1-1-1 .grid__item {
        margin-bottom: 2.4390243902%;
        float: left;
        display: block;
        margin-right: 2.4390243902%;
        width: 48.7804878049%; }
        .grid--1-1-1 .grid__item:nth-child(n+1) {
          clear: none;
          margin-right: 2.4390243902%; }
        .grid--1-1-1 .grid__item:last-child {
          margin-right: 0; }
        .grid--1-1-1 .grid__item:nth-child(2n) {
          margin-right: 0; }
        .grid--1-1-1 .grid__item:nth-child(2n+1) {
          clear: left; } }
    @media screen and (min-width: 768px) {
      .grid--1-1-1 .grid__item {
        float: left;
        display: block;
        margin-right: 2.4390243902%;
        width: 31.7073170732%; }
        .grid--1-1-1 .grid__item:nth-child(n+1) {
          clear: none;
          margin-right: 2.4390243902%; }
        .grid--1-1-1 .grid__item:last-child {
          margin-right: 0; }
        .grid--1-1-1 .grid__item:nth-child(3n) {
          margin-right: 0; }
        .grid--1-1-1 .grid__item:nth-child(3n+1) {
          clear: left; } }

/**
 * Responsive container
 *
 * No margin on mobile
 */
.responsive-container {
  margin-left: auto;
  margin-right: auto;
  max-width: 1280px; }
  @media screen and (min-width: 664px) {
    .responsive-container {
      max-width: 1298px;
      padding-left: 19px;
      padding-right: 19px; } }
  @media screen and (min-width: 988px) {
    .responsive-container {
      max-width: 1316px;
      padding-left: 28px;
      padding-right: 28px; } }

/**
 * Section
 *
 * Bottom margin to separate from other sections
 */
.section {
  clear: both;
  margin-bottom: 19px; }
  @media screen and (min-width: 988px) {
    .section {
      margin-bottom: 28px; } }

.responsive-block--16by9:before {
  display: block;
  content: " ";
  padding-top: 33.3333333333%; }

@media screen and (min-width: 664px) {
  .responsive-block--16by9:before {
    padding-top: 56.25%; } }

.section--blue {
  background: #003576;
  color: white; }

.section--spaced-top {
  padding-top: 28px; }

/**
 * Populair items
 */
.populair {
  padding: 10px 10px 0;
  background: #f1f4f7; }

.populair__item {
  color: inherit;
  text-decoration: none;
  display: block;
  padding-top: 10px;
  padding-bottom: 10px;
  font-family: "aleo", "Calibri", "Gill Sans", "Trebuchet MS", Arial, sans-serif;
  font-size: 16px;
  /* Hover */ }
  .populair__item + .populair__item {
    border-top: 1px solid #003576; }
  .populair__item svg {
    fill: #003576;
    transition: all 0.2s cubic-bezier(0.195, 0.4, 0.45, 0.785); }
  .populair__item .image-placeholder-16-9 {
    transition: all 0.2s cubic-bezier(0.195, 0.4, 0.45, 0.785); }
  a.populair__item:focus .flag-object__body, a.populair__item:hover .flag-object__body {
    text-decoration: underline; }
  @media screen and (min-width: 664px) {
    a.populair__item:focus, a.populair__item:hover {
      text-decoration: none; } }
  a.populair__item:focus svg, a.populair__item:hover svg {
    transform: translateX(8px); }
  a.populair__item:focus .image-placeholder-16-9, a.populair__item:hover .image-placeholder-16-9 {
    transform: scale(1.1); }

/**
 * Populair items
 */
.livestream-preview {
  margin-top: 20px;
  padding: 0 10px 0; }

.livestream-preview .video-container {
  position: relative; }

.livestream-preview .button, .livestream-preview .block-share__item {
  bottom: 20px;
  border: 1px solid white;
  position: absolute;
  right: 15px; }

.livestream-preview .button__text {
  margin-left: 5px; }

.livestream-preview .circle-button {
  font-size: 10px;
  height: 20px;
  line-height: 0;
  padding: 4px;
  vertical-align: middle;
  width: 20px; }
  @supports (-webkit-overflow-scrolling: touch) {
    .livestream-preview .circle-button {
      padding: 5px; } }

.livestream-preview .button:hover .circle-button, .livestream-preview .block-share__item:hover .circle-button {
  color: #00b9e6; }

/**
 * 2-1 grid ordered by #2 first on the left, then #1 and #3 on the right
 */
@media screen and (min-width: 664px) {
  .grid--2-1-order-2-1-3 > .grid__item:not(:nth-child(2)) {
    width: 31.7073170732%;
    float: right; }
  .grid--2-1-order-2-1-3 > .grid__item:nth-child(2) {
    float: left;
    display: block;
    margin-right: 2.4390243902%;
    width: 65.8536585366%; }
    .grid--2-1-order-2-1-3 > .grid__item:nth-child(2):last-child {
      margin-right: 0; } }

/**
 * News grid
 */
.news-grid {
  padding: 10px 10px 0;
  margin-bottom: -10px; }
  .news-grid:before, .news-grid:after {
    display: table;
    content: " "; }
  .news-grid:after {
    clear: both; }
  @media screen and (min-width: 664px) {
    .news-grid {
      margin-bottom: 0;
      padding: 0; } }
  .news-grid > .grid__item {
    position: relative;
    margin-bottom: 10px;
    float: left;
    width: 100%; }
    @media screen and (min-width: 664px) {
      .news-grid > .grid__item {
        margin-bottom: 2.4390243902%;
        float: left;
        display: block;
        margin-right: 2.4390243902%;
        width: 48.7804878049%; }
        .news-grid > .grid__item:nth-child(n+1) {
          clear: none;
          margin-right: 2.4390243902%; }
        .news-grid > .grid__item:last-child {
          margin-right: 0; }
        .news-grid > .grid__item:nth-child(2n) {
          margin-right: 0; }
        .news-grid > .grid__item:nth-child(2n+1) {
          clear: left; } }
    @media screen and (min-width: 988px) {
      .news-grid > .grid__item {
        float: left;
        display: block;
        margin-right: 2.4390243902%;
        width: 31.7073170732%; }
        .news-grid > .grid__item:nth-child(n+1) {
          clear: none;
          margin-right: 2.4390243902%; }
        .news-grid > .grid__item:last-child {
          margin-right: 0; }
        .news-grid > .grid__item:nth-child(3n) {
          margin-right: 0; }
        .news-grid > .grid__item:nth-child(3n+1) {
          clear: left; } }

@media screen and (min-width: 664px) {
  .news-block {
    position: absolute;
    top: 0;
    left: 0; } }

.news-grid-footer {
  padding: 0 10px 20px; }
  @media screen and (min-width: 664px) {
    .news-grid-footer {
      padding: 0; } }

/* Block news */
.block--news {
  display: block;
  position: relative;
  overflow: hidden; }
  .block--news .block__image {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: black;
    background-image: url("../images/image-placeholder-16-9.png");
    background-position: center;
    background-size: cover;
    transition: all 0.2s cubic-bezier(0.195, 0.4, 0.45, 0.785); }
    .block--news .block__image:after {
      display: block;
      position: absolute;
      content: " ";
      position: absolute;
      right: -4px;
      bottom: -4px;
      left: -4px;
      background-image: linear-gradient(to top, #000 0, rgba(0, 0, 0, 0.738) 19%, rgba(0, 0, 0, 0.541) 34%, rgba(0, 0, 0, 0.382) 47%, rgba(0, 0, 0, 0.278) 56.5%, rgba(0, 0, 0, 0.194) 65%, rgba(0, 0, 0, 0.126) 73%, rgba(0, 0, 0, 0.075) 80.2%, rgba(0, 0, 0, 0.042) 86.1%, rgba(0, 0, 0, 0.021) 91%, rgba(0, 0, 0, 0.008) 95.2%, rgba(0, 0, 0, 0.002) 98.2%, transparent 100%);
      transition: transform .2s ease-in-out 0s;
      transform-origin: 0 100%;
      height: 66%;
      opacity: 0.66;
      transition: all 0.2s cubic-bezier(0.195, 0.4, 0.45, 0.785); }
  .block--news .block__content {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    color: white;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
    line-height: 1.25em;
    font-family: "aleo", "Calibri", "Gill Sans", "Trebuchet MS", Arial, sans-serif;
    padding: 2.4390243902%; }
    @media screen and (min-width: 664px) {
      .block--news .block__content {
        font-size: 20px; } }
    @media screen and (min-width: 768px) {
      .block--news .block__content {
        font-size: 24px; } }
    .block--news .block__content svg {
      margin-left: 0.125em;
      margin-bottom: -0.125em; }
  a.block--news:focus .block__content, a.block--news:hover .block__content {
    text-decoration: underline; }
  a.block--news:focus .block__image, a.block--news:hover .block__image {
    transform: scale(1.1); }
    a.block--news:focus .block__image:after, a.block--news:hover .block__image:after {
      height: 115%;
      opacity: 0.7; }

/**
 * Missed block
 */
.missed-block {
  position: relative;
  background: white;
  color: black;
  padding: 10px;
  transition: all 0.2s cubic-bezier(0.195, 0.4, 0.45, 0.785); }
  .missed-block a {
    text-decoration: none; }
  .missed-block .color-inherit:focus, .missed-block .color-inherit:hover {
    text-decoration: underline; }

/**
 * Circle button
 */
.circle-button {
  display: inline-block;
  width: 32px;
  height: 32px;
  border-radius: 16px;
  line-height: 28px;
  border: 2px solid #003576;
  color: white;
  background: #003576;
  text-align: center; }
  .circle-button svg {
    vertical-align: middle; }
  .circle-button:focus, .circle-button:hover {
    background: white;
    color: #003576; }

.circle-button--inverse {
  border: 2px solid white;
  color: #003576;
  background: white; }
  .circle-button--inverse:focus, .circle-button--inverse:hover {
    border-color: #003576; }

.circle-button--small-icon {
  font-size: 14px;
  line-height: 14px; }
  .circle-button--small-icon svg {
    margin-left: 2px;
    margin-top: -1px; }

/**
 * Utilities
 */
.hide-on-mobile.hide-on-mobile.hide-on-mobile {
  display: none; }
  @media screen and (min-width: 664px) {
    .hide-on-mobile.hide-on-mobile.hide-on-mobile {
      display: block; } }

.hide-until-desktop.hide-until-desktop.hide-until-desktop {
  display: none; }
  @media screen and (min-width: 768px) {
    .hide-until-desktop.hide-until-desktop.hide-until-desktop {
      display: block; }
      .hide-until-desktop.hide-until-desktop.hide-until-desktop.flag-object__aside {
        display: table-cell; } }

.hide-until-delta.hide-until-delta.hide-until-delta {
  display: none; }
  @media screen and (min-width: 988px) {
    .hide-until-delta.hide-until-delta.hide-until-delta {
      display: block; }
      .hide-until-delta.hide-until-delta.hide-until-delta.flag-object__aside {
        display: table-cell; } }

.font-small.font-small {
  font-size: 14px;
  line-height: 1.4em;
  font-weight: bold; }

.color-inherit.color-inherit {
  color: inherit; }

.spaced.spaced {
  padding: 10px; }
  @media screen and (min-width: 664px) {
    .spaced.spaced {
      padding: 19px; } }
  @media screen and (min-width: 768px) {
    .spaced.spaced {
      padding: 28px; } }

.overflow-hidden.overflow-hidden.overflow-hidden {
  overflow: hidden; }

.sterad-container {
  margin-top: -0.5em;
  margin-bottom: 1em; }

/**
 * Artikelen pagina
 */
.path-themas {
  background: white; }
  .path-themas .image-placeholder-16-9 {
    transition: all 0.2s cubic-bezier(0.195, 0.4, 0.45, 0.785); }
  .path-themas .responsive-item {
    border-top: none; }
    .path-themas .responsive-item:focus .image-placeholder-16-9, .path-themas .responsive-item:hover .image-placeholder-16-9 {
      transform: scale(1.1); }
    .path-themas .responsive-item .heading--large {
      font-size: 16px;
      line-height: 20px; }
    .path-themas .responsive-item .heading--tiny {
      font-size: 14px;
      line-height: 18px; }
    @media screen and (min-width: 664px) {
      .path-themas .responsive-item .heading--large {
        font-size: 20px;
        line-height: 28px; }
      .path-themas .responsive-item .heading--tiny {
        font-size: 16px;
        line-height: 24px; } }
    @media screen and (min-width: 988px) {
      .path-themas .responsive-item .heading--large {
        font-size: 24px;
        line-height: 32px;
        margin: 0.25em 0; } }
  .path-themas .responsive-item__image {
    width: 100px; }
    @media screen and (min-width: 664px) {
      .path-themas .responsive-item__image {
        width: 120px; } }
    @media screen and (min-width: 988px) {
      .path-themas .responsive-item__image {
        width: 220px; } }
  .path-themas .responsive-item__body {
    padding: 0 0 0 1em; }

.theme-heading {
  display: inline-block;
  padding: 0.25em 0.5em;
  border: 2px solid #003576;
  font-size: 15px;
  line-height: 20px;
  cursor: pointer; }
  @media screen and (min-width: 664px) {
    .theme-heading {
      padding: 0;
      border: none;
      cursor: default;
      font-family: "aleo", "Calibri", "Gill Sans", "Trebuchet MS", Arial, sans-serif;
      font-weight: 700;
      font-size: 22px;
      line-height: 33px; } }
  @media screen and (min-width: 988px) {
    .theme-heading {
      font-size: 24px;
      line-height: 36px; } }
  .theme-heading svg {
    width: 12px;
    height: 12px;
    vertical-align: middle;
    margin-left: 8px;
    margin-top: -2px; }
    @media screen and (min-width: 664px) {
      .theme-heading svg {
        display: none; } }
  .theme-heading.is-toggled svg {
    transform: rotate(180deg); }

.theme-list {
  margin: 0;
  padding: 0;
  list-style: none;
  border: none;
  background: transparent;
  display: none; }
  .theme-list.is-toggled {
    display: block; }
  @media screen and (min-width: 664px) {
    .theme-list {
      display: block; } }
  .theme-list li {
    border-top: 1px solid rgba(0, 53, 118, 0.5);
    font-size: 16px;
    font-family: "aleo", "Calibri", "Gill Sans", "Trebuchet MS", Arial, sans-serif;
    font-weight: 700; }
  .theme-list a {
    display: block;
    color: black;
    text-decoration: none;
    padding: 0.33em 0; }
    .theme-list a:focus, .theme-list a:hover {
      text-decoration: underline; }

/* App specific styling */
.app {
  /* Give the play button rounded corners when the add button is gone */
  /* Give the play button rounded corners when the add button is gone */
  /* Only show buttons on app */ }
  .app .button-group--vertical .button:first-child, .app .button-group--vertical .block-share__item:first-child {
    border-radius: 0 0 0 4px; }
  .app .button-group .button--inactive:only-child {
    border-radius: 4px; }
  .app .button-group .button--inactive:only-child {
    border-right: 1px solid #aaaaaa; }
  .app .container-utilities:before, .app .container-utilities:after {
    display: table;
    content: " "; }
  .app .container-utilities:after {
    clear: both; }
  .app .container-utilities .back-button {
    position: static;
    float: left;
    display: block; }
  .app .container-utilities .backtotop-button {
    position: static;
    float: right; }
    .app .container-utilities .backtotop-button.is-hidden {
      opacity: 1;
      transform: translateY(0);
      z-index: 0; }
  .app .footer {
    padding-bottom: 60px; }
    @media screen and (min-width: 988px) {
      .app .footer {
        padding-bottom: 80px; } }

/* Three times to win over most other classes without using !important */
.no-margin-bottom.no-margin-bottom {
  margin-bottom: 0; }

.margin-top-micro.margin-top-micro {
  margin-top: 5px; }

.margin-top-medium.margin-top-medium {
  margin-top: 30px; }

.margin-bottom-micro.margin-bottom-micro {
  margin-bottom: 5px; }

.margin-bottom-tiny.margin-bottom-tiny {
  margin-bottom: 10px; }

.margin-bottom-small.margin-bottom-small {
  margin-bottom: 15px; }

.margin-bottom-medium.margin-bottom-medium {
  margin-bottom: 30px; }

.margin-bottom-large.margin-bottom-large {
  margin-bottom: 60px; }

.margin-right-tiny.margin-right-tiny {
  margin-right: 10px; }

.normal-weight.normal-weight {
  font-weight: 400; }

.no-padding-top.no-padding-top {
  padding-top: 0; }

.no-padding-bottom.no-padding-bottom {
  padding-bottom: 0; }

.no-margin.no-margin {
  margin: 0; }

.no-padding.no-padding {
  padding: 0; }

.padding-left.padding-left {
  padding-left: 10px; }

.no-padding-right.no-padding-right {
  padding-right: 0; }

.no-padding-bottom.no-padding-bottom {
  padding-bottom: 0; }

.padding-top-medium.padding-top-medium {
  padding-top: 30px; }

.padding-bottom-medium.padding-bottom-medium {
  padding-bottom: 30px; }

.center-content.center-content {
  text-align: center; }

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

.position-relative.position-relative {
  position: relative; }

.position-static.position-static {
  position: static; }

.no-background.no-background {
  background: transparent; }

.has-no-items {
  margin-bottom: 10px; }
  @media screen and (min-width: 664px) {
    .has-no-items {
      margin-bottom: 19px; } }
  @media screen and (min-width: 768px) {
    .has-no-items {
      margin-bottom: 28px; } }

.white-background {
  background: white; }
  .white-background:before, .white-background:after {
    display: table;
    content: " "; }
  .white-background:after {
    clear: both; }

.alt-link {
  color: #003576; }

.type-light.type-light.type-light {
  color: #777777; }

.type-light-inverse.type-light-inverse.type-light-inverse {
  color: #aaaaaa; }

.overflow {
  display: block;
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis; }

.coverall-1pixel-negative {
  position: absolute;
  top: -1px;
  right: -1px;
  bottom: -1px;
  left: -1px;
  padding: 1px;
  overflow: hidden; }

/* dropdown parents should have higer z-index to always be on top */
.has-active-dropdown.has-active-dropdown.has-active-dropdown {
  z-index: 2; }

/* Hidden classes */
.is-hidden.is-hidden {
  display: none; }

.hidden-mobile {
  display: none; }
  @media screen and (min-width: 440px) {
    .hidden-mobile {
      display: inline; } }

.hidden-until-beta {
  display: none; }
  @media screen and (min-width: 664px) {
    .hidden-until-beta {
      display: inline; } }

.vertical-align {
  display: -ms-flexbox;
  display: flex;
  vertical-align: baseline; }

.vertical-align__aside {
  margin-left: auto; }

.vertical-align__body {
  display: inline-block;
  vertical-align: middle;
  line-height: 1; }

@media screen and (min-width: 664px) {
  .float-right-from-beta {
    float: right;
    width: auto; } }

.float-right {
  float: right; }