html, body {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    position: relative;
    cursor: default;
}

html, body, header, h1, noscript, main, footer, p, nav {
    display: block;
}

body {
    font-family: Verdana,Calibri,Arial;
    font-size:100%;
    color: #000000;
    background-color: #ffffff;
    text-align: left;
    min-height: 100%;
    height: auto;
}

header {
    background-color: #565656;
    color: #ffffff;
    text-align: center;
}

noscript {
    background-color: #ffaeae;
    display: block;
    padding: 0.5em;
}

nav {
    background-color: #e6e6e6;
    color: #000000;
    text-align: center;
}

main {
    padding: 0.5em;
    padding-top: 1em;
    padding-bottom: 2.5em;
}

h1 {
    margin: 0;
    padding: 0.5em;
    font-size: 2em;
}

footer {
    position: absolute;
    bottom: 0;
    width: 100%;
    text-align: center;
    height: 3em;
}

p {
    max-width: 60em;
    margin: 0;
    padding: 0.5em;
    margin-right: auto;
    margin-left: auto;
    overflow-wrap:break-word;
}

input[type="submit"], button {
    padding:0.2em;
}

#navContent {
    display:inline-block;
    max-width:60em;
    text-align:right;
    width:100%;
}

    #navContent div {
        display: inline-block;
        cursor: pointer;
        padding: 0.5em;
    }

    #navContent div:hover {
        background-color: #ffffff;
    }

#loginDialog {
    position:fixed;
    left:0px;
    top:0px;
    width:100%;
    height:100%;
    text-align:center;
    display:none;
}

#loginDialogCenter {
    position: relative;
    display: inline-block;
    width: 100%;
    height: 100%;
    max-width: 60em;
    background-color: #ffffff;
}

#loginDialogX {
    text-align:right;
}

#loginDialogXContent {
    padding:0.5em;
    font-size:1.5em;
    cursor:pointer;
    display:inline-block;
}

#loginDialogContent {
    text-align:left;
    display:inline-block;
}

    #loginDialogContent input[type="submit"] {
        width:100%;
    }

#loginDialogFail {
    color:#ff0000;
    display:none;
}