/* Minification failed. Returning unminified contents.
(3209,10): run-time error CSS1035: Expected colon, found ';'
(3210,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '20px'
 */
html {
    margin: 0;
    padding: 0;
    background-color: white;
}

body {
    background-color: #fff;
    color: #333;
    font-size: .85em;
    font-family: "Segoe UI", Verdana, Helvetica, Sans-Serif;
    line-height: 1.6;
    margin: 0;
    padding: 0;
    overflow-y: scroll;
    position: relative;/* jQuery UI pop-ups need this */
}

body.adminInterface {
    background-color: white;
}

iframe {
    border: none;
}

/* global margins */

p, table, ul {
    margin-top: 0.5em;
    margin-bottom: 0.5em;
}

p.rightAligned {
    text-align: right;
}

a {
    color: #333;
    outline: none;
    /* padding-left: 3px;
    padding-right: 3px; */
    text-decoration: underline;
}

a.spaced-link {
    padding: 0.7em 1em;
}

a:link, a:visited,
a:active, a:hover {
    color: #333;
}
 
a:hover {
    background-color: #c7d1d6;
}

ul {
    margin: 0 0 0.5em 0; /* was 1em bottom */
}

.underline {
    text-decoration: underline;
}

header, footer, hgroup,
nav, section {
    display: block;
}

mark {
    background-color: #a6dbed;
    padding-left: 5px;
    padding-right: 5px;
}

.float-left {
    float: left;
}

.float-right {
    float: right;
    max-width: 50%;
}

div.float-right {
    display: inline-block;
}

.float-right ul, .float-right p, .float-right div {
    margin-right: 0.5em;
}

.float-right ul  {
    list-style: outside;
    padding-left: 1.4em;
}

.clear-fix:after {
    content: ".";
    clear: both;
    display: block;
    height: 0;
    visibility: hidden;
}

h1, h2, h3,
h4, h5, h6 {
    color: #000;
    margin-bottom: 0;
    padding-bottom: 0;
}

h1 {
    font-size: 2em;
}

h2 {
    font-size: 1.75em;
}

h3 {
    font-size: 1.2em;
    padding: 0.5em 0;
}

h4 {
    font-size: 1.1em;
}

h5, h6 {
    font-size: 1em;
}

h5 a:link, h5 a:visited, h5 a:active {
    padding: 0;
    text-decoration: none;
}

.widgetTitle {
    color: white;
    margin: 0;
    padding: 0.2em 0.5em;
    background-color: #CCC;
    font-size: 85%;
}


/* main layout
----------------------------------------------------------*/
.content-wrapper {
    margin: 0 auto;
    max-width: 90em;
    /* padding:  0 10px; */
}

.adminInterface #body {
    background-color: #efeeef;
    clear: both;
    padding-bottom: 3em;
}

.main-content {
    /* background: url("../Images/accent.png") no-repeat; */
    padding-left: 10px;
    padding-top: 10px;
    padding-right: 10px;
    visibility: hidden;
}

.featured + .main-content {
    background: url("../Images/heroAccent.png") no-repeat;
}

header .content-wrapper, footer .content-wrapper {
    padding: 10px;
    position: relative;
}

footer {
    clear: both;
    /*background-color: #e2e2e2;*/
    min-height: 100px;
}

footer .content-wrapper p, footer .content-wrapper div {
    /* font-size: .8em; */
}


/* site title
----------------------------------------------------------*/
.site-title {
    color: #c8c8c8;
    font-family: Rockwell, Consolas, "Courier New", Courier, monospace;
    font-size: 220%;
    margin: 0;
}

.site-title a, .site-title a:hover, .site-title a:active {
    background: none;
    color: #c8c8c8;
    outline: none;
    text-decoration: none;
}

.site-title .text {
    position: relative;
    left: 0.2em;
}

header .site-title img, header .site-title object {
    width: 8.2em;
    margin-top: 0.3em;
}

/* see http://stackoverflow.com/questions/11374059/make-an-html-svg-object-also-a-clickable-link */
a object {
    pointer-events: none;
}

a img {
    border: none;
}

#login {
    position: absolute;
    top: 0;
    right: 15px;
}

/*
#login a {
    background-color: #d3dce0;
    margin-left: 10px;
    margin-right: 3px;
    padding: 2px 3px;
    text-decoration: none;
}

#login a.username {
    background: none;
    margin: 0;
    padding: 0;
    text-decoration: underline;
}

#login ul {
    margin: 0;
}

#login li {
    display: inline;
    list-style: none;
}
    */


/* menu
----------------------------------------------------------*/
ul#menu {
    font-size: 1.3em;
    font-weight: 600;
    margin: 0 0 5px;
    padding: 0;
    text-align: right;
}

ul#menu li {
    display: inline;
    list-style: none;
    padding-left: 15px;
}

ul#menu li a {
    background: none;
    color: #999;
    text-decoration: none;
}

ul#menu li a:hover {
    color: #333;
    text-decoration: none;
}

/* navigation */
.navigation {
    border-bottom: 1px solid lightgrey;
}

.navigation a {
    color: grey;
    text-decoration: none;
}

.navigation a.indexPage:before {
    content: '\e968';
    font-family: AdminIconsFont;
}

.nav-section {
    display: table-cell;
    padding: 0.2em 1em 0.3em 0;
/*     min-width: 15em;
    text-align: center; */
}

.nav-section + .nav-section {
    padding-left: 1em;
    border-left: 1px solid lightgrey;
}

.navigation .icon {
    padding-left: 0.3em;
    padding-right: 0.3em;
    fill: grey;
}

.navigation .icon.disabled {
    fill: lightgrey;
}

.navigation a.indexPage:hover {
    color: black;
    text-decoration: underline;
}

.navigation a:hover svg {
    fill: black
}


/* page elements
----------------------------------------------------------*/
/* featured */
.featured {
    background-color: #fff;
}

.featured .content-wrapper {
    background-color: #7ac0da;
    background-image: -ms-linear-gradient(left, #7ac0da 0%, #a4d4e6 100%);
    background-image: -o-linear-gradient(left, #7ac0da 0%, #a4d4e6 100%);
    background-image: -webkit-gradient(linear, left top, right top, color-stop(0, #7ac0da), color-stop(1, #a4d4e6));
    background-image: -webkit-linear-gradient(left, #7ac0da 0%, #a4d4e6 100%);
    background-image: linear-gradient(left, #7ac0da 0%, #a4d4e6 100%);
    color: #3e5667;
    padding: 20px 40px 30px 40px;
}

.featured hgroup.title h1, .featured hgroup.title h2 {
    color: #fff;
}

.featured p {
    font-size: 1.1em;
}

/* page titles */
hgroup.title {
    margin-bottom: 10px;
}

hgroup.title h1, hgroup.title h2 {
    display: inline;
}

hgroup.title h2 {
    font-weight: normal;
    margin-left: 3px;
}

/* features */
section.feature {
    width: 300px;
    float: left;
    padding: 10px;
}

/* ordered list */
ol.round {
    list-style-type: none;
    padding-left: 0;
}

ol.round li {
    margin: 25px 0;
    padding-left: 45px;
}

ol.round li.zero {
    background: url("../Images/orderedList0.png") no-repeat;
}

ol.round li.one {
    background: url("../Images/orderedList1.png") no-repeat;
}

ol.round li.two {
    background: url("../Images/orderedList2.png") no-repeat;
}

ol.round li.three {
    background: url("../Images/orderedList3.png") no-repeat;
}

ol.round li.four {
    background: url("../Images/orderedList4.png") no-repeat;
}

ol.round li.five {
    background: url("../Images/orderedList5.png") no-repeat;
}

ol.round li.six {
    background: url("../Images/orderedList6.png") no-repeat;
}

ol.round li.seven {
    background: url("../Images/orderedList7.png") no-repeat;
}

ol.round li.eight {
    background: url("../Images/orderedList8.png") no-repeat;
}

ol.round li.nine {
    background: url("../Images/orderedList9.png") no-repeat;
}

/* content */
article {
    float: left;
    width: 70%;
}

aside {
    float: right;
    width: 25%;
}

aside ul {
    list-style: none;
    padding: 0;
}

aside ul li {
    background: url("../Images/bullet.png") no-repeat 0 50%;
    padding: 2px 0 2px 20px;
}

.label {
    font-weight: 700;
}

/* login page */
#loginForm {
    border-right: solid 2px #c8c8c8;
    float: left;
    width: 55%;
}

#loginForm .validation-error {
    display: block;
    margin-left: 15px;
}

#loginForm .validation-summary-errors ul {
    margin: 0;
    padding: 0;
}

#loginForm .validation-summary-errors li {
    display: inline;
    list-style: none;
    margin: 0;
}

#loginForm input {
    width: 250px;
}

#loginForm input[type="checkbox"],
#loginForm input[type="submit"],
#loginForm input[type="button"],
#loginForm button {
    width: auto;
}

#socialLoginForm {
    margin-left: 40px;
    float: left;
    width: 40%;
}

#socialLoginForm h2 {
    margin-bottom: 5px;
}

#socialLoginList button {
    margin-bottom: 12px;
}

#logoutForm {
    display: inline;
}

/* contact */
.contact h3 {
    font-size: 1.2em;
}

.contact p {
    margin: 5px 0 0 10px;
}

.contact iframe {
    border: 1px solid #333;
    margin: 5px 0 0 10px;
}

/* forms */
fieldset {
    border: none;
    margin: 0;
    padding: 0;
    display: inline-block;
}

fieldset legend {
    display: none;
}

fieldset ol {
    padding: 0;
    list-style: none;
}

fieldset ol li {
    padding-bottom: 5px;
}

label {
    /*    display: block;
    font-size: 1.2em;
    font-weight: 600;
    */
}

label.checkbox {
    display: inline;
}

input, textarea {
    /*
    border: 1px solid #e2e2e2;
    background: #fff;
    color: #333;
    font-size: 1.2em;
    margin: 5px 0 6px 0;
    padding: 5px;
    width: 300px;
    */
}



input[type="checkbox"] {
    background: transparent;
    border: inherit;
    width: auto;
}

/* info and errors */
.message-info {
    border: 1px solid;
    clear: both;
    padding: 10px 20px;
}

.message-error {
    clear: both;
    color: #e80c4d;
    font-size: 1.1em;
    font-weight: bold;
    margin: 20px 0 10px 0;
}

.message-success {
    color: #7ac0da;
    font-size: 1.3em;
    font-weight: bold;
    margin: 20px 0 10px 0;
}

.error {
    color: #e80c4d;
}

/* styles for validation helpers */
.field-validation-error {
    color: white;
    /*font-weight: bold;*/
    white-space: normal;
}

.field-validation-valid {
    display: none;
}

input.input-validation-error, input.input-validation-error + input.ui-autocomplete-input {
    border: 1px solid #e80c4d !important;
}

input[type="checkbox"].input-validation-error {
    border: 0 none;
}

.validation-summary-errors {
    color: #e80c4d;
    font-weight: bold;
    font-size: 1.1em;
}

.validation-summary-valid {
    display: none;
}




/********************
*   Mobile Styles   *
********************/
@media only screen and (max-width: 850px) {

    /* header
    ----------------------------------------------------------*/
    header .float-left,
    header .float-right {
        float: none;
    }

    /* logo */
    header .site-title {
        margin: 8px;
        text-align: center;
    }

    /* login */
    #login {
        font-size: 1em;
        margin: 0 0 12px;
        text-align: center;
    }

    #login ul {
        margin: 5px 0;
        padding: 0;
    }

    #login li {
        display: inline;
        list-style: none;
        margin: 0;
        padding: 0;
    }

    #login a {
        background: none;
        color: #999;
        font-weight: 600;
        margin: 2px;
        padding: 0;
    }

    #login a:hover {
        color: #333;
    }

    /* menu */
    nav {
        margin-bottom: 5px;
    }

    ul#menu {
        margin: 0;
        padding: 0;
        text-align: center;
    }

    ul#menu li {
        margin: 0;
        padding: 0;
    }


    /* main layout
    ----------------------------------------------------------*/
    .main-content,
    .featured + .main-content {
        background-position: 10px 0;
    }

    .content-wrapper {
        padding-right: 10px;
        padding-left: 10px;
        position: relative;
    }

    .featured .content-wrapper {
        padding: 10px;
    }

    /* page content */
    article, aside {
        float: none;
        width: 100%;
    }

    /* ordered list */
    ol.round {
        list-style-type: none;
        padding-left: 0;
    }

    ol.round li {
        padding-left: 10px;
        margin: 25px 0;
    }

    ol.round li.zero,
    ol.round li.one,
    ol.round li.two,
    ol.round li.three,
    ol.round li.four,
    ol.round li.five,
    ol.round li.six,
    ol.round li.seven,
    ol.round li.eight,
    ol.round li.nine {
        background: none;
    }

    /* features */
    section.feature {
        float: none;
        padding: 10px;
        width: auto;
    }

    section.feature img {
        color: #999;
        content: attr(alt);
        font-size: 1.5em;
        font-weight: 600;
    }

    /* forms */
    input {
        width: 90%;
    }

    /* login page */
    #loginForm {
        border-right: none;
        float: none;
        width: auto;
    }

    #loginForm .validation-error {
        display: block;
        margin-left: 15px;
    }

    #socialLoginForm {
        margin-left: 0;
        float: none;
        width: auto;
    }



    /* footer
    ----------------------------------------------------------*/
    footer .float-left,
    footer .float-right {
        float: none;
    }

    footer {
        text-align: center;
        height: auto;
        padding: 10px 0;
    }

    footer p {
        margin: 0;
    }
}

/* custom styling RDW */
.counter {
    color: grey;
    padding: 0 1em;
}

.status {
    color: grey;
}



h2 + fieldset {
    margin-top: 1em;
}

.noWrap {
    white-space: nowrap;
}

.minimap {
    border: 1px solid grey;
}

.floatRight {
    float: right;
}

.warning {
    font-weight: bold;
    color: #ac0e0e;
}

.warning:before {
    content: '\f02d  ';
    font-family: TrialAdmin;
    font-size: 120%;
    position: relative;
    top: 0.1em;
}

.button {
    border: none !important;
    color: white !important;
    text-transform: uppercase;
    font-size: 8pt !important;
    font-weight: normal !important;
    border-radius: 4px;
    padding: 0.2em 0.6em !important;
    text-decoration: none;
    cursor: pointer;
}

.button.small {
}

.button.red {
    background-color: #AA0000;
}

.button.green {
    background-color: #00AA00;
}

#notFound.warning {
    visibility: hidden;
}

/* server role flash */
.server-role {
    display: none;
    position: fixed;
    color: white;
    text-transform: uppercase;
    font-weight: 700;
    opacity: 0.9;
    width: 20em;
    text-align: center;
    line-height: 2em;
    transform: translate(-8em, 1em) rotate(-45deg);
    z-index: 3000;
}

.server-role.local, .server-role.test, .server-role.dev {
    display: block;
}

.server-role.local {
    background-color: hsl(0, 60%, 40%);
}

.server-role.local:before {
    content: 'local';
}

.server-role.dev {
    background-color: hsl(90, 60%, 40%);
}

.server-role.dev:before {
    content: 'dev';
}

.server-role.test {
    background-color: hsl(180, 60%, 40%);
}

.server-role.test:before {
    content: 'test';
}

/* Dynamically-populated detail */

.active-detail input {
    width: 100% !important;
    box-sizing: border-box !important;
}

.detail-part {
    position: relative;
    display: table;
    width: 100%;
    
}

.detail-part > table {
    margin: 0 0.5em;
}

.detail-part > table tr:first-child td {
    border-top: none;
}

.detail-part > table tr:last-child td {
    border-bottom: none;
}

.active-detail .detail-part-container {
    border: 1px solid #CCC; border-top: none;
 }

/* Edit links */
.edit-link {
    background: url("data:image/svg+xml;charset=UTF-8,<svg xmlns='http://www.w3.org/2000/svg' viewbox='0 0 600 600' width='600' height='600'><g fill='grey'><path d='M 0,0 L 600,0 L 600,600 z'></path></g></svg>") no-repeat right top;
    background-size: 4em 4em;
    cursor: pointer;
    position: absolute;
    top: 0;
    right: 0;
    text-decoration: none;
    /* font-weight: bold; */
    text-align: right;
    vertical-align: top;
    min-height: 4em;
    min-width: 4em;
    color: white !important;
    padding: 0.2em 0.4em 0 0;
}

.edit-link:hover {
    background-color: inherit;
    text-decoration: underline;
}

/* tabs */

.ui-tabs {
}

.ui-tabs-nav {

}

/*.tab-section ul,*/ .ui-tabs-nav {
    padding: 0 4px;
    margin: 0;
    list-style: none;
    /* white-space: nowrap; */
    display: table;
    border-spacing: 6px 0;
}

.ui-tabs-active {
    background-color: white !important;
    border-color: white !important;
}

.ui-tabs-nav li, .ui-tabs-nav div.fake-tab {
    display: table-cell;
    background-color: #DDD;
    padding: 4px 0.7em 8px 0.7em;
    margin: 0 0.4em 0 0;
    border-radius: 0.4em 0.4em 0 0;
    border-top: 3px solid #DDD;
    line-height:  1.2;
}

.ui-tabs-nav div.tab-spacer {
    min-width: 0.5em
}

.ui-tabs-nav li.new-tab-section, .ui-tabs-nav div.new-tab-section {
    margin-left: 1.5em;
}

.ui-tabs-nav .reassign {
    border-color: #e80c4d !important
}

.ui-tabs-nav .hidden-tab {
    display: none;
}

.ui-tabs-anchor, div.fake-tab a {
    text-decoration: none;
    font-weight: bold;
    color: grey !important;
}

.ui-tabs-anchor:hover, div.fake-tab a:hover {
    background-color: inherit;
    text-decoration: underline;
}



.ui-tabs-active .ui-tabs-anchor {
    color: black !important;
}

.ui-tabs-panel {
    padding: 0.3em 1em;
    margin: 0;
    background-color: white;
    border-radius: 0.4em 0.4em 0 0;
   
}

.basic .ui-tabs-nav li {
    /*background-color: #CCC;*/
}

.ui-tabs-panel[iframe] {
    padding: 0;
}

.ui-tabs-panel iframe {
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    width: 100%;
    border: none;
}

/* different colours for nested tabs */

.basic .ui-tabs-active, .basic .ui-tabs-panel,
.ui-tabs .ui-tabs .ui-tabs-active, .ui-tabs .ui-tabs .ui-tabs-panel {
    background-color: #EEE !important;
}

.basic .ui-tabs-active, .ui-tabs .ui-tabs .ui-tabs-active {
    background-color: #EEE !important;
    border-color: #EEE !important;
}

/* highlight tab that contains changes */
.ui-tabs .ui-tabs-nav li.changed {
    border-color: #DA6000 !important;
}

/* highlight tab that contains validation errors */
.ui-tabs .ui-tabs-nav li.section-validation-error {
    border-color: #e80c4d !important;
}

.ui-tabs .ui-tabs-nav li.section-validation-error a {
    color: #B10C3D !important;
}

.ui-helper-clearfix {
    /*display: none;*/
}

p.navigation {
    position: absolute;
    top: 4.4em;
    right: 0.5em;
}

.navButton {
    cursor: pointer;
    padding: 10px 5px;
}

/* symbols, icons, graphics */

.navigation a:hover {
    fill: darkred;
    background-color: inherit;
}


.small.icon {
    width: 0.8em;
    height: 0.8em;
}

.medium.icon {
    width: 1em;
    height: 1em;
}

.large.icon {
    width: 2em;
    height: 2em;
}

.huge.icon {
    width: 3.5em;
    height: 3.5em;
}

.mismatch {
    color: #CC0000;
}

tr.mismatch {
    background-color: rgba(255, 0, 0, 0.1);
}

/* Contact markup */

.contact .numberGroup, .contact .number, .contact .postalAddress {
    display: block;
}

.contact .postalAddress {
    white-space: pre-line;
}

.contact .mobile .number:before {
    content: "Mob: ";
}

.contact .tel .number:before {
    content: "Tel: ";
}

.contact .fax .number:before {
    content: "Fax: ";
}


/* Small-screen version */

@media only screen and (max-height: 950px) {
    body {
        font-size: 0.75em;
    }



    .editor-section, .display-section {
        margin: 1em 0 0.5em 0;
    }

    .editor-section-report {
        margin: 0em 0 0.5em 0;
    }
}

.overlay {
    position: absolute;
    padding: 0;
    margin: 0;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: hsla(0, 10%, 10%, 0.5);
    display: none;
}

#overlay {
    z-index: 150;
}

#omnisearch-overlay {
    z-index: 110;
}

.overlay.fixed {
    display: block;
}

.overlay .pop-up {
    background-color: #efeeef;
    padding: 1.5em;
    border: 1px solid #c8c8c8;
    position: relative;
}

#overlay .pop-up {
    top: 6em;
    margin-left: auto;
    margin-right: auto;
    width: 800px;
}

#omnisearch-overlay .pop-up {
    width: 40em;
}

.overlay .pop-up.ui-draggable {
    cursor: grab; cursor: -moz-grab; cursor: -webkit-grab;
}

    .overlay .pop-up.narrow {
        width: 500px !important;
    }

.overlay .pop-up.ui-draggable-dragging {
    cursor: grabbing; cursor: -moz-grabbing; cursor: -webkit-grabbing;
}

.overlay .pop-up .close-button {
    position: absolute;
    top: 0;
    right: 0.5em;
    font-size: 200%;
    font-weight: bold;
    cursor: pointer;
}


.leader-br {
    background-image: url("data:image/svg+xml;charset=UTF-8,<svg xmlns='http://www.w3.org/2000/svg' viewbox='0 0 20 50' width='20' height='50'><g stroke-dasharray='1,1' stroke-width='0.5pt' stroke='hsl(0, 0%, 67%)' fill='none'><path d='M 7,0 L 7,25 L 15,25'></path></g></svg>");
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 2.5em auto;
}
.leader-v {
    background-image: url("data:image/svg+xml;charset=UTF-8,<svg xmlns='http://www.w3.org/2000/svg' viewbox='0 0 20 50' width='20' height='50'><g stroke-dasharray='1,1' stroke-width='0.5pt' stroke='hsl(0, 0%, 67%)' fill='none'><path d='M 7,0 L 7,50'></path></g></svg>");
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 2.5em auto;
}

/* menu trees */

.menu-tree {
    margin-top: 1em;
}

.menu-tree .section {
    display: inline-block;
    vertical-align: top;
}

.menu-tree .section .title {
    font-weight: bold;
    border-bottom: 1px solid hsl(0, 0%, 70%);
    padding-bottom: 0.4em;
    margin-bottom: 1em;
    padding-right: 1em;
}

.menu-tree .section + .section {
    margin-left: 1.5em;
}

.menu-tree .content .icon {
    display: block;
    padding-left:  0.2em;
}


.brace {
    vertical-align: middle;
    width: 0.7em;
    padding: 0.2em 0.6em;
}

.email {
    color: hsl(120, 100%, 25%);
    font-family: monospace;
    font-size: 120%
}

.case-link {
    display: inline-block;
    white-space: nowrap;
}

@media print {
    body {
        font-size: 70%
    }
}

@media screen {
    .printOnly {
        display: none;
    }

    .thumbnail .screenOnly {
        display: none !important;
    }
}

@media print {
    .screenOnly {
        display: none !important;
    }
    .case-link {
        width: 13%;
    }

    .forPDF {
        width:2%;
    }

    .breakhere {
            page-break-after: always;
        }
}

/*Menu*/

.menuTemplate4 {
    margin: 0 auto;
    width: auto;
    /*float: left;*/
    position: relative;
    z-index: 4;
    height: 36px;
    background: hsl(198, 58.1%, 55.0%); /*#2777A3 url(bg.gif);*/
    border: 1px solid #036;
    font-family: Arial, Helvetica, sans-serif;
    list-style: none;
    padding: 0;
}

.menuTemplate4 li {
    padding: 0;
    float: left;
    height: 36px;
    position: relative;
    color: black;
    z-index: 5;
}

    .menuTemplate4 li:hover, .menuTemplate4 li.onhover {
        border-top: 1px solid #CC0000;
    }

.menuTemplate4 a {
    padding: 0 30px;
    line-height: 35px;
    font-size: 12px;
    font-weight: bold;
    display: inline-block;
    outline: 0;
    text-decoration: none;
    color: white;
    position: relative;
}

.menuTemplate4 li:hover a, .menuTemplate4 li.onhover a {
    background-color: #80CBF0;
    color: #000;
    z-index: 9;
}

.menuTemplate4 a.arrow {
    /*background: url(arrow.gif) no-repeat right center;*/
}

.menuTemplate4 li.menuRight {
    float: right;
    margin-right: 0px;
}

.menuTemplate4 li.separator {
    display: none;
}

.menuTemplate4 .drop {
    position: absolute;
    z-index: 5;
    left: -9999px;
    border: 1px solid #DDD;
    border-bottom: 3px solid #990000;
    background: #FFF;
    text-align: left;
    padding: 20px;
    color: #0F4F89;
    top: 34px;
}

    .menuTemplate4 .drop a {
        padding-left: 0px;
        padding-right: 0px;
        line-height: 26px;
        font-size: 12px;
        font-weight: normal;
        display: inline;
        text-align: left;
        position: static;
        z-index: 0;
        background-image: none;
    }

.menuTemplate4 li:hover .drop, .menuTemplate4 li.onhover .drop {
    left: 1px;
    /*background: #DAF0FE url(bg-right.png) no-repeat right bottom;*/
    width: 62px;
}

.menuTemplate4 li:hover .dropToLeft, .menuTemplate4 li.onhover .dropToLeft {
    left: auto;
    right: -1px;
    background: white url(bg-left.png) no-repeat 0 bottom;
}

.menuTemplate4 li:hover .dropToLeft2, .menuTemplate4 li.onhover .dropToLeft2 {
    left: auto;
    right: -60px;
}

.menuTemplate4 div.drop div div {
    padding: 6px 20px;
}

.menuTemplate4 li:hover .drop a, .menuTemplate4 li.onhover .drop a {
    background: none;
    background-image: none;
    padding: 0 0;
}

.menuTemplate4 div.drop div a {
    line-height: 24px;
    color: #0F4F89;
    background: none;
}

    .menuTemplate4 div.drop div a:hover {
        /*text-decoration: underline;*/
        cursor: pointer;
        color: white;
        background-color: black;
        padding: 4px;
    }

.menuTemplate4 div.left {
    float: left;
}

.decor4_1 {
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    -moz-box-shadow: 0px 1px 4px #999;
    -webkit-box-shadow: 0px 1px 4px #999;
    box-shadow: 0px 1px 4px #999;
}

.decor4_2 {
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    -moz-box-shadow: 0 4px 10px #CCC;
    -webkit-box-shadow: 0 4px 10px #CCC;
    box-shadow: 0 4px 10px #CCC;
}


/* Styling for forms - layout, controls, buttons, jQueryUI widgets, etc. */

/* Documentation references:
 * http://npeuctu.npeu.ox.ac.uk:8080/TrialAdminDoc/WebUserInterface#interaction
 * http://npeuctu.npeu.ox.ac.uk:8080/TrialAdminDoc/WebUserInterface#textbox-prompts
 * http://npeuctu.npeu.ox.ac.uk:8080/TrialAdminDoc/WebUserInterface#date-pickers
 */

/* LAYOUT */

.editor-section, .display-section {
    margin: 1.5em 0 1em 0;
}

.editor-section.idagnostic, .display-section.diagnostic {
    opacity: 0.5;
    border-top: 1px solid grey;
    margin-top: 3em;
}

.editor-vertSection, .display-vertSection {
    display: table-cell;
    vertical-align: top;
    padding-right: 0.5em;
}

.editor-vertSection + .editor-vertSection, .display-vertSection + .display-vertSection {
    padding-left: 1.2em;
    border-left: 2px dotted lightgrey;
}

.editor-vertSection > .editor-section:first-child, .editor-vertSection > .display-section:first-child {
    margin: 0;
}

div.right-aligned {
    text-align: right;
}

div.right-aligned input.text-box {
    text-align: right;
}

.centered {
    text-align: center;
    vertical-align: middle !important;
}

.editor-block, .display-block, .display-section iframe {
    vertical-align: top;
    margin-right: 0.6em;
    margin-bottom: 1em;
    position: relative;
    white-space: nowrap;
}

.editor-block, .display-block {
    display: inline-block;
}

.editor-block.prefix-label {
    vertical-align: bottom;
    padding-bottom: 5px;
}

.editor-block .inlineSubmit {
    display: inline-block;
    margin-top: 1.5em;
}

.headline .editor-block .inlineSubmit {
    margin-top: 2.4em;
}

.inlineSubmit input {
    display: inline;}

div.editor-block, div.display-block {
    display: inline-block;
}

li div.editor-block, .li div.editor-block {
    padding-left: 0.5em;
    vertical-align: baseline;
}

.editor-block + .editor-block.vertDiv, .display-block + .display-block.vertDiv {
    border-left: 2px dotted lightgrey;
    padding-left: 1em;
}

.editor-block.nextVertDiv, .display-block.nextVertDiv {
    border-right: 2px dotted lightgrey;
    padding-right: 1em;
}

.editor-block.centre-line {
    vertical-align: middle;
}

.editor-label, .display-label, .reading-label {
    font-size: 90%;
    /*opacity: 0.75;*/
    padding: 2px 6px; /* 6px aligns with left-padding of display-field and editor-field controls */
    text-align: left;
    position: relative;
}

.diagnostic .display-label {
    padding-left: 0;
    padding-right: 8px;
    border-bottom: 1px dotted grey;
}

.editor-label, .reading-label {
    background-color: rgb(74, 136, 160); /* for the benefit of IE8 */
    background-color: rgba(74, 136, 160, 0.75); /* #fcfcb2; */
    color: white;
    white-space: normal;
}

.reading-label {
    text-align: center;
}

.editor-field + .editor-label, .editor-field + .editor-section {
    margin-top: 1em; /* vertically stacked fields and labels need space between them */
}

/* nested sections don't have bottom margins*/
.editor-section .editor-section {
    margin-bottom: 0;
}

.ui-tabs-panel > .editor-section {
    margin-bottom: 2em;
}

h4 {
    font-size: 80%;
    font-weight: normal;
    /*text-transform: uppercase;*/
/*     letter-spacing: 0.1em; */
    padding-left: 2em;
    overflow: hidden;
    text-align: left;
    position: relative;
    top: -1em;
    margin-top: 3em;
}

h4:before, h4:after {
    background-color: #999;
    content: "";
    display: inline-block;
    height: 1px;
    position: relative;
    vertical-align: middle;
    width: 100%;
}
h4:before {
    right: 0.5em;
    margin-left: -100%;
}
h4:after {
    left: 0.5em;
    margin-right: -100%;
}

/* nested blocks don't have bottom margins*/
.editor-block .editor-block, .editor-block .display-block {
    margin-bottom: 0;
}

.editor-field, .display-field {
    position: relative;
}

.display-field {
    border: none;
    padding: 4px 6px; /* one more px than textboxes because of textbox 1px borders */
}

.diagnostic .display-field {
    padding-left: 0;
    padding-right: 10px;
}

.reading-field {
    font-size: 200%;
    font-weight: bold;
    text-align: center;
    padding: 0 6px 4px 6px;
    border-top: none;
    border-left: 2px solid;
    border-bottom: 2px solid;
    border-right: 2px solid;
    min-width: 2em;
}



/* SUBMIT BUTTONS */

input[type="submit"],
input[type="button"],
input[type="reset"],
a.linkButton,
button {
    background-color: #d3dce0;
    border: 1px solid hsl(0, 0%, 47%);
    cursor: pointer;
    font-family: inherit;
    font-size: 110%;
    padding: 0.2em 0.5em;
    /*margin-right: 8px;*/
    width: auto;
    border-radius: 0.3em;
    text-decoration: none;
}

div.submit-block {
    display: table-cell;
    vertical-align: bottom;
    padding-bottom: 1em !important;
}

.submit-block input[type="submit"] {
    margin: 0;
    font-size: 95%;
    position: relative;
    top: 0.3em;
}

input[type="submit"],
input[type="button"],
a.linkButton,
button {
    font-weight: 700;
    border-width: 2px;
    /* display: inline-block; */
}

input[type="reset"] {
    display: none;
}

td input[type="submit"],
td input[type="button"],
td input[type="reset"],
td a.linkButton,
td button,
a.linkButton.small {
    font-size: 1em;
    /* padding: 1px 3px; */
    margin-right: 4px;
    border-width: 2px;
    display: inline-block;
    margin-bottom: 0.5em
}

#mainSubmit {
    /*position: absolute;
    right: 0;*/
    text-align: right;
    margin-bottom: 0;
}

.subSubmit {
    text-align: right;
}

#mainSubmit, .subSubmit {
    line-height: 2.8;
    margin-top: 1em;
    margin-bottom: 1em;
    margin-right:  0.6em;
}

.editor-block.subSubmit {
    vertical-align: bottom;
}

.editor-block input[type="submit"] {
    /* vertical-align: bottom; */
}

/* CHANGE TRACKING */

.editor-label.changed {
    background-color: #DA6000 !important;
}

.editor-field.changed input, .editor-field.changed textarea, .detail-part-container.changed {
    border-color: #DA6000 !important;
}

.detail-part-container.changed .edit-link {
    display: none;
}

fieldset.changed input[type='submit'], form.changed input[type='submit'] {
    border-color: #DA6000 !important;
}

fieldset input[type='submit'].cancel, fieldset.changed input[type='submit'].cancel {
    border-color: hsl(342, 90%, 48%);
    font-weight: normal;
    display: none;
}

fieldset span.cancel {
    display: none;
}

fieldset {
    border: none;
    margin: 0;
    padding: 0;
    display: inline-block;
}

fieldset legend {
    display: none;
}

/* CONTROLS */

/* all text boxes and pull-down-menus */
.editor-field input.text-box, .editor-field textarea, .editor-field select, 
.editor-field .checkboxWrapper, .editor-field .radioWrapper, .editor-field input[type='password'],
.tag-widget
 {
    font-family: inherit;
    font-size: inherit;
    font-weight: inherit;
    border: 1px solid #DDD;
    background-color: whitesmoke; /*hsla(100, 0%, 0%, 0.1);*/ /* whitesmoke;*/
    margin: 0;
    /*min-width: 6em;*/
}

.editor-field input.text-box, .editor-field textarea, .editor-field select, .editor-field input[type='password'],
.tag-widget {
    padding: 5px 6px 6px 6px;
}

.editor-field .radioWrapper {
    padding: 4px 6px 4px 2px;
}

.editor-field .checkboxWrapper {
    padding: 4px 6px 4px 5px;
}

/* general control dimensions */

input[type='checkbox'] {
}

.editor-field input.date-only {
    width: 7em;
}

.editor-field input.date-time {
    width: 9.5em;
}

.editor-field textarea {
    width: 30em;
    height: 6em;
}

.editor-field.wide textarea {
    width: 42em;
    height: 8em;
}

.editor-field.narrow input.text-box {
    width: 7.5em;
}

.editor-field.narrow textarea {
    width: 23em;
}

.editor-field.very-narrow input {
    width: 4em;
}

.editor-field.wide input {
    width: 18em;
}

.contact-section textarea, .postalAddress textarea {
    height: 9em;
}

.contact-section textarea, .postalAddress textarea, .postalAddress input.text-box {
    width: 23em;
}

.editor-field.veryWide input {
    width: 25em;
}

.editor-field input, .editor-field textarea {
     /* box-sizing: border-box; *//* ensures that fixed-width boxes all line up even if they have different padding */
}

.var-width.editor-field input, .var-width.editor-field textarea {
    box-sizing: content-box;
}

.fixed-width .editor-block {
    max-width: 10em;
}

.fixed-width .text-box.single-line {
    width: 100%;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
}

/*.editor-field .checkboxWrapper, .editor-field .radioWrapper {
    border: none !important;
}*/

.editor-field .modified {
    border-color: orange !important;
}

/* radio buttons */

.radioWrapper input {
    margin: auto 0 auto 0.5em;
    padding: 0;
    width: 1em !important;
    cursor: pointer;
}

.radioWrapper label {
    padding: 0 0.5em 0 0;
    cursor: pointer;
}

.editor-field .checkboxWrapper {
    cursor: pointer;
}

br + input.text-box, div.editor-field + div.editor-field input.text-box, br + .prompt-wrapper input.text-box {
    border-top: none !important; /* vertically stacked textboxes have a single-pixel border line between them (e.g in addresses)*/
}

.editor-field input:focus, .editor-field textarea:focus, .editor-field select:focus, .editor-field input:hover, .editor-field textarea:hover, .editor-field select:hover, a.linkButton:hover {
    background-color: white;
}

/* Headline sections */

.headline .editor-field, .headline .display-field {
    font-size: 180%;
    font-weight: bold;
}

.headline2 .editor-field, .headline2 .display-field, .ui-tabs-panel .headline .editor-field, .ui-tabs-panel .headline .display-field {
    font-size: 150%;
    font-weight: bold;
}

.headline .cancel-headline .display-field, .headline .cancel-headline .editor-field, .headline .cancel-headline.display-field, .headline .cancel-headline.editor-field {
    font-size: 100%;
    font-weight: normal;
    white-space: normal;
}

.editor-section .display-field {
    opacity: 0.8;
}

/* jQuery UI styling */

/* generic styling for pop-up elements */
#ui-datepicker-div, .ui-autocomplete {
    background: white;
    padding: 10px;
    z-index: 200 !important;
    border: 1px solid #DDD;
}

.ui-autocomplete {
    max-width: 40em;
}

/* the fieldset element is the elemet to which pop-up elements are appended to. I've found that a relative positioning helps in accurate pop-up positioning */
fieldset {
    position: relative;
}

/* datepicker */

#ui-datepicker-div {
    display: none; /* to start off with */
}

.ui-datepicker-header {
    text-align: center;
    position: relative;
}

.ui-datepicker-prev, .ui-datepicker-next {
    position: absolute;
    display: inline;
    cursor: pointer;
    text-decoration: none;
    opacity: 0.8;
}

.ui-datepicker-prev {
    left: 0;
}

.ui-datepicker-next {
    right: 0;
}

.ui-datepicker-calendar td {
    text-align: right;
}

.ui-datepicker-calendar td, .ui-datepicker-calendar th {
    padding: 0.5em;
}

.ui-datepicker-calendar a {
    text-decoration: none;
    color: inherit;
}

.ui-datepicker-calendar a:hover {
    background-color: inherit;
}

.ui-datepicker-current-day {
    color: #CC0000;
    font-weight: bold;
}

.ui-datepicker-today {
    border: 1px solid #00aa00;
}

.ui-datepicker td[data-handler='selectDay'] {
    cursor: pointer;
}

.ui-datepicker td[data-handler='selectDay']:hover {
    background-color: lightyellow;
}

#liveSearch {
    background: white;
    margin: 0.8em 0;
}


/* autocomplete */

.ui-helper-hidden-accessible {
    display: none;
}


.ui-autocomplete {
    padding: 0.4em 0 !important;
    position: absolute;
    width: auto !important;
}



.ui-menu-item {
    list-style: none;
    padding: 0;
    /*white-space: nowrap;*/
}

.ui-menu-item + .ui-menu-item {
    border-top: 1px solid #DDD;
}

li.ui-menu-item {
    position: relative;
}

li.ui-menu-item a {
    padding: 0.2em 0.8em;
    text-decoration: none;
    display: block;
    cursor: pointer;
}

li.ui-menu-item .pop-out-positioner {
    position: absolute; right: 0; top: 0;
}

li.ui-menu-item .pop-out-detail {
    position: absolute;
    top: -4px;
    background: lightyellow;
    padding: 0 0.5em ;
    border: 1px solid #DDD;
    width: auto !important;
    white-space: nowrap;
    cursor: pointer;
}

li.ui-menu-item .pop-out-detail .edit-link {
    display: none;
}

li.ui-menu-item a:hover {
    background-color: lightyellow;
    color: #CC0000;
}

.ui-state-focus {
    background-color: lightyellow;
    color: #CC0000;
}

.text-box.lookup-related-id {
    /* textbox isn't actually hidden but just behind its associated type-in-value box */
    width: 2.5em;
    border-right: none !important;
    text-align: right;
    position: absolute;
    z-index: -1;
    background-color: lightyellow !important;
    opacity: 0;
}

/* propagate validation error styling from related-id-field to its associated type-in-value field */
.text-box.lookup-related-id.input-validation-error + span + .text-box {
    border: 1px solid #e80c4d !important;
    /*border-left-width: 2px !important;*/
}

.text-box.lookup-value-autocomplete, ul.ui-autocomplete {
    width: 19em;
}

.text-box.lookup-value-autocomplete.pullingDown, .text-box.lookup-value-miniAutocomplete.pullingDown {
    cursor: pointer !important;
}

.text-box.lookup-value-miniAutocomplete {
    background: url("data:image/svg+xml;charset=UTF-8,<svg xmlns='http://www.w3.org/2000/svg' viewbox='0 0 800 600' width='800' height='600'><g transform='rotate(90,300,300)' fill='grey'><path d='M 4,560 L 4,30 L 560,300 L 4,560 z'></path></g></svg>") no-repeat right center;
    background-size: 1.33em 1em;
    padding-right: 1.5em !important;
    cursor: pointer;
}

.help-wrapper .text-box.lookup-value-miniAutocomplete {
    background-position: right 20px center;
}

.text-box.lookup-value-miniAutocomplete:focus {
    cursor: inherit;
}

.text-box.lookup-value-miniAutocomplete.drop-selected, .text-box.lookup-value-autocomplete.drop-selected {
    cursor: pointer;
}

.prompt-wrapper {
    position: relative;
    display: inline-block;
    /*overflow: hidden;*/
}

.text-box-prompt, .autocomplete-feedback, .help.tooltip {
    position: absolute;
    line-height: 1em;
    top: 50%;
    margin-top: -0.5em; /* vertical centering relative to containing .editor-field div */
    padding: 0 6px; /* matches text-box padding including 1px border */
}

.text-box-prompt {
    left: 0;
    color: #888;
}

.suppressPrompts .text-box-prompt {
    display: none;
}

.suppressPrompts ::-webkit-input-placeholder {
    color: transparent;
}

.suppressPrompts ::-moz-placeholder {
    color: transparent;
}

.suppressPrompts :-moz-placeholder {
    color: transparent;
}

.suppressPrompts :-ms-input-placeholder {
    color: transparent;
}


.autocomplete-feedback {
    right: 1em;
    color: white;
    background-color: rgb(153, 153, 153);
    padding: 0.3em 0.6em;
    margin-top: -0.8em;
    text-transform: uppercase;
    font-size: 87%;
    border-radius: 1.3em;
    display: none; /* to start with */
}

.autocomplete-feedback.mini {
    right: 2em;
}


/* VALIDATION */

.field-validation-error {
    position: absolute;
    z-index: 100;
    background: #e80c4d;
    padding: 5px 6px;
    min-width: 6em;
    margin-top: 1px;
    color: white;
    left: 0;
    bottom: 0;
    width: 100%;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
}


.validation-summary-errors {
    position: absolute;
    top: 0;
    right: 0;
    background-color: #efeeef;
    border-left: 2px solid;
    border-bottom: 2px solid;
    border-color: #e80c4d;
    padding-top: 0.7em;
    padding-right: 0.7em;
}

.ui-tabs-panel .validation-summary-errors {
    background-color: white;
}


/* HELP TOOLTIPS */
.help-wrapper {
    position: relative;
}

.help-wrapper input.text-box {
    padding-right: 1.9em;
}

.help.tooltip {
    right: 0.4em;
    color: #999;
    border: 1px solid #999;
    padding: 0;
    width: 1em;
    text-align: center;
    height: 1em;
    border-radius: 0.7em;
    cursor: pointer;
    /*font-weight: bold;*/
}

.editor-label .url-link {
    font-weight: bold;
    background-color: hsla(0, 0%, 20%, 0.5);
    position: absolute;
    right: 0; top: 0;
    padding: 2px 7px;
    cursor: pointer;
}

.editor-label .url-link:after {
    font-family: AdminIconsFont;
    font-weight: normal;
    content: ' \f07f';
}

.editor-label .url-link:hover {
    text-decoration: underline;
}

/* tag widgets */

.tag-widget {
    padding-right: 3em;
    max-width: 20em;
    white-space:normal;
    line-height: 1.8;
    padding-top: 2px;
    padding-bottom: 3px;
}



.edit-link.tags {
    z-index: 100;  
}

.tag-widget input.lookup-value-miniAutocomplete {
    border: none !important;
     padding-top: 3px;
    padding-bottom: 3px; 
    min-width: 4em;
}

.tag-widget:hover, .tag-widget.focussed {
    background-color: white;
}

.tag-widget:hover input.lookup-value-miniAutocomplete {
    background-color: white;
}

.tag {
    background-color: hsl(60, 0%, 60%);
    padding: 1px 5px 3px 5px;
    color: white;
    border-radius: 4px;
    cursor: default;
    /* display: inline-block; */
    white-space: nowrap;
}

a.tag {
    color: white;
    cursor: pointer;
    text-decoration: none;
}

.tag + .tag {
    /* margin-left: 0.3em; */
}

.tag .remove {
    color: hsl(60, 0%, 30%);
    cursor: pointer;
    /* padding:  0; */
    position: relative;
    top: 0.1em;
}

.tag .remove:before {
    font-family: AdminIconsFont;
    content: ' \f081'
}

.tag:hover .remove {
    color: hsl(0, 80%, 50%);
}

/* .tag .remove:hover {
    opacity: 0.3;
} */

select {
    cursor: pointer;
}
tr.received, div.received, form.received {
    background-color: hsl(106, 119%, 95%);
}

tr.due {
    background-color: hsl(106, 0%, 92%);
}

tr.overdue {
    color: hsl(0, 65%, 50%);
}

.statusFlag {
    position: absolute;
    top: 1.5em;
    right: 0;
    background-color: darkgray;
    padding: 0.3em 0.6em;
    color: white;
    text-transform: uppercase;
    border-radius: 0.4em;
    font-weight: bold;
    font-size: 95%;
}

fieldset {
    width: 100%;
}

.adminInterface.Died #body {
    background-color: hsl(200, 10%, 80%);
}

.adminInterface.Died .editor-field input.text-box, .adminInterface.Died .editor-field textarea, .adminInterface.Died .editor-field select, .adminInterface.Died .editor-field .checkboxWrapper, .adminInterface.Died .editor-field .radioWrapper {
    /*background-color: hsla(200, 0%, 0%, 0.1);*/
}


/* Directory (Index) pages */

.secondary {
    opacity: 0.5;
    white-space: nowrap;
}

.subIndex {
    margin-bottom: 1.2em;
/*     white-space: nowrap; */
}

.subIndex h1 {
    -webkit-column-span: all;
    -moz-column-span: all;
    column-span: all;
    font-size: 120%;
    text-transform: uppercase;
    color: white;
    background-color: darkgrey;
    padding: 0.2em 0.4em;
    margin-bottom: 0.6em;
    /*border-radius: 0.3em 0.3em 0 0;*/
}

.subIndex .subSection {
    -webkit-column-break-inside: avoid; /* Chrome, Safari */
    page-break-inside: avoid;           /* Theoretically FF 20+ */
    break-inside: avoid-column;         /* IE 11 */
    display:table;                      /* Actually FF 20+ */

    margin-bottom: 1.7em;
}

.subIndex p, .subIndex h2 {
    margin: 0 0 0.6em 0;
    padding: 0 0.4em;
    /*     -webkit-column-break-inside: avoid;
    -moz-column-break-inside: avoid;
    column-break-inside: avoid; */
}

.subIndex h2 {
    font-size: 100%;
    -webkit-column-break-after: avoid;
}

.subIndex p + h2 {
    margin-top: 1em;
}

.subIndex p {
    display: block;
}

.subIndex a {
    text-decoration: none;
}

.subIndex .col6 {
    column-count: 6;
    -webkit-column-count: 6;
    -moz-column-count: 6;
}

.subIndex .col5 {
    column-count: 5;
    -webkit-column-count: 5;
    -moz-column-count: 5;
}

.subIndex .col4 {
    column-count: 4;
    -webkit-column-count: 4;
    -moz-column-count: 4;
}

.subIndex .col3 {
    column-count: 3;
    -webkit-column-count: 3;
    -moz-column-count: 3;
}

.subIndex .col2 {
    column-count: 2;
    -webkit-column-count: 2;
    -moz-column-count: 2;
}

/* phone number semantic markup */
.numberGroup {
    display: block;
}

.numberGroup:before {
    font-family: AdminIconsFont;
    font-size: 140%;
    padding-right: 0.2em;
}

.numberGroup {
    white-space: nowrap;
}

.number + .number:before {
    content: " / "
}

.number .comment {
    font-style: italic;
}

.number .comment:before {
    content: ' (';
}

.number .comment:after {
    content: ')'
}

/* tables
----------------------------------------------------------*/
table {
    border-collapse: collapse;
    border-spacing: 0;
    margin-top: 1.75em;
    border: 0 none;
}

td, th {
    padding: 0.5em 1em 0.5em 0em;
    /* margin: 0.3em 0.3em 0.3em 0; */
    vertical-align: top;
}

.noPadding td {
    padding: 0;
}

tr.baseline td {
    vertical-align: baseline !important;
}

.groupHeader {
    font-weight: bold;
    color: white;
    background-color: #333;
    padding-left: 1em;
    page-break-before: always;
}

td, tbody th {
    border-top: 1px solid #CCCCCC;
    border-bottom: 1px solid #CCCCCC;
}

tbody.unreviewed
{
    border-top: 2px solid red;
}

.noRules td, td.noRules {
    border-top: hidden;
    border-bottom: hidden
}



.footer td, td.footer {
    border-bottom: none;
}

.secondary {
    opacity: 0.7;
}

th {
    text-align: left;
    padding-left: 0;
    /*border-bottom: 2px solid grey;*/
}

    th.groupHeading {
        vertical-align: bottom;
        font-weight: normal;
        border-bottom: 1px solid #DDD;
    }

tr.headers, thead {
    border-bottom: 2px solid grey;
}

td.nobreak, th.nobreak {
    white-space: nowrap;
}

td.vertDivision, th.vertDivision {
    padding: 0;
    min-width: 0.5em;
    border-right: 1px dotted #AAAAAA;
}

td.vertDivision.gap, th.vertDivision.gap {
    border: none;
}

.vertDivision + td, .vertDivision + th {
    padding-left: 1em;
}

td.padding, th.padding {
    border: none;
}


th a {
    display: block;
    position: relative;
}

    th a:link, th a:visited, th a:active, th a:hover {
        color: #333;
        font-weight: 600;
        text-decoration: none;
        padding: 0;
    }

    th a:hover {
        color: #000;
    }

th.asc a, th.desc a {
    margin-right: .75em;
}

    th.asc a:after, th.desc a:after {
        display: block;
        position: absolute;
        right: 0em;
        top: 0;
        font-size: 0.75em;
    }

    th.asc a:after {
        content: 'â–²';
    }

    th.desc a:after {
        content: 'â–¼';
    }


td > table {
    position: relative;
    top: -0.55em;
}

td.actionLinks {
    white-space: nowrap;
}

tr.pager td {
    padding: 0 0.25em 0 0;
}

td.rightAligned, th.rightAligned {
    text-align: right;
}
td.centreAligned, th.centreAligned {
    text-align: center;
}

.hyper-row:hover {
    background-color: hsl(60, 100%, 90%);
    cursor: pointer;
}

.hyper-row:hover .label-cell {
    background-color: white;
}

td:first-child, th:first-child, td.label-cell + td {
    padding-left: 0.3em;
}

.fw5  { width: 5em }
.fw6  { width: 6em }
.fw7  { width: 7em }
.fw8  { width: 8em }
.fw9  { width: 9em }
.fw10 { width: 10em }
.fw11 { width: 11em }
.fw12 { width: 12em }
/* UKOSS APP */

/**UKOdSS*/
body.adminInterface.UKOSS header {
    border-top: solid 10px hsl(198, 58.1%, 55.0%);
}

body.adminInterface.UKOSS .site-title .text {
    top: -15px;
}

body.adminReport.UKOSS #header {
    border-bottom: solid 2pt #551F75;
}

/* **** Main Object Classes **** */

/* CENTRE */
fieldset.centre .editor-label {
    background-color: hsla(197, 37%, 46%, 0.75);
}

input[type='submit'] {
    border-width: 2px;
}

fieldset.centre input[type='submit'] {
    border-color: hsl(197, 37%, 46%);
}

.editor-section.centre h3 {
    border-top: 3px solid hsl(197, 37%, 46%);
    color: hsl(197, 37%, 46%);
}

.omnisearch > .searchResult.centre > .flag {
    background-color: hsl(197, 37%, 46%);
}

/* CENTRE PERSON */

fieldset.centrePerson .editor-label {
    background-color: hsla(204, 47%, 46%, 0.75);
}

fieldset.centrePerson input[type='submit'] {
    border-color: hsl(255, 37%, 46%);
}

.editor-section.centrePerson h3 {
    border-top: 3px solid hsl(255, 37%, 46%);
    color: hsl(255, 37%, 46%);
}

.omnisearch > .searchResult.centrePerson > .flag {
    background-color: hsl(255, 37%, 46%);
}

.centrePerson .tag-widget {
    padding-right: 4px;
}

/* CENTRE PERSON ROLE */

.tag.role {
    background-color: hsla(255, 37%, 46%, 0.2);
    color: black
}

/* SUBJECT CONTACT */

fieldset.subjectContact .editor-label {
    background-color: hsla(233, 37%, 46%, 0.75);
}

fieldset.subjectContact input[type='submit'] {
    border-color: hsl(233, 37%, 46%);
}

.editor-section.subjectContact h3 {
    border-top: 3px solid hsl(233, 37%, 46%);
    color: hsl(233, 37%, 46%);
}

.omnisearch > .searchResult.subjectContact > .flag {
    background-color: hsl(233, 37%, 46%);
}


/* CLRN, CRN */

fieldset.clrn .editor-label, fieldset.crn .editor-label {
    background-color: hsla(91, 40%, 38%, 0.75);
}

fieldset.clrn input[type='submit'], fieldset.crn input[type='submit'] {
    border-color: hsl(91, 40%, 38%);
}

    .edit-link.clrn, .edit-link.crn {
        background-image: url("data:image/svg+xml;charset=UTF-8,<svg xmlns='http://www.w3.org/2000/svg' viewbox='0 0 600 600' width='600' height='600'><g fill='hsla(91, 40%, 38%, 0.75)'><path d='M 0,0 L 600,0 L 600,600 z'></path></g></svg>")
    }

/* R&D */

fieldset.randd .editor-label {
    background-color: hsla(45, 38%, 40%, 0.75);
}

fieldset.randd input[type='submit'] {
    border-color: hsl(45, 38%, 40%)
}

    .edit-link.randd {
        background-image: url("data:image/svg+xml;charset=UTF-8,<svg xmlns='http://www.w3.org/2000/svg' viewbox='0 0 600 600' width='600' height='600'><g fill='hsla(45, 38%, 40%, 0.75)'><path d='M 0,0 L 600,0 L 600,600 z'></path></g></svg>")
    }

.omnisearch > .searchResult.rAndD > .flag {
    background-color: hsla(45, 38%, 40%, 0.75);
}

/* LREC */

fieldset.lrec .editor-label {
    background-color: hsla(71, 38%, 40%, 0.75);
}

fieldset.lrec input[type='submit'] {
    border-color: hsl(71, 38%, 40%)
}

    .edit-link.lrec {
        background-image: url("data:image/svg+xml;charset=UTF-8,<svg xmlns='http://www.w3.org/2000/svg' viewbox='0 0 600 600' width='600' height='600'><g fill='hsla(71, 38%, 40%, 0.75)'><path d='M 0,0 L 600,0 L 600,600 z'></path></g></svg>")
    }

/* SUBJECT */

/*fieldset.subject .editor-label {
    background-color: hsla(355, 43%, 45%, 0.75);
}

fieldset.subject input[type='submit'] {
    border-color: hsl(355, 43%, 45%);
}*/

.editor-section.subject h3 {
    border-top: 3px solid hsl(355, 43%, 45%);
    color: hsl(355, 43%, 45%);
}

.omnisearch > .searchResult.subject > .flag {
    background-color: hsl(355, 43%, 45%);
}


/* GP */

fieldset.gp .editor-label {
    background-color: hsla(125, 54%, 23%, 0.75);
}

fieldset.gp input[type='submit'] {
    border-color: hsl(125, 54%, 23%);
}

.editor-section.gp h3 {
    border-top: 3px solid hsl(125, 54%, 23%);
    color: hsl(125, 54%, 23%);
}

.omnisearch > .searchResult.gp > .flag {
    background-color: hsl(125, 54%, 23%);
}


    .edit-link.gp {
        background-image: url("data:image/svg+xml;charset=UTF-8,<svg xmlns='http://www.w3.org/2000/svg' viewbox='0 0 600 600' width='600' height='600'><g fill='hsla(125, 54%, 23%, 0.75)'><path d='M 0,0 L 600,0 L 600,600 z'></path></g></svg>")
    }

/* CRF ENTRY and TRANSFER */

.crfEntry .editor-label, div.crfEntry .editor-label {
    background-color: hsla(140, 40%, 38%, 0.75);
}

.crfEntry input[type='submit'], div.crfEntry input[type='submit'] {
    border-color: hsl(140, 40%, 38%);
}

    .edit-link.crfEntry {
        background-image: url("data:image/svg+xml;charset=UTF-8,<svg xmlns='http://www.w3.org/2000/svg' viewbox='0 0 600 600' width='600' height='600'><g fill='hsla(140, 40%, 38%, 0.75)'><path d='M 0,0 L 600,0 L 600,600 z'></path></g></svg>")
    }

div.transfer .editor-label, .transfer .editor-label {
    background-color: hsla(180, 40%, 38%, 0.75);
}



/* **** Subject status **** */

.statusFlag.Discharged, .subIndex.Discharged h1 {
    background-color: rgb(100, 39, 4);
}

.statusFlag.Died, .subIndex.Died h1 {
    background-color: black; 
}

.statusFlag.InCare, .subIndex.InCare h1 {
    background-color: hsl(129, 41%, 46%);
}

.statusFlag.InCare {
    display: none;
}


/* **** Centre status **** */

.subIndex.Recruiting h1 {
    background-color: hsl(24, 70%, 49%);
}

.marker.Recruiting {
    fill:  hsl(24, 70%, 49%);
}

.subIndex.ContinuingCare h1 {
    background-color: hsl(51, 70%, 49%);
}

.marker.ContinuingCare {
    fill: hsl(51, 70%, 49%);
}

.subIndex.AwaitingStartDate h1 {
    background-color: hsl(24, 50%, 49%);
}

.marker.AwaitingStartDate {
    fill: hsl(24, 50%, 49%);
}

.marker.other {
    fill: lightgray;
}

.case-link .marker, .data-entry-key .marker {
    stroke-width: 6pt;
}

.marker.notCase {
    fill: hsl(0, 100%, 27%);
}

.marker.DCFReturned {
    fill: hsl(198, 84%, 46%);
}

.marker.FirstEntryStarted {
    fill: hsl(60, 100%, 50%);
}

.marker.FirstEntryComplete {
    fill: hsl(24, 100%, 50%);
}

.marker.SecondEntryStarted {
    fill: hsl(120, 93%, 79%);
}
.marker.Complete {
    fill: hsl(120, 100%, 20%);
}

.marker.outstandingQ {
    stroke: hsl(0, 90%, 50%);
}

.marker.noOutstandingQ {
    stroke: hsl(300, 3%, 94%);
}

.marker {
    position: relative;
    top: 2pt
}

/*Color Code fixed position*/

.navbar-fixed {
    top: 0;
    z-index: 100;
    position: fixed;
    width: 100%;
 }

#colorkeybody_div {
    top: 0;
    position: relative;
}

#colorkeybanner {
     overflow: hidden;
}

#colorkey {
    border: 0;
    background-color: #efeeef;
    border-radius: 0px;
    font-weight: bold;
   
}


.ui-tooltip {
    margin: 1em 1em 0 1em;
    padding: 0.5em 1em;
    position: absolute;
    z-index: 1000;
    white-space: nowrap;
}

.adminReport .ui-tooltip, .adminInterface .ui-tooltip {
    background-color: hsl(35, 20%, 85%);
    font-family: Calibri;
    border: 2px solid white;
}

.adminReport .ui-tooltop {
    font-size: 80%;
}

.adminInterface .ui-toolip {
    font-size: 90%;
}

.widget .ui-tooltip {
/*     background-color: white; */
    font-size: inherit;
}

.ui-tooltip-content span {
    vertical-align: baseline;
}

.ui-tooltip-content .big {
    font-size: 150%;
}

.ui-tooltip-content .right {
    float: right;
    margin-left: 2em;
}

/* Thanks to http://nicolasgallagher.com/pure-css-speech-bubbles/ for idea on how to render triangle using just CSS */
.ui-tooltip-leader {
    content: "";
    position: absolute;
    bottom: -14px;
    border-width: 15px 7px 0 7px;
    border-style: solid;
    display: block;
    width: 0;
}

.adminReport.widget .ui-tooltip-leader {
/*     border-color: white transparent; */
}

.adminReport .ui-tooltip-leader, .adminInterface .ui-tooltip-leader {
    border-color: hsl(35, 20%, 85%) transparent;
}

.help .ui-tooltip-leader {
    border-color: hsl(180, 20%, 85%) transparent;
}

.adminReport .tooltip:hover {
    background-color: hsl(35, 20%, 95%);
}

.adminReport rect.tooltip:hover, .adminReport .tooltip:hover rect,
.adminReport circle.tooltip:hover, .adminReport .tooltip:hover circle
{
/*     stroke: hsl(35, 40%, 46%);
    stroke-width: 2px; */
}

.widget .tooltip:hover, .adminInterface .tooltip:hover {
/*     background-color: white; */
}

.widget rect.tooltip:hover, .widget .tooltip:hover rect, .adminInterface rect.tooltip:hover, .adminInterface .tooltip:hover rect,
.widget circle.tooltip:hover, .widget .tooltip:hover circle, .adminInterface circle.tooltip:hover, .adminInterface .tooltip:hover circle
{
    stroke: white;
    stroke-width: 0.5px;
}


/* for help tooltips */
    .ui-tooltip.help {
        background-color: hsl(180, 20%, 85%);
    }

    .example {
        font-family: monospace;
        padding: 0.2em 0.5em;
        margin: 0 0.2em;
        font-size: 120%;
        color: hsl(134, 89%, 23%);
        background-color: hsla(0, 0%, 100%, 0.5);
    }

    .example.wrong {
        color: hsl(0, 89%, 23%);
    }

    .inline-li {
        display: list-item;
        list-style-type: disc;
        margin-left: 2em;
    }
/* login
----------------------------------------------------------*/
#login {
    display: table;
    font-size: .85em;
    margin: 0;
}

#login a {
    text-decoration: none;
    padding: 0;
}

#login .avatar, #login .name,  #login .logout{
    display: table-cell;
}

#login .avatar img {
    height: 3.8em;
    display: block;
}

#login .name,  #login .logout {
    padding: 0.5em 0.8em;
    vertical-align: top;
    line-height: 1.3em;
    color:  black;
}

#login .name {
    background-color: #efeeef;
}

#login .logout {
    background-color: hsl(0, 0%, 75%);
    color: rgb(116, 0, 0);
    font-weight: bold;
}

.error {
    color: hsl(0, 70%, 50%);
    margin-top: 1em;
    margin-bottom: 1em;    
}

.error:before {
    display: inline-block;
    font-family: 'trialadmin';
    -webkit-font-smoothing: antialiased;
    font-style: normal;
    font-weight: normal;
    line-height: 1;
    padding-right: 5px;
    font-size: 130%;
    content: "\f02D";
}

.user {
    width: 130px;
    height: 150px;
    text-align: center;
    padding: 15px;
    border: 1px solid lightgrey;
}

.user > span {
    display: block;
}

.user .username {
    font-family: Consolas, monospace;
    color: hsl(176, 67%, 37%);
    line-height: 2;
}

.user .last-login {
    font-size: 80%;
    color: black;
}

.user img {
    border-radius: 40px;
}

.user .last-login img {
    border-radius: 0;
}

.last-login img {
    height: 20px;
    width;
    20px;
    vertical-align: middle;
    position: relative;
    top: -1.5px;
}
.omnisearch>.searchResult {
    font-size: 110%;
    padding: 0.3em 0.3em 0.3em 3.9em;
    position: relative
}

.omnisearch>.searchResult + .searchResult {
    border-top: 1px dotted hsl(0, 0%, 70%)
}

.omnisearch > .searchResult > .flag {
    background-color: hsl(0, 30%, 50%);
    color: white;
    position: absolute;
    left: 0.5em;
    top: 0.5em;
    font-size: smaller;
    padding: 0 0.3em;
    border-radius: 3px;
    opacity: 0.8
}

.omnisearch > .searchResult.subject > .flag:before {
    content: 'Case';
}

.omnisearch > .searchResult.subjectContact > .flag:before {
    content: 'Parent';
}

.omnisearch > .searchResult.centre > .flag:before {
    content: 'Centre';
}

.omnisearch > .searchResult.centrePerson > .flag:before {
    content: 'Persnnl';
}

.omnisearch > .searchResult.gp > .flag:before {
    content: 'GP';
}

.omnisearch > .searchResult.rAndD > .flag:before {
    content: 'R&D';
}

.searchResult .searchResult {
    font-size: 95%;
    padding: 0.1em 0 0.1em 2em;

    background-repeat: no-repeat;
    background-position: left center;
    background-size: 2.5em auto;
    background-image: url("data:image/svg+xml;charset=UTF-8,<svg xmlns='http://www.w3.org/2000/svg' viewbox='0 0 20 50' width='20' height='50'><g stroke-dasharray='1,1' stroke-width='0.5pt' stroke='hsl(0, 0%, 50%)' fill='none'><path d='M 7,0 L 7,50 M 7,25 L 15,25'></path></g></svg>");
}

.searchResult .searchResult:last-child {
    background-image: url("data:image/svg+xml;charset=UTF-8,<svg xmlns='http://www.w3.org/2000/svg' viewbox='0 0 20 50' width='20' height='50'><g stroke-dasharray='1,1' stroke-width='0.5pt' stroke='hsl(0, 0%, 50%)' fill='none'><path d='M 7,0 L 7,25 L 15,25'></path></g></svg>");
}

.searchResult .term {
    border-bottom: 1px dotted grey;
}

.parenth {
    color: hsl(200, 0%, 50%);
    /*font-style: italic;*/
}

.parenth:before {
    content: '(';
}

.parenth:after {
    content: ')';
}

.searchResult a {
    text-decoration: none;
    font-size: 85%;
    padding: 0.05em 0.3em;
    margin-left: 0.5em;
    border: 2px solid hsl(0, 0%, 65%);
    border-radius: 4px;
    color: hsl(0, 0%, 40%);
}

#omnisearch {
    padding: 7px 7px;
    border-bottom: 1px solid #DDD;
    border-top: none;
    border-left: none;
    border-right: none;
    position: relative;
    top: -4px;
    left: 20px;
    width: 30em;
    font-family:  "Segoe UI", Verdana, Helvetica, Sans-Serif;
    z-index: 120; /* in front of overlay */
    background: url(/Icons/Images/SVG/omnisearch.svg) no-repeat 3px center;
    background-size: 1.8em 1.8em;
    padding-left: 2.5em;
    background-color: white;
}

.searchResult.highlighted {
    background-color: hsl(60, 100%, 90%)
}

.searchResult.highlighted > a {
    background-color: white;
}