@charset "UTF-8";
/*
	HTML5 Reset :: style.css
    https://github.com/murtaugh/HTML5-Reset/blob/master/assets/css/reset.css
	----------------------------------------------------------
	We have learned much from/been inspired by/taken code where offered from:
	Eric Meyer					:: http://meyerweb.com
	HTML5 Doctor				:: http://html5doctor.com
	and the HTML5 Boilerplate	:: http://html5boilerplate.com
-------------------------------------------------------------------------------*/
/* Let's default this puppy out
-------------------------------------------------------------------------------*/
html, body, body div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, figure, footer, header, menu, nav, section, time, mark, audio, video, details, summary {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font-weight: normal;
  vertical-align: baseline;
  background: transparent; }

main, article, aside, figure, footer, header, nav, section, details, summary {
  display: block; }

/* Handle box-sizing while better addressing child elements:
   http://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */
html {
  box-sizing: border-box; }

*,
*:before,
*:after {
  box-sizing: inherit; }

/* consider resetting the default cursor: https://gist.github.com/murtaugh/5247154 */
/* Responsive images and other embedded objects */
/* if you don't have full control over `img` tags (if you have to overcome attributes), consider adding height: auto */
img,
object,
embed {
  max-width: 100%; }

/*
   Note: keeping IMG here will cause problems if you're using foreground images as sprites.
	In fact, it *will* cause problems with Google Maps' controls at small size.
	If this is the case for you, try uncommenting the following:
#map img {
		max-width: none;
}
*/
/* force a vertical scrollbar to prevent a jumpy page */
html {
  overflow-y: scroll; }

/* we use a lot of ULs that aren't bulleted.
	you'll have to restore the bullets within content,
	which is fine because they're probably customized anyway */
ul {
  list-style: none; }

blockquote, q {
  quotes: none; }

blockquote:before,
blockquote:after,
q:before,
q:after {
  content: '';
  content: none; }

a {
  margin: 0;
  padding: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent; }

del {
  text-decoration: line-through; }

abbr[title], dfn[title] {
  border-bottom: 1px dotted #000;
  cursor: help; }

/* tables still need cellspacing="0" in the markup */
table {
  border-collapse: separate;
  border-spacing: 0; }

th {
  font-weight: bold;
  vertical-align: bottom; }

td {
  font-weight: normal;
  vertical-align: top; }

hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #ccc;
  margin: 1em 0;
  padding: 0; }

input, select {
  vertical-align: middle; }

pre {
  white-space: pre;
  /* CSS2 */
  white-space: pre-wrap;
  /* CSS 2.1 */
  white-space: pre-line;
  /* CSS 3 (and 2.1 as well, actually) */
  word-wrap: break-word;
  /* IE */ }

input[type="radio"] {
  vertical-align: text-bottom; }

input[type="checkbox"] {
  vertical-align: bottom; }

.ie7 input[type="checkbox"] {
  vertical-align: baseline; }

.ie6 input {
  vertical-align: text-bottom; }

select, input, textarea {
  font: 99% sans-serif; }

table {
  font-size: inherit;
  font: 100%; }

small {
  font-size: 85%; }

strong {
  font-weight: bold; }

td, td img {
  vertical-align: top; }

/* Make sure sup and sub don't mess with your line-heights http://gist.github.com/413930 */
sub, sup {
  font-size: 75%;
  line-height: 0;
  position: relative; }

sup {
  top: -0.5em; }

sub {
  bottom: -0.25em; }

/* standardize any monospaced elements */
pre, code, kbd, samp {
  font-family: monospace, sans-serif; }

/* hand cursor on clickable elements */
.clickable,
label,
input[type=button],
input[type=submit],
input[type=file],
button {
  cursor: pointer; }

/* Webkit browsers add a 2px margin outside the chrome of form elements */
button, input, select, textarea {
  margin: 0; }

/* make buttons play nice in IE */
button,
input[type=button] {
  width: auto;
  overflow: visible; }

/* scale images in IE7 more attractively */
.ie7 img {
  -ms-interpolation-mode: bicubic; }

/* prevent BG image flicker upon hover
   (commented out as usage is rare, and the filter syntax messes with some pre-processors)
.ie6 html {filter: expression(document.execCommand("BackgroundImageCache", false, true));}
*/
/* let's clear some floats */
.clearfix:after {
  content: " ";
  display: block;
  clear: both; }

a {
  text-decoration: none; }

.kbpreview1234 {
  font-size: 18px;
  line-height: 32px;
  position: fixed;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  background: rgba(0, 0, 0, 0.6);
  padding: 10px 30px 10px 20px;
  z-index: 1000000;
  width: auto;
  opacity: 0.25;
  box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.15); }
  @media (max-width: 1180px) {
    .kbpreview1234 {
      font-size: 14px;
      line-height: 24px; } }
  .kbpreview1234:hover {
    background: rgba(0, 0, 0, 0.8);
    opacity: 1; }
    .kbpreview1234:hover > a {
      color: white; }
  .kbpreview1234 .kblinks1234 > a {
    display: block;
    text-decoration: none;
    color: #ccc; }
    .kbpreview1234 .kblinks1234 > a:hover {
      text-decoration: underline; }
    .kbpreview1234 .kblinks1234 > a.disabled {
      color: #666;
      cursor: inherit; }
      .kbpreview1234 .kblinks1234 > a.disabled:hover {
        text-decoration: none; }
  .kbpreview1234 .kblinks1234:not(.active) {
    display: none; }
  .kbpreview1234.closed {
    padding-left: 0;
    padding-right: 0;
    width: 10px; }
    .kbpreview1234.closed .kblinks1234 > a {
      width: 0;
      overflow: hidden; }
    .kbpreview1234.closed .kbnav1234 {
      width: 0;
      overflow: hidden; }
  .kbpreview1234 .kbfader1234 {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 10px;
    cursor: pointer;
    background: rgba(0, 0, 0, 0.4); }
    .kbpreview1234 .kbfader1234:hover {
      background: rgba(0, 0, 0, 0.6); }
  .kbpreview1234 .kbnav1234 {
    padding-bottom: 10px; }
    .kbpreview1234 .kbnav1234 > div {
      display: inline-block;
      border: 1px #444 solid;
      background: #222;
      width: 40px;
      text-align: center;
      font-weight: bold;
      color: #ccc; }
      .kbpreview1234 .kbnav1234 > div:hover {
        color: #fff;
        background: #333;
        cursor: pointer; }
      .kbpreview1234 .kbnav1234 > div.active {
        background: #600; }
  .kbpreview1234 .check {
    color: #0a0;
    font-weight: bold; }
  .kbpreview1234 .kbsplit1234 {
    margin-top: 5px;
    padding-top: 3px;
    border-top: 2px rgba(255, 255, 255, 0.2) solid; }

.kbclickhighlight1234 {
  background-color: khaki;
  position: relative; }
  .kbclickhighlight1234::after {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: rgba(255, 255, 255, 0.8);
    font-weight: bold;
    padding: 5px;
    color: black;
    font-size: 14px;
    line-height: 18px;
    text-transform: uppercase;
    border: 2px rgba(0, 0, 0, 0.8) solid;
    content: attr(title); }

/*
*[title]:hover {
    position: relative;
    &::after {
         z-index:            200000000;
         position:           absolute;
         top:                50%;
         left:               50%;
         transform:          translate(-50%, -50%);
         background-color:   rgba(255, 255, 255, 0.8);
         font-weight:        bold;
         padding:            5px;
         color:            black;
         font-size:          14px;
         line-height:        18px;
         text-transform:     uppercase;
         border:             2px rgba(0, 0, 0, 0.4) solid;
         content:            attr(title);
         pointer-events:     none;
    }
} */
html, body {
  scroll-behavior: smooth;
  overflow-x: hidden;
  max-width: 100%; }

body {
  max-width: 100%;
  overflow: hidden;
  display: flex;
  flex-direction: column; }
  body.menu-open, body.modal-popup {
    overflow: hidden; }

main, .contact-info, .menu {
  font-size: 1.25rem;
  font-family: "Roboto", Arial, Helvetica, sans-serif;
  line-height: 1.25;
  color: #000000; }
  @media (max-width: 1180px) {
    main, .contact-info, .menu {
      font-size: 1.125rem; } }
  @media (max-width: 480px) {
    main, .contact-info, .menu {
      font-size: 1.125rem; } }

main {
  display: flex;
  flex-direction: column;
  overflow: hidden; }
  main section {
    --primecol: #f4edf3;
    --bgcol:    var(--primecol);
    --fcol:     #f4edf3;
    --hcol:     #ffffff;
    background: var(--bgcol);
    color: var(--fcol); }
    main section:first-of-type {
      max-width: 100%;
      overflow-x: hidden; }
    main section.light {
      --primecol: #f4edf3; }
    main section.white {
      --primecol: #fff; }
    main section.dark {
      --primecol: #707070; }
    main section.blue {
      --primecol: #EAF6F7; }
    main section.pink {
      --primecol: #EFDEEC; }
    main section.footer {
      --primecol: #EFDEEC; }
    main section.invert {
      --bgcol: #ffffff;
      --fcol: #000000;
      --hcol: var(--primecol); }
    main section h1 {
      color: var(--hcol); }
  main article {
    display: flex;
    flex-direction: row;
    width: 100%;
    max-width: 1698px;
    margin: 0 auto;
    padding: 100px 40px 100px; }
    @media (max-width: 1180px) {
      main article {
        flex-direction: column; } }
    @media (max-width: 480px) {
      main article {
        flex-direction: column; } }
    @media (max-width: 1180px) {
      main article {
        padding: 40px 25px 40px 25px; } }
    @media (max-width: 480px) {
      main article {
        padding: 40px 25px 40px 25px; } }
    main article.collapse-down {
      padding-bottom: 0; }
    main article h1, main article h1 div {
      font-weight: 600;
      font-size: 7.5rem;
      line-height: 1;
      letter-spacing: 0.6px; }
      @media (max-width: 1180px) {
        main article h1, main article h1 div {
          font-size: 3.125rem; } }
      @media (max-width: 480px) {
        main article h1, main article h1 div {
          font-size: 3.125rem; } }
      @media (max-width: 1180px) {
        main article h1, main article h1 div {
          line-height: 1.1; } }
      @media (max-width: 480px) {
        main article h1, main article h1 div {
          line-height: 1.1; } }
      @media (max-width: 1180px) {
        main article h1, main article h1 div {
          letter-spacing: 0.25px; } }
      @media (max-width: 480px) {
        main article h1, main article h1 div {
          letter-spacing: 0.25px; } }
    main article .intro-collapsed h1, main article .intro-collapsed h1 div {
      font-size: 3.75rem; }
      @media (max-width: 1180px) {
        main article .intro-collapsed h1, main article .intro-collapsed h1 div {
          font-size: 1.5625rem; } }
      @media (max-width: 480px) {
        main article .intro-collapsed h1, main article .intro-collapsed h1 div {
          font-size: 1.5625rem; } }
    main article h2, main article h2 div {
      font-weight: 600;
      font-size: 1.875rem;
      line-height: 1.25;
      letter-spacing: 0.15px; }
      @media (max-width: 1180px) {
        main article h2, main article h2 div {
          font-size: 1.875rem; } }
      @media (max-width: 480px) {
        main article h2, main article h2 div {
          font-size: 1.875rem; } }
      @media (max-width: 1180px) {
        main article h2, main article h2 div {
          line-height: 1.2; } }
      @media (max-width: 480px) {
        main article h2, main article h2 div {
          line-height: 1.2; } }
    main article h1 + h2 {
      margin-top: 0.75em; }
    @media (min-width: 1181px) {
      main article aside {
        width: 210px; } }
    @media (min-width: 1181px) {
      main article aside h1 {
        writing-mode: vertical-lr;
        line-height: 0.7;
        transform: rotate(180deg); } }
    @media (max-width: 1180px) {
      main article aside h1 {
        margin-bottom: 0.5em; } }
    main article .content {
      display: flex;
      flex-direction: column;
      position: relative; }
      @media (min-width: 1181px) {
        main article .content {
          width: calc(100% - 210px); } }
      main article .content:first-child:last-child {
        width: 100%; }
      main article .content p + p, main article .content h1 + p, main article .content h2 + p, main article .content h3 + p {
        margin-top: 1.25em; }
  main .circle-graph {
    display: block;
    width: 100%;
    font-family: "Roboto", Arial, Helvetica, sans-serif;
    shape-rendering: geometricPrecision; }
    main .circle-graph.has-popups .circle-small {
      cursor: pointer; }
    main .circle-graph .circle-small {
      position: relative; }
      main .circle-graph .circle-small circle {
        fill: rgba(0, 0, 0, 0);
        stroke: #ffffff;
        transition: fill 250ms ease-out; }
      main .circle-graph .circle-small text {
        font-size: 14px;
        fill: #ffffff;
        transition: fill 250ms ease-out; }
      main .circle-graph .circle-small:hover circle, main .circle-graph .circle-small.active circle {
        fill: #ffffff; }
      main .circle-graph .circle-small:hover text, main .circle-graph .circle-small.active text {
        fill: var(--primary-color); }
    main .circle-graph .circle-large {
      --animation-delay: 1s;
      font-weight: 600;
      isolation: isolate; }
      main .circle-graph .circle-large circle {
        fill: var(--primary-color);
        animation-delay: var(--animation-delay); }

@keyframes lightenCircle {
  0%, 30%, 70%, 100% {
    filter: brightness(100%); }
  50% {
    filter: brightness(120%); } }
      main .circle-graph .circle-large text {
        font-size: 40px;
        font-weight: 600;
        letter-spacing: 0.005em;
        fill: #ffffff; }
    main .circle-graph .circle-intersection {
      pointer-events: none;
      mix-blend-mode: normal !important; }
  main .circle-graph.mobile circle {
    mix-blend-mode: multiply;
    isolation: isolate; }
  main .circle-graph.mobile.has-popups circle {
    cursor: pointer; }
  main .circle-graph.mobile text {
    font-family: "Roboto", Arial, Helvetica, sans-serif;
    font-weight: 600;
    font-size: 25px;
    line-height: 1;
    letter-spacing: 0.13px;
    fill: #ffffff;
    transition: fill 250ms ease-out;
    pointer-events: none; }
  @media (max-width: 1180px) {
    main .circle-graph.desktop {
      display: none; } }
  @media (min-width: 1181px) {
    main .circle-graph.mobile {
      display: none; } }
  main .circle-description {
    --primary-color: #298cac;
    position: absolute;
    left: 0;
    width: 100%;
    top: 50%;
    background: #ffffff;
    border: 1px #000000 solid;
    border-radius: 40px;
    display: flex;
    flex-direction: column;
    transform: translateY(-30%);
    z-index: 11;
    padding: 22px; }
    @media (max-width: 1180px) {
      main .circle-description {
        transform: translateY(-20%); } }
    @media (min-width: 1181px) {
      main .circle-description.mobile-circle {
        display: none; } }
    @media (max-width: 1180px) {
      main .circle-description:not(.mobile-circle) {
        display: none; } }
    main .circle-description .circle-description-close {
      position: absolute;
      top: 22px;
      right: 22px;
      cursor: pointer;
      color: var(--primary-color);
      width: 30px;
      transform: scale(1);
      transition: transform 250ms ease-out; }
      .no-touch main .circle-description .circle-description-close:hover {
        transform: scale(1.1); }
    main .circle-description:not(.open) {
      visibility: hidden;
      opacity: 0;
      transition: visibility 0s 250ms, opacity 250ms ease-out, transform 250ms ease-out; }
    main .circle-description.open {
      visibility: visible;
      opacity: 1;
      transform: translateY(-50%);
      transition: opacity 250ms ease-out, transform 250ms ease-out; }
      @media (max-width: 1180px) {
        main .circle-description.open {
          transform: translateY(0%); } }
    main .circle-description h2 {
      margin-right: 44px; }
      @media (max-width: 1180px) {
        main .circle-description h2 {
          font-size: 1.5625rem; } }
    main .circle-description h3 {
      font-weight: 600; }
    main .circle-description h2 + h3 {
      margin-top: 1em; }
    main .circle-description h3 + p {
      margin-top: 0 !important; }
  main .text-link {
    color: #ffffff;
    text-decoration: none; }
    main .text-link:hover {
      text-decoration: underline; }
  main .lilac.invert .text-link {
    color: #572f4f; }
    main .lilac.invert .text-link:hover {
      color: #000000; }
  main .blue.invert .text-link {
    color: #214A57; }
    main .blue.invert .text-link:hover {
      color: #000000; }
  main p + p {
    margin-top: 1.25em;
    margin-bottom: 0; }
  main p + h1 {
    margin-top: 3em; }
  main p + h2 {
    margin-top: 2.5em; }
  main p + h3 {
    margin-top: 1.5em; }

.reference-panel {
  overflow: hidden; }
  .reference-panel .reference-headline {
    font-weight: bold;
    margin-top: 2em; }
  .reference-panel .reference-description {
    margin-top: 0.2em; }
  .reference-panel .reference-image {
    width: 100%;
    max-width: 100%;
    position: relative;
    overflow: hidden; }
    @media (max-width: 1180px) {
      .reference-panel .reference-image {
        width: 180%;
        max-width: 180%; } }
    .reference-panel .reference-image img {
      display: block;
      width: 100%; }
      @media (max-width: 1180px) {
        .reference-panel .reference-image img {
          transform: translateX(-18.5%); } }
    .reference-panel .reference-image svg {
      display: none;
      width: 100%;
      z-index: -1; }

.references-download {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  color: #000000; }
  .references-download svg {
    margin-right: 0.8em;
    width: 21px;
    transition: transform 250ms ease-out;
    transform: scale(1); }
    .references-download svg .references-arrow {
      transition: color 250ms ease-out, transform 250ms ease-out; }
    .references-download svg .references-bar {
      transition: color 250ms ease-out, transform 250ms ease-out; }
  .references-download div {
    color: #000000; }
  .no-touch .references-download:hover svg {
    transform: scale(1.2); }
  .references-download:hover svg .references-arrow {
    color: #214A57; }
    .no-touch .references-download:hover svg .references-arrow {
      transform: translateY(5px); }
  .references-download:hover svg .references-bar {
    color: #214A57; }
    .no-touch .references-download:hover svg .references-bar {
      transform: translateY(-22px); }
  .references-download:hover div {
    text-decoration: underline; }

.page-back {
  width: 35px;
  display: block;
  z-index: 10;
  color: #ffffff;
  transition: color 250ms ease-out;
  cursor: pointer;
  margin-bottom: 1em;
  transition: transform 250ms ease-out, color 250ms ease-out; }
  @media (max-width: 1180px) {
    .page-back {
      width: 26px; } }
  @media (max-width: 480px) {
    .page-back {
      width: 26px; } }
  .no-touch .page-back {
    transform: scale(1.001); }
    .no-touch .page-back:hover {
      transform: scale(1.1); }
      @media (max-width: 1180px) {
        .no-touch .page-back:hover {
          transform: sacle(1.1); } }

.head-bar article {
  padding-top: 2em;
  padding-bottom: 2em;
  max-width: 1778px; }
  @media (max-width: 1180px) {
    .head-bar article {
      padding-top: 1.5em; } }
  @media (max-width: 480px) {
    .head-bar article {
      padding-top: 1.5em; } }
  @media (max-width: 1180px) {
    .head-bar article {
      padding-bottom: 1.5em; } }
  @media (max-width: 480px) {
    .head-bar article {
      padding-bottom: 1.5em; } }
  .head-bar article .content {
    display: grid;
    grid-template-columns: 160px auto;
    gap: 2em; }
    @media (max-width: 1180px) {
      .head-bar article .content {
        grid-template-columns: 80px auto; } }
    @media (max-width: 480px) {
      .head-bar article .content {
        grid-template-columns: 80px auto; } }
    @media (max-width: 1180px) {
      .head-bar article .content {
        gap: 1em; } }
    @media (max-width: 480px) {
      .head-bar article .content {
        gap: 1em; } }
    .head-bar article .content > div {
      display: flex;
      flex-direction: column;
      justify-content: center; }
    .head-bar article .content img {
      display: block;
      width: 100%; }
    .head-bar article .content h1 {
      font-size: 3.125rem;
      font-weight: normal; }
      @media (max-width: 1180px) {
        .head-bar article .content h1 {
          font-size: 1.35rem; } }
      @media (max-width: 480px) {
        .head-bar article .content h1 {
          font-size: 1.35rem; } }
    .head-bar article .content h2 {
      font-size: 1.25rem;
      font-weight: normal;
      margin-top: 0.5em; }
      @media (max-width: 1180px) {
        .head-bar article .content h2 {
          font-size: 0.9rem; } }
      @media (max-width: 480px) {
        .head-bar article .content h2 {
          font-size: 0.9rem; } }
      @media (max-width: 1180px) {
        .head-bar article .content h2 {
          margin-top: 0.25em; } }
      @media (max-width: 480px) {
        .head-bar article .content h2 {
          margin-top: 0.25em; } }
    .head-bar article .content a {
      color: #ffffff;
      text-decoration: none; }

.foot-bar article {
  padding-top: 2em;
  padding-bottom: 2em; }
  @media (max-width: 1180px) {
    .foot-bar article {
      padding-top: 1.5em; } }
  @media (max-width: 480px) {
    .foot-bar article {
      padding-top: 1.5em; } }
  @media (max-width: 1180px) {
    .foot-bar article {
      padding-bottom: 1.5em; } }
  @media (max-width: 480px) {
    .foot-bar article {
      padding-bottom: 1.5em; } }
  .foot-bar article .content {
    display: grid;
    grid-template-columns: 120px 360px calc(100% - 360px - 120px - 4em);
    grid-template-areas: "img name links";
    gap: 1em 2em;
    color: #2B2E34; }
    @media (max-width: 1180px) {
      .foot-bar article .content {
        grid-template-columns: 60px 240px calc(100% - 240px - 60px - 4em); } }
    @media (max-width: 480px) {
      .foot-bar article .content {
        grid-template-columns: 60px 240px calc(100% - 240px - 60px - 4em); } }
    @media (max-width: 1180px) {
      .foot-bar article .content {
        grid-template-areas: "img name" "links links"; } }
    @media (max-width: 480px) {
      .foot-bar article .content {
        grid-template-areas: "img name" "links links"; } }

.foot-bar img {
  display: block;
  width: 100%;
  grid-area: img; }

.foot-bar .name {
  display: flex;
  flex-direction: column;
  justify-content: center;
  grid-area: name; }

.foot-bar .links {
  grid-area: links;
  display: flex;
  justify-content: space-between;
  flex-direction: row;
  align-items: center;
  margin-top: 0; }
  @media (max-width: 1180px) {
    .foot-bar .links {
      flex-direction: column; } }
  @media (max-width: 480px) {
    .foot-bar .links {
      flex-direction: column; } }
  @media (max-width: 1180px) {
    .foot-bar .links {
      align-items: flex-start; } }
  @media (max-width: 480px) {
    .foot-bar .links {
      align-items: flex-start; } }
  @media (max-width: 1180px) {
    .foot-bar .links {
      margin-top: 1em; } }
  @media (max-width: 480px) {
    .foot-bar .links {
      margin-top: 1em; } }
  .foot-bar .links a {
    color: #707070;
    text-decoration: none; }
    .foot-bar .links a:hover {
      text-decoration: underline; }

.foot-bar h1 {
  color: #2B2E34;
  font-size: 1.875rem;
  font-weight: 500; }
  @media (max-width: 1180px) {
    .foot-bar h1 {
      font-size: 1.2rem; } }
  @media (max-width: 480px) {
    .foot-bar h1 {
      font-size: 1.2rem; } }

.foot-bar h2 {
  font-size: 1.25rem;
  font-weight: normal;
  margin-top: 0.5em; }
  @media (max-width: 1180px) {
    .foot-bar h2 {
      font-size: 0.9rem; } }
  @media (max-width: 480px) {
    .foot-bar h2 {
      font-size: 0.9rem; } }
  @media (max-width: 1180px) {
    .foot-bar h2 {
      margin-top: 0.25em; } }
  @media (max-width: 480px) {
    .foot-bar h2 {
      margin-top: 0.25em; } }

.image-bar {
  padding-top: 3em; }
  @media (max-width: 1180px) {
    .image-bar {
      padding-top: 3em; } }
  @media (max-width: 480px) {
    .image-bar {
      padding-top: 3em; } }
  .image-bar figure {
    display: block;
    width: 100%;
    margin-right: 1em; }
    .image-bar figure img {
      display: block;
      width: 100%; }
    .image-bar figure figcaption {
      font-size: 1.6rem;
      color: #707070;
      line-height: 1.3;
      margin: 0.8em 0; }
      @media (max-width: 1180px) {
        .image-bar figure figcaption {
          font-size: 1.1rem; } }
      @media (max-width: 480px) {
        .image-bar figure figcaption {
          font-size: 1.1rem; } }

.text-block {
  max-width: 1298px;
  margin-left: auto;
  margin-right: auto;
  font-size: 1.875rem;
  color: #707070;
  line-height: 1.5; }
  @media (max-width: 1180px) {
    .text-block {
      font-size: 1.1rem; } }
  @media (max-width: 480px) {
    .text-block {
      font-size: 1.1rem; } }
  .text-block h1 {
    color: #e26bc2;
    font-size: 2.5rem;
    text-transform: uppercase;
    font-weight: 500;
    letter-spacing: 2px;
    line-height: 1.3; }
    @media (max-width: 1180px) {
      .text-block h1 {
        font-size: 1.4rem; } }
    @media (max-width: 480px) {
      .text-block h1 {
        font-size: 1.4rem; } }
  .text-block a {
    color: #707070; }
    .text-block a:hover {
      color: #e26bc2; }
  .text-block ul li {
    padding-left: 1em;
    position: relative; }
    .text-block ul li::before {
      content: '●';
      color: #e26bc2;
      position: absolute;
      left: 0;
      top: 0; }
    .text-block ul li + li {
      margin-top: 0.5em; }
  .text-block p + p, .text-block p + ul, .text-block p + ol, .text-block ul + p, .text-block ul + ul, .text-block ul + ol, .text-block ol + p, .text-block ol + ul, .text-block ol + ol {
    margin-top: 1em; }

.intro-block h1 {
  color: #707070;
  font-size: 3.9375rem;
  font-weight: 300;
  line-height: 1.3;
  margin-bottom: 1em; }
  @media (max-width: 1180px) {
    .intro-block h1 {
      font-size: 1.96875rem; } }
  @media (max-width: 480px) {
    .intro-block h1 {
      font-size: 1.96875rem; } }

.intro-block h2 {
  font-size: 2.5rem;
  color: #e26bc2;
  font-weight: 500;
  text-transform: uppercase; }
  @media (max-width: 1180px) {
    .intro-block h2 {
      font-size: 1.4rem; } }
  @media (max-width: 480px) {
    .intro-block h2 {
      font-size: 1.4rem; } }

.intro-block p {
  font-weight: 400;
  margin-bottom: 2em; }
  @media (max-width: 1180px) {
    .intro-block p {
      margin-bottom: 1em; } }
  @media (max-width: 480px) {
    .intro-block p {
      margin-bottom: 1em; } }

.arrow-right {
  display: inline-block;
  width: 1.625rem;
  height: auto;
  fill: #e26bc2; }
  @media (max-width: 1180px) {
    .arrow-right {
      width: 0.975rem; } }
  @media (max-width: 480px) {
    .arrow-right {
      width: 0.975rem; } }

.has-arrow-right {
  display: inline-flex;
  color: #707070; }
  .has-arrow-right svg {
    margin-left: 0.4em; }

strong {
  font-weight: 500; }

.footer {
  display: flex;
  flex-direction: row;
  justify-content: flex-start; }
  @media (max-width: 1180px) {
    .footer {
      flex-direction: column; } }
  .footer .left, .footer .right {
    width: calc(40% - 20px); }
    @media (max-width: 1180px) {
      .footer .left, .footer .right {
        width: 100%; } }
    @media (min-width: 1181px) {
      .footer .left, .footer .right {
        margin-top: 3em; } }
  .footer a {
    display: flex;
    align-items: center; }
    .footer a div {
      margin-left: 1.5em;
      color: #ffffff;
      text-decoration: none; }
      @media (max-width: 1180px) {
        .footer a div {
          margin-left: 1em; } }
      @media (max-width: 480px) {
        .footer a div {
          margin-left: 1em; } }
    .footer a svg {
      transition: transform 250ms ease-out;
      transform: scale(1); }
    .footer a:hover div {
      text-decoration: underline; }
    .footer a:hover svg {
      /*
            @keyframes blinkSvg {
                0%, 15%, 90%, 100%    {
                    transform: rotate(0deg) scale(1)
                }
                40% {
                    transform: rotate(-10deg) scale(1.1)
                }
                60% {
                    transform: rotate(10deg) scale(1.1)
                }
            }*/ }
      .no-touch .footer a:hover svg {
        transform: scale(1.1); }
  @media (max-width: 1180px) {
    .footer .left a {
      margin-top: 1.2em; } }
  @media (max-width: 1180px) {
    .footer .right a {
      margin-top: 1.2em; } }
  .footer .karnbrock-l {
    width: 67px; }
    @media (max-width: 1180px) {
      .footer .karnbrock-l {
        width: 42px; } }
    @media (max-width: 480px) {
      .footer .karnbrock-l {
        width: 42px; } }
  .footer .qart-l {
    width: 101px; }
    @media (max-width: 1180px) {
      .footer .qart-l {
        width: 75px; } }
    @media (max-width: 480px) {
      .footer .qart-l {
        width: 75px; } }

.footer-links {
  margin-top: 3em; }
  @media (max-width: 1180px) {
    .footer-links {
      margin-top: 2.5em; } }
  @media (max-width: 480px) {
    .footer-links {
      margin-top: 2.5em; } }
  .footer-links a {
    color: #ffffff; }
    .footer-links a:hover {
      text-decoration: underline; }
    .footer-links a:not(:last-child) {
      margin-right: 0.5em; }

.contact-info {
  z-index: 20;
  color: #ffffff;
  background: #cc8414;
  display: flex;
  position: fixed;
  right: 0;
  padding: 18px;
  top: 40px;
  letter-spacing: 0.1px;
  transition: transform 250ms ease-out; }
  @media (max-width: 1180px) {
    .contact-info {
      padding: 10px; } }
  @media (max-width: 480px) {
    .contact-info {
      padding: 10px; } }
  @media (max-width: 1180px) {
    .contact-info {
      top: 25px; } }
  @media (max-width: 480px) {
    .contact-info {
      top: 25px; } }
  .contact-info svg {
    width: 42px;
    cursor: pointer; }
    @media (max-width: 1180px) {
      .contact-info svg {
        width: 30px; } }
    @media (max-width: 480px) {
      .contact-info svg {
        width: 30px; } }
    @media (min-width: 1181px) {
      .contact-info svg {
        transition: transform 250ms ease-out; }
        .contact-info svg:hover {
          transform: scale(1.1); } }
  .contact-info div {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    max-width: 100%; }
  @media (max-width: 1180px) {
    .contact-info:not(.open) {
      transform: translateX(calc(100% - 50px)); } }
  @media (min-width: 1181px) {
    .contact-info.open {
      transform: translateX(calc(100% - 78px)); } }
  .contact-info a {
    display: inline-block;
    font-size: 1.25rem;
    line-height: 1.25;
    color: #ffffff;
    text-decoration: none;
    margin-left: 1em;
    white-space: nowrap; }
    @media (max-width: 1180px) {
      .contact-info a {
        font-size: 1.125rem; } }
    @media (max-width: 480px) {
      .contact-info a {
        font-size: 1.125rem; } }
    @media (max-width: 1180px) {
      .contact-info a {
        margin-left: 0.6em; } }
    @media (max-width: 480px) {
      .contact-info a {
        margin-left: 0.6em; } }
    .contact-info a:hover {
      text-decoration: underline; }

.menu {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  overflow: visible;
  z-index: 20;
  color: #572f4f; }
  .menu .menu-scaler {
    transform: translateY(0%) scale(1) rotate(0deg);
    transition: transform 250ms ease-out, opacity 250ms ease-out;
    opacity: 1; }
  .menu:not(.open) .menu-scaler {
    transform: translateY(-100%) scale(0.5) rotate(-90deg);
    opacity: 0; }
  .menu .menu-positioner {
    display: flex;
    flex-direction: row;
    width: 100%;
    max-width: 1698px;
    margin: 0 auto;
    padding-left: 0.30em;
    max-height: 0;
    overflow: visible;
    position: relative; }
    @media (max-width: 1180px) {
      .menu .menu-positioner {
        flex-direction: column; } }
    @media (max-width: 480px) {
      .menu .menu-positioner {
        flex-direction: column; } }
  .menu .menu-scaler {
    display: inline-flex;
    padding: 20px 40px 20px 10px;
    flex-direction: column;
    background: #ffffff;
    position: absolute;
    top: 0;
    left: 0;
    margin-left: 40px; }
    @media (max-width: 1180px) {
      .menu .menu-scaler {
        margin-left: 25px; } }
    @media (max-width: 480px) {
      .menu .menu-scaler {
        margin-left: 25px; } }
  .menu nav {
    font-weight: 600;
    font-size: 1.875rem;
    line-height: 1.35;
    letter-spacing: 0.15px;
    display: inline-flex;
    flex-direction: column; }
    @media (max-width: 1180px) {
      .menu nav {
        font-size: 1.875rem; } }
    @media (max-width: 480px) {
      .menu nav {
        font-size: 1.875rem; } }
    @media (max-width: 1180px) {
      .menu nav {
        line-height: 1.2; } }
    @media (max-width: 480px) {
      .menu nav {
        line-height: 1.2; } }
    .menu nav a {
      color: #572f4f; }
      .menu nav a:hover {
        color: #000000; }

.menu-open {
  display: inline-block;
  margin-left: 0.35em;
  margin-bottom: 0.8em;
  width: 40px;
  cursor: pointer;
  transform: scale(1);
  transition: transform 250ms ease-out; }
  .menu-open:hover {
    transform: scale(1.1); }

.menu-close {
  display: inline-block;
  width: 21px;
  cursor: pointer;
  transform: scale(1);
  transition: transform 250ms ease-out;
  margin-bottom: 1em; }
  .menu-close:hover {
    transform: scale(1.1); }

/* 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 {
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  -o-transform: translate3d(0, 0, 0);
  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; }

/* Slider */
.slick-loading .slick-list {
  background: #fff url("./ajax-loader.gif") center center no-repeat; }

/* Icons */
@font-face {
  font-family: "slick";
  src: url("./fonts/slick.eot");
  src: url("./fonts/slick.eot?#iefix") format("embedded-opentype"), url("./fonts/slick.woff") format("woff"), url("./fonts/slick.ttf") format("truetype"), url("./fonts/slick.svg#slick") format("svg");
  font-weight: normal;
  font-style: normal; }

/* Arrows */
.slick-prev,
.slick-next {
  position: absolute;
  display: block;
  height: auto;
  width: 20px;
  line-height: 0px;
  font-size: 0px;
  z-index: 5;
  cursor: pointer;
  background: transparent;
  color: transparent;
  top: 0;
  right: 0;
  padding: 0;
  border: none;
  outline: none; }
  .slick-prev:hover, .slick-prev:focus,
  .slick-next:hover,
  .slick-next:focus {
    outline: none;
    background: transparent;
    color: transparent; }
    .slick-prev:hover:before, .slick-prev:focus:before,
    .slick-next:hover:before,
    .slick-next:focus:before {
      opacity: 1; }
  .slick-prev.slick-disabled:before,
  .slick-next.slick-disabled:before {
    opacity: 1; }
  .slick-prev:before,
  .slick-next:before {
    font-family: "slick";
    font-size: 33px;
    line-height: 1;
    color: #707070;
    opacity: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale; }
    @media (max-width: 1180px) {
      .slick-prev:before,
      .slick-next:before {
        font-size: 33px; } }

.slick-prev {
  right: calc(15px + 40px); }
  [dir="rtl"] .slick-prev {
    left: auto;
    right: -25px; }
  .slick-prev:before {
    content: "❮"; }
    [dir="rtl"] .slick-prev:before {
      content: "❯"; }

.slick-next {
  right: 15px; }
  [dir="rtl"] .slick-next {
    left: -25px;
    right: auto; }
  .slick-next:before {
    content: "❯"; }
    [dir="rtl"] .slick-next:before {
      content: "❮"; }

/* Dots */
.slick-dotted.slick-slider {
  margin-bottom: 30px; }

.slick-dots {
  position: absolute;
  bottom: 40px;
  transform: translateY(50%);
  list-style: none;
  display: block;
  text-align: center;
  padding: 0;
  margin: 0;
  left: 0;
  width: 100%; }
  @media (max-width: 1180px) {
    .slick-dots {
      bottom: 10px; } }
  .slick-dots li {
    position: relative;
    display: inline-block;
    height: 20px;
    width: 20px;
    margin: 0 5px;
    padding: 0;
    cursor: pointer; }
    @media (max-width: 1180px) {
      .slick-dots li {
        margin: 0 0; } }
    .slick-dots li button {
      border: 0;
      background: transparent;
      display: block;
      height: 20px;
      width: 20px;
      outline: none;
      line-height: 0px;
      font-size: 0px;
      color: transparent;
      padding: 5px;
      cursor: pointer; }
      .slick-dots li button:hover, .slick-dots li button:focus {
        outline: none; }
        .slick-dots li button:hover:before, .slick-dots li button:focus:before {
          opacity: 1; }
      .slick-dots li button:before {
        position: absolute;
        top: 0;
        left: 0;
        content: " ";
        border: 2px black solid;
        background: #ffffff;
        border-radius: 50%;
        width: 15px;
        height: 15px;
        font-family: "slick";
        font-size: 50px;
        line-height: 20px;
        text-align: center;
        color: #ffffff;
        opacity: 1;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale; }
        @media (max-width: 1180px) {
          .slick-dots li button:before {
            border-width: 1px; } }
        @media (max-width: 1180px) {
          .slick-dots li button:before {
            width: 10px;
            height: 10px;
            font-size: 30px; } }
    .slick-dots li.slick-active button:before {
      background: #000000;
      opacity: 1; }

.slider-arrow-left, .slider-arrow-right {
  width: 35px;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 10;
  color: #000000;
  transition: color 250ms ease-out;
  cursor: pointer; }
  @media (max-width: 1180px) {
    .slider-arrow-left, .slider-arrow-right {
      width: 26px; } }
  @media (max-width: 480px) {
    .slider-arrow-left, .slider-arrow-right {
      width: 26px; } }
  .slider-arrow-left:hover, .slider-arrow-right:hover {
    color: #214A57; }

.slider-arrow-right {
  left: 85px; }
  @media (max-width: 1180px) {
    .slider-arrow-right {
      left: 50px; } }
  @media (max-width: 480px) {
    .slider-arrow-right {
      left: 50px; } }

.slider-arrow-left, .slider-arrow-right {
  transition: transform 250ms ease-out, color 250ms ease-out; }
  .no-touch .slider-arrow-left, .no-touch .slider-arrow-right {
    transform: scale(1.001); }
    .no-touch .slider-arrow-left:hover, .no-touch .slider-arrow-right:hover {
      transform: scale(1.1); }
      @media (max-width: 1180px) {
        .no-touch .slider-arrow-left:hover, .no-touch .slider-arrow-right:hover {
          transform: sacle(1.1); } }

.slider {
  padding-top: 35px; }
  @media (max-width: 1180px) {
    .slider {
      padding-top: 52px; } }
  @media (max-width: 480px) {
    .slider {
      padding-top: 52px; } }
  .slider:not(.has-download) {
    margin-bottom: 0; }
    @media (max-width: 1180px) {
      .slider:not(.has-download) {
        margin-bottom: 0; } }
    @media (max-width: 480px) {
      .slider:not(.has-download) {
        margin-bottom: 0; } }
  .slider.has-download {
    margin-bottom: 5em; }
    @media (max-width: 1180px) {
      .slider.has-download {
        margin-bottom: 5em; } }
    @media (max-width: 480px) {
      .slider.has-download {
        margin-bottom: 5em; } }

.kbcookie-outer {
  z-index: 10000;
  position: fixed;
  font-family: 'TT Interphases', Arial, Helvetica, sans-serif;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.4);
  text-align: center;
  overflow-y: auto; }

.kbcookie-inner {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: white;
  padding: 40px;
  min-width: 740px; }

@media only screen and (max-width: 800px) {
  .kbcookie-inner {
    min-width: 90%; } }

.kbcookie-inner.top {
  bottom: unset;
  top: 0; }

.kbcookie-inner.bottom {
  bottom: 0;
  top: unset; }

.kbcookie-yes {
  cursor: pointer;
  background: #572f4f;
  border: 2px #572f4f solid;
  color: #ffffff;
  margin-top: 15px;
  padding: 5px 10px;
  font-weight: bold;
  display: inline-block;
  width: 240px; }

.kbcookie-yes:hover {
  background: #462640;
  border-color: #462640; }

.kbcookie-no {
  cursor: pointer;
  border: 2px #000000 solid;
  margin-top: 5px;
  padding: 5px 10px;
  display: inline-block;
  margin-right: 10px;
  width: 240px; }

@media only screen and (max-width: 800px) {
  .kbcookie-yes, .kbcookie-no {
    display: block;
    margin-left: 0;
    width: auto; }
  .kbcookie-no {
    margin-right: 0; } }

.kbcookie-no:hover {
  background: #000000;
  color: white; }

.kbcookie-title {
  font-size: 2rem;
  line-height: 1.2;
  color: #000000;
  font-weight: bold;
  margin-bottom: 20px;
  font-family: 'TT Interphases', Arial, Helvetica, sans-serif; }

@media only screen and (max-width: 800px) {
  .kbcookie-title {
    font-size: 1.3rem;
    line-height: 1.1; } }

.kbcookie-exp {
  color: #000000;
  font-family: 'TT Interphases', Arial, Helvetica, sans-serif;
  font-size: 100%;
  font-weight: normal;
  margin-bottom: 30px;
  line-height: 1.5; }

.kbcookie-exp a {
  color: #000000;
  text-decoration: underline; }

@media only screen and (max-width: 800px) {
  .kbcookie-exp {
    font-size: 90%;
    line-height: 1.3; } }

.kbcookie-data {
  cursor: pointer;
  margin-top: 10px;
  color: #000000; }

.kbcookie-data::after {
  content: " ↓"; }

.open .kbcookie-data::after {
  content: " ↑" !important; }

.open .kbcookie-data {
  font-weight: bold;
  text-decoration: none !important; }

.kbcookie-data:hover {
  text-decoration: underline; }

.kbcookie-data-text {
  display: none; }

.open .kbcookie-data-text {
  border: 1px rgba(0, 0, 0, 0.1) solid;
  border-radius: 3px;
  margin-top: 10px;
  display: inherit;
  text-align: justify;
  padding: 15px;
  color: black;
  font-size: 80%; }