@font-face {
    font-family: 'Slammertag';
    src: url('slammertag.ttf') format('truetype');
}

body {
    margin: 0;
    padding: 0;
    font-family: Arial, sans-serif;
    background: linear-gradient(to top, #4f4f4f, #dcdcdc); /* Umgekehrter Farbverlauf */
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
    border: 5px solid #2f2f2f; /* Dezenter dunkelgrauer Rahmen */
    box-sizing: border-box;
}

.container {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    height: 100%;
}

.logo-link, .text-link {
    text-decoration: none; /* Versteckt die Unterstreichung des Links */
    color: inherit; /* Erbt die Farbe vom umgebenden Element */
}

.logo-link:hover, .text-link:hover {
    text-decoration: none; /* Stellt sicher, dass auch beim Hover keine Unterstreichung angezeigt wird */
}

.logo {
    max-width: 150px; /* kleinere maximale Breite für das Logo */
    height: auto;
    margin-bottom: 20px; /* Abstand zum Text */
}

h1 {
    color: #000000; /* schwarze Schriftfarbe */
    font-size: 48px;
    font-family: 'Teko', sans-serif; /* Elegante Schriftart */
    text-shadow: 
        -1px -1px 0 #ffffff,  
         1px -1px 0 #ffffff,
         -1px  1px 0 #ffffff,
          1px  1px 0 #ffffff; /* weißer Rahmen um die Schrift */
    margin: 0; /* Entfernt den Standardabstand */
}

.red-n {
    color: red; /* rote Schriftfarbe */
    font-family: 'Slammertag', sans-serif; /* Spezifische Schriftart für das "N" */
    font-size: 1em; /* Schriftgröße gleich halten */
}