/* =============================================================================
   Tables
   ========================================================================== */

table.ce-table td {
  border: 2px solid rgb(var(--c-neutral-lightest));
  background: rgb(var(--c-neutral-lighter));
  padding: 0.3rem 0.7rem;
}

table.ce-table th,
table.ce-table caption {
  color: rgb(var(--c-neutral-lightest));
  background: rgb(var(--c-primary));
  font-family: var(--f-family);
  border: 2px solid rgb(var(--c-neutral-lightest));
  text-transform: uppercase;
  padding: 0.3rem 0.7rem;
}

.ios-scrollbar {
  padding-bottom: 20px;
  position: relative;
}

.ios-scrollbar::after {
  content: "\f178";
  font-family: "FaLight", sans-serif;
  font-size: 15px;
  line-height: 100%;
  position: absolute;
  right: 0;
  bottom: 5px;
}

/* =============================================================================
   Standard contentelements
   ========================================================================== */

/* Uploads */
.uploads__item {
  background-color: rgb(var(--c-neutral-lighter));
}

.content > .frame:nth-child(2n) .uploads__item {
  background-color: rgb(var(--c-neutral-lightest));
}

.uploads__link {
  color: rgb(var(--c-neutral-dark));
}

.uploads__title {
  color: rgb(var(--c-primary));
  text-transform: uppercase;
  font-size: var(--f-size-l-1);
}

.uploads__arrowpath {
  stroke: rgb(var(--c-primary));
}

.no-touch .content > .frame:nth-child(2n) .uploads__item:hover,
.no-touch .uploads__item:hover {
  background-color: rgb(var(--c-primary));
}

.no-touch .uploads__item:hover,
.no-touch .uploads__item:hover .uploads__title {
  color: rgb(var(--c-neutral-lightest));
}

.no-touch .uploads__item:hover .uploads__arrowpath {
  stroke: rgb(var(--c-neutral-lightest));
}

/* Images */
.-border img,
.-border iframe {
  border: 1px solid rgb(var(--c-neutral-light));
}

.gallery__item a[data-fancybox]::before,
.media__image a::before {
  background-color: rgba(var(--c-primary), 0.6);
}

/* Menus */
.frame-type-menu_pages li a,
.frame-type-menu_sitemap li a {
  color: rgb(var(--c-neutral-dark));
}

/* Paginator */
ul.f3-widget-paginator {
  padding: 0;
  display: flex;
  flex-wrap: wrap;
}

ul.f3-widget-paginator li {
  list-style-type: none;
  width: 40px;
  height: 40px;
  margin: 0 5px 5px 0;
  background: rgb(var(--c-neutral-lighter));
  display: flex;
  justify-content: center;
  align-items: center;
}

ul.f3-widget-paginator a {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
  width: 100%;
}

.no-touch ul.f3-widget-paginator li:hover,
ul.f3-widget-paginator li.current {
  background: rgb(var(--c-primary));
  color: rgb(var(--c-neutral-lightest));
}

.no-touch ul.f3-widget-paginator li:hover a,
ul.f3-widget-paginator li.current a {
  color: rgb(var(--c-neutral-lightest));
}

ul.f3-widget-paginator li.previous a::after {
  content: "\f053";
  font-family: "FaLight", sans-serif;
  font-weight: normal;
  font-style: normal;
  text-decoration: inherit;
  -webkit-font-smoothing: antialiased;
  height: auto;
  line-height: normal;
  vertical-align: baseline;
  font-size: var(--f-size);
}

ul.f3-widget-paginator li.next a::after {
  content: "\f054";
  font-family: "FaLight", sans-serif;
  font-weight: normal;
  font-style: normal;
  text-decoration: inherit;
  -webkit-font-smoothing: antialiased;
  height: auto;
  line-height: normal;
  vertical-align: baseline;
  font-size: var(--f-size);
}

/* =============================================================================
   Template
   ========================================================================== */
/* Content */
.content > .frame,
.content__top,
.content__bottom > .frame,
.footer {
  padding-top: 50px;
  padding-bottom: 50px;
  background: rgb(var(--c-neutral-lightest));
}

.footer .fa-brands {
  font-size: 50px;
}

.footer a[rel="noreferrer"]::after {
  vertical-align: top;
  font-size: 15px;
}

.content > .frame.frame-default:not(:first-child):not(.frame-layout-40) {
  padding-top: 0;
}

.frame.frame-layout-40:not(:last-child) {
  margin-bottom: 50px;
}

.footer {
  padding-bottom: 20px;
}

/* not necessary in this layout
.content__bottom > .frame:nth-child(odd),
.content > .frame:nth-child(2n) {
    background: rgb(var(--c-neutral-lighter));
}
*/

/* Partner Logos */
.partnerlogos > .frame {
  padding-top: 50px;
  padding-bottom: 50px;
}

/* Footer */
.footer {
  background: rgb(var(--c-primary));
}

.footer,
.footer h1,
.footer h2,
.footer h3,
.footer a {
  color: rgb(var(--c-neutral-lightest));
}

.no-touch .footer a:hover {
  color: rgb(var(--c-secondary));
}

/* =============================================================================
   Container
   ========================================================================== */

/* Accordion */
.content .accordion.-vertical .accordion__header {
  font-size: var(--f-size-l-2);
  margin: 0 0 3px;
}

.content .accordion.-vertical .accordion__button {
  background: rgb(var(--c-neutral-lighter));
  border: none;
  color: rgb(var(--c-primary));
  cursor: pointer;
  font: inherit;
  padding: 0.6rem 4rem 0.6rem 1rem;
  text-transform: uppercase;
}

.content .accordion.-vertical .accordion__header.-active .accordion__button,
.no-touch .content .accordion.-vertical .accordion__button:hover {
  background: rgb(var(--c-primary));
  color: rgb(var(--c-neutral-lightest));
}

.content .accordion.-vertical .accordion__header::after {
  color: rgb(var(--c-primary));
  right: 1rem;
}

.content .accordion.-vertical .accordion__header.-active::after,
.no-touch .content .accordion.-vertical .accordion__header:hover::after {
  color: rgb(var(--c-neutral-lightest));
}

.content .accordion.-vertical .accordion__content {
  margin-bottom: 3px;
  padding: 3rem 1rem;
}

/* Tabs */
.content > .frame-type-tabs > .tabs__nav {
  column-gap: 0;
  margin-right: 4%;
  margin-left: 4%;
  row-gap: 0.5rem;
}

.content .tabs__button {
  background: none;
  border: none;
  box-shadow: inset 0 -2px 0 0 rgb(var(--c-neutral-lighter));
  color: rgb(var(--c-neutral-dark));
  cursor: pointer;
  font: inherit;
  font-size: var(--f-size-l-2);
  padding: 0 0.6rem 0.3rem;
  position: relative;
  text-transform: uppercase;
}

.content .tabs__button.-active,
.no-touch .content .tabs__button:hover {
  color: rgb(var(--c-primary));
}

.content .tabs__button.-active {
  box-shadow: inset 0 -2px 0 0 rgb(var(--c-primary));
}

.content .tabs__button::before {
  border-bottom: 2px solid rgb(var(--c-primary));
  bottom: 0;
  content: '';
  height: 0;
  left: 50%;
  opacity: 0;
  position: absolute;
  transform: translateX(-50%);
  transition: opacity 0.05s 0.1s, width 0.2s 0.4s, height 0.2s 0.2s;
  width: 0;
}

.no-touch .content .tabs__button:hover::before {
  height: 100%;
  opacity: 1;
  transition: opacity 0.05s, width 0.2s, height 0.2s 0.2s;
  width: 100%;
}

.content > .frame-type-tabs:not(.-itempadding) > .tabs__content {
  margin-top: 0;
  padding-top: 3rem;
}

/* =============================================================================
   Media Queries
   ========================================================================== */
@media (min-width: 400px) {
  /* Container */
  .content > .frame,
  .content__top,
  .content__bottom > .frame {
    padding-top: calc(50px + (100 - 50) * ((100vw - 400px) / (1600 - 400)));
    padding-bottom: calc(50px + (100 - 50) * ((100vw - 400px) / (1600 - 400)));
  }

  /* Partner Logos */
  .partnerlogos > .frame {
    padding-top: calc(50px + (100 - 50) * ((100vw - 400px) / (1600 - 400)));
    padding-bottom: calc(50px + (100 - 50) * ((100vw - 400px) / (1600 - 400)));
  }

  /* Footer */
  .footer {
    padding-top: calc(45px + (70 - 45) * ((100vw - 400px) / (1600 - 400)));
    padding-bottom: calc(20px + (40 - 20) * ((100vw - 400px) / (1600 - 400)));
  }

  #c334 .gallery__item:first-child {
    padding-top: 6vw;
    max-width: 650px;
  }
}

@media (min-width: 1280px) {
  /* Footer */
  #c334 {
    margin-bottom: 0;
  }
}

@media (min-width: 1580px) {
  /* Container */
  .content > .frame,
  .content__top,
  .content__bottom > .frame {
    padding-top: 100px;
    padding-bottom: 100px;
  }

  /* Partner Logos */
  .partnerlogos > .frame {
    padding-top: 100px;
    padding-bottom: 100px;
  }

  /* Footer */
  .footer {
    padding-top: 70px;
    padding-bottom: 40px;
  }

  #c334 .gallery__item:first-child {
    padding-top: 5rem;
  }

  /* Container */
  .content > .frame-type-tabs > .tabs__nav {
    margin-right: calc((100% - 1440px) / 2);
    margin-left: calc((100% - 1440px) / 2);
  }
}
