﻿/*Microsoft viewport width Fix*/
@-webkit-viewport {
    width: device-width;
}

@-moz-viewport {
    width: device-width;
}

@-ms-viewport {
    width: device-width;
}

@-o-viewport {
    width: device-width;
}

@viewport {
    width: device-width;
}

/*
Generally the sizes: xs, sm, md, lg 
are styled for these device widths
Keep this in mind when setting styles
*/
@media (max-width: 767px) {
    /*xs*/
}

@media (min-width: 768px) and (max-width: 991px) {
    /*sm */
}

@media (min-width: 992px) and (max-width: 1199px) {
    /*md*/
}

@media (min-width: 1200px) {
    /*lg*/
}

@media print {

    .NotprintableArea * {
        display: none;
    }

    .printableArea {
        display: block !important;
    }
}

* {
    outline: none;
}

.modalBlockout {
    background: rgb(48,66,97);
}

.modalBlockout {
    background: rgb(48,66,97);
}

.ftr-fore-blue {
    color: rgb(0,56,118);
}

.ftr-back-blue {
    background-color: rgb(0,56,118);
}

.ftr-fore-orange {
    color: rgb(231,129,29);
}

.ftr-back-orange {
    background-color: rgb(231,129,29);
}

body {
    font-size: 12px;
    font-family: Arial, Helvetica, sans-serif,"Segoe UI";
    margin: 0px 0px 75px 0px;
    padding: 0px;
    width: 100%;
    height: 100%;
    min-width: 100%;
    min-height: 100%;
    max-width: 100%;
    max-height: 100%;
    overflow: auto;
    line-height: 1.5;
}

.text_welcome-super {
    font-size: 85%;
    top: -0.65em;
}

div [class*="col-"] {
    padding: 1px;
}

input[type="radio"][disabled],
input[type="checkbox"][disabled],
input[type="text"][disabled],
select[disabled],
textarea[disabled] {
    color: #595959;
    cursor: not-allowed;
    background-color: rgb(230,230,230);
}

input[type="text"] {
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    border: 1px rgb(230,230,230) solid !important;
}

.nobox {
    box-shadow: none !important;
}

.btn-group > .btn,
.btn {
    font-size: 12px;
    padding: 3px;
}

.staffImage {
    border: none;
    border-radius: 100%;
    width: 108px !important;
    height: 108px;
    overflow: hidden;
    margin-top: 3px;
    /*-webkit-box-shadow: 0px 0px 12px 5px rgba(231, 129, 29, 1);
    -moz-box-shadow: 0px 0px 12px 5px rgba(231, 129, 29, 1);
    -o-box-shadow: 0px 0px 12px 5px rgba(231, 129, 29, 1);
    box-shadow: 0px 0px 12px 5px rgba(231, 129, 29, 1);*/
}

    .staffImage img {
        height: 110px;
        max-height: 110px;
        min-height: 110px;
        width: 110px;
        max-width: 110px;
        min-width: 110px;
    }


.paged-carousel {
}

.navbar .btn-group {
    margin-top: 5px;
}

.banner-header-image {
    border-top-width: 0px;
    border-right-width: 0px;
    border-bottom-width: 0px;
    border-left-width: 0px;
    max-height: 40px;
    margin-top: 3px;
}

.custom-banner-header-image {
    border-top-width: 0px;
    border-right-width: 0px;
    border-bottom-width: 0px;
    border-left-width: 0px;
    height: 100%;
    /* width:100%; */
    padding: 0px;
    display: block;
    margin: auto;
}

.custom-footer-image {
    border-top-width: 0px;
    border-right-width: 0px;
    border-bottom-width: 0px;
    border-left-width: 0px;
    height: 65px;
    /* width:100%; */
    padding: 0px;
    display: block;
    margin: auto;
}

.header-north,
.banner-north {
    height: 100%;
    padding: 0px;
}

.footer-south {
    height: 100%;
    padding: 0px;
}

.footer-south-customise {
    max-height: 65px;
    height: 65px;
}

.header-east {
    /*background-color:rgb(134, 181, 217);*/
    text-align: center;
    padding: 0px !important;
}

    .header-east [class*="col-"] {
        padding: 0px 0px;
    }

/*.header-east [class*="col-"] label {
    font-family: "Comic Sans MS";
}*/

.header-east-Text {
    font-family: "Comic Sans MS";
}

.header-east-Text-iChris {
    font-family: Segoe UI !important;
    text-transform: none !important;
    color: #365f91 !important;
    font-weight: bold !important;
}

.TextGeneric-iChris {
    font-family: "Helvetica Neue,Helvetica,Arial,sans-serif !important";
    text-transform: none !important;
    color: white !important;
}


@media (min-width: 1200px) {
    /*lg*/
    .header-east [class*="col-"] label {
        font-size: 16px;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    /*md*/
    .header-east [class*="col-"] label {
        font-size: 14px;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    /*sm*/
    .header-east [class*="col-"] label {
        font-size: 12px;
    }
}

@media (max-width: 767px) {
    /*xs*/
    .header-east [class*="col-"] label {
        font-size: 10px;
    }
}

.header-east [class*="name"] label {
    font-size: 17px;
    font-weight: bold;
    /*font-family: "Comic Sans MS";*/
    color: rgba(0,56,118,1); /*darkblue;*/
}

.header-east [class*="staffNumber"] label {
    font-size: 16px;
    font-weight: bold;
    /*font-family: "Comic Sans MS";*/
    color: rgba(0,56,118,1); /*darkblue;*/
}

.header-east [class*="position"] label {
    font-size: 15px;
    font-weight: bold;
    /*font-family: "Comic Sans MS";*/
    padding-bottom: 10px;
}

.header-east [class*="date-joined"] label, .header-east [class*="manager"] label {
    font-size: 14px;
    padding-bottom: 5px 0px;
}

.header-east [class*="date-joined"] > div:first-child, .header-east [class*="manager"] > div:first-child {
    font-weight: bold;
}


.header-east .valueText {
    margin-left: 1px !important;
    text-align: left;
    /*font-family: "Comic Sans MS";*/
    font-size: 16px;
}

.form-title {
    font-size: 18px;
    font-weight: bold;
}

.form-description span {
    font-size: 10.5px;
    font-weight: bold;
}

.form-control {
    font-size: 12px !important;
}

label.control-label, label.checkbox-control-label {
    text-align: right !important;
    max-width: 110px !important;
    min-width: 110px !important;
    line-height: 1.5;
    font-size: 12px;
}
/*label.control-label {
    margin-top:4px !important;
}*/
.checkbox, .checkbox input[type='checkbox'], .checkbox-inline, .checkbox-inline input[type='checkbox'], .radio, .radio input[type='radio'], .radio-inline, .radio-inline input[type='radio'] {
    padding-top: 1px !important;
    padding-left: 1px;
    margin-left: 0px;
    line-height: 1.5;
}

input[type='text'].datepicker, input[type='text'].select-box, input[type='text'].text-box {
    max-width: 200px;
}

.leftspan {
    margin-left: 0px !important;
}

section.main {
    margin-top: 5px !important;
    max-width: 100%;
    width: 100%;
}

section.main.container-fluid {
    z-index: 1;
    height: auto !important;
}

.page-splash-message {
    margin-top: 1%;
    color: rgb(231,129,29); /*#DC6D1E; is what the spec says to use on web*/ /*rgb(231,129,29) is also stated in the spec*/ /*#E7811D; is a conversion of rgb(231,129,29)*/
}

h1.welcome {
    color: blue;
    margin-left: 0px;
    margin-right: 0px;
}

img.welcome {
    margin-left: 0px;
    margin-right: 0px;
    min-width: 25%;
    min-height: 25%;
}

.form-signin .form-signin-heading {
    margin-bottom: 10px;
}

.form-signin input[type='text'], .form-signin input[type='password'] {
    width: 95%;
}

.btn-login {
    width: 65%;
    min-width: 65%;
}

.form-horizontal .form-group, .well {
    margin: 0px;
}

    .form-horizontal .form-group [class*="col-"] {
        padding: 2px 5px 0px 0px;
    }

.form-control {
    height: 25px;
    padding: 1px 5px;
}

.logo-img {
    margin: auto;
    padding: 0;
    display: block;
}

.input-micro {
    width: 100%;
    height: 95%;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
}

.cursor-type {
    cursor: pointer;
}

.change-password {
    font-size: 12px;
    text-decoration: underline;
    color: black;
}

.cursor-type a:hover, .cursor-type a:visited, .cursor-type a:link, .cursor-type a:focus {
    color: black !important;
}

.validation-summary {
    max-width: 400px;
    padding: 0px 10px;
    margin: 0 auto 20px;
    color: red;
    border: none;
    text-align: left;
}

.view-grid-detail {
    min-height: 66px !important; /*GJF:Board decison*/
}

    .view-grid-detail .col-md-6 input[type='text'], .view-grid-detail label {
        font-size: 12px;
        font-weight: bold;
    }

.view-title, .view-description, .view-toolbar, .view-carousel, .view-grid-detail {
    padding: 2px 1px;
    margin: 1px auto;
}


.view-title {
    color: white;
    background-color: rgb(25, 77, 123);
    *background-color: rgb(25, 77, 123);
}

.view-title-iChris {
    background-color: #365f91;
    *background-color: #365f91;
}

.view-panel-group-detail {
    min-height: 30px;
    font-size: 12px;
    padding: 2px 1px;
    margin: 1px auto;
}

.darker-blue {
    color: rgb(25, 77, 123);
}

.toolbar {
    float: right;
    height: 100%;
}

.toolbar-background {
    background-color: rgb(25, 77, 123);
}

.toolbar-background-iChris {
    background-color: #365f91;
}

.toolbar .btn {
    text-transform: capitalize;
}

.toolbarButton {
    height: 40px;
    max-height: 40px;
    min-height: 40px;
    width: 40px;
    max-width: 40px;
    min-width: 40px;
    text-transform: capitalize;
    background-color: rgb(25, 77, 123);
    background-image: none;
    padding: 4px 0px !important;
    cursor: pointer;
}

.toolbarButton-iChris {
    background-color: #365f91 !important;
}

.toolbarButton span {
    width: 100%;
    float: left;
    color: white;
    font-weight: normal;
    text-shadow: none;
}

.toolbar-icon {
    height: 20px;
    width: 20px;
    border: none;
}

.toolbarButton span {
    font-size: 8px;
    margin-top: 2px;
}

.toolbarButton:active,
.toolbarButton.active {
    cursor: auto;
}

/* JAY BUG #193 Remove focus and active property for toolbar buttons  
.toolbarButton:hover,
.toolbarButton:focus,
.toolbarButton:active,
.toolbarButton.active {*/
.toolbarButton:hover {
    background-color: rgba(25, 77, 123,.75);
    opacity: 0.75;
    filter: alpha(opacity=50); /* For IE8 and earlier */
    -webkit-border: 2px inset;
    -moz-border: 2px inset;
    -o-border: 2px inset;
    border: 2px inset;
    -webkit-border-color: rgba(255, 255, 255, 0.75);
    -moz-border-color: rgba(255, 255, 255, 0.75);
    -o-border-color: rgba(255, 255, 255, 0.75);
    border-color: rgba(255, 255, 255, 0.75);
}

.toolbarButton.disabled,
.toolbarButton[disabled],
.toolbarButton.disabled:hover,
.toolbarButton[disabled]:hover {
    background-color: rgba(25, 77, 123,.25);
    opacity: 0.25;
    filter: alpha(opacity=25); /* For IE8 and earlier */
    -webkit-border-style: none;
    -moz-border-style: none;
    -o-border-style: none;
    border-style: none;
}

.view-description {
    background-color: rgba(217, 237, 247,1.0);
    color: #3a87ad;
    padding: 2px 1px;
    margin: 1px auto;
}

/*region: override bootstrap row styles*/

.row [class*='col-md-'] {
    min-height: 20px;
}

.collapseSpan {
    min-height: 1px !important;
}

/* end region: override bootstrap row styles*/
/* region: override bootstrap table styles*/
/*table header*/
.table thead tr th {
    background-color: rgba(0, 129, 194,1.0);
    color: white;
    font-size: 18px !important;
    padding: 5px 5px !important;
}

.tableHeaderIChris {
    background-color: #737373 !important;
}

.tableAlternateRowIChris {
    background-color: lightgray !Important;
}

/*row alternative stripe */
.table-striped tbody > tr:nth-child(even) > td {
    background-color: rgba(217, 237, 247,1.0);
}

.tableHoverIChris {
    background-color: purple !important;
}

/*row hover*/
.table tbody tr:hover td {
    background-color: rgba(121, 173, 208, 1.0);
}

table tbody tr td {
    font-size: 14px !important;
    padding: 5px 5px !important;
}

/* end region: override bootstrap table styles*/
/* pagedGrid styles*/
.pagedgrid {
    border: 1px solid rgba(217, 237, 247,1.0);
    margin-left: auto;
    margin-right: auto;
}

    .pagedgrid .tablegrid {
        min-height: 170px;
    }

.pagination, .tablegrid table {
    margin-top: 1px;
    margin-bottom: 1px;
    font-size: 12px;
    line-height: 12px;
}

/*.tablegrid table th {
        font-weight: bolder;
    }*/

.table-responsive .pagedgrid .tablegrid table tr .table-cell, .table-responsive .pagedgrid .tablegrid table tr th.table-cell, .table-responsive .pagedgrid .tablegrid table tr td.table-cell {
    padding: 1px 5px;
    font-size: 12px;
    line-height: 15px;
}

.tablegrid table tr.active-row td {
    background-color: rgba(255, 238, 194,1.0);
    *background-color: rgba(255, 238, 194,1.0);
}

.paging-parent {
    padding-left: 1px;
    padding-right: 1px;
}

.form-group.form-group-paging {
    padding-left: 0px;
    padding-right: 0px;
    margin-left: 2px;
    margin-right: 0px;
}

.paging-button-div {
    padding-left: 1px;
    padding-right: 5px;
}

.paging-label-div {
    padding-left: 5px;
    padding-right: 1px;
}

paging-button-div > ul {
    padding-right: 5px;
}

.pagination-sm .btn-paging {
    margin-left: -3px;
}

.btn-paging.active {
    color: rgba(0, 136, 204, 0.75);
}

.btn-paging {
    color: #0088cc;
    min-width: 25px;
    max-height: 25px;
    line-height: 11px;
    vertical-align: central;
}

    .btn-paging:hover,
    .btn-paging:focus,
    .btn-paging:active,
    .btn-paging.active,
    .btn-paging.disabled,
    .btn-paging[disabled] {
        color: #0088cc;
    }

.form-group > label.paging-label {
    text-align: right;
    padding-top: 6px !important;
}

/* end of pagedGrid styles*/

/* Region: Overwrite bootstrap panel-group style */
.panel {
    margin-bottom: 0px;
}

    .panel.panel-default, panel-collapse {
        background-color: white;
    }

.panel-group {
    border: 1px solid #e5e5e5;
    border-color: silver;
    border-radius: inherit;
}

.panel.panel-default {
    border: none;
}


.panel-heading {
    background-color: #86b5d9 !important;
    background-image: none !important;
    -webkit-border: solid 1px white;
    -moz-border: solid 1px white;
    -o-border: solid 1px white;
    border: solid 1px white;
    cursor: pointer;
    padding: 2px 4px;
    max-height: 80px;
    overflow-y: auto;
}

.panel-heading-iChris {
    background-color: #365f91 !important;
    border-top-right-radius: 5px !important;
    border-top-left-radius: 5px !important;
}

.chevron-toggleable {
    font-family: 'Glyphicons Halflings'; /* essential for enabling glyphicon */
    /*content: "\e113";     adjust as needed, taken from bootstrap.css */
    float: right; /* adjust as needed */
    color: rgb(0,99,153); /* adjust as needed */
}

.panel-body {
    background-color: rgb(202, 218, 226);
    padding: 1px;
}

.panel-body-iChris {
    background-color: #e0e0e0 !important;
}

.panel-body label {
    font-weight: bolder;
    font-size: 11px;
}


.HeaderLine {
    color: rgb(0,99,153);
    font-size: 14px;
    font-weight: bold;
    font-family: Arial, Helvetica, sans-serif,"Segoe UI";
    word-wrap: break-word;
}

.HeaderLine-iChris {
    color: white !important;
    font-size: 13px !important;
    font-weight: bold;
    font-family: "Helvetica Neue",Helvetica,Arial,sans-serif !important;
    word-wrap: break-word;
}


.panel-group a:hover, .panel-group a:focus {
    color: rgba(255,255,255,0.5);
}

.panel-group span:hover, .panel-group span:focus {
    color: rgba(255,255,255,0.5);
}

.panel-group a:hover, .panel-group a:visited, .panel-group a:link, .panel-group a:focus {
    text-decoration: none;
}

.panel-group-well {
    padding: 10px;
    padding-bottom: 1px;
    min-height: 100px;
}

.panel-group .row .col-md-6 {
    margin-left: 1px;
    width: 49.9%;
}
/* End Region: Overwrite bootstrap panel-group style */

/* overwriting .item for carousel*/
.item {
    color: none;
    background: border-box;
    min-height: 25px;
    line-height: 25px; /* Align the text vertically center. */
    font-size: 18px;
    text-align: center;
    font-family: "trebuchet ms", sans-serif;
}


.bs-example {
    margin: 20px;
}

.btn-rounded {
    color: #ffffff;
    background: url('images/topNormal.png') repeat-x, url('images/bottomNormal.png') repeat;
    background-position: 0 0,center;
    background-size: 15px 15px,15px 15px;
    border-width: 0px;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    border-radius: 30px;
    min-width: 140px;
    text-transform: none;
}

    .btn-rounded:hover,
    .btn-rounded:focus,
    .btn-rounded:active,
    .btn-rounded.active,
    .btn-rounded.disabled,
    .btn-rounded[disabled] {
        color: #ffffff;
        background-color: #ffffff;
        *background-color: #ffffff;
    }

.border-white {
    border-width: 5px;
    border-top-color: #efefef;
    border-right-color: rgba(0,0,0,0.25);
    border-bottom-color: rgba(0,0,0,0.5);
    border-left-color: #dfdfdf;
}

.carousel {
    margin-top: 1px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
}

    .carousel .left {
        background: url('images/Backbutton-blue-transparent.png') no-repeat;
    }

        .carousel .left.active {
            opacity: 1.0;
        }

    .carousel .right {
        background: url('images/Forwardbutton-blue-transparent.png') no-repeat;
    }

    .carousel .left, .carousel .right {
        border: none;
        max-width: 25px;
        min-width: 25px;
        width: 25px;
        max-height: 25px;
        min-height: 25px;
        height: 25px;
        background-size: 25px 25px;
    }

        .carousel .right.active {
            opacity: 1.0;
        }

.gfImageSize {
    max-width: 100px;
    width: 100px;
    max-height: 100px;
    height: 100px;
}

.buttonrounded {
    display: inline-block;
    min-width: 105px;
    min-height: 40px !important;
    text-transform: capitalize;
    background-color: hsl(212, 49%, 29%);
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#6393c9", endColorstr="#25476e");
    background-image: -khtml-gradient(linear, left top, left bottom, from(#6393c9), to(#25476e));
    background-image: -moz-linear-gradient(top, #6393c9, #25476e);
    background-image: -ms-linear-gradient(top, #6393c9, #25476e);
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #6393c9), color-stop(100%, #25476e));
    background-image: -webkit-linear-gradient(top, #6393c9, #25476e);
    background-image: -o-linear-gradient(top, #6393c9, #25476e);
    background-image: linear-gradient(#6393c9, #25476e);
    border-color: #25476e #25476e hsl(212, 49%, 21.5%);
    border-color: #25476e #25476e hsl(212, 49%, 21.5%);
    color: #fff !important;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.49);
    -webkit-font-smoothing: antialiased;
}

.btn-primary:hover, .btn-primary:active, .btn-primary.active, .btn-primary.disabled, .btn-primary[disabled] {
    color: white;
    background-color: rgb(25, 77, 123);
    *background-color: rgb(25, 77, 123);
    background-color: rgb(25, 77, 123);
    *background-color: rgb(25, 77, 123);
}

.btn-primary:hover,
.btn-primary:focus {
    background-position: 0 -45px;
}


.vertical-center {
    height: 100%;
    display: table-cell;
    vertical-align: middle;
}

.center {
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 75%;
}

.centerOnXandY {
    display: block;
    margin-left: auto;
    margin-right: auto;
    line-height: 430px;
    width: 75%;
}

.well {
    margin-top: 1px;
    padding: 10px;
}


.navbar-fixed-top {
    background-color: #fafafa;
    background-image: -moz-linear-gradient(top, #ffffff, #f2f2f2);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#f2f2f2));
    background-image: -webkit-linear-gradient(top, #ffffff, #f2f2f2);
    background-image: -o-linear-gradient(top, #ffffff, #f2f2f2);
    background-image: linear-gradient(to bottom, #ffffff, #f2f2f2);
    background-repeat: repeat-x;
    border: none;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#fff2f2f2', GradientType=0);
    *zoom: 1;
    -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.065);
    -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.065);
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.065);
}

.navbar-fixed-bottom {
    background-color: #fafafa;
    background-image: -moz-linear-gradient(top, #ffffff, #f2f2f2);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#f2f2f2));
    background-image: -webkit-linear-gradient(top, #ffffff, #f2f2f2);
    background-image: -o-linear-gradient(top, #ffffff, #f2f2f2);
    background-image: linear-gradient(to bottom, #ffffff, #f2f2f2);
    background-repeat: repeat-x;
    border: none;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#fff2f2f2', GradientType=0);
    *zoom: 1;
    -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.065);
    -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.065);
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.065);
}

.navbar-fixed-bottom-iChris {
    background-color: #365f91 !important;
    background-image: none !important;
}

.footer
.footer-text {
    max-height: 118px;
    min-height: 1px;
    text-transform: none;
    line-height: 10px;
}

.footer-text-iChris {
    color: white !important;
}

.footer {
    padding: 11.35px !important;
}

.navbar-fixed-bottom-customise {
    max-height: 118px;
    padding: 0 0 11.35px 0 !important;
}

.navbar-fixed-bottom {
    max-height: 59px;
    padding: 0px !important;
}

.navbar-fixed-bottom-fixed {
    max-height: 59px;
    padding: 6px 11.35px 11.35px 11.35px !important;
}

.footer span, footer a {
    float: none;
    font-size: 10px;
}

.copyright {
    margin: 0px;
    padding: 0px;
    min-height: 10px;
    max-height: 10px;
    line-height: 10px;
}

.copyright-iChris {
    color: white !important;
}

.footerLogo {
    float: right;
}

.footerLogo,
.banner-footer-image {
    border-top-width: 0px;
    border-right-width: 0px;
    border-bottom-width: 0px;
    border-left-width: 0px;
    padding: 0px;
    max-height: 55px;
    margin-top: -10px;
}

.staff-select {
    min-width: 400px;
}

.modal-body {
    padding: 10px;
}

/* begin styling for staff tree */
.treeParent {
    overflow: auto;
    max-width: 400px;
    max-height: 400px;
}

.tree {
    min-width: 100%;
    max-width: 1000px;
    min-height: 250px;
    max-height: 250px;
    overflow: auto;
    padding: 2px;
    margin-bottom: 1px;
    margin-left: auto;
    margin-right: auto;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
    -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
    font-size: 14px;
    cursor: pointer;
}

.tree-item-group {
    min-width: 500px;
}

.tree ul {
    padding-left: 2px;
}

.tree li {
    list-style-type: none;
    margin: 0;
    padding: 1px 1px 0 15px;
    position: relative;
}

    .tree li::before, .tree li::after {
        content: '';
        left: 8px;
        position: absolute;
        right: auto;
        height: 100%;
    }

    .tree li::before {
        border-left: 1px solid #999;
        height: 100%;
        top: -5px;
        width: 1px;
    }

    .tree li::after {
        border-top: 1px solid #999;
        height: 20px;
        top: 10px;
        width: 10px;
    }

.tree li {
    list-style-type: none;
    margin: 0;
    padding: 1px 1px 0 15px;
    position: relative;
}

    .tree li::before, .tree li::after {
        content: '';
        left: 8px;
        position: absolute;
        right: auto;
        height: 100%;
    }

    .tree li::before {
        border-left: 1px solid #999;
        height: 100%;
        top: -5px;
        width: 1px;
    }

    .tree li::after {
        border-top: 1px solid #999;
        height: 20px;
        top: 10px;
        width: 10px;
    }

    .tree li span {
        display: inline-block;
        padding: 1px 2px;
        text-decoration: none;
    }

    .tree li.parent_li > span {
        cursor: pointer;
    }

.tree > ul > li::before, .tree > ul > li::after {
    border: 0;
}

.tree li:last-child::before {
    height: 15px;
}

.tree li.parent_li > span:hover, .tree li.parent_li > span:hover + ul li span {
    background: #eee;
    color: #000;
}

.tree:first-child[ul] {
    padding-left: 2px;
}

.tree li span.selected-item {
    background-color: rgba(255, 238, 194,1.0);
    *background-color: rgba(255, 238, 194,1.0);
}


.addReviewBody {
    overflow-x: hidden;
    min-height: 100px;
}

.addReviewModal {
    max-width: 360px;
    width: 360px;
    min-width: 360px;
}

.addReviewBody .form-horizontal > .form-group > [class*="col-"] {
    max-width: 55%;
}


.addReviewBody [class*="datepicker"],
input[type='text'].datepicker {
    min-width: 140px !important;
    width: 140px !important;
    max-width: 140px !important;
}

.addReviewModelError {
    max-width: 400px;
    padding: 0px 10px;
    color: red;
    border: none;
    text-align: left;
    margin-left: 97px;
}

.gridLayoutinPanel [class*="well"] {
    background-color: lightblue !important;
}

/* end of style for staff tree*/
.rotateCW90 {
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    transform: rotate(90deg);
}

.rotateAC90 {
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
    transform: rotate(-90deg);
}

.tooltip.right.in {
    margin-right: 15px !important;
}

.tooltip-inner {
    min-width: 125px;
    font-family: Arial, Helvetica, sans-serif,"Segoe UI";
    text-transform: none;
    background-color: rgb(112,146,190);
    color: white;
    text-align: left !important;
    white-space: pre-wrap;
}

div.tooltip-inner {
    width: auto;
    max-width: 600px; /*Adeel Ijaz - tool tip width fix - 24 October 2014*/
}

.ui-layout-pane-north {
    padding: 0px !important;
    border: none !important;
}

.ui-layout-pane-south {
    padding: 0px !important;
    border: none !important;
}

.ui-layout-pane-west-iChris {
    background-color: white !important;
}

.ui-layout-pane-west,
.ui-layout-pane-center,
.ui-layout-pane-center .main.container-fluid,
.ui-layout-pane-east .staffHeader.container-fluid {
    padding: 1px !important;
}

.ui-layout-pane-east {
    padding: 0px !important;
    /*background-color:rgb(134, 181, 217) !important;*/
    background-image: -webkit-gradient( linear, left top, left bottom, color-stop(0.15, rgb(134, 183, 217)), color-stop(0.77, rgb(26, 77, 122)) ) !important;
    background-image: -o-linear-gradient(bottom, rgb(134, 183, 217) 15%, rgb(26, 77, 122) 77%) !important;
    background-image: -moz-linear-gradient(bottom, rgb(134, 183, 217) 15%, rgb(26, 77, 122) 77%) !important;
    background-image: -webkit-linear-gradient(bottom, rgb(134, 183, 217) 15%, rgb(26, 77, 122) 77%) !important;
    background-image: -ms-linear-gradient(bottom, rgb(134, 183, 217) 15%, rgb(26, 77, 122) 77%) !important;
    background-image: linear-gradient(to bottom, rgb(134, 183, 217) 15%, rgb(26, 77, 122) 77%) !important;
}

.ui-layout-pane-east-iChris {
    background-image: none !important;
    background-color: #365f91 !important;
}

.ui-layout-north-iChris {
    background-color: #365f91 !important;
    height: 50px !important;
    border-bottom-color: rgb(231,129,29) !important;
    border-bottom-width: 3px !important;
    border-bottom-style: solid !important;
}


.ui-layout-south-iChris {
    background-color: #365f91 !important;
    border-top-color: rgb(231,129,29) !important;
    border-top-width: 3px !important;
    border-top-style: solid !important
}

.ui-layout-west-iChris {
    background-color: white !important;
}

.ui-layout-center-iChris {
    top: 50px !important;
}

.ui-layout-west-iChris {
    top: 50px !important;
}

.footer-south-iChris {
    background-color: #365f91 !important;
}

footer-south-customise-iChris {
    background-color: #365f91 !important;
}

.footer-iChris {
    background-color: #365f91 !important;
}

.nav-list.container-fluid, .nav-option-menu-list.container-fluid {
    padding: 2px !important;
}

.btn-group.navbar-custom-main .btn, .btn-group.navbar-custom-menu .btn {
    -webkit-border-radius: 4px !important;
    -moz-border-radius: 4px !important;
    -ms-border-radius: 4px !important;
    -o-border-radius: 4px !important;
    border-radius: 4px !important;
    margin: 1px auto !important;
    max-width: 100% !important;
    min-width: 100% !important;
    white-space: normal;
}

.btn-group.navbar-custom-main .btn {
    min-height: 40px !important;
    overflow-x: hidden;
}

.btn-group.navbar-custom-menu .btn {
    min-height: 35px !important;
    font-family: Arial, Helvetica, sans-serif,"Segoe UI";
    font-size: 10px;
    padding: 1px 1px !important;
}

.navbar-content-center {
    padding-left: 15px;
    padding-right: 15px;
}
.nav-list, .nav-option-menu-list {
    overflow-y: auto;
    margin-top: 3px;
}

.nav-list {
    max-height: 50%;
    min-height: 30%;
}

.nav-option-menu-list {
    max-height: 85%;
    min-height: 30%;
    white-space: normal;
}

.nav-btn > span {
    /*centers the graph*/
    position: absolute;
    top: 5px;
    bottom: 5px;
    left: 0;
    right: 0;
    width: 95%;
    height: 45%;
    margin: auto;
    /*centers the graph*/
}

.text-center {
    text-align: center;
}

.progress-parent {
    /*centers the progress */
    position: absolute;
    top: 90px;
    bottom: 90px;
    left: 50%;
    right: 50%;
    width: 50px;
    height: 50px;
    margin: auto;
    /*end centers the progress*/
    min-height: 50px;
    max-height: 50px;
    min-width: 50px;
    max-width: 50px;
    z-index: 105000;
    /*create peephole*/
    border: none;
    border-radius: 100%;
    overflow: hidden;
}

.progress-parentKPG {
    /*centers the progress */
    position: absolute;
    top: 90px;
    bottom: 90px;
    /*left: 50%;*/
    right: 50%;
    width: 50px;
    height: 50px;
    margin: auto;
    /*end centers the progress*/
    min-height: 50px;
    max-height: 50px;
    min-width: 50px;
    max-width: 50px;
    z-index: 105000;
    /*create peephole*/
    border: none;
    border-radius: 100%;
    overflow: hidden;
}


.progress-circle {
    background: url('images/animated-progress.gif') no-repeat;
    background-size: 50px 50px;
    border-width: 0px;
    min-width: 55px;
    min-height: 55px;
    max-width: 55px;
    max-height: 55px;
    width: 55px;
    height: 55px;
}

.message-box-grid {
    min-height: 180px;
    max-height: 180px;
    min-width: 320px;
    overflow-y: auto;
}

.selected {
    background-color: yellow;
}

thead tr {
    border: 1px solid black;
    background: lightgray;
}

tbody tr {
    border: 1px solid black;
    cursor: pointer;
}

.lookupBox {
    min-width: 700px !important;
    min-width: 700px !important;
    max-width: 700px !important;
}

.lookupText {
    /* BUG 486 */
    width: 60px;
    min-width: 60px;
    max-width: 60px;
    max-height: 24px;
    min-height: 24px;
    height: 24px;
    font-size: 12px;
}


.lookupButton {
    width: 18px;
    min-width: 18px;
    max-width: 18px;
    line-height: normal !important;
    max-height: 24px;
    min-height: 24px;
    height: 24px;
}

.lookupbody {
    max-height: 320px;
    /*overflow-y: auto;
    overflow-x: auto;*/
}

.lookup {
    vertical-align: top;
}

.pagedgridlookup {
    max-height: 500px !important;
    min-height: inherit !important;
}

.pagedgrid .tablegrid .table .table-cell {
    white-space: pre-wrap;
}

.tablegrid {
    overflow-x: auto;
}

table.table-condensed {
    border-collapse: separate !important;
}

.messageBox {
    min-width: 350px !important;
    max-width: 500px !important;
}

    .messageBox.login-modal, .messageBox.reLoginModal {
        min-width: 300px !important;
        max-width: 300px !important;
    }

    .messageBox.addReviewModal {
        min-width: 600px !important;
        max-width: 600px !important;
    }

.notes-view {
    min-width: 100px;
    /*min-height:250px;*/
    height: 100%;
    display: table-cell;
}

.notes-view, .notes-view-header {
    border: 1px solid white;
}

.notes-view-header {
    max-height: 20px;
    min-height: 20px;
    color: rgba(255, 238, 194,1.0);
}

.notes-header {
    max-height: 16px;
}

.notes-view-header-btn, .note-header-btn, .notes-view-header, .note-header {
    background-image: linear-gradient(rgb(99, 147, 201), rgb(37, 71, 110));
}

.notes-view-header-btn, .notes-view-header-close {
    max-height: 16px;
    max-width: 16px;
    height: 16px;
    width: 16px;
    border: none;
    padding: 0px;
}

.notes-view-header-close {
    font-size: 10px;
    font-weight: bolder;
}

.notes-view-header-btn {
    margin-right: 3px;
    font-weight: bolder;
}

.notes-view-header-btn-icon {
    margin-top: -3px;
    max-height: 14px;
    height: 14px;
    max-width: 14px;
    width: 14px;
    border: none;
}

.note-container {
    margin-top: 3px;
    margin-left: 1px;
    min-width: 105px;
    background-color: rgba(255, 238, 194,1.0);
    overflow-y: visible;
}

.note-header, .note-body {
    border: 1px solid rgb(0,56,118);
}

.note-header {
    max-height: 15px;
    min-height: 15px;
}

.notes-view-header {
    max-height: 16px;
    font-size: 12px;
}

.note-header-btn {
    max-height: 14px;
    max-width: 14px;
    height: 14px;
    width: 14px;
    border: none;
    padding: 0px;
    margin-top: -1px;
    margin-right: 3px;
    font-weight: bolder;
    /*color:rgba(25, 77, 123,1) !important;
    background-color:rgba(25, 77, 123,1) !important;*/
}

.note-header-btn-icon {
    margin-top: -5px;
    max-height: 12px;
    height: 12px;
    max-width: 12px;
    width: 12px;
    border: none;
}

.note-body {
    min-height: 55px;
    font-family: "Comic Sans MS", Arial, Helvetica, sans-serif,"Segoe UI";
}

.note-edit-area {
    border: none;
    min-height: 50px;
    min-width: 100%;
    height: 100%;
    width: 100%;
    font-size: 10px;
    background-color: rgba(255, 238, 194,1.0);
}

.note-footer {
    margin-bottom: 0;
    font-size: 7px;
    padding-top: 0px;
    padding-bottom: 0px;
    border-right: 1px solid rgb(0,56,118);
    border-bottom: 1px solid rgb(0,56,118);
    border-left: 1px solid rgb(0,56,118);
}

    .note-footer > hr {
        margin-top: 0px;
        margin-bottom: 0px;
        width: 100%;
    }

.note-footer-checkbox {
    height: 8px;
    margin-right: 2px !important;
}

.note-footer-label {
    vertical-align: top;
}

.attach-form {
    min-width: 75%;
}


ul.attach-list {
    list-style-type: none;
    padding: 0px;
    margin: 0px;
}

    ul.attach-list li {
        background-image: none;
        background-repeat: no-repeat;
        background-position: 0px 5px;
        padding: 0px 0px 0px 10px !important;
    }

.attach-btn-parent {
    max-height: 15px;
    margin-bottom: 4px;
}

.attach-btn {
    max-height: 14px;
    height: 14px;
    border: none;
    padding: 0px;
    margin-top: -1px;
    text-transform: capitalize !important;
    text-decoration: underline
    /*color:rgba(25, 77, 123,1) !important;
    background-color:rgba(25, 77, 123,1) !important;*/
}

.attach-btn-icon {
    margin-top: -5px;
    max-height: 12px;
    height: 12px;
    max-width: 12px;
    width: 12px;
    border: none;
}

.helpbox {
    max-width: 20px;
    min-width: 20px;
    width: 20px;
    vertical-align: top !important;
}

.mainHelp {
    line-height: normal !important;
    font-size: 12px !important;
}

.helpImageLookup {
    margin-top: -3px;
}

.helpImageCheckbox {
    margin-top: -5px;
}

div.tooltip::first-letter,
.tooltip-inner::first-letter {
    text-transform: uppercase !important;
}

.tooltip {
    position: fixed;
}

.mandatory {
    color: red;
    text-align: center;
    vertical-align: top;
    max-width: 5px !important;
    min-width: 5px !important;
    width: 5px !important;
}

.lookupSet {
    max-width: 150px;
}

.reportKpg {
    width: 600px !important;
    min-width: 600px !important;
    max-width: 600px !important;
    min-height: 100px !important;
    max-height: 600px !important;
    margin-top: -250px !important;
    margin-left: -300px !important;
    /*overflow-y:auto;
    overflow-x:auto;*/
}

.gfImageKPG {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.kpgCancelButton {
    min-width: 80px !important;
    width: 80px !important;
    max-width: 80px !important;
}

.timeBox {
    min-width: 70px !important;
    max-width: 70px !important;
    width: 70px !important;
    text-align: center;
    font-size: 12px !important;
}

.fileupload {
    width: 100%;
}

.timersymbol {
    font-size: 13pt;
    font-weight: bold;
}

.modal-dialog {
    position: absolute;
    margin: auto;
    /*centers the dialog horizontally */
    left: 10px;
    right: 10px;
    width: 50%;
    min-width: 350px;
    max-width: 500px;
    /*centers the dialog vertically*/
    top: 10px;
    bottom: 10px;
    height: 50%;
    min-height: 350px;
    max-height: 500px;
}

.messageBox.imagePreviewBox {
    position: relative;
    margin: auto;
    /*centers the dialog horizontally */
    left: 10px;
    right: 10px;
    width: 700px;
    min-width: 700px;
    max-width: 700px !important;
    /*centers the dialog vertically*/
    top: 10px;
    bottom: 10px;
    height: 600px;
    min-height: 600px;
    max-height: 600px;
}

.imagePreviewOuter {
    min-height: 450px;
    max-height: 450px;
    height: 450px;
    /*min-width:100%;
    max-width:100%;
    width:100%;*/
    overflow: auto;
}

.imagePreviewInner {
    width: 1500px;
    height: 500px;
}

.datepicker.readonly-editable {
    background-color: rgb(255,255,255);
    cursor: default;
}

.info-msg {
    color: #428bca;
    font-size: larger;
    font-weight: bolder;
    width: 350px;
    margin-right: auto;
    margin-left: auto;
    display: block;
    text-align: center;
}

.ui-layout-toggler {
    background-repeat: no-repeat;
    background-position: center;
    background-size: 8px 8px;
}

.ui-layout-toggler-west-open {
    background-image: url('../Content/images/blue-arrow-left.png');
}

.ui-layout-toggler-west-closed {
    background-image: url('../Content/images/blue-arrow-right.png');
}

.ui-layout-toggler-east-open {
    background-image: url('../Content/images/blue-arrow-right.png');
}

.ui-layout-toggler-east-closed {
    background-image: url('../Content/images/blue-arrow-left.png');
}

.statisticsWindowHeader {
    border: solid 0.3px gray;
    background-color: rgb(25,77,123);
}

.statisticsWindowHeaderText {
    color: white;
    font-weight: bold;
    background-color: rgb(25,77,123);
}

.statisticsWindowHeaderImages {
    background-color: rgb(25,77,123);
}

.statisticsMainTextArea {
    background-color: lightgray;
    max-height: 150px;
    font-weight: bold;
    font-size: 9px;
    color: black;
}

.statisticsMainTextAreaModal {
    background-color: lightgray;
    max-height: 750px;
    font-weight: bold;
    font-size: 9px;
    color: black;
}

.messageBox.statisticsmodal {
    max-width: 900px !important;
    width: 900px !important;
    min-width: 900px !important;
    max-height: 900px !important;
    margin-left: -450px !important;
}

.messageBox.ePMVersionmodal {
    max-width: 900px !important;
    width: 900px !important;
    min-width: 900px !important;
    max-height: 750px !important;
    margin-left: -450px !important;
}

.ePMversionText {
    white-space: normal;
    font-size: 12px;
    color: black;
    white-space: pre-wrap;
}

.ePMVersionTextContainer {
    background-color: lightgray;
    overflow-x: auto;
    overflow-y: auto;
}

.messageBox.ePMAttachment {
    max-width: 900px !important;
    width: 900px !important;
    min-width: 900px !important;
    max-height: 600px !important;
    margin-left: -450px !important;
}

.ePMAttachmentText {
    white-space: normal;
    font-size: 12px;
    color: black;
    white-space: pre-wrap;
}

.ePMAttachmentTextContainer {
    background-color: lightgray;
    overflow-x: auto;
    overflow-y: auto;
}


.barGraphBlueBars {
    background-image: -webkit-gradient( linear, left top, left bottom, color-stop(0.15, rgb(134, 183, 217)), color-stop(0.77, rgb(26, 77, 122)) ) !important;
    background-image: -o-linear-gradient(bottom, rgb(134, 183, 217) 15%, rgb(26, 77, 122) 77%) !important;
    background-image: -moz-linear-gradient(bottom, rgb(134, 183, 217) 15%, rgb(26, 77, 122) 77%) !important;
    background-image: -webkit-linear-gradient(bottom, rgb(134, 183, 217) 15%, rgb(26, 77, 122) 77%) !important;
    background-image: -ms-linear-gradient(bottom, rgb(134, 183, 217) 15%, rgb(26, 77, 122) 77%) !important;
    background-image: linear-gradient(to bottom, rgb(134, 183, 217) 15%, rgb(26, 77, 122) 77%) !important;
    position: absolute !important;
}

.barGraphGreenBars {
    background-image: -webkit-gradient( linear, left top, left bottom, color-stop(0.15, rgb(134, 217, 183)), color-stop(0.77, rgb(26, 122, 77)) ) !important;
    background-image: -o-linear-gradient(bottom, rgb(134, 217, 183) 15%, rgb(26, 122, 77) 77%) !important;
    background-image: -moz-linear-gradient(bottom, rgb(134, 217, 183) 15%, rgb(26, 122, 77) 77%) !important;
    background-image: -webkit-linear-gradient(bottom, rgb(134, 217, 183) 15%, rgb(26, 122, 77) 77%) !important;
    background-image: -ms-linear-gradient(bottom, rgb(134, 217, 183) 15%, rgb(26, 122, 77) 77%) !important;
    background-image: linear-gradient(to bottom, rgb(134, 217, 183) 15%, rgb(26, 122, 77) 77%) !important;
    position: absolute !important;
}

.barGraphRedBars {
    background-image: -webkit-gradient( linear, left top, left bottom, color-stop(0.15, rgb(217, 134, 183)), color-stop(0.77, rgb(122, 26, 77)) ) !important;
    background-image: -o-linear-gradient(bottom, rgb(217, 134, 183) 15%, rgb(122, 26, 77) 77%) !important;
    background-image: -moz-linear-gradient(bottom, rgb(217, 134, 183) 15%, rgb(122, 26, 77) 77%) !important;
    background-image: -webkit-linear-gradient(bottom, rgb(217, 134, 183) 15%, rgb(122, 26, 77) 77%) !important;
    background-image: -ms-linear-gradient(bottom, rgb(217, 134, 183) 15%, rgb(122, 26, 77) 77%) !important;
    background-image: linear-gradient(to bottom, rgb(217, 134, 183) 15%, rgb(122, 26, 77) 77%) !important;
    position: absolute !important;
}

.barGraphYellowBars {
    background-image: -webkit-gradient( linear, left top, left bottom, color-stop(0.15, rgb(251,247,172)), color-stop(0.77, rgb(242,232,28)) ) !important;
    background-image: -o-linear-gradient(bottom, rgb(251,247,172) 15%, rgb(242,232,28) 77%) !important;
    background-image: -moz-linear-gradient(bottom, rgb(251,247,172) 15%, rgb(242,232,28) 77%) !important;
    background-image: -webkit-linear-gradient(bottom, rgb(251,247,172) 15%, rgb(242,232,28) 77%) !important;
    background-image: -ms-linear-gradient(bottom, rgb(251,247,172) 15%, rgb(242,232,28) 77%) !important;
    background-image: linear-gradient(to bottom, rgb(251,247,172) 15%, rgb(242,232,28) 77%) !important;
    position: absolute !important;
}

.barGraphOrangeBars {
    background-image: -webkit-gradient( linear, left top, left bottom, color-stop(0.15, rgb(255,193,132)), color-stop(0.77, rgb(234,117,0)) ) !important;
    background-image: -o-linear-gradient(bottom, rgb(255,193,132) 15%, rgb(234,117,0) 77%) !important;
    background-image: -moz-linear-gradient(bottom, rgb(255,193,132) 15%, rgb(234,117,0) 77%) !important;
    background-image: -webkit-linear-gradient(bottom, rgb(255,193,132) 15%, rgb(234,117,0) 77%) !important;
    background-image: -ms-linear-gradient(bottom, rgb(255,193,132) 15%, rgb(234,117,0) 77%) !important;
    background-image: linear-gradient(to bottom, rgb(255,193,132) 15%, rgb(234,117,0) 77%) !important;
    position: absolute !important;
}

.kpgWaitText {
    text-align: center;
    color: black;
    height: 50px;
    min-height: 50px;
    max-height: 50px;
}

.kpgBodyProgress {
    width: 100% !important;
    min-height: 150px !important;
}


.testHead {
    border-radius: 20px;
    background-color: rgb(25,77,123);
    max-width: 30px;
    min-width: 30px;
    width: 30px;
    font-family: 'Times New Roman';
    font-size: 16px;
    font-style: italic;
    font-weight: bold;
    text-transform: lowercase;
}

.printableArea {
    max-height: 300px !Important;
    overflow-x: auto;
    overflow-y: auto;
}

.confirmationBody {
    color: black !important;
    font-size: 11pt !important;
    text-transform: none;
    text-align: center;
    font-family: 'Segoe UI';
}

.confirmationHeader {
    color: black !important;
    font-size: 13pt !important;
    font-weight: bold;
    font-family: 'Segoe UI';
    text-transform: none;
    text-align: left;
}

.Appstyle {
    color: rgb(51, 51, 51) !important;
    text-transform: none !important;
    font-size: 11px !important;
    font-weight: bolder !important;
}

.AppstyleRadio {
    text-transform: none !important;
}

.mainMenu-iChris {
    background-color: rgb(128,128,128) !important;
    background-image: none !important;
}

.mainMenuSelected-iChris {
    background-color: #365f91 !important;
    background-image: none !important;
}

.ePMbuttons-iChris {
    background-color: rgb(128,128,128) !important;
    border-bottom-color: rgb(128,128,128) !important;
    border-top-color: rgb(128,128,128) !important;
    border-right-color: rgb(128,128,128) !important;
    border-left-color: rgb(128,128,128) !important;
    background-image: none !important;
}

.staffImage-iChris {
    border: none;
    border-radius: 100%;
    overflow: hidden;
    width: 73px !important;
    height: 73px;
    margin-left: 5px;
    margin-top: 5px;
}

    .staffImage-iChris img {
        height: 75px !important;
        width: 75px !important;
        min-height: 75px !important;
        min-width: 75px !important;
        max-height: 75px !important;
        max-width: 75px !important;
    }

.staffheaderPane-iChris {
    background-color: rgb(220,220,220) !important;
}

.HeadingToolbarRow {
    overflow-y: auto;
}

.Grid-Ichris {
    font-family: 'Segoe UI' !important;
    font-size: 12px !important;
}

.GridHeader-Ichris {
    font-family: 'Segoe UI' !important;
}

.btn-info-iChris {
    background-color: #194D7B !important;
    background-image: none;
}

th {
    min-height: 35px;
    text-align: center;
    vertical-align: middle !important;
}

td {
    min-height: 35px;
    height: 35px;
    vertical-align: middle !important;
    font-size: 13px !important;
}

.socialmediaImages {
    border-radius: 100%;
    margin-top: 20px;
    margin-left: 2px;
    margin-right: 2px;
}

.fileinput-button-Ichris {
    background-color: #365f91 !important;
    background-image: none !important;
}

.fileinput-AddButton-Ichris {
    background-color: #4f80bd !important;
    background-image: none !important;
}

.journalDate {
    font-family: Arial, sans-serif;
    font-size: 10px;
    font-weight: bold;
    color: #365f91;
}

.journalEntry {
    white-space: pre-wrap;
    word-wrap: break-word;
    font-family: Arial, sans-serif;
    font-size: 14px;
    line-height: 18px;
}

.journalRating {
    font-family: Arial, sans-serif;
    font-size: 12px;
    font-weight: bold;
}

.brightStar {
    color: yellow !important;
}

.dullStar {
    color: darkgray !important;
}

.journalEntryBox {
    background-color: #365f91 !important;
}

.journalImage {
    border: none;
    border-radius: 100%;
    overflow: hidden;
    width: 35px !important;
    min-width: 35px !important;
    height: 35px !important;
    min-height: 35px !important;
    margin-left: 5px;
    margin-top: 5px;
}

.submitButtonJournal {
    text-transform: none;
    min-height: 40px;
    min-width: 80px;
    margin-right: 17px;
}

.dailyJournalStyle {
    background: url('../Content/images/frontierBackground.jpg') no-repeat !important;
    max-width: 100%;
    max-height: 100%;
    background-size: 100% 100% !important;
}

.Importantflag {
    color: darkorange !important;
}

.notImportantflag {
    color: darkgray !important;
}

.impFlgInside {
    padding-left: 5px;
    padding-right: 5px;
}

.delBtnInside {
    padding-left: 5px;
    padding-right: 5px;
    font-size: 20px;
}

.separatorJournalEntry {
    border-bottom: 1px solid #e1e8ed;
    padding: 10px !important;
}

.loadPosts {
    background-color: rgb(202,218,226);
    /*margin-right:auto;
    margin-left:auto;
    display:block;*/
    text-align: center !important;
}

.loadMoreText {
    font-family: 'Segoe UI';
    font-size: 11px;
    color: darkslategray;
}

.JournalBackground {
    background-color: rgba(202, 218, 226,0.5) !important;
}

.ui-layout-resizer {
    /*width: 15px !important;
    min-width: 15px !important;
    max-width: 15px !important;*/
}

.ui-layout-toggler-west, .ui-layout-toggler-east {
    /*width: 15px !important;
    min-width: 15px !important;
    max-width: 15px !important;*/
}

.flag {
    font-size: 22px;
    padding-right: 8px;
}

.inputflag {
    font-size: 22px;
    padding-left: 14px;
}


.exclamation {
    font-size: 20px;
}

.deleteEntry {
    color: slategrey;
    font-size: 20px;
    padding-right: 8px;
    padding-top: 8px;
}

#throbber {
    /*border:1px solid #346789;*/
    padding: 15px;
    background-color: transparent;
    -moz-border-radius: 0.5em;
    border-radius: 0.7em;
    opacity: 0.8;
    filter: alpha(opacity=80);
    color: #000;
    width: 133px;
    height: 133px;
    left: 50%;
    top: 40%;
    position: fixed;
}

.treeText {
    text-align: center;
}

.closeConfirmation {
    margin-top: -20px;
    margin-right: 10px;
}


.lookupSearchBoxText {
    margin-top: 5px;
    font-size: 12px;
    width: 70px;
    max-width: 70px;
    min-width: 70px;
    font-family: Geneva, Arial, Helvetica, sans-serif;
}

.lookupSearchText {
    margin-top: 5px;
    font-size: 12px;
    font-family: Geneva, Arial, Helvetica, sans-serif;
    width: 50px;
    min-width: 50px;
    max-width: 50px;
    margin-left: 10px;
}

.lookupSearchButton {
    margin-left: 5px;
    margin-top: 3px;
}

.nav-mc {
    font-size: 20px !important;
    background-color: burlywood;
    border-radius: 100%;
    height: 30px;
    width: 30px;
    padding-top: 1px;
    font-family: Arial Narrow;
    font-weight: bold;
}

.searchbox-backdrop {
    background-color: #222222;
    opacity: .6;
}

div.searchbox-icon {
    color: #808080;
}

div.searchbox-delete-button {
    background-color: #365f91;
}

.searchbox-typeahead-group-header {
    color: #808080;
    background-color: #aedbfd;
}

div.searchbox-icon {
    display: table;
    height: 20px;
    width: 20px;
    text-align: center;
    background-color: transparent;
    position: absolute;
    top: 50%;
    left: 3px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}

    div.searchbox-icon > div {
        display: table-cell;
        vertical-align: bottom;
    }

.cancel-padding {
    padding: 0 !important;
}

.padding-l-25 {
    padding-left: 25px !important;
}

.popover {
    font-size: 12px;
    font-family: Arial, Helvetica, sans-serif,"Segoe UI";
}

.centre-pane {
    overflow: auto !important;
    height: auto !important;
}

.reviewPartScroll {
    height: 77%;
    overflow: auto;
}

.dailyJournalDiv {
    height: 100%;
    overflow: auto;
}

textarea {
    min-height: 57px;
}

.textarea-class {
    min-height: 4em;
    max-height: 8em;
    overflow: auto;
    display: block;
    width: 100%;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #555;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    -webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}

    .textarea-class:focus {
        border-color: #66afe9;
        outline: 0;
        -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, .6);
        box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, .6);
    }

    .textarea-class::-moz-placeholder {
        color: #999;
        opacity: 1;
    }

    .textarea-class:-ms-input-placeholder {
        color: #999;
    }

    .textarea-class::-webkit-input-placeholder {
        color: #999;
    }

    .textarea-class[disabled],
    .textarea-class[readonly],
    fieldset[disabled] .textarea-class {
        cursor: not-allowed;
        background-color: #eee;
        opacity: 1;
    }
