@font-face{
    font-family:Open Sans;
    font-style:normal;
    font-weight:400;
    src:local('Open Sans'), local('OpenSans'), url(../fonts/OpenSans.woff) format('woff')
}


* {
    font-family: 'Open Sans', sans-serif;
}

nav.top-bar {
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 76px;
    max-height: 76px;
    z-index: 100;

    -webkit-box-shadow: 0px 12px 18px -9px rgba(0,0,0,0.05);
    box-shadow: 0px 12px 18px -9px rgba(0,0,0,0.05);

    background-color: #fff;
}
div.align-children-middle {
    height: 100%;
    display: flex;
    align-items: center;
}
nav.top-bar img.logo {
    max-height: 30px;
}
nav.top-bar div.nav-elem {
    display: inline-block;
    padding-left: 16px;
    padding-right: 16px;
    height: 100%;
}
nav.top-bar div.nav-elem:hover {
    cursor: pointer;
    background-color: rgba(0,0,0,0.1);
}
nav.top-bar div.nav-elem:active {
    cursor: pointer;
    background-color: rgba(0,0,0,0.2);
}
nav.top-bar div.nav-elem a {
    color: initial;
    text-decoration: none;
}
nav.top-bar div.right {
    float: right;
}

.background-panel, #login-panel {
    position: absolute;
    left: 0px;
    top: 70px;
    right: 0px;
    bottom: 0px;
    padding: 0px;
    margin: 0px;
    border: none;
}

.background-panel-manoir, #login-panel {
    background-image: url("../resources/images/scanning-bg-manoir.webp");
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.message-window, #login-window {
    box-sizing: border-box;

    position: absolute;
    width: 300px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);

    padding: 12px;

    background: #fff;
    box-shadow: 0 6px 12px rgb(0 0 0 / 18%);
    border: 1px solid rgba(0, 0, 0, 0.15);
    border-radius: 4px;
}

.message-window input[type=text], .message-window input[type=password],
 #login-window  input[type=text],  #login-window  input[type=password] {
    box-sizing: border-box;
    padding: 4px;
    font-size: 1.2em;
    width: 100%;
    border: 1px solid rgba(0,0,0,0.2);
    border-radius: 4px;
    margin-bottom: 8px;
}

.message-window input[type=submit],
.message-window button,
 #login-window  input[type=submit] {
    box-sizing: border-box;
    padding: 4px;
    font-size: 1.2em;
    width: 100%;
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 4px;
    margin-bottom: 8px;

    background: rgba(0, 0, 0, 0.1);
    cursor: pointer;
}
.message-window input[type=submit]:hover,
.message-window button:hover,
 #login-window input[type=submit]:hover {
    background: rgba(0, 0, 0, 0.25);
}
.message-window input[type=submit]:active,
.message-window button:active,
 #login-window input[type=submit]:active {
    background: rgba(0, 0, 0, 0.35);
}


.message-window button.secondary,
 #login-window  button.secondary {
    box-sizing: border-box;
    padding: 2px;
    font-size: 0.8em;
    width: 60%;
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 4px;
    margin-bottom: 8px;

    background: rgba(0, 0, 0, 0.1);
    cursor: pointer;
}

.message-window .title,
 #login-window .title {
    font-weight: bold;
}

.message-window h2,
 #login-window h2 {
    padding: 0px;
    margin-top: 6px;
    margin-bottom: 6px;
    text-align: center;
}
.message-window .finotext,
 #login-window .infotext {
    font-size: 0.9em;
    margin: 4px;
    margin-top: 6px;
    margin-bottom: 8px;
}

div.floating-logo {
    position: absolute;
    top: calc(50% + 200px);
    left: 0px;
    width: 100%;
    margin: 0px;
    padding: 0px;
    text-align: center;
}
div.floating-logo img {
    max-width: 150px;
    max-height: 50px;
}