html {
  background-image: none;
  background-color: white;
}
body.mceContentBody {
	height:auto;
}
/**
  Schriften
**/
#content p,
#yuiOverlayContainer p,
body.mceContentBody p,
#content h1,
#yuiOverlayContainer h1,
body.mceContentBody h1,
#content h2,
#yuiOverlayContainer h2,
body.mceContentBody h2,
#content h3,
#yuiOverlayContainer h3,
body.mceContentBody h3,
#content h4,
#yuiOverlayContainer h4,
body.mceContentBody h4,
#content li,
#yuiOverlayContainer li,
body.mceContentBody li,
#content td,
#yuiOverlayContainer td,
body.mceContentBody td,
#content th,
#yuiOverlayContainer th,
body.mceContentBody th {
  margin: 0;
  color: #000000;
}
#yuiOverlayContainer p,
#yuiOverlayContainer h1,
#yuiOverlayContainer h2,
#yuiOverlayContainer h3,
#yuiOverlayContainer li,
#yuiOverlayContainer th,
#yuiOverlayContainer td {
  color: #000000;
}
#content p,
body.mceContentBody p,
#filterOverlay p,
#content li,
body.mceContentBody li,
#filterOverlay li,
#content th,
body.mceContentBody th,
#content td,
body.mceContentBody td {
  font-family: var(--paragraph-font-sansserif);
  font-size: 16px;
  line-height: 23px;
}
@media(max-width: 576px) {
  #content p,
  #content li,
  #content th,
  #content td {
    font-size: 14px;
    line-height: 20px;
  }
}
#content p+p,
#yuiOverlayContainer p+p,
body.mceContentBody p+p {
  margin-top: 10px;
}
#content a,
body.mceContentBody a,
#yuiOverlayContainer a  {
  color: #000000;
}
#content a:hover,
body.mceContentBody a:hover,
#yuiOverlayContainer a:hover {
  color: var(--accent-color);
}
#content .coloredLetters,
#content .coloredLetters > *,
#yuiOverlayContainer .coloredLetters,
#yuiOverlayContainer .coloredLetters > *,
body.mceContentBody .coloredLetters,
body.mceContentBody .coloredLetters > * {
  color: var(--accent-color) !important;
}
#content h1,
#yuiOverlayContainer h1,
body.mceContentBody h1,
#filterOverlay h1 {
  font-family: var(--font-serif);
  font-size: 45px;
  line-height: 60px;
  font-weight: bold;
  padding-bottom: 25px;
}
@media(max-width: 1400px) {
  #content h1,
  #filterOverlay h1 {
    font-size: 40px;
    line-height: 52px;
    padding-bottom: 20px;
  }
}
@media(max-width: 768px) {
  #content h1,
  #filterOverlay h1 {
    font-size: 30px;
    line-height: 41px;
    padding-bottom: 20px;
  }
}
#content h2,
body.mceContentBody h2,
#yuiOverlayContainer h2,
#filterOverlay h2,
.proz-article .article_title {
  font-family: var(--accent-font-sansserif);
  font-size: 40px;
  line-height: 45px;
  font-weight: normal;
}
@media(max-width: 1400px) {
  #content h2,
  #filterOverlay h2,
  .proz-article .article_title {
    font-size: 35px;
    line-height: 40px;
  }
}
@media(max-width: 768px) {
  #content h2,
  #filterOverlay h2,
  .proz-article .article_title {
    font-size: 30px;
    line-height: 35px;
  }
}
#content h3, 
body.mceContentBody h3, 
#yuiOverlayContainer h3,
#filterOverlay h3 {
  font-family: var(--font-serif);
  font-weight: bold;
  font-size: 30px;
  line-height: 39px;
  padding-top: 15px;
  padding-bottom: 10px;
}
@media(max-width: 1400px) {
  #content h3,
  #filterOverlay h3 {
    font-size: 28px;
    line-height: 35px;
  }
}
@media(max-width: 768px) {
  #content h3,
  #filterOverlay h3 {
    font-size: 25px;
    line-height: 30px;
  }
}
#content h4,
body.mceContentBody h4,
#yuiOverlayContainer h4,
#filterOverlay h4 {
  font-family: var(--accent-font-sansserif);
  font-size: 23px;
  line-height: 26px;
  font-weight: normal;
}
@media(max-width: 1400px) {
  #content h4,
  #filterOverlay h4 {
    font-size: 22px;
    line-height: 25px;
  }
}
@media(max-width: 768px) {
  #content h4,
  #filterOverlay h4,
  .proz-article .article_date {
    font-size: 20px;
    line-height: 23px;
  }
}
#yuiOverlayContainer p,
#yuiOverlayContainer li,
#yuiOverlayContainer th,
#yuiOverlayContainer td {
  font-size: 18px;
  line-height: 23px;
}
#content .lead,
#yuiOverlayContainer .lead,
body.mceContentBody .lead {
  font-family: var(--font-serif);
  font-weight: bold;
  font-size: 30px;
  line-height: 39px;
}
@media(max-width: 1400px) {
  #content .lead {
    font-size: 25px;
    line-height: 33px;
  }
}
@media(max-width: 768px) {
  #content .lead {
    font-size: 19px;
    line-height: 26px;
  }
}
#content .akkoBold,
#yuiOverlayContainer .akkoBold,
body.mceContentBody .akkoBold {
  font-family: var(--accent-font-sansserif);
  font-weight: normal;
}
#content .notoSerifBold,
#yuiOverlayContainer .notoSerifBold,
body.mceContentBody .notoSerifBold {
  font-family: var(--font-serif);
  font-weight: bold;
}
#content table,
body.mceContentBody #content table,
#yuiOverlayContainer #content table {
  table-layout: fixed;
}

/** 
* .coloredLinks is used on different pages and in different places: header, burgermenu, all forms, 
* loadMore-buttons, E-Paper, RTE-Content for Inserieren, etc.
* Rule is shaky and easily overwritten by other rules. Change with care.
**/
#sitecontainer .coloredLinks a,
#sitecontainer .coloredLinks,
body.mceContentBody .coloredLinks,
#filterOverlay .coloredLinks {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  height: 43px;
  background-color: var(--accent-color);
  text-transform: uppercase;
  color: white !important;
  text-decoration: none !important;
  font-family: var(--accent-font-sansserif);
  font-size: 20px;
  line-height: 25px;
  cursor: pointer;
  border: none;
  outline: none;
}
@media(max-width: 576px) {
  #sitecontainer .coloredLinks:not(.keepFontSize) a,
  #sitecontainer .coloredLinks:not(.keepFontSize) {
    font-size: 18px;
    line-height: 21px;
    height: 39px;
  }
}
/*Safari needs this. Otherwise it might display text-decorations on coloredLinks in RTE.*/
li.cel_nav_nodeName_Downloads a {
  text-decoration: none;
}
#sitecontainer .coloredLinks a:hover,
#sitecontainer .coloredLinks:hover,
#filterOverlay .coloredLinks:hover  {
  background-color: black;
}
#sitecontainer .coloredLinks a:disabled,
#sitecontainer .coloredLinks:disabled,
#filterOverlay .coloredLinks:disabled {
  background-color: grey;
  cursor: not-allowed;
}
