@media print, screen {
    html {
        height: 100%
    }

    body {
        height: 100%;
    }

    #header {
        height: 120px;
        padding: 20px 0;
        margin: 0 auto;
        border-bottom: 1px solid #777;
        width: auto !important;
        max-width: 922px;
        align-items: center;
    }

    .preConfigText,
    .postConfigText {
        font-weight: bold;
        font-size: 16px;
    }


    .header-top {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
    }

    div.headline {
        padding: 0 25px;
        border-width: 1px;
        letter-spacing: 0.05em;
    }

    div .form {
        padding: 17px;
    }

    .logo img {
        max-height: 95px;
    }

    #polyglotLanguageSwitcher {
        float: right;
        margin: 0.5em 2.5em;
    }

    .languageSwitcher {
        float: right;
        margin: 0.5em 2.5em;
    }

    #translationHelp {
        margin: 0.5em 2.5em;
        line-height: 24px;
        font-size: 16px;
    }

    #breadcrumbs {
        padding: 0.1em 0.3em;
        width: auto !important;
        max-width: 922px;
    }

    #mapid {
        height: 250px;
        width: auto;
        max-width: 922px;
        margin-right: auto;
        margin-left: auto;
    }

    #footer {
        position: relative;
        height: 50px;
        border-top: 1px solid #777;
        margin: -50px auto 0 auto;
        padding: 1em 2.5em;
        width: auto !important;
        max-width: 922px;
    }

    label {
        display: inline-block;
        max-width: 100%;
        margin-bottom: 0.1em;
        padding: 1em 0 0 0;
        font-weight: normal;
    }

    .control-label__text {
        font-size: 20px;
    }

    span.required {
        padding: 1em 0 0 0;
        font-weight: normal;
    }

    input[type="text"]:focus,
    input[type="email"]:focus,
    input[type="password"]:focus,
    input[type="date"]:focus,
    .input-group-append:focus,
    select:focus {
        border-color: #66afe9;
        outline: 0;
        -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6);
        box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6);
    }

    input[type="text"],
    input[type="email"],
    input[type="password"],
    input[type="date"],
    select {
        position: relative;
        width: 100%;
        color: #2b2a2a;
        line-height: 24px;
        font-size: 16px;
        background: white;
        border: 1px solid #777;
        padding: 0 10px;
        transition: all 500ms ease;
        -moz-transition: all 500ms ease;
        -webkit-transition: all 500ms ease;
        -ms-transition: all 500ms ease;
        -o-transition: all 500ms ease;
        font-family: 'Colaborate-light', sans-serif;
        border-radius: 3px;
        height: 40px;
    }

    select {
        -moz-appearance: none !important;
        -webkit-appearance: none !important;
        appearance: none !important;
        cursor: pointer !important;
        background-repeat: no-repeat !important;
        background-position: right !important;
        background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' height='9' width='25'><path fill='grey' d='M0 1l8 8 8-8z'/></svg>") !important;
        padding-right: 30px !important;
    }

    input[disabled], select[disabled], textarea[disabled] {
        background: #fafafa;
        border-color: #c7c7c7;
    }

    textarea {
        position: relative;
        width: 100%;
        line-height: 24px;
        padding: 10px;
        height: 180px !important;
        resize: none;
        background: white;
        border: 1px solid #777;
        font-size: 20px;
        color: #2b2a2a;
        transition: all 500ms ease;
        -moz-transition: all 500ms ease;
        -webkit-transition: all 500ms ease;
        -o-transition: all 500ms ease;
    }

    .no-margin {
        margin: 0;
    }

    .no-padding {
        padding: 0;
    }

    .no-left-padding {
        padding-left: 0;
    }

    .no-right-padding {
        padding-right: 0;
    }

    .dynamicField label {
        display: inline-block;
        max-width: 100%;
        margin-bottom: 0;
        padding: 0;
        font-weight: normal;
        font-size: 16px;
    }

    .pull-left {
        float: left;
    }

    .pull-right {
        float: right;
    }

    .pull-center {
        width: fit-content;
        margin-left: auto;
        margin-right: auto;
    }

    #main {
        width: auto;
        max-width: 922px;
        margin-right: auto;
        margin-left: auto;

        border-width: 1px;
        border-style: solid;
        border-radius: 5px 5px;
    }

    #main .container {
        width: 100%;
    }

    #main, #home, #main-infinite {
        padding-bottom: 0px !important;
    }

    span.label-default-locale {
        font-size: 0.8em;
        color: #ccc;
    }

    div .submit {
        width: 100%;
        margin: 10px 0;
        float: right !important;
    }

    button[type="submit"] {
        width: 100%;
        height: 50px;
        display: inline-block;
        padding: 6px 12px;
        margin-bottom: 0;
        font-size: 18px;
        font-weight: normal;
        line-height: 1.42857143;
        text-align: center;
        white-space: nowrap;
        vertical-align: middle;
        -ms-touch-action: manipulation;
        touch-action: manipulation;
        cursor: pointer;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        background-image: none;
        border: 1px solid transparent;
        border-radius: 4px;
    }

    .button_small {
        width: 20% !important;
    }

    .button_medium {
        width: 35% !important;
    }

    .button_anmeldung {
        background: #02509a;
        color: white;
    }

    div:focus-within > label > span.label-default-locale,
    div:hover > label > span.label-default-locale {
        font-size: 1em;
        color: #000;
    }

    .form-control {
        height: 40px;
    }

    form .last-row {
        margin: 1.5em 0;
    }

    .infotext {
        margin: 1.5em 0;
    }

    .infotext span {
        display: block;
    }

    .infotext label {
        font-size: 16px;
    }

    .positionButton {
        margin: 1em 0;
        height: 50px;
        display: inline-block;
        padding: 0;
        font-size: 18px;
        font-weight: normal;
        line-height: 1.42857143;
        text-align: center;
        white-space: nowrap;
        vertical-align: middle;
        -ms-touch-action: manipulation;
        touch-action: manipulation;
        cursor: pointer;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        background-image: none;
        border: 1px solid transparent;
        border-radius: 4px;

    }

    .checkbox input[type="checkbox"] {
        width: 20px !important;
        height: 20px !important;
    }

    .radio input[type="radio"], .radio-inline input[type="radio"], .checkbox input[type="checkbox"], .checkbox-inline input[type="checkbox"] {
        position: relative;
        margin-left: 0;
    }

    .radio label, .checkbox label {
        padding: 0 10px;
    }

    .description {
        font-size: 16px;
    }

    th {
        width: 33.3%;
    }

    td label {
        padding: 10px 0 0 0;
        font-weight: normal;
        font-size: 16px;
    }

    select {
        font-size: 16px !important;
    }

    hr {
        border-top: 3px solid #02509a !important;
    }

    h2, h3 {
        color: #02509a;
    }


    .locale-switcher label {
        font-size: 14px;
    }

    .locale-switcher select {
        font-size: 14px !important;
        height: 30px;
    }

    body > #wrapper {
        height: auto;
        min-height: 100%;
    }

    .success {
        padding: 15px 25px;
    }

    .imprint {
        position: relative;
        min-height: 1px;
        padding-right: 15px;
        padding-left: 15px;
    }

    #sonata-ba-field-container-select_institution_institutions {
        margin-bottom: 15px !important;
    }

    /*mobile and tablet without landscape mode*/
    @media (max-width: 980px) {
        .headline {
            padding: 15px !important;
        }

        .form {
            padding: 0 !important;
        }

        #header, #breadcrumbs {
            margin: 0 0.5em !important;
            height: auto;
        }

        #mapid {
            height: 150px !important;
        }

        h2 {
            font-size: 20px;
        }

        h3 {
            font-size: 16px;
        }

        h4 {
            font-size: 14px;
        }

        hr {
            margin-top: 10px;
            margin-bottom: 10px;
        }

        .button_small {
            width: 100% !important;
            height: 30px;
            margin-top: 10px;
        }

        .button_medium {
            width: 100% !important;
            height: 30px;
            margin-top: 10px;
        }

        .positionButton {
            display: contents;
        }
    }


    /*mobiles without tablets*/
    @media (max-width: 568px) {
        .infotext label, .description, select, label, input[type="text"], input[type="email"], input[type="password"], input[type="date"], select {
            font-size: 14px !important;
        }

        .form-control, input[type="text"], input[type="email"], input[type="password"], input[type="date"], select {
            height: 30px;
        }

        .employmentTimeFieldSpan {
            padding: 0 !important;
            font-size: 11px !important;
        }
    }

    .form-input-group {
        position: relative !important;
        display: -webkit-box !important;
        display: -ms-flexbox !important;
        display: flex !important;
        -ms-flex-wrap: wrap !important;
        flex-wrap: wrap !important;
        -webkit-box-align: stretch !important;
        -ms-flex-align: stretch !important;
        align-items: stretch !important;
        width: 100% !important;
        margin-bottom: 1rem !important;
    }

    .form-input-group > input {
        position: relative !important;
        -webkit-box-flex: 1 !important;
        -ms-flex: 1 1 auto !important;
        flex: 1 1 auto !important;
        width: 1% !important;
        margin-bottom: 0 !important;
    }

    .input-group-append {
        display: flex;
    }

    .time_type_label {
        margin-left: 5px;
        vertical-align: -webkit-baseline-middle;
    }
    #registration_builder_institutionFromGroup:disabled {
        background-image: none !important;
    }


    .invalidFields{
        background-color: #f2dede!important;
        border-color: #ebccd1!important;
    }

    .card-img{
        max-width: 100%;
        max-height: 200px;
        margin: 0 0 15px 0;
    }

    .card{
        margin: 20px;
        padding: 20px 20px 0 20px;
        border: #02509a solid 2px;
        border-radius: 15px;
    }

    /*.card:hover{*/
    /*    border-color: #02509a;*/
    /*    cursor: pointer;*/

    /*}*/

    .card-selected{
        border-color: #02509a;
    }

    .cards-button-row{
        margin-left: -22px;
        margin-right: -22px;
    }
}