body {
    background: #00519e;
    background-image: url(/Images/RealGarant/background.jpg); 
    background-size: cover;
}

html, body {
    background-color: #00519e;
}

.header-top {
    background-color: #00519e;
}

.header-bottom {
    background-color: #707173;
}

/* form */
    .mat-form-field {
    width: 100%;
}

.login-page .container .card mat-card .login-page-content-card-box {
    flex-direction: column;
    justify-content: space-between;
}

mat-form-field.mat-form-field-appearance-outline .mat-input-element {
    font-size: 14px;
}

.forgotten-password-title {
    color: white;
    font-size: 14px;
    margin: 0 0 10px;
}

.forgotten-password-instructions {
    color: white;
    font-size: 13px;
}

/* footer */
.login-page .login-page-footer .flex-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.login-page .container .card mat-card .login-image {
    margin: 0 0 1px 0;
    justify-content: flex-end;
}

.login-page .login-page-footer .flex-container button {
    padding: 0 0 2.5em 1em;
    width: 88px;
    background-color: #707173;
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 4px;
    background-image: url(/Images/default_new/help.png);
    background-position: 7px center;
    background-size: 16px;
    background-repeat: no-repeat;
}

    .login-page .login-page-footer .flex-container button:hover,
    .login-page .login-page-footer .flex-container button:active,
    .login-page .login-page-footer .flex-container button:focus {
        background-color: rgba(255, 255, 255, 0.21);
        border: 1px solid rgba(255, 255, 255, 0.29);
        color: #ffffff !important;
    }

.version {
    color: #eceded !important;
}

/* support info */
.support-info-dialog .ui-dialog-titlebar {
    display: none;
}

.support-info-dialog .ui-dialog-content {
    padding: 5px 20px 5px 60px;
    font-family: 'Open Sans', sans-serif;
}

.support-info-dialog {
    background-image: url(/Images/default_new/help-blue.png);
    background-position: 15px 15px;
    background-size: 36px;
    background-repeat: no-repeat;
}

.support-info {
    font-size: 14px;
}

.support-info h2 {
    font-size: 17px;
}

.support-info a {
    float: right;
    cursor: pointer;
}

/* menu */
.sf-menu li {
    background: #707173
}

.sf-menu li:hover, .sf-menu li.sfHover,
.sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active {
    background: #00519e;
    outline: 0;
}

.sf-menu li.current {
    background: #00519e;
}

.sf-menu li a {
    color: #fff;
}

/* user info */
.userInfo a {
    color: #fff;
}

.userInfo a:hover {
    color: #fff;
}

button.mat-suggested {
    -moz-user-select: none;
    -ms-user-select: none;
    overflow: visible;
    width: 100%;
    background: none;
    background-color: #00519e !important;
}

    button.mat-suggested:hover,
    button.mat-suggested:focus,
    button.mat-suggested:active {
        border: 1px solid #00519e;
        background: none;
        background-color: #00519e !important;
        font-weight: 600;
        color: #FFFFFF;
    }

#dlg-show-support-info.ui-dialog-content {
    overflow: hidden;
}