/*
	Copyright 2026 | DragonPilot alias Alexander, Thomas Niesner | IT seit 1997
	Handgemachtes anstatt ständige Fixes und oder Bug Fehlersuche | statische Webseiten 
	seit internet beginns |  ex Unternehmung "die-netzwerk-macher.de" ob nun Inviduelle
	Programmierung oder Templates CMS Optimierungen Wordpress; Drupal; Burning Board;
	Woltlab Suite; Jomla; oder sonstige Exoten - somit diese TLD Webseite(n) 
	die-foto-macher.de | fpv-de.com, beginn 2026 - 8 Phase TGv1.8 <stable> !
	
	Desktop + Mobile class in Meldung BKA | Datenveränderung zum 12 Male in 6 Jahren an selbiger Stelle
	August 2026 | Keine Änderung, erst nach Sichten Betrachtung "durch Zufall auf dem Smartphone" in
	Schutz Anpassung. --> 
	Existenz Zerstörung : "die-netzwerk-macher.de/referenzen & die-netzwerk-macher.de/kd7"
*/
/* my Pilot contruct */
/* font-family: Arial, Helvetica, sans-serif; */
/* Grund Schriftsatz */
@font-face {
  font-family: Arial, Helvetica, sans-serif;
  font-style: normal;
}
body, html {
  font-family: Arial, Helvetica, sans-serif;
  font-style: normal;
}
/* end of : Grund Schriftsatz */
/* Farben Verweise */
/* Wählt alle Links, die nicht auf die eigene Domain zeigen //  :not([id^="BildLink"]):not([href^="/"]):not([href^="tel:"]) \\ */
a:not([href^="https://die-foto-macher.de"]):not([href^="https://ftp-v.de"]):not([href^="#"]):not([href^="mailto:"]):not([name^="*"]) {
  /* Fügt ein Icon nach dem Link ein */
  position: relative; /* Notwendig für die Positionierung von ::after */
  text-decoration: none;
  color:#1c71d8;
}
a:not([href^="https://die-foto-macher.de"]):not([href^="https://ftp-v.de"]):not([name^="*"]):not([href^="/"]):not([href^="#"]):not([href^="mailto:"]):not([target^="_blank:"]):not([href^="tel:"])::after {
  /* content: "  \f08e"; abgeschaltet */ /* Oder ein anderes Icon über content */
  font-size: 0.8em;
  text-decoration: none;
  color: #00B2EE;
}
/* Styling für die Link-Hover-Ansicht */
a:not([href^="https://die-foto-macher.de"]):not([href^="https://ftp-v.de"]):not([href^="/"]):not([href^="#"]):not([href^="mailto:"]):not([href^="tel:"]):hover {
  text-decoration: underline;
  color: #EE2C2C;
}
a[href="/"]:hover{
  font-family:FontAwesome;
  /* font-size:10px; */
  content:" \f08e";
  color: #EE2C2C;
} 
a.external {
  color: red;
}
.Lupe {
        text-decoration: none;
        color: blue;
        font-weight: bold;
    }
.Lupe:hover {
        /* Ändert den Zeiger zur Lupe */
        cursor: zoom-in;
        /* Optional: Link farblich hervorheben */
        color: red;
}
/* end of : Wählt alle Links, die nicht auf die eigene Domain zeigen */
/* Outline */
.OutShadow H1,H3 {
   font-family:Arial, Helvetica, sans-serif;
   text-stroke-color:#1c71d8;
   text-stroke-width:1px;
   -webkit-text-stroke-color:#1c71d8;
   -webkit-text-stroke-width:1px;
}
/* Outline+Shatten */
/* Schriftgrösse H2 */
h2 {
  font-size: 2.5em;     /* skaliert mit der Schriftgröße */
  line-height: 1.2;      /* ohne Einheiten, skaliert mit der Schriftgröße */
  /* padding: 0.5em; */  /*  1em; | 0.5em;| relativ zur Schriftgröße */
}
/* Ende : Schriftgrösse H2 */
/* Content abstandhalter */
.abstandhalter {
  width:100%;
  height:6vh; 
  max-height:8vh;
  aspect-ratio: 25 / 1;
 /*  border:1px solid yellow; */
}
/* end of : Content abstandhalter */
.PSYCHO {
    text-decoration: none;
    color:#1c71d8;
}
.PSYCHO a{
    text-decoration: none;
    color:#1c71d8;
}
/* Meine 2 | 3 Spalten CSS Boxen */
#netbox {
 width:100%;
  display: flex;	
  display: -webkit-flex;
  display: -ms-flex;
  display: flex;
  /* -webkit-flex-wrap: wrap; */
  /* -ms-flex-wrap: wrap; */
  /* flex-wrap: wrap; */
  flex-wrap: wrap;
	flex-basis: auto;
    text-decoration: none;
}
.net {
 float: left;
 width: 32%;
 margin-right: 2%;
 padding: 4px;
 background: transparent;
 box-sizing: border-box;
    text-decoration: none;
}
.netExtra:hover {
  transform: perspective(1000px) scaleZ(3) rotateX(45deg);
    text-decoration: none;
}
.net:last-child {
     margin-right: 0;
    text-decoration: none;
}
.netspecial {
 float: left;
 width: 32%;
 margin-right: 2%;
 padding: 4px;
 background: transparent;
 box-sizing: border-box;
    text-decoration: none;
}
.netspecialExtra:hover {
  transform: perspective(1000px) scaleZ(3) rotateX(45deg);
    text-decoration: none;
}
.netspecial:last-child {
     margin-right: 0;
    text-decoration: none;
}
.netforum {
 float: left;
 width: 48%;
 margin-right: 2%;
 padding: 4px;
 background: transparent;
 box-sizing: border-box;
    text-decoration: none;
}
.netforumExtra:hover {
  transform: perspective(1000px) scaleZ(3) rotateX(45deg);
    text-decoration: none;
}
.netforum:last-child {
     margin-right: 0;
    text-decoration: none;
}
#netMyPilot {
 width:100%;
  display: flex;	
  display: -webkit-flex;
  display: -ms-flex;
  display: flex;
  /* -webkit-flex-wrap: wrap; */
  /* -ms-flex-wrap: wrap; */
  /* flex-wrap: wrap; */
  flex-wrap: wrap;
	flex-basis: auto;
  padding:14px;
  background-image:url('https://medien.die-foto-macher.de/myPilot/airbrushStreetWorker.jpg');
  background-size: cover; /* Skaliert das Bild, um den Container zu bedecken, ohne Verzerrung */
  background-position: center; /* Zentriert das Bild */
  background-repeat: no-repeat; /* Verhindert Wiederholung des Bildes */
  display: flex; /* Für Inhalts-Zentrierung */
    text-decoration: none;
  justify-content: center;
  align-items: center;
  z-index: 999;
}
.netMyPilot {
 float:left;
 width:49.99%;
 background:transparent;
 box-sizing:border-box;
    text-decoration: none;
}
.netMyPilotExtra:hover {
  transform:perspective(1000px) scaleZ(3) rotateX(45deg);
    text-decoration: none;
}
.netMyPilot:last-child {
     margin-right:0;
    text-decoration: none;
}
.MyPilotNET  {
 width:100%;
  display: flex;	
  display: -webkit-flex;
  display: -ms-flex;
  display: flex;
  /* -webkit-flex-wrap: wrap; */
  /* -ms-flex-wrap: wrap; */
  /* flex-wrap: wrap; */
  flex-wrap: wrap;
	flex-basis: auto;
  padding:14px;
  background-image:url('https://medien.die-foto-macher.de/myPilot/airbrushWorks.jpg');
  background-size: cover; /* Skaliert das Bild, um den Container zu bedecken, ohne Verzerrung */
  background-position: center; /* Zentriert das Bild */
  background-repeat: no-repeat; /* Verhindert Wiederholung des Bildes */
  display: flex; /* Für Inhalts-Zentrierung */
    text-decoration: none;
  justify-content: center;
  align-items: center;
  z-index: 999;
}
#netMyPilotSpezial {
 width:100%;
  display: flex;	
  display: -webkit-flex;
  display: -ms-flex;
  display: flex;
  /* -webkit-flex-wrap: wrap; */
  /* -ms-flex-wrap: wrap; */
  /* flex-wrap: wrap; */
  flex-wrap: wrap;
	flex-basis: auto;
  padding:8px;
  background-image:url('https://medien.die-foto-macher.de/myPilot/airbrushStreetWorker.jpg');
  background-size: cover; /* Skaliert das Bild, um den Container zu bedecken, ohne Verzerrung */
  background-position: center; /* Zentriert das Bild */
  background-repeat: no-repeat; /* Verhindert Wiederholung des Bildes */
  display: flex; /* Für Inhalts-Zentrierung */
    text-decoration: none;
  justify-content: center;
  align-items: center;
  z-index: 999;
}
.netMyPilotSpezial {
 float:left;
 width:100%;
 background:transparent;
 box-sizing:border-box;
    text-decoration: none;
}
.netMyPilotSpezialExtra:hover {
  transform:perspective(1000px) scaleZ(3) rotateX(45deg);
    text-decoration: none;
}
.netMyPilotSpezial:last-child {
     margin-right:0;
    text-decoration: none;
}
/* NETBOX 3 BOXEN spezieal mit Schatten für das Artikel System */
/* TG v1.7 */
#netartbox {
 width:100%;
  display: flex;	
  display: -webkit-flex;
  display: -ms-flex;
  display: flex;
  /* -webkit-flex-wrap: wrap; */
  /* -ms-flex-wrap: wrap; */
  /* flex-wrap: wrap; */
  flex-wrap: wrap;
	flex-basis: auto;
    text-decoration: none;
}
.netart {
 float: left;
 width: 32%;
 margin-right: 2%; 
 padding:18px;
 box-sizing: border-box;
 border: 1px solid rgba(255,255,255,.15);
 background: linear-gradient(180deg, #131313 0%, 0d0d0d 100%);
 box-shadow: 0 4px 14px rgba(0,0,0,.45);
 border-radius:11px;
    text-decoration: none;
}
.netart:last-child {
     margin-right: 0;
    text-decoration: none;
}
.netart:hover {
  animation: vibrieren 0.3s ease-in-out both;
    text-decoration: none;
}
/* Div box hover effekt - Sanftes Wacken bei Mouseover */
/* .netart:hover {  
  /* Sorgt für ein sanftes Ein- und Ausblenden der Box-Farbe */
/*  transition: background-color 0.4s ease; 
  /* Startet die Wackel-Animation */
/*  animation: wackeln 1.8s ease-in-out infinite;
} */
@keyframes vibrieren {
  0% { transform: translate(0, 0); }
  20% { transform: translate(-4px, 2px); }
  40% { transform: translate(4px, -2px); }
  60% { transform: translate(-4px, -1px); }
  80% { transform: translate(4px, 2px); }
  100% { transform: translate(0, 0); }
}
/* Definiert den Wackeleffekt (Drehung nach links und rechts) */
@keyframes wackeln {
  0%, 100% {
    transform: rotate(0deg);
  }
  25% {
    transform: rotate(-3deg);
  }
  75% {
    transform: rotate(3deg);
  }
}
.netspecial {
 float: left;
 width: 32%;
 margin-right: 2%;
 padding: 4px;
 background: transparent;
 box-sizing: border-box;
    text-decoration: none;
}
.netartspecialExtra:hover {
  transform: perspective(1000px) scaleZ(3) rotateX(45deg);
    text-decoration: none;
}
.netartspecial:last-child {
     margin-right: 0;
    text-decoration: none;
}
.netart:last-child {
     margin-bottom: 0;
    text-decoration: none;
}
.netartforum {
 float: left;
 width: 48%;
 margin-right: 2%;
 padding: 4px;
 background: transparent;
 box-sizing: border-box;
    text-decoration: none;
}
.netartforumExtra:hover {
  transform: perspective(1000px) scaleZ(3) rotateX(45deg);
    text-decoration: none;
}
.netartforum:last-child {
     margin-right: 0;
    text-decoration: none;
}
/* Avartar + Header oder Inhalt + Menue */
#artSPEZbox { 
    width:100;display:
    flex;display:-webkit-flex;
    display:-ms-flex;
    display:flex;
    flex-wrap:wrap;
    flex-basis:auto; 
    text-decoration: none;
}
.artSPEZ2 { 
    float:right;
    width:90%;
    margin-left:0.2%;
    margin-right:0.8%;
    padding:4px;
    box-sizing:border-box; 
    text-decoration: none;
}
.artSPEZ2:last-child {
    margin-right:0;
    text-decoration: none;
}
.artSPEZ1 { 
    float:left;width:10%;
    margin-left:1%;
    margin-right:1%;
    padding:4px;
    box-sizing:border-box;
    height:auto; 
    text-decoration: none;
}
.artSPEZ1:last-child {
    margin-right:0%;
    text-decoration: none;
}
/* end of : Avartar + Header oder Inhalt + Menue */
/* HR Mittig */
.trenner-mit-text {
  display: flex;
  align-items: center;
  border: 0;
  text-align: center;
  color: #1c71d8; /* Textfarbe */
  margin: 2rem 0;
}
.trenner-mit-text::before,
.trenner-mit-text::after {
  content: "";
  flex: 1;
  border-bottom: 2px solid #1c71d8; /* Linienfarbe und -dicke */
}
.trenner-mit-text::before {
  margin-right: 1rem; /* Abstand zwischen Text und linker Linie */
}
.trenner-mit-text::after {
  margin-left: 1rem; /* Abstand zwischen Text und rechter Linie */
}
.trenner-mit-text::after::before {
  content: attr(data-content);
}
/* end of : HR Mittig */
/* Artikel Übersicht + Einzel Übersicht */
/* TG v1.7 */
#artikel-liste{
  display:block;
}
#artikel-view{
  display:block;
  width:100%;
  /* max-width:1200px; */
  margin:0 auto;
  padding:8px;
  box-sizing:border-box;
}
.artikel-link{
  display:block;
  color:inherit;
  text-decoration:none;
}
.artikel-link:hover{
  cursor:pointer;
}
.artikel-teaser{
    width:100%;
    max-height:340px;
    object-fit:cover;
    display:block;
    margin-bottom:15px;
}
/* Der Behälter hält die Avatare zusammen */
.avatar-container {
  position: relative;
  width: 100px; /* Die Größe Ihres Avatars */
  height: 100px;
}
/* Gemeinsames Aussehen für beide Bilder (z.B. rund und mit weißem Rahmen) */
.avatar-container img {
  max-width: 100%;
  height: auto;
  border-radius: 50%; /* Macht die Bilder rund */
  border: 1px solid #ffffff; /* Weißer Rand zur Trennung */
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2); /* Ein leichter Schatten */
}
.article-content,.article-content * {
    max-width: 100%;
    overflow-wrap: break-word;
    word-wrap: break-word;
    word-break: break-word;
    box-sizing: border-box;
}
.article-content img {
    max-width: 90%;
    height: auto;
    display: block;
    margin: 20px auto;
}
/* Das obere Bild wird absolut über das untere Bild gelegt */
.avatar-top {
  position: absolute;
  top: 0;
  left: 35px; /* Verschiebt das obere Bild nach rechts, damit sie sich überlappen */
  width: 70%; /* Macht den oberen Avatar etwas kleiner */
  height: 70%;
  z-index: 10; /* z-index bestimmt, dass dieses Bild ganz oben liegt */
}
.avatar-bottom {
  position: absolute;
  top: 0;
  left: 35px; /* Verschiebt das obere Bild nach rechts, damit sie sich überlappen */
  width: 70%; /* Macht den oberen Avatar etwas kleiner */
  height: 70%;
  z-index: 10; /* z-index bestimmt, dass dieses Bild ganz oben liegt */
}
.artikel-mehr{
    text-align:right;
    margin-top:15px;
}
.artikel-mehr a{
    display:inline-block;
    padding:8px 14px;
    border:1px solid #666;
    border-radius:6px;
    text-decoration:none;
    transition:0.2s;
}
.artikel-mehr a:hover{
    transform:scale(1.05);
}
.mobile-break {
    display: none;
}
@media (max-width: 600px) {
    .mobile-break {
        display: block;
    }
}
/* Teaser + Overlay für Artikel */
.teaser-box{
    position:relative;
    overflow:hidden;
}
.teaser-title{
    position:absolute;
    left:0;
    right:0;
    bottom:0;
    padding:10px 14px 14px 14px;
    background:rgba(0,0,0,.55);
    color:#ffffff;
    font-size:1.35rem;
    font-weight:bold;
    text-shadow:1px 1px 3px #000;
}
.tg-online-dot {
    color: #00a000;
    font-size: 0.55em;
    vertical-align: 0.12em;
}
.tg-online-status {
    position: relative;
}

.tg-online-hover {
    position: relative;
    display: inline-block;
}

.tg-online-dot {
    color: #00a000;
    font-size: 0.55em;
    vertical-align: 0.12em;
}

.tg-online-off {
    opacity: 0;
}
.tg-online-Online {
    color:GREEN;
    font-size: 0.88em;
    vertical-align: 0.12em;
}
.tg-online-Offline {
    color:RED;
    font-size: 0.88em;
    vertical-align: 0.12em;
}
.tg-online-users {
    display: none;

    position: absolute;
    left: 50%;
    top: 100%;
    transform: translateX(-50%);

    margin-top: 4px;
    padding: 4px 6px;

    white-space: nowrap;
    z-index: 9999;

    background: #111;
    border: 1px solid #555;
}

.tg-online-hover:hover .tg-online-users {
    display: flex;
}

.tg-online-user {
    display: inline-flex;
    align-items: center;

    gap: 4px;

    text-decoration: none;
}

.tg-online-avatar {
    width: 14px;
    height: 14px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: #00a000;
    color: #000;

    font-size: 8px;
    line-height: 14px;
}

.tg-online-name {
    white-space: nowrap;
}
/* end of : Teaser + Overlay für Artikel */
.artikel-title {
    position:absolute;
    bottom:0;
}
/* ================================================= */
/* Step 7 Einzelansicht */
/* ================================================= */
.artikel-single-title{
    margin:18px 0 8px;
    font-size:2rem;
    font-weight:bold;
    color:#ffffff;
    line-height:1.25;
}

.artikel-meta{
    margin-bottom:18px;
    font-size:13px;
    color:#9a9a9a;
    letter-spacing:0.3px;
}
.artikel-datum {
    position:relative;
    font-size:13px;
    color:#9a9a9a;
    margin:8px 0 12px;
    letter-spacing:0.3px;
}
/* Überschrift mit Avartar */
.header-box {
    display: flex;
    width: 100%;
    background: #000;
    border: 1px solid #2a2a2a;
    box-shadow: 0 0 8px rgba(255,255,255,0.08);
    padding: 10px;
    box-sizing: border-box;
    overflow:hidden;
}
.avatar-box {
    width: 15%;
    text-align: center;
}
.avatar-box img {
    width: 100%;
    max-width: 120px;
    height: auto;
    display: block;
    margin: 0 auto;
}
.content-box {
    position: relative;
    width: 85%;
    padding-left:20px;
    box-sizing: border-box;
    z-index: 10;
}
.content-box h1 {
    margin: 0 0 10px 0;
    font-size: 2rem;
}
.content-box p {
    margin: 0;
}
@media (max-width:1024px){
    .avatar-box{
        width:16%;
    }
    .avatar-box img{
        width:14%;
        padding:8px;
    }
    .content-box{
        width:78%;
        padding-left:8px;
    }
    .content-box h1{
        font-size:1.1rem;
    }
    .content-box p{
        font-size:.82rem;
    }
}
@media (max-width:768px){
    .avatar-box{
        width:16%;
    }
    .avatar-box img{
        width:14%;
        padding:8px;
    }
    .content-box{
        width:78%;
        padding-left:8px;
    }
    .content-box h1{
        font-size:1.1rem;
    }
    .content-box p{
        font-size:.82rem;
    }
}
@media (max-width:480px){
    .avatar-box{
        width:20%;
    }
    .avatar-box img{
        width:14%;
        padding:8px;
    }
    .content-box{
        width:80%;
        padding-left:6px;
    }
    .content-box h1{
        font-size:1.25rem;
        line-height:1.1;
    }
    .content-box p{
        font-size:.80rem;
    }
}
/* end of : Überschrift mit Avartar */
/* ============================= */
/* Step 7.5 Einzelansicht Overlay */
/* ============================= */
.single-overlay{
    position:absolute;
    left:0;
    right:0;
    bottom:0;
    padding:10px 14px 8px 14px;
    background:rgba(0,0,0,.55);
    color:#fff;
}
.single-overlay-title{
    font-size:1.55rem;
    font-weight:bold;
    text-shadow:1px 1px 3px #000;
    margin-bottom:4px;
}
.single-overlay-meta{
    font-size:0.78rem;
    color:#d7d7d7;
    letter-spacing:.3px;
    margin-bottom:8px;
}
/* Artikel Index Sicht (Boxen) */
.teaser-meta{
    font-size:0.78rem;
    color:#d7d7d7;
    margin-top:4px;
    margin-bottom:6px;
}
/* ----------------------------------------------------
   Artikel Bilder Markdown
   MD Syntax:
   ![right:320:Beschreibung](bild.webp)
   ![left:320:Beschreibung](bild.webp)
   ![center:640:Beschreibung](bild.webp)
---------------------------------------------------- */
.img-right {
    float: right;
    max-width: 100%;
    height: auto;
    margin: 0 0 15px 20px;
}
.img-left {
    float: left;
    max-width: 100%;
    height: auto;
    margin: 0 20px 15px 0;
}
.img-center {
    display: block;
    max-width: 100%;
    height: auto;
    margin: 20px auto;
}
.img-right,.img-left,.img-center {
    cursor: zoom-in;
    max-width: 100%;
    height: auto;
}
@media (max-width: 700px) {
    .img-right,.img-left {
        float: none;
        display: block;
        max-width: 100%;
        margin: 20px auto;
    }
}
/* Videos einzelner Autoren */
.video-link {
    display: block;
    max-width: 720px;
    margin: 20px auto;
}
.video-link img {
    width: 100%;
    height: auto;
}
/* ----------------------------------------------------
   Video Box
---------------------------------------------------- */
.video-box {
    margin: 25px 0;
    padding: 15px;
    text-align: center;
}
.video-box a {
    display: inline-block;
    padding: 10px 20px;
    text-decoration: none;
}
/* Video Modal Artikel */
/* MODALES VIDEO FENSTER */
#video.video-modal {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.75);
    z-index: 9999;
}
#video.video-modal.video-open {
    display: block;
}
#video .video-modal-content {
    position: relative;
    max-width: 1024px;
    margin: 5% auto;
    padding: 25px;
    background: #111;
    /* Video Gross TEST */ 
    color: #ffffff; /* Weißer Text für gute Lesbarkeit */
    box-shadow: 0 0 12px rgba(255, 255, 255, 0.55);
    border-radius: 12px;
    /* Video Gross TEST */
    color: #fff;
    border-radius: 10px;
}
#video-player {
    display: block;
    width: 100%;
    max-width: 1024px;
    height: auto;
}
#video .video-close {
    position: absolute;
    right: 15px;
    top: 10px;
    font-size: 28px;
    color: white;
    cursor: pointer;
}
/* Ende MODALES VIDEO FENSTER */
/* end of : Video Modal Artikel */
#video.video-open {
    display: block;
}
/* end of : Videos einzelner Autoren */
/* ----------------------------------------------------
   YouTube Modal Artikel
---------------------------------------------------- */
#youtube.video-modal {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.75);
    z-index: 9999;
}
#youtube.video-modal.video-open {
    display: block;
}
#youtube .video-modal-content {
    position: relative;
    width: 90%;
    max-width: 1024px;
    margin: 5% auto;
    padding: 25px;
    background: #111;
    color: #fff;
    border-radius: 10px;
}
#youtube-player {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
    border: 0;
}
#youtube .youtube-close {
    position: absolute;
    right: 15px;
    top: 10px;
    font-size: 28px;
    color: white;
    cursor: pointer;
}
/* Ende YouTube Modal Artikel */
pre.tg-code-text {
    white-space: pre;
}
pre.tg-code-text code.language-text {
    white-space: pre;
}
/* Funktionierte nicht //  pre {
    white-space: pre;
    overflow-x: auto;
}
pre code {
    white-space: inherit;
} */ 
/* Tech Guide Checklisten Modul MD */
.chkKopf {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}
.chkKopf h1 {
    margin: 0;
}
.chkAusgabe {
    display: flex;
    gap: 8px;
    align-items: center;
}
.chkAusgabe a,
.chkAusgabe button {
    display: inline-block;
    padding: 5px 10px;
    border: 1px solid #ccc;
    background: #f5f5f5;
    text-decoration: none;
    cursor: pointer;
    font-size: 14px;
}
/* TG CHK - Checklisten-Auswahl */
.chkAuswahl {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 20px;
    align-items: center;
}
.chkAuswahl a {
    display: inline-block;
    padding: 6px 12px;
    border: 1px solid #ccc;
    background: #f5f5f5;
    text-decoration: none;
    cursor: pointer;
    font-size: 14px;
}
.chkAuswahl a:hover {
    background: #e5e5e5;
}
.tg-checkliste ul {
    padding-left: 0;
    margin-left: 0;
}
.tg-checkliste li {
    list-style: none;
}
.chkAusgabe {
    display: flex;
    gap: 10px;
    margin-top: 20px;
    align-items: center;
}
.chkAusgabe a,
.chkAusgabe button {
    display: inline-block;
    padding: 6px 12px;
    border: 1px solid #ccc;
    background: #f5f5f5;
    text-decoration: none;
    cursor: pointer;
    font-size: 14px;
}
.chkAusgabe a:hover,
.chkAusgabe button:hover {
    background: #e5e5e5;
}
@media print {

    @page {
        size: A4 portrait;
        margin: 8mm;
    }

    /* Alles zunächst unsichtbar */
    body * {
        visibility: hidden !important;
    }

    /* Nur die Checkliste sichtbar */
    .pNETCheck,
    .pNETCheck * {
        visibility: visible !important;
    }

    /* Checkliste an den Druckanfang setzen */
    .pNETCheck {
        position: absolute !important;
        left: 0 !important;
        top: 0 !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    /* Druckbuttons nicht mitdrucken */
    .chkAusgabe {
        display: none !important;
    }
    /* CHK Navigation nicht drucken */
    .articleNavigation,
    .articleNavigation * {
        display: none !important;
    }
    /* TG-Abstand entfernen */
    .pNETCheck .abstandhalter {
        display: none !important;
    }

    /* Überschrift nicht vom folgenden Inhalt trennen */
    h1,
    h2,
    h3,
    h4 {
        break-after: avoid !important;
        page-break-after: avoid !important;
    }

    h1 + ul,
    h2 + ul,
    h3 + ul,
    h4 + ul {
        break-before: avoid !important;
        page-break-before: avoid !important;
    }

    li {
        break-inside: avoid !important;
        page-break-inside: avoid !important;
    }
}
/* PDF Dom */
ul {
    padding-left: 0;
    margin-top: 4px;
    list-style: none;
}
ul ul {
    list-style: none;
}
h2 {
    page-break-after: avoid;
}
/* end of : Tech Guide Checklisten Modul MD */
/* Artikel Texte Inhalts Darstellung / Formatierung */
.artikel-text {
    white-space: normal;
    overflow-wrap: break-word;
}
.artikel-text code {
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
}
.artikel-text ul {
    margin: 1rem 0;
    padding-left: 1.5rem;
}
.artikel-text li {
    margin-bottom: 0.5rem;
    line-height: 1.5;
}
.artikel-text table {
    width: 100%;
    border-collapse: collapse;
    margin: 1.5rem 0;
    display: block;
    overflow-x: auto;
}
.artikel-text th,.artikel-text td {
    padding: 10px 14px;
    text-align: left;
    vertical-align: top;
    white-space: normal;
}
.artikel-text th {
    font-weight: bold;
}
/* externe Links */
a.external-link {
    color:#1c71d8;
}
a.external-link:hover {
    text-decoration: underline;
    color:#EE2C2C;
}
.external-link-icon::after {
    font-family: FontAwesome;
    font-size: 10px;
    color:#00B2EE;
    content:" \f08e";
}
/* end of : Artikel Texte Inhalts Darstellung / Formatierung */
/* ============================= */
/* Step 6.5.5 Artikel Navigation */
/* ============================= */
.artikel-navigation {
    width: 100%;
    text-align: center;
    margin-top: 30px;
    margin-bottom: 30px;
}
.nav-button {
    display: inline-block;
    padding: 10px 18px;
    margin: 5px;
    border: 1px solid #555;
    border-radius: 6px;
    background: #111;
    color: #ddd;
    text-decoration: none;
    transition: 0.3s;
}
.nav-button:hover {
    transform: scale(1.05);
}
/* Externe-Link-Styling nicht auf das FPV-DE Menü anwenden */
.nav {
    /* deine Navigation */
}
.nav a {
    color: #1c71d8;
}
.nav a:hover {
    color: #EE2C2C;
}
nav.menu a {
    color: inherit;
}
nav.menu a:hover {
    color: inherit;
}
.menu a {
    color: inherit;
}
.menu a:hover {
    color: inherit;
}
/* ============================= */
/* Step 8 Artikel Navigation */
/* ============================= */
.navigation{
    display:flex;
    justify-content:space-between;
    align-items:center;
}
.articleNavigation {
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-top:40px;
    padding-top:20px;
    border-top:1px solid #333;
}
.articleBack a {
    color:#ccc;
    text-decoration:none;
}
.articleBack a:hover {
    color:#fff;
}
.articleLinks {
    display:flex;
    gap:10px;
}
.articleLinks a {
    color:#ccc;
    text-decoration:none;
    min-width:28px;
    text-align:center;
}
.articleLinks a:hover {
    color:#fff;
}
.articleLinks .active {
    background: #111;
    color: #ddd;
    font-weight:bold;
    min-width:28px;
    text-align:center;
}
.listSort {
    display:flex;
    justify-content:center;
    gap:10px;
        margin:20px 0 16px;
}
.listSort a, .listSort .active {
    padding:4px 10px;
    text-decoration:none;
    border-radius:4px;
}
.listSort a {
    color:#ccc;
}
.listSort a:hover {
    color:#fff;
}
.listSort .active {
    background:#ddd;
    color:#000;
    font-weight:bold;
}
/* ============================= */
/* Step 8 Artikel Page Navigation */
/* ============================= */
.articlePageNavigation{
    display:flex;
justify-content:center;
gap:20px;
    align-items:center;
    margin:30px 0;
    padding-top:20px;
    border-top:1px solid #333;
}
.pageBack{
    flex:1;
    text-align:left;
}
.pageLinks{
    flex:1;
    text-align:center;
}
.pageNext{
    flex:1;
    text-align:right;
}
.pageLinks a{
    margin:0 5px;
}
.pageLinks .active{
    background: #111;
    color: #ddd;
    font-weight:bold;
}
@media (max-width:768px) {
    .articlePageNavigation {
        flex-wrap:wrap;
        justify-content:center;
        gap: 6px;
    }
}
/* ---------------------------- */
/* Step 9 Artikel zugehörige 
 * Bilder - eingebetet pro 
 * Artikel
 */
.imgLeft{
    width:98%;
    float:left;
    margin:10px 15px 10px 0;
}
.imgRight{
    width:98%;
    float:right;
    margin:10px 0 10px 15px;
}
.imgCenter{
    display:block;
    width:98%;
    max-width:600px;
    margin:10px auto;
    float:none;
}
.imgLeft img{
    width:98%;
    float:left;
    margin:10px 15px 10px 0;
}
.imgRight img{
    width:98%;
    float:right;
    margin:10px 0 10px 15px;
}
.imgCenter img{
    display:block;
    width:98%;
    max-width:600px;
    margin:10px auto;
    float:none;
}
.w18{
    width:18%;
}
.w34{
    width:34%;
}
.w50{
    width:50%;
}
/* ----------------------------------------------------
   Step 9.5.1
   Artikel nicht gefunden
---------------------------------------------------- */
.article404 {
    max-width: 700px;
    margin: 40px auto;
    padding: 30px;
    text-align: center;
}
.article404 h2 {
    margin-bottom: 20px;
}
.article404 p {
    margin: 15px 0;
}
.article404 a {
    display: inline-block;
    padding: 10px 18px;
    text-decoration: none;
}
/* ----------------------------------------------------
   Step 10
   Autorenbox
---------------------------------------------------- */
.autor-box {
    margin: 40px 0;
    padding: 20px;
    text-align: center;
    border-top: 1px solid #404040;
    border-bottom: 1px solid #404040;
}
.autor-avatar {
    width: 140px;
    height: 140px;
    object-fit: cover;
    border-radius: 50%;
}
/* .autor-avatar img {
    width: 80px;
    height: 80px;
    object-fit: cover;
    border-radius: 50%;
} */
.autor-name {
    font-size: 0.9rem;
    font-weight: bold;
    color: #ffffff;
}
.autor-subtitle {
    margin-top: 4px;
    font-size: 0.9rem;
    color: #999;
}
.autor-links {
    margin-top: 4px;
    font-size: 0.8rem;
    color: #999;
}
/* zusatz Autoren Portrait Lang */
.autor-portrait-Box {
    display:flex;
    align-items:center;
    gap:20px;
    margin-top:-6px;
}
/* h1 {
    margin-bottom:5px;
} */
/* end of :zusatz Autoren Portrait Lang */
/* ==========================
   Hamburger Menü Grundstock
   Tech-Guide
   ========================== */
#hamburger-menu {
    width: 34px;
    height: 26px;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
#hamburger-menu span {
    display: block;
    width: 34px;
    height: 3px;
    background: #222;
    border-radius: 3px;
}
/* ==========================
   Menü Container
   ========================== */
#side-menu {
    display:none;
    position:absolute;
    top:35px;
    left:0;
    padding:8px;
    z-index:99999;
    min-width:250px;
    background:#222;
    border:1px solid #555;
}
/* #side-menu {
    display:none;
    position:absolute;
    top:100%;
    left:0;
    z-index:9999;
} */
#side-menu.menu-open {
    display:block;
}
/* ==========================
   Menü Inhalt
   ========================== */
#side-menu ul {
    list-style: none;
    padding: 0;
    margin: 0;
}
#side-menu li {
    margin-bottom: 10px;
}
#side-menu a {
    text-decoration: none;
}
.menu-divider {
    margin-top: 15px;
    font-weight: bold;
}
/* ==========================
   Menü Fensterleiste
   ========================== */
.content-box-UX-menu {
    position: relative;
    width: 100%;
    padding-left:20px;
    box-sizing: border-box;
    z-index: 10;
}
.menu-window-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px;
}
.menu-title {
    font-weight: bold;
}
.menu-toolbar {
    position: relative;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    width:100%;
    margin-top:10px;
    z-index:99999;
}
.menu-bar-text {
    margin-left:2%;
    height:8px;
    min-height:6px;
    max-height:9px;
}
.menu-controls {
    display:flex;
    align-items:center;
    margin-left:auto;
    gap:6px;
}
.menu-controls button {
    display:flex;
    align-items:center;
    justify-content:center;
    width:24px;
    height:24px;
    padding:0;
    margin:0;
    border:0;
    background:transparent;
    cursor:pointer;
    color:#A3A3A3;
    font-size:17px;
    line-height:1;
}
.menu-controls a,.menu-controls a:hover,.menu-controls a:visited,.menu-controls a:active {
    text-decoration: none;
}
.help-button,.help-button:hover,.help-button:visited {
    text-decoration: none;
}
/* color:#003e8a; #003270; wird BLAU dargestellt */
.menu-controls button:hover {
    opacity: 0.7;
}
#menu-minimize {
    transform:translateY(-2px);
}
#menu-fullscreen {
    transform:translateY(-1px);
}
#menu-close {
    transform:translateY(1px);
}
/* end of : NETBOX 3 BOXEN spezieal mit Schatten für das Artikel System */
.sitemap {
    width:60px;
    align-items:center;
    margin-left:1%;
    gap:6px;
  /*  border:1px solid yellow; */
}
.sitemapDeluxe {
    float:right;
    width:94px;
    align-items:center;
    margin-left:1%;
    gap:6px;
    text-decoration: none;
 /*  border:1px solid yellow; */
}
.sitemapDeluxe a{
    color:#1c71d8;
    text-decoration: none;
 /*  border:1px solid yellow; */
}
#siteMapInfo {
    display:none;
    left:2%;
    padding:8px;
    z-index:99999;
    min-width:250px;
    background:#222;
    border:1px solid #555;
}
.nav-menu {
    color:#1c71d8;
    text-decoration: none;
 /*  border:1px solid yellow; */
}.nav-menu a{
    color:#1c71d8;
    text-decoration: none;
 /*  border:1px solid yellow; */
}
.tgHelpItem {
    position:relativ;
    color:#1c71d8;
    text-decoration: none;
}
.tgHelpLink {
    display:inline-block;
    cursor:pointer;
}
.tgHelpBox {
    display:none;
    position:absolute;
    left:2%;
    padding:8px;
    z-index:99999;
    width:202px;
    min-width:198px;
    box-sizing:border-box;
    background:#222;
    border:1px solid #555;
}
.tgHelpItem:hover .tgHelpBox {
    display:block;
}
.siteMapInfo {
    position:relativ;
}
.siteMapInfoLink {
    display:inline-block;
    cursor:pointer;
}
.siteMapBox {
    display:none;
}
.siteMapInfo:hover .siteMapBox {
    display:block;
}
/* MODALE Help WEBSEITEN EINBINDUNG */
.modal-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.75);
    z-index: 9999;
}
.modal-box {
    position: relative;
    max-width: 768px;
    margin-top:2%;
    margin-left:18%;
    margin-right:18%;
    padding: 25px;
    background: #111;
    color: #fff;
    border-radius: 10px;
  /* Bilder TEST */ 
  background-color: rgba(0, 0, 0, 0.9); /* Schwarz mit 10% Transparenz */
  color: #ffffff; /* Weißer Text für gute Lesbarkeit */
  box-shadow: 0 0 12px rgba(255, 255, 255, 0.55);
}
.modal-overlay:target {
    display: block;
}
.modal-close {
    position: absolute;
    right: 15px;
    top: 10px;
    font-size: 28px;
    color: white;
}
/* end of : MODALE Help WEBSEITEN EINBINDUNG */
/* === TG PROJEKTZEIT MODAL Eigenständige Klassen - keine Abhängigkeit von .netart etc. === */ 
.tg-projektzeit-link { cursor: pointer; text-decoration: none; } 
/* Modal-Grundzustand */ 
.tg-modal { display: none; position: fixed; inset: 0; z-index: 99999; } 
/* Modal sichtbar */ 
.tg-modal.tg-modal-open { display: flex; align-items: center; justify-content: center; } 
/* Hintergrund */ 
.tg-modal-overlay { position: absolute; inset: 0; background: #111; } 
/* Fenster */ 
.tg-modal-box { position: relative; z-index: 2; width: min(792px, calc(100% - 16px)); max-height: calc(100vh - 40px); overflow-y: auto; padding: 22px; background: #ffffff; border-radius: 10px; box-sizing: border-box; box-shadow: 0 12px 40px rgba(0, 0, 0, 0.30); } 
/* Schließen */ .tg-modal-close { position: absolute; top: 10px; right: 14px; width: 36px; height: 36px; border: 0; background: transparent; font-size: 30px; line-height: 1; cursor: pointer; } 
/* große Zahl */ .tg-projektzeit-zahl { margin: 8px 0; font-size: 1.2rem; text-align: center; } 
/* Hinweis */ .tg-projektzeit-hinweis { margin-top: 24px; padding-top: 16px; border-top: 1px solid #ddd; font-size: 0.9rem; } 
/* keine Scrollbewegung hinter dem Modal */ body.tg-modal-lock { overflow: hidden; } 
/* Artikel Kommentare */
.kommentar-box{
padding:15px;
}
.kommentar-box h3{
margin-top:0;
}
.kommentar-feld{
margin-bottom:15px;
}
.kommentar-feld input,.kommentar-feld textarea {
    width: 100%;
    padding: 8px;
    box-sizing: border-box;
    background: transparent;
    color: #fff;
    border: 1px solid rgba(255,255,255,.3);
}
.kommentar-feld textarea{
height:100px;
resize:none;
background: rgba(0, 0, 0, 0.08);
border: 1px solid #ccc !important;
/* border: 1px solid rgba(0, 0, 0, 0.25); */
}
.kommentar-feld input::placeholder,.kommentar-feld textarea::placeholder {
    color: rgba(255,255,255,.6);
}
.kommentar-feld input:focus,.kommentar-feld textarea:focus {
    outline: none;
    border-color: rgba(255,255,255,.6);
}
.zeichen-info{
font-size:12px;
text-align:right;
}
.kommentar-liste{
margin-top:25px;
padding-top:15px;
border-top:1px solid #ccc;
}
.kommentar-liste h3{
margin-bottom:15px;
}
.kommentar-spoiler{
margin-top:20px;
}
.kommentar-spoiler summary{
cursor:pointer;
padding:10px;
font-weight:bold;
}
.kommentar-liste{
display:flex;
gap:15px;
overflow-x:auto;
padding:15px 5px;
}
.kommentar-box{
min-width:280px;
max-width:350px;
padding:15px;
border:1px solid #888;
border-radius:10px;
}
.kommentar-user{
font-weight:bold;
}
.kommentar-datum{
font-size:0.8em;
opacity:0.7;
}
.kommentar-text{
margin-top:10px;
}
/* Mensch-Prüfung + Senden */
.kommentar-zeile {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    margin-top: 15px;
}
.kommentar-human {
    display: flex;
    align-items: center;
    gap: 10px;
}
.kommentar-human input {
    width: 50px;
    text-align: center;
}
.kommentar-human label {
    white-space: nowrap;
    font-weight: bold;
}
/* end of : Artikel Kommentare */
.spam-feld {
    display:none;
}
.kommentar-status {
    margin: 15px 0;
    padding: 12px 15px;
    border-radius: 6px;
    font-weight: 600;
}
.kommentar-erfolg {
    border: 1px solid #3a8f3a;
}
.kommentar-fehler {
    border: 1px solid #c0392b;
}
/* DEBUG ADMIN USER FRONTEND MELDUNG */
/*
 * Tech-Guide Debug Status
 * Technischer Hinweis für Besucher
 */
.tg-debug-status {
    margin: 15px 0;
    padding: 12px 15px;
    border: 1px solid #d6a84f;
    border-radius: 6px;
    background: #fff8df;
    color:orange;
    font-weight: 600;
}
/* end of : DEBUG ADMIN USER FRONTEND MELDUNG */
/* netzwerk macher nachtrag 05.09.2026 / Play Box Info Box */
.myEnd {
    width:98%;
    background:#202020; /* 232323 | 3b3b3b | gray; */
    color: #ffffff; /* Weißer Text für gute Lesbarkeit   */
    box-shadow: 0 0 12px rgba(255, 255, 255, 0.55);
    border-radius: 12px; 
}
/* end of : netzwerk macher nachtrag 05.09.2026 / Play Box Info Box */
/* Zufalls Artikel | Fremddomain */
/* ---------------------------------
   Grundstruktur
--------------------------------- */

#article-zufall-container {
    width: 100%;
    overflow-x: hidden;
    overflow-y: hidden;
}

#article-zufall-container .article-zufall-track {
    display: flex;
    width: max-content;
}

#article-zufall-container .article-zufall-gruppe {
    display: flex;
    gap: 10px;
    flex-shrink: 0;
}

#article-zufall-container .article-zufall-gruppe + .article-zufall-gruppe {
    margin-left: 6px;
}

/* ---------------------------------
   Artikelbox
--------------------------------- */

#article-zufall-container .article-zufall-box {
    flex: 0 0 365px;
    width: 365px;
    height: 180px;
    min-height: 180px;
    box-sizing: border-box;
    overflow: hidden;
    padding: 1em;
    border: 1px solid #888;
    border-radius: 8px;
}

#article-zufall-container .myfpv-article {
    /* eigener Border */
    border: 1px solid #888;
    border-radius: 6px;
    padding:1em;
}
/* ---------------------------------
   Teaserbild + Overlay
--------------------------------- */

#article-zufall-container .teaser-box {
    position: relative;
    width: 365px;
    height: 90px;
    max-height: 90px;
    overflow: hidden;
}

#article-zufall-container .artikel-teaser {
    display: block;
    width: 365px;
    height: 90px;
    max-height: 90px;
    object-fit: cover;
}

#article-zufall-container .teaser-title {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
}

#article-zufall-container .teaser-box .teaser-title a {
    color: #1c71d8;
}

#article-zufall-container .teaser-title a {
    color: #1c71d8;
    text-decoration: none;
}

/* ---------------------------------
   100-Zeichen-Teaser
--------------------------------- */

#article-zufall-container .artikel-kurztext {
    display: block;
    margin-top: 6px;
    line-height: 1.3;
    max-height: 54px;
    overflow: hidden;
}

/* ---------------------------------
   Nicht benötigte Elemente
--------------------------------- */

#article-zufall-container .artikel-datum,
#article-zufall-container .artikel-mehr {
    display: none;
}
#article-zufall-container .article-zufall-box:hover {
    animation: articleZufallWackel 0.25s ease-in-out;
}
@keyframes articleZufallWackel {
    0%   { transform: translateX(0); }
    25%  { transform: translateX(-2px); }
    50%  { transform: translateX(2px); }
    75%  { transform: translateX(-1px); }
    100% { transform: translateX(0); }
}
/* ende der Klassen : Zufalls Artikel | Fremddomain */

/* Zufalls Kommentare */
/* ---------------------------------
   Unsere Leser meinen
   Horizontaler Kommentar Scroller
--------------------------------- */
.kommentar-container {
    display: flex;
    flex-wrap: nowrap;
    gap: 20px;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-behavior: smooth;
}
.kommentar-boxes {
    flex: 0 0 280px;
    padding: 15px;
    border-radius: 12px;
}
.kommentar-user {
    font-weight: bold;
}
.kommentar-text {
    margin-top: 10px;
}
.kommentar-date {
    margin-top: 10px;
    font-size: 0.85em;
}
.kommentar-container {
    display: flex;
    flex-wrap: nowrap;
    gap: 20px;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-behavior: smooth;
    scrollbar-width: none; /* Firefox */
}
.kommentar-container::-webkit-scrollbar {
    display: none; /* Chrome, Chromium, Safari */
}
.kommentar-boxes {
    flex: 0 0 280px;
}
/* end of : Zufalls Kommentare */
/* 2 Spalten für MD */
.md-spalten {
    display: flex;
    gap: 20px;
    flex-wrap: wrap;
/*    display:grid;
    grid-template-columns: 1fr 1fr;
    gap:25px; */
    margin:20px 0;
}
.md-spalte-links,.md-spalte-rechts {
    padding:15px;
    flex: 1 1 300px;
    min-width: 0;          /* sehr wichtig! */
    overflow-wrap: break-word;
}
@media (max-width:800px) {
    .md-spalten{
        flex-direction:column;
    }
    .md-spalte-links,
    .md-spalte-rechts{
        flex:0 0 auto;
        width:100%;
    }
}
/* end of : 2 Spalten für MD */
/* QUOTE - ZITAT für MD */
/* ==================================================
   TG Quote Fix
   ================================================== */
.md-quote {
    position: relative;
    width: 40%;
    margin: 3em auto;
    padding: 2.5em 4em;
    border-top: 1px solid currentColor;
    border-bottom: 1px solid currentColor;
    text-align: center !important;
    font-style: italic !important;
    box-sizing: border-box;
}
.md-quote-text {
    text-align: center !important;
    font-style: italic !important;
    line-height: 1.7;
}
/* Anfuerhrungsstriche */
.md-quote-open,.md-quote-close {
    position: absolute;
    display: block;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 6em;
    line-height: 0.7;
    font-weight: normal;
    font-style: normal;
    opacity: 0.45;
}
.md-quote-open {
    left: 0.05em;
    top: 0.15em;
}
.md-quote-close {
    right: 0.05em;
    bottom: 0.05em;
}
@media (max-width: 768px) {
    .md-quote {
        width: 90%;
        padding: 2.2em 3.2em;
    }
    .md-quote-open,
    .md-quote-close {
        font-size: 4.5em;
    }
}
/* end of : QUOTE - ZITAT für MD */
/* My Audiofiles TALK */
a.tg-audio{
    cursor:pointer;
}
/* a.tg-audio::before{
    font-family:"Font Awesome 6 Free";
    font-weight:900;
    content: "\f0f3";      /* Lautsprecher */ 
/*    margin-right:.45rem;
} */
a.tg-audio::before{
    font-family:"Font Awesome 6 Free";
    font-weight:900;
 /*   content:"\f2a0"; */
}
a.tg-audio.playing::before{
  /*  content:"\f04c";      /* Pause */
}
.tg-talk {
    text-align: right;    
    text-decoration: none;
    margin: 10px 0;
}
.tg-talk small {
    display: block;
    margin-top: 2px;
    font-size: 0.8em;
    color: #777;
}
.tg-speech {
    text-align: right;
    text-decoration: none;
    margin: 10px 0;
}
.tg-speech small {
    display: block;
    margin-top: 2px;
    font-size: 0.8em;
    color: #777;
}
.tg-audio,.tg-audio:link,.tg-audio:visited,.tg-audio:hover,.tg-audio:active {
    text-decoration: none;
}
/* end of : My Audiofiles TALK */
/* MD fixes [fomate] */
.tg-small {
    margin-left:1%;
    font-size: 0.85em;
    line-height: 1.4;
}
/* end of : MD fixes [fomate] */
/* Suche */
/* ================================
   Tech-Guide Suchfeld
   ================================ */
.tg-suche {
    display: flex;
    align-items: stretch;
    gap: 8px;
    margin: 20px 0;
    max-width: 768px;
}
.tg-suche input[type="text"] {
    flex: 1;
    min-width: 0;
    padding: 10px 14px;
    border: 1px solid #ccc;
    border-radius: 6px;
    background: #fff;
    color:#333;
    font-size: 1rem;
    box-sizing: border-box;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.tg-suche input[type="text"]::placeholder {
    color:#888;
    opacity: 1;
}
.tg-suche input[type="text"]:focus {
    outline: none;
    border-color: #888;
    box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.08);
}
.tg-suche button {
    padding: 10px 18px;
    border: 0;
    border-radius: 6px;
    background: #444;
    color: #fff;
    font-size: 1rem;
    cursor: pointer;
    transition: background 0.2s ease, transform 0.15s ease;
}
.tg-suche button:hover {
    background: #222;
}
.tg-suche button:active {
    transform: translateY(1px);
}
/* end of : suche */
/* Artikel Bewerbungen */
.send-container {
    display: flex;
    gap: 20px;
    align-items:flex-start;
    /*  flex-start; stretch; */
}
.send-box {
    flex: 1;
 /*   border: 1px solid #ccc; */
    padding: 15px;
    margin-bottom: 20px;
    border-radius: 8px;
}
/* Mobile */
@media (max-width:768px){
    .send-container{
        flex-direction:column;
    }
    .send-box{
        min-width:100%;
        width:100%;
        flex:none;
    }
    .article-send input,
    .article-send textarea{
        width:100%;
        box-sizing:border-box;
    }
}
/* end of : Mobile */
.article-send {
    max-width:99.8%;
    margin: 20px auto;
}
.article-send label {
    display: block;
    margin-top: 12px;
}
.article-send input,.article-send textarea {
    width: 100%;
    box-sizing: border-box;
    margin-top: 5px;
    padding: 8px;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
}
.article-send textarea {
    resize: vertical;
}
.datei-optionen {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    margin-top: 10px;
}
.datei-optionen label {
    display: inline-flex;
    align-items: center;
    gap: 5px;
}
.form-hinweis {
    font-size: 0.9em;
    margin-top: 10px;
}
/* Artikel einreichen Status */
.send-fehler,.send-erfolg {
    padding: 15px;
    margin: 15px 0;
    border-radius: 8px;
    font-size: 1rem;
}
.send-fehler {
    background:#EEDFCC;
    border: 1px solid #cc5555;
}
.send-erfolg {
    background:#7FFFD4;
    border: 1px solid #55aa55;
    position: relative;
}
.send-close {
    position: absolute;
    right: 10px;
    top: 5px;
    text-decoration: none;
    font-weight: bold;
}
.send-button {
    text-align: center;
/*    margin-top: 20px; */
}
.send-button button {
    padding: 10px 30px;
    cursor: pointer;
}
/* TXT Vorlagen */
/* ----------------------------------------------------
   TXT-Unterstützung | Artikel einreichen
---------------------------------------------------- */
.txt-vorlage-hilfe {
    margin-top: 20px;
}
.txt-vorlage-hilfe > label {
    display: block;
    margin-bottom: 6px;
    font-weight: bold;
}
.txt-vorlage-select {
    width: 100%;
    box-sizing: border-box;
}
.txt-vorlage-box {
    margin-top: 15px;
}
.txt-vorlage-text {
    width: 100%;
    min-height: 360px;
    box-sizing: border-box;
    resize: vertical;
    font-family: monospace;
    line-height: 1.45;
}
.txt-vorlage-aktionen {
    margin-top: 12px;
}
.txt-vorlage-button {
    cursor: pointer;
}
/* end of : Artikel einreichen Status */
.mensch-zeile {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 15px;
    margin-top: 20px;
    width: 100%;
    flex-wrap: nowrap;
}
.mensch-aufgabe {
    display: flex;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
    flex-shrink: 0;
}
.mensch-input {
    width: 120px !important;
    text-align: center;
    flex-shrink: 0;
}
/* Artikel Bewerbung */
.article-modsend-navigation {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 15px;
    margin-top: 25px;
    margin-bottom: 25px;
    font-style: normal;
    font-weight:normal;
}
.article-modsend-navigation a {
    text-decoration: none;
    font-style: normal;
    font-weight:normal;
}
.article-modsend-navigation a {
    font-weight: 600;
    display: inline-block;
    line-height: 1.2;
    text-decoration: none;
    font-style: normal;
    font-weight:normal;
}
.article-modsend-navigation a:hover {
    font-weight: 600;
    opacity: 0.8;
    text-decoration: none;
    font-style: normal;
    font-weight:normal;
}
/* end of : Artikel Bewerbungen */
.GM { display:block;}
/* Bilder Gross */
#bild-modal {
    display:none;
    position:fixed;
    inset:0;
    padding:14px;
  /*   background-color: #1a1a1a;  */
    background-color: rgba(0, 0, 0, 0.5); /* Schwarz mit 50% Transparenz */
    color: #ffffff; /* Weißer Text für gute Lesbarkeit */
  /*  box-shadow: 0 0 12px rgba(255, 255, 255, 0.55); */
    border-radius: 12px;
    z-index:9999;
    justify-content:center;
    align-items:center;
}
#bild-modal.open {
    display:flex;
}
#bild-modal img {
    background:#000;
    padding:2.6%;
    margin-top:1.4%;
    margin-bottom:1.4%;
    max-width:100%;
    max-height:98%;
    object-fit:contain;
    border-radius:22px;
    cursor:pointer;
  /* Bilder TEST */ 
  background-color: rgba(0, 0, 0, 0.9); /* Schwarz mit 10% Transparenz */
  color: #ffffff; /* Weißer Text für gute Lesbarkeit */
  box-shadow: 0 0 12px rgba(255, 255, 255, 0.55);
}
#bild-modal-img {
    background:#000;
    cursor: zoom-out;
}
.BigBiGGer {
max-width: 100%;
    height: auto;
    margin: 20px auto;
}
/* DragonPilot | netzwerk macher Eigener Editierter Code */
#myPics {
    display:none;
    position:fixed;
    inset:0;
    padding:11px;
    width:92%;          /* Oder eine feste Breite wie 600px */
    max-width:1024px;    /* Verhindert, dass es auf großen Bildschirmen zu riesig wird */
    margin: 0 auto;      /* Zentriert das Modal */
    margin-bottom:1.6%;
    margin-top:1.6%;
/* alte Anweisung | 05.09.2026 | netzwerk macher | dragonPilot */
/*   background-color: #1a1a1a;  */
    background-color: rgba(0, 0, 0, 0.5); /* Schwarz mit 50% Transparenz */
    color: #ffffff; /* Weißer Text für gute Lesbarkeit   */
    box-shadow: 0 0 12px rgba(255, 255, 255, 0.55);
    border-radius: 12px; 
    z-index:9999;
    justify-content:center;
    align-items:center;
}
#myPics.open {
    display:flex;
}
#myPics img {
    background:#000;
    padding:1%;
    width: 100%;         /* Zwingt das Bild, die volle Breite des Modals zu nutzen */
    height: auto;        /* Behält das richtige Seitenverhältnis bei, damit es nicht verzerrt */
    display: block;      /* Entfernt unerwünschte Abstände unter dem Bild */
/*  Alte anweisung */
    max-width:100%;
    max-height:98%;
    object-fit:contain;
    border-radius:8px;
    cursor:pointer;
   /* Bilder Gross TEST */ 
    background-color: rgba(0, 0, 0, 0.5); /* Schwarz mit 50% Transparenz
    color: #ffffff; /* Weißer Text für gute Lesbarkeit
    box-shadow: 0 0 12px rgba(255, 255, 255, 0.55); */
}
#myPics-img {
    background:#000;
    cursor: zoom-out;
    max-width:100%;
    object-fit:contain;
}
/* end of : Bilder Gross */
/* Wrapper Gallery | erst einmal fotosession */
.GalleryWrapper {
	position: relative;
	height: 0;
	padding-bottom: 56.25%;
	z-index:2;
}
/* Grössen Fix
 * height: 320px; object-fit: cover;
 * */
/* TGv1.9refv1 */
/* DE Flagge */
img.flagge {
  /* Heller, weicher Schatten (Glow) für den Kontrast auf Schwarz */
  box-shadow: 0 0 8px rgba(255, 255, 255, 0.25);
  /* Optional: Ein hauchdünner, halbtransparenter Rand grenzt die Flagge scharf ab */
  border: 1px solid rgba(255, 255, 255, 0.2);
  /* Optional: Leichte Abrundung */
  border-radius: 2px;
}
img.flaggeBig {
  /* Heller, weicher Schatten (Glow) für den Kontrast auf Schwarz */
  box-shadow: 0 0 16px rgba(255, 255, 255, 0.25);
  /* Optional: Ein hauchdünner, halbtransparenter Rand grenzt die Flagge scharf ab */
  border: 3px solid rgba(255, 255, 255, 0.2);
  /* Optional: Leichte Abrundung */
  border-radius: 4px;
}
/* end of : DE Flagge */
.tg-gallery {
    width: 100%;
}
.tg-gallery-header {
    width: 100%;
}
.tg-gallery-grid {
    display: grid;
    /* grid-template-columns: repeat(6, minmax(0, 1fr)); */
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    width:100%;
}
.tg-gallery-item {
    margin: 0;
    padding: 6px;
    border: 1px solid rgba(128, 128, 128, 0.35);
    border-radius: 4px;
    box-sizing: border-box;
}
.tg-gallery-item img {
    background:#000;
    width: 100%;
    height: 120px;
    object-fit: cover;
    border-radius: 2px;
    display: block;
}
.tg-gallery-empty {
    margin: 6px 0 0;
}
/* zufalls Bilder */
.tg-gallery-zufall {
    background:#000;
    width: 100%;
}
.tg-gallery-zufall-autor {
    background:#000;
}
.tg-gallery-zufall-item {
    margin: 0;
    background:#000;
    padding: 6px;
    border: 1px solid rgba(128, 128, 128, 0.35);
    border-radius: 4px;
    box-sizing: border-box;
    object-fit: cover;
}
.tg-gallery-zufall-item img {
    background:#000;
    width: 100%;
    height: 120px;
    object-fit: cover;
    border-radius: 2px;
    display: block;
}}
.tg-gallery-zufall-itemBild {
    display: block;
    width: 100%;
    max-width: 700px;
    height: 160px;
    max-height: 180px;
    margin: 0 auto;
    border: 1px solid #ccc;
    object-fit: cover;
    object-position: center;
}
.tg-gallery-portrait-zufall {
    display: block;
    width: 100%;
    max-width: 700px;
    height: 160px;
    max-height: 180px;
    margin: 0 auto;
/*     border: 1px solid #ccc;  */
    object-fit: cover;
    object-position: center;
}
.tg-gallery-portrait-zufall img {
    width: 100%;
}
@media (max-width: 1100px) {
    .tg-gallery-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}
@media (max-width: 800px) {
    .tg-gallery-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
@media (max-width: 600px) {
    .tg-gallery-grid {
        grid-template-columns: 1fr;
    }
}
/* Gallery Zufall */
.tg-gallery-zufall-autor {
    text-align: center;
    margin-top: 8px;
    font-size: 0.9em;
}
.tg-gallery-zufall-autor a {
    text-decoration: none;
}
/* Gallery Navigation */
.tg-gallery-navigation {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
    margin: 20px 0;
}
.tg-gallery-navigation a,.tg-gallery-navigation .aktiv {
    display: inline-block;
    padding: 5px 9px;
    border: 1px solid rgba(128, 128, 128, 0.35);
    border-radius: 4px;
    text-decoration: none;
}
.tg-gallery-navigation .aktiv {
    font-weight: bold;
}
/* end of : Gallery Navigation */
/* select */
/* Das Hauptfeld des Dropdowns */
select {
  width:100%;
  max-width:140px;
  padding: 3px 6px;
  font-size: 16px;
  color: #333;
  background-color: #ddd9f9;
 /* background-color: #f9f9f9; */
  border: 2px solid #ccc;
  border-radius: 4px;
  outline: none;
  cursor: pointer;
}
/* Zustand beim Anklicken/Fokus */
select:focus {
  border-color: #0066cc;
  box-shadow: 0 0 5px rgba(0, 102, 204, 0.3);
}
/* Gestaltung der einzelnen Optionen (nur begrenzt möglich) */
select option {
  padding: 3px;
  color: #333;
  background-color: #ddd;
}
/* select */
/* end of: TGv1.9refv1 */
/* end of: Wrapper Gallery | erst einmal fotosession */
/* Glossar */
.glossar-boxen {
    display: flex;
    align-items: flex-start;
    gap: 20px;
}
.glossar-buttons {
    flex: 0 0 10%;
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.glossar-buttons .weiterlesen {
    display: block;
 /*   display:inline-block; */
    width: 100%;
    box-sizing: border-box;
    text-align: center;
    padding:8px 14px;
    border:1px solid #666;
    border-radius:6px;
    text-decoration:none;
    transition:0.2s;
}
.glossar-MyButtons {
    text-align:right;
    margin-top:15px;
}
.glossar-MyButtons a{
    display:inline-block;
    padding:8px 14px;
    border:1px solid #666;
    border-radius:6px;
    text-decoration:none;
    transition:0.2s;
}
.glossar-einleitung {
    flex: 1;
}
/* end of : Glossar */
/* impressum */
.impressum-boxen {
    display: flex;
    align-items: flex-start;
    gap: 20px;
}
.impressum-buttons {
    flex: 0 0 10%;
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.impressum-buttons .weiterlesen {
    display: block;
 /*   display:inline-block; */
    width: 100%;
    box-sizing: border-box;
    text-align: center;
    padding:8px 14px;
    border:1px solid #666;
    border-radius:6px;
    text-decoration:none;
    transition:0.2s;
}
.impressum-MyButtons {
    text-align:right;
    margin-top:15px;
}
.impressum-MyButtons a{
    display:inline-block;
    padding:8px 14px;
    border:1px solid #666;
    border-radius:6px;
    text-decoration:none;
    transition:0.2s;
}
.impressum-einleitung {
    flex: 1;
}
/* end of : Impressum */
/* Tech Guide v2.0 FPV DE */
/* Mobile Box grundsätzlich aus */
.tg-mobile-box {
    display:none;
    background:#7FFFD4;
    border: 1px solid #55aa55;
}
/* Nur Mobile */
@media (max-width: 767px) {
    .tg-mobile-box {
        display: block;
        position: relative;
        width: 100%;
        margin: 15px 0;
        padding: 10px;
        box-sizing: border-box;
    }
    .tg-mobile-box-link {
        display: block;
    }
    .tg-mobile-box-bild {
        display: block;
        height:92px;
    }
    .tg-mobile-box-close {
        position: absolute;
        top: 5px;
        right: 5px;
        z-index: 2;
        width: 30px;
        height: 30px;
        border: 0;
        border-radius: 50%;
        cursor: pointer;
        font-size: 22px;
        line-height: 30px;
        padding: 0;
    }
}
/* end of : Tech Guide FPV DE */
/* TG Crawler v0.2 | TG v 1.9.3 */
/* ----------------------------------------------------
   TG CRAWLER / SUCHE
   ---------------------------------------------------- */
/* Suchfeld */
.suche-box{
    width:100%;
}
.crawler-suche{
    width:100%;
}
.crawler-suche form{
    display:flex;
    align-items:center;
    gap:8px;
}
.crawler-suche input[type="search"]{
    flex:1;
}
.crawler-suche button{
    flex:0 0 auto;
}
/* Suchergebnisse */
.suche-ergebnisse{
    width:100%;
}
.crawler-ergebnis{
    margin-bottom:15px;
    padding:10px 12px;
 /*   border:1px solid #666;
    border-radius:6px; */
}
.crawler-ergebnis h4{
    margin:0 0 6px 0;
}
.crawler-ergebnis h4 a{
    text-decoration:none;
}
.crawler-ergebnis h4 a:hover{
    text-decoration:underline;
}
.crawler-ergebnis small {
    font-size: 0.85em;
}
.crawler-ergebnis .tgSuchTag {
    background: #e8f4ff;
    color: #222;
    display: inline-block;
    margin-top: 8px;
    margin-right: 4px;
}
/* Tags */
.suche-tags{
    width:100%;
}
.tgSuchTag{
    display:inline-block;
    margin:3px;
}
/* TAGS */
.crawlerTag {
    display: inline-block;
    padding: 8px 14px;
    border: 1px solid #666;
    border-radius: 6px;
    text-decoration: none;
    transition: 0.2s;
}

.crawlerTag:hover {
    transform: scale(1.05);
}
/* Treffer-Markierung */
/* TG Crawler - Suchtreffer im Artikel */
mark.crawler-highlight {
    padding: 0.05em 0.15em;
    border-radius: 0.2em;
 /*   background: #9fdcff; */
    background: #b8e3f5;
    color: #000;
}
/* end of : TG Crawler - Suchtreffer im Artikel */
/* Zufalls-Tags */
.zufallTag {
    /* spätere Sondergestaltung */
}
.zufallTag:hover {
    animation: zufallTagWackler 0.35s ease-in-out;
}
.zufallTagAuto {
    animation: zufallTagWackler 0.35s ease-in-out;
}
.entdecker-layout {
    display: flex;
    flex-wrap: nowrap;
    gap: 20px;
    align-items: flex-start;
}
.entdecker-layout .zufall-tags {
    flex: 1 1 auto;
    min-width: 0;
}
#entdecker-view {
    flex: 0 0 280px;
    box-sizing: border-box;
    padding: 12px;
    border: 1px solid #666;
    border-radius: 6px;
}
#entdecker-view img.autoGfx {
    display: block;
    max-width: 100%;
    height: auto;
    margin: 10px 0;
    border-radius: 4px;
}
@keyframes zufallTagWackler {
    0%   { transform: rotate(0deg); }
    25%  { transform: rotate(-3deg); }
    50%  { transform: rotate(3deg); }
    75%  { transform: rotate(-2deg); }
    100% { transform: rotate(0deg); }
}
/* end of : Zufalls-Tags */
.crawler-icon {
    position: relative;
    display: inline-block;
    top:6px;
    width: 1.8em;
    height: 1.8em;
}
.crawler-icon .fa-search {
    position: absolute;
    inset: 0;
/*    font-size: 0.68em; */
    top:6px;
}
.crawler-icon .fa-dragon {
    position: absolute;
    left:16px;
    top:14px;
    font-size: 0.58em;
}
.crawler-iconBIG {
    position: relative;
    display: inline-block;
    top:2px;
    width:24px;
    height:24px;
}
.crawler-iconBIG .fa-search {
    position: absolute;
    inset: 0;
    font-size:0.96em;
    top:3px;
}
.crawler-iconBIG .fa-dragon {
    position: absolute;
    left:16px;
    top:14px;
    font-size:0.89em;
}
.crawler-suche button {
    padding: 10px 18px;
    border: 0;
    border-radius: 6px;
    background: #444;
    color: #fff;
    font-size: 1rem;
    cursor: pointer;
    transition: background 0.2s ease, transform 0.15s ease;
}
.crawler-suche button:hover {
    background: #222;
}
.crawler-suche button:active {
    transform: translateY(1px);
}
/* Fix input */
.tg-suche input[type="search"]{
    /* nur falls erforderlich */
}
/* TEST: TG Crawler Suchfeld */
.article-suche input[type="search"]{
    border:3px solid red !important;
    background:yellow !important;
}
/* ----------------------------------------------------
   TG CRAWLER - SUCHFELD
   ---------------------------------------------------- */
.crawler-suche {
    display: flex;
    align-items: stretch;
    gap: 8px;
    margin: 20px 0;
    max-width: 768px;
}
.crawler-suche input[type="search"] {
    flex: 1;
    min-width: 0;
    padding: 10px 14px;
    border: 1px solid #ccc;
    border-radius: 6px;
    background: #fff;
    color: #333;
    font-size: 1rem;
    box-sizing: border-box;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.crawler-suche input[type="search"]::placeholder {
    color: #888;
    opacity: 1;
}
.crawler-suche input[type="search"]:focus {
    outline: none;
    border-color: #888;
    box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.08);
}
/* ----------------------------------------------------
   end of : TG Crawler v0.2 | TG v1.9.3
   ---------------------------------------------------- */
/* end Tech Guid v.2.0 */
.TvMyPilot {
 width:100%;
 height:419px;
 /*
 height:419px;
  min-height:400px;
 max-height:420px; */
  object-fit: cover; /* Schneidet Bild passend zu, ohne Verzerrung */
/* object-fit: contain; /* Alternativ: Bild ganz anzeigen, Lücken füllen */
  background-image:url('https://medien.die-foto-macher.de/media/testTV.jpg');
/*  background-size: cover; /* Skaliert das Bild, um den Container zu bedecken, ohne Verzerrung */
/*  background-position: center; /* Zentriert das Bild */
  background-repeat: no-repeat; /* Verhindert Wiederholung des Bildes */
/*  justify-content: center;
  align-items: center; */
  z-index: 999;
}
.netXY {
 float: left;
 width: 48%;
 margin-right: 2%;
 padding: 4px;
 background: transparent;
 box-sizing: border-box;
}
.netXY:last-child {
     margin-right: 0;
}
.netXY:hover {
 background:#E6E6E6;
 padding:8px;
 -webkit-transform: scale(1.4);
 -moz-transform: scale(1.4);
 -ms-transform: scale(1.4);
 -o-transform: scale(1.4);
 transform: scale(1.4);
}
.nettimeLine {
 float: left;
 width: 68%;
 margin-right: 2%;
 padding: 4px;
 background: transparent;
 box-sizing: border-box;
}
.nettimeLine:last-child {
     margin-right: 0;
}
.netshop {
 float: left;
 width: 22%;
 margin-right: 2%;
 padding: 4px;
 background: transparent;
 /* object-fit: cover; */
 /* width: 100%;  */
 /* height: 12%; */
 box-sizing: border-box;
 height: auto;
 text-align: justify;
 text-align-last: none;
 border-color: #D8D8D8;
 border-width: 1px;
 border-style: solid;
 border-radius: 3px 15px 5px 30px;
}
.netshop:last-child {
 margin-right: 1%;
 border-radius: 3px 15px 5px 30px;
}
#mhcSPEZbox { 
    width:100;display:
    flex;display:-webkit-flex;
    display:-ms-flex;
    display:flex;
    flex-wrap:wrap;
    flex-basis:auto; 
    text-decoration: none;
}
.mhcSPEZ2 { 
    float:right;
    width:64%;
    margin-left:0.2%;
    margin-right:0.8%;
    padding:4px;
    box-sizing:border-box;
    text-decoration: none; 
}
.mhcSPEZ2:last-child {
    margin-right:0;
    text-decoration: none;
}
.mhcSPEZ1 { 
    float:left;width:30%;
    margin-left:1%;
    margin-right:1%;
    padding:4px;
    box-sizing:border-box;
    height:auto; 
    text-decoration: none;
}
.mhcSPEZ1:last-child {
    margin-right:0%;
    text-decoration: none;
}
#pNET
{
margin-right:2%;margin-left:2%;background-color:transparent;
}
.pNET
{
margin-right:2%;margin-left:2%;background-color:transparent;
}
.pNETCheck
{
margin-right:3.4%;margin-left:3.4%;background-color:transparent;
}
/* Extra rechter Rand */
.pNETxHeader
{
text-align:right;margin-right:2%;margin-left:3.4%;background-color:transparent;
}
.pNETx
{
margin-right:2%;margin-left:3.4%;background-color:transparent;
}
/* end of : Extra rechter Rand */
#DPnet
{
margin-right:8%;margin-left:8%;background-color:transparent;
}
.DPnet
{
margin-right:8%;margin-left:8%;background-color:transparent;
}
/* #99c1f1 */
.cms {
width:100%;background-color:#241f31;
}
/* #99c1f1 */
.cmsFoot {
width:100%;background-color:#241f31;
}
.cmsBG {
width:100%;background-color:#141414;
}
.autoGfx img {
	max-width:99.8%;
}
.autoGfx.ModSendBild-hover {
    aspect-ratio: 16 / 9;
}
/* articleModSend */
.ModSendBild-hover {
    position:relative;
    overflow:hidden;
}
.ModSendBild-hover .ModSendBild-normal {
    display:block;
    width:100%;
}
.ModSendBild-hover .ModSendBild-hover2 {
    position:absolute;
    top:0;
    left:0;
    width:100%;
    opacity:0;
    transitition: opacity .3s ease;
}
.ModSendBild-hover:hover .ModSendBild-hover2 {
    opacity:1;
}
.ModSendBild-hover:hover .ModSendBild-normal {
    opacity:0;
}
/* end of : articleModSend */
.autoGfxFoto img {
	max-width:99.8%;
}
.autoGfxTechG img {    width: 100%; /* Zwingt das Element auf die volle verfügbare Breite */
    height: 160px; /* Nutze height statt max-height, damit der Container eine feste Höhe hat */
    background-image: url('https://fpv-de.com/style/image/teaser19.webp');
    background-size: 100% 100%; /* Streckt das Bild auf die vollen Maße des Containers */
    background-position: center;
    background-repeat: no-repeat;
    display: flex; 
    justify-content: center;
    align-items: center;
    border-top-left-radius: 30px;
    border-bottom-right-radius: 30px;
    z-index: 999;
}
.LoGo img {
	max-width:20%;
}
.FMLoGo img {
	max-width:70%;
  margin-bottom:18px;
}
.FotoLeft img {
	max-width:99.8%;  
  background-image:url('https://medien.die-foto-macher.de/myPilot/landschaft_neXt.webp');
  background-size: cover; /* Skaliert das Bild, um den Container zu bedecken, ohne Verzerrung */
  background-position: center; /* Zentriert das Bild */
  background-repeat: no-repeat; /* Verhindert Wiederholung des Bildes */
  display: flex; /* Für Inhalts-Zentrierung */
  border-top-left-radius:22px;
  border-bottom-right-radius:22px;
  justify-content: center;
  align-items: center;
  z-index: 999;
}
.FotoRight img {
	max-width:99.8%;  
  background-image:url('https://medien.die-foto-macher.de/myPilot/landschaft.webp');
  background-size: cover; /* Skaliert das Bild, um den Container zu bedecken, ohne Verzerrung */
  background-position: center; /* Zentriert das Bild */
  background-repeat: no-repeat; /* Verhindert Wiederholung des Bildes */
  display: flex; /* Für Inhalts-Zentrierung */
  border-top-left-radius:22px;
  border-bottom-right-radius:22px;
  justify-content: center;
  align-items: center;
  z-index: 999;
}
.BetaFPVLeft img {
	max-width:99.8%;  
  background-image:url('https://die-foto-macher.de/style/gfx/myPilot/drohnenPilot.webp');
  background-size: cover; /* Skaliert das Bild, um den Container zu bedecken, ohne Verzerrung */
  background-position: center; /* Zentriert das Bild */
  background-repeat: no-repeat; /* Verhindert Wiederholung des Bildes */
  display: flex; /* Für Inhalts-Zentrierung */
  justify-content: center;
  align-items: center;
  z-index: 999;
}
.RadiomasterRight img {
	max-width:99.8%;  
  background-image:url('https://radiomasterrc.com/cdn/shop/files/collection2_1800x1800.jpg?v=1750061403');
  background-size: cover; /* Skaliert das Bild, um den Container zu bedecken, ohne Verzerrung */
  background-position: center; /* Zentriert das Bild */
  background-repeat: no-repeat; /* Verhindert Wiederholung des Bildes */
  display: flex; /* Für Inhalts-Zentrierung */
  justify-content: center;
  align-items: center;
  z-index: 999;
}
.GimpRight img {
	max-width:99.8%;  
  background-image:url('https://autor.die-foto-macher.de/dragonpilot/software/gimpEdit.webp');
  background-size: cover; /* Skaliert das Bild, um den Container zu bedecken, ohne Verzerrung */
  background-position: center; /* Zentriert das Bild */
  background-repeat: no-repeat; /* Verhindert Wiederholung des Bildes */
  display: flex; /* Für Inhalts-Zentrierung */
  justify-content: center;
  align-items: center;
  z-index: 999;
}
.myPilotDP img {
	max-width:80%; 
  background-image:url('https://medien.die-foto-macher.de/avatar/avartar_info.gif'); 
  background-size: cover; /* Skaliert das Bild, um den Container zu bedecken, ohne Verzerrung */
  background-position: center; /* Zentriert das Bild */
  background-repeat: no-repeat; /* Verhindert Wiederholung des Bildes */
  display: flex; /* Für Inhalts-Zentrierung */
  margin-top:10px;
  padding:14px;
  justify-content: center;
  align-items: center;
  z-index: 999;
}
.myPilotInfo img {
	max-width:80%; 
  background-image:url('https://medien.die-foto-macher.de/avatar/old.avartar_info.gif'); 
  background-size: cover; /* Skaliert das Bild, um den Container zu bedecken, ohne Verzerrung */
  background-position: center; /* Zentriert das Bild */
  background-repeat: no-repeat; /* Verhindert Wiederholung des Bildes */
  display: flex; /* Für Inhalts-Zentrierung */
  margin-top:10px;
  padding:14px;
  justify-content: center;
  align-items: center;
  z-index: 999;
}
.InfoBee img {
	max-width:80%; 
  background-image:url('https://medien.die-foto-macher.de/myPilot/tinywhoopBee.webp'); 
  background-size: cover; /* Skaliert das Bild, um den Container zu bedecken, ohne Verzerrung */
  background-position: center; /* Zentriert das Bild */
  background-repeat: no-repeat; /* Verhindert Wiederholung des Bildes */
  display: flex; /* Für Inhalts-Zentrierung */
  padding:12px;
  justify-content: center;
  align-items: center;
  z-index: 999;
}
.BildTxT img {
  max-width:99.8%;  
  background-size: cover; /* Skaliert das Bild, um den Container zu bedecken, ohne Verzerrung */
  background-position: center; /* Zentriert das Bild */
  background-repeat: no-repeat; /* Verhindert Wiederholung des Bildes */
  display: flex; /* Für Inhalts-Zentrierung */
  justify-content: center;
  align-items: center;
  z-index: 999;
}
.myPilotFPVdElOgO img {
	max-width:99.8%;  
  background-image:url('https://autor.die-foto-macher.de/myFPVdeLoGo.webp');
  background-size: cover; /* Skaliert das Bild, um den Container zu bedecken, ohne Verzerrung */
  background-position: center; /* Zentriert das Bild */
  background-repeat: no-repeat; /* Verhindert Wiederholung des Bildes */
  display: flex; /* Für Inhalts-Zentrierung */
  justify-content: center;
  align-items: center;
  z-index: 999;
}
.myPilotFMlOgO img {
	max-width:99.8%;  
  background-image:url('https://medien.die-foto-macher.de/myLoGo.webp');
  background-size: cover; /* Skaliert das Bild, um den Container zu bedecken, ohne Verzerrung */
  background-position: center; /* Zentriert das Bild */
  background-repeat: no-repeat; /* Verhindert Wiederholung des Bildes */
  display: flex; /* Für Inhalts-Zentrierung */
  justify-content: center;
  align-items: center;
  z-index: 999;
}
.myPilotFMlOgOw img {
	max-width:99.8%;  
  background-image:url('https://medien.die-foto-macher.de/myLoGoW.webp');
  background-size: cover; /* Skaliert das Bild, um den Container zu bedecken, ohne Verzerrung */
  background-position: center; /* Zentriert das Bild */
  background-repeat: no-repeat; /* Verhindert Wiederholung des Bildes */
  display: flex; /* Für Inhalts-Zentrierung */
  justify-content: center;
  align-items: center;
  z-index: 999;
}
.SchoenesWetter img {
  max-width:99.8%;  
  background-image:url('https://medien.die-foto-macher.de/myPilot/real/IMG_20260226_154629245.jpg'); 
  background-size: cover; /* Skaliert das Bild, um den Container zu bedecken, ohne Verzerrung */
  background-position: center; /* Zentriert das Bild */
  background-repeat: no-repeat; /* Verhindert Wiederholung des Bildes */
  display: flex; /* Für Inhalts-Zentrierung */
  border-top-left-radius:22px;
  border-bottom-right-radius:22px;
  justify-content: center;
  align-items: center;
  z-index: 999;
}
.SchoenWetter img {
  max-width:99.8%;  
  background-image:url('https://autor.die-foto-macher.de/dragonpilot/projekte/landing_aerea.jpg'); 
  background-size: cover; /* Skaliert das Bild, um den Container zu bedecken, ohne Verzerrung */
  background-position: center; /* Zentriert das Bild */
  background-repeat: no-repeat; /* Verhindert Wiederholung des Bildes */
  display: flex; /* Für Inhalts-Zentrierung */
  border-top-left-radius:22px;
  border-bottom-right-radius:22px;
    /* Bilder TEST */ 
  background-color: rgba(0, 0, 0, 0.5); /* Schwarz mit 50% Transparenz */
  color: #ffffff; /* Weißer Text für gute Lesbarkeit */
  box-shadow: 0 0 12px rgba(255, 255, 255, 0.55);
  /* Bilder TEST */ 
  justify-content: center;
  align-items: center;
  z-index: 999;
}
.LEER {
  max-width:99.8%;  
  height:14px;
}
/* Mein VIDEO */
.myPilotVideoSmartCockpit {
    position:relative;
    display:inline-block; /* Passt sich der Videogröße an */
    width:100%;
    height:480px;
    max-width:1280px; /* Optional: Maximale Breite */
}
.myPilotVideoSmartCockpit video {
    width:100%;
    height:auto;
    display:block; /* Verhindert Leerzeichen unter dem Video */
}
.myPilotVideo {
    position: relative;
    display: inline-block; /* Passt sich der Videogröße an */
    width: 100%;
    max-width: 800px; /* Optional: Maximale Breite */
}
.myPilotVideo video {
    width: 100%;
    height: auto;
    display: block; /* Verhindert Leerzeichen unter dem Video */
}
.videoTiny {
  width: 100%;
  height: auto;
 /*  max-width: 100%; */ 
 /* Verhindert, dass das Video größer als das Original wird */
  position: relative;
  padding-bottom: 55%;
  padding-top: 15px;
  height: 0;
  overflow: hidden;
}
.videoExtraWin {
  width: 100%;
  height: auto;
 /*  max-width: 100%; */ 
 /* Verhindert, dass das Video größer als das Original wird */
 /* position: absolute;
  margin: 0; */
  position: relative;
  display:flex;
  justify-content: center; // horizontal zentriert
  align-items: center;     // vertikal zentriert
 /* padding-bottom: 55%;
  padding-top: 15px; */
  height: 0;
  overflow: hidden;
}
.watermark {
    position: absolute;
    bottom:60px; /* Abstand von unten */
    right:60px;  /* Abstand von rechts */
    width:44%;
    margin-left:0.8%;
/*    margin-bottom:4%; */
/*    opacity: 0.6; /* Wasserzeichen halbtransparent */
    z-index: 10;  /* Stellt sicher, dass es über dem Video liegt */
    background-image:url('https://medien.die-foto-macher.de/myPilot/shows.webp');
    pointer-events: none; /* Klicks gehen durch das Logo hindurch */
}
/* Optional: Wenn es ein Bild/Logo sein soll */
.watermark img {
    width:100%; /* Breite des Logos anpassen */
    height:auto;
}
/* end of : Mein VIDEO */
.netshopTeaser a:hover{
 background-color:#c9c9c9;
 border-radius: 3px 15px 5px 30px;
}
.Maps {
    display:none;
    background-color:#E6E6E6;
    color:#000;
}
.iframeMaps {
	position:relative;
	height:auto;
	min-height:360px;
	min-width:99.99%;
	width:100%;
	/* max-width: var(--max-width); 
    padding-bottom: 56.25%; */
}
.videowrapper {
	position: relative;
	height: 0;
	padding-bottom: 56.25%;
}
.videowrapper iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	/* height: 100%; */
  height:auto;
  min-height:90%;
  min-height:94%;
}
.videowrapperFly {
	position: relative;
	height: 0;
	padding-bottom:8px;
}
.videowrapperFly iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	/* height: 100%; */
  height:420px;
  min-height:420px;
  max-height:420px;
}
.iframevideo {
	position: relative;
	height: 0;
	max-width: var(--max-width); 
	padding-bottom: 56.25%;
}
.iframevideo iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.iframevideo img {
	position:absolute;
	top: 0;
	left: 0;
}
.videomessage {
	position:absolute;
	width:100%;
	top:20px;
	left:0;
}
.videomessage {
	display: flex;
	flex-direction: column;
	align-content: center;
}
iframe {
   margin: 0;
   padding: 0;
   border: none;
   resize: both;
   max-height: 1200px;
}
/* iframe {
    width: 100%; /* Breite anpassen */
    height: 450px; /* Höhe festlegen */
    border: 2px solid #ccc; /* Rahmen definieren */
    border-radius: 8px; /* Abgerundete Ecken */
/* }*/
.iframe-container {
    width: 100%;
}
.responsive-iframe {
    width: 100%;
    aspect-ratio: 16 / 9; /* Seitenverhältnis */
    height: auto; /* Höhe wird automatisch berechnet */
}
.TeaserInside {
  width:100%;
  min-height:360px;
  height:360px;
  background:#000;
  background-color:#000;
/*   background-image:url('https://die-netzwerk-macher.de/medien/gfx/teaser/teaser_start.webp'); */
  background-image:url('https://medien.die-foto-macher.de/myPilot/myPilot1.gif');
  background-size: cover; /* Skaliert das Bild, um den Container zu bedecken, ohne Verzerrung */
  background-position: center; /* Zentriert das Bild */
  background-repeat: no-repeat; /* Verhindert Wiederholung des Bildes */
  display:flex; /* Für Inhalts-Zentrierung */
  vertical-align:top;
  gap:0px;
  box-sizing:border-box;
  justify-content:center;
  align-items:center;
  z-index:999;
}
.TeaserInsideDrohne {
  width:100%;
  min-height:360px;
  height:360px;
  background:#000;
  background-color:#000;
/*   background-image:url('https://die-netzwerk-macher.de/medien/gfx/teaser/teaser_start.webp'); */
  background-image:url('https://medien.die-foto-macher.de/myPilot/myPilot.gif');
  background-size: cover; /* Skaliert das Bild, um den Container zu bedecken, ohne Verzerrung */
  background-position: center; /* Zentriert das Bild */
  background-repeat: no-repeat; /* Verhindert Wiederholung des Bildes */
  display: flex; /* Für Inhalts-Zentrierung */
  justify-content: center;
  align-items: center;
  z-index: 999;
}
.TeaserInsideForum {
  width:100%;
  min-height:360px;
  height:360px;
  background:#000;
  background-color:#000;
/*   background-image:url('https://die-netzwerk-macher.de/medien/gfx/teaser/teaser_start.webp'); */
  background-image:url('https://medien.die-foto-macher.de/myPilot/myPilot6.gif');
  background-size: cover; /* Skaliert das Bild, um den Container zu bedecken, ohne Verzerrung */
  background-position: center; /* Zentriert das Bild */
  background-repeat: no-repeat; /* Verhindert Wiederholung des Bildes */
  display: flex; /* Für Inhalts-Zentrierung */
  justify-content: center;
  align-items: center;
  z-index: 999;
}
.TeaserForum {
  width:100%;
  min-height:360px;
  height:360px;
  background:#000;
  background-color:#000;
/*   background-image:url('https://die-netzwerk-macher.de/medien/gfx/teaser/teaser_start.webp'); */
  background-image:url('https://medien.die-foto-macher.de/myPilot/myPilot.jpg');
  background-size: cover; /* Skaliert das Bild, um den Container zu bedecken, ohne Verzerrung */
  background-position: center; /* Zentriert das Bild */
  background-repeat: no-repeat; /* Verhindert Wiederholung des Bildes */
  display: flex; /* Für Inhalts-Zentrierung */
  justify-content: center;
  align-items: center;
  z-index: 999;
}
.TeaserTestflug {
  width:100%;
  min-height:360px;
  height:360px;
  background:#000;
  background-color:#000;
/*   background-image:url('https://die-netzwerk-macher.de/medien/gfx/teaser/teaser_start.webp'); */
  background-image:url('https://medien.die-foto-macher.de/myPilot/myPilotTestflug.jpg');
  background-size: cover; /* Skaliert das Bild, um den Container zu bedecken, ohne Verzerrung */
  background-position: center; /* Zentriert das Bild */
  background-repeat: no-repeat; /* Verhindert Wiederholung des Bildes */
  display: flex; /* Für Inhalts-Zentrierung */
  justify-content: center;
  align-items: center;
  z-index: 999;
}
.TeaserInsideKamera {
  width:100%;
  min-height:360px;
  height:360px;
  background:#000;
  background-color:#000;
/*   background-image:url('https://die-netzwerk-macher.de/medien/gfx/teaser/teaser_start.webp'); */
  background-image:url('https://medien.die-foto-macher.de/myPilot/myPilot2.gif');
  background-size: cover; /* Skaliert das Bild, um den Container zu bedecken, ohne Verzerrung */
  background-position: center; /* Zentriert das Bild */
  background-repeat: no-repeat; /* Verhindert Wiederholung des Bildes */
  display: flex; /* Für Inhalts-Zentrierung */
  justify-content: center;
  align-items: center;
  z-index: 999;
}
.TeaserInsideBastler {
  width:100%;
  min-height:360px;
  height:360px;
  background:#000;
  background-color:#000;
/*   background-image:url('https://die-netzwerk-macher.de/medien/gfx/teaser/teaser_start.webp'); */
  background-image:url('https://medien.die-foto-macher.de/myPilot/myPilot4.gif');
  background-size: cover; /* Skaliert das Bild, um den Container zu bedecken, ohne Verzerrung */
  background-position: center; /* Zentriert das Bild */
  background-repeat: no-repeat; /* Verhindert Wiederholung des Bildes */
  display: flex; /* Für Inhalts-Zentrierung */
  justify-content: center;
  align-items: center;
  z-index: 999;
}
.TeaserInsideBeginner {
  width:100%;
  min-height:360px;
  height:360px;
  background:#000;
  background-color:#000;
/*   background-image:url('https://die-netzwerk-macher.de/medien/gfx/teaser/teaser_start.webp'); */
  background-image:url('https://medien.die-foto-macher.de/myPilot/myPilot5.gif');
  background-size: cover; /* Skaliert das Bild, um den Container zu bedecken, ohne Verzerrung */
  background-position: center; /* Zentriert das Bild */
  background-repeat: no-repeat; /* Verhindert Wiederholung des Bildes */
  display: flex; /* Für Inhalts-Zentrierung */
  justify-content: center;
  align-items: center;
  z-index: 999;
}
.TeaserInsideInfo {
  width:100%;
  min-height:360px;
  height:360px;
  background:#000;  
 /*   background-image:url('https://die-netzwerk-macher.de/medien/gfx/teaser/teaser_start.webp'); */
  background-image:url('https://medien.die-foto-macher.de/myPilot/myPilot5.gif');
  background-size: cover; /* Skaliert das Bild, um den Container zu bedecken, ohne Verzerrung */
  background-position: center; /* Zentriert das Bild */
  background-repeat: no-repeat; /* Verhindert Wiederholung des Bildes */ 
  display: flex; /* Für Inhalts-Zentrierung */
  justify-content: center;
  align-items: center;
  z-index: 999;
}
.TeaserWebG {
  width:100%;
  min-height:360px;
  height:360px;
  background:#000;  
 /*   background-image:url('https://die-netzwerk-macher.de/medien/gfx/teaser/teaser_start.webp'); */
  background-image:url('https://medien.die-foto-macher.de/myPilot/myPilot6.gif');
  background-size: cover; /* Skaliert das Bild, um den Container zu bedecken, ohne Verzerrung */
  background-position: center; /* Zentriert das Bild */
  background-repeat: no-repeat; /* Verhindert Wiederholung des Bildes */ 
  display: flex; /* Für Inhalts-Zentrierung */
  justify-content: center;
  align-items: center;
  z-index: 999;
}
.TeaserCinemaSpot {
  width:100%;
  min-height:360px;
  height:360px;
  background:#000;
  background-color:#000;
/*   background-image:url('https://die-netzwerk-macher.de/medien/gfx/teaser/teaser_start.webp'); */
  background-image:url('https://medien.die-foto-macher.de/media/quad_vorne_in_der_luft.jpg');
  background-size: cover; /* Skaliert das Bild, um den Container zu bedecken, ohne Verzerrung */
  background-position: center; /* Zentriert das Bild */
  background-repeat: no-repeat; /* Verhindert Wiederholung des Bildes */
  display: flex; /* Für Inhalts-Zentrierung */
  justify-content: center;
  align-items: center;
  z-index: 999;
}
.TeaserRealRobots {
  width:100%;
  min-height:360px;
  height:360px;
  background:#000;
  background-color:#000;
/*   background-image:url('https://die-netzwerk-macher.de/medien/gfx/teaser/teaser_start.webp'); */
  background-image:url('https://medien.die-foto-macher.de/media/realRobots_2002.jpg');
  background-size: cover; /* Skaliert das Bild, um den Container zu bedecken, ohne Verzerrung */
  background-position: center; /* Zentriert das Bild */
  background-repeat: no-repeat; /* Verhindert Wiederholung des Bildes */
  display: flex; /* Für Inhalts-Zentrierung */
  justify-content: center;
  align-items: center;
  z-index: 999;
}
.tgTeaserRealRobots {
  width:100%;
  min-height:360px;
  height:360px;
  background:#000;
  background-color:#000;
/*   background-image:url('https://die-netzwerk-macher.de/medien/gfx/teaser/teaser_start.webp'); */
  background-image:url('https://medien.die-foto-macher.de/media/realRobots_2002.jpg');
  background-size: cover; /* Skaliert das Bild, um den Container zu bedecken, ohne Verzerrung */
  background-position: center; /* Zentriert das Bild */
  background-repeat: no-repeat; /* Verhindert Wiederholung des Bildes */
  display: flex; /* Für Inhalts-Zentrierung */
  justify-content: center;
  align-items: center;
  z-index: 999;
}
.tgTeaserTechGuide {
  display:block;
  width:100%;
  min-height:360px;
  height:360px;
  background:#000;
  background-color:#000;
/*   background-image:url('https://die-netzwerk-macher.de/medien/gfx/teaser/teaser_start.webp'); */
  background-image:url('https://medien.die-foto-macher.de/myPilot/myFly.gif');
  background-size: cover; /* Skaliert das Bild, um den Container zu bedecken, ohne Verzerrung */
  background-position: center; /* Zentriert das Bild */
  background-repeat: no-repeat; /* Verhindert Wiederholung des Bildes */
  display: flex; /* Für Inhalts-Zentrierung */
  justify-content: center;
  align-items: center;
  z-index: 999;
}
/* Speziell */
/* Teaser Mobile */
.tgTeaserInsideMob {
  display:none;
  width:100%;
  min-height:60px;
  height:60px;
  background:#000;
  background-color:#000;
  display: flex; /* Für Inhalts-Zentrierung */
  justify-content: center;
  align-items: center;
  z-index: 999;
}
/* end of Teaser Mobile */
.SysMedia {
  width:100%;
  min-height:360px;
  height:360px;
  background:#000;  
 /*   background-image:url('https://die-netzwerk-macher.de/medien/gfx/teaser/teaser_start.webp'); */
  background-image:url('https://medien.die-foto-macher.de/icon/datdir.png');
  background-size: cover; /* Skaliert das Bild, um den Container zu bedecken, ohne Verzerrung */
  background-position: center; /* Zentriert das Bild */
  background-repeat: no-repeat; /* Verhindert Wiederholung des Bildes */ 
  display: flex; /* Für Inhalts-Zentrierung */
  border-top-left-radius:22px;
  border-bottom-right-radius:22px;
  justify-content: center;
  align-items: center;
  z-index: 999;
}
/* end of Speziell */
/* Spezial Eigene Fotos Bastelecke */
.real1 {
  width:100%;
  min-height:360px;
  height:360px;
  background:#000;  
 /*   background-image:url('https://die-netzwerk-macher.de/medien/gfx/teaser/teaser_start.webp'); */
  background-image:url('https://medien.die-foto-macher.de/myPilot/werkzeug/real1.jpg');
  background-size: cover; /* Skaliert das Bild, um den Container zu bedecken, ohne Verzerrung */
  background-position: center; /* Zentriert das Bild */
  background-repeat: no-repeat; /* Verhindert Wiederholung des Bildes */ 
  display: flex; /* Für Inhalts-Zentrierung */
  border-top-left-radius:22px;
  border-bottom-right-radius:22px;
  justify-content: center;
  align-items: center;
  z-index: 999;
}
.real2 {
  width:100%;
  min-height:360px;
  height:360px;
  background:#000;  
 /*   background-image:url('https://die-netzwerk-macher.de/medien/gfx/teaser/teaser_start.webp'); */
  background-image:url('https://medien.die-foto-macher.de/myPilot/werkzeug/real2.jpg');
  background-size: cover; /* Skaliert das Bild, um den Container zu bedecken, ohne Verzerrung */
  background-position: center; /* Zentriert das Bild */
  background-repeat: no-repeat; /* Verhindert Wiederholung des Bildes */ 
  display: flex; /* Für Inhalts-Zentrierung */
  border-top-left-radius:22px;
  border-bottom-right-radius:22px;
  justify-content: center;
  align-items: center;
  z-index: 999;
}
.real3 {
  width:100%;
  min-height:360px;
  height:360px;
  background:#000;  
 /*   background-image:url('https://die-netzwerk-macher.de/medien/gfx/teaser/teaser_start.webp'); */
  background-image:url('https://medien.die-foto-macher.de/myPilot/werkzeug/real3.jpg');
  background-size: cover; /* Skaliert das Bild, um den Container zu bedecken, ohne Verzerrung */
  background-position: center; /* Zentriert das Bild */
  background-repeat: no-repeat; /* Verhindert Wiederholung des Bildes */ 
  display: flex; /* Für Inhalts-Zentrierung */
  border-top-left-radius:22px;
  border-bottom-right-radius:22px;
  justify-content: center;
  align-items: center;
  z-index: 999;
}
.real4 {
	max-width:99.8%; 
  height:60%;
  min-height:380px;
  max-height:420px;
 /* height:430px; */
  background:#000;  
 /*   background-image:url('https://die-netzwerk-macher.de/medien/gfx/teaser/teaser_start.webp'); */
  background-image:url('https://medien.die-foto-macher.de/myPilot/real/meinDrohnenFlug.jpg');
  background-size: cover; /* Skaliert das Bild, um den Container zu bedecken, ohne Verzerrung */
  background-position: center; /* Zentriert das Bild */
  background-repeat: no-repeat; /* Verhindert Wiederholung des Bildes */
  display: flex; /* Für Inhalts-Zentrierung */
  border-top-left-radius:22px;
  border-bottom-right-radius:22px;
  justify-content: center;
  align-items: center;
  z-index: 999;
}
.real5 {
	max-width:99.8%; 
  height:60%;
  min-height:380px;
  max-height:420px;
 /* height:430px; */
  background:#000;  
 /*   background-image:url('https://die-netzwerk-macher.de/medien/gfx/teaser/teaser_start.webp'); */
  background-image:url('https://medien.die-foto-macher.de/media/Screenshot_20260227-135807.jpg');
  background-size: cover; /* Skaliert das Bild, um den Container zu bedecken, ohne Verzerrung */
  background-position: center; /* Zentriert das Bild */
  background-repeat: no-repeat; /* Verhindert Wiederholung des Bildes */
  display: flex; /* Für Inhalts-Zentrierung */
  border-top-left-radius:22px;
  border-bottom-right-radius:22px;
  justify-content: center;
  align-items: center;
  z-index: 999;
}
/* end of : Spezial Eigene Fotos Bastelecke */
/* Spezial FAVicon B/W */
.FAVlOgO {
  width:60px;
  min-height:60px;
  height:60px;
  background:#000;  
 /*   background-image:url('https://die-netzwerk-macher.de/medien/gfx/teaser/teaser_start.webp'); */
  background-image:url('https://medien.die-foto-macher.de/icon/180faviconW.png');
  background-size: cover; /* Skaliert das Bild, um den Container zu bedecken, ohne Verzerrung */
  background-position: center; /* Zentriert das Bild */
  background-repeat: no-repeat; /* Verhindert Wiederholung des Bildes */ 
  display: flex; /* Für Inhalts-Zentrierung */
  justify-content: center;
  align-items: center;
  z-index: 999;
}
.FAVlOgOB {
  width:100%;
  min-height:360px;
  height:360px;
  background:#000;  
 /*   background-image:url('https://die-netzwerk-macher.de/medien/gfx/teaser/teaser_start.webp'); */
  background-image:url('https://medien.die-foto-macher.de/icon/180favicon.png');
  background-size: cover; /* Skaliert das Bild, um den Container zu bedecken, ohne Verzerrung */
  background-position: center; /* Zentriert das Bild */
  background-repeat: no-repeat; /* Verhindert Wiederholung des Bildes */ 
  display: flex; /* Für Inhalts-Zentrierung */
  justify-content: center;
  align-items: center;
  z-index: 999;
}
.FAVlOgOthor {
  width:120px;
  min-height:120px;
  height:120px;
  background:#000;  
 /*   background-image:url('https://die-netzwerk-macher.de/medien/gfx/teaser/teaser_start.webp'); */
  background-image:url('https://medien.die-foto-macher.de/icon/180faviconBW.png');
  background-size: cover; /* Skaliert das Bild, um den Container zu bedecken, ohne Verzerrung */
  background-position: center; /* Zentriert das Bild */
  background-repeat: no-repeat; /* Verhindert Wiederholung des Bildes */ 
  display: flex; /* Für Inhalts-Zentrierung */
  justify-content: center;
  align-items: center;
  z-index: 999;
}
.LandePlatzH {
  width:100%;
  min-height:134px;
  height:auto;
  float:right;
  background:#000;  
 /*   background-image:url('https://die-netzwerk-macher.de/medien/gfx/teaser/teaser_start.webp'); */
  background-image:url('https://medien.die-foto-macher.de/myPilot/zubehoer/LandeplatzA.webp');
  background-size: cover; /* Skaliert das Bild, um den Container zu bedecken, ohne Verzerrung */
  background-position: center; /* Zentriert das Bild */
  background-repeat: no-repeat; /* Verhindert Wiederholung des Bildes */ 
  display: flex; /* Für Inhalts-Zentrierung */
  justify-content: center;
  align-items: center;
  z-index: 999;
}
.twA16 {
  width:200px;
  min-height:auto;
  height:100px;
  padding:4px;
  background:#000;  
 /*   background-image:url('https://die-netzwerk-macher.de/medien/gfx/teaser/teaser_start.webp'); */
  background-image:url('https://medien.die-foto-macher.de/myPilot/drohnen/tinywhoopA16.webp');
  background-size: cover; /* Skaliert das Bild, um den Container zu bedecken, ohne Verzerrung */
  background-position: center; /* Zentriert das Bild */
  background-repeat: no-repeat; /* Verhindert Wiederholung des Bildes */ 
  display: flex; /* Für Inhalts-Zentrierung */
  justify-content: center;
  align-items: center;
  z-index: 999;
}
.twA16Big {
  width:68%;
  min-height:auto;
  height:280px;
  padding:4px;
  background:#000;  
 /*   background-image:url('https://die-netzwerk-macher.de/medien/gfx/teaser/teaser_start.webp'); */
  background-image:url('https://autor.die-foto-macher.de/dragonpilot/drohnen/tinywhoopA16.webp');
  background-size: cover; /* Skaliert das Bild, um den Container zu bedecken, ohne Verzerrung */
  background-position: center; /* Zentriert das Bild */
  background-repeat: no-repeat; /* Verhindert Wiederholung des Bildes */ 
  display: flex; /* Für Inhalts-Zentrierung */
  justify-content: center;
  align-items: center;
  z-index: 999;
}
.twA16VR {
  padding:4px;
  background:#000;  
 /*   background-image:url('https://die-netzwerk-macher.de/medien/gfx/teaser/teaser_start.webp'); */
  background-image:url('https://autor.die-foto-macher.de/dragonpilot/drohnen/tinywhoopA16.webp');
  background-size: cover; /* Skaliert das Bild, um den Container zu bedecken, ohne Verzerrung */
  background-position: center; /* Zentriert das Bild */
  background-repeat: no-repeat; /* Verhindert Wiederholung des Bildes */ 
  display: flex; /* Für Inhalts-Zentrierung */
  justify-content: center;
  align-items: center;
  z-index: 999;
}
.qdC99 {
  width:200px;
  min-height:auto;
  height:100px;
  padding:4px;
  background:#000;  
 /*   background-image:url('https://die-netzwerk-macher.de/medien/gfx/teaser/teaser_start.webp'); */
  background-image:url('https://medien.die-foto-macher.de/myPilot/drohnen/quadcopterQC99gps.webp');
  background-size: cover; /* Skaliert das Bild, um den Container zu bedecken, ohne Verzerrung */
  background-position: center; /* Zentriert das Bild */
  background-repeat: no-repeat; /* Verhindert Wiederholung des Bildes */ 
  display: flex; /* Für Inhalts-Zentrierung */
  justify-content: center;
  align-items: center;
  z-index: 999;
}
.qdC99Big {
  width:68%;
  min-height:auto;
  height:280px;
  padding:4px;
  background:#000;  
 /*   background-image:url('https://die-netzwerk-macher.de/medien/gfx/teaser/teaser_start.webp'); */
  background-image:url('https://medien.die-foto-macher.de/myPilot/drohnen/quadcopterQC99gps.webp');
  background-size: cover; /* Skaliert das Bild, um den Container zu bedecken, ohne Verzerrung */
  background-position: center; /* Zentriert das Bild */
  background-repeat: no-repeat; /* Verhindert Wiederholung des Bildes */ 
  display: flex; /* Für Inhalts-Zentrierung */
  justify-content: center;
  align-items: center;
  z-index: 999;
}
.qdC99GPS {
  padding:4px;
  background:#000;  
 /*   background-image:url('https://die-netzwerk-macher.de/medien/gfx/teaser/teaser_start.webp'); */
  background-image:url('https://medien.die-foto-macher.de/myPilot/drohnen/quadcopterQC99gps.webp');
  background-size: cover; /* Skaliert das Bild, um den Container zu bedecken, ohne Verzerrung */
  background-position: center; /* Zentriert das Bild */
  background-repeat: no-repeat; /* Verhindert Wiederholung des Bildes */ 
  display: flex; /* Für Inhalts-Zentrierung */
  justify-content: center;
  align-items: center;
  z-index: 999;
}
.AirGPSApp {
  width:99.98%;
  min-height:auto;
  height:180px;
  padding:4px;
  background:#000;  
 /*   background-image:url('https://die-netzwerk-macher.de/medien/gfx/teaser/teaser_start.webp'); */
  background-image:url('https://medien.die-foto-macher.de/myPilot/drohnen/AirGPSAppQC99gps.webp');
  background-size: cover; /* Skaliert das Bild, um den Container zu bedecken, ohne Verzerrung */
  background-position: center; /* Zentriert das Bild */
  background-repeat: no-repeat; /* Verhindert Wiederholung des Bildes */ 
  display: flex; /* Für Inhalts-Zentrierung */
  justify-content: center;
  align-items: center;
  z-index: 999;
}
.QuadSnap {
  width:99.98%;
  min-height:auto;
  height:180px;
  padding:4px;
  background:#000;  
 /*   background-image:url('https://die-netzwerk-macher.de/medien/gfx/teaser/teaser_start.webp'); */
  background-image:url('https://medien.die-foto-macher.de/myPilot//drohnen/20260204-121954-467098-0.thm');
  background-size: cover; /* Skaliert das Bild, um den Container zu bedecken, ohne Verzerrung */
  background-position: center; /* Zentriert das Bild */
  background-repeat: no-repeat; /* Verhindert Wiederholung des Bildes */ 
  display: flex; /* Für Inhalts-Zentrierung */
  justify-content: center;
  align-items: center;
  z-index: 999;
}
.tinywhoop {
  width:100%;
  max-height:380px;
  min-height:auto;
  background:#000;  
 /*   background-image:url('https://die-netzwerk-macher.de/medien/gfx/teaser/teaser_start.webp'); */
  background-image:url('https://medien.die-foto-macher.de/myPilot/real/IMG_20260209_1255TinyWhoop.jpg');
  background-size: cover; /* Skaliert das Bild, um den Container zu bedecken, ohne Verzerrung */
  background-position: center; /* Zentriert das Bild */
  background-repeat: no-repeat; /* Verhindert Wiederholung des Bildes */ 
  display: flex; /* Für Inhalts-Zentrierung */
  justify-content: center;
  align-items: center;
  z-index: 999;
}
.quadcopter {
  width:100%;
  max-height:380px;
  min-height:auto;
  background:#000;  
 /*   background-image:url('https://die-netzwerk-macher.de/medien/gfx/teaser/teaser_start.webp'); */
  background-image:url('https://medien.die-foto-macher.de/myPilot/real/20260209-1558.35QuadcopterGPS.jpg');
  background-size: cover; /* Skaliert das Bild, um den Container zu bedecken, ohne Verzerrung */
  background-position: center; /* Zentriert das Bild */
  background-repeat: no-repeat; /* Verhindert Wiederholung des Bildes */ 
  display: flex; /* Für Inhalts-Zentrierung */
  justify-content: center;
  align-items: center;
  z-index: 999;
}
.luftVO {
  width:100%;
  max-height:240px;
  min-height:auto;
  background:#000;  
 /*   background-image:url('https://die-netzwerk-macher.de/medien/gfx/teaser/teaser_start.webp'); */
  background-image:url('https://medien.die-foto-macher.de/myPilot/drohnen/mydrohne.webp');
  background-size: cover; /* Skaliert das Bild, um den Container zu bedecken, ohne Verzerrung */
  background-position: center; /* Zentriert das Bild */
  background-repeat: no-repeat; /* Verhindert Wiederholung des Bildes */ 
  display: flex; /* Für Inhalts-Zentrierung */
  justify-content: center;
  align-items: center;
  z-index: 999;
}
.adressSpam img {
	max-width:70%;
  background-image:url('https://medien.die-foto-macher.de/myPilot/imprintAdressSPAM.webp');
}
/* end of : Spezial FAVicon B/W */
#winInfo {
  width:100%;
  min-height:25px;
  height:24px;
  background:#000;
  background-color:#000;
  background-image:url('https://medien.die-foto-macher.de/x11dnm/shell_task.webp');
  background-size: cover; /* Skaliert das Bild, um den Container zu bedecken, ohne Verzerrung */
  background-position: center; /* Zentriert das Bild */
  background-repeat: no-repeat; /* Verhindert Wiederholung des Bildes */
  display: flex; /* Für Inhalts-Zentrierung */
  border-top-left-radius:22px;
  border-bottom-right-radius:22px;
  justify-content: center;
  align-items: center;
  z-index: 999;
}
.winTask {
  width:100%;
  min-height:25px;
  height:24px;
  background:#000;
  background-color:#000;
  background-image:url('https://medien.die-foto-macher.de/myPilot/wTask.webp');
  background-size: cover; /* Skaliert das Bild, um den Container zu bedecken, ohne Verzerrung */
  background-position: center; /* Zentriert das Bild */
  background-repeat: no-repeat; /* Verhindert Wiederholung des Bildes */
  display: flex; /* Für Inhalts-Zentrierung */
  justify-content: center;
  align-items: center;
  z-index:999;
  padding:6px;
}
.winBG {
  width:99.2%;
  min-height:auto;
  height:auto;
  background:#000;
  background-color:#000;
  z-index:999;
  padding:6px;  
  color:green;
}
.TeaserInsideMob {
display:none;
}
.InfoMob {
display:none;
}
/* suche + Finde */
input, textarea {
  background-color:#171717;
  color:#FFF;
}
article:after {
	/*clearfix */
	content: "";
	display: block;
	clear: both;
}
.active {
	background:#3d3846;
  /* #1c71d8; */
}
.is-hidden {
	display:none;
  background:#000;
  background-color:#000;
}
.hinweis {
	border-inline-start: thick solid var(--red);
	padding-inline-start: 1em;
}
#suche {
  border:2px solid #1c71d8;
  border-radius:0.5em;
  font-size:1.3em;
  width:10em;
  transition: width 0.5s ease-in-out;
}
#suche:focus {
  font-size:1.3em;
  width:50%;
}
/* end of : suche + Finde */
/* my TOP : Alex*/
#myAlex {
  display: none;
  position: fixed;
  bottom: 20px;
  right: 30px;
  z-index: 99;
  font-size: 18px;
  border: none;
  outline: none;
  background-color:#1c71d8;
  color: white;
  /* cursor: pointer; */
  padding: 15px;
  border-radius: 4px;
}
#myAlex:hover {
  background-color:#555;
}
#myAlex2 {
  display: none;
  position: fixed;
  bottom: 20px;
  left: 30px;
  z-index: 99;
  font-size: 18px;
  border: none;
  outline: none;
  background-color:#1c71d8;
  color: white;
  /* cursor: pointer; */
  padding: 15px;
  border-radius: 4px;
}
#myAlex2:hover {
  background-color:#555;
}
/* myInfoBox */
/* Sehr Schoene Schaltknoepfe */
.glow-on-hover {
    width: 200px;
    height: 38px;
    border: none;
    outline: none;
    color: #fff;
    background: #111;
    cursor: pointer;
    position: relative;
    z-index: 0;
    border-radius: 10px;
}
.glow-on-hover:before {
    content: '';
    background: linear-gradient(45deg, #ff0000, #ff7300, #fffb00, #48ff00, #00ffd5, #002bff, #7a00ff, #ff00c8, #ff0000);
    position: absolute;
    top: -2px;
    left:-2px;
    background-size: 400%;
    z-index: -1;
    filter: blur(5px);
    width: calc(100% + 4px);
    height: calc(100% + 4px);
    animation: glowing 20s linear infinite;
    opacity: 0;
    transition: opacity .3s ease-in-out;
    border-radius: 10px;
}
.glow-on-hover:active {
    color: #000
}
.glow-on-hover:active:after {
    background: transparent;
}
.glow-on-hover:hover:before {
    opacity: 1;
}
.glow-on-hover:after {
    z-index: -1;
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    background: #111;
    left: 0;
    top: 0;
    border-radius: 10px;
}
@keyframes glowing {
    0% { background-position: 0 0; }
    50% { background-position: 400% 0; }
    100% { background-position: 0 0; }
}
/* Sehr Schoene Schaltknoepfe */
/* Grundlegendes Styling der Info-Box */
#promobox {
}
#infoBox {
    position:fixed; /* Bleibt an einer festen Position auf dem Bildschirm */
    bottom:90px;
    right:70%;
    left:4%;
    padding:5px;
    background-color: #007bff;
    color:white;
    border-radius:5px;
    transition:opacity 0.5s ease-in-out; /* Sanfter Übergang */
    z-index:1100;
}
/* Klasse zum Ausblenden des Elements */
.hide {
    opacity: 0;
    pointer-events: none; /* Verhindert Interaktion, wenn unsichtbar */
}

/* Klasse zum Einblenden des Elements */
.show {
    opacity: 1;
    pointer-events: auto;
}
.closeInfoBox {
  color:#aaa;
  line-height:50px;
  font-size:120%;
  position:absolute;
  right:10px;
  text-align:center;
  top:0;
  width:70px;
  text-decoration:none;
}
.closeInfoBox:hover {
  color:#000;
}
/* End my InfoBox */
/* end of : my TOP Alex */
/* Video Teaser Response */
.video-teaser-container {
  position: relative; /* Für das Overlay */
  width: 100%;
  padding-bottom: 56.25%; /* 16:9 Verhältnis (9 / 16 * 100) */
  height: 0;
  overflow: hidden;
  margin: 20px 0;
  cursor: pointer; /* Zeigt an, dass es klickbar ist */
}
.video-teaser-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height:640px;
  border: none;
}
.video-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height:640px;
  background: url('dein-thumbnail.jpg') center/cover no-repeat; /* Ersetze durch dein Bild */
  display: flex;
  justify-content: center;
  align-items: center;
  transition: opacity 0.3s ease;
}
.video-teaser-container:hover .video-overlay {
  opacity: 0; /* Overlay verschwindet beim Hovern */
}
.play-button {
  width: 80px;
  height: 80px;
  background-color: rgba(0, 0, 0, 0.6);
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: background-color 0.3s ease;
}
.play-button:hover {
  background-color: rgba(0, 0, 0, 0.8);
}
/* Dreieck für den Play-Button */
.play-button::after {
  content: '';
  width: 0;
  height: 0;
  border-top: 15px solid transparent;
  border-bottom: 15px solid transparent;
  border-left: 25px solid white;
  margin-left: 5px;
}
/* My Menue */
.topnav {
  overflow:hidden;
  background-color:transparent;
  width:30%;
  float:right;
  position:relative;
  z-index:1;
  margin-right:2%;
}
.topnav #myLinks {
  display: none;
  z-index: 1;
}
.topnav a {
  float: left;
/*  color: white; */
  padding: 4px 6px;
  text-decoration:none;
  font-size: 17px;
  background-color:#ddd;
  color:#1c71d8;
}
.topnav a.icon {
  float: right;
}
.topnav a:hover {
  background-color:#ddd;
  color:#1c71d8;
}
.active {
/*  background-color:transparent; */
  background-color:#ddd;
  color: white;
}
/* end of : My Menue */
/* Sprechblase */
.sprechblase {
position: relative;
padding: 1rem;
border: 2px solid #C2E6F2FF;
margin:0 auto;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
background: #fff;
}
.sprechblase:before {
content: ' ';
position: absolute;
width: 0;
height: 0;
left: 30px;
top: 100%;
border: 12px solid;
border-color: #C2E6F2FF transparent transparent #C2E6F2FF;
}
.sprechblase:after {
content: ' ';
position: absolute;
width: 0;
height: 0;
left: 34px;
top: 100%;
border: 9px solid;
border-color: #ffffff transparent transparent #ffffff;
}
.sprechblase1 {
position: relative;
margin:0 auto;
padding: 1rem;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
background: #3babe2;
}
.sprechblase1:before {
content: ' ';
position: absolute;
width: 0;
height: 0;
left: 28px;
top: -17px;
border-left: 14px solid transparent;
border-right: 14px solid transparent;
border-bottom: 17px solid #3babe2;
}
.sprechblase2 {
position: relative;
padding: 1rem;
font-family: helvetica, tahoma;
border: 4px solid #C2E6F2FF;
margin:0 auto;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
/* text-align: center; */
/* background: #3babe2; */
}
.sprechblase2:before {
content: ' ';
position: absolute;
width: 0;
height: 0;
left: 28px;
top: -17px;
border-left: 14px solid transparent;
border-right: 14px solid transparent;
border-bottom: 17px solid #C2E6F2FF; 
}
.sprechblase2:after {
content: ' ';
position: absolute;
width: 0;
height: 0;
left: 34px;
top: -10px;
border-left: 8px solid transparent;
border-right: 8px solid transparent;
border-bottom: 10px solid #C2E6F2FF;
}
.sprechblase2a {
position: relative;
padding: 1rem;
font-family: helvetica, tahoma;
border: 4px solid #C2E6F2FF;
margin:0 auto;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
/* text-align: center; */
/* background: #3babe2; */
}
.sprechblase2a:before {
content: ' ';
position: absolute;
width: 0;
height: 0;
right: 28px;
top: -17px;
border-left: 14px solid transparent;
border-right: 14px solid transparent;
border-bottom: 17px solid #C2E6F2FF; 
}
.sprechblase2a:after {
content: ' ';
position: absolute;
width: 0;
height: 0;
right: 34px;
top: -10px;
border-left: 8px solid transparent;
border-right: 8px solid transparent;
border-bottom: 10px solid #C2E6F2FF;
}
.sprechblase5 {
padding: 1rem;
margin-left: 34px;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
position: relative;
/* background: #0fd509; */
border:2px solid #C2E6F2FF;
}
.sprechblase5:after, .sprechblase5:before {
right: 100%;
top: 50%;
border: solid transparent;
content: " ";
height: 0;
width: 0;
position: absolute;
pointer-events: none;
}
.sprechblase5:after {
border-color: rgba(15, 213, 9, 0);
border-right-color:#C2E6F2FF;
border-width: 20px;
margin-top: -20px;
}
.sprechblase5:before {
border-color: rgba(0, 0, 0, 0);
border-right-color:#C2E6F2FF;
border-width: 34px;
margin-top: -34px;
}
.sprechblase6 {
position: relative;
padding: 1rem;
border: 2px solid #C2E6F2FF;
margin:0 auto;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
background: #fff;
}
.sprechblase6:before {
content: ' ';
position: absolute;
width: 0;
height: 0;
left: 30px;
top: 100%;
border: 12px solid;
border-color: #C2E6F2FF transparent transparent #C2E6F2FF;
}
.sprechblase6:after {
content: ' ';
position: absolute;
width: 0;
height: 0;
left: 34px;
top: 100%;
border: 9px solid;
border-color: #ffffff transparent transparent #ffffff;
}
.sprechblase7 {
position: relative;
padding: 1rem;
border: 2px solid #C2E6F2FF;
margin:0 auto;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
background: #fff;
}
.sprechblase7:before {
content: ' ';
position: absolute;
width: 0;
height: 0;
left: 30px;
top: 100%;
border: 12px solid;
border-color: #C2E6F2FF transparent transparent #C2E6F2FF;
}
.sprechblase7:after {
content: ' ';
position: absolute;
width: 0;
height: 0;
left: 34px;
top: 100%;
border: 9px solid;
border-color: #ffffff transparent transparent #ffffff;
}
.sprechblase8 {
position: relative;
padding: 1rem;
border: 2px solid orange;
margin:0 auto;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
background: #fff;
}
.sprechblase8:before {
content: ' ';
position: absolute;
width: 0;
height: 0;
left: 30px;
top: 100%;
border: 12px solid;
border-color: orange transparent transparent orange;
}
.sprechblase8:after {
content: ' ';
position: absolute;
width: 0;
height: 0;
left: 34px;
top: 100%;
border: 9px solid;
border-color: #ffffff transparent transparent #ffffff;
}
/* end of : sprechblase */
/* Mouse over QRCode Chat */
.QRCodeChat {
    position:relative;
    text-decoration: none;
    color: #000;
    font-weight: bold;
}
/* Das Bild wird standardmäßig versteckt und nimmt keinen Platz ein */
.hoverQRCode {
    display: none;
    position: absolute;
    /* Passe die Positionierung hier an deine Bedürfnisse an */
    top:22px; 
    left:-600;
    width:770px;
    height:770px;
    background-image: url('https://medien.die-foto-macher.de/media/Ginlo2QR.jpg');
    background-size:cover;
    margin-right:44%;
    z-index: 10;
}
/* Beim Mouseover (:hover) wird das Bild sichtbar */
.QRCodeChat:hover .hoverQRCode {
    display: block;
}
/* end of : QRCode Chat */
/* Zitate | */
blockquote::before,
blockquote::after {
  content: '';
  display: block;
  height: 2em;
  width: 100%;
  background-image: url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%22-6%200%2012%204%22%3E%3Ctext%20x%3D%220%22%20y%3D%222%22%20text-anchor%3D%22middle%22%20font-family%3D%22Georgia%22%20font-size%3D%223%22%20fill%3D%22hsl%28224%2C%2060%25%2C%2060%25%29%22%3E%E2%80%9E%3C%2Ftext%3E%3Cg%20stroke-width%3D%220.1%22%20stroke%3D%22hsl%28224%2C%2060%25%2C%2060%25%29%22%3E%3Cline%20x1%3D%226%22%20x2%3D%221.5%22%20y1%3D%222%22%20y2%3D%222%22%2F%3E%3Cline%20x1%3D%22-6%22%20x2%3D%22-1.5%22%20y1%3D%222%22%20y2%3D%222%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E');
  background-position: center;
  background-repeat: no-repeat;
  align-self: center;
}
blockquote:lang(en)::before,
blockquote:lang(de)::after {
  transform: rotate(.5turn);
}
/* end of : Zitate */
.DDNSchcKMob {
display:none;
}
.DDNSchcKDesk {
display:block;
}
/* Speziell */
.Desktop {
display:block;
}
.KeinDesktop {
display:block;
}
.DesktopWiXXerFucker {
display:block;
}
.MobileMenu {
display:Block;
}
.Mobile {
display:none;
}
.MobileWiXXerFucker {
display:none;
}
.KeinMobile {
display:none;
}
.Mobil {
display:none;
}
.DumpfbackenBOX {
display:none;
}
.ANGESCHALTET {
display:none;
}
.ABGESCHALTET {
display:block;
}
.PsYcHoPaTeNbOx {
display:none;
}
/* =========================================================
   TG TEASER - TEST / FIX
   ========================================================= */
.tgDesktop {
    display: block !important;
  /*  visibility: visible !important; */
}
.tgMobile {
    display: none !important;
    visibility: visible !important;
}
/* viewport */
/* Für alle geräte mit maximaler bildschirmbreite von 1300px: */
/* eventuell wenn Mobile Response benötigt */
/* #artSPEZbox {width:100%;-webkit-flex-direction: column;flex-direction: column;flex-basis: auto;} .artSPEZ2 { float:right;width:100%;margin-left:0.2%;margin-right:0.8%;padding:4px;box-sizing:border-box;} .artSPEZ2:last-child {margin-right:0;} .artSPEZ1 { float:left;width:100%;margin-left:1%;margin-right:1%;padding:4px;box-sizing:border-box;height:auto; } .artSPEZ1:last-child {margin-right:0%;} */
/* viewport */
@media all and (max-width: 1024px) {
#mhcSPEZbox {width:100%;-webkit-flex-direction: column;flex-direction: column;flex-basis: auto;text-decoration: none;} .mhcSPEZ2 { float:right;width:100%;margin-left:0.2%;margin-right:0.8%;padding:4px;box-sizing:border-box;text-decoration: none;} .mhcSPEZ2:last-child {margin-right:0;text-decoration: none;} .mhcSPEZ1 { float:left;width:100%;margin-left:1%;margin-right:1%;padding:4px;box-sizing:border-box;height:auto;text-decoration: none;} .mhcSPEZ1:last-child {margin-right:0%;text-decoration: none;}
#netbox { -webkit-flex-direction: column;flex-direction: column;flex-basis: auto;text-decoration: none;} .net { float: left; width: 100%; margin-right: 2%; padding: 4px; background: transparent; box-sizing: border-box;text-decoration: none;} .netspecial { width: 100%; margin-right: 2%; padding: 4px; background: transparent; box-sizing: border-box;} .netforum { width: 100%; margin-right: 2%; padding: 4px; background: transparent; box-sizing: border-box;} .nettimeLine { width: 100%; margin-right: 2%; padding: 4px; background: transparent; box-sizing: border-box;text-decoration: none;} .netshop { width: 100%; margin-right: 2%; padding: 4px; background: transparent; box-sizing: border-box;text-decoration: none;}
#netartbox { -webkit-flex-direction: column;flex-direction: column;flex-basis: auto;text-decoration: none;} .netart {float: left;width: 100%;margin-right: 2%;padding: 4px;box-sizing: border-box;padding:18px;box-sizing: border-box;border: 1px solid rgba(255,255,255,.15);background: linear-gradient(180deg, #131313 0%, 0d0d0d 100%);box-shadow: 0 4px 14px rgba(0,0,0,.45);border-radius:11px;margin-bottom: 20px;text-decoration: none;} .netartspecial { width: 100%; margin-right: 2%; padding: 4px; background: transparent; box-sizing: border-box;text-decoration: none;} .netartforum { width: 100%; margin-right: 2%; padding: 4px; background: transparent; box-sizing: border-box;text-decoration: none;} .netarttimeLine { width: 100%; margin-right: 2%; padding: 4px; background: transparent; box-sizing: border-box;text-decoration: none;} .netartshop { width: 100%; margin-right: 2%; padding: 4px; background: transparent; box-sizing: border-box;text-decoration: none;}
.iframevideo {position:relative;height:auto;min-height:320px;width:auto;min-width:95%;margin-right:2%;margin-left:2%;} #stopp {display:none;} .NoMobile {display:none;} .TeaserInside {display:none;} .TeaserInsideDrohne {display:none;} .TeaserInsideKamera {display:none;} .TeaserInsideBastler {display:none;} .TeaserInsideBeginner {display:none;} .TeaserTestflug {display:none;} .tgTeaserRealRobots {display:none;} .TeaserRealRobots {display:none;} .TeaserTechGuide {display:none;}  .tgTeaserTechGuide {display:none;} .tgTeaserInsideMob {display:Block;background-color:#000;width:100%;min-height:30px;height:30px;z-index: 999;} .TeaserInsideMob {display:Block;background-color:#000;width:100%;min-height:30px;height:30px;z-index: 999;} .InfoMob {display:block;width:100%;min-height:auto;height:auto;z-index: 999;} .PsYcHoPaTeNbOx {display:block;}
#winInfo {display:none;} .winTask {display:none;} .winBG {display:block;color:#000;background:transparent;background-color:transparent;} #promobox {display:none;} .cms {width:100%;background-color:#99c1f1;padding:4px;} .cmsBG {width:100%;margin-top:0;background-color:#99c1f1;} .DDNSchcKMob {display:block;width:100%;min-height:auto;height:auto;z-index: 999;} .DDNSchcKDesk {display:none;} .Mobil {display:block;} .MobileMenu {display:Block;}.Mobile {display:block;} .KeinMobile {display:block;} .MobileWiXXerFucker {display:Block;}  .keinDesktop {display:none;} .Desktop {display:none;} .DesktopWiXXerFucker {display:none;} .TeaserInsideForum {display:none;} .TeaserCinemaSpot {display:none;}  .TeaserInsideInfo {display:none;} .LoGo img {max-width:18%;} .FMLoGo img {max-width:62%;margin-bottom:18px;} 
.tgDesktop {display: none !important;} .tgMobile {display: block !important;} .abstandshalter {width:100%;height:7vh;max-height:9vh;aspect-ratio: 25 / 1;}
}
@media all and (max-width:700px) {
.tgMobile {display: none !important;} .tgMobile {display: block !important;} .abstandshalter {width:100%;height:12vh;max-height:14vh;aspect-ratio: 25 / 1;}
}
/*
  	Copyright 2026 | DragonPilot alias Alexander, Thomas Niesner | IT seit 1997
	Handgemachtes als ständige Fixes und oder Bug Fehlersuche | statische Webseiten 
	seit internet beginns |  ex Unternehmung "die-netzwerk-macher.de" ob nun Inviduelle
	Programmierung oder Templates CMS Optimierungen Wordpress; Drupal; Burning Board;
	Woltlab Suite; Jomla; oder sonstige Exoten 
*/