.Header {
    position: relative;
    background-color: var(--header-backcolor);
    min-height: 60px;
    color: var(--header-forecolor);
    background-image: var(--header-backimage);
}

    .Header .HeaderTop{
        padding:20px;
        font-size:20px;
        display:block;
    }

    .Header .Title {
        position:absolute;
        font-size: 20px;
        top:10px;
        left:15px;
    }

    .Header .Menu {
        position: absolute;
        top: 1px;
        right: 0px;
        background-color:#cccccc;
        color:#333333;
    }

    .Header .RefreshButton {
        color: white;
        margin-right:20px;
    }

    .Header .DevButton {
        color: white;
        margin-right: 20px;
    }


    .Header .TestField {
        position: absolute;
        top: 40px;
        right: 10px;
        color: white;
    }
    
    .Header .TestField a{
        color: yellow;
    }

    .Header .DateTime {
        position: absolute;
        top: 94px;
        right: 30px;
        color: var(--accent-forecolor);
    }

    .Header .WebSocketConn {
        position: absolute;
        top: 94px;
        right: 10px;
        color: white;
    }


.HeaderNav {
    background-color: var(--header-backcolor);
    color: var(--header-forecolor);
}

    .HeaderNav a {
        display:inline-block;
        color: white;
        padding: 4px 10px;
        text-decoration: none;
        font-size:14px;
    }
        .HeaderNav a:hover, .HeaderNav .On {
            background-color: var(--accent-backcolor);
            color: var(--accent-forecolor);
        }

    .HeaderNav span {
        float: right;
        padding: 4px 10px;
        font-size:14px;
    }

.HeaderSubNav {
    background-color: var(--accent-backcolor);
    color: var(--accent-forecolor);
    min-height: 27px;
}

    .HeaderSubNav a {
        display: inline-block;
        color: var(--accent-forecolor);
        padding: 4px 10px;
        margin: 1px;
        text-decoration: none;
        font-size: 14px;
    }
        .HeaderSubNav a:hover, .HeaderSubNav .On {
            background-color: var(--header-subnav-on-backcolor);
            color: var(--header-subnav-on-forecolor);
        }

    .HeaderSubNav span {
        float: right;
        padding: 4px 10px;
        font-size:14px;
    }