input[type=text], input[type=email], .select-single, label {
    padding: 2px;
    font-family: inherit;
    width: 25%;
}

input[type=text].small {
    width: 10%;
}

input[type=date].small {
    width: auto;
}


input[type=text].middle {
    width: 60%;
}

input[type=date].middle {
    width: 60%;
}


/*
select {
    padding: 2px;
    font-family: inherit;
    width: 60%;
}
*/

/*
input:required, select:required {
    border-left: 5px solid #4287f5;
    border-bottom: 1px solid grey;
    border-right: 1px solid grey;
    border-top: 1px solid grey;
    border-radius: 2px;
    padding: 2px;
}
*/

label, input[type=checkbox] {
    cursor: pointer;
}

.dates {
    display: none;
}

.readonly {
    background-color: #f1f1f1;
    border: none;
    cursor: not-allowed;
}

.text-grey {
    color: grey;
}

.mouse-disabled {
    cursor: not-allowed;
}


.smallest {
    font-size: 0.6em;
    text-align: center;
    width: 100%;
}



.right-box {
    display: inline-block;
    float: right;
    width: 53%;
}

.schulferien {
    width: 100%;
    cursor: pointer;
}

.big-img {
    position: fixed;
    width: 80%;
    left: 10%;
    top: 15%;
    z-index: 101;
    background: white;
    box-shadow: 0 0 10px 10px rgba(0,0,0,0.2);
}

.close {
    position: fixed;
    top: 16%;
    left: 11%;
    z-index: 102;
    font-size: 1.4em;
    color: grey;
    cursor: pointer;
    display: none;
}

textarea {
    width: 80%;
    font-size: 0.6em;
    padding: 5px;
    font-family: inherit;
    resize: none;
    height: 250px;
}

.headline {
    padding-top: 25px;
    font-size: 1.2em;
    margin-bottom: 5px;
}


.mini-headline {
    margin-top: 60px;
    margin-block-end: 0.5em;
    font-weight: bold;
}

/*      Aber hier quasi die neue Seite mit iframe     */

.over-modal {
    position: absolute;
    width: 99%;
    height: 99%;
    
}

.modal {
    position: absolute;
    height: 80vh;
    min-width: 50%;
    width: 80%;
    margin-left: 10%;
    margin-top: 5vh;
    background-color: rgb(255,255,255,0.9);
    padding: 15px;
    font-size: 1.2em;
    font-family: Calibri;
    border-radius: 15px;
    box-shadow: 3px 3px 5px rgba(155,155,155,0.8);
}

.mini-modal {
    position: fixed;
    width: 50px;
    height: 50px;
    bottom: 60px;
    right: 60px;
    background-color: rgb(255,255,255,0.9);
    border-radius: 50%;
    text-align: center;
    align-content: center;
    font-size: 1.5em;
    box-shadow: 3px 3px 5px rgba(155,155,155,0.8);
    cursor: pointer;
    display: none;
}

.mini-modal:hover {
    background-color: #fff;
    width: 60px;
    height: 60px;
    font-size: 1.8em;
    box-shadow: 3px 3px 8px rgba(155,155,155,0.8);
    
}