/* Styling für Input-Feld "Suche in URL... */
                    
body {
    /* Styling für Hintergrund der Web-Seite */
    background-color: #fdf5e6;

    /* Styling für oberste Zeile ("Input-Feld", "Lösch-Button", Button "Zurück zur Startseite" als flex */    
    .container {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 5px;
    }

     /* Styling für Gruppe "Input-Feld" und "Lösch-Button" als flex (in container) */   
    .inputWrapper {
        display: flex;
        border: 2px solid #8c632c;
        padding: 5px;
        border-radius: 8px;
        gap: 10px;
        background-color:rgb(218, 213, 213);
    }

    /* Styling für Eingabefeld "im Namen suchen ..." */    
    #input {
        padding: 8px;
        border-radius: 5px;
        border: 1px solid #ccc;
    }

/*    input {
        background-color: rgb(220, 234, 246);
        width: auto;
        height: 35px;
    }*/

    /* Styling für Button "Zurück zur Startseite" */
    .btn_zurück {
        border: 2px solid #040009; /* schwarzer Rahmen */
        padding: 8px 12px;
        border-radius: 5px;
        background-color:rgb(203, 208, 229);
        color: #000201;
        cursor: pointer;
        margin-left: 10px; /* Abstand*/
    }

    .btn_zurück:hover {
        background-color: #cdb38b;
    } 

    .btn_löschen {
        padding: 8px 12px;
        border-radius: 5px;
        border: 2px solid #040009;
        color: #000201;
        cursor: pointer;
        font-size: 14px;
        height: 40px;
        background-color:rgb(203, 208, 229);
    }

    .btn_löschen:hover {
        background-color: #cdb38b;
    }

    /* Styling Tabelle: Breite, einfache Rahmen, Schriftarten u. Größe, linksbündig */
    table {
        width: 100%;
        border-collapse: collapse;
        font-family: sans-serif, arial;
        font-size: 14px;
        text-align: left;
    }

    /* Styling Tabellenkopf */
    th {
        border: 1px solid black;
        padding: 8px;
        cursor: pointer;
        background-color: rgb(218, 213, 213);
    }

    /* Styling Tabellenzeilen */
    td {
        border: 1px solid black;
        padding: 6px;
        color: blue;
    }

    /* Styling für wechselnde Farben der aufeinander folgenden Zeilen (ungerade Zeilen) */
    tbody tr:nth-child(odd) {
        background-color:#eef3f8;
        color: rgb(5, 5, 254);
    }

/* Reihenfolge der 4 folgenden tbody's beachten! */
    /* Styling für wechselnde Farben der aufeinander folgenden Zeilen (gerade Zeilen)*/
    tbody tr:nth-child(even) {
        background-color: #f7f9fb;
        color: rgb(0, 0, 11);
    }

    /* Styling für die vom Cursor überfahrene Zeile (tr) */
    tbody tr:hover { 
        background-color:#faedd4;
    }

    /* Styling für die vom Cursor überfahrene Zelle (td) */
    tbody td:hover { 
    background-color: #efdfc6; 
    }
}