/* GANTRY5 DEVELOPMENT MODE ENABLED.
 *
 * WARNING: This file is automatically generated by Gantry5. Any modifications to this file will be lost!
 *
 * For more information on modifying CSS, please read:
 *
 * http://docs.gantry.org/gantry5/configure/styles
 * http://docs.gantry.org/gantry5/tutorials/adding-a-custom-style-sheet
 */

@charset "UTF-8";
.jl-wrapper .jl-container .el-content {
  padding: 0.938rem;
  margin: 0.625rem;
}
.jl-wrapper .g-container, .tm-header .g-container, .tm-header-mobile .g-container {
  box-sizing: content-box;
  max-width: 60rem;
  margin-left: auto;
  margin-right: auto;
}
.jl-wrapper .g-container .el-content, .tm-header .g-container .el-content, .tm-header-mobile .g-container .el-content {
  padding: 0.938rem;
  margin: 0.625rem;
}
@media only all and (min-width: 75rem) {
  .jl-wrapper .g-container, .tm-header .g-container, .tm-header-mobile .g-container {
    max-width: 75rem;
  }
}
@media only all and (min-width: 60rem) and (max-width: 74.99rem) {
  .jl-wrapper .g-container, .tm-header .g-container, .tm-header-mobile .g-container {
    max-width: 60rem;
  }
}
@media only all and (min-width: 48rem) and (max-width: 59.99rem) {
  .jl-wrapper .g-container, .tm-header .g-container, .tm-header-mobile .g-container {
    max-width: 48rem;
  }
}
@media only all and (min-width: 30.01rem) and (max-width: 47.99rem) {
  .jl-wrapper .g-container, .tm-header .g-container, .tm-header-mobile .g-container {
    max-width: 30rem;
  }
}
.jl-slideshow .el-content-wrapper {
  padding: 0.938rem;
  margin: 0.625rem;
}
.jl-slideshow .el-vertical-align {
  margin: 1.9749rem;
}
.tm-header .navbar-wrapper, .tm-header-mobile .navbar-wrapper {
  padding: 0 0.938rem;
  margin: 0 0.625rem;
}
[id^="jlnavbar-"][id$="-particle"] {
  padding: 0 0.938rem;
  margin: 0 0.625rem;
}
.menu-simple .jl-container .g-main-nav {
  padding: 0 0.938rem;
  margin: 0 0.625rem;
}
.menu-extended .el-navbar-dropbar {
  padding-left: 0.938rem;
  padding-right: 0.938rem;
}
.el-horiz-nav {
  padding: 0 0.938rem;
  margin: 0 0.625rem;
}
[id^="jlnav-"][id$="-particle"] .jl-search-input {
  border-radius: 0;
  box-shadow: none;
}
ul.jl-list, .jl-breadcrumb, .jl-comment-list {
  margin-left: 0;
}
ul.jl-tab, .jl-subnav {
  margin-top: 0;
}
p, ul.jl-list {
  margin: 0 0 20px 0;
}
.jl-hr, hr {
  overflow: visible;
  text-align: inherit;
  border-top: 1px solid #e5e5e5;
}
.jl-checkbox, .jl-radio {
  display: inline-block !important;
  width: 16px !important;
}
.jl-modal-dialog video {
  vertical-align: middle;
}
.jl-link {
  color: #0066cc;
}
.jl-link:hover, .jl-link:focus, .jl-link:active {
  color: #0066cb;
}
.jl-link-heading:hover, .jl-link-heading a:hover, .jl-link-toggle:hover .jl-link-heading, .jl-link-toggle:focus .jl-link-heading, .jl-list-primary > ::before, .jl-text-primary {
  color: #0066cc !important;
}
.jl-notification-message-primary, .jl-button-link, .jl-navbar-toggle.jl-open, .jl-navbar-toggle:focus, .jl-navbar-toggle:hover, .jl-iconnav > * > a:hover, .jl-iconnav > .jl-active > a {
  color: #0066cc;
}
.jl-search-input {
  box-sizing: border-box !important;
}
.jl-search-navbar .jl-search-input:focus, .jl-tab > .jl-active > a {
  border-color: #0066cc;
}
.jl-button-primary, .jl-card-primary.jl-card-hover:hover, .jl-background-primary, .jl-marker, .jl-alert-primary, .jl-subnav-pill > .jl-active > a, .jl-checkbox:checked, .jl-checkbox:indeterminate, .jl-checkbox:checked:focus, .jl-checkbox:indeterminate:focus, .jl-radio:checked, .jl-card-primary > .tm-timeline-arrow, .jl-dotnav > .jl-active > *, .jl-dotnav > * > :focus, .jl-dotnav > * > :hover, .jl-pagination > .jl-active > *, .jl-label:not(.jl-label-success, .jl-label-warning, .jl-label-danger) {
  background-color: #0066cc;
}
.jl-light .jl-label {
  background-color: #fff;
  color: #1c1c1c;
}
.jl-light > :not([class*="jl-card-media"]) .jl-card-title {
  color: rgba(255, 255, 255, 0.77);
}
.jl-button-primary:hover, .jl-button-primary:focus {
  background-color: #0059b3;
}
.jl-light .jl-button-primary:focus {
  background-color: #fff;
  color: #1c1c1c;
}
.jl-icon:not(.jl-preserve) [stroke*="#"]:not(.jl-preserve) {
  stroke: currentcolor;
}
.jl-section-primary, .jl-tile-primary, .jl-card-primary, .jl-badge {
  background: #0066cc;
}
.jl-text-background {
  background-color: #0066cc;
  background-image: linear-gradient(90deg, #0066cc 0, #20c 100%);
}
.jl-checkbox:focus, .jl-radio:focus {
  border-color: #0066cc;
}
.jl-radio:checked:focus {
  background-color: #0066cc;
}
.jl-overlay-primary {
  background: rgba(0, 102, 204, 0.8);
}
.jl-button-default {
  background-color: rgba(255, 255, 255, 0);
  color: #0066cc;
  border-color: #0066cc;
}
.jl-button-default:hover, .jl-button-default:focus, .jl-button-default:active {
  background-color: #0066cc;
  border-color: #0066cc;
  color: #ffffff;
}
.jl-pagination > * > :hover {
  color: #fff;
  background-color: #0066cb;
}
html {
  scroll-behavior: smooth;
}
em {
  color: #000000;
}
.g-owlcarousel {
  color: #eceeef;
}
.g-owlcarousel .g-owlcarousel-item-wrapper {
  position: relative;
}
.g-owlcarousel .g-owlcarousel-item-wrapper .g-owlcarousel-item-img {
  position: relative;
}
.g-owlcarousel .g-owlcarousel-item-wrapper .g-owlcarousel-item-img img {
  display: block;
  width: 100vw;
  height: 75vh;
  object-fit: cover;
}
.g-owlcarousel .g-owlcarousel-item-wrapper .g-owlcarousel-item-img:after {
  position: absolute;
  content: "";
  height: 100%;
  left: 0;
  right: 0;
  bottom: 0;
}
.g-owlcarousel .g-owlcarousel-item-wrapper .g-owlcarousel-item-content-container {
  position: absolute;
  margin: auto;
  top: auto;
  bottom: 8%;
  left: 0;
  right: 0;
  transform-style: preserve-3d;
}
@media only all and (min-width: 75rem) {
  .g-owlcarousel .g-owlcarousel-item-wrapper .g-owlcarousel-item-content-container {
    width: 75rem;
  }
}
@media only all and (min-width: 60rem) and (max-width: 74.99rem) {
  .g-owlcarousel .g-owlcarousel-item-wrapper .g-owlcarousel-item-content-container {
    width: 60rem;
  }
}
@media only all and (min-width: 48rem) and (max-width: 59.99rem) {
  .g-owlcarousel .g-owlcarousel-item-wrapper .g-owlcarousel-item-content-container {
    width: 40rem;
  }
}
@media only all and (min-width: 30.01rem) and (max-width: 47.99rem) {
  .g-owlcarousel .g-owlcarousel-item-wrapper .g-owlcarousel-item-content-container {
    width: 30rem;
  }
}
@media only all and (max-width: 30rem) {
  .g-owlcarousel .g-owlcarousel-item-wrapper .g-owlcarousel-item-content-container {
    width: 100%;
  }
}
.g-owlcarousel .g-owlcarousel-item-wrapper .g-owlcarousel-item-content-container .g-owlcarousel-item-content-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
}
@media only all and (min-width: 60rem) and (max-width: 74.99rem) {
  .g-owlcarousel .g-owlcarousel-item-wrapper .g-owlcarousel-item-content-container .g-owlcarousel-item-content-wrapper {
    padding-top: 2.5rem;
  }
}
.g-owlcarousel .g-owlcarousel-item-wrapper .g-owlcarousel-item-content-container .g-owlcarousel-item-content-wrapper .g-owlcarousel-item-content {
  margin: 1.25rem 0.625rem 0.625rem;
  padding: 0.938rem;
  text-align: center;
  background-color: rgba(0, 3, 27, 0.4);
}
@media only all and (min-width: 48rem) and (max-width: 59.99rem) {
  .g-owlcarousel .g-owlcarousel-item-wrapper .g-owlcarousel-item-content-container .g-owlcarousel-item-content-wrapper .g-owlcarousel-item-content {
    padding-top: 2.5rem;
  }
}
.g-owlcarousel .g-owlcarousel-item-wrapper .g-owlcarousel-item-content-container .g-owlcarousel-item-content-wrapper .g-owlcarousel-item-content .g-owlcarousel-item-title {
  font-family: "Raleway", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif;
  font-size: 4vw;
  line-height: 5rem;
  font-weight: 500;
  margin: 1.25rem 1.25rem 0.625rem;
}
@media only all and (min-width: 60rem) and (max-width: 74.99rem) {
  .g-owlcarousel .g-owlcarousel-item-wrapper .g-owlcarousel-item-content-container .g-owlcarousel-item-content-wrapper .g-owlcarousel-item-content .g-owlcarousel-item-title {
    font-size: 3rem;
    line-height: 3.875rem;
  }
}
@media only all and (min-width: 48rem) and (max-width: 59.99rem) {
  .g-owlcarousel .g-owlcarousel-item-wrapper .g-owlcarousel-item-content-container .g-owlcarousel-item-content-wrapper .g-owlcarousel-item-content .g-owlcarousel-item-title {
    font-size: 2rem;
    line-height: 2.875rem;
    margin-top: 3.125rem;
  }
}
@media only all and (min-width: 30.01rem) and (max-width: 47.99rem) {
  .g-owlcarousel .g-owlcarousel-item-wrapper .g-owlcarousel-item-content-container .g-owlcarousel-item-content-wrapper .g-owlcarousel-item-content .g-owlcarousel-item-title {
    margin-top: 0;
    font-size: 2rem;
    line-height: 2.875rem;
  }
}
@media only all and (max-width: 30rem) {
  .g-owlcarousel .g-owlcarousel-item-wrapper .g-owlcarousel-item-content-container .g-owlcarousel-item-content-wrapper .g-owlcarousel-item-content .g-owlcarousel-item-title {
    margin-top: 0;
    font-size: 1.5rem;
    line-height: 2rem;
  }
}
.g-owlcarousel .g-owlcarousel-item-wrapper .g-owlcarousel-item-content-container .g-owlcarousel-item-content-wrapper .g-owlcarousel-item-content .g-owlcarousel-item-desc {
  font-size: 2vw;
  line-height: 1.5;
  font-weight: 200;
  padding-bottom: 1.407rem;
  margin-top: 0;
  margin-bottom: 0.625rem;
}
@media only all and (min-width: 60rem) and (max-width: 74.99rem) {
  .g-owlcarousel .g-owlcarousel-item-wrapper .g-owlcarousel-item-content-container .g-owlcarousel-item-content-wrapper .g-owlcarousel-item-content .g-owlcarousel-item-desc {
    font-size: 1rem;
    line-height: 1.875rem;
  }
}
@media only all and (min-width: 48rem) and (max-width: 59.99rem) {
  .g-owlcarousel .g-owlcarousel-item-wrapper .g-owlcarousel-item-content-container .g-owlcarousel-item-content-wrapper .g-owlcarousel-item-content .g-owlcarousel-item-desc {
    font-size: 1rem;
    line-height: 1.875rem;
    padding-bottom: 0;
  }
}
@media only all and (max-width: 47.99rem) {
  .g-owlcarousel .g-owlcarousel-item-wrapper .g-owlcarousel-item-content-container .g-owlcarousel-item-content-wrapper .g-owlcarousel-item-content .g-owlcarousel-item-desc {
    display: none;
  }
}
@media only all and (min-width: 48rem) and (max-width: 59.99rem) {
  .g-owlcarousel .g-owlcarousel-item-wrapper .g-owlcarousel-item-content-container .g-owlcarousel-item-content-wrapper .g-owlcarousel-item-content .g-owlcarousel-item-button {
    padding: 1rem 2.625rem;
    font-size: 0.6rem;
  }
}
@media only all and (max-width: 47.99rem) {
  .g-owlcarousel .g-owlcarousel-item-wrapper .g-owlcarousel-item-content-container .g-owlcarousel-item-content-wrapper .g-owlcarousel-item-content .g-owlcarousel-item-button {
    display: none;
  }
}
@media only all and (max-width: 48rem) {
  .logo-mobile {
    display: block !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }
  .logo-visibility {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }
}
@media only all and (min-width: 48.0625rem) {
  .logo-mobile {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }
  .logo-visibility {
    display: block !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }
}
.et_pb_fullwidth_header {
  padding: 150px 0;
  position: relative;
  background-position: 50%;
  background-size: cover;
}
.et_pb_fullwidth_header .et_pb_fullwidth_header_container {
  position: relative;
  z-index: 3;
  width: 80%;
  max-width: 1080px;
  margin-left: auto;
  margin-right: auto;
}
.et_pb_fullwidth_header .et_pb_fullwidth_header_container.center {
  display: -moz-flex;
  display: -ms-flex;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-flow: row wrap;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  flex-flow: row wrap;
  -moz-justify-content: center;
  -ms-justify-content: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.et_pb_fullwidth_header .et_pb_fullwidth_header_container.center .header-content-container {
  width: 100%;
  -webkit-align-self: center;
  -ms-align-self: center;
  -ms-flex-item-align: center;
  align-self: center;
}
.et_pb_fullwidth_header .et_pb_fullwidth_header_container.center .header-content-container.center {
  -webkit-align-self: center;
  -ms-align-self: center;
  -ms-flex-item-align: center;
  align-self: center;
}
.et_pb_fullwidth_header .et_pb_fullwidth_header_container.center .header-content-container.bottom {
  -webkit-align-self: flex-end;
  -ms-align-self: flex-end;
  -ms-flex-item-align: flex-end;
  align-self: flex-end;
}
.et_pb_min_header_overlay {
  min-height: 25vh;
}
.et_pb_max_header_overlay {
  min-height: 75vh;
}
.et_pb_fullscreen_header_0_tb_body {
  height: 100vh;
}
.et_pb_halfscreen_header_0_tb_body {
  height: 50vh;
}
.et_pb_module {
  position: relative;
  background-size: cover;
  background-position: 50%;
  background-repeat: no-repeat;
}
.et_pb_module.et_pb_text_align_center {
  text-align: center;
}
.et_pb_module_header_title {
  font-family: "Raleway", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif;
  font-size: 4vw;
  line-height: 5rem;
  font-weight: 500;
  padding-top: 2rem;
  margin: 1.25rem 1.25rem 0.625rem;
}
.header-content {
  background-color: rgba(0, 3, 27, 0.4);
}
.et_pb_fullwidth_header_subhead {
  font-size: 2vw;
}
.liga-header {
  font-size: 2rem;
}
.liga {
  font-size: 1.5rem;
}
.contact-thumbnail {
  max-width: 152px;
}
.width-10 {
  width: 10px;
}
.width-20 {
  width: 20px;
}
.width-30 {
  width: 30px;
}
.width-40 {
  width: 40px;
}
.width-50 {
  width: 50px;
}
.width-60 {
  width: 60px;
}
.width-70 {
  width: 70px;
}
.width-80 {
  width: 80px;
}
.width-90 {
  width: 90px;
}
.width-100 {
  width: 100px;
}
.height-10 {
  height: 10px;
}
.height-20 {
  height: 20px;
}
.height-30 {
  height: 30px;
}
.height-40 {
  height: 40px;
}
.height-50 {
  height: 50px;
}
.height-60 {
  height: 60px;
}
.height-70 {
  height: 70px;
}
.height-80 {
  height: 80px;
}
.height-90 {
  height: 90px;
}
.height-100 {
  height: 100px;
}
/* =========================================
   Header / Navigation Anpassungen
   Vereinsfarben:
   Blau  #0066CC
   Gelb  #FFFF00
   ========================================= */
/* -----------------------------------------
   Navigation: Hover + aktiver Menüpfad
   ----------------------------------------- */
/* Alle aktiven und gehoverten Ebenen */
.g-main-nav a:hover, .g-main-nav .active > a, .g-main-nav .g-menu-item:hover > .g-menu-item-container, .g-main-nav .g-menu-item:hover > .g-menu-item-container > a, .g-main-nav .g-menu-item:has(.g-menu-item:hover) > .g-menu-item-container, .g-main-nav .g-menu-item:has(.g-menu-item:hover) > .g-menu-item-container > a {
  color: #FFFF00 !important;
}
/* -----------------------------------------
   Linien unter der Navigation
   ----------------------------------------- */
#g-navigation {
  position: relative;
}
#g-navigation::after {
  content: "";
  display: block;
  height: 15px;
  width: 100%;
  background: linear-gradient(to bottom, #FFFF00 0px, #FFFF00 10px, #FFFFFF 10px, #FFFFFF 15px);
}
/* -----------------------------------------
   Footer Links blau 
   ----------------------------------------- */
#g-footer .jl-nav-default > li > a {
  color: #0066CC;
}
/* -----------------------------------------
   Blaue Linie oben am Footer
   ----------------------------------------- */
#g-footer {
  border-top: 10px solid #0066CC;
}
/* -----------------------------------------
   Navigation unabhängig vom Gantry-Grid
   zentrieren
   ----------------------------------------- */
#g-navigation .g-grid {
  position: relative;
}
/* Menüblock size-77 nicht mehr als 77%-Spalte behandeln */
#g-navigation .g-block.size-77 {
  width: 100%;
  flex: 1 1 auto;
}
/* Menüinhalt zentrieren */
#g-navigation .g-main-nav {
  display: flex;
  justify-content: center;
  width: 100%;
}
#g-navigation .g-toplevel {
  justify-content: center;
}
/* -----------------------------------------
   Social Media Bereich verkleinern
   und aus dem Grid lösen
   ----------------------------------------- */
#g-navigation .g-block.size-18 {
  width: 90px !important;
  flex: 0 0 90px !important;
}
#social-custom {
  width: 90px !important;
  display: flex;
  justify-content: flex-end;
}
/* -----------------------------------------
   Social Icons rechts fixieren
   (entfernt Einfluss auf Zentrierung)
   ----------------------------------------- */
#g-navigation {
  position: relative;
}
#social-custom {
  position: absolute;
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
}
#social-custom {
  display: none !important;
}
@media (min-width: 1200px) {
  #social-custom {
    display: flex !important;
  }
}
/* -----------------------------------------
   Optional: Logo links aus dem Grid nehmen
   nur aktivieren, falls nötig
   ----------------------------------------- */
/*
#g-navigation .g-logo {
    position: absolute;
    left: 20px;
    top: 50%;
    transform: translateY(-50%);
}
*/
/* Verhindert falsche Symbolanzeige während Font-Ladevorgang */
.fa, .fas, .far, .fab {
  font-display: block;
}
/* -----------------------------------------
   Mobile Logo-Höhe erhöhen
   ----------------------------------------- */
@media (max-width: 767px) {
  .g-logo.g-logo-helium img, .g-logo.g-logo-helium svg {
    max-height: 100px;
  }
}
/* -----------------------------------------
   JL Buttons Spielplan und Login Hintergrund und abrunden
   ----------------------------------------- */
.jl-button.jl-button-secondary {
  background-color: #0066CC;
  border-radius: 5px;
  color: #FFFFFF;
  border: none;
}
.jl-button.jl-button-secondary:hover {
  background-color: #004c99;
  color: #FFFFFF;
}
/* -----------------------------------------
   JL Default Buttons abrunden
   ----------------------------------------- */
.jl-button.jl-button-default {
  border-radius: 5px;
}
/* -----------------------------------------
   Mobile Ansicht Tabellen inkl. Scrollen
   ----------------------------------------- */
.table-responsive {
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.table-responsive table {
  width: max-content;
  min-width: 100%;
  border-collapse: collapse;
}
/* -----------------------------------------
   Text Abteilung Fußball
   ----------------------------------------- */
.menu-item-particle.logo-visibility.width-100 {
  position: relative;
  text-align: center;
}
.menu-item-particle.logo-visibility.width-100::after {
  content: "Abteilung Fußball";
  position: absolute;
  top: 100%;
  left: 50%;
  width: max-content;
  transform: translateX(-50%);
  margin-top: 5px;
  text-align: center;
  font-size: 14px;
  font-weight: 400 !important;
  line-height: 1.2;
  white-space: nowrap;
  pointer-events: none;
}
/* MOBILE */
@media (max-width: 767px) {
  .g-logo.g-logo-helium {
    position: relative;
    margin-bottom: 15px;
  }
  .g-logo.g-logo-helium img {
    display: block;
    margin-left: auto;
    margin-right: auto;
  }
  .g-logo.g-logo-helium::after {
    content: "Abteilung Fußball";
    position: absolute;
    top: 100%;
    left: 50%;
    width: max-content;
    transform: translateX(-50%);
    margin-top: 3px;
    white-space: nowrap;
    font-size: 13px;
    font-weight: 400 !important;
    text-transform: none !important;
    line-height: 1.2;
    pointer-events: none;
  }
}
/* -----------------------------------------
   JL Logo Advanced – Originalfarben erzwingen
   ----------------------------------------- */
.jl-svg {
  fill: #000000 !important;
}
/* Blau */
.jl-svg path[style*="fill:rgb(0,102,204)"] {
  fill: #0066CC !important;
}
/* Gelb */
.jl-svg path[style*="fill:rgb(255,255,0)"] {
  fill: #FFFF00 !important;
}
/* Weiß */
.jl-svg path[style*="fill:white"] {
  fill: #FFFFFF !important;
}
/* Elemente ohne eigene Farbe = Schwarz */
.jl-svg path:not([style*="fill"]), .jl-svg rect:not([style*="fill"]) {
  fill: #000000 !important;
}
/* -----------------------------------------
   Spacer für Navigation 
   ----------------------------------------- */
/* Desktop-Navigation: unsichtbar, Platz bleibt erhalten */
.g-main-nav li.g-menu-item-390 {
  visibility: hidden;
}
/* Mobile Navigation: Spacer vollständig entfernen */
#g-mobilemenu-container li.g-menu-item-390 {
  display: none !important;
}
/*# sourceMappingURL=custom_60.css.map */