body {
    font-family: verdana;
    font-size: 10pt;
    font-weight: normal;
    margin: 0px;
    padding: 0px;
    scrollbar-3dlight-color: #7FD4FF;
    scrollbar-arrow-color: #2080AE;
    scrollbar-darkshadow-color: #FFFFFF;
    scrollbar-face-color: #2080AE;
    scrollbar-highlight-color: #FFFFFF;
    scrollbar-shadow-color: #FFFFFF;
    scrollbar-track-color: #FFFFFF;
}

/*input[type='radio'] {
    width: 0;
}*/

.minwidthheight100perc {
    min-width: 100%;
    min-height: 100%;
}

.widthheight100perc {
    width: 100%;
    height: 100%;
}

.height100perc {
   height: 100%;
}

.inheritheight {
    height: inherit;
}

.overflowhidden {
    overflow: hidden;
}

.overflowauto {
    overflow: auto;
}

.visibility-hidden {
    visibility: hidden;
}

.visibility-visible {
    visibility: visible;
}

.relativeposition {
    position: relative;
}

.no-scrollbar .k-grid-header
{
padding: 0 !important;
}

.no-scrollbar .k-grid-content
{
overflow-y: visible;
}

.fullheight {
    height: 95% !important;
}

.fill-height {
    min-height: 100%;
    height:auto !important; /* cross-browser */
    height: 100%; /* cross-browser */
}

#tabstrip-parent,
.k-tabstrip-wrapper
{
    margin: 0;
    padding: 0;
    border-width: 0;
}

::-webkit-scrollbar {
    width: 10px;
}


::-webkit-scrollbar-track {
    -webkit-border-radius: 10px;
    background-color:#cdcdcd;
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
    border-radius: 10px;
}


::-webkit-scrollbar-thumb {
    -webkit-border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.5);
    border-radius: 10px;
}

.nowrap {
    white-space: nowrap;
}

.bold {
    font-weight: bold;
}

.clear-both {
    clear: both;
}

.hidden {
    display: none;
}

fieldset {
    border: 1px #888888 solid;
    display: inline-block;
    margin: 7px 0;
    padding: 7px;
    width: auto !important;
}

.h-300 {
    height: 300px;
}

fieldset table {
    border: 0px none;
    margin: 0px;
}

    fieldset table td {
        vertical-align: middle;
    }

legend {
    border: 0;
    border-bottom: 0px none;
    color: inherit;
    display: block;
    font-size: 10pt;
    font-weight: bold;
    line-height: 15px;
    margin: 3px;
    min-width: 100px;
    padding: 0;
    padding: 0 4px;
    width: auto !important;
}


/* Set padding to keep content from hitting the edges */

.body-content {
    padding: 15px 0px;
}

.page-size {
    height: 700px; /* to do change for responsive design - this is just for now */
}

/* Set width on the form input elements since they're 100% wide by default */

input,
select {
	/* Commented out as boxes were not taking full width in filtering row */
    /*max-width: 280px;*/
}

h3 {
    line-height: 22px;
}

.widget h3 {
    white-space: nowrap;
}

/* KENDO STUFF ADJUSTMENTS */
#SingleBudgetGrid .k-content
{
    min-width: 426px;
}

.widget .k-widget {
    border: 0px;
}

.k-content {
    padding: 10px;
}

.k-tabstrip .k-content {
    padding: 7px;
}

.k-input {
    max-width: 100%;
}

.k-filtercell .k-operator-hidden.reducePadding {
    padding-right: 0;
}

.k-filtercell .reducePadding {
    padding-right: 2.3em;
}

    .k-filtercell .reducePadding .k-dropdown-operator {
        right: 0;
    }

.k-widget {
    min-width: auto;
}

.k-grid .k-button {
    min-width: 35px !important;
}

    .k-grid .k-button .fa {
        font-size: 1.4em;
        position: relative;
        top: 2px;
    }

.k-grid-norecords {
    padding: 10px 0;
}

.k-grid .k-link {
    overflow: visible;
    text-align: center;
    white-space: nowrap;
}

.k-grid .text-left .k-link {
    text-align: left;
}

.k-grid .text-right .k-link {
    text-align: right;
}

.k-footer-template {
    text-align: right;
}

div.k-chart {
    background-color: transparent;
    border: 1px solid #cdcdcd;
}

/** for telerik kendo grid */

.k-grid i {
    font-size: 20px;
    padding: 2px 0;
}

.k-grid .k-button i {
    padding: 0;
}

.locationSelectionHeader, .locationSelectionListItem {
    border: 0;
    position: relative;
    width: 100%;
}

.locationSelectionHeader {
    border-bottom: 1px solid;
    padding: 10px;
}

    .locationSelectionHeader td {
        font-weight: bold;
        padding: 3px 10px;
    }

/*
.k-list li table {
    max-width: 500px;
    table-layout: fixed;
}*/

.chart-item table {
    table-layout: fixed;
}

.status {
    white-space: nowrap;
    width: 150px;
}

/* KENDO STUFF ADJUSTMENTS FINISHED */





.nodatapartial {
    height: 100px;
    padding: 50px 0 50px 0;
    position: relative;
}

.custom-overlay {
    display: table;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}

.custom-overlay-relative {
    display: table;
    height: 100%;
    position: relative;
    width: 100%;
}


.k-grid .custom-overlay {
    padding: 10px;
    position: relative;
}


.k-grid .no-data-available td {
    padding: 0;
}


.no-padding {
    padding: 0 !important;
}


.message-box {
    display: table-cell;
    padding: 10px;
    text-align: center;
    vertical-align: middle;
}

.message-title {
    font-size: 30px;
    line-height: 32px;
}

.message {
    font-size: 20px;
    line-height: 24px;
    margin: auto;
    padding: 10px;
    text-align: center;
    vertical-align: middle;
}

.no-data-message {
    padding: 10px 0;
}

header, footer {
    left: 0;
    right: 0;
    z-index: 1;
}


.top-header {
    background-color: #000000;
    display: inline-block;
    width: 100%;
}

.choose-items-box {
    float: left;
    padding: 3px 7px;
}

.customer {
    white-space: nowrap;
}

    .customer img {
        max-width: 124px
    }
  
    .inspired-logo {
        max-height: 50px !important;
        margin-top: 5px;
        margin-bottom: 5px;
    }

footer {
    bottom: 0;
}

.logo {
    float: left;
    left: 5px;
    position: fixed;
    top: 5px;
}

/*Button positioning in popup windows*/

.closeButton {
    bottom: 8px;
    position: absolute;
    right: 8px;
    width: 80px;
}

.saveButton {
    bottom: 8px;
    position: absolute;
    right: 96px;
    width: 80px;
}


/*End button positioning in popup windows*/

.divdisplay {
    border: 10px;
    padding: 10px;
}

.window {
    width: 900px;
}

.accountText {
    float: left;
    width: 260px;
}

.additionalsmallwindow {
    width: 500px;
}

.selectionsmallwindow {
    width: 400px;
}

.selectionWidgets {
    float: left;
    padding: 5px;
    top: 0;
    width: 378px;
}

.additionalOptions {
    float: right;
    padding: 5px;
    top: 0;
}

.infoFieldset {
    top: 0;
}

.onelinemessage {
    font-size: 11pt;
    font-weight: bold;
    height: 150px;
    line-height: 150px;
    text-align: center;
    vertical-align: middle;
    width: 500px;
}

label {
    font-size: 10pt;
    font-weight: normal;
}

.buttonBar {
    bottom: 0;
    height: 35px;
    width: 100%;
}


.popupWindow {
    border-bottom: 35px;
    padding-bottom: 35px;
    vertical-align: middle;
    white-space: nowrap;
}

.popup {
    vertical-align: middle;
    white-space: nowrap;
}

/*Tile groups*/
.tile {
    font-family: "Segoe UI", sans-serif;
    font-weight: 600;
    font-size: 12pt;
    border: 0;
    height: 75px;
    line-height: 17px;
    margin-top: 5px;
    padding-left: 10px;
    padding-right: 10px;
    width: 190px;
}

@media screen and (min-width: 1600px) {
    .tile {
        font-family: "Segoe UI", sans-serif;
        font-weight: 600;
        font-size: 12pt;
        border: 0;
        height: 75px;
        line-height: 17px;
        margin-top: 5px;
        padding-left: 10px;
        padding-right: 10px;
        width: 220px;
    }
}


.tileGroup {
    float: left;
    padding-left: 5px;
    padding-right: 5px;
    position: relative;
}

.tileScreen {
    display: inline;
    height: 100%;
    position: relative;
    white-space: normal;
    width: 100%;
}

.buttonClass {
    cursor: pointer;
    white-space: normal;
}

.leftFooter {
    float: left; 
    font-size: 10px;
    margin-left: 10px;
}

.rightFooter {
    float: right; 
    font-size: 10px;
    margin-right: 10px;
}

.navbar {
   min-height: 10px !important;
   padding-top: 5px;
}

.singleTile {
    padding-top: 10px;
}

.groupHeader {
    font-family: "Segoe UI", sans-serif;
    font-size: 14pt;
    font-weight: bold;
    margin-left: 2px;
    margin-right: 2px;
    text-align: center;
}

/*End tile groups*/

/* to do needs  */

#LoadingDiv {
    height: 100%;
    position: fixed;
    right: 0;
    top: 0;
    width: 100%;
    z-index: 1000;
}

a {
    text-decoration: none; /*Don't allow the link to be underlined'*/
}

.rgAltRow, .rgRow {
    cursor: pointer; /*Set the cursor to the default pointer in the kendogrid*/
}


.locationDashboard {
    padding: 5px !important;
}

.heading {
    padding: 3px 0 1px 0;
}

.sectionHeading {
    font-size: 20px;
    font-weight: bold;
    margin: auto;
    position: relative;
    text-align: center;
    width: auto;
}

.mainSectionHeading {
    font-size: 20px;
    font-weight: bold;
    margin: 10px 0 5px;
}

.green-bck {
    background-color: rgba(152, 251, 152, 0.8);
    color: black;
}

.yellow-bck {
    background-color: rgba(255, 179, 0, 0.8);
    color: black;
}

.pale-yellow-bck {
    background-color: palegoldenrod;
    color: black;
}

.red-bck {
    background-color: rgba(255, 125, 123, 0.8);
    color: black;
}

.green {
    color: rgba(20, 195, 2, 0.9);
}

.yellow {
    color: rgba(255, 190, 10, 0.9);
}

.red {
    color: rgba(245, 20, 30, 0.9);
}

.target_colours_key td {
    padding: 7px;
}

.margin-tb-5 {
    margin-top: 5px;
    margin-bottom: 5px;
}

.margin-tb-10 {
    margin: 10px 0px;
}

.margin-tb-20 {
    margin: 20px 0px;
}

.margin-bb-20 {
    margin: 0 0 20px 0;
}

.padding-t-5 {
    padding-top: 5px;
}

.padding-r-50 {
    padding: 0px 50px 0px 0px !important;
}

.padding-tb-5 {
    padding: 5px 0px;
}

.padding-r-20 {
    padding: 0px 20px 0px 0px !important;
}

.padding-0 {
    padding: 0px !important;
}

.margin-l-5 {
    margin: 0 0 0 5px;
}

.margin-t-10 {
    margin: 10px 0 0 0;
}

.marginrow0 {
    margin: 0px;
}

#MainWindow {
    min-height: 60px;
    min-width: 100px;
    /* display: inline-block !important;*/
}

#InnerWindow {
    min-height: 60px;
    min-width: 100px;
    /* display: inline-block !important;*/
    overflow: auto;
}

/*
#showReport {
    bottom: 8px;
    position: absolute;
    right: 96px;
    width: 100px;
}

#closeWidget {
    bottom: 8px;
    position: absolute;
    right: 8px;
    width: 80px;
}
*/

.font-bold {
    font-weight: bold;
}

/** summary dasbhoard and budget selector ------------------------------------------------------*/

.chart-box {
    text-align: center;
    width: 100%;
}

    .chart-box .k-widget {
        text-align: left;
    }

    .chart-box .chart-item {
        display: inline-block;
        margin: auto;
        position: relative;
        width: 49%;
    }

    .chart-box .chart-item-nowidth {
        display: inline-block;
        margin: auto;
        position: relative;
    }

        .chart-box .chart-item .k-chart {
            margin: 10px;
        }

        .chart-box .chart-item .k-grid {
            margin: 10px 15px;
        }

    .chart-box .width100perc {
        width: 100% !important;
    }


/** selectors------------------------------------------------------------------------------*/

form {
    margin: 0;
}

.buttons-divMain {
    clear: both;
    float: right;
    margin: 5px 5px 5px 0;
}

.buttons-div {
    float: right !important;    
}

.selectorFieldset {
    float: left;
    margin: 5px;
    min-width: 200px;
}

    .selectorFieldset .k-button,
    .selectorFieldset .k-checkbox {
        vertical-align: top;
    }

/*.k-checkbox-label,
.k-radio-label {
    line-height: 1.25em;
    padding-left: 1.6em;
}*/


.ContentDiv {
    max-width: 1100px;
    vertical-align: middle;
    white-space: nowrap;
}

    .ContentDiv .k-treeview {
        margin: 10px 10px 30px 10px;
    }

/** location selection top div---------------------------------------------------------------*/

.location-selection-top-div {
    height: auto;
    position: fixed;
    right:0;
    width: 100%;
    z-index: 99;
}

    .location-selection-top-div .margin-10 {
        margin: 10px;
    }

.location-selection-heading {
    font-size: 22px;
    font-weight: bold;
    padding: 3px 0 0 0;
}

.supplierSelection,
.utilitySelection {
    display: block;
    margin: 5px;
    text-align: left;
}

.k-menu li .k-animation-container {
    height: 500px !important;
    /*width: 217px !important;*/
    overflow-x: hidden !important;
    overflow-y: auto !important;
    top: 28px !important;
}

.k-menu li .menu-label {
    display: block;
    line-height: 15px;
    margin-bottom: 0px;
    padding-left: 15px;
    text-indent: -15px;
}

.k-menu li .menu-input {
    height: 13px;
    margin: 0;
    margin-right: 2px !important;
    *overflow: hidden;
    padding: 0;
    position: relative;
    top: -1px;
    vertical-align: bottom;
    width: 13px;
}

.suppliersCombo {
    width: 250px;
}

.full-page {
    min-height: 440px;
    min-width: 700px;
}

.locationOptions .k-checkbox-label {
    display: inline-block;
    margin: 2px 5px 0 5px;
}

.buttonReport {
    text-align: center;
    width: 110px;
}

.buttonSelect {
    text-align: center;
    height: 40px;
}

.textAreaSelect {
    width: 286px;
    min-height: 40px !important;
}

.headerText {
    text-align: center;
    font-size: 12pt;
    font-weight: bold;
}

.width100perc {
    width: 100% !important;
}

.width95perc {
    width: 95% !important;
}

.nopaddingright {
    padding-right: 0px;
}
 
.input-radio {
    width: 15px !important;
}

.height90perc {
   height: 90%;
}
/* this is to remove clear icon from all combobox items */
.k-combobox > .k-state-focused.k-dropdown-wrap > .k-i-close, 
.k-combobox > .k-state-hover.k-dropdown-wrap > .k-i-close {
    display:none;
}

.k-combobox.showClose > .k-state-focused.k-dropdown-wrap > .k-i-close,
.k-combobox.showClose > .k-state-hover.k-dropdown-wrap > .k-i-close {
    display: inline;
}

.nav > li > a {
    padding-left: 10px;
    padding-right: 10px;
}

.nopaddingleftright {
    padding-left: 0px;
    padding-right: 0px;
}

.padding5 {
    padding: 5px;
}

.font10 {
    font-size: 10px;
}

.padding10 {
    padding: 10px;
}

.padding1 {
    padding: 1px;
}

.paddingforTextAreaDiv {
    padding-left: 5px;
    padding-right: 0px;
    padding-top: 0px;
    padding-bottom: 0px;
}

.paddingforButton {
    padding-left: 0px;
    padding-right: 10px;
    padding-top: 0px;
    padding-bottom: 0px;
}

.textAreaStyle {
    padding-right: 0px;
    display: block;
    vertical-align: middle;
}

.paddingFooter {
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 15px;
    padding-right: 5px;
}

.paddingright10 {
    padding-right: 10px;
}

.transparentBackground {
    background-color: transparent;
}

.internalButtonsDiv {
    clear: both;
    float: right;
    margin: 5px 5px 5px 0;
}

.paddingTop5 {
    margin-top: 5px;
}

.page-centered
{
    left: 0;
    line-height: 200px;
    margin-top: -100px;
    position: absolute;
    text-align: center;
    width: 100%;
    font-size: 18px;
    margin-left: -40px;
}

.top-62-perc {
  top: 62%;  
  height: 20px;
}

.top-35-perc {
    top: 35%;
}

.download-logo {
    float: right; 
    margin-top: 16px; 
    margin-right: 40px;
}

.wider-button {
    width: 120px;
}

.grid-title {
    float: left; 
    font-size: 18px; 
    text-align: center; 
    padding-left: 2px; 
    padding-top: 3px;
    font-weight: bold;
}

.floatRight {
    float: right;
}

.paddingbottom30 {
    padding-bottom: 30px;
}

#alignLeftSubMenu {right: auto}
#alignLeftSubMenu::before {left:12px;right:auto}
#alignLeftSubMenu::after {left:13px;right:auto}

.k-tabstrip-left>.k-tabstrip-items .k-item
{
    border-right-width: 1px;
}

.k-panelbar .k-tabstrip-left>.k-tabstrip-items .k-state-active, 
.k-tabstrip-left>.k-tabstrip-items .k-state-active, 
.k-tabstrip-left>.k-tabstrip-items .k-tab-on-top 
{
    border-right-width: 0;
}

.margin-top-10 {
    margin-top: 10px !important;
}
.navbar-default .navbar-nav, .navbar-default .navbar-nav .open .dropdown-menu, .normalText {
    font-family: "Segoe UI", sans-serif;
    font-weight: 600;
    font-size: 11pt;
}

.k-window .row {
    box-sizing: border-box;
}

.k-window .row .col-xs-1, .col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {
        box-sizing: border-box;
    }

.tileSpan {
    display: table-cell;
    text-align: center;
    vertical-align: middle !important;
    width: inherit;

     font-family: "Segoe UI", sans-serif;
    font-weight: 600;
    font-size: 11pt;
}

.inheritheight {
    height: inherit;
}

@media screen and (min-width: 1650px) {
    #tilesDisplayDiv.col-lg-2 {
        width: 14%;
    }
}

.footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  background-color: #f5f5f5;
}

.tileDivAnchor {
    text-align:center; 
    padding-bottom: 10px;
}

.height40 {
    height: 40%;
}

.height5 {
    height: 5%;
}

.height50 {
    height: 50%;
}

.height9 {
    height: 9%;
}

.height91 {
    height: 91%;
}

.k-menu .k-item, .k-menu-horizontal.k-widget > .k-item {
    border-right-width: 0px !important;
}

.dropdown-submenu {
    position: relative;
    min-width: 160px;
}

.dropdown-submenu>.dropdown-menu {
    top: 0;
    left: 100%;
    margin-top: -6px;
    margin-left: -1px;
    -webkit-border-radius: 0 6px 6px 6px;
    -moz-border-radius: 0 6px 6px;
    border-radius: 0 6px 6px 6px;
}

.dropdown-submenu:hover>.dropdown-menu {
    display: block;
}

.dropdown-submenu>a:after {
    display: block;
    content: " ";
    float: right;
    width: 0;
    height: 0;
    border-color: transparent;
    border-style: solid;
    border-width: 5px 0 5px 5px;
    border-left-color: #ccc;
    margin-top: 5px;
    margin-right: -10px;
}

.dropdown-submenu:hover>a:after {
    border-left-color: #fff;
}

.dropdown-submenu.pull-left,
.dropdown-submenu.pull-right {
  float: none
}

/* This will target all children, but what about children of .dropdown-submenu.pull-right? */
.pull-right .dropdown-submenu > .dropdown-menu,
.dropdown-submenu.pull-left > .dropdown-menu {
    left: auto;
    right: 100%;
    margin-left: 0;
    margin-right: -1px;
}

/* Will need a pull-right override - should this be a normal selector to target all future .dropdown-menu? */
.dropdown-submenu.pull-right > .dropdown-menu {
  left: 100%;
  right: auto;
  margin-left: -1px;
  margin-right: 0;
}

.noLeft {
    left: 0px !important;
}

#ulDashboards, #ulSite-Reports, #ulGroup-Reports, #ulProcurement {
    left: 0px !important;
}

#ulDashboards.dropdown-menu {
    min-width: 200px !important;
}

#ulTools.dropdown-menu {
    min-width: 250px !important;
}

.metercheckbox {
    height: 15px;
    width: 15px;
}

@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) {
    .metercheckbox {
         height: 25px;
         width: 25px;
     }
 }

.officialTime {
    margin-right: 50px;
    display:block;
}