#logo_andi{
	position:absolute;		/* oder fixed */
	left:10px;
	top:10px;
	border:0px;
	z-index: 200;
    /* Animation zuweisen */
    animation: fadeOut linear both;
    /* Die wichtigste Zeile: Verknüpft die Animation mit dem Scrollfortschritt */
    animation-timeline: scroll(root);
    /* Bestimmt, in welchem Scroll-Bereich die Animation aktiv ist */
    animation-range: 0px 300px;
	}

@media only screen and (min-width: 1400px) {
	#logo_andi{
	position:absolute;		/* oder fixed */
	left:10px;
	top:10px;
	border:0px;
	z-index: 200;
    /* Animation zuweisen */
    animation: fadeOut linear both;
    /* Die wichtigste Zeile: Verknüpft die Animation mit dem Scrollfortschritt */
    animation-timeline: scroll(root);
    /* Bestimmt, in welchem Scroll-Bereich die Animation aktiv ist */
    animation-range: 0px 300px;
	}
}



@keyframes fadeOut {
  from {
    opacity: 1;
    transform: scale(1); /* Optional: Logo wird gleichzeitig leicht kleiner */
  }
  to {
    opacity: 0;
    transform: scale(0.8);
    pointer-events: none; /* Verhindert, dass das unsichtbare Logo Klicks blockiert */
  }
}