@font-face {
    font-family: Ubuntu;
    src: url(/fonts/Ubuntu.ttf);
}

@font-face {
    font-family: FontAwesome;
    src: url(/fonts/fontawesome-webfont.ttf);
}

.sign {
    font-family: FontAwesome !important;
}

#header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 21cm;
}

div#filter {
    display: flex;
    gap: 1rem 1rem;
}



#klassenFilter .w3-dropdown-content,
#lehrpersonenFilter .w3-dropdown-content,
#zimmerFilter .w3-dropdown-content {
    overflow-y: scroll;
    max-height: 50vh;
}

#klassenFilter .w3-dropdown-content,
#klassenFilter button {
    width: 11rem;
    text-align: left !important;

}

#lehrpersonenFilter .w3-dropdown-content,
#lehrpersonenFilter button {
    width: 12rem;
    text-align: left !important;

}

#zimmerFilter .w3-dropdown-content,
#zimmerFilter button {
    width: 16rem;
    text-align: left !important;
}


a {
    text-decoration: none;
}

.flex {
    display: flex;
    justify-content: space-between;
    flex-direction: row;
}

#paper {
    background-color: white;
    border: 1px solid #333;
    width: 21cm;
    min-height: 14.85cm;
    padding: 1cm;
    padding-top: 1.5cm;
    position: relative;
}

#paper.papersize-a4 {
    width: 29.7cm;
    height: 21cm;
}


#tools button {
    border: none;
    background-color: inherit;
    padding: 0.5rem;
    color: #AAA;

}

#ausgabe {
    font-size: 10pt;
    line-height: 1;
}

.header2 {
    margin-bottom: 0.2cm;
    justify-content: right;
}

#ausgabe h3 {
    margin: 0;
    line-height: 1.1;
}

.anmerkung {
    font-size: 12pt;
    text-align: right;
    height: 12pt;
}


table {
    border-collapse: collapse;
}


tr.pause td {
    height: 0.2cm !important;
    font-size: 0;
    border: none;
}

td,
th {
    border: 1pt solid black;
    text-align: center !important;
    width: 3.3cm;
    padding: 0px !important;
    font-weight: 400;
    height: 0.9cm !important;
}

th:first-child,
td:first-child {
    width: 2.5cm !important;
}

.papersize-a4 td,
.papersize-a4 th {
    width: 5cm;
    padding: 0px !important;
    font-weight: 400;
    height: 1.65cm !important;
}

.papersize-a4 td>div {
    width: 100%;
    height: 100%;
}

.papersize-a4 td>div>div {
    width: 33.33333%;
}

.papersize-a4 td>div>div+div {
    border-left: 1px solid black;
}


.papersize-a4 td>div>div>div>div {
    height: 100%;
    display: flex;
    flex-direction: row;
}

.papersize-a4 td>div>div>div>div>div {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.papersize-a4 td>div>div>div>div+div {
    border-left: 1px solid black;
}


th.bordernone {
    border: none;
}



div.stunde {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    flex-wrap: wrap;
    height: 100%;
}



div.lektion {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    column-gap: 0.5rem;
    width: 100%;
    writing-mode: initial;
}

div.lektion div {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
}


.filter {
    display: flex;
    justify-content: left;
    flex-wrap: wrap;
    gap: 1rem;
}


input[class="slider"] {
    display: none;
}

input[class="slider"]+label {
    position: relative;
    padding-left: 2rem;
}


input[class="slider"]+label span {
    position: absolute;
    border-radius: 5px;
    left: 0;
    top: -2px;
    width: 1.5rem;
    height: 1.5rem;
    background: radial-gradient(#eee, #333);
    border: none;
    pointer-events: none;
}

input[class="slider"]:checked+label span {
    background: radial-gradient(#19aeff, #dc0000, #ffc022, #009100);
}

#legendenListen {
    display: flex;
    align-items: flex-start;
    gap: 1cm;
}

dl {
    display: grid;
    grid-template-columns: 2cm 7cm;
    font-size: 10pt;
    margin: 0;
}

dt,
dd {
    margin: 0;
}