.divHead {
    margin: 0 auto 0 auto;
    width: 99%;
}

.divMain {
    margin: 0 auto;
    padding: 0;
    width: 99%;
}

.divMitte {
    padding: 0;
}

    .divMitte dd {
        overflow: auto;
    }

.dlMitte {
    margin: 0 0 1em 0;
    text-align: center;
}

dd {
    border: solid 1px var(--color-secondary);
    border-top: none;
}

dl {
    padding: 0;
}

    dl dt {
        padding: 0.3em;
        color: #fff;
        background-color: var(--color-secondary);
    }

    dl dd {
        padding: 0.8em;
        margin: 0;
    }

        dl dd p {
            margin: 0;
            padding: 0.3em 0;
            line-height: 1.3em;
        }

.InformationBlock {
    border: 2px solid var(--color-tertiary);
    background-color: #E2F0F9;
    font-size: small;
}

.WarningBlock {
    border: 2px solid #FFDF26;
    background-color: #FFFAE3;
}

.FehlerBlock {
    border: 2px solid #FF0000;
    background-color: #FEECF0;
}

.CustomTextBlock {
    margin: 10px 0 20px 0;
    padding: 20px;
    text-align: left;
}

    .CustomTextBlock div {
        display: inline-flex;
        padding-bottom: 10px;
    }

        .CustomTextBlock div:last-child {
            padding-bottom: 0;
        }

        .CustomTextBlock div h4 {
            font-weight: bold;
            font-size: larger;
        }

        .CustomTextBlock div > img {
            width: 24px;
            margin-right: 15px;
        }

/* 
// -----------------------------------------------------------------------------------
   Beispiele: 
    
<div class="CustomTextBlock InformationBlock">
    <div>
        <img src="resourcehandler.ashx?name=Verschiedenes.Information.svg&type=images" alt="Info Icon" />
        <h4>Information</h4>
    </div>
    <p>This is an informational message for your ASP.NET website!</p>
</div>
    
*/

.content-title {
    min-height: 25px;
    font-size: larger;
}

.BtnNoBorder {
    margin: 0 20px;
    font-size: 1.5em;
    background-color: Window;
    border-style: none;
}

.navbar-grid-container {
    padding-top: 30px;
    padding-bottom: 30px;
    display: grid;
    grid-template-columns: 30% 1fr 30%; /* Container links (Logo) Titel Container rechts (Nav-Buttons) */
    align-items: center;
    gap: 24px;
}

.navbar-logo {
    display: flex;
    justify-content: flex-start;
}

.navbar-title {
    font-size: 32px;
    font-weight: 700;
    color: var(--color-secondary);
    text-align: center;
}

.navbar-buttons-container {
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

.navbar-button-right {
    text-align: right;
    padding-left: 24px;
}

    .navbar-button-right > img {
        cursor: pointer;
    }

.noHoverUnderline:hover {
    text-decoration: none;
}

.navbar-menu-grid-container {
    width: 100%;
    align-items: center;
}

#MainMenu li {
    padding: 0.5rem;
    text-decoration: none;
}

    #MainMenu li:first-child {
        padding-left: 0; /* Entfernt den linken Abstand für das erste Element */
    }

    #MainMenu li:last-child {
        border-right: none; /* Entfernt den rechten Rand für den letzten Menüpunkt */
    }

    #MainMenu li > a.selected {
        color: var(--color-secondary);
    }

#MainMenu a {
    color: #797E86;
    font-size: 16px;
    font-weight: 700;
    padding: 10px 0px;
    text-decoration: none;
}