html, body, form {
    margin: 0px;
    padding: 0px;
    background-color: #fff;
    width: 100%;
    position: relative;
    min-height: 100%;
    font-family: 'Trebuchet MS';
}

html, body {
    /* To keep footer down */
    height: 100%;
}

    body > form {
        /* To keep the header below all content */
        /*padding-bottom: 40px;*/
    }

        /* Header / Section / Footer */
        body > form > * {
            width: 100%;
        }

        body > form > section {
            padding: 15px 0px;
        }

        /* Inside header/section/footer, a DIV should be boxed */
        body > form > * > div {
            width: 1000px;
            margin: 0px auto;
            position: relative;
            height: 100%;
        }

header {
    background-color: #444444;
    background-color: rgba(0,0,0,0.6);
    height: 120px;
    margin: 0px 0px 3px 0px;
}

    header > div, header > div > * {
        position: relative;
    }

        header > div::before {
            position: absolute;
            top: 0px;
            left: 0px;
            content: ' ';
            width: 100%;
            height: 100%;
            zoom: 1;
            filter: alpha(opacity=50);
            opacity: 0.5;
        }

    header h1 {
        background-color: transparent;
        font-family: 'VDS krabbels';
        font-size: 4em;
        color: #fff;
        text-align: center;
        padding: 15px;
        margin: 0px;
    }

    header .soc {
        position: absolute;
        top: 5px;
        left: 5px;
    }

        header .soc > img {
            width: 50px;
            display: block;
            margin: 10px;
        }

    header .nav {
        margin: 0px auto;
        text-align: center;
        display: table;
        font-family: 'Trebuchet MS', Arial, 'DejaVu Sans', 'Liberation Sans', Freesans, sans-serif;
        font-size: 1.2em;
    }

        header .nav > a {
            width: 100px;
            padding: 10px 20px;
            display: table-cell;
            color: #ffffff;
        }

            header .nav > a > img {
                width: 80px;
            }

            header .nav > a > label {
                width: 100px;
                display: block;
                text-align: center;
            }

    header .logo {
        position: absolute;
        right: -10px;
        bottom: -40px;
    }

/**** Universal / Common / Global ****/

h1 {
    background-color: #eee;
    padding: 10px;
    color: #666;
}

h2 {
}

h3 {
    color: #333399;
}

.marked {
    color: ActiveCaption;
    font-weight: bold;
}

.on {
    color: #098229;
}

.off {
    color: #cc2c00;
}

footer {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border-top: solid 1px #999999;
    color: #666;
    width: 100%;
    position: absolute;
    bottom: 0;
    height: 30px;
}

    footer > div {
        text-align: center;
    }


#bedoeldejedit {
    border: solid 1px #eee;
    border-radius: 5px;
    padding: 10px;
    margin-bottom: 25px;
}

    #bedoeldejedit a {
        display: block;
        margin: 10px 20px;
    }

.alert {
    padding: 15px;
    margin-bottom: 20px;
    border: 1px solid transparent;
    border-radius: 4px;
    font-size: 1.2em;
}

    .alert.alert-danger {
        color: #a94442;
        background-color: #f2dede;
        border-color: #ebccd1;
    }