/* resets */
html {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

*, *:before, *:after {
    -webkit-box-sizing: inherit;
    -moz-box-sizing: inherit;
    box-sizing: inherit;
}

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, tt, var, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    line-height: 1.3em;
    vertical-align: baseline;
}

input {
    margin: 0;
    padding: 0;
    font-size: 100%;
    line-height: 1.6em;
    font: inherit;
    vertical-align: baseline;
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
    display: block;
}

blockquote, q {
    quotes: none;
}

    blockquote:before, blockquote:after, q:before, q:after {
        content: '';
        content: none;
    }

/* general */
body {
    overflow-x: hidden;
    background-color: #505e65;
    font-family: Arial, Helvetica, sans-serif;
    color: #5b7b88;
}

input, textarea, button, select, a {
    -webkit-tap-highlight-color: transparent;
}



a {
    text-decoration: none;
    font-weight: bold;
    color: #A72C3A
}

    a:hover {
        color: #741E28;
    }

    a.asbutton {
        display: block;
        width: 100%;
        border-radius: 10px;
        padding: 0.5em 1em;
        margin-top: 0.2em;
        box-shadow: 1px 3px 5px 0px rgba(0,0,0,0.2);
        text-align: center;
        background-color: #f0f0f0;
        background-image: linear-gradient(180deg, #f0f0f0,#aaa);
        background-repeat: no-repeat;
        color: black;
        cursor: pointer;
    }

        a.asbutton:hover {
            background-color: #ddd;
            background-image: linear-gradient(180deg, #ddd,#aaa);
        }

        a.asbutton.small {
            color: white;
            max-width: 60%;
            overflow: hidden;
            background-color: #c00;
            background-image: linear-gradient(180deg, #9a0606,#b50000);
            margin: 10px auto 0 auto;
        }

            a.asbutton.small:hover {
                background-color: #e60707;
                background-image: linear-gradient(180deg, #e60707 50%,#aa0606);
            }

    a.aktiv {
        font-weight: bold !important;
    }

h1, h2, h3, h4, h5, h6 {
    font-weight: bold;
    margin-bottom: 0.5em;
    color: #416575;
}

h1 {
    font-size: 1.2em;
}

p {
    margin-top: 0.5em;
    margin-bottom: 0.5em;
}

form {
    padding: 0.5em 0;
}

input[type="checkbox"], input[type="radio"] {
    display: none;
}

    input[type="checkbox"] + label, input[type="radio"] + label {
        display: block;
        background-color: #f0f0f0;
        vertical-align: middle;
        padding: 0.5em 0.5em 0.5em 2.3em;
        margin: 0.2em 0;
        border-radius: 0.5em;
        background-repeat: no-repeat;
        background-size: 1.6em;
        background-position: left 0.5em center;
    }

    input[type="checkbox"] + label {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 512 512' stroke-linejoin='round'%3E%3Cpath d='M365 67l-317 0c-24 0-43 19-43 43l0 317c0 24 19 43 43 43l317 0c24 0 43-19 43-43l0-317c0-24-19-43-43-43Zm0 360l-317 0 0-317 317 0 0 317Z' fill='%23999'/%3E%3C/svg%3E");
    }

    input[type="checkbox"][disabled] + label {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 512 512' stroke-linejoin='round'%3E%3Cpath d='M365 67l-317 0c-24 0-43 19-43 43l0 317c0 24 19 43 43 43l317 0c24 0 43-19 43-43l0-317c0-24-19-43-43-43Zm0 360l-317 0 0-317 317 0 0 317Z' fill='%23bbb'/%3E%3C/svg%3E") !important;
        background-color: #ddd;
    }

    input[type="checkbox"]:checked + label {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 512 512' stroke-linejoin='round'%3E%3Cpath d='M365 67c15 0 27 7 35 18l-35 35 0-10 -317 0 0 317 317 0 0-125 43-43 0 168c0 24-19 43-43 43l-317 0c-24 0-43-19-43-43l0-317c0-24 19-43 43-43l317 0Z' fill='%23999'/%3E%3Cpath d='M503 136l-267 265c-7 7-19 7-26 0l-141-142c-7-7-7-19 0-26l35-35c7-7 19-7 26 0l93 93 219-217c7-7 19-7 26 0l35 35c7 7 7 19 0 26Z' fill='%23a00'/%3E%3C/svg%3E");
    }

    input[type="radio"] + label {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 512 512' style='clip-rule:evenodd;fill-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;version:1'%3E%3Cpath d='M206.5 67c111.2 0 201.5 90.3 201.5 201.5 0 111.2-90.3 201.5-201.5 201.5 -111.2 0-201.5-90.3-201.5-201.5 0-111.2 90.3-201.5 201.5-201.5Zm0 39.6c89.4 0 161.9 72.5 161.9 161.9 0 89.4-72.5 161.9-161.9 161.9 -89.4 0-161.9-72.5-161.9-161.9 0-89.4 72.5-161.9 161.9-161.9Z' fill='%23999'/%3E%3C/svg%3E");
    }

    input[type="radio"]:checked + label {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 512 512' style='clip-rule:evenodd;fill-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;version:1'%3E%3Cpath d='M206.5 67c111.2 0 201.5 90.3 201.5 201.5 0 111.2-90.3 201.5-201.5 201.5 -111.2 0-201.5-90.3-201.5-201.5 0-111.2 90.3-201.5 201.5-201.5Zm0 39.6c89.4 0 161.9 72.5 161.9 161.9 0 89.4-72.5 161.9-161.9 161.9 -89.4 0-161.9-72.5-161.9-161.9 0-89.4 72.5-161.9 161.9-161.9Z' fill='%23999'/%3E%3Ccircle cx='206.5' cy='268.5' r='120.0' fill='%23a00'/%3E%3C/svg%3E");
    }

    input[type="radio"] + label.FreitextHead, input[type="checkbox"] + label.FreitextHead {
        margin-bottom: 0;
    }

        input[type="radio"] + label.FreitextHead + div, input[type="checkbox"] + label.FreitextHead + div {
            display: none;
            border-radius: 0 0 10px 10px;
            margin-bottom: 0.1em;
            margin-left: 0;
            padding: 0 10px 0.3em 2em;
        }

    input[type="radio"]:checked + label.FreitextHead, input[type="checkbox"]:checked + label.FreitextHead {
        border-bottom-left-radius: 0;
        border-bottom-right-radius: 0;
    }

        input[type="radio"]:checked + label.FreitextHead + div, input[type="checkbox"]:checked + label.FreitextHead + div {
            display: block;
        }


.header {
    margin-bottom: 0 !important;
}

    .header label {
        background-color: #ddd !important;
        border-bottom-right-radius: 0 !important;
        margin-bottom: 0 !important;
    }

input[type="text"], input[type="password"], textarea {
    display: inline-block;
    outline: none;
    font: inherit;
    border: none;
    margin: 0.2em;
    color: #4d4d4d;
    background-color: #ffffff;
    padding: 0.3em 0.4em 0.1em 0.4em;
    border-radius: 0.5em;
    box-shadow: inset 0.1em 0.1em 0.2em #b4c5d2;
}

textarea {
    resize: vertical;
}

select {
    -webkit-appearance: none;
    appearance: none;
    border: none;
    font: inherit;
    outline: none;
    cursor: pointer;
    padding: 0.2em 0.9em;
    border-radius: 0.5em;
    background-color: #fff;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M441.9 167.3l-19.8-19.8c-4.7-4.7-12.3-4.7-17 0L224 328.2 42.9 147.5c-4.7-4.7-12.3-4.7-17 0L6.1 167.3c-4.7 4.7-4.7 12.3 0 17l209.4 209.4c4.7 4.7 12.3 4.7 17 0l209.4-209.4c4.7-4.7 4.7-12.3 0-17z' fill='%23111'/%3E%3C/svg%3E"),linear-gradient(180deg, #f0f0f0,#aaa);
    background-position: right 0.4em center,top;
    background-repeat: no-repeat;
    background-size: 1em, contain;
    padding-right: 2em;
    box-shadow: 1px 3px 5px 0px rgba(0,0,0,0.2);
    margin: 0.2em;
}

label {
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.disabled {
    color: gray !important;
}


#TopFrame, #MainContentFrame {
    margin: 0 auto;
}

#TopFrame {
    margin-top: 40px;
    width: 794px;
}

    #TopFrame img {
        width: 100%;
        border-radius: 30px;
    }

svg.cpo {
    width: 794px;
}

    svg.cpo .c {
        fill: #d7e4ea
    }

    svg.cpo .h {
        fill: #a72c3a;
    }

    svg.cpo .l {
        fill: white
    }

#MainContentFrame {
    display: none;
    position: relative;
    min-height: 5em;
    width: 874px;
    border-radius: 30px;
    margin-top: 10px;
    box-shadow: 1px 5px 10px 0px rgba(0,0,0,0.2);
    background-repeat: no-repeat;
    margin-bottom: 20px;
    padding: 30px 40px 80px 200px;
    background-color: white;
    background-image: url('img/cpologo.png'), linear-gradient(90deg, #a00 180px, white 180px);
    background-position: center bottom 10px,top;
    background-position: calc(50% + 82px) calc(100% - 10px),top;
}

    #MainContentFrame.simple {
        background-image: url('img/cpologo.png');
        background-position: center bottom 10px;
        padding: 30px 40px 80px 40px;
    }

        #MainContentFrame.simple a.banner {
            display: block;
            padding: 0;
            margin: 10px 0;
        }

a.banner img {
    width: 100%;
    box-shadow: 0.1em 0.2em 0.6em rgba(0,0,0,0.3);
}


#LeftFrame {
    position: absolute;
    right: 50%;
    width: 150px;
    top: 260px;
    margin-right: 272px;
    z-index: 1;
    font-size: 0.9em;
    color: white;
}

    #LeftFrame .ShowLoginData {
        border-radius: 20px;
        padding: 7px 15px;
        background-color: rgba(0,0,0,0.1);
        margin: 7px 0;
        box-shadow: inset 0.2em 0.2em 0.4em rgba(0,0,0,0.2);
    }

    #LeftFrame .menupunkt + .menupunkt {
        margin-top: 10px;
    }

    #LeftFrame a {
        display: block;
        color: white;
        font-weight: normal;
        border-radius: 10px;
        padding: 0.5em 1em;
        box-shadow: 0.2em 0.2em 0.4em #920a0a, -0.2em -0.2em 0.4em #bf0404;
        background-color: #c00;
        background-image: linear-gradient(180deg, #a70505,#b50000);
    }

        #LeftFrame a:hover, #LeftFrame a.aktiv {
            background-color: #e60707;
            background-image: linear-gradient(180deg, #e60707 50%,#aa0606);
            z-index: 1 !important;
        }

        #LeftFrame a:hover {
            z-index: 2 !important;
        }

        #LeftFrame a.mastered, #LeftFrame a.en, #LeftFrame a.de {
            padding-right: 32px;
            background-repeat: no-repeat;
            background-position: right 5px center, center;
        }



        #LeftFrame a.mastered {
            background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-80 -80 608 672'%3E%3Cpath d='M414 92L133 372l-99-99c-4-5-12-5-16 0L6 284c-4 5-4 13 0 17l119 119c5 5 12 5 17 0l300-300c4-4 4-12 0-17l-12-11c-4-5-12-5-16 0z' fill='%23fff'/%3E%3C/svg%3E"), linear-gradient(180deg, #a70505,#b50000);
        }

            #LeftFrame a.mastered:hover, #LeftFrame a.mastered.aktiv {
                background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-80 -80 608 672'%3E%3Cpath d='M414 92L133 372l-99-99c-4-5-12-5-16 0L6 284c-4 5-4 13 0 17l119 119c5 5 12 5 17 0l300-300c4-4 4-12 0-17l-12-11c-4-5-12-5-16 0z' fill='%23fff'/%3E%3C/svg%3E"), linear-gradient(180deg, #e60707 50%,#aa0606);
            }

        #LeftFrame a.en {
            background-image: url(img/flag_uk.png), linear-gradient(180deg, #a70505,#b50000);
            border-radius: 0 0 10px 10px;
        }

            #LeftFrame a.en:hover, #LeftFrame a.en.aktiv {
                background-image: url(img/flag_uk.png), linear-gradient(180deg, #e60707 50%,#aa0606);
            }

        #LeftFrame a.de {
            background-image: url(img/flag_de.png), linear-gradient(180deg, #a70505,#b50000);
            border-radius: 10px 10px 0 0;
        }

            #LeftFrame a.de:hover, #LeftFrame a.de.aktiv {
                background-image: url(img/flag_de.png), linear-gradient(180deg, #e60707 50%,#aa0606);
            }

#MainContentFrame #navbtns {
    position: relative;
    height: 2em;
    width: 100%;
    margin-top: 2em;
}


    #MainContentFrame #navbtns a.asbutton {
        position: absolute;
        max-width: 45%;
        overflow: hidden;
        color: white;
        background-color: #c00;
        background-image: linear-gradient(180deg, #9a0606,#b50000);
    }

        #MainContentFrame #navbtns a.asbutton:hover {
            background-color: #e60707;
            background-image: linear-gradient(180deg, #e60707 50%,#aa0606);
        }

a#btBack.asbutton, a#btPrev.asbutton {
    left: 0;
    text-align: left;
}

a#btNext.asbutton {
    right: 0;
    text-align: right;
}

a.toggle {
    transition: all 0.1s;
}

    a.toggle + div {
        position: relative;
        max-height: 0;
        transition: max-height 0.25s linear;
        overflow-y: hidden;
        background-color: #eee;
        padding: 0 15px;
        border-radius: 0 0 10px 10px;
        margin-bottom: 20px;
    }

    a.toggle.show {
        border-bottom-left-radius: 0;
        border-bottom-right-radius: 0;
    }


form.table > div, p.table {
    display: table;
}

    form.table > div > p, p.table > span {
        display: table-row;
    }

        form.table > div > p > *, p.table > span > * {
            display: table-cell;
            padding: 0.2em 0.5em;
            white-space: nowrap;
        }

        form.table > div > p > :nth-child(2), form.table > div > p > :nth-child(2) *, p.table > span > :nth-child(2), p.table > span > :nth-child(2) * {
            width: 100%;
        }

#topmenu, label#menulbl2 {
    display: none;
}


.info {
    background-color: #ddd;
    border-radius: 10px;
    padding: 20px;
}

.lightinfo {
    background-color: #f0f0f0;
    border-radius: 10px;
    padding: 10px;
    margin-left: 2.3em;
}

    .lightinfo.big {
        margin-left: 0;
        padding: 20px 20px 15px 15px;
    }


    .lightinfo.body {
        margin-top: 0 !important;
        border-top-left-radius: 0;
        border-top-right-radius: 0;
    }

    .lightinfo.ft * {
        width: 100%;
    }


.space {
    margin-top: 1.5em !important;
}

.field-validation-error, .validation-summary-errors {
    display: block;
    padding: 0.5em 0.7em;
    border-radius: 0.3em;
    background-color: #a00;
    color: white;
    font-weight: bold;
}


.subtle .field-validation-error, .subtle .validation-summary-errors {
    display: inline;
    color: #a00;
    font-weight: bold;
    background-color: #f0f0f0;
    padding: 0;
}

.CurrentQuestionNo {
    position: absolute;
    top: 4px;
    right: 40px;
    text-align: right;
    font-size: 0.8em;
    font-weight: bold;
    color: #bbb;
}


div.waiting {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='xMidYMid'%3E%3Cstyle%3E.a%7Bfill:%235b7b88;%7D%3C/style%3E%3Ccircle cx='75' cy='50' r='4.5' class='a'%3E%3Canimate attributeName='r' values='3;3;5;3;3' times='0;0.1;0.2;0.3;1' dur='1s' repeatCount='indefinite' begin='-0.9166666666666666s'/%3E%3Canimate attributeName='fill' values='%235b7b88;%235b7b88;%23cc0000;%235b7b88;%235b7b88' repeatCount='indefinite' times='0;0.1;0.2;0.3;1' dur='1s' begin='-0.9166666666666666s'/%3E%3C/circle%3E%3Ccircle cx='71.7' cy='62.5' r='4.9' class='a'%3E%3Canimate attributeName='r' values='3;3;5;3;3' times='0;0.1;0.2;0.3;1' dur='1s' repeatCount='indefinite' begin='-0.8333333333333334s'/%3E%3Canimate attributeName='fill' values='%235b7b88;%235b7b88;%23cc0000;%235b7b88;%235b7b88' repeatCount='indefinite' times='0;0.1;0.2;0.3;1' dur='1s' begin='-0.8333333333333334s'/%3E%3C/circle%3E%3Ccircle cx='62.5' cy='71.7' r='4.2' class='a'%3E%3Canimate attributeName='r' values='3;3;5;3;3' times='0;0.1;0.2;0.3;1' dur='1s' repeatCount='indefinite' begin='-0.75s'/%3E%3Canimate attributeName='fill' values='%235b7b88;%235b7b88;%23cc0000;%235b7b88;%235b7b88' repeatCount='indefinite' times='0;0.1;0.2;0.3;1' dur='1s' begin='-0.75s'/%3E%3C/circle%3E%3Ccircle cx='50' cy='75' r='3.5' class='a'%3E%3Canimate attributeName='r' values='3;3;5;3;3' times='0;0.1;0.2;0.3;1' dur='1s' repeatCount='indefinite' begin='-0.6666666666666666s'/%3E%3Canimate attributeName='fill' values='%235b7b88;%235b7b88;%23cc0000;%235b7b88;%235b7b88' repeatCount='indefinite' times='0;0.1;0.2;0.3;1' dur='1s' begin='-0.6666666666666666s'/%3E%3C/circle%3E%3Ccircle cx='37.5' cy='71.7' r='3' class='a'%3E%3Canimate attributeName='r' values='3;3;5;3;3' times='0;0.1;0.2;0.3;1' dur='1s' repeatCount='indefinite' begin='-0.5833333333333334s'/%3E%3Canimate attributeName='fill' values='%235b7b88;%235b7b88;%23cc0000;%235b7b88;%235b7b88' repeatCount='indefinite' times='0;0.1;0.2;0.3;1' dur='1s' begin='-0.5833333333333334s'/%3E%3C/circle%3E%3Ccircle cx='28.3' cy='62.5' r='3' class='a'%3E%3Canimate attributeName='r' values='3;3;5;3;3' times='0;0.1;0.2;0.3;1' dur='1s' repeatCount='indefinite' begin='-0.5s'/%3E%3Canimate attributeName='fill' values='%235b7b88;%235b7b88;%23cc0000;%235b7b88;%235b7b88' repeatCount='indefinite' times='0;0.1;0.2;0.3;1' dur='1s' begin='-0.5s'/%3E%3C/circle%3E%3Ccircle cx='25' cy='50' r='3' class='a'%3E%3Canimate attributeName='r' values='3;3;5;3;3' times='0;0.1;0.2;0.3;1' dur='1s' repeatCount='indefinite' begin='-0.4166666666666667s'/%3E%3Canimate attributeName='fill' values='%235b7b88;%235b7b88;%23cc0000;%235b7b88;%235b7b88' repeatCount='indefinite' times='0;0.1;0.2;0.3;1' dur='1s' begin='-0.4166666666666667s'/%3E%3C/circle%3E%3Ccircle cx='28.3' cy='37.5' r='3' class='a'%3E%3Canimate attributeName='r' values='3;3;5;3;3' times='0;0.1;0.2;0.3;1' dur='1s' repeatCount='indefinite' begin='-0.3333333333333333s'/%3E%3Canimate attributeName='fill' values='%235b7b88;%235b7b88;%23cc0000;%235b7b88;%235b7b88' repeatCount='indefinite' times='0;0.1;0.2;0.3;1' dur='1s' begin='-0.3333333333333333s'/%3E%3C/circle%3E%3Ccircle cx='37.5' cy='28.3' r='3' class='a'%3E%3Canimate attributeName='r' values='3;3;5;3;3' times='0;0.1;0.2;0.3;1' dur='1s' repeatCount='indefinite' begin='-0.25s'/%3E%3Canimate attributeName='fill' values='%235b7b88;%235b7b88;%23cc0000;%235b7b88;%235b7b88' repeatCount='indefinite' times='0;0.1;0.2;0.3;1' dur='1s' begin='-0.25s'/%3E%3C/circle%3E%3Ccircle cx='50' cy='25' r='3' class='a'%3E%3Canimate attributeName='r' values='3;3;5;3;3' times='0;0.1;0.2;0.3;1' dur='1s' repeatCount='indefinite' begin='-0.16666666666666666s'/%3E%3Canimate attributeName='fill' values='%235b7b88;%235b7b88;%23cc0000;%235b7b88;%235b7b88' repeatCount='indefinite' times='0;0.1;0.2;0.3;1' dur='1s' begin='-0.16666666666666666s'/%3E%3C/circle%3E%3Ccircle cx='62.5' cy='28.3' r='3.1' class='a'%3E%3Canimate attributeName='r' values='3;3;5;3;3' times='0;0.1;0.2;0.3;1' dur='1s' repeatCount='indefinite' begin='-0.08333333333333333s'/%3E%3Canimate attributeName='fill' values='%235b7b88;%235b7b88;%23cc0000;%235b7b88;%235b7b88' repeatCount='indefinite' times='0;0.1;0.2;0.3;1' dur='1s' begin='-0.08333333333333333s'/%3E%3C/circle%3E%3Ccircle cx='71.7' cy='37.5' r='3.8' class='a'%3E%3Canimate attributeName='r' values='3;3;5;3;3' times='0;0.1;0.2;0.3;1' dur='1s' repeatCount='indefinite' begin='0s'/%3E%3Canimate attributeName='fill' values='%235b7b88;%235b7b88;%23cc0000;%235b7b88;%235b7b88' repeatCount='indefinite' times='0;0.1;0.2;0.3;1' dur='1s' begin='0s'/%3E%3C/circle%3E%3C/svg%3E") no-repeat center;
    background-size: contain;
    width: 300px;
    height: 300px;
    margin: 100px auto 0 auto;
}

    div.waiting + h2 {
        margin-top: 0;
        margin-bottom: 100px;
        text-align: center;
    }

@media only screen and (max-width: 874px) {
    #topmenu {
        display: block;
        position: fixed;
        top: 0;
        left: 0;
        height: 53px;
        width: 100%;
        background-color: #c00;
        box-shadow: 0px 0px 10px rgba(0,0,0,0.2);
    }

        #topmenu p {
            position: absolute;
            margin: 0;
            bottom: 5px;
            right: 5px;
            text-align: right;
            color: rgba(255,255,255,0.7);
            font-weight: bold;
            font-size: 0.7em;
        }

            #topmenu p.CurrentQuestionNo {
                color: white;
                font-size: 0.9em;
                right: 4px;
            }

            #topmenu p.menupunkt {
                top: 9px;
                right: 9px;
                font-size: 0.9em;
            }

        #topmenu a {
            display: inline-block;
            color: white;
            font-weight: normal;
            padding: 8px 32px 9px 10px;
            box-shadow: 0.2em 0.2em 0.4em #af0202, -0.2em -0.2em 0.4em rgba(255, 149, 149, 0.53);
            background-color: #c00;
            background-repeat: no-repeat;
            background-position: right 5px center, center;
            background-image: url(img/flag_uk.png), linear-gradient(180deg, #cc0303,#d80e0e);
            border-radius: 0 10px 10px 0;
        }

            #topmenu a:hover, #topmenu a.aktiv {
                background-color: #e60707;
                z-index: 1 !important;
            }

            #topmenu a:hover {
                z-index: 2 !important;
            }


            #topmenu a.en:hover, #topmenu a.en.aktiv {
                background-image: url(img/flag_uk.png), linear-gradient(180deg, #f60707 50%,#aa0606);
            }

            #topmenu a.de {
                background-image: url(img/flag_de.png), linear-gradient(180deg, #cc0303,#d80e0e);
                border-radius: 10px 0 0 10px;
            }

                #topmenu a.de:hover, #topmenu a.de.aktiv {
                    background-image: url(img/flag_de.png), linear-gradient(180deg, #f60707 50%,#aa0606);
                }



    label#menulbl {
        position: absolute;
        background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M16 132h416c8.8 0 16-7.2 16-16V76c0-8.8-7.2-16-16-16H16C7.2 60 0 67.2 0 76v40c0 8.8 7.2 16 16 16zm0 160h416c8.8 0 16-7.2 16-16v-40c0-8.8-7.2-16-16-16H16c-8.8 0-16 7.2-16 16v40c0 8.8 7.2 16 16 16zm0 160h416c8.8 0 16-7.2 16-16v-40c0-8.8-7.2-16-16-16H16c-8.8 0-16 7.2-16 16v40c0 8.8 7.2 16 16 16z' fill='%23fff'/%3E%3C/svg%3E") no-repeat center;
        background-size: 38px;
        height: 53px;
        width: 53px;
    }

        label#menulbl:hover {
            background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M16 132h416c8.8 0 16-7.2 16-16V76c0-8.8-7.2-16-16-16H16C7.2 60 0 67.2 0 76v40c0 8.8 7.2 16 16 16zm0 160h416c8.8 0 16-7.2 16-16v-40c0-8.8-7.2-16-16-16H16c-8.8 0-16 7.2-16 16v40c0 8.8 7.2 16 16 16zm0 160h416c8.8 0 16-7.2 16-16v-40c0-8.8-7.2-16-16-16H16c-8.8 0-16 7.2-16 16v40c0 8.8 7.2 16 16 16z' fill='%23fee'/%3E%3C/svg%3E");
        }

    label#menulbl2 {
        display: none;
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: rgba(0,0,0,0.5);
        opacity: 0;
        transition: opacity 0.2s linear;
    }

    body {
        background-color: white;
    }

    #TopFrame {
        margin: 53px 0 0 0;
        width: 100%;
    }

        #TopFrame img {
            border-radius: 0;
        }

    #LeftFrame {
        position: fixed;
        background-color: #a00;
        min-width: 180px;
        height: 100%;
        top: 0;
        left: 0;
        margin: 0;
        padding: 30px 20px;
        transform: translateX(-100%);
        transition: transform 0.2s ease;
    }

    #menucb:checked ~ #LeftFrame {
        transform: translateX(0%);
    }

    #menucb:checked ~ label#menulbl2 {
        display: block;
        opacity: 1;
    }

    #MainContentFrame {
        display: block;
        margin-top: 0;
        width: 100%;
        border-radius: 0;
        padding: 15px 15px 80px 15px;
        background-image: url('img/cpologo.png');
        background-position: center bottom 10px;
        box-shadow: none;
    }

        #MainContentFrame.simple {
            padding: 30px 10px 80px 10px;
        }

        #MainContentFrame .CurrentQuestionNo {
            display: none;
        }

    svg.cpo {
        width: 100%;
    }

        svg.cpo .c {
            fill: #29424e;
        }

        svg.cpo .l {
            fill: black;
        }

    form.table > div {
        display: block;
    }

        form.table > div > p {
            display: block;
        }

            form.table > div > p > * {
                display: block;
            }

            form.table > div > p input {
                width: 100%;
            }


    div.waiting {
        width: 60vmin;
        height: 60vmin;
        margin: 20vmin auto 0 auto;
    }
    div.waiting + h2 {
        margin-bottom: 20vmin;
    }
}

select::-ms-expand {
    display: none;
}

select:focus::-ms-value {
    background-color: transparent;
    color: black;
}