/* Please see documentation at https://docs.microsoft.com/aspnet/core/client-side/bundling-and-minification\
for details on configuring this project to bundle and minify static web assets. */

/*a.navbar-brand {
  white-space: normal;
  text-align: center;
  word-break: break-all;
}*/

main {
    background-image: url('../images/F1GBackground.jpg');
    background-size: cover; /* Passt das Bild an die Größe des Bereichs an */
    background-position: center; /* Zentriert das Bild im Bereich */
    background-repeat: no-repeat; /* Verhindert das Wiederholen des Bildes */
    min-height: 100vh; /* Stellt sicher, dass der Hauptbereich mindestens die Höhe des sichtbaren Bereichs einnimmt */
}

.grid-container {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
}

.card a {
    color: inherit;
    text-decoration: none;
}

.card {
    transition: transform 0.2s ease;
}

    .card:hover {
        transform: scale(1.05);
    }

#f1rankingTable table, thead, tbody, td {
    border: thin solid #800000;
    padding: 1px;
    text-align: center;
    background-color: white;
    color: black;
}
#f1rankingTable .thVertical {
    /*transform: rotate(90deg);*/
    /* Für Safari */
    /*-webkit-transform: rotate(-90deg);*/
    /* Sicherstellen, dass der Text von unten nach oben angezeigt wird */
    /*transform-origin: left bottom;
    -webkit-transform-origin: left bottom;*/
    /* Stil für die Headerzelle */
    writing-mode: vertical-rl;
    -webkit-writing-mode: vertical-rl;
    white-space: nowrap;
    text-align: left;  /*Anpassen je nach Bedarf */
    vertical-align: bottom;
    border: thin solid #800000;
    padding: 4px;
    color: black;
}

#f1rankingTable .tdGoldCell {
    background-color: #FFD700;
    color: black;
    border: thin solid #800000;
}

#f1rankingTable .tdName {
    text-align:left;
}

#f1rankingTable .tdRank {
    vertical-align: top;
}

.list-group-item {
    margin-bottom: 2px;
    border-radius: 5px;
    cursor: pointer;
    display: flex;
    justify-content: space-between; /* Inhalt gleichmäßig verteilen */
    align-items: center; /* Vertikale Zentrierung */
}

    .list-group-item.dropzone {
        min-height: 50px;
        display: flex;
        align-items: center;
        justify-content: space-between; /* Platz für die Nummerierung am rechten Rand */
        font-weight: bold;
        background-color: #f8f9fa;
    }

    .list-group-item.dragging {
        background-color: #e9ecef;
        opacity: 0.7;
    }

.driver-image {
    width: 25px;
    height: 25px;
    margin-left: auto; /* Bild am rechten Rand ausrichten */
}

.driver-name {
    flex-grow: 1; /* Nimmt den verfügbaren Platz ein */
    text-align: left; /* Text linksbündig */
}



