@charset "UTF-8";
/*  variables   */
/* #1b4379  #0033b3 */
/*neu: #56a532  ; alt: rgb(32,144,119);*/
/* 10% sw */
/*  was 2.7rem  */
/* changed with new logo from 122px to 131px*/
/* was 3.5rem;*/
/* was 2rem;*/
/** Vertical padding applied to .frm.inner inside sections — top and bottom breathing room. */
/* desktop: ~96px, mobile: 56px  */
/* compact screens below $break3  */
/** Maximum content-frame width. Above this the outer frame stops growing and gets centered. */
/* horizontal padding applied when viewport is between break1 and frm_max_width */
/*****  specials  *********************************************************************/
/*27px + 10px + 5px;*/
/*****  typography  *******************************************************************/
/* 16px */
/* 14px */
/* 18px */
/** Body copy inside section .content — scales from 14px on mobile up to 16px on large screens. */
/** Grid column/row gaps for section column layouts (c2l, c3l). */
/* scales from 24px → 56px */
/* fixed row spacing between stacked rows */
/** Inline badge/label padding (e.g. div.title) — scales with viewport. */
/* vertical:   3px → ~6px  */
/* horizontal: 8px → ~14px */
/*****  responsive breakpoint mixins  *************************************************/
/* Usage:  @include bp-up($break1) { … }   →  min-width: $break1              */
/*         @include bp-down($break2) { … } →  max-width: ($break2 - 1)        */
/*         @include bp-between($break3, $break2) { … }                        */
/**
 * Scale a CSS value (including clamp()) by a unitless factor at browser runtime.
 *
 * SCSS cannot perform arithmetic on clamp() because clamp() is a plain CSS string
 * from SASS's perspective — the result would be invalid interpolated text, not a
 * usable length.  Wrapping in calc() delegates the multiplication to the browser,
 * where it is perfectly valid.
 *
 * @param  $value   Any CSS length: a plain length (1rem), a variable, or clamp(…).
 * @param  $factor  Unitless number (e.g. 0.75).
 * @return          CSS calc($value * $factor) string.
 *
 * @example
 *   margin-bottom: scale-val($font_size_h2, 0.75);
 *   // → calc(clamp(1.375rem, 3vw, 2rem) * 0.75)
 */
/**
 * Centers and caps .frm.outer at $frm_max_width.
 * Use inside a min-width: $break1 media block to replace the old `width: $break1` pattern.
 * The frame grows with the viewport up to $frm_max_width, with $frm_max_width_padding on each side.
 */
*, :after, :before {
  box-sizing: border-box;
  transition: visibility linear 1s, opacity linear 1s;
  -moz-transition: visibility linear 1s, opacity linear 1s;
  -webkit-transition: visibility linear 1s, opacity linear 1s;
}

body, html {
  -webkit-font-smoothing: antialiased;
  font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: geometricPrecision;
  image-rendering: auto;
  shape-rendering: geometricprecision;
  color-rendering: optimizeQuality;
  background-color: #FFF;
}

html {
  font-family: Arial, Helvetica Neue, Helvetica, sans-serif;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
}

body {
  margin: 0;
  font-family: Arial, Helvetica Neue, Helvetica, sans-serif;
  font-size: 1rem;
  font-weight: 400;
  color: #000000;
}

.hidden {
  display: none !important;
}

.section {
  padding: 0;
  position: relative;
  /* height MUST NOT be set, otherwise the content will be cut off */
  min-height: inherit;
  margin: 0;
  overflow: hidden; /* nothing should be displayed outside of the bounds */
  /* of not defined differently, the normal behavior is: fit to section */
  /*border-bottom: 1px solid $fuchs_blau;*/
}
.section .frm {
  position: relative;
  height: 100%;
  width: 100%;
}
.section .frm.inner {
  padding-top: 56px;
  padding-left: 60px;
  padding-right: 60px;
}
@media (max-width: 501px) {
  .section .frm.inner {
    padding-left: 24px;
    padding-right: 24px;
  }
}
.section.hnf {
  min-height: 5rem;
}

main {
  position: relative;
  min-height: 100vh;
  z-index: 1;
}

a {
  color: inherit;
  font-size: inherit;
  text-decoration: none;
}
a:hover, a:focus, a:visited {
  text-decoration: none;
  color: inherit;
}

.modalbg {
  position: fixed;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  background-color: rgba(150, 150, 150, 0.7);
  z-index: 10;
}
.modalbg .modal {
  width: 600px;
  max-width: 80vw;
  max-width: calc(100vw - 40px);
  margin-left: auto;
  margin-right: auto;
  padding: 20px;
  background: #FFF;
  border-radius: 5px;
  margin-top: 10vh;
  max-height: 80vh;
  max-height: calc(90vh - 20px);
  position: relative;
}
.modalbg .modal .modalclose {
  background: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjwhRE9DVFlQRSBzdmcgIFBVQkxJQyAnLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4nICAnaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkJz48c3ZnIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMyIDMyIiBoZWlnaHQ9IjMycHgiIGlkPSLQodC70L7QuV8xIiB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAzMiAzMiIgd2lkdGg9IjMycHgiIHhtbDpzcGFjZT0icHJlc2VydmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPjxnIGlkPSJDYW5jZWwiPjxwYXRoIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTE2LDBDNy4xNjMsMCwwLDcuMTYzLDAsMTZjMCw4LjgzNiw3LjE2MywxNiwxNiwxNiAgIGM4LjgzNiwwLDE2LTcuMTYzLDE2LTE2QzMyLDcuMTYzLDI0LjgzNiwwLDE2LDB6IE0xNiwzMEM4LjI2OCwzMCwyLDIzLjczMiwyLDE2QzIsOC4yNjgsOC4yNjgsMiwxNiwyczE0LDYuMjY4LDE0LDE0ICAgQzMwLDIzLjczMiwyMy43MzIsMzAsMTYsMzB6IiBmaWxsPSIjMTIxMzEzIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiLz48cGF0aCBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0yMi43MjksMjEuMjcxbC01LjI2OC01LjI2OWw1LjIzOC01LjE5NSAgIGMwLjM5NS0wLjM5MSwwLjM5NS0xLjAyNCwwLTEuNDE0Yy0wLjM5NC0wLjM5LTEuMDM0LTAuMzktMS40MjgsMGwtNS4yMzEsNS4xODhsLTUuMzA5LTUuMzFjLTAuMzk0LTAuMzk2LTEuMDM0LTAuMzk2LTEuNDI4LDAgICBjLTAuMzk0LDAuMzk1LTAuMzk0LDEuMDM3LDAsMS40MzJsNS4zMDEsNS4zMDJsLTUuMzMxLDUuMjg3Yy0wLjM5NCwwLjM5MS0wLjM5NCwxLjAyNCwwLDEuNDE0YzAuMzk0LDAuMzkxLDEuMDM0LDAuMzkxLDEuNDI5LDAgICBsNS4zMjQtNS4yOGw1LjI3Niw1LjI3NmMwLjM5NCwwLjM5NiwxLjAzNCwwLjM5NiwxLjQyOCwwQzIzLjEyMywyMi4zMDgsMjMuMTIzLDIxLjY2NywyMi43MjksMjEuMjcxeiIgZmlsbD0iIzEyMTMxMyIgZmlsbC1ydWxlPSJldmVub2RkIi8+PC9nPjxnLz48Zy8+PGcvPjxnLz48Zy8+PGcvPjwvc3ZnPg==") no-repeat center center/20px #FFF;
  height: 20px;
  width: 20px;
  position: absolute;
  right: -5px;
  top: -5px;
  border-radius: 10px;
}

.overlaynote {
  pointer-events: none !important;
  position: fixed;
  display: flex;
  top: 6px;
  bottom: 6px;
  left: 0;
  right: 0;
  align-items: center;
  text-align: center;
  align-content: center;
  z-index: 2147483641;
  overflow: hidden;
  padding: 0.5rem;
}
.overlaynote .ol_base {
  pointer-events: auto;
  width: 600px;
  max-width: 100%;
  background-color: rgb(86, 165, 50);
  z-index: 2000;
  border: 1px solid #CCC;
  margin: auto;
  font-size: 110%;
  line-height: 125%;
}
.overlaynote .ol_base .ol_content {
  overflow: hidden;
  position: relative;
}
.overlaynote .ol_base .ol_content > div {
  max-height: calc(100vh - 16px - 5rem);
  overflow: auto;
  position: relative;
  padding: 1rem;
}
.overlaynote .ol_base .ol_content > div > p:first-child {
  margin-top: 0;
}
.overlaynote .ol_base .ol_content.scroll > div {
  max-height: calc(100vh - 16px - 6rem);
  margin-bottom: 1rem;
}
.overlaynote .ol_base .ol_content.scroll:after {
  content: "...";
  position: absolute;
  bottom: 0;
  left: 0;
}
.overlaynote .ol_base .ol_btnframe {
  height: 3rem;
  min-height: 3rem;
}
.overlaynote .ol_base .ol_btnframe > div {
  width: 100px;
  margin: 15px auto 5px auto;
  background-color: #FFF;
  border: 1px solid #727272;
  border-radius: 3px;
  padding: 6px 10px;
  cursor: pointer;
  box-shadow: 0px 0px 3px rgba(50, 50, 50, 0.6);
}

a.dpl {
  text-decoration: underline !important;
}

div.msframe {
  display: block;
  overflow-x: auto;
  width: 100%;
  max-width: 100%;
}

header, main, footer {
  width: 100%;
  position: relative;
}

header {
  background-color: rgb(27, 67, 121);
  height: 89px;
  position: fixed;
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 7;
  -webkit-transition: height 0.21s linear;
  -moz-transition: height 0.21s linear;
  transition: height 0.21s linear;
  /* the element directly following the header needs to have an offset from top, because header is fixed positioned */
  /* nav *****************************************************************************/
}
header.cookie {
  min-height: 174px;
  height: auto;
}
header .frm.outer {
  position: relative;
  height: 100%;
  min-height: 89px;
  max-height: 89px;
  /*&::after {
      background: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjM4LjY1bW0iIGhlaWdodD0iMi4wMTk3bW0iIHZlcnNpb249IjEuMSIgdmlld0JveD0iMCAwIDIzOC42NSAyLjAxOTciIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6Y2M9Imh0dHA6Ly9jcmVhdGl2ZWNvbW1vbnMub3JnL25zIyIgeG1sbnM6ZGM9Imh0dHA6Ly9wdXJsLm9yZy9kYy9lbGVtZW50cy8xLjEvIiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj4KIDxkZWZzPgogIDxyYWRpYWxHcmFkaWVudCBpZD0icmFkaWFsR3JhZGllbnQ4NzciIGN4PSIxMDguNDgiIGN5PSIxMTQuODIiIHI9IjExOS44MiIgZ3JhZGllbnRUcmFuc2Zvcm09Im1hdHJpeCgxIDAgMCAuMDE4Mzg4IDAgMTEyLjkpIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSI+CiAgIDxzdG9wIHN0b3AtY29sb3I9IiM2NDY0NjQiIG9mZnNldD0iMCIvPgogICA8c3RvcCBzdG9wLWNvbG9yPSIjNjQ2NDY0IiBzdG9wLW9wYWNpdHk9IjAiIG9mZnNldD0iMSIvPgogIDwvcmFkaWFsR3JhZGllbnQ+CiA8L2RlZnM+CiA8bWV0YWRhdGE+CiAgPHJkZjpSREY+CiAgIDxjYzpXb3JrIHJkZjphYm91dD0iIj4KICAgIDxkYzpmb3JtYXQ+aW1hZ2Uvc3ZnK3htbDwvZGM6Zm9ybWF0PgogICAgPGRjOnR5cGUgcmRmOnJlc291cmNlPSJodHRwOi8vcHVybC5vcmcvZGMvZGNtaXR5cGUvU3RpbGxJbWFnZSIvPgogICAgPGRjOnRpdGxlLz4KICAgPC9jYzpXb3JrPgogIDwvcmRmOlJERj4KIDwvbWV0YWRhdGE+CiA8ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxMC44NTUgLTExNS4xOSkiPgogIDxwYXRoIGQ9Im0tMTAuODU1IDExNS4xOWExMTkuODIgMi4yMDMzIDAgMCAwIDExOS4zMyAyLjAxOTcgMTE5LjgyIDIuMjAzMyAwIDAgMCAxMTkuMzItMi4wMTk3eiIgZmlsbD0idXJsKCNyYWRpYWxHcmFkaWVudDg3NykiIHN0eWxlPSJwYWludC1vcmRlcjptYXJrZXJzIGZpbGwgc3Ryb2tlIi8+CiA8L2c+Cjwvc3ZnPg==') top center no-repeat transparent;
      background-size: 100% 100%;
  }*/
}
@media (min-height: 561px) and (min-width: 561px) {
  header { /*  when topstrip is visible  */
    height: calc(89px + 43px);
    /*max-height: calc(89px + 43px);*/
  }
  header.cookie {
    height: calc(174px + 43px);
  }
  header > .frm.outer {
    height: 89px;
    max-height: 89px;
  }
}
@media (min-width: 961px) {
  header {
    /*  applies also to .frm.outer inside of topstrip */
  }
  header .frm.outer {
    width: calc(100% - 48px);
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
  }
}
@media (max-height: 499px) {
  header {
    height: 66px;
    max-height: 66px;
  }
  header.cookie {
    min-height: 151px;
  }
  header > .frm.outer {
    min-height: 66px;
    max-height: 66px;
  }
  header .logo {
    top: 13px;
  }
  header .logo img.logo-image {
    max-height: 40px;
  }
  header #toggle-nav, header #toggle-loc, header #logout {
    top: 19px;
  }
}
@media (max-height: 499px) and (max-width: 800px) {
  header .nav_menu_frm {
    top: 66px !important;
  }
}
header .logo {
  position: absolute;
  left: 32px;
  top: 15px;
}
@media (min-width: 981px) {
  header .logo {
    left: 0;
  }
}
header .logo .nav-link--home {
  position: relative;
  left: -15px;
}
header .logo .logo-image {
  max-height: 61px;
  width: 131px;
  color: #FFF; /* if alt-text is shown */
  font-size: 1.3rem; /* if alt-text is shown */
  word-wrap: break-word; /* if alt-text is shown */
}
@media (max-width: 361px) {
  header .logo .logo-image {
    width: 109px;
    max-height: 50.7557251908px; /*  preserve aspect ratio  */
    margin-top: 10.2442748092px; /*  to preserve the position  */
  }
}
header + main, header + footer {
  margin-top: 89px;
  min-height: calc(100vh - 89px);
}
@media (min-height: 561px) and (min-width: 561px) {
  header + main, header + footer { /*  when topstrip is visible  */
    margin-top: calc(89px + 43px);
    min-height: calc(100vh - 89px - 43px);
  }
}
@media (max-height: 499px) {
  header + main, header + footer {
    margin-top: 66px;
    min-height: calc(100vh - 66px);
  }
}
header.nfb {
  height: 97px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.7);
}
header.nfb .topstrip {
  height: 0;
  border-bottom-style: solid;
  padding-top: 7px;
  border-bottom-width: 1px;
}
header .topstrip {
  display: none;
  width: inherit;
  position: relative;
  padding-top: 7.181px; /* was .45rem */
  background-color: rgb(86, 165, 50);
  -webkit-transition: height 0.2s ease;
  -moz-transition: height 0.2s ease;
  transition: height 0.2s ease;
}
@media (min-height: 561px) and (min-width: 561px) {
  header .topstrip { /*  make topstrip is visible  */
    display: block;
    height: 43px;
    overflow: hidden;
    max-height: 43px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.7);
  }
  header .topstrip > .frm.outer {
    height: 100%;
    width: calc(100% - 40px);
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(var(--gcc, 1), 1fr);
    align-items: center;
  }
}
@media (min-height: 561px) and (min-width: 561px) and (min-width: 981px) {
  header .topstrip > .frm.outer {
    width: calc(100% - 48px);
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
  }
}
@media (min-height: 561px) and (min-width: 561px) and (max-width: 619px) {
  header .topstrip > .frm.outer {
    grid-template-columns: 1fr;
  }
  header .topstrip > .frm.outer .claim {
    grid-column: auto;
  }
  header .topstrip > .frm.outer .claim:nth-child(n+2) {
    display: none;
  }
}
@media (min-height: 561px) and (min-width: 561px) and (min-width: 620px) and (max-width: 929px) {
  header .topstrip > .frm.outer {
    grid-template-columns: repeat(2, 1fr);
  }
  header .topstrip > .frm.outer .claim {
    grid-column: auto;
  }
  header .topstrip > .frm.outer .claim:nth-child(n+3) {
    display: none;
  }
}
@media (min-height: 561px) and (min-width: 561px) and (min-width: 930px) and (max-width: 1239px) {
  header .topstrip > .frm.outer {
    grid-template-columns: repeat(3, 1fr);
  }
  header .topstrip > .frm.outer .claim {
    grid-column: auto;
  }
  header .topstrip > .frm.outer .claim:nth-child(n+4) {
    display: none;
  }
}
@media (min-height: 561px) and (min-width: 561px) {
  header .topstrip div.claim {
    grid-column: var(--gcp, auto);
    overflow: hidden;
    height: 100%;
    text-align: center;
    min-width: 236.5px;
    color: #FFF;
  }
  header .topstrip div.claim span, header .topstrip div.claim img {
    line-height: 1.4rem;
    font-size: 14.3333333333px;
    font-weight: 700;
    height: 17.501px;
    vertical-align: bottom;
  }
  header .topstrip div.claim img {
    margin-right: 0.5rem;
  }
}
header #toggle-nav, header #toggle-loc {
  display: none;
}
header .nav_contact {
  list-style: none;
  color: #FFF;
  font-size: 0.88rem;
  display: inline-block;
  position: absolute;
  text-align: right;
  right: 20px;
  bottom: 0;
  width: 14rem;
  margin: 0 0 11px 0;
}
@media (min-width: 981px) {
  header .nav_contact {
    right: 0;
  }
}
@media (max-width: 800px) {
  header .nav_contact {
    margin-left: auto;
    margin-right: auto;
    width: auto;
    left: 168px;
    right: 63px;
    text-align: center;
  }
}
@media (max-width: 361px) {
  header .nav_contact {
    left: 146px;
    width: auto;
  }
}
header .nav_menu_frm {
  position: absolute;
  bottom: 0;
  right: calc(14rem + 20px); /*  in sync with width of nav-contact */
  left: 150px;
}
header .nav_menu_frm a {
  color: #FFF;
  font-size: inherit;
  text-decoration: none;
}
header .nav_menu_frm a:hover, header .nav_menu_frm a:focus, header .nav_menu_frm a:visited {
  text-decoration: none;
  color: #FFF;
}
header .nav_menu_frm ul {
  padding: 0;
  margin: 0;
}
header .nav_menu_frm .nav-link.current {
  font-weight: 600;
}
header .nav_menu_frm .flyout {
  display: none;
}
@media (min-width: 981px) {
  header .nav_menu_frm {
    left: 130px;
  }
}
@media (min-width: 801px) {
  header .nav_menu_frm .nav_menu {
    text-align: right;
  }
  header .nav_menu_frm li {
    list-style: none;
    font-size: 0.88rem;
    padding: 0 0.6rem;
    display: inline-block;
    margin: 0 0 11px 0;
  }
  header .nav_menu_frm li + li {
    margin-left: 1rem;
  }
}
@media (min-width: 562px) and (max-width: 800px) {
  header .nav_menu_frm {
    left: auto;
    width: 360px;
  }
}
@media (max-width: 800px) {
  header .nav_menu_frm {
    display: none;
    position: fixed;
    top: 89px; /* applies also to lower breaks */
    bottom: 0; /* applies also to lower breaks */
    right: 0;
    background-color: rgb(27, 67, 121);
    overflow-y: auto;
  }
  header .nav_menu_frm ul {
    position: relative;
    display: block;
    margin: 0 auto;
    width: 360px;
    max-width: calc(100vw - 48px);
  }
  header .nav_menu_frm ul li, header .nav_menu_frm ul .flyout {
    display: block;
    position: relative;
    text-align: center;
    font-size: 1.125rem;
    line-height: 2rem;
    border-bottom: 1px solid #FFF;
    padding: 0.375rem 0;
  }
  header .nav_menu_frm ul li a {
    padding-top: 1rem;
    display: block;
  }
  header .nav_menu_frm ul .flyout {
    background: rgb(86, 165, 50);
    margin-top: 10px;
    color: #FFF;
  }
  header .nav_menu_frm ul .flyout .fo_icon {
    margin-right: 0.5rem;
  }
  header .nav_menu_frm ul .flyout .fo_icon img {
    max-height: 1.5rem;
    max-width: 1.5rem;
    object-fit: scale-down;
    object-position: bottom center;
  }
  header .nav_menu_frm ul .flyout .fo_icon.block {
    margin-right: 0;
    display: block;
    margin-bottom: 0.5rem;
  }
  header .nav_menu_frm ul .flyout .fo_icon.block > img, header .nav_menu_frm ul .flyout .fo_icon.block > div {
    display: inline;
    max-height: 2rem;
    height: 2rem;
    margin-right: 0.5rem;
  }
  header .nav_menu_frm ul .flyout > div {
    display: inline;
    max-height: 2rem;
    height: 2rem;
  }
  header .nav_menu_frm ul .flyout .fo_content img {
    height: 0;
    width: 0;
    position: absolute;
    display: none;
  }
}
@media (max-width: 561px) {
  header .nav_menu_frm {
    left: 0;
  }
}
@media (max-width: 800px) {
  header #toggle-nav, header #toggle-loc, header #logout {
    display: block;
    position: absolute;
    cursor: pointer;
    z-index: 6;
    top: 30.5px;
  }
  header #logout {
    font-size: 0.8rem;
    font-style: italic;
    left: 1.6rem;
    left: calc(1.6rem + 5px);
  }
  header #toggle-nav {
    right: 30px; /*  $head_margin_lr = logo from left + additional 10 */
    padding-top: 2px;
  }
  header #toggle-nav.active ~ .nav_menu_frm {
    display: block;
  }
  header #toggle-loc {
    right: 68px;
    width: auto;
    height: 28px;
    text-align: right;
    font-size: 1rem;
  }
  header #toggle-loc > a {
    position: relative;
    top: 100%;
    line-height: 1;
    transform: perspective(1px) translateY(-100%);
    display: inline-block;
    padding-bottom: 0.2rem;
  }
  header #toggle-loc a.active {
    color: rgb(86, 165, 50);
  }
  header #toggle-loc a, header #toggle-loc a.visited {
    text-decoration: none !important;
  }
  header #toggle-loc > a + a::before {
    content: "|";
    margin: 0 0.3rem 0 0.15rem;
  }
  header .hamburger {
    width: 28px;
    height: 28px;
    border: 1px solid #FFF;
    border-radius: 3px;
    cursor: pointer;
  }
  header .hamburger.lines div, header .hamburger.lines div:before, header .hamburger.lines div:after {
    background-color: #FFF;
    width: 20px;
    height: 2px;
    content: "";
    position: absolute;
  }
  header .hamburger.lines div {
    top: 12px;
    left: 3px;
  }
  header .hamburger.lines div:before {
    transform: translateY(-6px);
  }
  header .hamburger.lines div:after {
    transform: translateY(6px);
  }
  header .hamburger.lines.active div {
    background-color: transparent !important;
  }
  header .hamburger.lines.active div:after, header .hamburger.lines.active div:before {
    transform: translateY(0);
  }
  header .hamburger.lines.active div:before {
    transform: rotate(45deg);
  }
  header .hamburger.lines.active div:after {
    transform: rotate(-45deg);
  }
}

.quickaccess {
  z-index: 5;
  display: none;
}
@media (min-width: 561px) {
  .quickaccess { /*  will not be displayed on small screens  */
    display: block;
    /* must be child to body, otherwise will not work */
  }
  .quickaccess .flyouts {
    height: calc(100vh - 89px);
    position: fixed;
    top: 89px;
    background: none;
    min-width: 40px;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    align-items: center;
    width: 60px;
    z-index: 6;
  }
}
@media (min-width: 561px) and (min-height: 561px) and (min-width: 561px) {
  .quickaccess .flyouts { /*  when topstrip is visible  */
    top: calc(89px + 43px);
    height: calc(100vh - 89px - 43px);
  }
}
@media (min-width: 561px) {
  .quickaccess .flyouts.left {
    left: 0;
    justify-content: flex-start;
    justify-content: left;
  }
  .quickaccess .flyouts.left .flyout.hv:hover:after, .quickaccess .flyouts.left .flyout.hv:focus:after, .quickaccess .flyouts.left .flyout.hover:after {
    right: -5px;
    left: auto;
  }
  .quickaccess .flyouts.left .flyout.hv:hover .fo_content, .quickaccess .flyouts.left .flyout.hv:focus .fo_content, .quickaccess .flyouts.left .flyout.hover .fo_content {
    /* blend to left-to-right */
    left: 65px;
    right: auto;
  }
  .quickaccess .flyouts.right {
    right: 0;
    justify-content: flex-end;
    justify-content: right;
  }
  .quickaccess .flyouts.right .flyout.hv:hover:after, .quickaccess .flyouts.right .flyout.hv:focus:after, .quickaccess .flyouts.right .flyout.hover:after {
    left: -5px;
    right: auto;
  }
  .quickaccess .flyouts.right .flyout.hv:hover .fo_content, .quickaccess .flyouts.right .flyout.hv:focus .fo_content, .quickaccess .flyouts.right .flyout.hover .fo_content {
    /* blend to right-to-left */
    left: auto;
    right: 65px;
  }
  .quickaccess .flyouts .fo_frm {
    width: inherit;
    flex: 1;
  }
  .quickaccess .flyouts .fo_frm .flyout {
    height: 60px;
    width: 60px;
    min-width: 60px;
    box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.3);
    position: relative;
    background-color: rgb(86, 165, 50);
    cursor: pointer;
  }
  .quickaccess .flyouts .fo_frm .flyout.block {
    height: 300px;
  }
}
@media (min-width: 561px) and (max-height: 389px) {
  .quickaccess .flyouts .fo_frm .flyout.block {
    display: none;
  }
}
@media (min-width: 561px) {
  .quickaccess .flyouts .fo_frm .flyout.hv:hover, .quickaccess .flyouts .fo_frm .flyout.hv:focus, .quickaccess .flyouts .fo_frm .flyout.hover {
    box-sizing: border-box;
    background-color: rgb(27, 67, 121);
  }
  .quickaccess .flyouts .fo_frm .flyout.hv:hover.block, .quickaccess .flyouts .fo_frm .flyout.hv:focus.block, .quickaccess .flyouts .fo_frm .flyout.hover.block {
    height: 300px;
  }
  .quickaccess .flyouts .fo_frm .flyout.hv:hover.block .fo_content, .quickaccess .flyouts .fo_frm .flyout.hv:focus.block .fo_content, .quickaccess .flyouts .fo_frm .flyout.hover.block .fo_content {
    height: 300px;
    cursor: default;
    padding: 0;
  }
  .quickaccess .flyouts .fo_frm .flyout.hv:hover.block .fo_content > table, .quickaccess .flyouts .fo_frm .flyout.hv:focus.block .fo_content > table, .quickaccess .flyouts .fo_frm .flyout.hover.block .fo_content > table {
    border-collapse: collapse;
    height: 100%;
    width: 100%;
  }
  .quickaccess .flyouts .fo_frm .flyout.hv:hover.block .fo_content > table td, .quickaccess .flyouts .fo_frm .flyout.hv:focus.block .fo_content > table td, .quickaccess .flyouts .fo_frm .flyout.hover.block .fo_content > table td {
    text-align: center;
    vertical-align: middle;
    height: 300px;
    border: none;
    padding: 0;
  }
  .quickaccess .flyouts .fo_frm .flyout.hv:hover.block .fo_content > table td > *, .quickaccess .flyouts .fo_frm .flyout.hv:focus.block .fo_content > table td > *, .quickaccess .flyouts .fo_frm .flyout.hover.block .fo_content > table td > * {
    text-align: left;
  }
  .quickaccess .flyouts .fo_frm .flyout.hv:hover.block .fo_content > table td > div.frm, .quickaccess .flyouts .fo_frm .flyout.hv:focus.block .fo_content > table td > div.frm, .quickaccess .flyouts .fo_frm .flyout.hover.block .fo_content > table td > div.frm {
    max-height: 300px;
  }
  .quickaccess .flyouts .fo_frm .flyout.hv:hover.block .fo_content .iimg, .quickaccess .flyouts .fo_frm .flyout.hv:focus.block .fo_content .iimg, .quickaccess .flyouts .fo_frm .flyout.hover.block .fo_content .iimg {
    display: block;
    margin: 0;
  }
}
@media (min-width: 561px) and (max-width: 760px) {
  .quickaccess .flyouts .fo_frm .flyout.hv:hover.block .fo_content .iimg, .quickaccess .flyouts .fo_frm .flyout.hv:focus.block .fo_content .iimg, .quickaccess .flyouts .fo_frm .flyout.hover.block .fo_content .iimg {
    display: none;
  }
}
@media (min-width: 561px) {
  .quickaccess .flyouts .fo_frm .flyout.hv:hover:after, .quickaccess .flyouts .fo_frm .flyout.hv:focus:after, .quickaccess .flyouts .fo_frm .flyout.hover:after {
    width: 5px;
    position: absolute;
    right: -5px;
    height: 100%;
    background-color: rgb(27, 67, 121);
    content: "";
  }
  .quickaccess .flyouts .fo_frm .flyout.hv:hover .fo_icon, .quickaccess .flyouts .fo_frm .flyout.hv:focus .fo_icon, .quickaccess .flyouts .fo_frm .flyout.hover .fo_icon {
    background-color: rgb(27, 67, 121);
  }
  .quickaccess .flyouts .fo_frm .flyout.hv:hover .fo_content, .quickaccess .flyouts .fo_frm .flyout.hv:focus .fo_content, .quickaccess .flyouts .fo_frm .flyout.hover .fo_content {
    position: absolute;
    min-width: 300px;
    width: auto;
    max-width: calc(100vw - 60px - 4px); /* incl border */
    height: 60px; /* add padding */
    /*-webkit-transform: translate(-10px, 0);
    -moz-transform: translate(-10px, 0);
    -ms-transform: translate(-10px, 0);
    -o-transform: translate(-10px, 0);
    transform: translate(-10px, 0);*/
    /*  OLD VERSION

    height: 400px;
    -webkit-transform: translate(80px, -200px + $flyout_icon_width / 2 + $flyout_icon_frame);
    -moz-transform: translate(80px, -200px + $flyout_icon_width / 2 + $flyout_icon_frame);
    -ms-transform: translate(80px, -200px + $flyout_icon_width / 2 + $flyout_icon_frame);
    -o-transform: translate(80px, -200px + $flyout_icon_width / 2 + $flyout_icon_frame);
    transform: translate(80px, -200px + $flyout_icon_width / 2 + $flyout_icon_frame);*/
    /*top: -200px + $flyout_icon_width / 2 + $flyout_icon_frame;*/
    display: block;
    background-color: rgb(86, 165, 50);
    -moz-transition: width 0.5s linear, opacity 0.2s ease-in;
    -webkit-transition: width 0.5s linear, opacity 0.2s ease-in;
    transition: width 0.5s linear, opacity 0.2s ease-in;
    /*  OLD VERSION
    -moz-transition: width linear 0.3s, height linear 0.3s, transform linear 0.3s;
    -webkit-transition: width linear 0.3s, height linear 0.3s, transform linear 0.3s;
    transition: width linear 0.3s, height linear 0.3s, transform linear 0.3s;
    */
    opacity: 1;
    border: 2px solid rgb(86, 165, 50);
    padding: 10px;
    color: #FFF;
    font-size: 1.2rem;
    vertical-align: middle;
    line-height: 2rem;
    box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.3);
  }
  .quickaccess .flyouts .fo_frm .flyout.hv:hover .fo_content div.frm, .quickaccess .flyouts .fo_frm .flyout.hv:focus .fo_content div.frm, .quickaccess .flyouts .fo_frm .flyout.hover .fo_content div.frm {
    width: auto;
    display: inline-block;
    overflow: hidden;
    max-height: 100%;
    max-width: 100%;
    min-width: 280px;
    overflow: auto;
    opacity: 1;
    -moz-transition-delay: 0.5s;
    -webkit-transition-delay: 0.5s;
    transition-delay: 0.5s;
  }
  .quickaccess .flyouts .fo_frm .flyout + .flyout {
    margin-top: 10px;
  }
  .quickaccess .flyouts .fo_frm .flyout .fo_icon {
    position: absolute;
    height: 40px;
    width: 40px;
    left: 10px;
    top: 10px;
    background-color: rgb(86, 165, 50);
    text-align: center;
  }
  .quickaccess .flyouts .fo_frm .flyout .fo_icon img {
    width: 100%;
    max-width: 100%;
    max-height: 100%;
  }
  .quickaccess .flyouts .fo_frm .flyout .fo_icon .lbl {
    transform: translate(0px, 230px) rotate(-90deg);
    font-size: 1.8rem;
    color: #FFF;
    height: 40px;
    width: 230px;
    line-height: 2.4rem;
    font-weight: 600;
    transform-origin: top left;
    text-align: left;
  }
  .quickaccess .flyouts .fo_frm .flyout .fo_content {
    opacity: 0;
    width: 0;
    height: 0;
    overflow: hidden;
  }
  .quickaccess .flyouts .fo_frm .flyout .fo_content > div.frm {
    opacity: 0;
    -moz-transition-delay: 0.5s;
    -webkit-transition-delay: 0.5s;
    transition-delay: 0.5s;
  }
}

footer {
  background-color: rgb(27, 67, 121);
  position: relative;
  color: #FFF;
  font-size: 0.875rem;
  z-index: 6;
  /* ---- CTA strip ---- */
  /* ---- Main columns ---- */
  /* ---- Bottom bar ---- */
}
footer .frm.outer {
  position: relative;
}
@media (min-width: 961px) {
  footer .frm.outer {
    width: calc(100% - 48px);
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
  }
}
footer .frm.inner {
  padding-left: 24px;
  padding-right: 24px;
}
footer .ft_cta_strip {
  padding: 3rem 0;
}
footer .ft_cta_strip .frm.inner {
  display: flex;
  align-items: center;
  gap: 2rem;
  flex-wrap: wrap;
}
@media (max-width: 768px) {
  footer .ft_cta_strip .frm.inner {
    flex-direction: column;
    align-items: flex-start;
  }
}
footer .ft_cta_strip .ft_cta_left {
  flex: 1 1 300px;
}
footer .ft_cta_strip .ft_cta_left p {
  margin: 0;
  font-size: 2.4rem;
  line-height: 1.2;
  color: #FFF;
}
footer .ft_cta_strip .ft_cta_left p:last-child {
  font-weight: 700;
}
footer .ft_cta_strip .ft_cta_contacts {
  flex: 1 1 380px;
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}
footer .ft_cta_strip .ft_cta_card {
  display: flex;
  align-items: center;
  gap: 1rem;
  background: rgba(255, 255, 255, 0.1);
  border-radius: 6px;
  padding: 0.85rem 1rem;
  color: #FFF;
  text-decoration: none;
  transition: background 0.2s ease !important;
}
footer .ft_cta_strip .ft_cta_card:hover {
  background: rgba(255, 255, 255, 0.18);
}
footer .ft_cta_strip .ft_cta_card .ft_cta_icon {
  flex-shrink: 0;
  width: 38px;
  height: 38px;
  display: flex;
  align-items: center;
  justify-content: center;
}
footer .ft_cta_strip .ft_cta_card .ft_cta_icon svg {
  width: 22px;
  height: 22px;
}
footer .ft_cta_strip .ft_cta_card .ft_cta_text {
  flex: 1;
  display: flex;
  flex-direction: column;
}
footer .ft_cta_strip .ft_cta_card .ft_cta_text strong {
  font-size: 0.95rem;
  font-weight: 600;
}
footer .ft_cta_strip .ft_cta_card .ft_cta_text span {
  font-size: 0.8rem;
  opacity: 0.75;
}
footer .ft_cta_strip .ft_cta_card .ft_cta_arrow {
  font-size: 1.4rem;
  opacity: 0.6;
  line-height: 1;
}
footer .ft_main {
  border-top: 1px solid rgba(255, 255, 255, 0.15);
  padding: 3rem 0 2.5rem;
}
footer .ft_main .frm.inner {
  display: grid;
  /*
       * 3-column layout:
       *   brand column fills remaining space (1fr),
       *   leistungen and kontakt shrink to their content (auto).
       */
  grid-template-columns: 1fr auto auto;
  grid-template-areas: "brand leistungen kontakt";
  column-gap: 4rem;
  row-gap: 2.5rem;
  align-items: start;
  /*
       * 2-column breakpoint:
       *   brand occupies its own full row,
       *   leistungen + kontakt share the second row side-by-side.
       */
  /* 1-column / mobile */
}
@media (max-width: 820px) {
  footer .ft_main .frm.inner {
    grid-template-columns: 1fr 1fr;
    grid-template-areas: "brand     brand" "leistungen kontakt";
    column-gap: 2.5rem;
  }
}
@media (max-width: 520px) {
  footer .ft_main .frm.inner {
    grid-template-columns: 1fr;
    grid-template-areas: "brand" "leistungen" "kontakt";
  }
}
footer .ft_col h4 {
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  color: #FFF;
  margin: 0 0 1.2rem;
}
footer .ft_col h4:nth-child(n+2) {
  margin-top: 1.8rem;
}
footer .ft_col ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
footer .ft_col ul li {
  margin-bottom: 0.75rem;
}
footer .ft_col ul li span {
  color: rgba(255, 255, 255, 0.8);
  font-size: 0.875rem;
  cursor: default;
}
footer .ft_col address {
  font-style: normal;
  font-size: 0.875rem;
}
footer .ft_col address p {
  margin: 0 0 0.6rem;
  color: rgba(255, 255, 255, 0.85);
}
footer .ft_col address a {
  color: rgba(255, 255, 255, 0.85);
  text-decoration: none;
}
footer .ft_col address a:hover {
  color: #FFF;
  text-decoration: underline;
}
footer .ft_col address .ft_hours {
  opacity: 0.6;
  font-size: 0.8rem;
}
footer .ft_col_brand {
  grid-area: brand;
}
footer .ft_col_brand .ft_logo {
  margin-bottom: 1.2rem;
}
footer .ft_col_brand .ft_logo img.logo-image {
  max-height: 60px;
  width: auto;
  filter: brightness(0) invert(1);
}
footer .ft_col_brand .ft_brand_desc {
  font-size: 0.8rem;
  color: rgba(255, 255, 255, 0.7);
  line-height: 1.5;
  margin: 0 0 1.2rem;
  /* cap width so the brand text doesn't stretch the whole row */
  max-width: 320px;
}
footer .ft_col_brand .ft_klimaschutz_btn {
  display: inline-block;
  background: rgb(86, 165, 50);
  color: #FFF;
  font-size: 0.8rem;
  font-weight: 600;
  padding: 0.5rem 1rem;
  border-radius: 3px;
  text-decoration: none;
  transition: background 0.2s ease !important;
}
footer .ft_col_brand .ft_klimaschutz_btn:hover {
  background: rgb(69.68, 133.688372093, 40.511627907);
}
footer .ft_col_leistungen {
  grid-area: leistungen;
}
footer .ft_col_kontakt {
  grid-area: kontakt;
}
footer .ft_bottom {
  border-top: 1px solid rgba(255, 255, 255, 0.15);
  padding: 1.1rem 0;
}
@media (max-width: 960px) {
  footer .ft_bottom {
    padding-bottom: 3.1rem;
  }
}
footer .ft_bottom .frm.inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.5rem;
}
footer .ft_bottom .ft_bottom_copy {
  font-size: 0.78rem;
  color: rgba(255, 255, 255, 0.5);
}
footer .ft_bottom .ft_bottom_links {
  display: flex;
  gap: 1.2rem;
}
footer .ft_bottom .ft_bottom_links a {
  font-size: 0.78rem;
  color: rgba(255, 255, 255, 0.65);
  text-decoration: none;
}
footer .ft_bottom .ft_bottom_links a:hover {
  color: #FFF;
  text-decoration: underline;
}
footer #pw {
  position: absolute;
  bottom: 0.5rem;
  right: 0.5rem;
}

#cookieconsent {
  min-height: 85px;
  background: #EEE;
  font-size: 1rem;
}
#cookieconsent .frm.outer {
  padding: 0.8rem 5.8rem 0.8rem 0.8rem;
  position: relative;
  z-index: 12;
  background: inherit;
  height: auto;
  min-height: calc(85px + 1.6rem);
  width: 100%;
  max-height: 50vh;
}
#cookieconsent .frm.outer #confirmcookieuse {
  background: rgb(86, 165, 50);
  color: #FFF;
  position: absolute;
  padding: 10px;
  font-weight: 600;
  right: 0;
  bottom: 0.8rem;
  width: 5rem;
  font-variant-caps: small-caps;
  text-align: center;
  cursor: pointer;
  z-index: 99;
}
#cookieconsent + .topstrip {
  display: none;
}

button {
  cursor: pointer;
  user-select: none;
}

.btn {
  cursor: pointer;
  user-select: none;
  border: 1px solid rgb(27, 67, 121);
  background-color: white;
}
.btn.blue {
  background-color: rgb(27, 67, 121);
  color: #FFF;
  border-color: rgb(27, 67, 121);
}
.btn.blue a:visited {
  color: #FFF;
}
.btn.blue:hover {
  background-color: rgb(86, 165, 50);
}
.btn.green {
  background-color: rgb(86, 165, 50);
  color: #FFF;
  border-color: rgb(86, 165, 50);
}
.btn.green a:visited {
  color: #FFF;
}
.btn.green:hover {
  background-color: rgb(27, 67, 121);
}
.btn.exposed {
  box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.3);
  padding: 1rem;
}
.btn.exposed.fill {
  padding: 0;
}
.btn.exposed.fill a {
  height: auto;
  width: 100%;
}
.btn.exposed.big {
  font-size: 125%;
  padding: 1rem 1.75rem;
}
.btn.exposed.big a {
  margin-left: 1.5rem;
}
.btn.exposed a {
  width: 100%;
  height: 100%;
  display: inline-block;
  font-size: 120%;
  font-weight: 700;
  line-height: 1.5rem; /* 2 rows = image */
}
.btn.exposed + label, .btn.exposed + .label {
  color: rgb(27, 67, 121);
  font-size: 120%;
  font-weight: 700;
  margin-top: 1rem;
  line-height: 1.5;
}
.btn.exposed img {
  width: 2.5rem;
  height: 2.5rem;
}
.btn.exposed img + a {
  text-align: left !important;
  width: auto !important;
  margin-left: 1rem;
}

.linkblocks.fixoverlay {
  position: fixed;
  top: 170px;
  z-index: 50;
  height: auto;
  display: block;
  margin: auto;
  background: #FFF;
}
.linkblocks.fixoverlay + div.foback {
  content: "";
  display: block;
  z-index: auto;
  width: 100vw;
  left: 0;
  position: fixed;
  height: 100vh;
  background: rgba(255, 255, 255, 0.8);
  user-select: none;
  top: 0;
}

.kit.intro {
  font-size: 1.2rem;
  line-height: 1.3rem;
}
@media (max-width: 768px) {
  .kit.intro {
    font-size: 1.1rem;
  }
}
.kit.headline {
  font-size: clamp(2rem, 5vw, 3.5rem);
  line-height: 1.15;
  font-weight: 700;
}
@media (max-width: 768px) {
  .kit.headline {
    font-size: clamp(1.375rem, 3vw, 2rem);
  }
}
.kit.ct {
  text-align: center;
}
.kit.top {
  font-size: 1.65rem;
  line-height: 1.8rem;
}
@media (max-width: 768px) {
  .kit.top {
    font-size: 1.3rem;
    line-height: 1.5rem;
  }
}
.kit.top2 {
  font-size: 1.35rem;
  line-height: 1.8rem;
}
@media (max-width: 768px) {
  .kit.top2 {
    font-size: 1.15rem;
    line-height: 1.65rem;
  }
}

p.kit {
  font-size: 1.15rem;
  line-height: 2rem;
}
@media (max-width: 768px) {
  p.kit {
    font-size: 1.05rem;
    line-height: 1.85rem;
  }
}

.c2 .kit.intro {
  text-align: left;
}

ul.kit {
  margin-bottom: 2.5rem;
}
@media (max-width: 768px) {
  ul.kit {
    margin-bottom: 2.2rem;
  }
}
ul.kit li {
  font-size: 1.35rem;
  line-height: 1.8rem;
  margin-bottom: 1rem;
}
@media (max-width: 768px) {
  ul.kit li {
    font-size: 1.15rem;
    line-height: 1.65rem;
    margin-bottom: 0.8rem;
  }
}

.jobfrm .job.kit .jintro {
  text-align: left;
}
.jobfrm .job.kit .jintro p {
  font-size: 1.15rem;
  line-height: 2rem;
}
@media (max-width: 768px) {
  .jobfrm .job.kit .jintro p {
    font-size: 1.05rem;
    line-height: 1.85rem;
  }
}
.jobfrm .job.kit .jintro p.top {
  font-size: 1.35rem;
  line-height: 1.8rem;
}
@media (max-width: 768px) {
  .jobfrm .job.kit .jintro p.top {
    font-size: 1.15rem;
    line-height: 1.65rem;
  }
}
.jobfrm .job.kit .jintro ul {
  margin-bottom: 2.5rem;
}
@media (max-width: 768px) {
  .jobfrm .job.kit .jintro ul {
    margin-bottom: 2.2rem;
  }
}
.jobfrm .job.kit .jintro ul li {
  font-size: 1.35rem;
  line-height: 1.8rem;
  margin-bottom: 1rem;
}
@media (max-width: 768px) {
  .jobfrm .job.kit .jintro ul li {
    font-size: 1.15rem;
    line-height: 1.65rem;
    margin-bottom: 0.8rem;
  }
}
.jobfrm .job.kit .jtitle {
  text-align: center;
}
@media (max-width: 768px) {
  .jobfrm .job.kit .jtitle {
    font-size: 1.3rem;
    line-height: 1.65rem;
  }
}

.kitform.btn {
  border: 1px solid rgb(27, 67, 121);
  display: inline-block;
  border-radius: 2rem;
  height: auto;
  padding: 1rem 3rem;
  margin-top: 3rem;
  margin-bottom: 3rem;
  font-size: 1.3rem;
  cursor: pointer;
}
@media (max-width: 768px) {
  .kitform.btn {
    font-size: 1.15rem;
    margin-top: 2.2rem;
    margin-bottom: 2.2rem;
    padding: 0.8rem 1.2rem;
    border-radius: 1.8rem;
  }
}

section .headline p.kit, section p.kit.headline {
  font-size: 1.8rem;
  margin-bottom: 1.8rem;
}
@media (max-width: 768px) {
  section .headline p.kit, section p.kit.headline {
    font-size: 1.65rem;
  }
}

section {
  background: #FFF; /* default backcolor so that the section have a background in any case - for parallax effect */
}
section .frm.inner {
  overflow: auto;
  padding-top: clamp(3.5rem, 7vw, 6rem);
  padding-bottom: clamp(3.5rem, 7vw, 6rem);
}
@media (max-width: 561px) {
  section .frm.inner {
    padding-top: clamp(2rem, 5vw, 3.5rem);
    padding-bottom: clamp(2rem, 5vw, 3.5rem);
  }
}
@media (min-width: 961px) {
  section .frm.outer {
    width: calc(100% - 48px);
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    height: 100%;
    position: relative;
  }
  section .frm.outer .frm.inner {
    padding-left: 0;
    padding-right: 0;
  }
}
@media (min-width: 961px) and (max-width: 1248px) {
  section .frm.inner {
    padding-left: 60px;
    padding-right: 60px;
  }
}
section .centered div.content > div {
  text-align: center;
  display: block;
}
section .headline, section h1, section h2 {
  font-size: clamp(2rem, 5vw, 3.5rem);
  line-height: 1.15;
  color: rgb(27, 67, 121);
  font-weight: 700;
  margin-bottom: clamp(1.375rem, 3vw, 2rem);
  text-align: center;
}
section .headline p, section h1 p, section h2 p {
  margin: 0;
}
section .headline p.reset, section h1 p.reset, section h2 p.reset {
  font-weight: 400;
  font-size: 1rem;
  color: #000000;
  line-height: 1.3125rem;
}
section .headline em, section .headline span.akzent, section h1 em, section h1 span.akzent, section h2 em, section h2 span.akzent {
  color: rgb(86, 165, 50);
}
section .headline em.black, section .headline span.akzent.black, section h1 em.black, section h1 span.akzent.black, section h2 em.black, section h2 span.akzent.black {
  color: #111111;
}
section .headline span.black, section h1 span.black, section h2 span.black {
  color: #111111;
}
section h2 {
  font-size: clamp(1.375rem, 3vw, 2rem);
  line-height: 1.15;
  font-weight: 600;
}
section h3 {
  font-weight: 600;
}
section.dark {
  background-color: rgb(27, 67, 121);
  color: #FFF;
}
section.dark .headline, section.dark h1, section.dark h2 {
  color: #FFF;
}
section.light {
  background-color: #FFF;
  color: rgb(27, 67, 121);
}
section.light .headline, section.light h1, section.light h2 {
  color: rgb(27, 67, 121);
}
section.warm {
  background-color: #fafaf7;
  color: rgb(27, 67, 121);
}
section.warm .headline, section.warm h1, section.warm h2 {
  color: rgb(27, 67, 121);
}
section.lightgray {
  background-color: #e5e5e5;
  color: rgb(27, 67, 121);
}
section.lightgray .headline, section.lightgray h1, section.lightgray h2 {
  color: rgb(27, 67, 121);
}
section.akzent {
  background-color: rgb(86, 165, 50);
  color: #FFF;
}
section.akzent .headline, section.akzent h1, section.akzent h2 {
  color: #FFF;
}
section div.title {
  text-align: left;
}
section div.title > * {
  background-color: rgb(86, 165, 50);
  color: #FFF;
  padding: clamp(0.2rem, 0.4vw, 0.35rem) clamp(0.5rem, 1vw, 0.875rem);
  display: inline-block !important;
  font-size: 90%;
}
section div.title.right {
  text-align: right;
}
section div.content {
  font-size: clamp(0.875rem, 1.1vw, 1rem);
  line-height: 1.6;
}
section div.content div.image {
  display: inline;
}
section div.content div.image img {
  max-height: inherit;
  max-width: 100%;
}
section div.content p:first-of-type {
  margin-top: 0;
}
section div.content q {
  font-style: italic;
  color: rgb(27, 67, 121);
  font-weight: 600;
  font-family: Times, Times New Roman, Georgia, serif;
  font-size: 114%;
}
section .btnrow > .btnfrm, section .btnrow > .btn {
  float: left;
}
section .btnrow .btnfrm {
  display: inline-block;
  position: relative;
  text-align: center;
  display: inline-block;
}
section .btnrow .btnfrm.bc2:nth-child(n+2), section .btnrow .btnfrm.bc3:nth-child(n+2), section .btnrow .btnfrm.bc4:nth-child(n+2) {
  margin-left: 1.5rem;
}
section .btnrow .btnfrm.bc2 {
  width: calc(50% - 0.75rem);
}
section .btnrow .btnfrm.bc3 {
  width: calc(33% - 1rem);
}
section .btnrow .btnfrm.bc4 {
  width: calc(25% - 1.125rem);
}
section .btnrow .btnfrm .btn {
  display: inline-block;
}
section .btnrow .btnfrm .label, section .btnrow .btnfrm label {
  display: block;
  font-size: 1.25rem;
  font-weight: 700;
  text-align: center;
}

section:not(.fullscale_photo):has(+ section.fullscale_photo) .frm.inner {
  padding-bottom: calc(clamp(3.5rem, 7vw, 6rem) * 2);
}
@media (max-width: 561px) {
  section:not(.fullscale_photo):has(+ section.fullscale_photo) .frm.inner {
    padding-bottom: calc(clamp(2rem, 5vw, 3.5rem) * 2);
  }
}

section.frontpage {
  --overlay-opacity: 0; /* initial state: fully transparent; JS animates this up on image load */
  --intro-duration: 3s; /* fade-in duration; can be overridden inline on the section element */
  position: fixed;
  height: calc(100vh - 89px);
  top: 89px;
  width: inherit;
  border-bottom: none;
  /* Short screens: header collapses to $head_height_reduced (topstrip is hidden below
     $break3), so the fixed frontpage section must start at the reduced height to avoid
     a white gap between header and image. Overrides both the base and $break1 rules. */
  /*
  .frm.inner {
      padding: 0;
  }*/
}
section.frontpage + section {
  margin-top: 100vh; /* for parallax,  cannot be applied to main as padding, otherwise the hnf would have no effect anymore */
}
section.frontpage.hnf {
  height: auto;
  position: relative;
}
@media (min-width: 961px) {
  section.frontpage.hnf {
    height: auto;
    position: relative;
  }
}
section.frontpage.hnf + section {
  margin-top: 0vh; /* for parallax,  cannot be applied to main as padding, otherwise the hnf would have no effect anymore */
}
@media (min-width: 961px) {
  section.frontpage {
    height: calc(100vh - 132px);
    top: 132px;
    /* .frm.outer {
        width: 100% !important;
        height: 100% !important;
        margin: 0 !important;
    }*/
  }
}
@media (max-height: 499px) {
  section.frontpage {
    height: calc(100vh - 66px);
    top: 66px;
  }
}
section.frontpage .sp__teaser_frame {
  height: 100%;
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
}
section.frontpage .sp__teaser_frame::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  opacity: var(--overlay-opacity);
  background: linear-gradient(to right, rgba(17, 40, 75, 0.8) 0%, rgba(17, 40, 75, 0.8) 30%, rgba(17, 40, 75, 0.7) 60%, rgba(17, 40, 75, 0.6) 70%, rgba(17, 40, 75, 0.4) 85%, rgba(17, 40, 75, 0.3) 100%);
}
section.frontpage .sp__teaser_frame .sp__teaser_content {
  height: 100%;
  width: 100%;
  background: url() no-repeat center center/cover transparent;
  background-image: url();
  opacity: 0;
  overflow: hidden !important;
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  align-items: center;
  text-align: center;
}
section.frontpage .sp__teaser_frame .sp__teaser_content.active, section.frontpage .sp__teaser_frame .sp__teaser_content:only-child {
  opacity: 1;
}
section.frontpage .sp__teaser_frame .sp__teaser_content picture, section.frontpage .sp__teaser_frame .sp__teaser_content img {
  position: relative;
  z-index: 0;
  max-height: calc(100vh - 89px);
  height: calc(100vh - 89px);
  max-width: 100%;
  width: 100%;
  object-fit: cover;
  object-position: 50% 50%;
  object-position: center center;
  /* Short screens: match the reduced header height (topstrip hidden). */
}
@media (min-width: 961px) {
  section.frontpage .sp__teaser_frame .sp__teaser_content picture, section.frontpage .sp__teaser_frame .sp__teaser_content img {
    max-height: calc(100vh - 89px - 43px);
    height: calc(100vh - 89px - 43px);
  }
}
@media (max-height: 499px) {
  section.frontpage .sp__teaser_frame .sp__teaser_content picture, section.frontpage .sp__teaser_frame .sp__teaser_content img {
    max-height: calc(100vh - 66px);
    height: calc(100vh - 66px);
  }
}
section.frontpage.intro-animating .sp__teaser_frame::after,
section.frontpage.intro-animating .sp__teaser_textoverlay {
  transition: opacity var(--intro-duration) ease-in-out;
}
section.frontpage .sp__teaser_textoverlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 0;
  pointer-events: none;
  z-index: 2;
  opacity: var(--overlay-opacity); /* shares the same intro/scroll opacity as the ::after overlay */
}
@media (max-width: 960px) {
  section.frontpage .sp__teaser_textoverlay {
    padding-left: 60px;
    padding-right: 60px;
  }
}
@media (max-width: 960px) and (max-width: 501px) {
  section.frontpage .sp__teaser_textoverlay {
    padding-left: 24px;
    padding-right: 24px;
  }
}
section.frontpage .sp__teaser_textoverlay > * {
  pointer-events: auto;
}
section.frontpage .sp__teaser_textoverlay .sp__teaser_badge {
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgb(86, 165, 50);
  margin-bottom: 0.75rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
section.frontpage .sp__teaser_textoverlay .sp__teaser_badge::before {
  content: "";
  display: inline-block;
  width: 14px;
  height: 14px;
  background-color: rgb(86, 165, 50);
  flex-shrink: 0;
}
section.frontpage .sp__teaser_textoverlay .sp__teaser_headline {
  font-size: clamp(2rem, 5vw, 3.5rem);
  line-height: 1.15;
  font-weight: 800;
  color: #FFF;
  margin-bottom: 1.25rem;
  text-align: left;
  max-width: 700px;
}
section.frontpage .sp__teaser_textoverlay .sp__teaser_headline span, section.frontpage .sp__teaser_textoverlay .sp__teaser_headline em {
  color: rgb(86, 165, 50);
  font-style: normal;
}
section.frontpage .sp__teaser_textoverlay .sp__teaser_subtext {
  font-size: clamp(0.875rem, 1.5vw, 1rem);
  line-height: 1.6;
  color: rgba(255, 255, 255, 0.9);
  max-width: 420px;
  margin-bottom: 2rem;
}
section.frontpage .sp__teaser_textoverlay .sp__teaser_buttons {
  margin-top: 1.5rem;
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
}
section.frontpage .sp__teaser_textoverlay .sp__teaser_btn {
  padding: 0.8rem 1.5rem;
  font-size: 0.9rem;
  font-weight: 600;
  text-decoration: none;
  border-radius: 2px;
  transition: background-color 0.2s, color 0.2s;
}
section.frontpage .sp__teaser_textoverlay .sp__teaser_btn--secondary {
  background-color: transparent;
  color: #FFF;
  border-color: rgba(255, 255, 255, 0.65);
}
section.frontpage .sp__teaser_textoverlay .sp__teaser_btn--secondary:hover {
  background-color: rgba(255, 255, 255, 0.12);
  border-color: #FFF;
}

section.fullscale_photo {
  border-bottom: none;
}
@media (min-width: 961px) {
  section.fullscale_photo .frm.outer {
    width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
  }
}
section.fullscale_photo .frm.inner {
  padding: 0;
}
section.fullscale_photo .fsp_frame {
  height: 100%;
  width: 100%;
}
section.fullscale_photo .fsp_frame .fsp_content {
  height: 100%;
  width: 100%;
  background: url() no-repeat center center/cover transparent;
  background-image: url();
  opacity: 0;
  overflow: hidden !important;
  position: relative;
  top: 0;
  left: 0;
  display: flex;
  /*align-items: center;*/
  text-align: center;
}
section.fullscale_photo .fsp_frame .fsp_content.active, section.fullscale_photo .fsp_frame .fsp_content:only-child {
  opacity: 1;
}
section.fullscale_photo .fsp_frame .fsp_content > picture, section.fullscale_photo .fsp_frame .fsp_content > img {
  max-height: calc(100vh - 81px);
  max-width: 100%;
  width: 100%;
  object-fit: cover;
  object-position: 50% 50%;
  object-position: center center;
}

@media (min-width: 961px) {
  section.s4ct .frm.outer .frm.inner {
    min-height: 25.19rem; /* to be at least as high as the image */
  }
}
section.s4ct .headline {
  text-align: left;
}
@media (min-width: 561px) {
  section.s4ct .headline {
    margin-left: 33%;
  }
}
@media (min-width: 800px) {
  section.s4ct .headline {
    margin-left: calc(25% + 1.5rem);
  }
}
@media (min-width: 961px) {
  section.s4ct .headline {
    margin-left: 25%;
  }
}
section.s4ct div.content div.image {
  display: inline;
}
section.s4ct div.content div.image img {
  max-height: inherit;
  max-width: 100%;
}
@media (min-width: 561px) {
  section.s4ct div.content {
    column-count: 2;
    column-gap: 1rem;
    margin-left: 33%;
  }
  section.s4ct div.content div.image {
    position: absolute;
    width: calc(33% - 2.5rem);
    max-height: 100%;
    left: 2rem;
    top: 56px;
  }
  section.s4ct div.content div.image img {
    max-height: inherit;
    max-width: 100%;
  }
  section.s4ct div.content, section.s4ct div.content p, section.s4ct div.content div, section.s4ct div.content span {
    /*-webkit-column-break-inside: avoid;
    -moz-column-break-inside: avoid;
    column-break-inside: avoid;
    -webkit-break-inside: avoid;
    -moz-break-inside: avoid;
    break-inside: avoid;*/
  }
}
@media (min-width: 800px) {
  section.s4ct div.content {
    column-count: 3;
    margin-left: calc(25% + 1.5rem);
  }
  section.s4ct div.content div.image {
    width: calc(25% - 1.5rem);
  }
}
@media (min-width: 961px) {
  section.s4ct div.content {
    margin-left: 25%;
  }
  section.s4ct div.content div.image {
    left: 0;
  }
}

@media (min-width: 961px) {
  section.smfc3 .frm.outer .frm.inner {
    min-height: 25.19rem; /* to be at least as high as the image */
  }
}
section.smfc3 .headline {
  text-align: left;
}
@media (min-width: 561px) {
  section.smfc3 .headline {
    margin-left: 33%;
  }
}
@media (min-width: 800px) {
  section.smfc3 .headline {
    margin-left: calc(25% + 1.5rem);
  }
}
@media (min-width: 961px) {
  section.smfc3 .headline {
    margin-left: 25%;
  }
}
section.smfc3 div.content div.image {
  display: inline;
}
section.smfc3 div.content div.image img {
  max-height: inherit;
  max-width: 100%;
}
@media (min-width: 561px) {
  section.smfc3 div.content {
    column-count: 2;
    column-gap: 1rem;
    margin-left: 33%;
  }
  section.smfc3 div.content div.image {
    position: absolute;
    width: calc(33% - 2.5rem);
    max-height: 100%;
    left: 2rem;
    top: 56px;
  }
  section.smfc3 div.content div.image img {
    max-height: inherit;
    max-width: 100%;
  }
  section.smfc3 div.content, section.smfc3 div.content p, section.smfc3 div.content div, section.smfc3 div.content span {
    /*-webkit-column-break-inside: avoid;
    -moz-column-break-inside: avoid;
    column-break-inside: avoid;
    -webkit-break-inside: avoid;
    -moz-break-inside: avoid;
    break-inside: avoid;*/
  }
}
@media (min-width: 800px) {
  section.smfc3 div.content {
    column-count: 2;
    margin-left: calc(25% + 1.5rem);
  }
  section.smfc3 div.content div.image {
    width: calc(25% - 1.5rem);
  }
}
@media (min-width: 961px) {
  section.smfc3 div.content {
    margin-left: 25%;
  }
  section.smfc3 div.content div.image {
    left: 0;
  }
}

@media (min-width: 961px) {
  section.s2ct .frm.outer .frm.inner {
    min-height: 25.19rem; /* to be at least as high as the image */
  }
}
section.s2ct .headline {
  text-align: left;
}
@media (min-width: 561px) {
  section.s2ct .headline {
    margin-left: 33%;
  }
}
@media (min-width: 800px) {
  section.s2ct .headline {
    margin-left: calc(25% + 1.5rem);
  }
}
@media (min-width: 961px) {
  section.s2ct .headline {
    margin-left: 25%;
  }
}
section.s2ct div.content div.image {
  display: inline;
}
section.s2ct div.content div.image img {
  max-height: inherit;
  max-width: 100%;
}
@media (min-width: 561px) {
  section.s2ct div.content {
    column-count: 1;
    column-gap: 1rem;
    margin-left: 33%;
  }
  section.s2ct div.content div.image {
    position: absolute;
    width: calc(33% - 2.5rem);
    max-height: 100%;
    left: 2rem;
    top: 56px;
  }
  section.s2ct div.content div.image img {
    max-height: inherit;
    max-width: 100%;
  }
  section.s2ct div.content, section.s2ct div.content p, section.s2ct div.content div, section.s2ct div.content span {
    /*-webkit-column-break-inside: avoid;
    -moz-column-break-inside: avoid;
    column-break-inside: avoid;
    -webkit-break-inside: avoid;
    -moz-break-inside: avoid;
    break-inside: avoid;*/
  }
}
@media (min-width: 800px) {
  section.s2ct div.content {
    column-count: 1;
    margin-left: calc(25% + 1.5rem);
  }
  section.s2ct div.content div.image {
    width: calc(25% - 1.5rem);
  }
}
@media (min-width: 961px) {
  section.s2ct div.content {
    margin-left: 25%;
  }
  section.s2ct div.content div.image {
    left: 0;
  }
}

section.s2cq {
  background-color: rgb(27, 67, 121);
  color: #FFF;
}
@media (min-width: 961px) {
  section.s2cq .frm.outer {
    width: calc(100% - 48px);
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    height: 100%;
    position: relative;
  }
  section.s2cq .frm.outer .frm.inner {
    min-height: 25.19rem; /* to be at least as high as the image */
    padding-left: 0;
    padding-right: 0;
  }
}
section.s2cq div.quote {
  font-size: 1.25rem;
  line-height: 1.875rem;
  font-style: italic;
  font-family: Times, "Times New Roman", Georgia, serif;
  margin-bottom: 2rem;
}
section.s2cq div.quote p {
  margin: 0;
}
@media (min-width: 961px) {
  section.s2cq div.quote {
    margin-left: 25%;
  }
}
@media (min-width: 961px) {
  section.s2cq div.content {
    column-count: 2;
    column-gap: 1.5rem;
    margin-left: 50%;
  }
  section.s2cq div.content, section.s2cq div.content p, section.s2cq div.content div, section.s2cq div.content span {
    /*-webkit-column-break-inside: avoid;
    -moz-column-break-inside: avoid;
    column-break-inside: avoid;
    -webkit-break-inside: avoid;
    -moz-break-inside: avoid;
    break-inside: avoid;*/
  }
}
section.s2cq .sm_widget {
  display: block;
  position: relative;
  margin: 2rem auto;
}
@media (min-width: 961px) {
  section.s2cq .sm_widget {
    max-width: 37.5%;
    position: absolute;
    left: 0;
    bottom: 2rem;
    margin: 0;
  }
}
section.s2cq .sm_widget img {
  max-width: 100%;
}

section[data-name=about_s1] {
  line-height: 1.857;
}

section.team .teammember {
  position: relative;
  float: left;
  overflow: hidden;
  width: 33%;
  max-width: 33%;
  /* 3 columns */
  width: calc((100vw - 2rem - 30px) / 3);
  height: calc((100vw - 2rem - 30px) / 3);
  margin-right: 10px;
}
@media (min-width: 961px) {
  section.team .teammember {
    /* 3 columns — sizes relative to the max frame width */
    width: calc(390px);
    height: calc(260px);
  }
}
@media (max-width: 600px) {
  section.team .teammember {
    /* 2 columns */
    width: calc((100vw - 2rem - 20px) / 2);
    height: calc((100vw - 2rem - 20px) / 2);
  }
}
@media (max-width: 300px) {
  section.team .teammember {
    /* 1 columns */
    width: calc(100vw - 2rem);
    height: calc(100vw - 2rem);
  }
}
section.team .teammember, section.team .teammember * {
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  transition: all linear 0.3s;
  cursor: pointer;
}
section.team .teammember:after { /*  to be overlay to subsequent items */
  position: absolute;
  background: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1MTIgNTEyIj48cGF0aCBkPSJNMzk2Ljc5NSAzOTYuOEgzMjBWNDQ4aDEyOFYzMjBoLTUxLjIwNXpNMzk2LjggMTE1LjIwNVYxOTJINDQ4VjY0SDMyMHY1MS4yMDV6TTExNS4yMDUgMTE1LjJIMTkyVjY0SDY0djEyOGg1MS4yMDV6TTExNS4yIDM5Ni43OTVWMzIwSDY0djEyOGgxMjh2LTUxLjIwNXoiIGZpbGw9IiNGRkYiLz48L3N2Zz4=") no-repeat center center/1.5rem rgba(0, 0, 0, 0.3);
  width: 100%;
  height: 100%;
  content: "";
  opacity: 0;
  -webkit-transition: opacity linear 0.1s;
  -moz-transition: opacity linear 0.1s;
  transition: opacity linear 0.1s;
}
section.team .teammember.hover .caption, section.team .teammember:hover .caption, section.team .teammember:focus .caption {
  bottom: 0.5rem !important;
}
section.team .teammember.hover:after, section.team .teammember:hover:after, section.team .teammember:focus:after {
  position: absolute;
  opacity: 1;
}
section.team .teammember.hover .image, section.team .teammember.hover img, section.team .teammember:hover .image, section.team .teammember:hover img, section.team .teammember:focus .image, section.team .teammember:focus img {
  max-width: 110%;
  width: 110%;
  top: -5%;
  left: -5%;
}
section.team .teammember .caption {
  position: absolute;
  text-align: center;
  bottom: -0.5rem;
  font-size: 0.875rem;
  color: white;
  width: 100%;
  left: 0;
  font-weight: 600;
}
section.team .teammember .image, section.team .teammember img {
  position: absolute;
  top: 0;
  left: 0;
  max-width: 100%;
  width: 100%;
  min-width: 100%;
  min-height: 100%;
  -moz-transition-delay: 0.3s;
  -moz-transition-duration: 0.1s;
  -webkit-transition-delay: 0.3s;
  -webkit-transition-duration: 0.1s;
  transition-delay: 0.3s;
  transition-duration: 0.1s;
}

section.c2l .frm.inner > .headline,
section.c2l .frm.inner > h1,
section.c2l .frm.inner > h2,
section.c2l .frm.inner > div.title, section.c3l .frm.inner > .headline,
section.c3l .frm.inner > h1,
section.c3l .frm.inner > h2,
section.c3l .frm.inner > div.title {
  grid-column: 1/-1;
}
section.c2l.cards .frm.inner, section.c3l.cards .frm.inner {
  column-gap: clamp(1rem, 2.5vw, 1.5rem);
  row-gap: clamp(1rem, 2.5vw, 1.5rem);
}
section.c2l.cards div.content, section.c3l.cards div.content {
  background: #FFF;
  border-radius: 6px;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  position: relative;
  margin-bottom: 0 !important;
}
section.c2l.cards div.content div.imgf, section.c3l.cards div.content div.imgf {
  flex: 0 0 auto;
}
section.c2l.cards div.content div.imgf picture, section.c2l.cards div.content div.imgf img, section.c3l.cards div.content div.imgf picture, section.c3l.cards div.content div.imgf img {
  width: 100%;
  display: block;
  object-fit: cover;
}
section.c2l.cards div.content > *:not(.imgf), section.c3l.cards div.content > *:not(.imgf) {
  padding: clamp(1.25rem, 3vw, 2rem);
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  text-align: left;
}
section.c2l.cards div.content > *:not(.imgf) h1, section.c2l.cards div.content > *:not(.imgf) h2, section.c2l.cards div.content > *:not(.imgf) h3, section.c3l.cards div.content > *:not(.imgf) h1, section.c3l.cards div.content > *:not(.imgf) h2, section.c3l.cards div.content > *:not(.imgf) h3 {
  font-size: clamp(1.375rem, 3vw, 2rem);
  line-height: 1.15;
  margin-top: 0;
  color: #11284b;
  text-align: left;
  margin-bottom: calc(clamp(1.375rem, 3vw, 2rem) * 0.75);
}
section.c2l.cards div.content > *:not(.imgf) p, section.c3l.cards div.content > *:not(.imgf) p {
  font-size: clamp(0.875rem, 1.1vw, 1rem);
  color: #000000;
  margin-bottom: 1rem;
}
section.c2l.cards div.content > *:not(.imgf) hr, section.c3l.cards div.content > *:not(.imgf) hr {
  margin: calc(clamp(1.375rem, 3vw, 2rem) * 0.75) 0;
}
section.c2l.cards div.content > *:not(.imgf) ul, section.c2l.cards div.content > *:not(.imgf) ol, section.c3l.cards div.content > *:not(.imgf) ul, section.c3l.cards div.content > *:not(.imgf) ol {
  list-style: none;
  padding: 0;
  margin: calc(clamp(1.375rem, 3vw, 2rem) * 0.75) 0;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  column-gap: 1rem;
  row-gap: 0.35rem;
}
section.c2l.cards div.content > *:not(.imgf) ul li, section.c2l.cards div.content > *:not(.imgf) ol li, section.c3l.cards div.content > *:not(.imgf) ul li, section.c3l.cards div.content > *:not(.imgf) ol li {
  font-size: 0.875rem;
  color: #000000;
  display: flex;
  align-items: baseline;
  gap: 0.4rem;
}
section.c2l.cards div.content > *:not(.imgf) ul li::before, section.c2l.cards div.content > *:not(.imgf) ol li::before, section.c3l.cards div.content > *:not(.imgf) ul li::before, section.c3l.cards div.content > *:not(.imgf) ol li::before {
  flex-shrink: 0;
  color: rgb(86, 165, 50);
  font-weight: 700;
}
section.c2l.cards div.content > *:not(.imgf) ul li::before, section.c3l.cards div.content > *:not(.imgf) ul li::before {
  content: "—";
}
section.c2l.cards div.content > *:not(.imgf) ol, section.c3l.cards div.content > *:not(.imgf) ol {
  counter-reset: fuchs-card-counter;
}
section.c2l.cards div.content > *:not(.imgf) ol li::before, section.c3l.cards div.content > *:not(.imgf) ol li::before {
  counter-increment: fuchs-card-counter;
  content: counter(fuchs-card-counter) ".";
}
section.c2l.cards div.content > *:not(.imgf) .metric-label, section.c3l.cards div.content > *:not(.imgf) .metric-label {
  font-size: 0.875rem;
  color: #000000;
  margin-top: auto;
  margin-bottom: 0.2rem;
}
section.c2l.cards div.content > *:not(.imgf) .metric-value, section.c3l.cards div.content > *:not(.imgf) .metric-value {
  font-size: clamp(1.5rem, 3vw, 2rem);
  font-weight: 800;
  color: #11284b;
  margin-bottom: 1rem;
}
section.c2l.cards div.content > *:not(.imgf) a.cta, section.c2l.cards div.content > *:not(.imgf) a[class*=btn], section.c2l.cards div.content > *:not(.imgf) .cta-link, section.c3l.cards div.content > *:not(.imgf) a.cta, section.c3l.cards div.content > *:not(.imgf) a[class*=btn], section.c3l.cards div.content > *:not(.imgf) .cta-link {
  display: inline-block;
  cursor: pointer;
  font-size: 0.875rem;
  font-weight: 700;
  background-color: rgb(27, 67, 121);
  color: #FFF;
  text-align: center;
  text-decoration: none;
  margin-top: auto;
  border: 1px solid #11284b;
  border-radius: 3px;
  padding: 0.7rem 1rem;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
section.c2l.cards div.content > *:not(.imgf) a.cta::after, section.c2l.cards div.content > *:not(.imgf) a[class*=btn]::after, section.c2l.cards div.content > *:not(.imgf) .cta-link::after, section.c3l.cards div.content > *:not(.imgf) a.cta::after, section.c3l.cards div.content > *:not(.imgf) a[class*=btn]::after, section.c3l.cards div.content > *:not(.imgf) .cta-link::after {
  content: none;
}
section.c2l.cards div.content > *:not(.imgf) a.cta:hover, section.c2l.cards div.content > *:not(.imgf) a.cta:focus, section.c2l.cards div.content > *:not(.imgf) a[class*=btn]:hover, section.c2l.cards div.content > *:not(.imgf) a[class*=btn]:focus, section.c2l.cards div.content > *:not(.imgf) .cta-link:hover, section.c2l.cards div.content > *:not(.imgf) .cta-link:focus, section.c3l.cards div.content > *:not(.imgf) a.cta:hover, section.c3l.cards div.content > *:not(.imgf) a.cta:focus, section.c3l.cards div.content > *:not(.imgf) a[class*=btn]:hover, section.c3l.cards div.content > *:not(.imgf) a[class*=btn]:focus, section.c3l.cards div.content > *:not(.imgf) .cta-link:hover, section.c3l.cards div.content > *:not(.imgf) .cta-link:focus {
  background-color: rgb(86, 165, 50);
  border-color: rgb(86, 165, 50);
  color: #FFF;
  text-decoration: none;
}
section.c2l.cards div.title, section.c3l.cards div.title {
  position: relative;
}
section.c2l.cards div.content > div.title, section.c3l.cards div.content > div.title {
  order: -1;
  position: absolute;
  top: 1rem;
  left: 1rem;
  margin: 0;
  background: #FFF;
  color: #11284b;
  font-size: 0.875rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: clamp(0.2rem, 0.4vw, 0.35rem) clamp(0.5rem, 1vw, 0.875rem);
  border-radius: 3px;
  z-index: 2;
}
section.c2l.cards.dark > .frm.outer > .frm.inner > .headline,
section.c2l.cards.dark > .frm.outer > .frm.inner > h1,
section.c2l.cards.dark > .frm.outer > .frm.inner > h2,
section.c2l.cards.dark > .frm.outer > .frm.inner > div.title, section.c3l.cards.dark > .frm.outer > .frm.inner > .headline,
section.c3l.cards.dark > .frm.outer > .frm.inner > h1,
section.c3l.cards.dark > .frm.outer > .frm.inner > h2,
section.c3l.cards.dark > .frm.outer > .frm.inner > div.title {
  color: #FFF;
}
section.c2l.cards.cddark div.content, section.c2l.cards.dark div.content, section.c3l.cards.cddark div.content, section.c3l.cards.dark div.content {
  background: rgb(34.4432432432, 85.4702702703, 154.3567567568);
  box-shadow: 0 2px 16px rgba(0, 0, 0, 0.25);
}
section.c2l.cards.cddark div.content > *:not(.imgf) h1, section.c2l.cards.cddark div.content > *:not(.imgf) h2, section.c2l.cards.cddark div.content > *:not(.imgf) h3, section.c2l.cards.dark div.content > *:not(.imgf) h1, section.c2l.cards.dark div.content > *:not(.imgf) h2, section.c2l.cards.dark div.content > *:not(.imgf) h3, section.c3l.cards.cddark div.content > *:not(.imgf) h1, section.c3l.cards.cddark div.content > *:not(.imgf) h2, section.c3l.cards.cddark div.content > *:not(.imgf) h3, section.c3l.cards.dark div.content > *:not(.imgf) h1, section.c3l.cards.dark div.content > *:not(.imgf) h2, section.c3l.cards.dark div.content > *:not(.imgf) h3 {
  color: #FFF;
}
section.c2l.cards.cddark div.content > *:not(.imgf) p, section.c2l.cards.dark div.content > *:not(.imgf) p, section.c3l.cards.cddark div.content > *:not(.imgf) p, section.c3l.cards.dark div.content > *:not(.imgf) p {
  color: rgba(255, 255, 255, 0.88);
}
section.c2l.cards.cddark div.content > *:not(.imgf) hr, section.c2l.cards.dark div.content > *:not(.imgf) hr, section.c3l.cards.cddark div.content > *:not(.imgf) hr, section.c3l.cards.dark div.content > *:not(.imgf) hr {
  border-color: rgba(255, 255, 255, 0.2);
}
section.c2l.cards.cddark div.content > *:not(.imgf) ul li, section.c2l.cards.cddark div.content > *:not(.imgf) ol li, section.c2l.cards.dark div.content > *:not(.imgf) ul li, section.c2l.cards.dark div.content > *:not(.imgf) ol li, section.c3l.cards.cddark div.content > *:not(.imgf) ul li, section.c3l.cards.cddark div.content > *:not(.imgf) ol li, section.c3l.cards.dark div.content > *:not(.imgf) ul li, section.c3l.cards.dark div.content > *:not(.imgf) ol li {
  color: rgba(255, 255, 255, 0.88);
}
section.c2l.cards.cddark div.content > *:not(.imgf) .metric-label, section.c2l.cards.dark div.content > *:not(.imgf) .metric-label, section.c3l.cards.cddark div.content > *:not(.imgf) .metric-label, section.c3l.cards.dark div.content > *:not(.imgf) .metric-label {
  color: rgba(255, 255, 255, 0.7);
}
section.c2l.cards.cddark div.content > *:not(.imgf) .metric-value, section.c2l.cards.dark div.content > *:not(.imgf) .metric-value, section.c3l.cards.cddark div.content > *:not(.imgf) .metric-value, section.c3l.cards.dark div.content > *:not(.imgf) .metric-value {
  color: #FFF;
}
section.c2l.cards.cddark div.content > *:not(.imgf) a.cta, section.c2l.cards.cddark div.content > *:not(.imgf) a[class*=btn], section.c2l.cards.cddark div.content > *:not(.imgf) .cta-link, section.c2l.cards.dark div.content > *:not(.imgf) a.cta, section.c2l.cards.dark div.content > *:not(.imgf) a[class*=btn], section.c2l.cards.dark div.content > *:not(.imgf) .cta-link, section.c3l.cards.cddark div.content > *:not(.imgf) a.cta, section.c3l.cards.cddark div.content > *:not(.imgf) a[class*=btn], section.c3l.cards.cddark div.content > *:not(.imgf) .cta-link, section.c3l.cards.dark div.content > *:not(.imgf) a.cta, section.c3l.cards.dark div.content > *:not(.imgf) a[class*=btn], section.c3l.cards.dark div.content > *:not(.imgf) .cta-link {
  background-color: transparent;
  color: #FFF;
  border-color: rgba(255, 255, 255, 0.55);
}
section.c2l.cards.cddark div.content > *:not(.imgf) a.cta:hover, section.c2l.cards.cddark div.content > *:not(.imgf) a.cta:focus, section.c2l.cards.cddark div.content > *:not(.imgf) a[class*=btn]:hover, section.c2l.cards.cddark div.content > *:not(.imgf) a[class*=btn]:focus, section.c2l.cards.cddark div.content > *:not(.imgf) .cta-link:hover, section.c2l.cards.cddark div.content > *:not(.imgf) .cta-link:focus, section.c2l.cards.dark div.content > *:not(.imgf) a.cta:hover, section.c2l.cards.dark div.content > *:not(.imgf) a.cta:focus, section.c2l.cards.dark div.content > *:not(.imgf) a[class*=btn]:hover, section.c2l.cards.dark div.content > *:not(.imgf) a[class*=btn]:focus, section.c2l.cards.dark div.content > *:not(.imgf) .cta-link:hover, section.c2l.cards.dark div.content > *:not(.imgf) .cta-link:focus, section.c3l.cards.cddark div.content > *:not(.imgf) a.cta:hover, section.c3l.cards.cddark div.content > *:not(.imgf) a.cta:focus, section.c3l.cards.cddark div.content > *:not(.imgf) a[class*=btn]:hover, section.c3l.cards.cddark div.content > *:not(.imgf) a[class*=btn]:focus, section.c3l.cards.cddark div.content > *:not(.imgf) .cta-link:hover, section.c3l.cards.cddark div.content > *:not(.imgf) .cta-link:focus, section.c3l.cards.dark div.content > *:not(.imgf) a.cta:hover, section.c3l.cards.dark div.content > *:not(.imgf) a.cta:focus, section.c3l.cards.dark div.content > *:not(.imgf) a[class*=btn]:hover, section.c3l.cards.dark div.content > *:not(.imgf) a[class*=btn]:focus, section.c3l.cards.dark div.content > *:not(.imgf) .cta-link:hover, section.c3l.cards.dark div.content > *:not(.imgf) .cta-link:focus {
  background-color: rgb(86, 165, 50);
  border-color: rgb(86, 165, 50);
  color: #FFF;
}
section.c2l.cards.cddark div.content > div.title, section.c2l.cards.dark div.content > div.title, section.c3l.cards.cddark div.content > div.title, section.c3l.cards.dark div.content > div.title {
  background: #FFF;
  color: #11284b;
}

section.c2l .frm.inner {
  display: grid;
  column-gap: clamp(1.5rem, 4vw, 3.5rem);
  row-gap: 2rem;
  grid-template-columns: repeat(2, 1fr);
}
section.c2l .frm.inner:has(.c2.l13) {
  grid-template-columns: 1fr 3fr;
}
section.c2l .frm.inner:has(.c2.l31) {
  grid-template-columns: 3fr 1fr;
}
section.c2l .frm.inner:has(.c2.l12) {
  grid-template-columns: 1fr 2fr;
}
section.c2l .frm.inner:has(.c2.l21) {
  grid-template-columns: 2fr 1fr;
}
@media (max-width: 800px) {
  section.c2l .frm.inner {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (max-width: 561px) {
  section.c2l .frm.inner {
    grid-template-columns: 1fr !important;
  }
  section.c2l .frm.inner div.content {
    margin-bottom: clamp(1.375rem, 3vw, 2rem);
  }
}
section.c2l.hic h1, section.c2l.hic h2, section.c2l.hic .headline {
  text-align: left;
  margin-bottom: clamp(1.375rem, 3vw, 2rem);
}
section.c2l.hic .c2.imgf {
  align-self: end;
}
section.c2l div.imgf picture, section.c2l div.imgf img {
  width: 100%;
  display: block;
}
section.c2l.cards div.content div.imgf picture,
section.c2l.cards div.content div.imgf img {
  height: clamp(200px, 28vw, 370px);
}
@media (max-width: 561px) {
  section.c2l.cards div.content > *:not(.imgf) ul,
  section.c2l.cards div.content > *:not(.imgf) ol {
    grid-template-columns: 1fr;
  }
}

section.c3l .frm.inner {
  display: grid;
  column-gap: clamp(1.5rem, 4vw, 3.5rem);
  row-gap: 2rem;
  grid-template-columns: repeat(3, 1fr);
}
@media (max-width: 800px) {
  section.c3l .frm.inner {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 561px) {
  section.c3l .frm.inner {
    grid-template-columns: 1fr;
  }
  section.c3l .frm.inner div.content {
    margin-bottom: 2rem;
  }
}
section.c3l.cards div.content div.imgf picture,
section.c3l.cards div.content div.imgf img {
  height: clamp(160px, 22vw, 300px);
}
@media (max-width: 800px) {
  section.c3l.cards div.content > *:not(.imgf) ul,
  section.c3l.cards div.content > *:not(.imgf) ol {
    grid-template-columns: 1fr;
  }
}

section[data-name=about_s3_sebastian] .frm.inner {
  padding-top: 3rem;
}

@media (min-width: 561px) {
  .c1l.t2c .content {
    column-count: 2;
    column-gap: 1.5rem;
  }
}

@media (min-width: 561px) {
  section[data-name=bathroom_s2] .content, section[data-name=heating_s2] .content, section[data-name=leakage_s2] .content, .c1l.t3c .content {
    column-count: 2;
    column-gap: 1.5rem;
  }
}
@media (min-width: 961px) {
  section[data-name=bathroom_s2] .content, section[data-name=heating_s2] .content, section[data-name=leakage_s2] .content, .c1l.t3c .content {
    column-count: 3;
  }
}

@media (min-width: 561px) {
  .c1l.t4c .content {
    column-count: 2;
    column-gap: 1.5rem;
  }
}
@media (min-width: 768px) {
  .c1l.t4c .content {
    column-count: 3;
  }
}
@media (min-width: 961px) {
  .c1l.t4c .content {
    column-count: 4;
  }
}

section.cf .note {
  display: block;
  margin-top: 2rem;
}
section.cf .note h1 {
  font-size: 1.125rem;
}

section[data-name=index_s4_planner] .btnrow {
  margin: 0 auto;
  display: block;
}
@media (min-width: 800px) {
  section[data-name=index_s4_planner] .btnrow {
    width: 720px;
  }
}
section[data-name=index_s4_planner] .btnrow a {
  max-width: 90px;
}
@media (max-width: 361px) {
  section[data-name=index_s4_planner] .btnrow .btnfrm.bc2 {
    width: calc(50% - 0.75rem);
  }
  section[data-name=index_s4_planner] .btnrow .btnfrm.bc3 {
    width: calc(50% - 1rem);
  }
  section[data-name=index_s4_planner] .btnrow .btnfrm.bc4 {
    width: calc(50% - 1.125rem);
  }
}

section[data-name=bathroom_s3], section[data-name=heating_s3] {
  background-color: rgb(27, 67, 121);
  color: #FFF;
}
section[data-name=bathroom_s3] .content > div.frm, section[data-name=heating_s3] .content > div.frm {
  display: block;
  margin: 0 auto;
}
section[data-name=bathroom_s3] .content > div.frm img, section[data-name=heating_s3] .content > div.frm img {
  margin-bottom: 2rem;
}
section[data-name=bathroom_s3] ul, section[data-name=heating_s3] ul {
  padding-left: 0.9rem;
}
section[data-name=bathroom_s3] ul li, section[data-name=heating_s3] ul li {
  padding-left: 0.5rem;
  list-style-position: outside;
}

section[data-name=bathroom_s4], section[data-name=contact_s2] {
  color: rgb(27, 67, 121);
}
section[data-name=bathroom_s4] .headline, section[data-name=contact_s2] .headline {
  margin-bottom: 2rem;
}

section[data-name=bathroom_s5] {
  color: rgb(27, 67, 121);
}
section[data-name=bathroom_s5] .content > .btn {
  display: block;
  width: 18rem;
  margin: 0 auto;
}

section[data-name=heating_s4_heizungonline] {
  color: rgb(27, 67, 121);
}
section[data-name=heating_s4_heizungonline] .content > .btn {
  display: block;
  width: 288px;
  margin: 0 auto;
}
section[data-name=heating_s4_heizungonline] .content > .btn img {
  width: 232px;
  height: auto;
  margin: 1rem 28px;
}

section[data-name=contact_s4_logos] .logofrm {
  display: block;
  max-width: 100%;
  width: 100%;
  overflow: hidden;
  position: relative;
}
section[data-name=contact_s4_logos] .logofrm .clogo {
  float: left;
  max-width: 28%;
  max-height: 6rem;
  margin: 1.5rem;
  position: relative;
}
section[data-name=contact_s4_logos] .logofrm .clogo img {
  max-width: 100%;
  max-height: 6rem;
}

#sticker {
  background-color: rgb(86, 165, 50);
  height: 7rem;
  width: 7rem;
  border-radius: 3.5rem;
  position: absolute;
  top: calc(100vh - 8.5rem);
  right: calc(40px + 60px);
  z-index: 4;
  text-align: center;
  font-size: 1rem;
  color: #FFF;
  line-height: 1.25rem;
  transform: rotate(12deg);
  -moz-transform: rotate(12deg);
  -webkit-transform: rotate(12deg);
  user-select: none;
}
@media (max-width: 361px) {
  #sticker {
    right: 24px;
  }
}
#sticker > div {
  display: table-cell;
  width: inherit;
  position: relative;
  height: inherit;
  vertical-align: middle;
  padding-bottom: 0.25rem; /*difference between line-hight and font-size */
}

#treeanimation {
  background-color: transparent;
  image-rendering: optimizeSpeed;
  shape-rendering: optimizeSpeed;
  display: none;
  position: fixed;
  bottom: 10px;
  left: 10px;
  max-width: 100%;
  z-index: 5;
  pointer-events: none;
  /*background-color: rgba(255,255,255,0.4);
  box-shadow: rgba(255,255,255,0.4) -5px 5px 10px;*/
}
#treeanimation.show {
  display: block;
}
#treeanimation > * {
  position: relative;
  display: inline-block;
  pointer-events: none;
}
#treeanimation img {
  height: 100%;
  background-color: transparent;
  height: 300px;
  max-height: 50vh;
  max-width: 50vw;
}
#treeanimation .description {
  opacity: 0;
  color: #00bc16;
  font-size: 18px;
  font-weight: 600;
  text-shadow: -1px -1px 1px #fff;
  line-height: 22px;
  -moz-transition: opacity ease 1s;
  -webkit-transition: opacity ease 1s;
  transition: opacity ease 1s;
}
@media (min-width: 800px) {
  #treeanimation .description {
    font-size: 30px;
    line-height: 35px;
  }
}
#treeanimation .description.show {
  opacity: 1;
}

/* mixin for multiline */
.swiper {
  width: 100%;
  max-width: 100%;
  height: 331px;
  margin-top: 36px;
}
@media (max-width: 580px) {
  .swiper {
    padding-top: 36px !important;
  }
}
.swiper .swiper-slide {
  max-width: 400px;
  width: 400px;
  max-height: 250px;
  height: 250px;
  opacity: 0.8;
  -moz-transition-duration: 0.1s;
  -webkit-transition-duration: 0.1s;
  transition-duration: 0.1s;
  text-rendering: optimizeSpeed;
  margin: 28px 0 0 0;
  overflow: hidden;
  overflow: clip;
  background-color: #FFF;
  color: rgb(27, 67, 121);
}
@media (max-width: 520px) {
  .swiper .swiper-slide {
    max-width: calc(100vw - 120px);
  }
}
@media (max-width: 361px) {
  .swiper .swiper-slide {
    max-width: calc(100vw - 48px);
  }
}
.swiper .swiper-slide > * {
  max-height: 100%;
  max-width: 100%;
  overflow: hidden;
}
.swiper .swiper-slide.swiper-slide-prev {
  z-index: 4;
}
.swiper .swiper-slide.swiper-slide-next {
  z-index: 4;
}
.swiper .swiper-slide.swiper-slide-active {
  border: 2px solid #FFF;
  z-index: 5;
  transform: translate(0, -3px);
  -webkit-transform: translate(0, -3px);
  -moz-transform: translate(0, -3px);
  opacity: 1;
  background-color: #FFF;
  box-shadow: 0 0 20px rgba(255, 255, 255, 0.4);
  border-radius: 3px;
  scale: 1.18;
}
@media (max-width: 520px) {
  .swiper .swiper-slide.swiper-slide-active {
    max-width: calc(100vw - 120px);
    transform: translate(0, -29px);
    -moz-transform: translate(0, -29px);
    -webkit-transform: translate(0, -29px);
  }
}
@media (max-width: 361px) {
  .swiper .swiper-slide.swiper-slide-active {
    max-width: calc(100vw - 48px);
  }
}
.swiper .swiper-slide.swiper-slide-active .feedback .txt {
  overflow: hidden;
  position: relative;
  line-height: 1.2rem;
  max-height: 8.4rem;
  text-align: justify;
  margin-left: 0.7rem;
  margin-right: -0.3rem;
  padding-right: 1rem;
  font-size: 0.875rem;
}
.swiper .swiper-slide.swiper-slide-active .feedback .txt:before {
  content: "...";
  position: absolute;
  right: 0;
  bottom: 0;
}
.swiper .swiper-slide.swiper-slide-active .feedback .txt:after {
  content: "";
  position: absolute;
  right: 0;
  width: 1em;
  height: 1em;
  margin-top: 0.2em;
  background: white;
}
.swiper .swiper-slide.swiper-slide-active .feedback #googleref {
  width: 128px;
}
.swiper .feedback {
  height: 100%;
  width: 100%;
}
.swiper .feedback .txt {
  font-size: 0.675rem;
  line-height: 0.825rem;
}
.swiper .feedback #googleref {
  width: 86px;
}
.swiper .swiper-button-next::before, .swiper .swiper-button-prev::before {
  content: "";
  left: -4px;
  top: -4px;
  position: absolute;
  right: -4px;
  background-color: rgba(255, 255, 255, 0.7);
  border-radius: 3px;
  bottom: -4px;
  z-index: -1;
}
@media (max-width: 580px) {
  .swiper .swiper-button-next, .swiper .swiper-button-prev {
    height: 20px;
    top: 26px; /* height + 2x borderwidth of 3px  */
  }
  .swiper .swiper-button-next::after, .swiper .swiper-button-next::before, .swiper .swiper-button-prev::after, .swiper .swiper-button-prev::before {
    font-size: 20px !important;
  }
}

section[data-name=contact_s3_logocarousel] .swiper-container .swiper-slide {
  max-width: 200px;
  width: 200px;
  opacity: 0.6;
}
section[data-name=contact_s3_logocarousel] .swiper-container .swiper-slide.swiper-slide-active {
  max-width: 200px;
  width: 200px;
  opacity: 1;
}

.feedbackcollection .feedback {
  border: 1px solid #CCC;
  border-radius: 3px;
  display: inline-block;
  padding: 0.5rem;
  background-color: #FFF;
}
.feedbackcollection .feedback .nme {
  height: 36px;
  vertical-align: top;
  display: block;
  margin-bottom: 0.8rem;
  padding-left: 48px;
  position: relative;
}
.feedbackcollection .feedback .nme:before {
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAEcElEQVRoge2Y6U9bRxTF+ftS9jWsjko3RVVbqVIrJd2lKk0NNibeQoLSNFEpaTAIAmqJS5rl2YBtsLENfTYYb+kfYGXGb5nR6YcxDW0oxtjEIPnDkWX5w7u/ueNz73l1Uky74JHZbSnGxs+UZHZLkpmtTpL1B54Yw1lVnRRj49Uu4riSZJarAdQAagA1gBrA6QPwxhkCuwyhFEcoxRFMcqzunHIAKcbgjTFspDk20hyPojoerOmYW9Pxa0jHyjbDZpbDn2CQ5FMGIMkMq9sMkQzHjF/Dl1MK3rpB0W0V6rdTfHQnD9uiipVt0ZlKQFQEQIqJ4sNpDuuiinYLRf0QQdcoRa9NqMdG0WImqDcSvP9DHr9HBWy5EBUB8MYZIoXi640E569RGBwUA/+jxiGCt29S/LHJsJ4sD6JsAKlw510+DW0jtGjxAw7x+xtGgsv3FASTHMvxKgJ44+I+f3ZPQcMQgcF5ePF76rVRdFoopn0aQilePYC1XQ53WMeb18XpH6X4PTWZCEwLKsKZKgJspDhmfDq6Rin67KUBNA4TfDWlVBcglOJwFQD6SwRoOi0AcwEdPdbSO9A0TPDNdJUBfDsMz2SGi7fyaB8hJQE0mwmuL6kIp6sI4IkxRLMcwwtiBhylcIODosNCccFJ8SiqI7B7/GdXBCCQYHgqM7xzM49m0+FWaihYaL2RwOlWESnj+lQMQJLFGjG/rqO/4C4H/aENDorOUVH8d7MKQimO1e3jP7diAJ6YmMiRDMfiBsPHd/NoGyFoNr2qAQeF/aGKYIrDnzglu9D+ToRSHL4dhgmvhiuzCi5NKrg8qeCL+wrsD1W4IzoiGZENTs02+l+IlW2xH4VSHMF9Cqc51nbLu/MnDvC6VVEAb1yc/tqu6EA0+29FMqITvgTDclykt6oDLMcZgimOaIYjmBTffwvpuL+q4e4zDXeevvz82athNqDj8Zaw3o20gPKVkZWPBSDFRGCPZjkCCYb5dR03ljR87VLwwe08BsdEjGw1E7SYCFrMwoE6LMJO3xvP49OJPEwLKiY8Gp78KRwsnBbZQDopAElm8CdEMH+ypcPpVvHJT3n02sRq3GImaB8RiazX9uoc6LdT9FjFLGgt2GzbCMG743l8O6PA5dMRSokXAnsHVTEASRYt9yc4HG4Vg2NiYLWaCXqspS1x+wdbv52ic5SgcZig3UJwaVLB/LqGzawYcsWs9kgAkswQznAsRRk+/DGPeuPL61ApGZyia43DBB0WAodbO9K8KAogxRiCSY7HWwyDY/Sfha1Y7i0HpGuU4tz3BNZFFZEsh/eQzFwUYM9lPv9FwTnjiyNn3rIhrlF0WAhm/PqhmbkowHqSwR1m6LOXnnnLklO8ubg6p2LreRkAoRTHtE/DeStF3wHOcpKqNxJcma0AwNSKhm7rwdZ4kmoYqlAHXKs1gBpADaAGcKIAMps4qwCeGEOdJDObJLPcQQolec61ouW6rTTXa6O5AcfrU4PxRe7qrJrbes4PrK2gv/4GrimE/KpoNZsAAAAASUVORK5CYII=);
  background-size: 36px;
  content: "";
  height: 36px;
  width: 36px;
  display: inline-block;
  margin-right: 0.5rem;
  border-radius: 18px;
  position: absolute;
  left: 0px;
}
.feedbackcollection .feedback .stars {
  display: block;
  margin-bottom: 0.8rem;
}
.feedbackcollection .feedback .stars .review.star {
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAcCAYAAAByDd+UAAACsklEQVRIS72Wz2tTQRDHZ3b3vVcRVFChUhBEBb2KgqjYH3m5ePAkglUUpQctRU8FDz16EPVixR9gexAr/Q+ENomRHiyiIojgQRTBQhXswR+1ycvujhNj26Qm6duQNre8NzOfmdnvzD6EVf7hKvOgIWAh5V8pJuolowHXhJ2Bc2Prtyk5+7EIUih3YCL/wQXqDDQp1W8RrhUhAqFfJvSNFQUW0t4kAO0vQXDSCwsHVgxIz6DNzKnPRKWzRwSSQm/FTpiKC3VqaZQN+tCYW+XBCWSfH+ZvrwhQZ1SGq+sqD44CMqpLh00H0nPYaH6pLwxUFUAAI6Vu5bZ+iwNdaCk9UQdZfYdqORkjdiPYM9XeE4gHUtp3tXxZzRPYoVlsfO7zRoWM9wqI9sTJ0t0GX7Oa/8ZeBKZaOlDoUW5Zq3vA2h6sZD4G1e2FuWwFsPiHHsNm46khQjjaDChXMyZ9fRYPw/R8vKpjoVPeaUC6QwBrGwFzVTlL8rKXyA8WZ3WJyKqHpKy/S1t65HyuAt9a658Mwtk31SLXHXxucVAI/CEkeypOpYRixMtHPXgE8rXsl900Ji2HLeC5OEAhaFh2mZ56tvUrzIIyVk2zcjfFAXKwmX9LQDdUYSEdJHmRjMeBLdhIlfQ6c+mGgCYl71rE8/874/vSM9q59J0guieT5oIzkNsoTEZNsaa3lDsTiYeeinohAKN/e1cZerFC9ghf5Yxuw+NgnFRK46pdC3i6MLAIP4FErwqjkYoE0vKYQbzPCW6Yf64Q2jGhJ5yAfLPfXMweXygUJ2p9v1Am2K7JjrL9vhIEB3l3XnICRml/RKDt5tm6rtZFA7gXCvXEQy/B0z/8Kzyz/Zbb7odR1Zul5lhQFlpyAK1rOuGTi0qLX3Ut/vdpvh/ZvYrcXII1w3bZTdMMSHmMPyRv8x2QlWdYAAAAAElFTkSuQmCC");
  background-size: 14px 14px;
  background-repeat: no-repeat;
  height: 14px;
  width: 15px;
  margin: 0 1px;
  display: inline-block;
}
.feedbackcollection .feedback .stars .review.star.active {
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAcCAYAAAByDd+UAAACsklEQVRIS72Wz2tTQRDHZ3b3vVcRVFChUhBEBb2KgqjYH3m5ePAkglUUpQctRU8FDz16EPVixR9gexAr/Q+ENomRHiyiIojgQRTBQhXswR+1ycvujhNj26Qm6duQNre8NzOfmdnvzD6EVf7hKvOgIWAh5V8pJuolowHXhJ2Bc2Prtyk5+7EIUih3YCL/wQXqDDQp1W8RrhUhAqFfJvSNFQUW0t4kAO0vQXDSCwsHVgxIz6DNzKnPRKWzRwSSQm/FTpiKC3VqaZQN+tCYW+XBCWSfH+ZvrwhQZ1SGq+sqD44CMqpLh00H0nPYaH6pLwxUFUAAI6Vu5bZ+iwNdaCk9UQdZfYdqORkjdiPYM9XeE4gHUtp3tXxZzRPYoVlsfO7zRoWM9wqI9sTJ0t0GX7Oa/8ZeBKZaOlDoUW5Zq3vA2h6sZD4G1e2FuWwFsPiHHsNm46khQjjaDChXMyZ9fRYPw/R8vKpjoVPeaUC6QwBrGwFzVTlL8rKXyA8WZ3WJyKqHpKy/S1t65HyuAt9a658Mwtk31SLXHXxucVAI/CEkeypOpYRixMtHPXgE8rXsl900Ji2HLeC5OEAhaFh2mZ56tvUrzIIyVk2zcjfFAXKwmX9LQDdUYSEdJHmRjMeBLdhIlfQ6c+mGgCYl71rE8/874/vSM9q59J0guieT5oIzkNsoTEZNsaa3lDsTiYeeinohAKN/e1cZerFC9ghf5Yxuw+NgnFRK46pdC3i6MLAIP4FErwqjkYoE0vKYQbzPCW6Yf64Q2jGhJ5yAfLPfXMweXygUJ2p9v1Am2K7JjrL9vhIEB3l3XnICRml/RKDt5tm6rtZFA7gXCvXEQy/B0z/8Kzyz/Zbb7odR1Zul5lhQFlpyAK1rOuGTi0qLX3Ut/vdpvh/ZvYrcXII1w3bZTdMMSHmMPyRv8x2QlWdYAAAAAElFTkSuQmCC");
}
.feedbackcollection .logoshare {
  border: 1px solid #CCC;
  border-radius: 7px;
  display: inline-block;
  padding: 0.5rem;
  background-color: #FFF;
  height: 100%;
  cursor: pointer;
  width: 100%;
}
.feedbackcollection .logoshare:hover, .feedbackcollection .logoshare:focus {
  box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.3);
  border-color: #979797;
}
.feedbackcollection .logoshare .logo {
  width: 100%;
  max-width: 200px;
  height: 200px;
  image-rendering: optimizeQuality;
  background-color: inherit;
  background-repeat: no-repeat;
  margin: 0 auto;
}
.feedbackcollection .logoshare .logo img {
  max-width: 100%;
}
.feedbackcollection .logoshare .nme {
  position: absolute;
  height: auto;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 0.5rem;
  font-size: 1rem;
  text-align: center;
  background: rgba(255, 255, 255, 0.7);
  margin: 1px; /* avoid overlap with frame */
}

.swiper-slide .logoshare .nme {
  display: none;
}
.swiper-slide.swiper-slide-active .logoshare .nme {
  display: block;
  font-size: 0.85rem;
}

.linkvframe {
  /*display: inline-flex;
  align-items: center;*/
  display: block;
  text-align: center;
  max-width: 100%;
  height: auto;
}

.linkblocks {
  text-align: center;
  display: block;
  margin: 36px 0;
}
.linkblocks .linkblock {
  display: inline-flex;
  position: relative;
  height: 475px;
  width: 275px;
  max-width: 275px;
  background-size: 275px;
  background-position: 0 56px;
  background-color: #FFF;
  background-repeat: no-repeat;
  margin: 20px;
  text-align: center;
}
.linkblocks .linkblock .lb_label {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 56px;
  background-color: rgba(255, 255, 255, 0.8);
  color: rgb(27, 67, 121);
  padding: 16px;
  text-align: center;
  font-size: 24.8px; /* here in px to preserve frames' layouts */
  font-weight: 600;
  background-color: #EEE;
}
.linkblocks .linkblock .lb_main {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 165px;
  background-color: rgb(27, 67, 121);
  font-size: 14px; /* here in px to preserve frames' layouts */
  color: #FFF;
  text-align: center;
  padding: 16px;
}
.linkblocks .linkblock .lb_main .lb_btn {
  cursor: pointer;
  font-size: 14px; /* here in px to preserve frames' layouts */
  color: #FFF;
  text-align: center;
  position: absolute;
  bottom: 16px;
  margin-left: auto;
  margin-right: auto;
  border: 1px solid #FFF;
  border-radius: 3px;
  padding: 11.2px 16px;
  left: 32px;
  right: 32px;
}
.linkblocks .linkblock .lb_main .lb_btn:hover, .linkblocks .linkblock .lb_main .lb_btn:focus {
  background-color: rgb(86, 165, 50);
}

section.dark div.cform_frm .ig input, section.dark div.cform_frm .ig textarea, section.dark div.cform_frm .ig button {
  background-color: #FFF;
}
section.dark div.cform_frm .ig label {
  color: #FFF;
}
section.dark div.cform_frm .ig .c1:before, section.dark div.cform_frm .ig .c2:before {
  border-color: 1px solid #FFF;
}

div.cform_frm {
  width: 100%;
  max-width: 720px;
  margin: 2.5rem auto;
  position: relative;
  display: block;
  overflow: auto;
}
div.cform_frm > form, div.cform_frm > div.form {
  position: relative;
  overflow-y: hidden;
  padding: 0.2rem;
}
@media (min-width: 560px) {
  div.cform_frm > form, div.cform_frm > div.form {
    display: grid;
    grid-template-columns: 50% 50%;
  }
}
div.cform_frm .c1, div.cform_frm .c2 {
  width: 100%;
  display: block;
  position: relative;
}
div.cform_frm .c1 {
  width: 100%;
}
@media (min-width: 560px) {
  div.cform_frm .c1 {
    grid-column-start: 1;
    grid-column-end: 3;
  }
}
div.cform_frm .c2 {
  padding-right: 0.5rem;
}
@media (min-width: 560px) {
  div.cform_frm .c2 + div.c2 {
    padding: 0 0 0 0.5rem;
  }
}
div.cform_frm .ig.c1, div.cform_frm .ig.c2 {
  margin-bottom: 1.5rem;
  min-height: 2.5rem;
}
div.cform_frm .ig.c1:before, div.cform_frm .ig.c2:before {
  border: 1px solid rgb(27, 67, 121);
  border-radius: 0.1rem;
  position: absolute;
  content: "";
  right: 0;
  top: 0;
  left: 0;
  bottom: 0;
}
@media (min-width: 560px) {
  div.cform_frm .ig.c2:before {
    right: 0.5rem;
  }
  div.cform_frm .ig.c2 + div.c2:before {
    left: 0.5rem;
    right: 0;
  }
}
div.cform_frm .ig input, div.cform_frm .ig textarea, div.cform_frm .ig button {
  position: relative;
  padding: 6px;
  min-height: inherit;
  -webkit-appearance: none;
  -webkit-border-radius: 0;
  border: none;
  background: none;
  width: 100%;
  font-family: inherit;
  font-size: 0.875rem;
  color: rgb(27, 67, 121);
  border-radius: 0.1rem;
}
div.cform_frm .ig input:active, div.cform_frm .ig textarea:active, div.cform_frm .ig button:active {
  box-shadow: 0 0 0.2rem rgb(0, 0, 0);
}
div.cform_frm .ig textarea {
  overflow: auto;
  min-height: 7.8125rem;
}
div.cform_frm .ig button {
  text-align: center;
}
div.cform_frm .ig label {
  width: 100%;
  font-family: inherit;
  font-size: 0.775rem;
  color: rgb(27, 67, 121);
  line-height: 0.78rem;
  padding: 6px;
  display: block;
  text-align: left;
}
div.cform_frm .ext {
  font-size: 80%;
  font-style: italic;
  margin-top: -1rem;
}
div.cform_frm .ext input[type=checkbox] {
  margin-right: 0.5rem;
}
div.cform_frm .cpa {
  text-align: center;
  padding-top: 0.2rem;
}
div.cform_frm .cpa img {
  max-height: 50px;
}
div.cform_frm .radiobar {
  text-align: center;
  margin-bottom: 2rem;
}
div.cform_frm .radiobar input[type=radio] {
  opacity: 0;
  position: fixed;
  width: 0;
}
div.cform_frm .radiobar label {
  display: inline-block;
  background-color: #ddd;
  padding: 10px 20px;
  border: 1px solid #CCC;
  border-radius: 0.2rem;
  color: rgb(27, 67, 121);
  margin-bottom: 0.5rem;
}
div.cform_frm .radiobar label:hover {
  background-color: #dfd;
}
div.cform_frm .radiobar input[type=radio]:checked + label {
  background-color: rgb(86, 165, 50);
  border-color: rgb(86, 165, 50);
  color: #FFF;
}

#cform {
  position: relative;
  overflow-y: hidden;
}

#cf_confirm {
  margin: 1rem 0;
  position: relative;
}
#cf_confirm.error {
  color: red;
}

#cf_cpa {
  height: calc(2.5rem + 50px);
}

#wse {
  border: 1px solid #CCC;
  border-radius: 3px;
  padding: 0.3rem 0.3rem 0.3rem 65px;
  margin-bottom: 1rem;
  /*margin: 1rem;*/
  position: relative;
}
#wse > img {
  position: absolute;
  left: 0;
  top: 0;
}
#wse > div {
  display: inline-block;
}

.download_card {
  background: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNDY1IiBoZWlnaHQ9IjI2NSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KCiA8Zz4KICA8dGl0bGU+YmFja2dyb3VuZDwvdGl0bGU+CiAgPHJlY3QgZmlsbD0ibm9uZSIgaWQ9ImNhbnZhc19iYWNrZ3JvdW5kIiBoZWlnaHQ9IjI2NyIgd2lkdGg9IjQ2NyIgeT0iLTEiIHg9Ii0xIi8+CiA8L2c+CiA8Zz4KICA8dGl0bGU+TGF5ZXIgMTwvdGl0bGU+CiAgPGxpbmUgaWQ9InN2Z18xIiB5Mj0iOS42MDU2NjgiIHkxPSI5LjYwNTY2OCIgeDI9IjIxNS40NDM5NjgiIHgxPSIxMTUuODk4OTY4IiBzdHJva2Utd2lkdGg9IjEwIiBzdHJva2UtbWl0ZXJsaW1pdD0iMi42MTMxIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZT0iIzFiNDM3OSIgZmlsbD0ibm9uZSIvPgogIDxwYXRoIGlkPSJzdmdfMiIgc3Ryb2tlLXdpZHRoPSIxMCIgc3Ryb2tlLW1pdGVybGltaXQ9IjIuNjEzMSIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2U9IiMxYjQzNzkiIGZpbGw9Im5vbmUiIGQ9Im0yMTUuNDQzOTcsOS42MDU2NjdjNy4yMjAwMDEsMCAxMy4xMzU5ODYsNS45Mzk5OTUgMTMuMTM1OTg2LDEzLjExMjAwNyIvPgogIDxsaW5lIGlkPSJzdmdfMyIgeTI9IjIwNS4zMTY2NjgiIHkxPSIyMi43MTc2NjgiIHgyPSIyMjguNTc5OTY4IiB4MT0iMjI4LjU3OTk2OCIgc3Ryb2tlLXdpZHRoPSIxMCIgc3Ryb2tlLW1pdGVybGltaXQ9IjIuNjEzMSIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2U9IiMxYjQzNzkiIGZpbGw9Im5vbmUiLz4KICA8cGF0aCBpZD0ic3ZnXzQiIHN0cm9rZS13aWR0aD0iMTAiIHN0cm9rZS1taXRlcmxpbWl0PSIyLjYxMzEiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlPSIjMWI0Mzc5IiBmaWxsPSJub25lIiBkPSJtMjI4LjU3OTk1NiwyMDUuMzE2NjgxYzAsNy4xODM5OSAtNS45NDAwMDIsMTMuMTEwOTkyIC0xMy4xMzU5ODYsMTMuMTEwOTkyIi8+CiAgPGxpbmUgaWQ9InN2Z181IiB5Mj0iMjE4LjQyNzY2OCIgeTE9IjIxOC40Mjc2NjgiIHgyPSI3Mi4yMjg5NjgiIHgxPSIyMTUuNDQzOTY4IiBzdHJva2Utd2lkdGg9IjEwIiBzdHJva2UtbWl0ZXJsaW1pdD0iMi42MTMxIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZT0iIzFiNDM3OSIgZmlsbD0ibm9uZSIvPgogIDxwYXRoIGlkPSJzdmdfNiIgc3Ryb2tlLXdpZHRoPSIxMCIgc3Ryb2tlLW1pdGVybGltaXQ9IjIuNjEzMSIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2U9IiMxYjQzNzkiIGZpbGw9IiMxYjQzNzkiIGQ9Im03Mi4yMjg5NjYsMjE4LjQyNzY3M2MtNy4xNTk5OTYsMCAtMTMuMTEyLC01LjkxNTk4NSAtMTMuMTEyLC0xMy4xMTA5OTIiLz4KICA8cG9seWxpbmUgaWQ9InN2Z183IiBzdHJva2Utd2lkdGg9IjEwIiBzdHJva2UtbWl0ZXJsaW1pdD0iMi42MTMxIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZT0iIzFiNDM3OSIgcG9pbnRzPSI1OS4xMTY5NjYyNDc1NTg1OTQsMjA1LjMxNjY3MzI3ODgwODYgNTkuMTE2OTY2MjQ3NTU4NTk0LDYyLjEzNjY2NTM0NDIzODI4IDExNS44OTg5NjM5MjgyMjI2Niw5LjYwNTY2NzExNDI1NzgxMiAiIGZpbGw9Im5vbmUiLz4KICA8bGluZSBpZD0ic3ZnXzgiIHkyPSI1Ni44NzM2NjgiIHkxPSI5LjYwNTY2OCIgeDI9IjExOC41Nzg5NjgiIHgxPSIxMTguNTc4OTY4IiBzdHJva2Utd2lkdGg9IjEwIiBzdHJva2UtbWl0ZXJsaW1pdD0iMi42MTMxIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZT0iIzFiNDM3OSIgZmlsbD0ibm9uZSIvPgogIDxwYXRoIGlkPSJzdmdfOSIgc3Ryb2tlLXdpZHRoPSIxMCIgc3Ryb2tlLW1pdGVybGltaXQ9IjIuNjEzMSIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2U9IiMxYjQzNzkiIGZpbGw9IiMxYjQzNzkiIGQ9Im0xMTguNTc4OTcyLDU2Ljg3MzY2NWMwLDMuODUyMDA1IC0zLjE5OTk5Nyw3LjAzOTAwMSAtNy4wMzkwMDEsNy4wMzkwMDEiLz4KICA8bGluZSBpZD0ic3ZnXzEwIiB5Mj0iNjMuOTEyNjY4IiB5MT0iNjMuOTEyNjY4IiB4Mj0iNTkuMTE2OTY4IiB4MT0iMTExLjUzOTk2OCIgc3Ryb2tlLXdpZHRoPSIxMCIgc3Ryb2tlLW1pdGVybGltaXQ9IjIuNjEzMSIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2U9IiMxYjQzNzkiIGZpbGw9Im5vbmUiLz4KICA8cGF0aCBpZD0ic3ZnXzEyIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGZpbGw9IiMxYjQzNzkiIGQ9Im0zMDEuNDU0OTg3LDE2OC42MTI2NzFjNC4xMTcwMDQsMy40Mjk5OTMgNi4xODIwMDcsOC43NDA5OTcgNi4xODIwMDcsMTUuODY0OTljMCw3LjE1ODk5NyAtMi4xMjUsMTIuNDExMDExIC02LjMxMzk5NSwxNS43NDMwMTFjLTQuMjAyMDI2LDMuMzA4OTkgLTEwLjYzNzAyNCw0Ljk5ODk5MyAtMTkuMzE3MDE3LDQuOTk4OTkzbC0xMC40OTIwMDQsMGwwLDE3LjMyNTAxMmwtOS45NzI5OTIsMGwwLC01OS4xMDAwMDZsMjAuMjk1OTksMGM4Ljk2ODk5NCwwLjAwMTAwNyAxNS41MDEwMDcsMS43MzkwMTQgMTkuNjE4MDExLDUuMTY3OTk5bDAsMHptLTcuMDUxMDI1LDI0LjQxMjk5NGwwLDBjMS45OTIwMDQsLTIuMTM2OTkzIDIuOTgxMDE4LC01LjIzOTk5IDIuOTgxMDE4LC05LjMzMzAwOHMtMS4yNTUwMDUsLTYuOTg5OTkgLTMuNzkxMDE2LC04LjY4MWMtMi41NTk5OTgsLTEuNjkwMDAyIC02LjUwNjk4OSwtMi41MzUwMDQgLTExLjk1MTk5NiwtMi41MzUwMDRsLTEwLjEzMDAwNSwwbDAsMjMuNjg4MDE5bDExLjU5MTAwMywwYzUuNTE4MDA1LDAgOS4yODM5OTcsLTEuMDYyOTg4IDExLjMwMDk5NSwtMy4xMzkwMDh6IiBjbGlwLXJ1bGU9ImV2ZW5vZGQiLz4KICA8cGF0aCBpZD0ic3ZnXzEzIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGZpbGw9IiMxYjQzNzkiIGQ9Im0zNjQuMTAyOTY2LDE3MS4xOTY2ODZjNS42OTkwMDUsNS4xMTg5ODggOC41MzYwMTEsMTIuMzE1MDAyIDguNTM2MDExLDIxLjUxNTAxNWMwLDkuMTYzOTcxIC0yLjc2NTAxNSwxNi40NDQgLTguMjcwOTk2LDIxLjgwNDk5M2MtNS41MjkwMjIsNS4zNjA5OTIgLTEzLjk4MDAxMSw4LjAyODk5MiAtMjUuMzc4MDIxLDguMDI4OTkybC0xOS42MTg5ODgsMGwwLC01OS4xMDAwMDZsMjAuMjk0OTgzLDBjMTAuNjAxMDEzLDAgMTguNzUxMDA3LDIuNTU4OTkgMjQuNDM3MDEyLDcuNzUxMDA3bDAsMHptLTEuNTE5OTg5LDIxLjc1Njk4OWwwLDBjMCwtMTMuNTIyMDAzIC03Ljc2NDAwOCwtMjAuMzA3OTgzIC0yMy4yNTM5OTgsLTIwLjMwNzk4M2wtOS45NzI5OTIsMGwwLDQwLjUxODk4MmwxMS4wNzA5ODQsMGM3LjE0NzAwMywwIDEyLjY0MDk5MSwtMS43MDMwMDMgMTYuNDU1OTk0LC01LjA5NjAwOGMzLjgwNDAxNiwtMy40Mjg5ODYgNS43MDAwMTIsLTguNDUwOTg5IDUuNzAwMDEyLC0xNS4xMTQ5OXoiIGNsaXAtcnVsZT0iZXZlbm9kZCIvPgogIDxwb2x5Z29uIGlkPSJzdmdfMTQiIHBvaW50cz0iMzk1LjQ1Nzk2OTY2NTUyNzM0LDE3Mi43NDI2NjgxNTE4NTU0NyAzOTUuNDU3OTY5NjY1NTI3MzQsMTg4Ljk4MDY3NDc0MzY1MjM0IDQyMS42ODA5NjE2MDg4ODY3LDE4OC45ODA2NzQ3NDM2NTIzNCA0MjEuNjgwOTYxNjA4ODg2NywxOTguMTkyNjgwMzU4ODg2NzIgMzk1LjQ1Nzk2OTY2NTUyNzM0LDE5OC4xOTI2ODAzNTg4ODY3MiAzOTUuNDU3OTY5NjY1NTI3MzQsMjIyLjU0NDY3MDEwNDk4MDQ3IDM4NS40ODQ5Nzc3MjIxNjc5NywyMjIuNTQ0NjcwMTA0OTgwNDcgMzg1LjQ4NDk3NzcyMjE2Nzk3LDE2My40NDU2NzEwODE1NDI5NyA0MjQuODkyOTY3MjI0MTIxMSwxNjMuNDQ1NjcxMDgxNTQyOTcgNDI0LjgwNzk3NTc2OTA0Mjk3LDE3Mi43NDI2NjgxNTE4NTU0NyAiIGZpbGwtcnVsZT0iZXZlbm9kZCIgZmlsbD0iIzFiNDM3OSIgY2xpcC1ydWxlPSJldmVub2RkIi8+CiAgPGxpbmUgaWQ9InN2Z18xNSIgeTI9IjEyOC42OTg2NjgiIHkxPSIxMjguNjk4NjY4IiB4Mj0iNDM3Ljk0Mzk2OCIgeDE9IjI2Mi4wMDk5NjgiIHN0cm9rZS13aWR0aD0iMTAiIHN0cm9rZS1taXRlcmxpbWl0PSIyLjYxMzEiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlPSIjMWI0Mzc5IiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGZpbGw9Im5vbmUiIGNsaXAtcnVsZT0iZXZlbm9kZCIvPgogIDxwYXRoIGlkPSJzdmdfMTYiIHN0cm9rZS13aWR0aD0iMTAiIHN0cm9rZS1taXRlcmxpbWl0PSIyLjYxMzEiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlPSIjMWI0Mzc5IiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGZpbGw9Im5vbmUiIGQ9Im00MzcuOTQzOTcsMTI4LjY5ODY2OWMxMC42NzQwMTEsMCAxOS4yOTQwMDYsOC42NDQ5ODkgMTkuMjk0MDA2LDE5LjI5Mjk5OSIgY2xpcC1ydWxlPSJldmVub2RkIi8+CiAgPGxpbmUgaWQ9InN2Z18xNyIgeTI9IjIzNy45OTk2NjgiIHkxPSIxNDcuOTkxNjY4IiB4Mj0iNDU3LjIzNzk2OCIgeDE9IjQ1Ny4yMzc5NjgiIHN0cm9rZS13aWR0aD0iMTAiIHN0cm9rZS1taXRlcmxpbWl0PSIyLjYxMzEiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlPSIjMWI0Mzc5IiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGZpbGw9Im5vbmUiIGNsaXAtcnVsZT0iZXZlbm9kZCIvPgogIDxwYXRoIGlkPSJzdmdfMTgiIHN0cm9rZS13aWR0aD0iMTAiIHN0cm9rZS1taXRlcmxpbWl0PSIyLjYxMzEiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlPSIjMWI0Mzc5IiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGZpbGw9Im5vbmUiIGQ9Im00NTcuMjM3OTc2LDIzNy45OTk2NjRjMCwxMC42NDgwMSAtOC42MTk5OTUsMTkuMjY5MDEyIC0xOS4yOTQwMDYsMTkuMjY5MDEyIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiLz4KICA8bGluZSBpZD0ic3ZnXzE5IiB5Mj0iMjU3LjI2NzY2OCIgeTE9IjI1Ny4yNjc2NjgiIHgyPSIyNi41MzA5NjgiIHgxPSI0MzcuOTQzOTY4IiBzdHJva2Utd2lkdGg9IjEwIiBzdHJva2UtbWl0ZXJsaW1pdD0iMi42MTMxIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZT0iIzFiNDM3OSIgZmlsbC1ydWxlPSJldmVub2RkIiBmaWxsPSJub25lIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiLz4KICA8cGF0aCBpZD0ic3ZnXzIwIiBzdHJva2Utd2lkdGg9IjEwIiBzdHJva2UtbWl0ZXJsaW1pdD0iMi42MTMxIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZT0iIzFiNDM3OSIgZmlsbC1ydWxlPSJldmVub2RkIiBmaWxsPSIjMWI0Mzc5IiBkPSJtMjYuNTMwOTY4LDI1Ny4yNjc2N2MtMTAuNjQ3OTk5LDAgLTE5LjI5Mjk5OSwtOC42MTk5OTUgLTE5LjI5Mjk5OSwtMTkuMjY5MDEyIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiLz4KICA8bGluZSBpZD0ic3ZnXzIxIiB5Mj0iMTQ3Ljk5MTY2OCIgeTE9IjIzNy45OTk2NjgiIHgyPSI3LjIzNzk2OCIgeDE9IjcuMjM3OTY4IiBzdHJva2Utd2lkdGg9IjEwIiBzdHJva2UtbWl0ZXJsaW1pdD0iMi42MTMxIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZT0iIzFiNDM3OSIgZmlsbC1ydWxlPSJldmVub2RkIiBmaWxsPSJub25lIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiLz4KICA8cGF0aCBpZD0ic3ZnXzIyIiBzdHJva2Utd2lkdGg9IjEwIiBzdHJva2UtbWl0ZXJsaW1pdD0iMi42MTMxIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZT0iIzFiNDM3OSIgZmlsbC1ydWxlPSJldmVub2RkIiBmaWxsPSIjMWI0Mzc5IiBkPSJtNy4yMzc5NjgsMTQ3Ljk5MTY2OWMwLC0xMC42NDgwMSA4LjY0NSwtMTkuMjkyOTk5IDE5LjI5Mjk5OSwtMTkuMjkyOTk5IiBjbGlwLXJ1bGU9ImV2ZW5vZGQiLz4KICA8bGluZSBpZD0ic3ZnXzIzIiB5Mj0iMTg3LjEwOTY2OCIgeTE9IjcwLjMxMDY2OCIgeDI9IjE0NS41ODY5NjgiIHgxPSIxNDUuNTg2OTY4IiBzdHJva2Utd2lkdGg9IjEwIiBzdHJva2UtbWl0ZXJsaW1pdD0iMi42MTMxIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZT0iIzFiNDM3OSIgZmlsbC1ydWxlPSJldmVub2RkIiBmaWxsPSJub25lIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiLz4KICA8bGluZSBpZD0ic3ZnXzI0IiB5Mj0iMTUwLjEyNzY2OCIgeTE9IjE4Ny4xMDk2NjgiIHgyPSIxODIuNTU0OTY4IiB4MT0iMTQ1LjU4Njk2OCIgc3Ryb2tlLXdpZHRoPSIxMCIgc3Ryb2tlLW1pdGVybGltaXQ9IjIuNjEzMSIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2U9IiMxYjQzNzkiIGZpbGwtcnVsZT0iZXZlbm9kZCIgZmlsbD0ibm9uZSIgY2xpcC1ydWxlPSJldmVub2RkIi8+CiAgPGxpbmUgaWQ9InN2Z18yNSIgeTI9IjE0Ni42Mzk2NjgiIHkxPSIxODcuMTA5NjY4IiB4Mj0iMTA1LjE0MDk2OCIgeDE9IjE0NS41ODY5NjgiIHN0cm9rZS13aWR0aD0iMTAiIHN0cm9rZS1taXRlcmxpbWl0PSIyLjYxMzEiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlPSIjMWI0Mzc5IiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGZpbGw9Im5vbmUiIGNsaXAtcnVsZT0iZXZlbm9kZCIvPgogPC9nPgo8L3N2Zz4=") no-repeat center center/44% #FFF;
  display: inline-block;
  height: 14.05rem;
  width: 171px;
  float: left;
  border: 1px solid #CCC;
  border-radius: 3px;
  position: relative;
  overflow: hidden;
  cursor: pointer;
  margin: 20px 10px;
}
.download_card:hover {
  box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.3);
  border-color: #979797;
}
.download_card label {
  position: absolute;
  left: 0;
  right: 0;
  width: 100%;
  top: 0;
  height: auto;
  cursor: pointer;
  font-size: 1rem;
  line-height: 1.15;
  color: rgb(27, 67, 121);
  padding: 10px 10px 0 10px;
  text-align: center;
}
.download_card div {
  position: absolute;
  left: 0;
  right: 0;
  width: 100%;
  bottom: 0;
  height: auto;
  cursor: pointer;
  padding: 0 10px 10px 10px;
  font-size: 0.75rem;
  line-height: 0.9rem;
}

section.hnf div.fixwidth {
  margin-left: auto;
  margin-right: auto;
  width: 768px;
  max-width: 768px;
}
section.hnf div.fixwidth > .content img {
  max-width: 100%;
}
@media (max-width: 828px) {
  section.hnf div.fixwidth {
    max-width: 100%;
  }
}
@media (max-width: 501px) {
  section.hnf div.fixwidth {
    max-width: 100%;
  }
}

section.jobsection .frm.outer {
  width: 700px;
  max-width: 700px;
}

@media (max-width: 640px) {
  section.jobsection .frm.outer {
    max-width: 100%;
  }
  #sticker {
    display: none !important;
  }
}
.jobfrm {
  position: relative;
  background: #FFF;
}
.jobfrm .job {
  margin: 2rem 0;
  border: 1px solid rgb(27, 67, 121);
  border-radius: 0px;
  position: relative;
}
.jobfrm .job > div {
  padding: 1rem;
  position: relative;
}
.jobfrm .job h1 {
  margin-bottom: 1.75rem;
}
.jobfrm .job .jtitle {
  display: block;
  background-color: rgb(27, 67, 121);
  color: #FFF;
  margin-top: 0;
  padding: 1rem 1rem 1.25rem 1rem;
}
.jobfrm .job .jclosed {
  display: none;
  font-size: 1.3rem;
  font-weight: 600;
  cursor: pointer;
  text-decoration: underline;
  color: rgb(27, 67, 121);
}
.jobfrm .job.closed .jclosed {
  display: block;
}
.jobfrm .job.closed div.jdetails, .jobfrm .job.closed div.jcontact {
  display: none;
}

.feedbackcollection .detail-rating-badge {
  display: inline-block;
  padding: 17px 12px 20px;
  border: 2px solid #ff9328;
  border-radius: 10px;
  text-align: center;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
  max-width: 160px;
  height: 160px;
}
.feedbackcollection .detail-rating-badge p {
  font-size: 15px;
  line-height: 1.33;
  color: #222;
}
.feedbackcollection .detail-rating-badge p strong {
  font-weight: 600;
  font-size: 18px;
}
.feedbackcollection .detail-rating-badge .stars {
  margin-bottom: 20px;
  font-size: 1px;
}
.feedbackcollection .detail-rating-badge .stars > div, .feedbackcollection .detail-rating-badge .stars > span {
  position: relative;
  display: inline-block;
  width: 22px;
  height: 22px;
  /*background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAZCAYAAAAv3j5gAAACG0lEQVRIibWVz2sTQRTH+xdo/oQgwsxSCutFBEEKInhQ2YuCIFgoQo8rIt40Nw+CAzubhlDbiMWK9ccaCzYomoNYQWyDaLFUMGChQqmNpVWjLX48DG2JacxuzH5hTvPmfZjvvHmvoyOi0JaDlkWUnYh6NiJIBNw9CZ7siQ+i7AQD+2D6DmgRxAfSlsOTC7C6AFpUYgSJgNlHAHDvVDz2oewEWlT49d2AJgfAl7n2g7TlMNbHpr7MxmMfvszx9hY1unkElEy2D7Jh28p8LejFlWjVhxYVMjYN19ABeJ2lTmtVGOtrfC5jQ38XeEJtgEqMu1Bdrk/2P/pQgOzepZrqxBOKG4dg7mV7IBNXQYsK2nK2sVB2oyVMDbYOWJmHh2cw/fAfhYKSSbQoUTgHP1ejQT4+hcH9oGUKb/eOcAXiCcXwYfi2GA4yea2xVU1hvszx7nY40MjRddKddmSIAVkuxUvNIetVc5tWZxRaBJSL4W6U722tyaLsBJk9S/A7HOjNcGtNFm05FM7WJvs0ASPHzHp2sXZvea61JosWATP5rURTQ+YdPNmDkkl8mWP0BCzObMWMHgctu8NDlJ3Al2WqX2HtBzw+D1qU/v6A+JZLfxe8f2BAr9LR7ENbDvle+Fwyo8CXObK7dm4bm+608WWZ55dhYTqafWiZYtw1VvmW2zTejJGA+6fh+sHwMwotU2hRivoB8S3XdIf6d/oD+xbMtFLbMaMAAAAASUVORK5CYII=');*/
  background-image: url("data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAyMi44MzkgMjEuMyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJtMTguMSAyMS4zYy0wLjEgMC0wLjIgMC0wLjMtMC4xbC02LjQtNC4xLTYuNSA0LjFjLTAuMiAwLjEtMC40IDAuMS0wLjYgMHMtMC4yLTAuMy0wLjItMC41bDItNy4zLTYtNC43Yy0wLjEtMC4yLTAuMS0wLjQtMC4xLTAuNiAwLjEtMC4yIDAuMi0wLjMgMC41LTAuM2w3LjctMC40IDIuNy03LjFjMC4xLTAuMiAwLjMtMC4zIDAuNS0wLjNzMC40IDAuMSAwLjUgMC4zbDIuNyA3LjEgNy43IDAuNGMwLjIgMCAwLjQgMC4xIDAuNSAwLjNzMCAwLjQtMC4yIDAuNWwtNiA0LjcgMiA3LjNjMC4xIDAuMiAwIDAuNC0wLjIgMC41LTAuMSAwLjEtMC4yIDAuMi0wLjMgMC4yem0tMTYuMi0xMi43IDUuMiA0LjFjMC4yIDAuMSAwLjIgMC4zIDAuMiAwLjVsLTEuOCA2LjQgNS42LTMuNmMwLjItMC4xIDAuNC0wLjEgMC41IDBsNS42IDMuNi0xLjgtNi40Yy0wLjEtMC4yIDAtMC40IDAuMi0wLjVsNS4yLTQuMS02LjctMC4zYy0wLjIgMC0wLjQtMC4xLTAuNC0wLjNsLTIuMy02LjItMi40IDYuMmMtMC4xIDAuMi0wLjIgMC4zLTAuNCAwLjN6IiBmaWxsPSIjZmY5MzI4Ii8+PC9zdmc+");
  background-size: 100% 100%;
}
.feedbackcollection .detail-rating-badge .stars > div::before, .feedbackcollection .detail-rating-badge .stars > span::before {
  display: block;
  position: absolute;
  z-index: 1;
  width: 100%;
  height: 100%;
  /*background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAZCAYAAAAv3j5gAAABC0lEQVRIibWUwRGCMBBFUwIl5IK7R0qgBEuwBEqgg4xsOFOCJVgCJVgCJXwP0UEkSBJJZvYW5mUef79SkQcdXyA0wugi9ts4kNANwkDHl3wQowsIww3d8oHkdP4ATRlBL23vyaHPaaNpAbI8HA9aaMuoD5aHNYgBw/o4iNEFLD+8oND0ed0fPZaMgwmN+UA0LdIJSyYLRE7ntUbh+kDQ/WdQYFj/rfLKbXDppqncULUL66iJgqTuVCwoCaKUp0T3JqVkkxY5pWT9JZpBn1/bvOWbJStch0O8JUrjd6q8YYnRt9JmyWwtIPqyWj4qQh+u3M6qqNm974Izqw7dJweiEX1ZBb9OvVXS5PtPTyyU+Pc0Z7WbAAAAAElFTkSuQmCC');*/
  background-image: url("data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAyMi44MzkgMjEuMyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJtMTguMSAyMS4zYy0wLjEgMC0wLjIgMC0wLjMtMC4xbC02LjQtNC4xLTYuNSA0LjFjLTAuMiAwLjEtMC40IDAuMS0wLjYgMHMtMC4yLTAuMy0wLjItMC41bDItNy4zLTYtNC43Yy0wLjEtMC4yLTAuMS0wLjQtMC4xLTAuNiAwLjEtMC4yIDAuMi0wLjMgMC41LTAuM2w3LjctMC40IDIuNy03LjFjMC4xLTAuMiAwLjMtMC4zIDAuNS0wLjNzMC40IDAuMSAwLjUgMC4zbDIuNyA3LjEgNy43IDAuNGMwLjIgMCAwLjQgMC4xIDAuNSAwLjNzMCAwLjQtMC4yIDAuNWwtNiA0LjcgMiA3LjNjMC4xIDAuMiAwIDAuNC0wLjIgMC41LTAuMSAwLjEtMC4yIDAuMi0wLjMgMC4yeiIgZmlsbD0iI2ZmOTMyOCIvPjwvc3ZnPg==");
  background-size: 22px 22px;
  content: "";
}
.feedbackcollection .rating-position {
  display: inline-flex;
  align-items: flex-end;
  text-align: left;
  margin: 10px;
  /*position: absolute;
  bottom: 0;*/
}
.feedbackcollection .rating-position .rating-position__label {
  font-size: 16px;
}
.feedbackcollection .rating-position .rating-position__label, .feedbackcollection .rating-position .rating-position__pos {
  line-height: 1;
  font-weight: 700;
  color: #79797a;
  width: auto;
  display: inline-block;
}
.feedbackcollection .rating-position .rating-position__pos {
  font-size: 36px;
  color: #ff9328;
  line-height: 0.75;
  margin-left: 5px;
  margin-right: 8px;
}
.feedbackcollection .rating-position .rating-position__info {
  display: inline-block;
  display: inline-grid;
  width: auto;
  max-height: 26px;
  white-space: normal;
  line-height: 13px;
  position: relative;
  overflow: hidden;
  max-width: 160px;
}
.feedbackcollection .rating-position .rating-position__info .rating-position__info > span {
  height: 13px;
  font-size: 13px;
  display: inline-block;
  text-overflow: ellipsis;
  overflow: hidden;
  line-height: 1;
  white-space: nowrap;
  font-weight: 300;
  width: 100%;
}
.feedbackcollection .swiper-slide > table {
  height: 100%;
  width: 100%;
}
.feedbackcollection .swiper-slide > table > tbody > tr > td {
  text-align: center;
  vertical-align: middle;
}
@media (max-width: 650px) {
  .feedbackcollection .swiper-slide > table > tbody > tr > td:nth-child(n+2) {
    display: none;
  }
}
.feedbackcollection .swiper-slide > table > tbody > tr:last-child > td {
  vertical-align: bottom;
}
.feedbackcollection td.wc2 {
  width: 44%;
  /*.rating-comparing__progress-cursor:before {
      width: 100%;
      height: .36em;
      top: 1em;
      content: "";
      left: 50%;
      transform: translateY(1em);
      background: #ff9328
  }*/
}
.feedbackcollection td.wc2 .rating-comparing {
  position: relative;
  font-size: 13px;
  max-width: 100%;
}
.feedbackcollection td.wc2 .rating-comparing__headline {
  line-height: 1.2;
  font-weight: 600;
  font-size: 1.07em;
  margin-bottom: 1.4em;
}
.feedbackcollection td.wc2 .rating-comparing__current {
  width: 100%;
  height: 1px;
  background: #ff9328;
  margin-bottom: 1em;
}
.feedbackcollection td.wc2 .rating-comparing__progress-cursor {
  position: absolute;
  display: flex;
  justify-content: space-between;
  height: 1.57em;
  flex-direction: column;
  width: 1.2em;
  background: #fff;
  transform: translateX(-50%) translateY(-100%);
}
.feedbackcollection td.wc2 .rating-comparing__progress-cursor:after {
  left: 50%;
  top: 1em;
  transform: translateY(1em);
  width: 0;
  height: 0;
  content: "";
  border-color: #ff9328 transparent transparent;
  border-style: solid;
  border-width: 1em 0.6em 0;
}
.feedbackcollection td.wc2 .rating-comparing__average {
  width: 100%;
  height: 1.07em;
  border: 2px solid #b5b4b3;
}
.feedbackcollection td.wc2 .rating-comparing__progress {
  position: relative;
  margin: 0.85em auto 0 auto;
  width: 137px;
}
.feedbackcollection td.wc2 .rating-comparing__progress-bar {
  height: 100%;
  background: #b5b4b3;
}
.feedbackcollection td.wc2 .rating-comparing__progress-info {
  position: relative;
  height: 2.86em;
}
.feedbackcollection td.wc2 .rating-comparing__progress-info > span {
  position: absolute;
  padding-top: 1.14em;
  transform: translateX(-0.29em);
  width: 16%;
  font-weight: 600;
  color: #ff9328;
  display: inline-flex;
  align-items: center;
  line-height: 1.43em;
}
.feedbackcollection td.wc2 .rating-comparing__progress-info > span:last-child {
  transform: translateX(-0.43em);
}
.feedbackcollection td.wc2 .rating-comparing__progress-info > span:before {
  position: absolute;
  top: 0;
  content: "";
  border-left: 2px solid #eaeaea;
  height: 1em;
  transform: translateX(4px);
}
.feedbackcollection td.wc2 .rating-comparing__progress-info > span i {
  font-size: 0.714em;
  margin-left: 0.25em;
}
.feedbackcollection td.wc2 .rating-comparing__info {
  position: relative;
  font-size: 13px;
  line-height: 13px;
  display: inline-block;
  color: #b5b4b3;
  z-index: 1;
  white-space: normal;
}
.feedbackcollection td.wc2 .rating-comparing__info--average {
  padding-left: 14.18px;
  font-size: 11px;
  line-height: 11px;
  font-weight: 400;
}
.feedbackcollection td.wc2 .rating-comparing__info--average:before {
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  width: 0.714em;
  height: 0.714em;
  background: #b5b4b3;
  content: "";
}
.feedbackcollection td.wc2 .rating-comparing__info--current {
  color: #ff9328;
  font-weight: 600;
}

.iconeu::before {
  content: "";
  width: 2.4rem;
  display: inline-block;
  height: 1.2rem;
  background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTg1LjE5bW0iIGhlaWdodD0iMTA0Ljc4bW0iIHZlcnNpb249IjEuMSIgdmlld0JveD0iMCAwIDE4NS4xOSAxMDQuNzgiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiA8ZGVmcz4KICA8ZmlsdGVyIGlkPSJiIiB4PSItLjAxNzQ1NSIgeT0iLS4xOTUzNyIgd2lkdGg9IjEuMDM0OSIgaGVpZ2h0PSIxLjM5MDciIGNvbG9yLWludGVycG9sYXRpb24tZmlsdGVycz0ic1JHQiI+CiAgIDxmZUdhdXNzaWFuQmx1ciBzdGREZXZpYXRpb249IjEuMTMxMzMyNSIvPgogIDwvZmlsdGVyPgogIDxmaWx0ZXIgaWQ9ImEiIHg9Ii0uMDExODU4IiB5PSItLjAwNTE2OTUiIHdpZHRoPSIxLjAyMzciIGhlaWdodD0iMS4wMTAzIiBjb2xvci1pbnRlcnBvbGF0aW9uLWZpbHRlcnM9InNSR0IiPgogICA8ZmVHYXVzc2lhbkJsdXIgc3RkRGV2aWF0aW9uPSIwLjIxMTI3NjU2Ii8+CiAgPC9maWx0ZXI+CiA8L2RlZnM+CiA8ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMTEuMjUzIC00LjU3MTEpIj4KICA8cGF0aCBkPSJtNTQuNTIzIDUuMDc4MS00Mi43NjMgOTguMDg4eiIgZmlsbD0iIzFmOTMyOCIvPgogIDxwYXRoIGQ9Im00Ni4zNjYgMjMuNzg3LTMwLjA2MiA2OC45NTVoMTgwLjE0bC0xOC40NDItMzMuNDA5IDE4LjQ0Mi0zNS41NDd6IiBmaWxsPSIjZmY5MzI4Ii8+CiAgPHRleHQgdHJhbnNmb3JtPSJzY2FsZSgxLjAyOTYgLjk3MTI1KSIgeD0iNDQuNzc1NjM1IiB5PSI3OS41MTM3OTQiIGZpbGw9IiNmZmZmZmYiIGZvbnQtZmFtaWx5PSJzYW5zLXNlcmlmIiBmb250LXNpemU9IjY2LjM0NnB4IiBzdHJva2Utd2lkdGg9IjEuNjU4NiIgc3R5bGU9ImxpbmUtaGVpZ2h0OjEuMjUiIHhtbDpzcGFjZT0icHJlc2VydmUiPjx0c3BhbiB4PSI0NC43NzU2MzUiIHk9Ijc5LjUxMzc5NCIgZmlsbD0iI2ZmZmZmZiIgc3Ryb2tlLXdpZHRoPSIxLjY1ODYiPm5ldTwvdHNwYW4+PC90ZXh0PgogIDxwYXRoIGQ9Im0xNi4zMDQgOTIuNzQzaDE1NS41NWwtNy42OTk0IDEzLjg5OC0xNDcuODUtMTMuODk4IiBmaWxsPSIjNmQ2Yjc2IiBmaWxsLW9wYWNpdHk9Ii41ODMzMyIgZmlsdGVyPSJ1cmwoI2IpIiBzdHlsZT0ibWl4LWJsZW5kLW1vZGU6bm9ybWFsIi8+CiAgPHBhdGggZD0ibTU0LjUyMyA1LjA3ODFjLTEzLjQ1MyAyNy42MTgtMjYuMzcxIDUzLjYzMi00MS45NjEgOTEuNjczbC0wLjgwMTgxIDYuNDE0NSA0Mi43NjMtOTguMDg4IiBmaWxsPSIjMjYyNzJlIiBmaWx0ZXI9InVybCgjYSkiIHN0eWxlPSJtaXgtYmxlbmQtbW9kZTpub3JtYWwiLz4KIDwvZz4KPC9zdmc+) center center/cover no-repeat;
  transform: translate(0, 0.12rem);
  margin-right: 0.3rem;
}

div.inref {
  display: inline;
  padding: 10px 14px;
  border: 1px solid rgb(27, 67, 121);
  background-color: rgb(86, 165, 50);
  box-shadow: 1px 1px 3px rgba(50, 50, 50, 0.3);
  border-radius: 3px;
  color: #FFF;
}

div.yvp {
  border: 1px solid #CCC;
  box-shadow: 1px 1px 3px rgba(50, 50, 50, 0.7);
  width: 100%;
  max-width: 600px;
  height: 400px;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  display: inline-block;
  position: relative;
}
div.yvp .ccov {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background: rgba(50, 50, 50, 0.7);
  cursor: pointer;
  display: flex;
  align-items: center;
  text-align: center;
  justify-content: center;
  align-content: center;
}
div.yvp .ccov > div {
  background: rgba(250, 250, 250, 0.75);
  width: 50%;
  max-width: 270px;
  text-align: center;
  font-size: 1.2rem;
  padding: 1rem;
  display: inline-flex;
}

.counterfrm {
  text-align: center;
}
.counterfrm .counter-box-container {
  display: inline-block;
  position: relative;
  text-align: center;
  margin: 10px;
}

.mailto_frm {
  display: block;
  border: 1px solid #CCC;
  border-radius: 0.2rem;
  background: green;
  padding: 0.5rem 1rem 0.7rem 1rem;
}
.mailto_frm .mailto_lbl {
  display: block;
  border: 0;
  border-radius: 0.2rem;
  background: #FFF;
  padding: 0.5rem 1rem 0.3rem 1rem;
  text-transform: uppercase;
  letter-spacing: 0.03rem;
  color: #000;
  margin: 0.35rem 0 1rem 0;
  box-shadow: 0.1rem 0.1rem 0.25rem rgb(50, 50, 50);
}
.mailto_frm .mailto_link {
  padding: 0.5rem 1rem 0.3rem 1rem;
  letter-spacing: 0.04rem;
  position: relative;
}
.mailto_frm .mailto_link:before {
  content: "";
  background: url("data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCA0Ny45IDM2LjYiIHhtbDpzcGFjZT0icHJlc2VydmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHN0eWxlIHR5cGU9InRleHQvY3NzIj4KCS5zdDB7ZmlsbDojZmZmZmZmO30KPC9zdHlsZT48ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtOC4xLC0xMy44KSI+PGcgaWQ9Ikljb24tRW52ZWxvcGUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDc4LDIzMikiPjxwYXRoIGNsYXNzPSJzdDAiIGQ9Im0tMjIuNS0yMTMuMi0xLjktMS45LTE3LjYgMTcuNmMtMi4yIDIuMi01LjkgMi4yLTguMSAwbC0xNy42LTE3LjUtMS45IDEuOSAxMy4xIDEzLjEtMTMuMSAxMy4xIDEuOSAxLjkgMTMuMS0xMy4xIDIuNiAyLjZjMS42IDEuNiAzLjcgMi41IDUuOSAyLjVzNC4zLTAuOSA1LjktMi41bDIuNi0yLjYgMTMuMSAxMy4xIDEuOS0xLjktMTMuMS0xMy4xIDEzLjItMTMuMiIvPjxwYXRoIGNsYXNzPSJzdDAiIGQ9Im0tMjYuMi0xODEuNmgtMzkuNWMtMi4zIDAtNC4yLTEuOS00LjItNC4ydi0yOC4yYzAtMi4zIDEuOS00LjIgNC4yLTQuMmgzOS41YzIuMyAwIDQuMiAxLjkgNC4yIDQuMnYyOC4yYzAgMi4zLTEuOSA0LjItNC4yIDQuMnptLTM5LjYtMzMuOWMtMC44IDAtMS40IDAuNi0xLjQgMS40djI4LjJjMCAwLjggMC42IDEuNCAxLjQgMS40aDM5LjVjMC44IDAgMS40LTAuNiAxLjQtMS40di0yOC4yYzAtMC44LTAuNi0xLjQtMS40LTEuNHoiLz48L2c+PC9nPjwvc3ZnPg==") no-repeat center center/contain transparent content-box;
  height: 1.2rem;
  width: 1.2rem;
  display: inline-block;
  position: relative;
  padding-top: 0.3rem;
  margin-right: 0.7rem;
}

body.bfp .logoexchange_frm {
  right: -100%;
}
body.bfp button[class^=videoask] {
  bottom: -100% !important;
}

body button[class^=videoask] {
  transition: transform 0.2s ease-in-out, bottom ease 2s !important;
}

.logoexchange_frm {
  background-color: #11284b;
  border: 1px solid #11284b;
  color: #FFF;
  position: fixed;
  right: 0;
  top: 200px;
  width: auto;
  height: auto;
  display: none;
  grid-template-columns: 4.8rem 1fr;
  grid-column-gap: 1.2rem;
  z-index: 6;
  padding: 0.8rem;
  align-items: center;
  justify-content: center;
  box-shadow: -0.3rem 0.5rem 0.75rem rgba(50, 50, 50, 0.7);
  border-top-left-radius: 3px;
  border-bottom-left-radius: 3px;
  line-height: 1.4;
  transition: right ease 2.5s;
}
.logoexchange_frm:hover {
  border: 1px solid rgb(86, 165, 50);
}
.logoexchange_frm[style*="display: block"], .logoexchange_frm[style*="display:block"] {
  display: inline-grid !important;
}
@media (max-height: 849px) {
  .logoexchange_frm[style*="display: block"], .logoexchange_frm[style*="display:block"] {
    display: none !important;
  }
}
.logoexchange_frm .lex_logo {
  background: transparent;
  height: 4.8rem;
  width: 4.8rem;
  cursor: pointer;
  position: relative;
}
.logoexchange_frm--mallorca .lex_logo {
  background: transparent url("/media/layout/SanitaerFuchs_es.svg") center center/contain no-repeat;
}
.logoexchange_frm--agent {
  border-bottom-left-radius: 1.5rem;
  background: none;
  border: none;
  box-shadow: none;
}
.logoexchange_frm--agent .lex_logo {
  background: none;
  opacity: 0;
}
.logoexchange_frm--agent::before {
  content: "";
  position: absolute;
  background: rgb(86, 165, 50);
  height: calc(100% - 1rem);
  width: calc(100% - 4.6rem);
  left: 5.6rem;
  top: 1rem;
  z-index: 1;
  cursor: pointer;
  box-shadow: -0.3rem 0.5rem 0.75rem rgba(50, 50, 50, 0.7);
}
.logoexchange_frm--agent::after {
  content: "";
  position: absolute;
  background: transparent url("/fuchs/media/Max.png?width=200") center center/contain no-repeat;
  height: 8.8rem;
  width: 8.8rem;
  left: 0rem;
  top: -4rem;
  border-width: 0.15rem solid rgb(86, 165, 50);
  border-radius: 50%;
  box-shadow: 0 0 2rem #11284b;
  z-index: 0;
  cursor: pointer;
}
.logoexchange_frm .lex_lf {
  font-size: 100%;
  max-width: 12rem;
  cursor: pointer;
  z-index: 2;
}

.c2grid {
  display: grid !important;
  grid-template-columns: 1fr 1fr;
  grid-gap: 1rem;
}
.c2grid > * {
  padding: 0;
  text-align: left;
}

#directemails table {
  border: none;
}
#directemails table tr td {
  text-align: left;
  vertical-align: middle;
  padding: 0rem 1rem 1rem 1rem;
  font-size: 110%;
}
#directemails table tr td a {
  color: #808080;
}
#directemails table tr td[rowspan="2"] {
  text-align: center;
  border-top: 1px solid #e5e5e5;
  padding: 0.5rem 1rem;
}
#directemails table tr td[rowspan="2"] + td {
  text-align: left;
  border-top: 1px solid #e5e5e5;
  font-size: 125%;
  font-weight: bolder;
  padding: 1rem 1rem 0.5rem 1rem;
}

:root {
  --agent-primary: #1e6bb8;
  --agent-primary-dark: #145295;
  --agent-accent: #f0a500;
  --agent-on-primary: #ffffff;
  --agent-panel-w: 480px;
  --agent-panel-h: 600px;
  --agent-avatar-size: 100px;
  --agent-fab-size: 66px;
  --agent-fab-bottom: clamp(8px, 2.5vw, 28px);
  --agent-fab-right: clamp(8px, 2.5vw, 24px);
  --agent-gap: 10px;
  --agent-radius: 14px;
  --agent-z: 200;
}

.agent-fab {
  position: fixed;
  bottom: var(--agent-fab-bottom);
  right: var(--agent-fab-right);
  width: var(--agent-fab-size);
  height: var(--agent-fab-size);
  border-radius: 50%;
  background: var(--agent-primary);
  border: 3px solid var(--agent-accent);
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.35);
  cursor: pointer;
  z-index: var(--agent-z);
  overflow: hidden;
  padding: 0;
  transition: transform 0.2s, box-shadow 0.2s, opacity 0.2s;
}
.agent-fab img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.agent-fab:hover {
  transform: scale(1.07);
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.45);
}
.agent-fab.hidden {
  opacity: 0;
  pointer-events: none;
  transform: scale(0.8);
}

.agent-fab-label {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 0.3em 0.5em 0.35em;
  background: linear-gradient(to top, rgba(0, 0, 0, 0.55) 0%, transparent 100%);
  pointer-events: none;
  line-height: 1.2;
  text-align: left;
}
.agent-fab-label__main {
  display: block;
  font-weight: 700;
  font-size: var(--agent-fab-label-size, 0.7em);
  color: var(--agent-fab-label-color, #fff);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}
.agent-fab-label__sub {
  display: block;
  font-weight: 400;
  font-size: var(--agent-fab-sublabel-size, 0.6em);
  color: var(--agent-fab-sublabel-color, rgba(255, 255, 255, 0.8));
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}

.agent-panel {
  position: fixed;
  bottom: var(--agent-fab-bottom);
  right: var(--agent-fab-right);
  width: var(--agent-panel-w);
  height: var(--agent-panel-h);
  max-height: calc(100dvh - var(--agent-fab-bottom) - var(--agent-panel-top-gap, 8px));
  max-width: calc(100vw - var(--agent-fab-right) - var(--agent-panel-left-gap, 8px));
  z-index: var(--agent-z);
  display: flex;
  flex-direction: column;
  background: #fff;
  border-radius: var(--agent-radius);
  border-top-left-radius: 0;
  box-shadow: 0 8px 40px rgba(0, 0, 0, 0.2), 0 2px 8px rgba(0, 0, 0, 0.08);
  transform: translateY(16px);
  opacity: 0;
  pointer-events: none;
  transition: transform 0.28s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.22s ease;
}
.agent-panel.open {
  transform: translateY(0);
  opacity: 1;
  pointer-events: auto;
}

.agent-panel-header {
  flex-shrink: 0;
  position: relative;
  display: flex;
  align-items: center;
  min-height: 52px;
  padding: 0 12px 0 calc(var(--agent-avatar-size) + 16px);
  background: var(--agent-primary);
  color: var(--agent-on-primary);
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
  border-top-right-radius: inherit;
  border-top-left-radius: inherit;
}

.agent-panel-avatar {
  position: absolute;
  top: calc(var(--agent-avatar-size) * -0.573);
  left: calc(var(--agent-avatar-size) * -0.6292);
  width: var(--agent-avatar-size);
  height: var(--agent-avatar-size);
  border-radius: 50%;
  overflow: hidden;
  border: none;
  box-shadow: none;
  background: none;
  flex-shrink: 0;
  transition: opacity 0.15s ease;
}
.agent-panel-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.agent-panel--no-avatar {
  border-top-left-radius: var(--agent-radius);
}
.agent-panel--no-avatar .agent-panel-avatar {
  display: none;
}
.agent-panel--no-avatar .agent-panel-header {
  padding-left: 12px;
}

.agent-panel-title {
  flex: 1 1 auto;
  font-weight: 600;
  font-size: 1rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.agent-panel-close {
  flex-shrink: 0;
  background: rgba(255, 255, 255, 0.18);
  border: 1px solid rgba(255, 255, 255, 0.4);
  color: var(--agent-on-primary);
  cursor: pointer;
  font-size: 0.82rem;
  font-weight: 500;
  padding: 5px 11px;
  border-radius: 5px;
  white-space: nowrap;
  transition: background 0.15s;
}
.agent-panel-close:hover {
  background: rgba(255, 255, 255, 0.28);
}

.agent-panel-body {
  flex: 1 1 auto;
  overflow-y: auto;
  background: #f5f7fa;
}

.agent-messages {
  padding: 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  min-height: 100%;
}

.agent-loading {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 2.5rem 1rem;
  color: #6c757d;
  gap: 0.75rem;
  font-size: 0.9rem;
}
.agent-loading .agent-spinner {
  width: 28px;
  height: 28px;
  border: 3px solid #dee2e6;
  border-top-color: var(--agent-primary);
  border-radius: 50%;
  animation: agent-spin 0.8s linear infinite;
}

@keyframes agent-spin {
  to {
    transform: rotate(360deg);
  }
}
.agent-panel-footer {
  flex-shrink: 0;
  padding: 10px 12px;
  border-top: 1px solid #e5e7eb;
  background: #fff;
  border-radius: 0 0 var(--agent-radius) var(--agent-radius);
}

.agent-actions {
  display: flex;
  gap: 0.5rem;
  justify-content: center;
  margin-bottom: 8px;
}

.agent-file-preview {
  display: flex;
  flex-wrap: wrap;
  gap: 0.3rem;
  margin-bottom: 6px;
}

.agent-input-row {
  display: flex;
  align-items: flex-end;
  gap: 6px;
}

.agent-input {
  flex: 1 1 auto;
  min-width: 0;
  height: 40px;
  min-height: 40px;
  max-height: 300px;
  padding: 6px 12px;
  border: 1px solid #d1d5db;
  border-radius: 8px;
  font-size: 0.9rem;
  font-family: inherit;
  line-height: 1.5;
  outline: none;
  background: #f9fafb;
  resize: none;
  overflow-y: auto;
  transition: border-color 0.15s, background 0.15s;
}
.agent-input:focus {
  border-color: var(--agent-primary);
  background: #fff;
  box-shadow: 0 0 0 2px rgba(30, 107, 184, 0.15);
}
.agent-input:disabled {
  background: #f3f4f6;
  color: #9ca3af;
}

.agent-btn-upload, .agent-btn-attach,
.agent-btn-cancel, .agent-btn-submit, .agent-btn-confirm-cancel, .agent-btn-close, .agent-btn-feedback, .agent-btn-result, .agent-btn-send {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 40px;
  padding: 0 16px;
  border-radius: 8px;
  font-size: 0.88rem;
  font-weight: 500;
  cursor: pointer;
  white-space: nowrap;
  border: 1px solid transparent;
  transition: background 0.15s, border-color 0.15s, opacity 0.15s;
}
.agent-btn-upload:disabled, .agent-btn-attach:disabled,
.agent-btn-cancel:disabled, .agent-btn-submit:disabled, .agent-btn-confirm-cancel:disabled, .agent-btn-close:disabled, .agent-btn-feedback:disabled, .agent-btn-result:disabled, .agent-btn-send:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.agent-btn-send {
  background: var(--agent-primary);
  color: var(--agent-on-primary);
  flex-shrink: 0;
}
.agent-btn-send:hover:not(:disabled) {
  background: var(--agent-primary-dark);
}

.agent-btn-result {
  background: #16a34a;
  color: #fff;
}
.agent-btn-result:hover:not(:disabled) {
  background: #15803d;
}

.agent-btn-feedback {
  background: transparent;
  border-color: var(--agent-primary);
  color: var(--agent-primary);
}
.agent-btn-feedback:hover:not(:disabled) {
  background: var(--agent-primary);
  color: var(--agent-on-primary);
}

.agent-btn-close {
  background: #f3f4f6;
  border-color: #d1d5db;
  color: #374151;
}
.agent-btn-close:hover:not(:disabled) {
  background: #e5e7eb;
}

.agent-btn-confirm-cancel {
  background: #dc2626;
  color: #fff;
}
.agent-btn-confirm-cancel:hover:not(:disabled) {
  background: #b91c1c;
}

.agent-btn-submit {
  background: var(--agent-primary);
  color: var(--agent-on-primary);
  flex-shrink: 0;
}
.agent-btn-submit:hover:not(:disabled) {
  background: var(--agent-primary-dark);
}

.agent-btn-attach,
.agent-btn-cancel {
  width: 40px;
  padding: 0;
  flex-shrink: 0;
  background: #f3f4f6;
  border-color: #d1d5db;
  color: #6b7280;
  font-size: 1.1rem;
}
.agent-btn-attach:hover:not(:disabled),
.agent-btn-cancel:hover:not(:disabled) {
  background: #e5e7eb;
}

.agent-btn-cancel {
  color: #dc2626;
}
.agent-btn-cancel:hover:not(:disabled) {
  background: #fee2e2;
  border-color: #dc2626;
}

.agent-btn-upload {
  height: 34px;
  padding: 0 12px;
  font-size: 0.82rem;
  background: transparent;
  border-color: var(--agent-primary);
  color: var(--agent-primary);
}
.agent-btn-upload:hover:not(:disabled) {
  background: var(--agent-primary);
  color: var(--agent-on-primary);
}

.agent-message {
  display: flex;
}
.agent-message .agent-bubble {
  max-width: 80%;
  padding: 0.45rem 0.8rem;
  border-radius: 0.9rem;
  white-space: pre-wrap;
  font-size: 0.9rem;
  line-height: 1.45;
}
.agent-message.user {
  justify-content: flex-end;
}
.agent-message.user .agent-bubble {
  background: var(--agent-primary);
  color: var(--agent-on-primary);
  border-bottom-right-radius: 0.25rem;
}
.agent-message.assistant {
  justify-content: flex-start;
}
.agent-message.assistant .agent-bubble {
  background: #fff;
  border: 1px solid #e2e4e8;
  border-bottom-left-radius: 0.25rem;
}

.agent-bubble-files {
  margin-top: 0.3rem;
  display: flex;
  flex-wrap: wrap;
  gap: 0.2rem;
}

.agent-upload-requests {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  margin-top: 0.5rem;
}

.agent-upload-hint {
  display: block;
  font-size: 0.78rem;
  color: #6c757d;
  margin-top: 0.1rem;
}

.agent-file-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.15rem 0.5rem;
  border-radius: 0.35rem;
  background: rgba(0, 0, 0, 0.1);
  font-size: 0.8rem;
}
.agent-file-badge.removable {
  background: #6c757d;
  color: #fff;
}
.agent-file-badge button {
  background: none;
  border: none;
  cursor: pointer;
  color: inherit;
  font-size: 1rem;
  line-height: 1;
  padding: 0;
  opacity: 0.8;
}
.agent-file-badge button:hover {
  opacity: 1;
}

.agent-topics {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem;
  padding: 0 0 0.5rem;
}

.agent-topic {
  display: inline-block;
  padding: 0.2rem 0.55rem;
  border-radius: 0.35rem;
  background: #0dcaf0;
  color: #000;
  font-size: 0.78rem;
}

.agent-status {
  display: inline-block;
  padding: 0.2rem 0.55rem;
  border-radius: 0.35rem;
  font-size: 0.78rem;
  font-weight: 600;
  background: #6c757d;
  color: #fff;
}
.agent-status.success {
  background: #198754;
}
.agent-status.danger {
  background: #dc3545;
}
.agent-status.warning {
  background: #ffc107;
  color: #000;
}

.agent-modal {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.5);
  z-index: calc(var(--agent-z) + 100);
  align-items: center;
  justify-content: center;
  padding: 1rem;
}
.agent-modal.open {
  display: flex;
}

.agent-modal-dialog {
  background: #fff;
  border-radius: 0.5rem;
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.25);
  display: flex;
  flex-direction: column;
  max-height: 90vh;
  width: 100%;
}
.agent-modal-dialog.sm {
  max-width: 400px;
}
.agent-modal-dialog.lg {
  max-width: 720px;
}

.agent-modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.75rem 1rem;
  border-bottom: 1px solid #dee2e6;
  border-radius: 0.5rem 0.5rem 0 0;
  background: #f8f9fa;
  color: #212529;
}
.agent-modal-header.success {
  background: #198754;
  color: #fff;
}
.agent-modal-header.primary {
  background: var(--agent-primary);
  color: var(--agent-on-primary);
}

.agent-modal-title {
  font-weight: 600;
  font-size: 1rem;
}

.agent-modal-close {
  background: none;
  border: none;
  cursor: pointer;
  font-size: 1.25rem;
  line-height: 1;
  padding: 0 0.25rem;
  color: inherit;
  opacity: 0.8;
}
.agent-modal-close:hover {
  opacity: 1;
}
.agent-modal-close.light {
  color: #fff;
}

.agent-modal-body {
  padding: 1rem;
  overflow-y: auto;
}
.agent-modal-body.tabs {
  padding: 0;
}

.agent-modal-footer {
  display: flex;
  justify-content: flex-end;
  gap: 0.5rem;
  padding: 0.75rem 1rem;
  border-top: 1px solid #dee2e6;
}

.agent-tabs {
  display: flex;
  border-bottom: 1px solid #dee2e6;
  padding: 0 0.75rem;
  gap: 0.2rem;
}

.agent-tab {
  background: none;
  border: 1px solid transparent;
  border-bottom: none;
  border-radius: 0.375rem 0.375rem 0 0;
  padding: 0.5rem 0.9rem;
  cursor: pointer;
  font-size: 0.875rem;
  color: #495057;
  margin-bottom: -1px;
}
.agent-tab:hover {
  background: #f8f9fa;
}
.agent-tab.active {
  border-color: #dee2e6;
  border-bottom: 1px solid #fff;
  background: #fff;
  color: var(--agent-primary);
  font-weight: 600;
}

.agent-tab-panels {
  padding: 1rem;
}

.agent-tab-panel {
  display: none;
}
.agent-tab-panel.active {
  display: block;
}

.agent-section {
  margin-bottom: 1rem;
}

.agent-section-title {
  font-weight: 600;
  font-size: 0.9rem;
  border-bottom: 1px solid #dee2e6;
  padding-bottom: 0.35rem;
  margin-bottom: 0.5rem;
}

.agent-table {
  width: 100%;
  font-size: 0.85rem;
  border-collapse: collapse;
}
.agent-table th, .agent-table td {
  padding: 0.3rem 0.5rem;
  border: 1px solid #dee2e6;
  vertical-align: top;
}
.agent-table th {
  width: 35%;
  font-weight: 600;
  background: #f8f9fa;
}

.agent-pre {
  font-size: 0.8rem;
  margin: 0;
  white-space: pre-wrap;
  word-break: break-all;
}

.agent-html-block {
  margin-bottom: 1rem;
}

.agent-muted {
  color: #6c757d;
  font-size: 0.875rem;
}

.agent-error {
  color: #dc3545;
  font-size: 0.875rem;
}

.agent-textarea {
  width: 100%;
  padding: 0.4rem 0.6rem;
  border: 1px solid #ced4da;
  border-radius: 0.375rem;
  font-size: 0.875rem;
  resize: vertical;
  box-sizing: border-box;
}
.agent-textarea:focus {
  outline: none;
  border-color: var(--agent-primary);
  box-shadow: 0 0 0 2px rgba(30, 107, 184, 0.25);
}

.agent-notice {
  padding: 0.5rem 0.75rem;
  border-radius: 0.35rem;
  margin-top: 0.5rem;
  font-size: 0.875rem;
}
.agent-notice.success {
  background: #d1e7dd;
  color: #0f5132;
}
.agent-notice.danger {
  background: #f8d7da;
  color: #842029;
}

@media (max-width: 767px) {
  .agent-panel {
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    width: 100%;
    height: 100%;
    border-radius: 0;
    padding-top: 0;
  }
  .agent-panel-header {
    padding: 0 12px;
  }
  .agent-panel-avatar {
    position: relative;
    top: auto;
    left: auto;
    width: 40px;
    height: 40px;
    border-width: 2px;
    margin-right: 10px;
    flex-shrink: 0;
  }
  .agent-fab {
    width: 56px;
    height: 56px;
    bottom: 16px;
    right: 16px;
  }
}
:root {
  --agent-primary: rgb(27, 67, 121);
  --agent-accent: rgb(86, 165, 50);
  --agent-on-primary: #FFF;
  --agent-panel-w: 500px;
  --agent-panel-h: 640px;
  --agent-radius: 14px;
  --agent-z: 200;
  --agent-fab-bottom: 28px;
  --agent-fab-right: 24px;
  --agent-fab-size: clamp(100px, 18vmin, 200px);
  --agent-avatar-size: clamp(80px, 15vmin, 200px);
}

@media (min-width: 1920px) {
  :root {
    --agent-panel-h: 680px;
  }
}
@media (max-width: 960px) {
  :root {
    --agent-panel-w: 420px;
    --agent-panel-h: 600px;
  }
}
@media (max-width: 799px) {
  :root {
    --agent-panel-w: 360px;
    --agent-panel-h: 560px;
    --agent-fab-bottom: 20px;
    --agent-fab-right: 16px;
  }
}
@media (max-width: 767px) {
  :root {
    --agent-fab-bottom: 16px;
    --agent-fab-right: 16px;
  }
}
@media (max-width: 360px) {
  :root {
    --agent-fab-bottom: 12px;
    --agent-fab-right: 12px;
  }
}
:root {
  --agent-fab-label-color: #FFF;
  --agent-fab-sublabel-color: rgba(86, 165, 50, 0.95);
  --agent-fab-label-size: calc(var(--agent-fab-size) * 0.13);
  --agent-fab-sublabel-size: calc(var(--agent-fab-size) * 0.10);
}

.agent-fab {
  overflow: visible;
  border: none;
  padding: 2px;
}
.agent-fab img {
  width: calc(100% - 2px);
  height: calc(100% - 2px);
  object-fit: cover;
  display: block;
  position: absolute;
  top: 1px;
  left: 1px;
  z-index: 2;
}

.agent-fab-label {
  background: rgb(27, 67, 121);
  left: unset;
  top: unset;
  right: 63%;
  bottom: 1.75%;
  width: 110%;
  height: 40%;
  z-index: 1;
  justify-content: center;
  flex-wrap: nowrap;
}

@media (max-width: 799px) {
  .agent-fab-label {
    display: none !important;
  }
}
@media (max-width: 799px) and (orientation: portrait) {
  .agent-fab-label {
    display: flex !important;
    max-width: clamp(90px, 28vw, 180px);
    overflow: hidden;
  }
}