.page-header-system-info {
    background-image: linear-gradient(var(--sherpa-main-top-section-background-color1), var(--sherpa-main-top-section-background-color2), var(--sherpa-main-top-section-background-color3));
    border-bottom: 1px solid var(--sherpa-main-top-section-border);
    padding-top:5px;
    padding-bottom:5px;
    height:var(--sherpa-system-info-height);
}

.page-header-system-info .positioner {
    float:var(--sherpa-system-info-justify);
}

.page-header-system-info .positioner div {
    display:inline-block;
    border-radius: 4px;
    border:1px solid var(--sherpa-light-grey);
    padding-left:7px;
    padding-right:7px;
    padding-top:2px;
    padding-bottom:2px;
    margin-left:3px;
    margin-right:3px;
    /*font-size:var(--sherpa-system-info-font-size);*/                                                          /* Now supporting individual font sizes: see message/client-name/environment-name below. */
}

.page-header-system-info .message {
    background-image: var(--sherpa-system-info-message-background-color);
    color:var(--sherpa-system-info-message-text-color);
    font-size:var(--sherpa-system-info-message-text-font-size);
}

.page-header-system-info .client-name {
    background-image: var(--sherpa-system-info-client-name-background-color);
    color:var(--sherpa-system-info-client-name-text-color);
    font-size:var(--sherpa-system-info-client-name-text-font-size);
}

.page-header-system-info .environment-name {
    background-image: var(--sherpa-system-info-environment-name-background-color);
    color:var(--sherpa-system-info-environment-name-text-color);
    font-size:var(--sherpa-system-info-environment-name-text-font-size);
}

/* Placing this selector hear for now as there is no title.css*/
.page-body-title {
    height: 30px;
    padding-top:17px;
    padding-left: 18px;
}