/* Allgemeine Styles für den Arbeitsbereich ('main') der Anwendung */
.content-center {
    display: flex;
    justify-content: center;
    align-content: center;
}

.info {
    font-size: 100%;
    font-weight: bold;
    color: green;
}

.error {
    font-size: 100%;
    font-weight: bold;
    font-style: italic;
    color: red;
}

.error a {
    font-size: 100%;
    font-weight: bold;
    font-style: italic;
    color: #A00000;
}

.warning {
    font-size: 100%;
    font-weight: bold;
    font-style: italic;
    color: #A00000;
}

.warning a {
    font-size: 100%;
    font-weight: bold;
    font-style: italic;
    color: #800000;
}

/* headerClass für eine h:dataTable */
.tablehead {
    font-size: 100%;
    font-weight: bold;
    color: white;
    background: green;
    text-align: center;
}

.tablehead a {
    color: white;
    text-decoration: none;
}

/* Row-Class für abwechselnde Zeilenfärbung in einer h:dataTable */
.tableoddrow {
    background: white;
}

.tableevenrow {
    background: #DEFEDE;
}

/* Positionierungen für Buttons und Eingabefelder im Arbeitsbereich */
.buttoncenter {
    text-align: center;
}

.buttonright {
    text-align: right;
}

.column30 {
    width: 30em;
    float: left;
}

.column20 {
    width: 20em;
    float: left;
}

.column15 {
    width: 15em;
    float: left;
}

.column13 {
    width: 13em;
    float: left;
}

.column10 {
    width: 10em;
    float: left;
}

.column8 {
    width: 8em;
    float: left;
}

.column6 {
    width: 6em;
    float: left;
}

/* Positionierungen für Tabelleneinträge der Listen in der Durchführung */
.colright6 {
    text-align: right;
    width: 6em;
}

.colright8 {
    text-align: right;
    width: 8em;
}

.colcenter5 {
    text-align: center;
    width: 5em;
}

.colcenter5bold {
    text-align: center;
    font-weight: bold;
    width: 5em;
}

.colcenter10 {
    text-align: center;
    width: 10em;
}

.colcenter10bold {
    text-align: center;
    font-weight: bold;
    width: 10em;
}

.colright6gray {
    text-align: right;
    width: 6em;
    background-color: #C0C0C0;
}

.colcenter5gray {
    text-align: center;
    width: 5em;
    background-color: #C0C0C0;
}

/* Positionierung für Tabelleneinträge der Auswertung nach Schülerzahlen */
.colSStufe {
    width: 8em;
    vertical-align: top
}

.colKlasse {
    width: 3em;
}

.colLimit {
    width: 10em;
}

.colAnzahl {
    text-align: center;
    width: 3em;
}

/* Positionierungen für Tabelleneiträge für SBH in der Durchführung */
.section1 {
    float: left;
    width: 35em;
}

.section2 {
    float: left;
    width: 25em;
    text-align: left;
}

.section3 {
    float: left;
    width: 9em;
    text-align: right;
}

.section4 {
    float: left;
    width: 10em;
}

.section6 {
    float: left;
    width: 15em;
}

.section7 {
    float: left;
    width: 15em;
    text-align: right;
}

.section5 {
    float: left;
}

/* Validierungsfehler bei einem Eingabefeld */
.inputText {
    font-size: 90%;
    font-weight: normal;
    text-align: left;
}

.inputTextError {
    font-size: 90%;
    color: #400000;
    background: #FFAAAA;
}

/* Element unterhalb fortsetzen */
.newline {
    clear: both;
}

.pt {
    padding-top: 0.5rem;
}

/* ein- und ausblendbarer Filterbereich */
.filter {
    padding: 0.5em;
    background: #EEFFEE;
    border: 1px solid green;
}

/* Plus, Plus 10, Minus, Minus 10 - Links*/
.orderPlus, .orderMinus, .orderPlus10, .orderMinus10 {
    text-decoration: none;
}

/* Hintergrundfarbe für PlusMinus-Komponenten beim Erreichen des Maximal- bzw. Minimalwertes */
.topValue {
    background-color: #FFDDDD;
}

.bottomValue {
    background-color: #DDDDFF;
}

/*	Fieldset wird bei Formularen fuer WAI verwendet werden,
	im Normalfall muss es jedoch nicht sichtbar sein. */
fieldset {
    border: 0;
}

/* Formatierungen für diverse Suchkritierien */
.label {
    clear: both;
    float: left;
    width: 12em;
    height: 2em;
}

.field {
    height: 2em;
}

/* Untergliederung mit grünem Hintergrund */
.head {
    background: lightgreen;
}


/* Formatierungen für die Kontoauszüge */
.textsection {
    float: left;
    width: 20em;
    font-weight: bold;
    font-size: 110%;
    height: 1.5em;
    background-color: #e3dede;
    padding: 0.2em;
}

.moneysection {
    float: left;
    text-align: right;
    width: 8em;
    font-weight: bold;
    font-size: 110%;
    height: 1.5em;
    background-color: #DEFEDE;
    padding: 0.2em;
}

.textsectiondetail {
    float: left;
    width: 15em;
    font-weight: bold;
    height: 1.5em;
    padding: 0.2em;
}

.moneysectiondetail {
    float: left;
    text-align: right;
    width: 8em;
    font-weight: bold;
    height: 1.5em;
    padding: 0.2em;
}

.overlay {
    position: absolute;
    top: 0;
    z-index: 100;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.3);
}

.cv-spinner2 {
    height: 100%;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.spinner2 {
    border: 5px solid #f3f3f3;
    border-radius: 50%;
    border-top: 5px solid #3498db;
    width: 40px;
    height: 40px;
    -webkit-animation: spin 0.8s linear infinite; /* Safari */
    animation: spin 0.8s linear infinite;
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

.buttonPagination {
    border: 1px solid rgba(0, 0, 0, 0);
    margin: 0 0.125em;
    background: inherit;
    cursor: pointer;
    height: 2em;
}

.buttonPagination:hover {
    background: gainsboro;
}

.activeButtonPagination {
    border: 1px solid rgba(0, 0, 0, 0);
    margin: 0 0.125em;
    background: #e3f2fd;
    cursor: pointer;
    height: 2em;
}

.ml-1 {
    margin-left: 1em;
}

.dialog {
    display: block;
    position: fixed;
    z-index: 1000;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgba(0, 0, 0, 0.4);
}

.hidden {
    display: none;
}

.dialog-content {
    background-color: #fefefe;
    margin: 15% auto;
    padding: 20px;
    width: 80%;
    max-width: 800px;
    color: #666666;
    border: 0.2em solid darkgreen;
}

.dialog-header {
    display: flex;
    justify-content: center;
}

.dialog-button-panel {
    display: flex;
    justify-content: flex-end;
}

.dialog-button {
    margin-right: 1em;
}