/*
 Anpassung Senioren-Union
*/

/* =========================
   BASIS
========================= */
header {
  background: #FFFFFF;
  border-bottom: 5px solid #eb2729;
}

header:after,
header .bevel {
  background-color: #FFFFFF;
  background-image: none;
}

#bottomlogo {
  height: 70px;
  background-color: transparent;
}

#logo {
  top: 11px;
}

body {
  background: url(/image/templates/berlin2020/senioren-union_body_bg.png) no-repeat top center;
}

.fab,
.fa-brands { color: #000000 !important; }
.section--footer-social .fab, .section--footer-social .fa-brands { color: #FFFFFF !important; }

/* =========================
   NAVIGATION
========================= */
#sharkmenu,
#sharkmenu ul li ul li,
#sharkmenu > ul.open,
#sharkmenu > ul.open li ul li ul li {
  background: #FFFFFF;
}

#sharkmenu ul li ul li a,
#sharkmenu > ul > li > a {
  color: #000000;
  text-transform: none;
  font-family: 'Chivo Bold';
}

#sharkmenu ul li ul li ul li a {
  color: #FFFFFF;
  text-transform: none;
  font-family: 'Chivo Bold';
}

/* =========================
   SLIDER / HERO
========================= */
.active .section--header-slider-slide .title div,
.active .section--header-slider-slide .title div a,
.slider_text_top {
  background: #FFFFFF;
}

.active .section--header-slider-slide .title div a,
.section--headline-header-title,
.section-quote__copy,
.headline-large {
  font-weight: 600;
}

.active .section--header-slider-slide .title div:nth-child(2),
.active .section--header-slider-slide .title div:nth-child(2) a {
  background: #000000;
}

.active .section--header-slider-slide .title div:nth-child(2) a {
  color: #FFFFFF;
}

.slider_text_top {
  color: #000000;
}

.slider_text_bottom {
  margin-top: 0;
}

.section--header-slider-slide .title {
  padding: 20px;
}

/* =========================
   TYPOGRAFIE
========================= */
.headline-huge,
.headline-large,
.section--header-slider-slide .title,
.section--headline-header-title,
.section--image-headline-header .section--headline,
.section--text-buttons .section--headline,
.section--project-slider .section--headline,
.section--project-detail .section--headline,
.section--text .section--headline,
.section--team .section--headline,
.section--news-list .section--headline {
  text-transform: none;
}

/* =========================
   HINTERGRÜNDE / BEREICHE
========================= */
.section--quote .background { background: #004d7e; width: 100%; }
.section--quote .fab { color: #FFFFFF !important; }
.section--quote { margin-bottom: 30px; }

.section--headline-header,
footer {
  background: url(/image/templates/berlin2020/senioren_footer_bg.jpg) center center no-repeat;
  background-size: cover;
}

.section--news-list-category,
.section--headline-header-title,
.section--news-list-headline,
.c_mediathek_podcast,
.c_mediathek_video,
.artikelliste_3_titel,
.artikelliste_2_titel,
.section--contact-form,
.layout-default .section--project-detail-content,
.pro10box1 .title,
.pro10box2 .title,
.pro10box3 .title,
.pro10box4 .title,
.termin_diff_5 {
  background: #004d7e;
}

.halfside > .section--project-slider > .section--project-slider-slides > .slick-list > .slick-track > .slick-slide > div > .section--project-slider-slide > .section--project-slider-overlay {
    background: #004d7e !important;
}

.kampagne_standard_titel,
.teaser_sw_row_title { border-bottom: 4px solid #004d7e; }

.section--footer-copyright,
.section--footer-copyright p {
  background: transparent;
}

.section-quote__copy { background: #000000; }

.section--news-list-content,
.halfside-layout {
  background: #efefef;
  color: #000000;
}

/* =========================
   BUTTONS / FORMULARE
========================= */
.button,
.section--news-list-navigation li a,
.section--news-list-navigation li span,
.section--contact-form-form .actions button,
.section--newsletter-form-extern button,
.newsletter_abonnieren2 {
  background: #eb2729;
  border: 1px solid #eb2729;
  color: #FFFFFF;
}

.umfrage_title { background: transparent !important; }

.button-outline,
.section--footer-copyright span,
.layout-default .section--project-detail-content {
  color: #FFFFFF !important;
}

.button-black-outline:focus,
.section--news-list-navigation li a:focus,
.section--news-list-navigation li span:focus {
  background-color: transparent;
  border-color: #000000;
  color: #000000;
}

/* =========================
   CONTENT
========================= */
.section--text,
.c_mediathek_podcast,
.section--project-slider {
  float: left;
  width: 100%;
}

.c_mediathek_video {
  float: left;
}
.c_mediathek_video h1 { color: #FFFFFF !important; }

.section--team-member .title,
.section--news-list-more {
  color: #004d7e;
}

.section--news-list-title,
.section--news-list-title a,
.section--icons-icon a {
  color: #eb2729;
}

.termin_kalender_wochentage td {
  background-color: #eb2729;
  color: #FFFFFF;
}

/* =========================
   DEKORATIVE ELEMENTE
========================= */
.active .section--header-slider-slide .title .slider_text_top a:after,
.active .section--header-slider-slide .title .slider_text_bottom a:after,
.section--quote .background:after,
.bevel-blue-r:after,
.section--footer-copyright p:after,
.bevel-yellow-l:before,
.bevel-blue-l:before,
.section--news-list-category:before,
#menu-toggle:before,
#totop:before,
#newsletter-toggle:before,
.section--project-slider-overlay:before,
.section--project-slider .section--headline:after {
  background-image: none;
}

.section--headline-header-box-balken {
  display: none !important;
}

/* =========================
   MOBILE
========================= */
@media (max-width: 900px) {
  #sharkmenu {
    padding: 10px 0;
  }

  body {
    padding-top: 58px;
  }

  #sharkmenu > ul.open {
    top: 60px;
  }

  #sharkmenu #menu-button {
    color: #000000;
  }

  #sharkmenu #menu-button:before {
    top: 42px;
    border-top: 2px solid #000000;
  }

  #sharkmenu #menu-button:after {
    top: 32px;
    border-top: 2px solid #000000;
    border-bottom: 2px solid #000000;
  }

  .afterslider {
    top: -40px;
    margin-bottom: -40px;
  }
}

@media (max-width: 768px) {
  #logo {
    top: 10px;
  }

  .section--quote-sign img,
  .slick-dots {
    display: none !important;
  }

  .section--quote blockquote p {
    font-size: 14px;
  }
}

@media (max-width: 468px) {
  .afterslider {
    top: -80px;
    margin-bottom: -80px;
  }
}

@media (max-width: 1366px) {
  #social {
    width: auto;
  }
}