/* ========================================================================== */
/*                                   FONT-MIXINS                                   */
/* ========================================================================== */
/*------------------------------------*\
    MAIN
\*------------------------------------*/
/* global box-sizing */
*,
*:after,
*:before {
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility; }

/* html element 62.5% font-size for REM use */
html {
  font-size: 62.5%; }

body {
  font: 300 14px/1.4 "Westeinde Caption", "Helvetica Neue", Helvetica, Arial, sans-serif;
  color: #000; }

/* clear */
.clear:before,
.clear:after {
  content: " ";
  display: table; }

.clear:after {
  clear: both; }

.clear {
  *zoom: 1; }

img {
  max-width: 100%;
  vertical-align: bottom; }

a {
  color: #000;
  text-decoration: none;
  cursor: pointer; }
  a:hover {
    color: #000; }
  a:focus, a:hover, a:active {
    outline: 0; }

input:focus {
  outline: 0;
  border: 1px solid #888; }

input::selection {
  color: #888;
  background-color: #aaa; }

button {
  background: transparent;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  padding: 0;
  border: 0; }
  button:focus {
    outline: none; }

object {
  pointer-events: none; }

/* -------------------------------------------------------------------------- */
/*                              GLOBAL VARIABLES                              */
/* -------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------- */
/*                              other mixins                              */
/* -------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------- */
/*                                  STRUCTURE                                 */
/* -------------------------------------------------------------------------- */
/* wrapper */
.wrapper {
  margin: 0 auto;
  position: relative;
  width: 100vw;
  height: 100vh;
  /* -------------------------------------------------------------------------- */
  /*                                   header                                   */
  /* -------------------------------------------------------------------------- */
  /* -------------------------------------------------------------------------- */
  /*                             STRUCTURE ALL PAGE                             */
  /* -------------------------------------------------------------------------- */ }
  .wrapper .header {
    position: fixed;
    top: 0;
    width: 100vw;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    z-index: 3;
    /* -------------------------------------------------------------------------- */
    /*                              header elements                             */
    /* -------------------------------------------------------------------------- */
    /* ========================================================================== */
    /*                                   SEARCH                                   */
    /* ========================================================================== */
    /* ========================================================================== */
    /*                                    MENUS                                    */
    /* ========================================================================== */
    /* ------------------------------- bedo circle ------------------------------ */ }
    @media (min-width: 769px) {
      .wrapper .header {
        height: 0;
        position: relative;
        width: 0; }
        .wrapper .header::before {
          display: none; } }
    .wrapper .header .header-1,
    .wrapper .header .header-2 {
      display: flex;
      flex-direction: row;
      align-items: center; }
      @media (min-width: 769px) {
        .wrapper .header .header-1,
        .wrapper .header .header-2 {
          width: 10rem;
          position: fixed;
          top: 0;
          height: 100vh;
          flex-direction: column;
          flex: 0 0 auto !important;
          padding: 2rem !important;
          justify-content: space-between !important;
          align-content: space-between;
          z-index: 3100;
          background: #fff; }
          .wrapper .header .header-1 > div:not(#sidebar),
          .wrapper .header .header-2 > div:not(#sidebar) {
            filter: invert(100); } }
      .wrapper .header .header-1 div,
      .wrapper .header .header-2 div {
        z-index: 3500; }
      .wrapper .header .header-1 a,
      .wrapper .header .header-2 a {
        display: inline-block; }
    .wrapper .header .header-1 {
      justify-content: space-between;
      flex: 1 1 auto;
      padding: 2rem 0 2rem 2rem; }
      @media (min-width: 769px) {
        .wrapper .header .header-1 {
          border-right: #000 1px solid; } }
    .wrapper .header .header-2 {
      justify-content: flex-end;
      flex: 0 1 auto;
      padding: 2rem 2rem 2rem 0; }
      @media (min-width: 769px) {
        .wrapper .header .header-2 {
          order: 99;
          border-left: #000 1px solid;
          right: 0; } }
    .wrapper .header .totop {
      position: fixed;
      bottom: 1rem;
      right: 1rem;
      z-index: 2; }
      @media (min-width: 769px) {
        .wrapper .header .totop {
          display: none; } }
      .wrapper .header .totop a {
        display: inline-block; }
        .wrapper .header .totop a object {
          height: 2rem;
          filter: invert(100%);
          -moz-transform: rotate(180deg);
          -o-transform: rotate(180deg);
          -ms-transform: rotate(180deg);
          -webkit-transform: rotate(180deg);
          transform: rotate(180deg); }
    .wrapper .header object {
      height: 3rem; }
    @media (min-width: 769px) {
      .wrapper .header .header-1 > div,
      .wrapper .header .header-2 > div {
        flex: 0 0 5rem !important; } }
    .wrapper .header .logo object {
      height: 5rem; }
    .wrapper .header .events-link {
      display: none; }
      @media (min-width: 769px) {
        .wrapper .header .events-link {
          display: block; } }
    .wrapper .header .menubutton {
      order: 99;
      z-index: 3001; }
      .wrapper .header .menubutton button {
        transform-origin: center;
        -webkit-transition: 0.5s linear;
        -moz-transition: 0.5s linear;
        -o-transition: 0.5s linear;
        transition: 0.5s linear; }
        .wrapper .header .menubutton button.rotated {
          -moz-transform: rotate(225deg);
          -o-transform: rotate(225deg);
          -ms-transform: rotate(225deg);
          -webkit-transform: rotate(225deg);
          transform: rotate(225deg); }
          @media (min-width: 769px) {
            .wrapper .header .menubutton button.rotated {
              filter: invert(100); } }
      @media (min-width: 769px) {
        .wrapper .header .menubutton {
          order: unset; } }
    .wrapper .header .social-link {
      margin: 0 2rem 0 0; }
      .wrapper .header .social-link.hidden {
        display: none !important; }
      @media (min-width: 769px) {
        .wrapper .header .social-link {
          margin: 0; } }
    .wrapper .header .search-box {
      display: none; }
      @media (min-width: 769px) {
        .wrapper .header .search-box {
          display: block;
          flex: 1 1 0 !important; } }
    @media (min-width: 769px) {
      .wrapper .header .search-bar {
        display: none;
        position: absolute;
        width: 0;
        left: 7rem;
        top: 0; } }
    .wrapper .header .search-bar form.search {
      display: flex;
      flex-direction: row;
      border-bottom: #fff 1px solid; }
      .wrapper .header .search-bar form.search input {
        font: 900 4rem "Westeinde Caption";
        color: #000;
        -webkit-text-stroke: #fff 1px;
        background-color: #000;
        padding: 0;
        border: none;
        caret-color: #fff;
        flex: 1 1 auto;
        width: 1rem; }
        .wrapper .header .search-bar form.search input:hover {
          color: #fff; }
        @media (min-width: 769px) {
          .wrapper .header .search-bar form.search input {
            font-size: 2.5rem; } }
      .wrapper .header .search-bar form.search button {
        flex: 0 0 auto; }
        @media (min-width: 769px) {
          .wrapper .header .search-bar form.search button {
            display: none; } }
    .wrapper .header .header-scroll {
      display: none; }
    .wrapper .header #sidebar {
      padding-top: 9rem !important;
      background-color: #000; }
      @media (min-width: 769px) {
        .wrapper .header #sidebar {
          padding: 0 !important; } }
      .wrapper .header #sidebar .sidebar-wrapper {
        position: relative;
        height: 100%;
        overflow: auto;
        padding: 0 4rem; }
        @media (min-width: 769px) {
          .wrapper .header #sidebar .sidebar-wrapper {
            padding: 4rem; } }
        .wrapper .header #sidebar .sidebar-wrapper ul {
          margin-block-start: 0;
          margin-block-end: 0;
          margin-inline-start: 0;
          margin-inline-end: 0px;
          padding-inline-start: 0; }
          @media (min-width: 769px) {
            .wrapper .header #sidebar .sidebar-wrapper ul {
              display: flex;
              flex-direction: column;
              flex-wrap: wrap;
              height: 100%;
              justify-content: space-evenly; } }
        .wrapper .header #sidebar .sidebar-wrapper li {
          display: block;
          padding-top: 2rem; }
          @media (min-width: 769px) {
            .wrapper .header #sidebar .sidebar-wrapper li {
              width: 50%;
              padding: 3rem 0; } }
          .wrapper .header #sidebar .sidebar-wrapper li a {
            font: 900 4rem "Westeinde Caption";
            color: #000;
            -webkit-text-stroke: #fff 1px; }
            .wrapper .header #sidebar .sidebar-wrapper li a:hover {
              color: #fff; }
            @media (min-width: 769px) {
              .wrapper .header #sidebar .sidebar-wrapper li a {
                font-size: 2.5rem; } }
    .wrapper .header #tag-nav {
      display: none;
      position: fixed;
      right: calc(10rem* 2);
      top: calc(4rem/ 2);
      z-index: 1000; }
      @media (min-width: 769px) {
        .wrapper .header #tag-nav {
          display: block; } }
      .wrapper .header #tag-nav ul {
        padding: 0;
        margin: 0;
        font: 900 1rem "Westeinde Caption";
        color: transparent;
        -webkit-text-stroke: #000 1px;
        text-transform: uppercase; }
        .wrapper .header #tag-nav ul li {
          display: inline; }
          .wrapper .header #tag-nav ul li a span {
            height: calc(4rem/ 2);
            position: absolute;
            left: 0;
            top: 0;
            transform-origin: bottom center;
            font: 900 1rem "Westeinde Caption";
            color: transparent;
            -webkit-text-stroke: #000 1px;
            text-transform: uppercase; }
            .wrapper .header #tag-nav ul li a span.char1 {
              -moz-transform: rotate(21.17647deg);
              -o-transform: rotate(21.17647deg);
              -ms-transform: rotate(21.17647deg);
              -webkit-transform: rotate(21.17647deg);
              transform: rotate(21.17647deg); }
            .wrapper .header #tag-nav ul li a span.char2 {
              -moz-transform: rotate(42.35294deg);
              -o-transform: rotate(42.35294deg);
              -ms-transform: rotate(42.35294deg);
              -webkit-transform: rotate(42.35294deg);
              transform: rotate(42.35294deg); }
            .wrapper .header #tag-nav ul li a span.char3 {
              -moz-transform: rotate(63.52941deg);
              -o-transform: rotate(63.52941deg);
              -ms-transform: rotate(63.52941deg);
              -webkit-transform: rotate(63.52941deg);
              transform: rotate(63.52941deg); }
            .wrapper .header #tag-nav ul li a span.char4 {
              -moz-transform: rotate(84.70588deg);
              -o-transform: rotate(84.70588deg);
              -ms-transform: rotate(84.70588deg);
              -webkit-transform: rotate(84.70588deg);
              transform: rotate(84.70588deg); }
            .wrapper .header #tag-nav ul li a span.char5 {
              -moz-transform: rotate(105.88235deg);
              -o-transform: rotate(105.88235deg);
              -ms-transform: rotate(105.88235deg);
              -webkit-transform: rotate(105.88235deg);
              transform: rotate(105.88235deg); }
            .wrapper .header #tag-nav ul li a span.char6 {
              -moz-transform: rotate(127.05882deg);
              -o-transform: rotate(127.05882deg);
              -ms-transform: rotate(127.05882deg);
              -webkit-transform: rotate(127.05882deg);
              transform: rotate(127.05882deg); }
            .wrapper .header #tag-nav ul li a span.char7 {
              -moz-transform: rotate(148.23529deg);
              -o-transform: rotate(148.23529deg);
              -ms-transform: rotate(148.23529deg);
              -webkit-transform: rotate(148.23529deg);
              transform: rotate(148.23529deg); }
            .wrapper .header #tag-nav ul li a span.char8 {
              -moz-transform: rotate(169.41176deg);
              -o-transform: rotate(169.41176deg);
              -ms-transform: rotate(169.41176deg);
              -webkit-transform: rotate(169.41176deg);
              transform: rotate(169.41176deg); }
            .wrapper .header #tag-nav ul li a span.char9 {
              -moz-transform: rotate(190.58824deg);
              -o-transform: rotate(190.58824deg);
              -ms-transform: rotate(190.58824deg);
              -webkit-transform: rotate(190.58824deg);
              transform: rotate(190.58824deg); }
            .wrapper .header #tag-nav ul li a span.char10 {
              -moz-transform: rotate(211.76471deg);
              -o-transform: rotate(211.76471deg);
              -ms-transform: rotate(211.76471deg);
              -webkit-transform: rotate(211.76471deg);
              transform: rotate(211.76471deg); }
            .wrapper .header #tag-nav ul li a span.char11 {
              -moz-transform: rotate(232.94118deg);
              -o-transform: rotate(232.94118deg);
              -ms-transform: rotate(232.94118deg);
              -webkit-transform: rotate(232.94118deg);
              transform: rotate(232.94118deg); }
            .wrapper .header #tag-nav ul li a span.char12 {
              -moz-transform: rotate(254.11765deg);
              -o-transform: rotate(254.11765deg);
              -ms-transform: rotate(254.11765deg);
              -webkit-transform: rotate(254.11765deg);
              transform: rotate(254.11765deg); }
            .wrapper .header #tag-nav ul li a span.char13 {
              -moz-transform: rotate(275.29412deg);
              -o-transform: rotate(275.29412deg);
              -ms-transform: rotate(275.29412deg);
              -webkit-transform: rotate(275.29412deg);
              transform: rotate(275.29412deg); }
            .wrapper .header #tag-nav ul li a span.char14 {
              -moz-transform: rotate(296.47059deg);
              -o-transform: rotate(296.47059deg);
              -ms-transform: rotate(296.47059deg);
              -webkit-transform: rotate(296.47059deg);
              transform: rotate(296.47059deg); }
            .wrapper .header #tag-nav ul li a span.char15 {
              -moz-transform: rotate(317.64706deg);
              -o-transform: rotate(317.64706deg);
              -ms-transform: rotate(317.64706deg);
              -webkit-transform: rotate(317.64706deg);
              transform: rotate(317.64706deg); }
            .wrapper .header #tag-nav ul li a span.char16 {
              -moz-transform: rotate(338.82353deg);
              -o-transform: rotate(338.82353deg);
              -ms-transform: rotate(338.82353deg);
              -webkit-transform: rotate(338.82353deg);
              transform: rotate(338.82353deg); }
            .wrapper .header #tag-nav ul li a span.char17 {
              -moz-transform: rotate(360deg);
              -o-transform: rotate(360deg);
              -ms-transform: rotate(360deg);
              -webkit-transform: rotate(360deg);
              transform: rotate(360deg); }
  .wrapper main {
    z-index: 1; }
    .wrapper main section {
      /* -------------------------------- load more ------------------------------- */ }
      .wrapper main section article {
        position: relative; }
        .wrapper main section article .metadata {
          position: absolute;
          background-color: #fff;
          padding: 2rem;
          bottom: 49%;
          right: 0;
          width: 50vw;
          text-align: center;
          font: bold 1rem "Westeinde Caption";
          color: #000;
          z-index: 1; }
          .wrapper main section article .metadata::after {
            content: "";
            display: block;
            position: absolute;
            background-color: transparent;
            width: 0;
            height: 0;
            left: -5rem;
            top: -5rem;
            border-top: 5rem solid transparent;
            border-left: 5rem solid transparent;
            border-right: 5rem solid transparent;
            border-bottom: 5rem solid #fff;
            position: absolute;
            z-index: -1; }
      @media (min-width: 769px) {
        .wrapper main section .misha_loadmore {
          width: 10rem;
          margin-right: 10rem;
          align-self: stretch;
          display: flex;
          flex-direction: row;
          justify-content: center;
          align-items: center;
          height: 100%; } }
      .wrapper main section .misha_loadmore a,
      .wrapper main section .misha_loadmore p {
        font: bold 3rem "Westeinde Caption";
        color: #fff;
        -webkit-text-stroke: #000 1px; }
        @media (-webkit-min-device-pixel-ratio: 2.1) {
          .wrapper main section .misha_loadmore a,
          .wrapper main section .misha_loadmore p {
            font-size: 2rem !important; } }
        @media (min-width: 769px) {
          .wrapper main section .misha_loadmore a,
          .wrapper main section .misha_loadmore p {
            font-size: 3rem; } }
        @media (min-width: 769px) {
          .wrapper main section .misha_loadmore a,
          .wrapper main section .misha_loadmore p {
            transform-origin: center;
            white-space: nowrap;
            width: 100vh;
            -moz-transform: rotate(-90deg);
            -o-transform: rotate(-90deg);
            -ms-transform: rotate(-90deg);
            -webkit-transform: rotate(-90deg);
            transform: rotate(-90deg); } }

.touchevents .header-scroll {
  display: none !important; }

/* -------------------------------------------------------------------------- */
/*                                  HOMEPAGE                                  */
/* -------------------------------------------------------------------------- */
@media (min-width: 769px) {
  .home {
    overflow-y: hidden; } }

.home .wrapper {
  /* ----------------------------- header on home ----------------------------- */ }
  @media (min-width: 769px) {
    .home .wrapper {
      overflow-y: hidden;
      width: fit-content; } }
  @media (min-width: 769px) {
    .home .wrapper .header .header-scroll {
      display: block;
      position: fixed;
      height: 100vh;
      width: 10rem;
      flex: 1 0 auto !important;
      top: 0; } }
  .home .wrapper .header .header-scroll.header-scroll-left {
    left: 10rem; }
    .home .wrapper .header .header-scroll.header-scroll-left button {
      cursor: url("../img/arrow-black-left.png"), w-resize; }
  .home .wrapper .header .header-scroll.header-scroll-right {
    right: 10rem; }
    .home .wrapper .header .header-scroll.header-scroll-right button {
      cursor: url("../img/arrow-black-right.png"), e-resize; }
  .home .wrapper .header .header-scroll button {
    height: 100vh;
    width: 10rem; }

@media (min-width: 769px) {
  .home main {
    height: 100vh;
    width: fit-content;
    position: relative; } }

.home main section {
  /* --------------------------- home article mobile/default -------------------------- */
  /* ------------------------ home article desktop big ------------------------ */
  /* ----------------------- home article desktop small ----------------------- */ }
  @media (min-width: 769px) {
    .home main section {
      display: flex;
      flex-direction: row;
      margin: 0;
      height: 100vh;
      width: fit-content; } }
  .home main section article {
    height: 100vh; }
    @media (min-width: 769px) {
      .home main section article > a {
        margin: 0;
        padding: 0;
        border: none;
        display: inline-block; }
      .home main section article .thumbnailwrapper img.attachment-home-thumbnail {
        height: 50vh;
        width: 100vw;
        object-fit: cover; }
      .home main section article h2 {
        width: 100%;
        height: 50vh;
        padding: 2rem;
        padding-top: 3rem;
        margin: 0; }
        .home main section article h2 a {
          font: bold 3rem "Westeinde Caption";
          color: #000; } }
    @media (min-width: 769px) and (-webkit-min-device-pixel-ratio: 2.1) {
      .home main section article h2 a {
        font-size: 2.5rem !important; } }
    @media (min-width: 769px) and (min-width: 769px) {
      .home main section article h2 a {
        font-size: 5rem; } }
  @media (min-width: 769px) {
    .home main section .home-wrapper-big {
      flex: 0 0 auto; }
      .home main section .home-wrapper-big article {
        position: relative;
        width: calc(100vw - (10rem * 3));
        margin: 0;
        padding: 0;
        margin-left: 10rem;
        padding-top: 4rem;
        border-right: #000 1px solid;
        /* -------------------------------- thumbnail and title ------------------------------- */
        /* -------------------------- home article metadata big------------------------- */
        /* ------------------------- home article big hover ------------------------- */ }
        .home main section .home-wrapper-big article .thumbnailwrapper {
          height: calc(100% - 4rem);
          display: flex;
          flex-direction: row;
          justify-content: flex-start;
          border-top: 1px #000 solid; }
          .home main section .home-wrapper-big article .thumbnailwrapper img.attachment-home-big-thumbnail {
            object-fit: cover;
            width: 50%;
            height: 100%; }
        .home main section .home-wrapper-big article h2 {
          height: unset;
          position: absolute;
          top: 6rem;
          padding: 4rem; }
        .home main section .home-wrapper-big article .metadata {
          bottom: 0;
          background: transparent;
          width: 100%;
          height: 10rem;
          display: flex;
          flex-direction: row;
          padding: 0;
          justify-content: flex-start;
          align-items: stretch; }
          .home main section .home-wrapper-big article .metadata::after {
            position: absolute;
            top: 0;
            border: none;
            width: calc(100% - 4rem);
            border-top: #000 1px solid;
            left: calc(4rem);
            background-color: transparent;
            margin-left: -0; }
          .home main section .home-wrapper-big article .metadata::before {
            display: block;
            content: "";
            position: absolute;
            width: calc(4rem);
            height: calc(4rem);
            top: 0;
            left: -0;
            border-left: #000 solid 1px;
            border-top: #000 1px solid;
            -moz-transform: skewX(-45deg);
            -o-transform: skewX(-45deg);
            -ms-transform: skewX(-45deg);
            -webkit-transform: skewX(-45deg);
            transform: skewX(-45deg);
            transform-origin: left bottom;
            background-color: transparent;
            z-index: 9; }
          .home main section .home-wrapper-big article .metadata > div {
            width: 30%;
            padding-top: 2rem; } }
      @media (min-width: 769px) and (-webkit-min-device-pixel-ratio: 2.1) {
        .home main section .home-wrapper-big article .metadata {
          height: calc(10rem / 2); } }
  @media (min-width: 769px) {
          .home main section .home-wrapper-big article .metadata .categories {
            display: none;
            display: block;
            border-right: #000 solid 1px; }
        .home main section .home-wrapper-big article.hovered {
          width: calc(100vw - (10rem * 2)); }
          .home main section .home-wrapper-big article.hovered h2 > a {
            color: #000; }
    .home main section .home-wrapper-1 article a.thumbnailwrapper {
      justify-content: flex-end; }
    .home main section .home-wrapper-2 article {
      border-left: #000 1px solid; } }
  @media (min-width: 769px) {
    .home main section .home-wrapper-small {
      width: calc(100vw - (10rem * 3));
      height: calc((100vw - (10rem * 3)) / 3 * 2);
      flex-shrink: 0;
      display: flex;
      flex-direction: row;
      flex-wrap: wrap;
      margin: auto 0; }
      .home main section .home-wrapper-small:nth-child(3) {
        margin-left: 10rem; }
      .home main section .home-wrapper-small article {
        flex: 0 0 calc(100% / 3);
        height: 50%;
        position: relative; }
        .home main section .home-wrapper-small article .thumbnailwrapper {
          width: 100%;
          height: 100%; }
          .home main section .home-wrapper-small article .thumbnailwrapper img {
            width: 100%;
            height: 100%;
            object-fit: cover; }
        .home main section .home-wrapper-small article .metadata {
          width: 100%;
          height: 20%;
          position: absolute;
          bottom: 0;
          right: 0;
          background: transparent;
          display: flex;
          flex-direction: row;
          padding: 0;
          justify-content: flex-end;
          align-items: stretch;
          display: none; }
          .home main section .home-wrapper-small article .metadata::after {
            position: absolute;
            top: 0;
            border: none;
            width: calc(100% - 4rem);
            border-top: #000 1px solid;
            left: calc(4rem);
            background-color: transparent;
            margin-left: -0; }
          .home main section .home-wrapper-small article .metadata::before {
            display: block;
            content: "";
            position: absolute;
            width: calc(4rem);
            height: calc(4rem);
            top: 0;
            left: -0;
            border-left: #000 solid 1px;
            border-top: #000 1px solid;
            -moz-transform: skewX(-45deg);
            -o-transform: skewX(-45deg);
            -ms-transform: skewX(-45deg);
            -webkit-transform: skewX(-45deg);
            transform: skewX(-45deg);
            transform-origin: left bottom;
            background-color: transparent;
            z-index: 9; }
          .home main section .home-wrapper-small article .metadata.vis {
            display: flex; } }
    @media (min-width: 769px) and (min-width: 769px) {
      .home main section .home-wrapper-small article h2,
      .home main section .home-wrapper-small article h2 a {
        font-size: 1.2rem;
        -webkit-text-stroke: #000 1px;
        color: #fff; } }
  @media (min-width: 769px) {
        .home main section .home-wrapper-small article h2 {
          display: none;
          position: absolute;
          top: 0;
          background-color: #fff;
          height: 100%; }
          .home main section .home-wrapper-small article h2 a {
            top: 50%;
            position: absolute; } }

/* -------------------------------------------------------------------------- */
/*                                   single                                   */
/* -------------------------------------------------------------------------- */
@media (min-width: 769px) {
  .single .wrapper {
    height: unset; }
    .single .wrapper .header .header-1,
    .single .wrapper .header .header-2 {
      background: transparent;
      border: none; }
      .single .wrapper .header .header-1 .social-link,
      .single .wrapper .header .header-1 .search-box,
      .single .wrapper .header .header-1 .events-link,
      .single .wrapper .header .header-2 .social-link,
      .single .wrapper .header .header-2 .search-box,
      .single .wrapper .header .header-2 .events-link {
        display: none; } }

.single article {
  /* --------------------------- single sub sections -------------------------- */
  /* ----------------------------- single content ----------------------------- */ }
  @media (min-width: 769px) {
    .single article {
      margin-top: 100vh;
      margin-left: calc(5rem);
      background-color: #fff;
      border-left: #000 solid 1px; } }
  .single article > * {
    padding: 2rem;
    margin: 0; }
    @media (min-width: 769px) {
      .single article > * {
        padding: 2rem 5rem; } }
  .single article .thumbnailwrapper {
    padding: 0; }
    @media (min-width: 769px) {
      .single article .thumbnailwrapper {
        position: fixed;
        top: 0;
        right: 0;
        left: calc(-5rem);
        z-index: -1;
        bottom: 0; } }
    .single article .thumbnailwrapper img.attachment-post-thumbnail {
      height: 75vh;
      width: 100vw;
      object-fit: cover;
      padding: 0; }
      @media (min-width: 769px) {
        .single article .thumbnailwrapper img.attachment-post-thumbnail {
          width: 100%;
          height: 100%; } }
  .single article .titlewrapper {
    position: absolute;
    top: 0;
    width: 100vw;
    height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-content: flex-start;
    padding: 0; }
    @media (min-width: 769px) {
      .single article .titlewrapper {
        position: relative;
        height: unset;
        display: block;
        width: unset; } }
    .single article .titlewrapper .metadata {
      width: calc(100vw - 5rem) !important;
      bottom: unset !important;
      height: 5rem;
      position: relative;
      align-self: flex-end;
      display: flex;
      flex-direction: row;
      justify-content: space-between;
      font: bold 1rem "Westeinde Caption"; }
      @media (min-width: 769px) {
        .single article .titlewrapper .metadata {
          font: 900 2rem "Westeinde Caption";
          color: #fff;
          -webkit-text-stroke: #000 1px; } }
      @media (min-width: 769px) {
        .single article .titlewrapper .metadata {
          top: -5rem;
          background-color: #fff;
          margin-left: 5rem;
          padding-left: 0;
          width: calc(100% - 5rem) !important; }
          .single article .titlewrapper .metadata::after {
            position: absolute;
            top: 0;
            border: none;
            width: calc(100% - 5rem + 5rem);
            border-top: #000 1px solid;
            left: calc(5rem);
            background-color: white;
            margin-left: -5rem; }
          .single article .titlewrapper .metadata::before {
            display: block;
            content: "";
            position: absolute;
            width: calc(5rem);
            height: calc(5rem);
            top: 0;
            left: -5rem;
            border-left: #000 solid 1px;
            border-top: #000 1px solid;
            -moz-transform: skewX(-45deg);
            -o-transform: skewX(-45deg);
            -ms-transform: skewX(-45deg);
            -webkit-transform: skewX(-45deg);
            transform: skewX(-45deg);
            transform-origin: left bottom;
            background-color: white;
            z-index: 9; } }
      .single article .titlewrapper .metadata .time-cat {
        z-index: 10; }
    .single article .titlewrapper h1 {
      margin: 0;
      font: bold 3rem "Butler";
      color: #000;
      min-height: 25vh;
      padding: 2rem;
      background-color: #fff; }
      @media (min-width: 769px) {
        .single article .titlewrapper h1 {
          font-size: 7rem; } }
      @media (min-width: 769px) {
        .single article .titlewrapper h1 {
          position: fixed;
          bottom: 0;
          left: 0;
          right: 0;
          padding: 10rem;
          background-color: transparent;
          z-index: -1; } }
  .single article .title2 {
    display: none; }
    @media (min-width: 769px) {
      .single article .title2 {
        display: block;
        font: bold 3rem "Butler";
        color: #000; } }
  @media (min-width: 769px) and (min-width: 769px) {
    .single article .title2 {
      font-size: 5rem; } }
  .single article hr {
    height: 1px;
    background-color: #ff5f5f;
    padding: 0;
    margin: 0 auto;
    border: none;
    width: 20%; }
    .single article hr.content-wrap {
      width: 40%; }
    .single article hr.content-begin {
      margin-top: calc(25vh + 2rem); }
      @media (min-width: 769px) {
        .single article hr.content-begin {
          margin-top: 0; } }
  .single article strong {
    font-weight: 900; }
  .single article blockquote {
    font: bold 1.8rem "Butler";
    color: #000; }
    .single article blockquote p {
      background: #ff5f5f;
      display: inline;
      padding: 2px 0;
      -moz-box-shadow: 10px 0 #ff5f5f, -5px 0 #ff5f5f;
      -webkit-box-shadow: 10px 0 #ff5f5f, -5px 0 #ff5f5f;
      box-shadow: 10px 0 #ff5f5f, -5px 0 #ff5f5f; }
  .single article .wp-block-image {
    padding: 2rem 0; }
    @media (min-width: 769px) {
      .single article .wp-block-image {
        padding: 2rem 5rem; } }
    .single article .wp-block-image figure {
      position: relative; }
      .single article .wp-block-image figure figcaption {
        bottom: 0 !important; }
        .single article .wp-block-image figure figcaption::after {
          content: "";
          display: block;
          position: absolute;
          background-color: transparent;
          width: 0;
          height: 0;
          right: -5rem;
          top: -5rem;
          border-top: 5rem solid transparent;
          border-left: 5rem solid transparent;
          border-right: 5rem solid transparent;
          border-bottom: 5rem solid #fff;
          position: absolute;
          z-index: -1; }
  .single article .wp-block-image figcaption,
  .single article .wp-block-gallery .blocks-gallery-image figcaption,
  .single article .wp-block-gallery .blocks-gallery-item figcaption {
    background: #fff;
    position: absolute;
    width: calc(100% - 5rem);
    height: 5rem;
    padding: 1rem 2rem;
    margin: 0;
    bottom: unset;
    font: 900 1rem "Westeinde Caption";
    color: #fff;
    -webkit-text-stroke-width: 1px;
    line-height: 1;
    text-align: left;
    overflow: unset;
    display: flex;
    flex-direction: column;
    justify-content: center;
    z-index: 1; }
  .single article .wp-block-gallery {
    padding: 2rem 0; }
    .single article .wp-block-gallery li {
      margin-right: 0; }
      .single article .wp-block-gallery li:nth-child(odd) figcaption::after {
        content: "";
        display: block;
        position: absolute;
        background-color: transparent;
        width: 0;
        height: 0;
        right: -5rem;
        top: -5rem;
        border-top: 5rem solid transparent;
        border-left: 5rem solid transparent;
        border-right: 5rem solid transparent;
        border-bottom: 5rem solid #fff;
        position: absolute;
        z-index: -1; }
      .single article .wp-block-gallery li:nth-child(even) figcaption {
        right: 0;
        top: 0; }
        .single article .wp-block-gallery li:nth-child(even) figcaption::after {
          content: "";
          display: block;
          position: absolute;
          background-color: transparent;
          width: 0;
          height: 0;
          left: -5rem;
          bottom: -5rem;
          border-bottom: 5rem solid transparent;
          border-left: 5rem solid transparent;
          border-right: 5rem solid transparent;
          border-top: 5rem solid #fff;
          position: absolute;
          z-index: -1; }

/* -------------------------------------------------------------------------- */
/*                                 TAG COLORS                                 */
/* -------------------------------------------------------------------------- */
.tag-be .metadata {
  color: #00ffb8 !important; }
  .tag-be .metadata a {
    color: #00ffb8 !important; }

.tag-be blockquote p {
  background: #00ffb8 !important;
  -moz-box-shadow: 10px 0 #00ffb8, -5px 0 #00ffb8 !important;
  -webkit-box-shadow: 10px 0 #00ffb8, -5px 0 #00ffb8 !important;
  box-shadow: 10px 0 #00ffb8, -5px 0 #00ffb8 !important; }

.tag-be hr {
  background-color: #00ffb8 !important; }

.tag-be figcaption {
  -webkit-text-stroke-color: #00ffb8 !important; }

@media (min-width: 769px) {
  .tag-be.home-big h2 a {
    color: #00ffb8; }
  .tag-be.home-big.hovered {
    background-color: #00ffb8 !important; }
  .tag-be.home-small .metadata,
  .tag-be.home-small .metadata a {
    color: #000 !important; } }

@media (min-width: 769px) {
  .tag-be.random .thumbnailwrapper > img {
    -webkit-mask: url(../img/clip/be_desktop.svg);
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: 100%;
    mask: url(../img/clip/be_desktop.svg);
    mask-repeat: no-repeat;
    mask-size: 100%; } }

.tag-do .metadata {
  color: #ff5f5f !important; }
  .tag-do .metadata a {
    color: #ff5f5f !important; }

.tag-do blockquote p {
  background: #ff5f5f !important;
  -moz-box-shadow: 10px 0 #ff5f5f, -5px 0 #ff5f5f !important;
  -webkit-box-shadow: 10px 0 #ff5f5f, -5px 0 #ff5f5f !important;
  box-shadow: 10px 0 #ff5f5f, -5px 0 #ff5f5f !important; }

.tag-do hr {
  background-color: #ff5f5f !important; }

.tag-do figcaption {
  -webkit-text-stroke-color: #ff5f5f !important; }

@media (min-width: 769px) {
  .tag-do.home-big h2 a {
    color: #ff5f5f; }
  .tag-do.home-big.hovered {
    background-color: #ff5f5f !important; }
  .tag-do.home-small .metadata,
  .tag-do.home-small .metadata a {
    color: #000 !important; } }

@media (min-width: 769px) {
  .tag-do.random .thumbnailwrapper > img {
    -webkit-mask: url(../img/clip/do_desktop.svg);
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: 100%;
    mask: url(../img/clip/do_desktop.svg);
    mask-repeat: no-repeat;
    mask-size: 100%; } }

.tag-think .metadata {
  color: #fdff00 !important; }
  .tag-think .metadata a {
    color: #fdff00 !important; }

.tag-think blockquote p {
  background: #fdff00 !important;
  -moz-box-shadow: 10px 0 #fdff00, -5px 0 #fdff00 !important;
  -webkit-box-shadow: 10px 0 #fdff00, -5px 0 #fdff00 !important;
  box-shadow: 10px 0 #fdff00, -5px 0 #fdff00 !important; }

.tag-think hr {
  background-color: #fdff00 !important; }

.tag-think figcaption {
  -webkit-text-stroke-color: #fdff00 !important; }

@media (min-width: 769px) {
  .tag-think.home-big h2 a {
    color: #fdff00; }
  .tag-think.home-big.hovered {
    background-color: #fdff00 !important; }
  .tag-think.home-small .metadata,
  .tag-think.home-small .metadata a {
    color: #000 !important; } }

@media (min-width: 769px) {
  .tag-think.random .thumbnailwrapper > img {
    -webkit-mask: url(../img/clip/think_desktop.svg);
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: 100%;
    mask: url(../img/clip/think_desktop.svg);
    mask-repeat: no-repeat;
    mask-size: 100%; } }

.tag-love .metadata {
  color: #3c00ff !important; }
  .tag-love .metadata a {
    color: #3c00ff !important; }

.tag-love blockquote p {
  background: #3c00ff !important;
  -moz-box-shadow: 10px 0 #3c00ff, -5px 0 #3c00ff !important;
  -webkit-box-shadow: 10px 0 #3c00ff, -5px 0 #3c00ff !important;
  box-shadow: 10px 0 #3c00ff, -5px 0 #3c00ff !important; }

.tag-love hr {
  background-color: #3c00ff !important; }

.tag-love figcaption {
  -webkit-text-stroke-color: #3c00ff !important; }

@media (min-width: 769px) {
  .tag-love.home-big h2 a {
    color: #3c00ff; }
  .tag-love.home-big.hovered {
    background-color: #3c00ff !important; }
  .tag-love.home-small .metadata,
  .tag-love.home-small .metadata a {
    color: #000 !important; } }

@media (min-width: 769px) {
  .tag-love.random .thumbnailwrapper > img {
    -webkit-mask: url(../img/clip/love_desktop.svg);
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: 100%;
    mask: url(../img/clip/love_desktop.svg);
    mask-repeat: no-repeat;
    mask-size: 100%; } }

@media (min-width: 769px) {
  .single .tag-be .metadata {
    color: #fff !important;
    -webkit-text-stroke: #00ffb8 1px !important; } }

@media (min-width: 769px) {
  .single .tag-be .metadata a {
    color: #fff !important;
    -webkit-text-stroke: #00ffb8 1px !important; } }

@media (min-width: 769px) {
  .single .tag-do .metadata {
    color: #fff !important;
    -webkit-text-stroke: #ff5f5f 1px !important; } }

@media (min-width: 769px) {
  .single .tag-do .metadata a {
    color: #fff !important;
    -webkit-text-stroke: #ff5f5f 1px !important; } }

@media (min-width: 769px) {
  .single .tag-think .metadata {
    color: #fff !important;
    -webkit-text-stroke: #fdff00 1px !important; } }

@media (min-width: 769px) {
  .single .tag-think .metadata a {
    color: #fff !important;
    -webkit-text-stroke: #fdff00 1px !important; } }

@media (min-width: 769px) {
  .single .tag-love .metadata {
    color: #fff !important;
    -webkit-text-stroke: #3c00ff 1px !important; } }

@media (min-width: 769px) {
  .single .tag-love .metadata a {
    color: #fff !important;
    -webkit-text-stroke: #3c00ff 1px !important; } }

/* -------------------------------------------------------------------------- */
/*                                   imports                                  */
/* -------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------- */
/*                                   BUTLER                                   */
/* -------------------------------------------------------------------------- */
@font-face {
  font-family: "Butler";
  src: url("../fonts/Butler-UltraLight.woff2") format("woff2"), url("../fonts/Butler-UltraLight.woff") format("woff");
  font-weight: 200;
  font-style: normal; }

@font-face {
  font-family: "Butler";
  src: url("../fonts/Butler-Light.woff2") format("woff2"), url("../fonts/Butler-Light.woff") format("woff");
  font-weight: 300;
  font-style: normal; }

@font-face {
  font-family: "Butler";
  src: url("../fonts/Butler.woff2") format("woff2"), url("../fonts/Butler.woff") format("woff");
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: "Butler";
  src: url("../fonts/Butler-Medium.woff2") format("woff2"), url("../fonts/Butler-Medium.woff") format("woff");
  font-weight: 500;
  font-style: normal; }

@font-face {
  font-family: "Butler";
  src: url("../fonts/Butler-Bold.woff2") format("woff2"), url("../fonts/Butler-Bold.woff") format("woff");
  font-weight: bold;
  font-style: normal; }

@font-face {
  font-family: "Butler";
  src: url("../fonts/Butler-ExtraBold.woff2") format("woff2"), url("../fonts/Butler-ExtraBold.woff") format("woff");
  font-weight: 800;
  font-style: normal; }

@font-face {
  font-family: "Butler";
  src: url("../fonts/Butler-Black.woff2") format("woff2"), url("../fonts/Butler-Black.woff") format("woff");
  font-weight: 900;
  font-style: normal; }

/* -------------------------------------------------------------------------- */
/*                                  westeinde                                 */
/* -------------------------------------------------------------------------- */
@font-face {
  font-family: "Westeinde Caption";
  src: url("../fonts/WesteindeCaption-Thin.woff2") format("woff2"), url("../fonts/WesteindeCaption-Thin.woff") format("woff");
  font-weight: 100;
  font-style: normal; }

@font-face {
  font-family: "Westeinde Caption";
  src: url("../fonts/WesteindeCaption-ThinItalic.woff2") format("woff2"), url("../fonts/WesteindeCaption-ThinItalic.woff") format("woff");
  font-weight: 100;
  font-style: italic; }

@font-face {
  font-family: "Westeinde Caption";
  src: url("../fonts/WesteindeCaption-Light.woff2") format("woff2"), url("../fonts/WesteindeCaption-Light.woff") format("woff");
  font-weight: 300;
  font-style: normal; }

@font-face {
  font-family: "Westeinde Caption";
  src: url("../fonts/WesteindeCaption-LightItalic.woff2") format("woff2"), url("../fonts/WesteindeCaption-LightItalic.woff") format("woff");
  font-weight: 300;
  font-style: italic; }

@font-face {
  font-family: "Westeinde Caption";
  src: url("../fonts/WesteindeCaption-Regular.woff2") format("woff2"), url("../fonts/WesteindeCaption-Regular.woff") format("woff");
  font-weight: 500;
  font-style: normal; }

@font-face {
  font-family: "Westeinde Caption";
  src: url("../fonts/WesteindeCaption-Bold.woff2") format("woff2"), url("../fonts/WesteindeCaption-Bold.woff") format("woff");
  font-weight: bold;
  font-style: normal; }

@font-face {
  font-family: "Westeinde Caption";
  src: url("../fonts/WesteindeCaption-BoldItalic.woff2") format("woff2"), url("../fonts/WesteindeCaption-BoldItalic.woff") format("woff");
  font-weight: bold;
  font-style: italic; }

@font-face {
  font-family: "Westeinde Caption";
  src: url("../fonts/WesteindeCaption-Heavy.woff2") format("woff2"), url("../fonts/WesteindeCaption-Heavy.woff") format("woff");
  font-weight: 900;
  font-style: normal; }

@font-face {
  font-family: "Westeinde Caption";
  src: url("../fonts/WesteindeCaption-HeavyItalic.woff2") format("woff2"), url("../fonts/WesteindeCaption-HeavyItalic.woff") format("woff");
  font-weight: 900;
  font-style: italic; }

/*------------------------------------*\
    MISC
\*------------------------------------*/
::selection {
  background: #04A4CC;
  color: #FFF;
  text-shadow: none; }

::-webkit-selection {
  background: #04A4CC;
  color: #FFF;
  text-shadow: none; }

::-moz-selection {
  background: #04A4CC;
  color: #FFF;
  text-shadow: none; }

/*------------------------------------*\
    WORDPRESS CORE
\*------------------------------------*/
.alignnone {
  margin: 5px 20px 20px 0; }

.aligncenter,
div.aligncenter {
  display: block;
  margin: 5px auto 5px auto; }

.alignright {
  float: right;
  margin: 5px 0 20px 20px; }

.alignleft {
  float: left;
  margin: 5px 20px 20px 0; }

a img.alignright {
  float: right;
  margin: 5px 0 20px 20px; }

a img.alignnone {
  margin: 5px 20px 20px 0; }

a img.alignleft {
  float: left;
  margin: 5px 20px 20px 0; }

a img.aligncenter {
  display: block;
  margin-left: auto;
  margin-right: auto; }

.wp-caption {
  background: #FFF;
  border: 1px solid #F0F0F0;
  max-width: 96%;
  padding: 5px 3px 10px;
  text-align: center; }

.wp-caption.alignnone {
  margin: 5px 20px 20px 0; }

.wp-caption.alignleft {
  margin: 5px 20px 20px 0; }

.wp-caption.alignright {
  margin: 5px 0 20px 20px; }

.wp-caption img {
  border: 0 none;
  height: auto;
  margin: 0;
  max-width: 98.5%;
  padding: 0;
  width: auto; }

.wp-caption .wp-caption-text,
.gallery-caption {
  font-size: 11px;
  line-height: 17px;
  margin: 0;
  padding: 0 4px 5px; }

/*------------------------------------*\
    PRINT
\*------------------------------------*/
@media print {
  * {
    background: transparent !important;
    color: #000 !important;
    box-shadow: none !important;
    text-shadow: none !important; }
  a,
  a:visited {
    text-decoration: underline; }
  a[href]:after {
    content: " (" attr(href) ")"; }
  abbr[title]:after {
    content: " (" attr(title) ")"; }
  .ir a:after,
  a[href^="javascript:"]:after,
  a[href^="#"]:after {
    content: ""; }
  pre, blockquote {
    border: 1px solid #999;
    page-break-inside: avoid; }
  thead {
    display: table-header-group; }
  tr, img {
    page-break-inside: avoid; }
  img {
    max-width: 100% !important; }
  @page {
    margin: 0.5cm; }
  p,
  h2,
  h3 {
    orphans: 3;
    widows: 3; }
  h2,
  h3 {
    page-break-after: avoid; } }