.elementor-3267 .elementor-element.elementor-element-21ea834{margin-top:50px;margin-bottom:50px;}.elementor-widget-slides .elementor-slide-heading{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-size:var( --e-global-typography-primary-font-size );font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-slides .elementor-slide-description{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-size:var( --e-global-typography-secondary-font-size );font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-slides .elementor-slide-button{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-size:var( --e-global-typography-accent-font-size );font-weight:var( --e-global-typography-accent-font-weight );}.elementor-3267 .elementor-element.elementor-element-a78c250 .elementor-repeater-item-a7ac83a .swiper-slide-bg{background-color:var( --e-global-color-c9737f2 );background-image:url(https://serkowitzer-fsv.de/wordpress/wp-content/uploads/2025/11/Startseite_2-scaled.jpg);background-size:cover;}.elementor-3267 .elementor-element.elementor-element-a78c250 .elementor-repeater-item-95b015b .swiper-slide-bg{background-color:var( --e-global-color-c9737f2 );background-image:url(https://serkowitzer-fsv.de/wordpress/wp-content/uploads/2025/11/Startseite-2-1-scaled.jpg);background-size:cover;}.elementor-3267 .elementor-element.elementor-element-a78c250 .elementor-repeater-item-6db19b4 .swiper-slide-bg{background-color:var( --e-global-color-c9737f2 );background-image:url(https://serkowitzer-fsv.de/wordpress/wp-content/uploads/2025/10/IMG_1113.png);background-size:cover;}.elementor-3267 .elementor-element.elementor-element-a78c250 .swiper-slide{transition-duration:calc(5000ms*1.2);height:500px;}.elementor-3267 .elementor-element.elementor-element-a78c250{width:100%;max-width:100%;}.elementor-3267 .elementor-element.elementor-element-a78c250 > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-3267 .elementor-element.elementor-element-a78c250 .swiper-slide-contents{max-width:100%;}.elementor-3267 .elementor-element.elementor-element-a78c250 .swiper-slide-inner{padding:0px 0px 0px 0px;text-align:center;}.elementor-3267 .elementor-element.elementor-element-7ef9318 > .elementor-widget-container{padding:0px 200px 0px 200px;}@media(max-width:1366px){.elementor-widget-slides .elementor-slide-heading{font-size:var( --e-global-typography-primary-font-size );}.elementor-widget-slides .elementor-slide-description{font-size:var( --e-global-typography-secondary-font-size );}.elementor-widget-slides .elementor-slide-button{font-size:var( --e-global-typography-accent-font-size );}}@media(max-width:1024px){.elementor-widget-slides .elementor-slide-heading{font-size:var( --e-global-typography-primary-font-size );}.elementor-widget-slides .elementor-slide-description{font-size:var( --e-global-typography-secondary-font-size );}.elementor-widget-slides .elementor-slide-button{font-size:var( --e-global-typography-accent-font-size );}}@media(max-width:767px){.elementor-widget-slides .elementor-slide-heading{font-size:var( --e-global-typography-primary-font-size );}.elementor-widget-slides .elementor-slide-description{font-size:var( --e-global-typography-secondary-font-size );}.elementor-widget-slides .elementor-slide-button{font-size:var( --e-global-typography-accent-font-size );}}@media(min-width:2400px){.elementor-widget-slides .elementor-slide-heading{font-size:var( --e-global-typography-primary-font-size );}.elementor-widget-slides .elementor-slide-description{font-size:var( --e-global-typography-secondary-font-size );}.elementor-widget-slides .elementor-slide-button{font-size:var( --e-global-typography-accent-font-size );}}/* Start custom CSS for html, class: .elementor-element-50a22e6 *//* GRÜNER BANNER */
.sfv-welcome-banner {
  position: absolute;   /* WICHTIG: ermöglicht freie Platzierung */
  
  /* <<< HIER stellst du selbst ein, WO der Banner sitzt >>> */
  top: -10px;            /* vertikale Position */
  left: 0px;           /* horizontale Position */
  /* Du kannst auch right: oder bottom: benutzen */

  background: #057A34;
  color: #ffffff;
  font-size: 26px;
  font-weight: 700;
  padding: 12px 45px 12px 30px;
  z-index: 99;
  border-radius: 6px;
  white-space: nowrap;
  box-shadow: 0 4px 12px rgba(0,0,0,0.2);
}

/* SPITZE RECHTS */
.sfv-welcome-banner::after {
  content: "";
  position: absolute;
  top: 0;
  right: -40px; /* VERSCHIEBT die Pfeilspitze */
  width: 0;
  height: 0;
  border-top: 30px solid transparent;
  border-bottom: 30px solid transparent;
  border-left: 40px solid #057A34;
}/* End custom CSS */
/* Start custom CSS *//* === HERO-SLIDER GRUNDLAYOUT === */
.sfv-hero-slider {
  position: relative;
  width: 100%;
  height: 380px;
  overflow: hidden;
}

/* Slides übereinander legen */
.sfv-hero-slides {
  position: relative;
  width: 100%;
  height: 100%;
}

.sfv-hero-slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity 0.6s ease-in-out;
}

.sfv-hero-slide.is-active {
  opacity: 1;
}

.sfv-hero-slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* === HERO-BANNER wie im Screenshot === */
.sfv-hero-title {
  position: absolute;
  top: 0;                    /* direkt am oberen Bildrand */
  left: 0;                   /* links bündig */
  background: #057A34;
  color: white;
  font-size: 28px;
  font-weight: 700;
  padding: 12px 50px 12px 30px;
  z-index: 5;
  display: inline-block;
  white-space: nowrap;
}

/* Schräger Pfeil genau an der Oberkante */
.sfv-hero-title::after {
  content: "";
  position: absolute;
  top: -10;                   /* Pfeil sitzt jetzt GENAU an der oberen Bildkante */
  right: -55px;             /* Länge des Pfeils */
  width: 0;
  height: 0;
  border-left: 55px solid #057A34;
  border-top: 34px solid transparent;
  border-bottom: 34px solid transparent;
}


/* schräg abgeschnittene rechte Seite des Banners */
.sfv-hero-title::after {
  content: "";
  position: absolute;
  top: 0;
  right: -40px;
  width: 0;
  height: 0;
  border-left: 40px solid #057A34;
  border-top: 32px solid transparent;
  border-bottom: 32px solid transparent;
}


.sfv-hero-nav {
  position: absolute;
  top: 0;                           /* Pfeil an der oberen Kante */
  width: 50px;                      /* weiße flache Box */
  height: 80px;                     /* Höhe wie im Screenshot */
  background: rgba(255, 255, 255, 0.85);
  border: none;
  color: #057A34;                   /* Pfeilfarbe */
  font-size: 50px;                  /* ähnlich groß wie im Bild */
  font-weight: bold;
  line-height: 1;
  cursor: pointer;
  z-index: 5;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-bottom: 10px;             /* Pfeil leicht nach unten versetzen */
  opacity: 1;
}

.sfv-hero-nav--prev {
  left: 0;                           /* am linken Rand */
}

.sfv-hero-nav--next {
  right: 0;                          /* am rechten Rand (falls gebraucht) */
  transform: scaleX(-1);             /* Pfeil spiegeln */
}

.sfv-hero-nav:hover {
  background: #ffffff;               /* heller beim Hover */
}


/* Dots kannst du bei Bedarf ausblenden */
.sfv-hero-dots {
  display: none;
}

/* Responsive Anpassung */
@media (max-width: 768px) {
  .sfv-hero-slider {
    height: 260px;
  }

  .sfv-hero-title {
    font-size: 20px;
    padding: 8px 32px 8px 18px;
  }

  .sfv-hero-title::after {
    border-top-width: 26px;
    border-bottom-width: 26px;
    right: -32px;
    border-left-width: 32px;
  }

  .sfv-hero-nav {
    width: 32px;
    height: 48px;
    font-size: 28px;
  }
}/* End custom CSS */