/* =============================================================================
   Tables
   ========================================================================== */

table.ce-table td {
  border: 2px solid rgb(var(--c-neutral-lightest));
  background: rgb(var(--c-neutral-lighter));
  padding: 0.3rem 0.7rem;
}

.content > .frame:nth-child(2n) table.ce-table td {
  border: 2px solid rgb(var(--c-neutral-lighter));
  background: rgb(var(--c-neutral-lightest));
}

table.ce-table th,
table.ce-table caption {
  color: rgb(var(--c-neutral-lightest));
  background: rgb(var(--c-primary));
  border: 2px solid rgb(var(--c-neutral-lightest));
  padding: 0.3rem 0.7rem;
  font-family: var(--f-family);
  font-weight: var(--f-weight-b);
}

.content > .frame:nth-child(2n) table.ce-table th,
.content > .frame:nth-child(2n) table.ce-table caption {
  border: 2px solid rgb(var(--c-neutral-lighter));
}



/* =============================================================================
   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__link:hover .uploads__description,
.no-touch .uploads__link:hover .uploads__title {
  color: rgb(var(--c-neutral-lightest));
}

.no-touch .uploads__link: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-neutral-darkest), 0.6);
}

.gallery__item a[data-fancybox]::after,
.media__image a::after {
  background-color: rgb(var(--c-primary));
  height: 60px;
  width: 60px;
  left: 50%;
  margin-top: -30px;
  margin-left: -30px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 34px;
  font-family: "FaRegular", sans-serif;
}

/* Menus */
.frame-type-menu_pages li a,
.frame-type-menu_sitemap li a {
  color: rgb(var(--c-neutral-dark));
}

.-video {
  aspect-ratio: 16 / 9;

  & iframe {
    height: 100% !important;
  }

  & video {
    width: 100%;
  }
}

.video-embed {
  padding: 0 !important;
  height: auto !important;
}

.footer {
  padding-top: 50px;
  padding-bottom: 50px;
  background: rgb(var(--c-neutral-lightest));
}

.footer {
  background-color: rgb(var(--c-primary));
  color: rgb(var(--c-neutral-lightest));
  position: relative;
}

.footer a,
.footer .frame-type-menu_pages li a,
.footer h1,
.footer h2,
.footer h3,
.footer h4,
.footer h5 {
  color: rgb(var(--c-neutral-lightest));
}

.no-touch .footer a:hover {
  text-decoration: underline;
}

.footer input {
  background-color: transparent;
  border: 2px solid rgb(var(--c-neutral-lightest));
  width: 100%;
}

.footer input,
.footer input::-webkit-input-placeholder {
  color: rgb(var(--c-neutral-lightest));
}

.no-touch .footer .font__button:hover,
.footer .font__button {
  background-color: rgb(var(--c-neutral-lightest));
  color: rgb(var(--c-primary));
  text-decoration: none;
}

.no-touch .footer a.font__button:hover::after {
  color: rgb(var(--c-primary));
}


/* =============================================================================
   Media Queries
   ========================================================================== */
@media (min-width: 400px) {
  /* Container */
  .footer {
    padding-top: calc(50px + (110 - 50) * ((100vw - 400px) / (1600 - 400)));
    padding-bottom: calc(50px + (110 - 50) * ((100vw - 400px) / (1600 - 400)));
  }
}


@media (min-width: 1580px) {
  .footer {
    padding-top: 110px;
    padding-bottom: 110px;
  }
}
