.adminBtn {
    background-color: #E31E3A;
    color: white;
    border: none;
    padding: 5px 10px;
    margin-top: 6px;
    margin-right: 6px;
    border-radius: 6px;
    font-size: 13px;
    cursor: pointer;

    transition:
        transform 0.2s ease,
        background-color 0.2s ease,
        opacity 0.2s ease;
}

.adminBtn:hover {
    background-color: #2E4A8F;
    transform: scale(1.08);
    opacity: 0.9;
}

        hr {border: 5px solid #E31E3A;}

        #sidebar { 
            width: 190px; 
            background-color:#f2f2f2; 
            color: black;
            height: 100vh;
            flex-shrink: 0;
        }

        #sidebar h2 {
            text-align: center; 
            padding: 20px 0; 
            margin: 0; 
            background-color: #E31E3A; 
            color: #f2f2f2;
        }

        #sidebar ul {
            list-style: none; 
            padding: 0;
            margin: 0;
        }

        #sidebar li {
            border-bottom: 1px solid #ccc;
        }

        #sidebar a {
            display: block; 
            padding: 16px; 
            color: black;
            text-decoration: none;
        }

        #sidebar a:hover {
            background-color: #2E4A8F;
            color: #f2f2f2;
        }

        #container {
             display: flex;
        }

        #mainContent {
        flex: 1;
        padding: 20px;
        }

        /* Beispiel-Karten */
        .contentCard {
            color: #E31E3A;
            background-color: #f2f2f2;
            padding: 15px;
            margin-bottom: 15px;
            border-radius: 8px;
        }

        .contentCard:hover {
            background-color: #2E4A8F;
            color: #f2f2f2;
        }

        .contentCard a:hover {
    color: #f2f2f2;
}

        .contentCard table {
    color: #E31E3A;
}

.contentCard:hover table,
.contentCard:hover th,
.contentCard:hover td {
    color: #E31E3A;
}

.contentCard:hover th {
    background-color: #E31E3A;
    color: white;
}

.contentCard:hover td {
    color: #E31E3A;
}

        body {
    background-color: #f2f2f2;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

header {
    background-color: #2E4A8F;
    color: #E31E3A;
    padding: 15px;
    text-align: center;
    position: relative;
}

.backBtn {
    position: absolute;
    left: 20px;
    top: 15px;
    background-color: #E31E3A;
    color: white;
    padding: 8px 12px;
    border-radius: 6px;
    text-decoration: none;
}

#mainContent {
    max-width: 800px;
    margin: auto;
    padding: 20px;
}

.formBox, .listBox {
    background: white;
    padding: 20px;
    border-radius: 10px;
    margin-bottom: 20px;
}

input, textarea {
    width: 100%;
    padding: 10px;
    margin: 8px 0;
}

.formBox button {
    background-color: #E31E3A;
    color: white;
    border: none;
    padding: 12px;
    width: 100%;
}

.formBox input,
.formBox textarea {
    width: 100%;
    padding: 10px;
    margin: 8px 0;
    box-sizing: border-box;
}

.entry {
    background: #f9f9f9;
    padding: 10px;
    margin-bottom: 10px;
    border-left: 5px solid #E31E3A;
}

.formBox label {
    display: block;
    margin-bottom: 4px;
    font-weight: 600;
}

.formBox input,
.formBox textarea {
    width: 100%;
    box-sizing: border-box;
}

/* ADMIN BUTTONS */

.adminBtn {
    background-color: #E31E3A;
    color: white;
    border: none;
    padding: 4px 8px;
    margin-top: 5px;
    margin-right: 5px;
    border-radius: 5px;
    font-size: 12px;
    cursor: pointer;

    width: auto;

    transition:
        transform 0.2s ease,
        background-color 0.2s ease,
        opacity 0.2s ease;
}

.adminBtn:hover {
    background-color: #2E4A8F;
    transform: scale(1.05);
    opacity: 0.9;
}

/* KOMMENTARBOX */

.commentBox {
    margin-top: 10px;
}

.commentName,
.commentInput {
    width: 100%;
    box-sizing: border-box;

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

    font-size: 13px;

    border-radius: 5px;
    border: 1px solid #ccc;
}

/* SENDEN BUTTON */

.sendComment {
    margin-top: 6px;

    background-color: #E31E3A;
    color: white;

    border: none;
    border-radius: 5px;

    padding: 6px 10px;

    font-size: 13px;

    cursor: pointer;

    width: auto;

    transition:
        background-color 0.2s ease,
        transform 0.2s ease;
}

.sendComment:hover {
    background-color: #2E4A8F;
    transform: scale(1.05);
}

img {
    max-width: 100%;
    height: auto;
    display: block;
    align-items: center;
}

.contentCard img,
.entry img,
.formBox img,
.listBox img {
    max-width: 300px;
    height: auto;
    border-radius: 6px;
}

/* BILDER – zentriert */
img {
    max-width: 100%;
    height: auto;
    display: block;
    margin: 0 auto;
}

/* INPUT-FELDER – nicht volle Breite */
input, textarea {
    width: 100%;
    max-width: 400px;
    padding: 10px;
    margin: 8px 0;
    box-sizing: border-box;
    display: block;
}

/* CONTENTCARDS – breiter */
.contentCard {
    color: #E31E3A;
    background-color: #f2f2f2;
    padding: 15px;
    margin-bottom: 15px;
    border-radius: 8px;
    max-width: 100%;
    width: 100%;
    box-sizing: border-box;
}

.likeBox {
    margin-top: 10px;
}

.likeBtn {
    margin-left: 10px;
    cursor: pointer;
}