/**
 * @file
 * InnoKoeln specific CSS.
 */

@font-face {
  font-family:"SoehneWebLeicht";
  font-style:normal;
  font-weight:400;
  src: url("../fonts/soehne-web-leicht/soehne-web-leicht.eot");
  src: url("../fonts/soehne-web-leicht/soehne-web-leicht.eot") format("embedded-opentype"),
  url("../fonts/soehne-web-leicht/soehne-web-leicht.woff") format("woff"),
  url("../fonts/soehne-web-leicht/soehne-web-leicht.woff2") format("woff2")
}
@font-face {
  font-family:"SoehneWebBuch";
  font-style:normal;
  font-weight:400;
  src: url("../fonts/soehne-web-buch/soehne-web-buch.eot");
  src: url("../fonts/soehne-web-buch/soehne-web-buch.eot") format("embedded-opentype"),
  url("../fonts/soehne-web-buch/soehne-web-buch.woff") format("woff"),
  url("../fonts/soehne-web-buch/soehne-web-buch.woff2") format("woff2")
}

a {text-decoration: none !important;}

/** ZITAT */

blockquote {
  margin: 2em 0 !important;
  padding: 1em;
  border-left: 1px solid #bbb;
  background: #f7f7f7;
  font-style: italic;
}

blockquote::before {
  margin-right: 0.2em;
  content: "\201D";
  vertical-align: -0.45em;
  font-size: 3em;
  line-height: 0;
}

blockquote::after {
  content: "\201C";
  vertical-align: -0.45em;
  font-size: 3em;
  line-height: 0.1em;
}

blockquote p,
blockquote h1,
blockquote h2,
blockquote h3,
blockquote h4,
blockquote h5,
blockquote h6 {
  display: inline;
}
blockquote p {font-size:1.2em}

/** ZITAT STARTSEITE **/

.path-frontpage blockquote {
  margin: 0 !important;
  padding: 0;
  background: none;
  border: none;
}

.path-frontpage blockquote::after {
  content: "\201C";
  vertical-align: -0.25em;
}

video {
  width: 100%;
  height: auto;
}

html, body {
  overflow-x: hidden;
}

body, .site-footer {
  font-family: "SoehneWebLeicht" !important;
  height: 100%;
}

#header::-webkit-scrollbar {
  display: none;
}

#header {
  position: fixed;
  width: 100%;
  max-height: 100%;
  overflow-y: auto;
  scrollbar-width: none;
  -ms-overflow-style: none;
  top: 0;
  z-index: 999;
}

#header + * {
  margin-top: 78px;
}

.user-logged-in #header {
  top: 39px;
}

.user-logged-in.toolbar-tray-open.toolbar-horizontal #header {
  top: 79px;
}

.mailicon, .suchicon {
  display: inline-block;
  width: 3em;
  height: auto;
}

#block-mailiconheader,
#block-suchlupenheader
 {
  margin-right: 0.3em;
  padding: .25rem .75rem;
}

input[type="search"] {

}
.form-search.form-control {
  border-radius: 0;
  border: 1px solid black;
}

/** STARTSEITE **/
.node--type-startseite #main-wrapper {
  position: static;
}
.block-animated-block {
  height: 40vw;
}
.row > #block-animatedblock {
  padding-left: 0;
}
.row > #block-topheaderimageprojektdetailseite {
  padding: 0;
}
.block-field-blocknodestartseitefield-einleitungstext-startseite,
.block.block-layout-builder.block-field-blocknodepagefield-einleitung,
.field--name-description {
  font-size: 1.75em;
  margin-bottom: 2em;
  hyphens: auto;
}

.block-field-blocknodestartseitefield-einleitungstext-startseite {
  margin-top: 2em;
}
.square2-start {
  padding:1em;
  position:relative;
  width:100%;
  flex-basis:100%;
  max-width: 100%;
  border: 1px solid white;
}
.square2-start:before {
  content:"";
  display:block;
  padding-top:100%;
}
.square2faktenkachel {
  padding:1em;
  color:black;
  position:relative;
  width:100%;
  flex-basis:100%;
  max-width: 100%;
  border: 1px solid white;
}
.square2faktenkachel:before {
  content:"";
  display:block;
  padding-top:100%;
}
.block-field-blocknodestartseitefield-faktenkachel .squareContent,
.block-field-blocknodestartseitefield-faktenkachel-1 .squareContent,
.block-field-blocknodestartseitefield-faktenkachel-2 .squareContent,
.block-field-blocknodestartseitefield-faktenkachel-3 .squareContent,
.block-field-blocknodestartseitefield-faktenkachel-4 .squareContent
{
  margin: 0;
  padding: 0;
}
.squareContent .node--type-fakten-kachel-startseite{
  height: 100%;
  margin: 0;
  padding: 2.25em !important;
  padding-top: 1.25em !important;
}
.squareContent .node--type-fakten-kachel-startseite p,
.square2-start .field--name-field-teasertext-teaser-flex{
  hyphens: auto;
  font-size: 1em;
}
.square2-start .node--type-kategorie-teaser-flexible .katlink {
  flex-grow: 1 !important;
  width: 100% !important;
}
.square2-start .field--name-field-headline-teaser-flex{
  font-weight: bold;
}
.square2-start .field--name-field-faktenkachel,
.square2-start .field--name-field-faktenkachel-1,
.square2-start .field--name-field-faktenkachel-2,
.square2-start .field--name-field-faktenkachel-3,
.square2-start .field--name-field-faktenkachel-4{
  margin:0;
  padding: 0;
}
.block-field-blocknodestartseitefield-newsteaser-oder-termin-ein .square2-start .squareContent,
.block-field-blocknodestartseitefield-newsteaser-oder-termin-2 .square2-start .squareContent,
.block-field-blocknodestartseitefield-newsteaser-oder-termin-3 .square2-start .squareContent,
.block-field-blocknodestartseitefield-newsteaser-oder-termin-4 .square2-start .squareContent,
.block-field-blocknodestartseitefield-newskachel-1 .square2-start .squareContent,
.block-field-blocknodestartseitefield-newskachel-2 .square2-start .squareContent
{
  padding: 0;
}
.block-field-blocknodestartseitefield-newsteaser-oder-termin-ein .square2-start .content,
.block-field-blocknodestartseitefield-newsteaser-oder-termin-2 .square2-start .content,
.block-field-blocknodestartseitefield-newsteaser-oder-termin-3 .square2-start .content,
.block-field-blocknodestartseitefield-newsteaser-oder-termin-4 .square2-start .content
{
  padding: 0;
  hyphens: auto;
  height: 100%;
}
.block-field-blocknodestartseitefield-newsteaser-oder-termin-ein .square2-start news,
.block-field-blocknodestartseitefield-newsteaser-oder-termin-2 .square2-start news,
.block-field-blocknodestartseitefield-newsteaser-oder-termin-3 .square2-start news,
.block-field-blocknodestartseitefield-newsteaser-oder-termin-4 .square2-start news,
.block-field-blocknodestartseitefield-newskachel-1 .square2-start news,
.block-field-blocknodestartseitefield-newskachel-2 .square2-start news

{
  padding: 1.75em !important;
}
.block-field-blocknodestartseitefield-news-termin-oder-download- .square2-start .content,
.block-field-blocknodestartseitefield-news-termin-download-1 .square2-start .content,
.block-field-blocknodestartseitefield-termin-oder-download-3 .square2-start .content,
.block-field-blocknodestartseitefield-newskachel-1 .square2-start .content,
.block-field-blocknodestartseitefield-newskachel-2 .square2-start .content,
.field--name-field-newskachel-2

{
  /*padding: 0.5em;*/
  hyphens: auto;
  height: 100%;
}
.square2-start  .node--type-termin h2,
.square2-start .node--type-downlad h2
{
  font-size: 1.5em !important;
}
.square2-start  .node--type-termin a {
  background-size: 2em;
  background-position: left bottom;
}
.square2-start .contextual a {
  background-image: none;
}
.square2-start a {
  display: block;
  width: 100%;
  height: 100%;
  background-image: url('../img/icons/arrow_right.svg');
  background-size: 4em;
  background-position: left 92%;
  background-repeat: no-repeat;
}
.block-field-blocknodestartseitefield-news-termin-download-1 .square2-start a,
.block-field-blocknodestartseitefield-news-termin-oder-download- .square2-start a,
.block-field-blocknodestartseitefield-termin-oder-download-3 .square2-start a {
  background-image: url('../img/icons/arrow_right_white.svg');
}
.block-field-blocknodestartseitefield-news-termin-download-1 .square2-start .node--view-mode-teaser,
.block-field-blocknodestartseitefield-news-termin-oder-download- .square2-start .node--view-mode-teaser,
.block-field-blocknodestartseitefield-termin-oder-download-3 .square2-start .node--view-mode-teaser {
  padding-bottom: 0;
  padding: 1.25em;
}
.block-field-blocknodestartseitefield-news-termin-download-1 termin,
.block-field-blocknodestartseitefield-news-termin-oder-download- termin,
.block-field-blocknodestartseitefield-termin-oder-download-3 termin
{
  background-image: url('../img/icons/koeln_termin_white.svg');
  background-position: calc(100% - 0.25em) calc(100% - 0.25em);
  background-repeat: no-repeat;
  background-size: 5.2em;
}
/*.block-field-blocknodestartseitefield-news-termin-download-1 downlad,
.block-field-blocknodestartseitefield-news-termin-oder-download- downlad,
.block-field-blocknodestartseitefield-termin-oder-download-3 downlad
{
  background-image: url('../img/icons/koeln_bericht_white.svg');
  background-position: calc(100% - 0.25em) calc(100% - 0.25em);
  background-repeat: no-repeat;
  background-size: 5.2em;
}*/
.block-field-blocknodestartseitefield-news-termin-download-1 downlad:after,
.block-field-blocknodestartseitefield-news-termin-oder-download- downlad:after,
.block-field-blocknodestartseitefield-termin-oder-download-3 downlad:after
{
  content: url('../img/icons/koeln_bericht_white.svg');
  display: block;
  width: 5.2em;
  position: absolute;
  bottom: 10px;
  right: 10px;
  transition: width 0.1s;
}
.block-field-blocknodestartseitefield-news-termin-download-1 downlad:hover:after,
.block-field-blocknodestartseitefield-news-termin-oder-download- downlad:hover:after,
.block-field-blocknodestartseitefield-termin-oder-download-3 downlad:hover:after
{
  width: 6em;
  transition: width 0.3s;
}
.field--name-field-termin-oder-download-3,
.field--name-field-news-termin-download-1,
.field--name-field-news-termin-oder-download-
{
  margin-bottom: 0;
  height: 100%;
}
.square2-start .node--type-news a {
  margin-bottom: 1.5em;
}
.square2-start .node--type-kategorie-teaser-flexible {
  padding-top: 1.25em;
}
.square2-start .field--name-field-kategorie-teaser-flex {
  font-size: 1em !important;
}
.field--name-field-download-file a {
  color: transparent !important;
}
.square2-start .node--type-downlad {
  height: 100%;
  width: 100%;
  display: flex;
  flex-direction: column;
  padding: 0;
}
.square2-start .node--type-downlad h2 {
  font-size: 1.5em;
}
.square2-start .node--type-downlad .node__content,
.square2-start .node--type-downlad .node__content div{
  height: 100%;
  width: 100%;
}
.square2-start .node--type-downlad .field--name-field-media-file {
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}
.square2-start .node--type-downlad .field--name-field-media-file  a{
  height: 100%;
  display: block;
  width: 100%;
  background-image: none;
  border-radius: 0;
  color: black;
  text-indent: 0;
  position: relative;
  z-index: 10;
}
.square2-start .node--type-downlad .field--name-field-media-file  a:after {
  content: url('../img/icons/koeln_download_white.svg');
  display: block;
  width: 2.25em;
  position: absolute;
  bottom: 1.75em;
  left: 1.75em;
  margin-bottom: -5px;
}
.square2-start .node--type-downlad .field--name-field-media-file a:hover{
  animation: none;
}
.square2-start .node--type-downlad .field--name-field {
  z-index:0;
}
.square2-start .node--type-downlad .field--name-field-datei-beschreibung{
  z-index: 0;
  margin-top: 0;
  margin-left: 0;
}
.field--name-field-download-file .contextual
{
  height: 20px !important;
  width: 10px;
}
.square2-start .kat1-bg a,
.square2-start .kat6-bg a {
  background-image: url('../img/icons/arrow_right_white.svg');
}
.square2-start img {
  width: 3em;
  visibility: hidden;
}
.square2-start a:hover {
  animation-name: verschiebenNewsLinkStart;
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
  animation-duration: 300ms;
}
.square3flex a {
  display: block;
  width: 100%;
  height: 100%;
  background-image: url('../img/icons/arrow_right.svg');
  background-size: 4em;
  background-position: left 92%;
  background-repeat: no-repeat;
}
.square3flex .kat1-bg a,
.square3flex .kat6-bg a {
  background-image: url('../img/icons/arrow_right.svg');
}
.square3flex img {
  visibility: hidden;
}
.square3flex a:hover {
  animation-name: verschiebenNewsLinkStart;
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
  animation-duration: 300ms;
}

.square2-start .field--name-field-newsteaser-oder-termin-ein,
.square2-start .field--name-field-newsteaser-oder-termin-2,
.square2-start .field--name-field-newskachel-1,
.square2-start .field--name-field-newskachel-2

 {
   background-color: #F3F1F0;
   color: black;
 }
.block-field-blocknodestartseitefield-news-termin-download-1,
.block-field-blocknodestartseitefield-news-termin-oder-download- ,
.block-field-blocknodestartseitefield-termin-oder-download-3{
  background-color: black;
  color: white;
}


.square2-start .field--name-field-newsteaser-oder-termin-ein,
.square2-start .field--name-field-news-termin-download-1,
.square2-start .field--name-field-newsteaser-oder-termin-2,
.square2-start .field--name-field-news-termin-oder-download-,
.square2-start .field--name-field-newskachel-1

{
  height: 100%;
  margin: 0 !important;
}
.square2-start .field--name-field-newsteaser-oder-termin-ein h2,
.square2-start .field--name-field-news-termin-download-1 h2,
.square2-start .field--name-field-newsteaser-oder-termin-2 h2,
.square2-start .field--name-field-news-termin-oder-download- h2
 {
  font-size: 2.75em;
  text-align: left;
}
.square2-start .node--type-news,
.square2-start .node--type-kategorie-teaser-flexible{
  height: 100%;
  display: flex;
  flex-direction: column;
}
.square2-start .node--type-news div.node__content,
.square2-start .node--type-fakten-kachel-startseite .node__content,
.square2-start .node--type-kategorie-teaser-flexible .node__content
{
  height: 100%;
  flex-grow: 1;
  display: flex;
  flex-direction: column;
}
.square2-start .node--view-mode-teaser{
  border: none;
  margin: 0;
}
.wrapper-vision-rueckblick-ansatz {
  display: flex !important;
}

.wrapper-vision-rueckblick-ansatz .title {
  font-size: 1.75rem;
}
.square3-startteaser {
  padding:1em;
  color:white;
  background-color: black;
  position:relative;
  width:33.33%;
  flex-basis:33.33%;
  max-width: 33.33%;
  border: 1px solid white;

}
.square3-startteaser:before {
  content:"";
  display:block;
  padding-top:100%;
}
.square3-startteaser a{
  color: white !important;
  display: block;
  width: 100%;
  height: 100%;
  background-image: url('../img/icons/arrow_right_white.svg');
  background-size: 2.5em;
  background-position: 1.25em 92%;
  background-repeat: no-repeat;
  padding: 1.25em;
}
.square3-startteaser a:hover {
  color: white;
  text-decoration: none;
  animation-name: verschiebenNewsLinkStart;
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
  animation-duration: 300ms;
}
@keyframes verschiebenNewsLinkStart {
  to {
    background-position: 2em 92%;
  }
}
.rueckblick {
  background-image:url('../img/icons/koeln_ruckblick_white.svg');
  background-size: 5em;
  background-position: 92% 92%;
  background-repeat: no-repeat;
}
.vision {
  background-image:url('../img/icons/koeln_vision_white.svg');
  background-size: 5em;
  background-position: 92% 92%;
  background-repeat: no-repeat;
}
.ansatz {
  background-image:url('../img/icons/koeln_mission_white.svg');
  background-size: 5em;
  background-position: 92% 92%;
  background-repeat: no-repeat;
}
.square2-start .field--name-field-zahl-fakten-kachel,
.square2-start .field--name-field-zahlenwert {
  font-size: 8em;
  line-height: 1.25em;
}
.block-field-blocknodestartseitefield-zwischentext {
  background-image:url('../img/layout_images/bg_bild_zitat_home.jpg');
  background-repeat: no-repeat;
  width: 100%;
  height: 576px;
  background-size: cover;
  padding: 0 10.5em;
  color: white;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
}
.block-field-blocknodestartseitefield-zwischentext h3 {
  font-size: 2.5em;
}
.block-field-blocknodestartseitefield-zwischentext p {
  font-size: 1.25em;
  padding-top: 1.75em;
}



/** ANIMATEDBLOCK **/
#block-animatedblock {
  width: 100%;
}
#edit-actions {
  margin-bottom: 0 !important;
  padding-top: 0.25em;
}
#block-innok-search {
  flex-grow: 0;
}
#block-innok-search .js-form-type-search {
  margin-bottom: 0 !important;
  padding-top: 0.25em;
}
img {
  max-width: 100%;
  height: auto;
}

.layout--threecol-section {
  clear: left;
}

/** Navi */

.navbar {padding-bottom:0 !important;}

.navbar-toggler-icon{
  background-image: url("../img/icons/burger_menu_white.svg") !important;
  width: 2.5em !important;
  height: 2em !important;
}
.navbar-collapse {
  padding-bottom: 3em;
}
.navbar-collapse .nav {
  display:block !important;
}
.navbar-collapse .nav-link {
  color: white;
}
#block-projektkategorien-menu,
#block-dieinitiative-menu {
  font-size: 1.2em;
  color: white;
  padding-left: 0.8em;
  padding-bottom: 1.2em;
}

.menu--footer .flex-row {
  -ms-flex-direction: column !important;
  flex-direction: column !important;
}

#block-innok-account-menu .nav-link {
  padding: 0;
}
.nav-link.nav-link--user-logout {
  padding-left: 1em !important;
}

#block-projektkategorien2 {
  padding-top: 0.7em;
}

.navbar-brand {
  padding-bottom: 0 !important;
  color:white;
  flex-grow: 1;
  min-height: 70px;
}
.navbar-brand img {
  width: 150px;
  height: auto;
}

#block-projektkategorien .nav-link,
#block-projektkategorien2 .nav-link {
  background-repeat: no-repeat;
  background-position: left 45%;
  padding-left: 1.2em !important;
  background-size: 10px;
}
.menu--projektkategorien .nav-link--alle-projekte-im-ueberblick {
  background-image: url("../img/navi-kacheln/alleprojekte-menu.png")
}
.menu--projektkategorien .nav-link--archiv {
  background-image: url("../img/navi-kacheln/archiv-menu.png");
}
.menu--projektkategorien .nav-link--formularwerkstaetten {
  background-image: url("../img/navi-kacheln/formularwerkstaetten-menu.png");
}
.menu--projektkategorien .nav-link--neue-arbeitswelten {
  background-image: url("../img/navi-kacheln/neuearbeitswelten-menu.png");
}
.menu--projektkategorien-2 .nav-link--veraenderungswerkstaetten {
  background-image: url("../img/navi-kacheln/veraenderungswerkstaetten-menu.png");
}
.menu--projektkategorien-2 .nav-link--netzwerke-veranstaltungen {
  background-image: url("../img/navi-kacheln/netzwerke-menu.png");
}
.menu--projektkategorien-2 .nav-link--kommunikation-kooperation-und-koproduktion {
  background-image: url("../img/navi-kacheln/Kommunikation_Kooperation_Koproduktion_navi_rot.png");
}
.menu--projektkategorien-2 .nav-link--kooperationen-mit-hochschulen {
  background-image: url("../img/navi-kacheln/kooperationen-menu.png");
}

/** BREADCRUMP **/

.node--type-news .breadcrumb-item.active,
.node--type-projekt .breadcrumb-item.active {
  padding-top: 2px;
}

.breadcrumb {
  background-color: transparent !important;
}
.breadcrumb a {
  color: black;
  font-size: 1.1em;
}
.breadcrumb-item.active {
  color: black !important;
}
.breadcrumb a:hover{
  color: black;
}
.breadcrumb-item::before{
  color: black !important;
}

/** kat1-bg weisse schrift **/
.kat1-bg .breadcrumb a {
  color: white;
  font-size: 1.1em;
}
.kat1-bg .breadcrumb-item.active {
  color: white !important;
}
.kat1-bg .breadcrumb a:hover{
  color: white;
}
.kat1-bg .breadcrumb-item::before{
  color: white !important;
}
/** kat6-bg weisse schrift **/
.kat6-bg .breadcrumb a {
  color: white;
  font-size: 1.1em;
}
.kat6-bg .breadcrumb-item.active {
  color: white !important;
}
.kat6-bg .breadcrumb a:hover{
  color: white;
}
.kat6-bg .breadcrumb-item::before{
  color: white !important;
}

.hr-line hr {
  margin:0;
  padding: 0;
  border:0;
  height:1px;
  background-color: black;
}
.kat1-bg .hr-line hr {
  background-color: white;
}
.kat6-bg .hr-line hr {
  background-color: white;
}

.field--name-field-titel h1 {
  font-size: 2.5em;
  margin-top: -0.5em;
  margin-bottom: 0;
  padding-bottom: 0.5em;
}

#block-anzahlprojektenachstatus {
  display: none;
}
/** ALLE KATEGORIEN PROJEKT DETAIL SEITEN + STARTSEITE **/
.path-frontpage .alle-kategorien.square8.katBlack-bg {
  display: none;
}

.path-frontpage .square8 {
  max-width:14.25%;
  width:14.25%;
}
.kat-wrapper {
  display: flex;
  max-width: 100%;
  flex-wrap:wrap;
  justify-content: space-between;
}
.block.block-katblock.block-kat-mit-value-block .kat-wrapper h3 {
  font-size: 1em;
  font-weight: bold;
}
#block-allekategoriencontentbottom {
  width: 100%;
}
.row {
  margin-right: 0px !important;
  margin-left: 0px !important;
}
/** 7 Kacheln nebeneinander **/
.square {
  border: 1px solid white;
  padding:0.7em;
  flex-grow:1;
  color:white;
  flex-basis:14.2%;
  max-width:14.2%;   /* 100/7 */
  width: 14.2%;
  background-color: white;
  position:relative;
}
.square:before {
  content:"";
  display:block;
  padding-top:100%;
}
.square .squareContent {
  padding-left: 1.2em;
  padding-right: 1.2em;
}
/** 8 Kacheln nebeneinander **/
.square8 {
  border: 1px solid white;
  padding:0.7em;
  flex-grow:1;
  color:white;
  background-color: white;
  flex-basis:12.45%;
  max-width:12.45%;
  width:12.45%;
  position:relative;
}
.square8:before {
  content:"";
  display:block;
  padding-top:100%;
}
/** Inhaltsbereich fuer alle Kacheln **/
.squareContent {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  padding: 0.5em;
  padding-bottom:0.25em;
  display:flex;
  flex-direction:column;
  justify-content: space-between;
}
/** Link in den 7er Kacheln **/
.kat-link {
  margin-bottom:0.2em;
  flex-grow:0;
}
/** Link in den 8er Kacheln volle Weite **/
.katLink {
  margin-bottom:1.2em;
  margin-left: 0.75em;
  flex-grow:0;
}
.kat {
  height: 2em;
  flex-grow:1;
}
.arrow1 {
  width: 1.2em;
  height: auto;
}
.count {
  font-size: 2.2em;
  color:white;
}

/** STATUSBLOCK **/
.status-wrapper {
  display: flex;
  max-width:100%;
  flex-wrap:wrap;
  justify-content: space-between;
}
.wrapperStatusBlock {
  background-color: black;
  border: 1px solid white;
  color: white;
  flex-grow: 1;
  flex-basis:25%;
  max-width:25%;
  width: 25%;
  position:relative;
}
.wrapperStatusBlock:before {
  content:"";
  display:block;
  padding-top:100%;
}
.countStat {
  font-size: 6.75vw;
  color:white;
  padding-top: 0.2em;
}
.pad75 {
  padding-left: 7.5%;
}
.wrapperStatusBlock h3 {
  font-weight: bold;
  font-size: 1.2em;
  margin-top: -2.3em;
}
/** kleine bunte Kacheln **/
.mini-kat-wrapper{
  text-align:center;
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-around;
  margin-top: 2.5em;
  padding-bottom:1.25em;
}
.mini-kat-block {
  width: 7%;
  height:0;
  padding-bottom:7%;
  position: relative;
}
.mini-kat-blockOhne {
  width: 1em;
  height:0;
  padding-bottom:1em;
  position: relative;
  display: none;
}
.mini-kat-block-pf {
  display: none;
  width: 2.5em;
  height:auto;
  font-weight: bold;
  position: relative;
}
.mini-kat-block-pf img{
  padding-bottom:1em;
  width: 99.5%;
}

/** NEWSUEBERSICHT **/
#block-headernewsuebersicht {
  background-image: url("../img/layout_images/header_news_aktuelles.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  display: block;
  width: 100%;
  height: 40vw;
  margin-bottom: 3em;
}
/**
#block-headernewsuebersicht h1{
  color: white;
  font-size: 1.75vw;
  padding-top: 1em;
}
 */
.square3-news {
  padding:1em;
  color:black;
  background-color: #827D73;
  position:relative;
  width:33.33%;
  flex-basis:33.33%;
  max-width: 33.33%;
  border: 1px solid white;
}
.square3-news:before {
  content:"";
  display:block;
  padding-top:100%;
}
.square3-news .squareContent,
.node--type-page .square3 .squareContent {
  padding: 1.5em;
  padding-top: 1.6em;
}
.square3-news .squareContent .views-field-title a{
  display: block;
  width: 100%;
  height: 90%;
  color: black !important;
  font-size: 1.5em;
  hyphens: auto;
  background-image: url('../img/icons/arrow_right_thick.svg');
  background-size: 1em;
  background-position: left bottom;
  background-repeat: no-repeat;
  padding-top: 0.25em;
  z-index: 10;
  position: relative;
}
.square3-news .squareContent .views-field-field-teasertext {
  margin-top: -75%;
  z-index:0;
  hyphens: auto;
}
.square3-news .squareContent .views-row {
  heighT: 100%;
}
.square3-news .squareContent .views-field-title {
  height: 100%;
}
.square3-news .squareContent .views-field-title a:active{
  color: black !important;
  text-decoration: none;
}
.square3-news .squareContent .views-field-title a:hover{
  color: black !important;
  text-decoration: none;
  animation-name: verschiebenNewsLink;
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
  animation-duration: 200ms;
}
@keyframes verschiebenNewsLink {
  to {
    background-position: 1em bottom;
  }
}


.views-display-switch__link--news-liste {
  background-image: url("../img/icons/koeln_listenansicht_white.svg");
  background-repeat: no-repeat;
}
.views-display-switch__link--news-kachel {
  background-image: url("../img/icons/koeln_kachelansicht_white.svg");
  background-repeat: no-repeat;
}
/* Listenansicht*/
.view-display-id-news_liste table a {
  color: black;
  display: block;
  height: 100%;
  padding: 1.75em;
  font-size: 1.25em;
  padding-top: 1.25em;
}

.view-display-id-news_liste thead tr {
  background-color: black;
  color: white;
}
.view-display-id-news_liste thead th {
  padding-left: 1.98em;
  font-size: 1.1em;
}

.view-display-id-news_liste tbody tr {
  background-color: #ECECEC !important;
}


 /* Newskacheln unten */
#taxonomy-term-17 .layout__region,
.node--type-startseite .layout--threecol-section .layout__region {
  flex: 0 1 33.33% ;  /*ist sonst ungleich Rest*/
}
#taxonomy-term-17 .layout--threecol-section .square3-news {
  width: 100%;
  min-width: 100%;
  background-color: black;
  color: white;
}

/** PAGE **/
.square2-start news.node--view-mode-teaser{
  padding-bottom: 0 !important;
}
.node--type-page .node--type-termin,
.node--type-page .node--type-news{
  border: 0;
}
.node--type-page .square3 .node__content {
  font-size:0.85em;
}
.node--type-page .block-field-blocknodepagefield-text-1,
.node--type-page .block-field-blocknodepagefield-text-2 {
  margin-bottom: 3em;
}
.node--type-page .field--name-field-newsteaser-einbetten {
  padding: 0;
  margin-bottom: 0em !important;
  margin-right: -1em;
}
.node--type-page .field--name-field-media-1 img,
.node--type-page .field--name-field-media-1 video,
.node--type-page .field--name-field-media-2 img,
.node--type-page .field--name-field-media-2 video
{
  margin-bottom: 3em;
}

/** NEWS **/
.block-field-blocknodenewstitle .field--name-title {
  font-size: 2.5em;
  margin-top: -0.5em;
}
.node--type-news .field--name-field-teasertext {
  padding-bottom: 2em;
}
.node--type-page .node--type-news .field--name-field-teasertext {
  padding-top: 0;
  padding-bottom: 0;
  flex-grow: 0;
}
.node--type-news .block-field-blocknodenewsfield-newstext{
  padding-top: 3em;
  padding-bottom: 3em;
}
.node--type-page news a {
  flex-grow: 1;
  background-image: url('../img/icons/arrow_right_thick_white.svg');
  background-size: 2.5em;
  background-position: left bottom;
  background-repeat: no-repeat;
}
.node--type-news #content {
  margin-top: -50%;
}
.node--type-news .nav-tabs{
  background-color: white;
}
.node--type-news p {
  hyphens: auto;
}
.field--name-field-newsmedia-1 .field--name-field-media-image  {
  margin-right: 0px !important;
  width: 100%;
}
.node--type-news .field--type-image  img{
  margin-bottom: 3em;
}
.node--type-news .field--name-field-newstext {
  margin-bottom: 3em;
}
.node--type-news .field--name-field-newstext-2 {
  margin-bottom: 3em;
}
.field--name-field-newsmedia-2 {
  margin-bottom: 3em;
}
.node--type-news .breadcrumb {
  padding-top: 2.5em;
  margin-left: -0.75em;
}
.block-field-blocknodenewsfield-art-des-inhalts {
  display: none;
}
.block-field-blocknodenewsfield-teasertext {
  padding-bottom: 2em;
}
/** Downloadlinks im Text **/
/** NEWS FILE DOWNLOAD */
.block.block-layout-builder.block-field-blocknodenewsfield-download {
  clear: left;
}
.file-download {
  background-image: url('../img/icons/koeln_download.svg');
  background-size: 100px;
  background-repeat: no-repeat;
  background-position: center;
  border-radius: 50%;
  background-clip: border-box;
  transition: background-size 0.2s;
  transition-timing-function: cubic-bezier(.07,1.41,.82,1.41);

  display: block;
  width: 100px;
  height: 100px;
  text-decoration: none;
  cursor: pointer;
  overflow: visible;
  text-indent: 100%;
  white-space: nowrap;
}

.field--name-field-datei-beschreibung {
  margin-left: 100px;
  margin-top: -140px;
  hyphens: auto;
  /* overflow: visible; */
}

.field--name-field-download .field__item {
  margin-bottom: 70px;
}
.node--type-news .field--name-field-download .field--name-field-media-file a {
  color: black !important;
}
.node--type-news .field--name-field-download .field--name-field-media-file a:hover {
  color: black !important;
  text-decoration: underline;
}

/** 3er Block unten **/
.node--type-news .layout__region,
.node--type-page .layout__region{
  flex: 0 1 33.33%;  /*ist sonst 33 33 34 und somit ungleiche Kacheln*/
}
.square3.gr .squareContent {
  background-image: url('../img/icons/koeln_news.svg');
  background-position: calc(100% - 0.25em) calc(100% - 0.25em);
  background-repeat: no-repeat;
  background-size: 5.2em;

}
.square3 {
  padding:0.7em;
  color:white;
  background-color: black;
  position:relative;
  width:100%;
  border: 1px solid white;
}
.square3.gr {
  color:black;
  background-color: #827D73;
}

.square3:before {
  content:"";
  display:block;
  padding-top:100%;
}
.square3 h2 {
  padding-top:0.75em;
  padding-left: 0.75em;
}
.square3 .icon-link{
  padding-left:0.75em;
}
.square3.gr:hover .squareContent{
  text-decoration: none;
  animation-duration: 300ms;
  animation-name: vergroessern;
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
}
@keyframes vergroessern {
  to {
    background-size: 7em;
  }
}
.square3:hover .flexH {
  margin-top: 1em;
}
.node--type-news .square3 .node__content {
  font-size:0.75em;
}
/** Termin**/
.node--type-news .square3 .field--name-field-termin-einbetten,
.square3-news .field--name-field-termin-einbetten{
  padding-top:0.5em;
  padding-left: 1em;
  padding-right: 1em;
  margin-bottom: 0.5em !important;
}
.block-field-blocknodenewsfield-termin-einbetten .squareContent,
.block-field-blocktaxonomy-termtaggingfield-termin-einbetten .squareContent,
.block-field-blocktaxonomy-termtaggingfield-termin-einbetten-1 .squareContent,
.block-field-blocktaxonomy-termtaggingfield-termin-einbetten-2 .squareContent,
.block-field-blocktaxonomy-termtaggingfield-termin-einbetten-3 .squareContent,
.block-field-blocknodepagefield-newsteaser-einbetten .squareContent .field--name-field-newsteaser-einbetten termin
{
  background-image: url('../img/icons/koeln_termin_white.svg');
  background-position: calc(100% - 0.25em) calc(100% - 0.25em);
  background-repeat: no-repeat;
  background-size: 5.2em;
}
.block-field-blocknodepagefield-newsteaser-einbetten .squareContent .field--name-field-newsteaser-einbetten termin {
  background-position: calc(100% - 0.25em) bottom;
}
.block-field-blocknodepagefield-newsteaser-einbetten .squareContent .field--name-field-newsteaser-einbetten news {
  background-image: url('../img/icons/koeln_news_white.svg');
  background-position: calc(100% - 0.25em) calc(100% - 0.25em);
  background-repeat: no-repeat;
  background-size: 4.5em;
}
.node--type-news .block-field-blocknodenewsfield-termin-einbetten .content,
.block-field-blocktaxonomy-termtaggingfield-termin-einbetten .content,
.block-field-blocktaxonomy-termtaggingfield-termin-einbetten-1 .content,
.block-field-blocktaxonomy-termtaggingfield-termin-einbetten-2 .content,
.block-field-blocktaxonomy-termtaggingfield-termin-einbetten-3 .content,
.block-field-blocknodepagefield-newsteaser-einbetten .content,
.node--type-page news.node--view-mode-teaser
{
  height: 100%;
  display: flex;
  flex-direction: column;
  margin-bottom: 2.5em !important;
}
.node--type-page news.node--view-mode-teaser
{
  height: calc(100% + 1.2em);
}


.block-field-blocknodepagefield-newsteaser-einbetten .content
{
  height: 100%;
  display: flex;
  flex-direction: column;
  margin-bottom: 0 !important;
}
.node--type-news .block-field-blocknodenewsfield-termin-einbetten .content div,
.block-field-blocktaxonomy-termtaggingfield-termin-einbetten .content div,
.block-field-blocktaxonomy-termtaggingfield-termin-einbetten-1 .content div,
.block-field-blocktaxonomy-termtaggingfield-termin-einbetten-2 .content div,
.block-field-blocktaxonomy-termtaggingfield-termin-einbetten-3 .content div,
.block-field-blocknodepagefield-newsteaser-einbetten .content div
{
  flex-grow: 0;
}
.node--type-news .block-field-blocknodenewsfield-termin-einbetten .content div:last-child
.block-field-blocktaxonomy-termtaggingfield-termin-einbetten .content div:last-child,
.block-field-blocktaxonomy-termtaggingfield-termin-einbetten-1 .content div:last-child,
.block-field-blocktaxonomy-termtaggingfield-termin-einbetten-2 .content div:last-child,
.block-field-blocktaxonomy-termtaggingfield-termin-einbetten-3 .content div:last-child,
.block-field-blocknodepagefield-newsteaser-einbetten .content div:last-child
{
  flex-grow: 1;
}
.node--type-termin {
  height: 100%;
  display: flex;
  flex-direction: column;
}
.node--type-termin header {
  flex-grow:0;
}
.squareContent .node--type-termin div,
.node--type-page news div {
  flex-grow: 1;
  display: flex;
  flex-direction: column;
}
.node--type-termin h2 {
  padding-left: 0 !important;
  padding-top: 0.5em !important;
  font-size: 1.5em;
}
.node--type-news .square3 .field--name-field-ort,
.node--type-page .square3 .field--name-field-ort,
.square3-news .field--name-field-ort
{
  padding-top: 1.25em;
}
.node--type-news .square3 .field--name-field-datum-einfach,
.node--type-page .square3 .field--name-field-datum-einfach,
.node--type-news .square3 .field--name-field-datum,
.node--type-page .square3 .field--name-field-datum,
.node--type-page .square3 .field--name-field-uhrzeit,
.node--type-news .square3 .field--name-field-uhrzeit,
.square3-news .field--name-field-datum-einfach,
.square3-news .field--name-field-datum,
.square2-start .field--name-field-datum-einfach,
.square2-start .field--name-field-datum,
.square2-start .field--name-field-uhrzeit,
.squareContent .field--name-field-datum-einfach,
.squareContent .field--name-field-datum,
.squareContent .field--name-field-datum-einfach,
.squareContent .field--name-field-datum,
.squareContent .field--name-field-uhrzeit
{
  display: flex !important;
  flex-direction: row !important;
  text-align: left;
}
.squareContent .field--name-field-datum-einfach .field__label:first-of-type,
.squareContent .field--name-field-datum .field__label:first-of-type,
.squareContent .field--name-field-uhrzeit .field__label:first-of-type {
  flex-grow: 0 !important;
}
.squareContent .field--name-field-datum-einfach .field__item,
.squareContent .field--name-field-datum .field__item,
.squareContent .field--name-field-uhrzeit .field__item {
  display: flex !important;
  flex-direction: row !important;
  text-align: left;
}
.node--type-news .square3 .field--name-field-uhrzeit ,
.node--type-page .square3 .field--name-field-uhrzeit ,
.square3-news .field--name-field-uhrzeit
{
  display: flex;
  flex-direction: row;
}
.squareContent .node--view-mode-teaser {
  border: 0 !important;
}
.node--type-news .square3  .field--name-field-externer-link-termin ,
.node--type-page .square3  .field--name-field-externer-link-termin ,
.square3-news .field--name-field-externer-link-termin
{
  padding-top: 1em;
}
.node--type-news .square3  .field--name-field-externer-link-termin img ,
.node--type-page .square3  .field--name-field-externer-link-termin img ,
.square3-news .field--name-field-externer-link-termin img
{
  width: 3em;
  height: auto;
}
.node--type-news .square3  .field--name-field-externer-link-termin:hover,
.node--type-page .square3  .field--name-field-externer-link-termin:hover,
.square3-news  .field--name-field-externer-link-termin:hover img,
.node--type-page news a:hover
{
  animation-duration: 200ms;
  animation-name: verschiebenNews;
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
}
@keyframes verschiebenNews {
  to {
    padding-left: 1.5em;
  }
}
.node--type-news .square3:hover .squareContent,
.node--type-page .square3:hover .squareContent,
.square3-news:hover .squareContent,
.node--type-page .square3:hover .squareContent .field--name-field-newsteaser-einbetten termin
{
  animation-duration: 300ms;
  animation-name: vergroessern;
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
}
.node--type-page .square3:hover .squareContent .field--name-field-newsteaser-einbetten news,
.square2-start termin:hover,
.square2-start downlad:hover
{
  animation-duration: 300ms;
  animation-name: vergroessernNews;
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
}
@keyframes vergroessernNews {
  to {
    background-size: 6em;
  }
}
/** Downloads **/
/*.node--type-news .square3 .field--name-field-download-einbetten ,
.square3-news .field--name-field-download-einbetten,
.square3-news .field--name-field-download-einbetten-1,
.square3-news .field--name-field-download-einbetten-2,
.square3-news .field--name-field-download-einbetten-3,
.square3 .block-field-blocknodepagefield-download-einbetten-1,
.square3 .block-field-blocknodepagefield-download-einbetten-2
{
  padding-top:0.5em;
  padding-left: 1em;
  padding-right: 1em;
}*/
.block-field-blocknodenewsfield-newsmedia-1
{
  margin-top: -1.25em;
}
.faqfield-question.ui-accordion-header.ui-corner-top.ui-state-default.ui-accordion-icons.ui-accordion-header-active.ui-state-active {
  border-color: black;
}
/** Downloadkachel **/
/*.block-field-blocknodenewsfield-download-einbetten .squareContent,
.block-field-blocktaxonomy-termtaggingfield-download-einbetten .squareContent,
.block-field-blocktaxonomy-termtaggingfield-download-einbetten-1 .squareContent,
.block-field-blocktaxonomy-termtaggingfield-download-einbetten-2 .squareContent,
.block-field-blocktaxonomy-termtaggingfield-download-einbetten-3 .squareContent,
.block-field-blocknodepagefield-download-einbetten-1 .squareContent,
.block-field-blocknodepagefield-download-einbetten-2 .squareContent,
.block-field-blocknodepagefield-download-einbetten3 .squareContent,
.block-field-blocknodepagefield-download-einbetten4 .squareContent,
.block-field-blocknodepagefield-download-einbetten5 .squareContent
{
  background-image: url('../img/icons/koeln_bericht_white.svg');
  background-position: calc(100% - 0.25em) calc(100% - 0.25em);
  background-repeat: no-repeat;
  background-size: 5.2em;
}*/
.block-field-blocknodenewsfield-download-einbetten .squareContent:after,
.block-field-blocktaxonomy-termtaggingfield-download-einbetten .squareContent:after,
.block-field-blocktaxonomy-termtaggingfield-download-einbetten-1 .squareContent:after,
.block-field-blocktaxonomy-termtaggingfield-download-einbetten-2 .squareContent:after,
.block-field-blocktaxonomy-termtaggingfield-download-einbetten-3 .squareContent:after,
.block-field-blocknodepagefield-download-einbetten-1 .squareContent:after,
.block-field-blocknodepagefield-download-einbetten-2 .squareContent:after,
.block-field-blocknodepagefield-download-einbetten3 .squareContent:after,
.block-field-blocknodepagefield-download-einbetten4 .squareContent:after,
.block-field-blocknodepagefield-download-einbetten5 .squareContent:after {
  content: url('../img/icons/koeln_bericht_white.svg');
  display: block;
  width: 5.2em;
  position: absolute;
  bottom: 10px;
  right: 10px;
  transition: width 0.1s;
}
.block-field-blocknodenewsfield-download-einbetten .squareContent:hover:after,
.block-field-blocktaxonomy-termtaggingfield-download-einbetten .squareContent:hover:after,
.block-field-blocktaxonomy-termtaggingfield-download-einbetten-1 .squareContent:hover:after,
.block-field-blocktaxonomy-termtaggingfield-download-einbetten-2 .squareContent:hover:after,
.block-field-blocktaxonomy-termtaggingfield-download-einbetten-3 .squareContent:hover:after,
.block-field-blocknodepagefield-download-einbetten-1 .squareContent:hover:after,
.block-field-blocknodepagefield-download-einbetten-2 .squareContent:hover:after,
.block-field-blocknodepagefield-download-einbetten3 .squareContent:hover:after,
.block-field-blocknodepagefield-download-einbetten4 .squareContent:hover:after,
.block-field-blocknodepagefield-download-einbetten5 .squareContent:hover:after {
  width: 6em;
  transition: width 0.3s;
}
.node--type-news .square3 .node__content ,
.square3-news .node__content
.square3-page .node__content
{
  font-size:0.75em;
}
.node--type-news .square3 .node--type-downlad .field--name-field-media-file ,
.square3-news .node--type-downlad .field--name-field-media-file,
.node--type-page .square3 .node--type-downlad .field--name-field-media-file
{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}
.node--type-news .square3 .field--name-field-datei-beschreibung ,
.square3-news .field--name-field-datei-beschreibung,
.node--type-page .square3 .field--name-field-datei-beschreibung
{
  padding-top: 0;
  margin-left: 0;
  margin-top: 0;
}
.block-field-blocknodenewsfield-download-einbetten .squareContent .content,
.block-field-blocktaxonomy-termtaggingfield-download-einbetten .squareContent .content,
.block-field-blocktaxonomy-termtaggingfield-download-einbetten-1 .squareContent .content,
.block-field-blocktaxonomy-termtaggingfield-download-einbetten-2 .squareContent .content,
.block-field-blocktaxonomy-termtaggingfield-download-einbetten-3 .squareContent .content,
.block-field-blocknodepagefield-download-einbetten-1 .squareContent .content,
.block-field-blocknodepagefield-download-einbetten-2 .squareContent .content,
.block-field-blocknodepagefield-download-einbetten3 .squareContent .content,
.block-field-blocknodepagefield-download-einbetten4 .squareContent .content,
.block-field-blocknodepagefield-download-einbetten5 .squareContent .content
{
  height: 100%;
  display: flex;
  flex-direction: column;
  margin-bottom: 0 !important;
  height: 100% !important;
}
.block-field-blocknodenewsfield-download-einbetten .squareContent .content .field--name-field-download-einbetten ,
.block-field-blocktaxonomy-termtaggingfield-download-einbetten .squareContent .content .field--name-field-download-einbetten,
.block-field-blocktaxonomy-termtaggingfield-download-einbetten-1 .squareContent .content .field--name-field-download-einbetten-1,
.block-field-blocktaxonomy-termtaggingfield-download-einbetten-2 .squareContent .content .field--name-field-download-einbetten-2,
.block-field-blocktaxonomy-termtaggingfield-download-einbetten-3 .squareContent .content .field--name-field-download-einbetten-3,
.block-field-blocknodepagefield-download-einbetten-1 .squareContent .content .field--name-field-download-einbetten-1,
.block-field-blocknodepagefield-download-einbetten-2 .squareContent .content .field--name-field-download-einbetten-2,
.block-field-blocknodepagefield-download-einbetten3 .squareContent .content .field--name-field-download-einbetten3,
.block-field-blocknodepagefield-download-einbetten4 .squareContent .content .field--name-field-download-einbetten4,
.block-field-blocknodepagefield-download-einbetten5 .squareContent .content .field--name-field-download-einbetten5
{
  display: flex;
  flex-direction: column;
  margin-bottom: 0 !important;
  height: 100% !important;
}
.node--type-news .node--type-downlad,
.node--type-page .node--type-downlad,
.square3-news .node--type-downlad
{
  height: 100%;
  display: flex;
  flex-direction: column;
}
.node--type-news .node--type-downlad header,
.node--type-page .node--type-downlad header,
.square3-news .node--type-downlad header
{
  flex-grow: 0;
}
.node--type-news .node--type-downlad div,
.node--type-page .node--type-downlad div,
.square3-news .node--type-downlad div
{
  flex-grow: 1;
}
.node--type-news .node--type-downlad .field--name-field-download-file,
.node--type-page .node--type-downlad .field--name-field-download-file,
.square3-news .node--type-downlad .field--name-field-download-file
{
  display: block;
  height: 100%;
}
.node--type-news .node--type-downlad .field--name-field-download-file div,
.node--type-page .node--type-downlad .field--name-field-download-file div,
.square3-news .node--type-downlad .field--name-field-download-file div
{
  display: block;
  height: 100%;
}

.node--type-news .node--type-downlad h2,
.node--type-page .node--type-downlad h2,
.node--type-page .node--type-news h2,
.square3-news .node--type-downlad h2
{
  padding-left: 0 !important;
  padding-top: 0.5em !important;
  font-size: 1.5em;
}
.node--type-news .node--type-downlad a,
.node--type-page .node--type-downlad a,
.square3-news .node--type-downlad a
{
  color: white;
  text-indent: 0;
  white-space: normal;
  border-radius: 0;
  width: 100%;
}
.node--type-news .node--type-downlad a:hover,
.node--type-page .node--type-downlad a:hover,
.square3-news .node--type-downlad a:hover
{
  color: white;
}
.node--type-news .node--type-downlad a:active,
.node--type-page .node--type-downlad a:active,
.square3-news .node--type-downlad a:active
{
  color: white;
  text-decoration: none;
}
.node--type-news .node--type-downlad .file-download,
.node--type-page .node--type-downlad .file-download,
.square3-news .node--type-downlad .file-download
{
  background-image: none;
  height: 100%;
  margin-left: 0 !important;
  margin-bottom:-1em;
  position: relative;
  z-index: 70;
}
.node--type-news .node--type-downlad .file-download:after,
.node--type-page .node--type-downlad .file-download:after,
.square3-news .node--type-downlad .file-download:after {
  content: url('../img/icons/koeln_download_white.svg');
  display: block;
  width: 2.25em;
  position: absolute;
  bottom: 1.75em;
  left: 1.75em;
  margin-bottom: -6px;
  font-size: 1.071rem;
}

/** ZurueckLink **/
.square3 .icon-link {
  padding-left: 1.75em;
  margin-bottom: 1em;
}
.square3 .icon-link .arrow1 {
 width: 3.5em;
}


/** KATEGORIEN **/

.page-taxonomy-term-1 #main-wrapper,
.page-taxonomy-term-6 #main-wrapper,
.page-taxonomy-term-12 #main-wrapper,
.page-taxonomy-term-13 #main-wrapper,
.page-taxonomy-term-15 #main-wrapper,
.page-taxonomy-term-14 #main-wrapper,
.page-taxonomy-term-5 #main-wrapper,
.page-taxonomy-term-17 #main-wrapper,
.node--type-startseite #main-wrapper,
.node--type-page #main-wrapper,
.node--type-news #main-wrapper,
.page-user-login #main-wrapper,
.page-user-1 #main-wrapper
{
  margin-bottom: 4em !important;
}
.page-user-login #main-wrapper,
.page-user-1 #main-wrapper{
  padding-top: 4em;
}
#block-headerkatdigitalisierung  {
  background-image: url("../img/layout_images/header_digitalisierung.jpg");
  background-repeat: no-repeat;
  display: block;
  background-size: cover;
  width: 100%;
  height: 40vw;
  margin-bottom: 3em;
}
#block-headerkatdigitalisierung .content,
#block-headerkatprozesse .content,
#block-headerkatorga .content,
#block-headerkatbuerger .content,
#block-headerkatmethoden .content,
#block-headerkatkommunikation .content,
#block-headerkatarbeitgeberin .content {

  padding-left: 0;
  padding-right: 0;
  padding-top: 7vw;
}

#block-headerkatdigitalisierung .field--name-field-anzahl-projekte,
#block-headerkatprozesse .field--name-field-anzahl-projekte,
#block-headerkatorga .field--name-field-anzahl-projekte,
#block-headerkatbuerger .field--name-field-anzahl-projekte,
#block-headerkatmethoden .field--name-field-anzahl-projekte,
#block-headerkatkommunikation .field--name-field-anzahl-projekte,
#block-headerkatarbeitgeberin .field--name-field-anzahl-projekte,
#block-headerblockzahlendatenfakten .field--name-field-anzahl-projekte {
  font-size: 8.75vw;
  color: white;
  padding-left: 10vw;
}
#block-headerkatdigitalisierung .field--name-field-header-text,
#block-headerkatprozesse .field--name-field-header-text,
#block-headerkatorga .field--name-field-header-text,
#block-headerkatbuerger .field--name-field-header-text,
#block-headerkatmethoden .field--name-field-header-text,
#block-headerkatkommunikation .field--name-field-header-text,
#block-headerkatarbeitgeberin .field--name-field-header-text {
  font-size: 1.75vw;
  color: white;
}
#block-headerblockzahlendatenfakten .field--name-field-anzahl-projekte
 {
  position: absolute;
  z-index: 99;
  padding-left: 10vw;
  padding-right: 10vw;
  top: 10%;
}

#block-headerkatprozesse {
  background-image: url("../img/layout_images/header_prozesse_strukturen.jpg");
  background-repeat: no-repeat;
  display: block;
  background-size: cover;
  width: 100%;
  height: 40vw;
  margin-bottom: 3em;
}

#block-headerkatorga {
  background-image: url("../img/layout_images/header_organisationsentwicklung.jpg");
  background-repeat: no-repeat;
  display: block;
  background-size: cover;
  width: 100%;
  height: 40vw;
  margin-bottom: 3em;
}

#block-headerkatbuerger {
  background-image: url("../img/layout_images/header_buergerservice.jpg");
  background-repeat: no-repeat;
  display: block;
  background-size: cover;
  width: 100%;
  height: 40vw;
  margin-bottom: 3em;
}

#block-headerkatmethoden {
  background-image: url("../img/layout_images/header_methoden_innovation.jpg");
  background-repeat: no-repeat;
  display: block;
  background-size: cover;
  width: 100%;
  height: 40vw;
  margin-bottom: 3em;
}

#block-headerkatkommunikation {
  background-image: url("../img/layout_images/header_kommunikation_kooperation_koproduktion.jpg");
  background-repeat: no-repeat;
  display: block;
  background-size: cover;
  width: 100%;
  height: 40vw;
  margin-bottom: 3em;
}

#block-headerkatarbeitgeberin {
  background-image: url("../img/layout_images/header_prozesse_attr_arbeitgeberin.jpg");
  display: block;
  background-size: cover;
  width: 100%;
  height: 40vw;
  margin-bottom: 3em;
}

.square4-view {
  padding:0.7em;
  color:black;
  background-color: #827D73;
  position:relative;
  width:25%;
  flex-basis:25%;
  max-width: 25%;
  border: 1px solid white;
}
.square4-view:before {
  content:"";
  display:block;
  padding-top:100%;
}
.square4-view .squareContent {
  padding: 0 !important;
  display: flex;
  flex-direction: column;
}
.square4-view .squareContent .views-row {
  flex-grow: 1;
}
.square4-view .squareContent .views-row .views-field-title {
  height: 100%;
}
.square4-view .squareContent .views-row .views-field-title a {
  height: 100%;
  display: block;
  padding-top: 1.2em;
  padding-left: 1.2em;
  padding-right: 1.2em;
  font-size: 1.5em;
  line-height: 1.25em;
  hyphens: auto !important;
  word-wrap: break-word;
}
.square4-view .squareContent .views-row .views-field-title a:after {
  content: url('../img/icons/arrow_right_thick.svg');
  width: 1.5em;
  display: block;
  position: absolute;
  bottom: 22px;
  left: 1.2em;
  transition: left 0.1s;
}
.square4-view .squareContent a {
  color: black;
}
.square4-view .squareContent a:after {
  content: url('../img/icons/arrow_right_thick.svg') !important;
}
.square4-view .squareContent a:active {
  color: black;
}
.square4-view .squareContent .kat1-bg a,
.square4-view .squareContent .kat6-bg  a {
  color: white;
}
.square4-view .squareContent .kat1-bg a:active,
.square4-view .squareContent .kat6-bg a:active {
  color: white;
}
.square4-view .squareContent .kat1-bg a:after,
.square4-view .squareContent .kat6-bg  a:after {
  content: url('../img/icons/arrow_right_thick_white.svg') !important;
}

.square4-view .squareContent .views-row .views-field-title a:hover {
  text-decoration: none;
}
.square4-view .squareContent .views-row .views-field-title a:hover:after {
  left: 2em;
  transition: left 0.2s;
}
.page-taxonomy-term-1 .field--name-description {
  font-size: 1.75em;
  padding-top: 1.75em;
  padding-bottom: 2em;
  hyphens: auto;
}

/** Listenansicht **/
.view-display-id-digitalisierung_liste table a,
.view-display-id-orga_liste table a {
  color: white;
  display: block;
  height: 100%;
  padding: 1.75em;
  font-size: 1.25em;
  padding-top: 1.25em;
}
.view-display-id-digitalisierung_liste table a:hover,
.view-display-id-orga_liste table a:hover,
.view-display-id-prozesse_strukturen_liste table a:hover,
.view-display-id-buergerservice_liste table a:hover,
.view-display-id-methoden_liste table a:hover,
.view-display-id-kommunikation_liste table a:hover,
.view-display-id-arbeitgeberin_liste table a:hover {
   color: black !important;
   text-decoration: none !important;
}
.view-display-id-digitalisierung_liste thead tr,
.view-display-id-orga_liste thead tr,
.view-display-id-prozesse_strukturen_liste thead tr,
.view-display-id-buergerservice_liste thead tr,
.view-display-id-methoden_liste thead tr,
.view-display-id-kommunikation_liste thead tr,
.view-display-id-arbeitgeberin_liste thead tr  {
  background-color: black;
  color: white;
}
.view-display-id-digitalisierung_liste thead th,
.view-display-id-orga_liste thead th,
.view-display-id-prozesse_strukturen_liste thead th,
.view-display-id-methoden_liste thead th,
.view-display-id-kommunikation_liste thead th,
.view-display-id-arbeitgeberin_liste thead th,
.view-display-id-news_liste  thead th{
  padding-left: 1.98em;
  font-size: 1.1em;
}
.view-display-id-digitalisierung_liste tbody tr {
  background-color: #071AFF !important;
}

.view-display-id-digitalisierung_liste tbody tr:hover a,
.view-display-id-orga_liste tbody tr:hover a,
.view-display-id-prozesse_strukturen_liste tbody tr:hover a,
.view-display-id-buergerservice_liste tbody tr:hover a,
.view-display-id-methoden_liste tbody tr:hover a,
.view-display-id-kommunikation_liste tbody tr:hover a,
.view-display-id-arbeitgeberin_liste tbody tr:hover a,
.view-display-id-news_liste tbody tr:hover a {
  color:black !important;
  display: block;
}
.view-display-id-digitalisierung_liste tbody tr:hover td,
.view-display-id-orga_liste tbody tr:hover td,
.view-display-id-prozesse_strukturen_liste tbody tr:hover td,
.view-display-id-buergerservice_liste tbody tr:hover td,
.view-display-id-methoden_liste tbody tr:hover td,
.view-display-id-kommunikation_liste tbody tr:hover td,
.view-display-id-arbeitgeberin_liste tbody tr:hover td,
.view-display-id-news_liste tbody tr:hover td{
  background-color: white;
}
.view-display-id-digitalisierung_liste tbody td,
.view-display-id-orga_liste tbody td,
.view-display-id-prozesse_strukturen_liste tbody td,
.view-display-id-buergerservice_liste tbody td,
.view-display-id-methoden_liste tbody td,
.view-display-id-kommunikation_liste tbody td,
.view-display-id-arbeitgeberin_liste tbody td,
.view-display-id-news_liste tbody td {
  padding:0;
}
.view-display-id-digitalisierung_liste .col,
.view-display-id-orga_liste .col,
.view-display-id-prozesse_strukturen_liste .col,
.view-display-id-buergerservice_liste .col,
.view-display-id-methoden_liste .col,
.view-display-id-kommunikation_liste .col,
.view-display-id-arbeitgeberin_liste .col,
.view-display-id-news_liste .col {
  padding: 0 !important;
}
.view-display-id-digitalisierung_liste table,
.view-display-id-orga_liste table,
.view-display-id-prozesse_strukturen_liste table,
.view-display-id-buergerservice_liste table,
.view-display-id-methoden_liste table,
.view-display-id-kommunikation_liste table,
.view-display-id-arbeitgeberin_liste table,
.view-display-id-news_liste table {
  margin-bottom:0;
  margin-top: 0 !important;
}



.view-display-id-prozesse_strukturen_liste table a,
.view-display-id-buergerservice_liste table a,
.view-display-id-methoden_liste table a,
.view-display-id-kommunikation_liste table a,
.view-display-id-arbeitgeberin_liste table a {
  color: black;
  display: block;
  height: 100%;
  padding: 1.75em;
  font-size: 1.25em;
  padding-top: 1.25em;
}
.view-display-id-prozesse_strukturen_liste tbody tr {
  background-color: #EF0000 !important;
  color:black !important;
}
.view-display-id-orga_liste tbody tr {
  background-color: #E94B8B !important;
}
.view-display-id-buergerservice_liste tbody tr {
  background-color: #FF6E19 !important;
  color: black !important;
}
.view-display-id-methoden_liste tbody tr {
  background-color: #973CC3 !important;
  color: black !important;
}
.view-display-id-kommunikation_liste tbody tr {
  background-color: #FFD200 !important;
  color: black !important;
}
.view-display-id-arbeitgeberin_liste tbody tr {
  background-color: #E62679 !important;
  color: black !important;
}

.views-display-switch__link {
  display: block;
  width: 25%;
  background-color: black;
  color: white !important;
  padding: 1em;
  padding-left: 3.5em;
  font-size: 1.1em;
}
.views-display-switch__link:hover {
  text-decoration: none;
}
/** Links zur Listen bzw Kachelansicht **/
.views-display-switch__link--prozesse-strukturen-liste {
  background-image: url("../img/icons/koeln_listenansicht_white.svg");
  background-repeat: no-repeat;
}
.views-display-switch__link--prozesse-strukturen-kacheln {
  background-image: url("../img/icons/koeln_kachelansicht_white.svg");
  background-repeat: no-repeat;
}
.views-display-switch__link--digitalisierung-liste {
  background-image: url("../img/icons/koeln_listenansicht_white.svg");
  background-repeat: no-repeat;
}
.views-display-switch__link--digitalisierung-kacheln {
  background-image: url("../img/icons/koeln_kachelansicht_white.svg");
  background-repeat: no-repeat;
}
.views-display-switch__link--orga-liste {
  background-image: url("../img/icons/koeln_listenansicht_white.svg");
  background-repeat: no-repeat;
}
.views-display-switch__link--orga-kacheln {
  background-image: url("../img/icons/koeln_kachelansicht_white.svg");
  background-repeat: no-repeat;
}
.views-display-switch__link--buergerservice-liste {
  background-image: url("../img/icons/koeln_listenansicht_white.svg");
  background-repeat: no-repeat;
}
.views-display-switch__link--buergerservice-kacheln {
  background-image: url("../img/icons/koeln_kachelansicht_white.svg");
  background-repeat: no-repeat;
}
.views-display-switch__link--methoden-liste {
  background-image: url("../img/icons/koeln_listenansicht_white.svg");
  background-repeat: no-repeat;
}
.views-display-switch__link--methoden-kacheln {
  background-image: url("../img/icons/koeln_kachelansicht_white.svg");
  background-repeat: no-repeat;
}
.views-display-switch__link--kommunikation-liste {
  background-image: url("../img/icons/koeln_listenansicht_white.svg");
  background-repeat: no-repeat;
}
.views-display-switch__link--kommunikation-kacheln {
  background-image: url("../img/icons/koeln_kachelansicht_white.svg");
  background-repeat: no-repeat;
}
.views-display-switch__link--arbeitgeberin-liste {
  background-image: url("../img/icons/koeln_listenansicht_white.svg");
  background-repeat: no-repeat;
}
.views-display-switch__link--arbeitgeberin-kacheln {
  background-image: url("../img/icons/koeln_kachelansicht_white.svg");
  background-repeat: no-repeat;
}


/** FAKTEN **/

#block-headerblockzahlendatenfakten,
#block-headerblockunseransatz,
#block-headerblockverwaltungsreform,
#block-headerunserevision,
#block-headerblockruckblick {
  position: relative;
}

#block-headerblockzahlendatenfakten video,
#block-headerblockunseransatz video,
#block-headerblockverwaltungsreform video,
#block-headerunserevision video,
#block-headerblockruckblick video {
  position: relative;
  top: 0;
  width: 100%;
  height:44vw;
  object-fit: cover;
}
.newsicon {
  height: 8vw;
  width: 8vw;
  background-image: url('../img/icons/koeln_news_white.svg');
  background-repeat: no-repeat;
  background-size: 8vw;
  margin: 1vw 0 3vw 0.3vw;
}
.headericon {
  width: 8vw;
  position: relative;
  margin-left:10vw;
  z-index: 99;
  padding: 3em 0 ;
}
.txt {
  position: relative;
  z-index: 99;
  color: white;
  padding: 0 10vw;
  margin-bottom: -50vw;
  font-size: 2.5vw;
}

.txt h1 {
  font-size: 2.5vw;
  margin-bottom: 4vw;
}
#block-headerblockzahlendatenfakten .headericon ,
#block-headerunserevision .headericon,
#block-headerblockruckblick .headericon,
#block-headerblockverwaltungsreform .headericon,
#block-headerblockunseransatz .headericon{
  position: absolute;
  top: 0;
}
#block-headerblockzahlendatenfakten .txt ,
#block-headerunserevision .txt,
#block-headerblockruckblick .txt,
#block-headerblockverwaltungsreform .txt,
#block-headerblockunseransatz .txt{
  position: absolute;
  top: 50%;
  transform: translate(0,-50%);
}
#block-headerblockzahlendatenfakten .txt h1,
#block-headerunserevision .txt h1,
#block-headerblockruckblick .txt h1,
#block-headerblockverwaltungsreform .txt h1,
#block-headerblockunseransatz .txt h1{
  margin-bottom: 1vw;
}
/**
#block-headerblockzahlendatenfakten .txt ,
#block-headerunserevision .txt,
#block-headerblockruckblick .txt,
#block-headerblockverwaltungsreform .txt,
#block-headerblockunseransatz .txt{
  font-size: 1.75vw;
}
*/
.node--type-fakten .container {
  min-width: 100%;
  width: 100%;
  margin-left: 0;
  margin-right: 0;
  padding-left:0px !important;
  padding-right:0px !important;
}
.block-field-blocknodefaktenfield-einleitungstext {
  max-width: 1140px;
  margin: auto;
  font-size: 1.5em;
  padding-bottom: 1em;
}
.node--type-fakten .block-system-breadcrumb-block {
  max-width: 1140px;
  margin: auto;
}
.node--type-fakten .tabs {
  max-width: 1140px;
  margin: auto;
}

.node--type-fakten #content {
  padding-left:0px !important;
  padding-right:0px !important;
}
.node--type-fakten .breadcrumb {
  padding-left: 0em !important;
  padding-top: 2em;
}
.node--type-fakten p {
  hyphens: auto;
}
/** 3er Kacheln groß **/
.square3flex {
  padding:0.7em;
  position:relative;
  border: 1px solid white;
}
.square3flex:before {
  content:"";
  display:block;
  padding-top:100%;
}
.square3flex .squareContent {
  padding:0 !important;
}
/** Pfeile in den großen 3erKacheln animieren **/
@keyframes verschiebenLink {
  from {
    margin-left: 0;
  }
  to {
   margin-left: 1.5em;
  }
}
.square3flex .squareContent .kat1-bg:hover .katlink,
.square3flex .squareContent .kat6-bg:hover .katlink,
.square3flex .squareContent .kat12-bg:hover .katlink,
.square3flex .squareContent .kat14-bg:hover .katlink,
.square3flex .squareContent .kat15-bg:hover .katlink,
.square3flex .squareContent .kat5-bg:hover .katlink,
.square3flex .squareContent .kat13-bg:hover .katlink {
  animation-duration: 200ms;
  animation-name: verschiebenLink;
  animation-fill-mode: forwards;
}
.square3flex .squareContent .kat1-bg,
.square3flex .squareContent .kat6-bg,
.square3flex .squareContent .kat13-bg,
.square3flex .squareContent .kat12-bg,
.square3flex .squareContent .kat14-bg,
.square3flex .squareContent .kat15-bg,
.square3flex .squareContent .kat5-bg{
  padding-left:2em !important;
  padding-right:2em !important;
  height: 100%;
  min-height: 100%;
  max-height: 100%;
}
/** Pfeile in weiss **/
.square3flex .squareContent .katlink img {
  width: 3em;
}
.square3flex .squareContent .kat1-bg .katlink img,
.square3flex .squareContent .kat6-bg .katlink img {
  filter: invert(1);
}
.node--type-kategorie-teaser-flexible{
  padding-top: 1.75em;
  padding-bottom: 2em;
}
.square3flex .field--name-field-kategorie-teaser-flex {
  margin: 0;
  font-size: 0.75em;
}
.square3flex .field--name-field-headline-teaser-flex p {
  text-align: left;
  font-size: 1em;
}
.field--name-field-teasertext-teaser-flex {
  font-size: 1vw;
}
.square3flex .node--type-kategorie-teaser-flexible .node__content {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
  min-height: 100%;
}
.square3flex .node--type-kategorie-teaser-flexible .node__content div {
  flex-grow: 0;
}
.square3flex .node--type-kategorie-teaser-flexible .node__content .field--name-field-teasertext-teaser-flex {
  flex-grow:1;
  max-height: 9em;
  overflow: hidden;
}
.square3flex .node--type-kategorie-teaser-flexible .node__content .katlink{
  flex-grow: 1;
  width: 100%;
}
.square3flex .node--type-kategorie-teaser-flexible .katlink{
  width: 2.5em;
  height: auto;
  margin-bottom:0.2em;
  flex-grow:0;
  flex-basis: 1.5em;
}
.square3flex .node--type-kategorie-teaser-flexible .katlink a{
  display: block;
  width: 100%;
  height: 100%;
}
.fakten-kachel {
  width: 100%
}
.fakten-kachel .layout__region--content{
  display: flex;
  flex-wrap: wrap;
}
.fakten-kachel .square2-start .field--name-field-zahlenwert {
  font-size: 6vw;
  margin-bottom: -0.3em;
}
.fakten-kachel .square3flex .field--name-field-zahlenwert {
  font-size: 6vw;
}
.square3flex .node--type-kategorie-teaser-flexible .field--name-field-zahlenwert p,
.square3flex .node--type-kategorie-teaser-flexible .field--name-field-headline-teaser-flex p{
  margin-bottom: 0 !important;
}
.field--name-field-kachel-1,
.field--name-field-kachel-2,
.field--name-field-kachel-3,
.field--name-field-kachel-4,
.field--name-field-kachel-5 ,
.field--name-field-kachel-6{
  margin:0 !important;
}
.block-field-blocknodefaktenfield-kachel-1,
.block-field-blocknodefaktenfield-kachel-2,
.block-field-blocknodefaktenfield-kachel-3,
.block-field-blocknodefaktenfield-kachel-4,
.block-field-blocknodefaktenfield-kachel-5,
.block-field-blocknodefaktenfield-kachel-6 {
  width:33.33%;
}


/** PROJEKTE **/
.node--type-projekt #content {
  margin-top: -40%;
}
.node--type-projekt .nav-tabs{
  background-color: white;
}
.block-field-blocknodeprojektfield-start {
  padding-bottom: 1.5em;
  font-size: 1.5em;
}
.block-field-blocknodeprojektfield-ende {
  padding-bottom: 1.5em;
  font-size: 1.5em;
  margin-left: -50%;
}
.block-field-blocknodeprojektfield-kurzfassung-projektstand {
  padding-bottom: 1em;
  padding-top: 1em;
  padding-right: 1.5em;
}

.field--name-field-media-image  {
  margin-right: 0px !important;
}
.node--type-projekt .breadcrumb {
  padding-top: 3.5em;
  margin-bottom: 3em;
  margin-left: -0.75em;
}
.node--type-projekt .field--name-field-kurzbeschreibung {
  padding-bottom: 1.75em;
}
.node--type-projekt .field--name-field-gesamtprojektziel .field__item {
  padding-bottom: 1em;
  padding-top: 1em;
}
.node--type-projekt .field--name-field-was-haben-wir-erreicht- {
  padding-top: 4em;
}
.node--type-projekt .field--name-field-media-image {
  margin-top: 1.75em;
}
.block-field-blocknodeprojektfield-bild-1 .field--name-field-media-image {
  width: 100%;
}
.node--type-projekt .field--name-field-bild-1 .field__item {
  margin-bottom: 1.2em;
}
.katBottom {
  margin: 0.5em;
}
.katBottom p.ueber {
  font-size: 1.25em;
  font-weight: bold;
  margin-top: 1.2em;
}
.node--type-projekt .field--name-field-gesamtprojektziel .field__label,
.node--type-projekt .field--name-field-status .field__label,
.block-field-blocknodeprojektfield-kurzbeschreibung .field__label {
  padding-top: 1.75em;
  font-size: 1.5em;
  text-decoration:underline;
}
.node--type-projekt .field--name-field-gesamtprojektziel,
.node--type-projekt .field--name-field-kurzfassung-projektstand{
  padding-bottom: 1em;
}
.node--type-projekt .field--name-field-status .field__item {
  font-size: 1.5em;
}
.block-field-blocknodeprojektfield-kurzbeschreibung .field__item {
  padding-top: 1em;
}
.projektBottom {
  margin-bottom:6em;
  margin-top: -3em;
}
.projektBottom .field__label {
  font-size: 1.5em;
  padding-top: 1.2em;
}


/** Kategorien Farben und Hintergruende **/
a.bl{
  color: black;
  display: block;
}
a.bl:hover{
  color: black;
  display: block;
}

a.wh {
  color:white;
  display: block;
}
a.wh:hover {
  color:white;
  display: block;
}

/** Transparent zun Padding oberer Teil **/
.node-projekt-layout-builder-form {
  background-color: white;
}
#block-innok-help {
  background-color: white;
}
#block-innok-content .content .node--view-mode-full .kat6-bg,
#block-innok-content .content .node--view-mode-full .kat13-bg,
#block-innok-content .content .node--view-mode-full .kat1-bg,
#block-innok-content .content .node--view-mode-full .kat12-bg,
#block-innok-content .content .node--view-mode-full .kat14-bg,
#block-innok-content .content .node--view-mode-full .kat15-bg,
#block-innok-content .content .node--view-mode-full .kat5-bg,
#block-innok-content .content .node--view-mode-full .noKat-bg
{
  padding-left: 2.75em;
  padding-right: 2.75em;
  opacity: 0.95;
  color: black;
}
#block-innok-content .content .node--view-mode-full .kat1-bg{
  background-color: #071AFF;
  color: white;
}
#block-innok-content .content .node--view-mode-full .kat6-bg {
  background-color: #E94B8B;
  color: black;
}
#block-innok-content .content .node--view-mode-full .kat13-bg {
  background-color: #EF0000;
}
#block-innok-content .content .node--view-mode-full .kat12-bg {
  background-color: #FF6E19;
}
#block-innok-content .content .node--view-mode-full .kat14-bg {
  background-color: #973CC3
}
#block-innok-content .content .node--view-mode-full .kat15-bg {
  background-color: #FFD200;
}
#block-innok-content .content .node--view-mode-full .kat5-bg {
  background-color: #E62679;
}

#block-innok-content .content .node--view-mode-full .noKat-bg {
  background-color: #F3F1F0;
}
#block-innok-content .content .newstop {
  background-color: #F3F1F0;
  padding-left: 2em;
  padding-right: 2em;
}
.kat13-bgEinfach {
  background-color: #EF0000;
  color:black;
}
.kat1-bgEinfach {
  background-color: #071AFF;
  color: white;
}
.kat6-bgEinfach {
  background-color: #E94B8B;
  color:white;
}
.kat12-bgEinfach {
  background-color: #FF6E19;
  color:black;
}
.kat14-bgEinfach {
  background-color: #973CC3;
  color:black;
}
.kat15-bgEinfach {
  background-color: #FFD200;
  color:black;
}
.kat5-bgEinfach {
  background-color: #E62679;
  color:black;
}
.katWhite-bg {
  background-color: white;
}
.katBlack-bg {
  background-color: black;
}
/** HG-Bilder **/
@keyframes animatedBackground {
  from {
    background-size: 100%;
  }
  to {
    background-size: 110%;
  }
}

.kat13-bgImage {
  background-image: url('../img/kategorie_teaser/teaser_Prozess_Strukturen.jpg');
}
.kat13-bgImage:hover {
  background-image: url('../img/kategorie_teaser/teaser_Prozess_Strukturen_rollover.jpg');
}
.kat1-bgImage {
  background-image: url('../img/kategorie_teaser/teaser_digitalisierung.jpg');
}
.kat1-bgImage:hover {
  background-image: url('../img/kategorie_teaser/teaser_digitalisierung_rollover.jpg');
}
.kat6-bgImage {
  background-image: url('../img/kategorie_teaser/teaser_organisation.jpg');
}
.kat6-bgImage:hover {
  background-image: url('../img/kategorie_teaser/teaser_organisation_rollover.jpg');
}
.kat12-bgImage {
  background-image: url('../img/kategorie_teaser/teaser_buergerservice.jpg');
}
.kat12-bgImage:hover {
  background-image: url('../img/kategorie_teaser/teaser_buergerservice_rollover.jpg');
}
.kat14-bgImage {
  background-image: url('../img/kategorie_teaser/teaser_innovation.jpg');
}
.kat14-bgImage:hover {
  background-image: url('../img/kategorie_teaser/teaser_innovation_rollover.jpg');
}
.kat15-bgImage {
  background-image: url('../img/kategorie_teaser/teaser_prozess_strukuren.jpg');
}
.kat15-bgImage:hover {
  background-image: url('../img/kategorie_teaser/teaser_prozess_strukuren_rollover.jpg');
}
.kat5-bgImage {
  background-image: url('../img/kategorie_teaser/teaser_attraktive_arbeitgeberin.jpg');
}
.kat5-bgImage:hover {
  background-image: url('../img/kategorie_teaser/teaser_attraktive_arbeitgeberin_rollover.jpg');
}
.kat12-bgImage, .kat1-bgImage, .kat6-bgImage, .kat15-bgImage, .kat5-bgImage, .kat14-bgImage, .kat13-bgImage{
  background-repeat: no-repeat;
  color: black;
  background-attachment: fixed;
  background-size:cover;
}
.kat12-bgImage:hover, .kat1-bgImage:hover, .kat6-bgImage:hover, .kat15-bgImage:hover, .kat5-bgImage:hover, .kat14-bgImage:hover, .kat13-bgImage:hover {
  color: black;
  animation: animatedBackground 2s;
  animation-fill-mode: forwards;
}
.kat13-bg {
  background-color: #EF0000
}
.kat1-bg {
  background-color: #071AFF;
}
.kat6-bg {
  background-color: #E94B8B;
}
.kat12-bg {
  background-color: #FF6E19;
}
.kat14-bg {
  background-color: #973CC3
}
.kat15-bg {
  background-color: #FFD200;
}
.kat5-bg {
  background-color: #E62679;
}
/** farben **/
.kat13 {
  color: #EF0000
}
.kat1 {
  color: #071AFF;
}
.kat6 {
  color: #E94B8B;
}
.kat12 {
  color: #FF6E19;
}
.kat14 {
  color: #973CC3
}
.kat15 {
  color: #FFD200;
}
.kat5 {
  color: #E62679;
}
.katWhite {
  color: white;
}
.blackColor {
  color: black;
}

/** FOOTER **/


.site-footer a {
  color: white;
}

.site-footer .container {
  padding-left: 30px;
  padding-right: 30px;
}

.site-footer__top .region {
  width: 100% !important;
  padding: 0 0.65%;
}

.site-footer__top {
  display: flex;
  justify-content: space-between;
  width: 100% !important;
  align-items: center;
}

.row.region.region-footer-fourth {
  display: block;
  padding: 0;
  align-self: flex-start;
}

#block-logofooter {
  border: none;
  margin-top: 0;
  padding-top: 4px;
  padding-right: 0;
}

.logo-footer {
  text-align: right;
}

.logo-footer img {
  margin-left: calc(100% - 200px);
  width: 200px;
}

#block-innok-footer .nav-link {
  padding: 0 0 0.3rem 0;
}

.node--type-fakten .site-footer__top,
.node--type-fakten .site-footer__bottom {
  width: 80% !important;
  margin-right: auto;
  margin-left: auto;
}

/** KONTAKT FORM */

#edit-field-zustimmung-zur-datenschutz-value {
  margin-top: -0.8em;
}
.field--name-field-form-info {
  margin-bottom: 3em !important;
}
.field--name-field-form-info p:first-of-type {
  padding-top: 2em;
}
#edit-field-label-datenschutz-wrapper{
  margin-top: 4em;
}
#contact-message-feedback-form {
  margin-bottom: 6vw;
}

.path-contact .form-required::after {
  background-image: url(../img/required.svg);
}

.path-contact .field--name-field-zustimmung-zur-datenschutz label {
  font-weight: 400;
}

.path-contact label {
  font-weight: bold;
  margin-left: 1em;
}

.path-contact .field--name-field-label-datenschutz {
  margin-left: 1em;
}

.path-contact .checkbox label {
  margin-left: 0;
}

.path-contact input,
.form-search.form-control input {
  height: 3em;
}

.path-contact .form-control,
.form-search.form-control{
  border-radius: 0;
  background-color: #F2F2F2;
  border: 1px solid #F2F2F2;
}

.path-contact .form-control:focus,
.form-search.form-control:focus {
  border-color: #E6E6E6;
  box-shadow:0 0 0 .2rem rgba(0, 0, 0, .25);
  background-color: #F2F2F2;
}


.asterix img {
  margin-left: 0.3em;
  width: 7px;
  height: 7px;
  vertical-align: text-top;
}
.field--name-field-label-datenschutz {
  white-space: nowrap;
}
#edit-field-erklaerung-datenschutz-wrapper {
  margin-top: -10px;
}

.path-contact .button--primary,
.btn-einleitung-rechts {
  background-color: black;
  color: white;
  border-color: black;
  border-radius: 0;
  background-image: url("../img/icons/arrow_right_thick_white.svg");
  background-repeat: no-repeat;
  background-position: 85% 50%;
  background-size: 20px;
  padding: 1em 3.6em 1em 1em;
  font-weight: bold;
  font-size: inherit;
  margin-top: 1em;
  transition: background-position 0.5s, background-size 0.5s;
}

.path-contact .button--primary:hover,
.btn-einleitung-rechts:hover {
  background-color: black;
  color: white;
  font-weight: bold;
  background-position: 90% 50%;
  background-size: 25px;
}

.field--name-field-erklaerung-datenschutz a {
  text-decoration: underline !important;
}

.ui-accordion .ui-accordion-header {
  background-color: black;
  color: white;
  padding-top: 1.5em;
  padding-bottom: 1.5em;
  padding-left: 2em;
  font-size: 1.2em;
  background-image: url("../img/icons/arrow_down_thick_white.svg");
  background-position: 95% center;
  background-size: 1.25em;
  background-repeat: no-repeat;
  margin-top: 2em;
}
#block-innok-content .ui-accordion-content-active {
  padding-top: 1.5em;
  padding-bottom: 0;
  border: 0;
  height: auto !important;
}
#block-innok-content .field--name-field-accordion-feld{
  margin-bottom: 3em;
}
#block-innok-content .block-field-blocknodepagefield-accordion-feld .ui-icon {
  display: none;
}

/** SUCH FORM MODAL */

.ui-widget-header {
  border: none;
  background: none;
  color: #fff;
  font-weight: normal;
  font-size: 1.5em;
}

.ui-widget.ui-widget-content {
  border: none;
}

.ui-dialog {
  font-family: "SoehneWebLeicht" !important;
  border-radius: 0;
  background: transparent;
}
.ui-dialog h3 {
  display: none;
}
.ui-dialog summary {
  display: none;
}
.ui-dialog .search-form label {
  display: none;
}

.search-help-link {
  display: none;
}

.ui-button-icon.ui-icon.ui-icon-closethick {
  display: none;
}
.ui-dialog .ui-dialog-titlebar-close {
  background-color: transparent;
  border: none;
  right: 0.7em;
  background-image: url("../img/icons/close_thick_white.svg");
  background-repeat: no-repeat;
  background-position: 0 0;
  color: transparent;
  text-indent: 0 !important;
}


.ui-button .search-form .button.btn.btn-primary {
  padding: 0.5em 3.6em 0.6em 1em;
}

.ui-dialog .ui-dialog-titlebar {
  padding: .4em 0.7em;
}

.ui-dialog-titlebar-close::before,
.ui-button.ui-corner-all.ui-widget.ui-button-icon-only.ui-dialog-titlebar-close::before {
  position: absolute;
  content: 'schließen';
  color: white;
  margin-left: -80px;
  margin-top: -12px;
  font-size: 0.6em;
  text-indent: 0 !important;
}

.ui-button.ui-corner-all.ui-widget.ui-button-icon-only.ui-dialog-titlebar-close::before {
  margin-top: 0;
}

/** SUCH FORMULAR */

.search-form .button.btn.btn-primary {
  border-radius: 0;
  color: white;
  Background-color: black;
  border-color: black;
  background-image: url("../img/icons/arrow_right_thick_white.svg");
  background-repeat: no-repeat;
  background-position: 85% 50%;
  background-size: 20px;
  padding: 0.5em 3.6em 0.5em 1em;
  font-size: inherit;
  margin-top: 1em;
  transition: background-position 0.5s, background-size 0.5s;
}
.search-form .button.btn.btn-primary:hover {
  background-position: 90% 50%;
}

/** SUCH ERGEBNISSE **/
.path-search h1 {
  font-size: 5em;
  margin-top: 0.75em;
}
.path-search h3 {
  font-size: 2em;
  padding-bottom: 1em;
}
.path-search .item-header{
  background-color: black;
  color: white;
  display: block;
  padding: 0.75em;
  padding-left: 1.5em;
}
.search_exclude_node_search-results .list-group-item {
  border: 0;
  border-bottom: 2px solid #827D73;
}
.search_exclude_node_search-results h3 {
  padding-top: 0.5em;
  padding-bottom: 0;
}
.search_exclude_node_search-results h3 a {
  color: black !important;
  display: block;
  font-weight: bold;
  font-size: 0.5em !important;
  background-image: url("../img/icons/arrow_right_thick.svg");
  background-position: left center;
  background-repeat: no-repeat;
  padding-left: 2.25em;
  background-size: 1.5em;
}
.search_exclude_node_search-results h3 a:hover {
  color: black !important;
}
.search_exclude_node_search-results p {
  padding-left: 2.25em;
  padding-right: 5em;
}
.category-snippet {
  padding-left: 2.25em;
}
.category-snippet img {
  margin-right: 0.75em;
}
.category-snippet span:not(:first-of-type) {
  margin-left: 1.25em;
}

.path-search .pagination {
  border-radius: 0px !important;
  padding-top: 3em;
  padding-bottom: 4em;
}
.path-search .pagination .pager__item--next a{
  background-image: url("../img/icons/arrow_right_thick.svg");
  background-repeat: no-repeat;
  background-size: 1.75em;
  background-position: center;
  width: 3.5em;
  border: 0 !important;
  height: 2.5em;
}
.path-search .pagination .pager__item--previous a{
  background-image: url("../img/icons/arrow_left_thick.svg");
  background-repeat: no-repeat;
  background-size: 1.75em;
  background-position: center;
  width: 3.5em;
  border: 0 !important;
  height: 2.5em;
  background-color: white;
}
.path-search .pagination .pager__item--previous a:hover,
.path-search .pagination .pager__item--next a:hover {
  background-color: white;
}
.path-search li.page-item a,
.path-search .page-item.active .page-link {
  background-color: #827D73;
  color: black;
  border: 1px solid white;
  height: 2.5em;
  width: 2.5em;
  text-align: center;
  vertical-align: middle;
  padding: 0;
  display: table-cell;
}
.path-search .page-item.active .page-link {
  background-color: black;
  color: white;
}
.path-search .page-item:first-child .page-link,
.path-search .page-item:last-child .page-link {
  border-radius: 0 !important;
}
.path-search .pagination .pager__item--next span:first-of-type {
  color: transparent;
  border: 0;
}
.path-search .pagination .pager__item--previous span:first-of-type {
  color: transparent;
  border: 0;
}
.suffix {
  text-align: right;
  display: block;
  background-color: #827D73;
  float: right;
  padding: 0.25em 0.75em;
  margin-top: -1.5em;
  font-size: 0.8em;
}

.field--type-changed {
  color: gray;
  margin-top: 2vw;
  margin-bottom: 5vw;
  font-style: italic;
  text-align: center;
}

.underlaid {
  background: rgba(0, 0, 0, 0.8);
  padding: 0.2em;
}

.ajax-progress {
  display: none;
}

.zum-archiv {
  padding: 2em;
  background-color: #000;
  text-align: center;
}
.zum-archiv a {
  color: white;
}
.zum-archiv a:hover {
  color: white;
  text-decoration: underline !important;
  font-weight: bold;
}

.path-frontpage .field--type-entity-reference {
  margin: 0;
}

.path-frontpage .field.field--name-field-kategorie-teaser-flex.field--type-entity-reference.field--label-hidden.field__item {
  display: none;
}
.path-frontpage .clearfix.text-formatted.field.field--name-field-headline-teaser-flex.field--type-text.field--label-hidden.field__item {
  font-size: 2em;
  font-weight: normal;
}
.path-frontpage .clearfix.text-formatted.field.field--name-field-teasertext-teaser-flex.field--type-text-long.field--label-hidden.field__item {
  font-size: 1.2em;
  margin-top: 2em;
}

.path-frontpage .einleitung-wrapper {
  display: flex;
}

.path-frontpage .einleitung-links {
  flex: 1;
  padding: 0 2em;
}


.btn-zentriert {
  text-align: center;
  margin-top: 3em;
}

.path-frontpage .einleitung-rechts {
  flex: 1;
  font-size: 0.6em;
  font-weight: bold;
}

.field.field--name-field-kontaktdaten-footer {
  width: 250px;
  height: auto;
  position: absolute;
  right: 0;
  top: -18px;
}
/*.table-striped tbody tr:nth-of-type(2n+1) {
  background-color: #F3F1F0 !important;
}*/

tr {
  background: #F3F1F0 !important;
}
