/** Hacks to GWT styling; will class names change with future compiles? */
.GNTNEJEDLI.GNTNEJEDP {
    z-index: 999;
}

/** Add css rules here for your application. */
body * {
    -webkit-text-size-adjust: none;
    -webkit-touch-callout: none;
    -webkit-text-size-adjust: none;
    margin: 0px;
    padding: 0px;
    font-family: Helvetica, sans-serif;
}

body {
    margin: 0;
    padding: 0;
    background: #dfe2e2;
    color: #000;
    font-weight: 400;
    -webkit-perspective: 800;
    -webkit-transform-style: preserve-3d;
    position: absolute;
    width: 100%;
    height: 100%;
}

input:disabled {
    opacity: .9 !important;
    cursor: default !important;
}

.jsoneditor-menu a.jsoneditor-poweredBy {
    visibility: hidden !important;
}

.gwt-ProgressBar-shell .gwt-ProgressBar-bar {
    background-color: #92C1F0;
}

.gwt-ProgressBar-shell .gwt-ProgressBar-text {
    padding: 0;
    margin: 0;
    color: white;
}

.progressLabel {
    font-family: Arial, sans-serif;
    font-size: 12px;
}

.portalFlexTable table {
    border: 0px solid black;
    margin-left: 10px;
    margin-right: 10px;
}

.portalFlexTable td {
    padding: 5px;
    padding-left: 5px;
    padding-right: 5px;
}

.flexTable table {
    border: 0px solid black;
}

.flexTable td {
    padding: 5px;
    padding-left: 5px;
    padding-right: 5px;
}

.gwt-CheckBox-custom {
    font-size: 10pt;
    margin: 5px 0px 5px;
    color: #777777;
    padding: 2px 2px 10px 5px;
}

.gwt-TextBox-tableInput {
    border: 0px none;
    padding: 0px;
    margin: 0px;
    text-align: center;
}

.inputCell {
    padding: 3px;
    margin: 0px;
    text-align: center;
}

.tableTextBox {
    padding: 0px;
    border: 0px none;
    margin: 0px;
    outline: none;
    text-align: center;
}

.portalHeaderCell {
    background-color: #d9d9d9;
    color: #0866c6;
    font-size: 12pt;
    font-weight: bold;
}

.headerCell {
    background-color: #d9d9d9;
    font-weight: bold;
}

.greyCell {
    background-color: #F8F9F9;
}

.whiteCell {
    background-color: white;
}

.resultsCell {
    background-color: #92d050;
}

.stage1 {
    background-color: #c5d9f1;
}

.stage2 {
    background-color: #ffff00;
}

.stage3 {
    background-color: #ffc000;
}

.stage4 {
    background-color: #ff0000;
    color: white;
}

.stage5 {
    background-color: #7030a0;
    color: white;
}

#BAlign {
    vertical-align: text-bottom;
}

#page-container {
    /** min-height: 10%; */
}

#gmap {
    width: 75%;
    min-height: 95%;
    padding: 10px;
    background: #fff;
}

#image-preview {
    border-width: 0px;
    padding: 0px;
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
    margin-left: 0px;
    background-color: blue;
}

#image-preview-close {
    position: absolute;
    left: 20px;
    top: 20px;
}

#h2o-window {
    border-style: solid;
    border-width: 1px;
    border-color: grey;
    padding: 3px;
    background: white;
}

#h2o-window-no-border {
    border-style: solid;
    border-width: 0px;
    border-color: grey;
    padding: 3px;
    background: white;
}

#invisible {
    display: none;
    visibility: hidden;
}

#invisible:focus {
    outline-width: 0;
}

#padded-five {
    padding: 5px;
}

#padded-panel {
    padding: 10px;
    vertical-align: middle;
}

#right-align-datebox {
    float: right;
    margin-top: 10px;
    margin-right: 10px;
    border: 0;
    vertical-align: middle;
    font-size: 12pt;
    color: #777777;
}

.focus {
    border: 0;
    outline: none;
}

#right-align-box {
    float: right;
    margin-top: 5px;
    padding-right: 5px;
    vertical-align: middle;
}

#infowindiv {
    float: left;
}

.fix {
    font-size: 6pt;
    text-align: center;
    padding: 0px 0px 0px 0px;
    position: relative;
}

#content {
    float: left;
}

#sidebar {
    float: left;
}

.top-buttons {
    padding: 0px;
    position: relative;
}

.sla-container table table[align="center"] {
    margin: auto !important;
}

.h2o-list-container table table[align="center"] {
    margin: auto !important;
}

.top-green-panel {
    padding: 0px;
    height: 40px;
    position: relative;
    background-color: #66bda7;
    float: left !important;
    vertical-align: middle !important;
}

.top-green-links {
    padding: 0px !important;
    font-size: 11pt !important;
    position: relative;
    color: #ffffff !important;
    vertical-align: middle !important;
    align: center !important;
}

.top-green-links:link {
    color: #ffffff !important;
}

.top-green-links:hover {
    color: #f5d20a !important;
}

.top-green-links:active {
    color: #fef2a2 !important;
}

.top-green-links:visited {
    color: #fef2a2 !important;
}

.top-green-links-highlighted {
    padding: 0px !important;
    font-size: 11pt !important;
    position: relative;
    color: #fef2a2 !important;
    vertical-align: middle !important;
    align: center !important;
}

.top-green-links-highlighted:link {
    color: #fef2a2 !important;
}

.top-green-links-highlighted:hover {
    color: #f5d20a !important;
}

.top-green-links-highlighted:active {
    color: #fef2a2 !important;
}

.top-green-links-highlighted:visited {
    color: #fef2a2 !important;
}

#MainMeterDropdown {
    margin: 15px 15px 15px 15px;
    font-size: 14pt;
}

#ScenarioDropdown {
    margin: 5px 5px 5px 5px;
    font-size: 14pt;
    padding: 0px 0px 0px 0px;
    float: right;
    vertical-align: top;
}

#ScenarioDropdownLeft {
    margin: 5px 5px 5px 5px;
    font-size: 14pt;
    padding: 0px 0px 0px 0px;
    float: left;
    vertical-align: top;
}

#ScenarioDropdown-small {
    margin: 5px 5px 5px 5px;
    font-size: 10pt;
    font-weight: bold;
    padding: 0px 0px 0px 0px;
    float: right;
    vertical-align: top;
}

#StatsDropdown {
    margin: 5px 5px 5px 5px;
    font-size: 10pt;
    padding: 0px 0px 0px 0px;
    float: left;
    vertical-align: top;
}

#ScenarioLabel-small {
    margin: 5px 5px 5px 5px;
    font-size: 10pt;
    font-weight: bold;
    padding: 0px 0px 0px 0px;
    float: right;
    vertical-align: middle;
}

#ScenarioLabel-small-grey {
    margin: 5px 5px 5px 5px;
    font-size: 10pt;
    font-weight: bold;
    color: #777777;
    padding: 0px 0px 0px 0px;
    float: right;
    vertical-align: middle;
}

#PopupDataEntry {
    margin: 5px 5px 5px 5px;
    font-size: 14pt;
    padding: 0px 0px 0px 0px;
    vertical-align: top;
}

#CenteredContainer {
    horizontal-align: middle;
}

#SeasonCluster_c1 {
    vertical-align: middle;
}

#H2O_readonly {
    background-color: #D4D0C7;
}

#SeasonCluster_cb1 {
    padding-top: 10px;
}

#SeasonCluster_cb2 {
    margin: 5px 0px 0px 0px;
    vertical-align: middle;
}

#SeasonCluster_cb3 {
    margin: 5px 0px 0px 0px;
    vertical-align: middle;
}

#SeasonCluster_cb4 {
    margin: 5px 0px 0px 0px;
    vertical-align: middle;
}

#SeasonCluster_b1 {
    background-color: grey;
    margin: 5px 5px 5px 5px;
    vertical-align: middle;
}

#SeasonCluster_b2 {
    background-color: #0961a3;
    margin: 5px 5px 5px 5px;
}

#SeasonCluster_b3 {
    background-color: #bbdc99;
    margin: 5px 5px 5px 5px;
}

#SeasonCluster_b4 {
    background-color: #c78168;
    margin: 5px 5px 5px 5px;
}

#SeasonCluster_l1 {
    font-size: 14pt;
}

#SeasonCluster_l2 {
    font-size: 14pt;
}

#SeasonCluster_l3 {
    font-size: 14pt;
}

#SeasonCluster_l4 {
    font-size: 14pt;
}

.gwt-TabLayoutPanel {
}

.gwt-TabLayoutPanel .gwt-TabLayoutPanelTabs {
}

.gwt-TabLayoutPanel .gwt-TabLayoutPanelContent {
    border-color: #92c1f0;
    border-style: none;
    border-width: 3px 2px 2px;
    overflow: hidden;
    padding: 6px;
}

.gwt-TabLayoutPanel .gwt-NoPadTabLayoutPanelContent {
    border-color: #92c1f0;
    border-style: solid;
    border-width: 3px 2px 2px;
    overflow: hidden;
    padding: 0px;
}

.gwt-TabLayoutPanel .gwt-TabLayoutPanelTab {
    margin-left: 0px;
    padding: 3px 6px 3px 6px;
    cursor: pointer;
    cursor: hand;
    color: black;
    font-weight: bold;
    text-align: center;
    background: #d0e4f6;
    float: left;
}

.gwt-TabLayoutPanel .gwt-TabLayoutPanelTab-selected {
    cursor: default;
    background: #92c1f0;
}


.popup {
    background-color: gray;
    border-color: gray gray gray gray;
    border-width: 1px 3px 3px 1px;
    border-style: solid solid solid solid;
}

.popup-item {
    font-weight: normal;
    font-size: 100%;
}


.gwt-Anchor:link {
    color: #000000;
    text-decoration: none;
}

.gwt-Anchor:visited {
    color: #000000;
    text-decoration: none;
}

.gwt-Anchor:hover {
    color: #000000;
    text-decoration: none;
}

.gwt-Anchor:active {
    color: #000000;
    text-decoration: none;
}

.gwt-Label {
    font-size: 10pt;
    white-space: nowrap;
}

.gwt-Grid {
    font-size: 16pt;
}

hr {
    margin: 3px 0px 3px 0;
}

h1 {
    font-size: 14pt !important;
    font-weight: bold !important;
    line-height: normal !important;
    color: #777777 !important;
    margin: 5px 0px 5px !important;
    text-align: left !important;
    padding: 2px 2px 10px 5px !important;
}

h1-small {
    font-size: 10pt !important;
    font-weight: bold !important;
    line-height: normal !important;
    color: #777777 !important;
    margin: 5px 0px 5px !important;
    text-align: left !important;
    padding: 2px 2px 10px 5px !important;
}

#btnPortal {
    float: left;
    margin: 0 0 0 0;
    font: normal 20px Trebuchet MS, Arial, Helvetica, sans-serif;
    color: #fff;
    background: url(/static/btnBack.gif) no-repeat;
    border: 0;
    cursor: pointer;
    width: 142px;
    height: 36px;
}

#btnBack {
    float: left;
    margin: 20px 0 0 15px;
    font: normal 20px Trebuchet MS, Arial, Helvetica, sans-serif;
    color: #fff;
    background: url(/static/btnBack.gif) no-repeat;
    border: 0;
    cursor: pointer;
    width: 142px;
    height: 36px;
    -webkit-box-shadow: none;
    box-shadow: none;
}

#btnBack:disabled {
    float: left;
    margin: 20px 0 0 15px;
    font: normal 20px Trebuchet MS, Arial, Helvetica, sans-serif;
    color: #fff;
    background: url(/static/btnDisabled.png) no-repeat;
    border: 0;
    cursor: pointer;
    width: 142px;
    height: 36px;
    -webkit-box-shadow: none;
    box-shadow: none;
    cursor: default !important;
}

#btnBackRight {
    float: right;
    margin: 20px 15px 15px 0;
    font: normal 20px Trebuchet MS, Arial, Helvetica, sans-serif;
    color: #fff;
    background: url(/static/btnBack.gif) no-repeat;
    border: 0;
    cursor: pointer;
    width: 142px;
    height: 36px;
    -webkit-box-shadow: none;
    box-shadow: none;
}

#btnBackRight:disabled {
    float: right;
    margin: 20px 15px 15px 0;
    font: normal 20px Trebuchet MS, Arial, Helvetica, sans-serif;
    color: #fff;
    background: url(/static/btnDisabled.png) no-repeat;
    border: 0;
    cursor: pointer;
    width: 142px;
    height: 36px;
    -webkit-box-shadow: none;
    box-shadow: none;
    cursor: default !important;
}

#btnNext {
    float: right;
    margin: 20px 0 15px 0;
    font: normal 20px Trebuchet MS, Arial, Helvetica, sans-serif;
    color: #fff;
    background: url(/static/btnStep.png) no-repeat;
    border: 0;
    cursor: pointer;
    width: 142px;
    height: 36px;
}

#btnNarrow {
    float: right;
    margin: 20px 0 0 15px;
    font: normal 20px Trebuchet MS, Arial, Helvetica, sans-serif;
    color: #fff;
    background: url(/static/btnStep.gif) no-repeat;
    border: 0;
    cursor: pointer;
    width: 100px;
    height: 36px;
}

#btnMap {
    float: right;
    margin: 0px 0 0px 0;
    font: normal 20px Trebuchet MS, Arial, Helvetica, sans-serif;
    color: #fff;
    background: url(/static/btnBackg.png) no-repeat;
    border: 0;
    cursor: pointer;
    width: 142px;
    height: 36px;
}

#btnMap2 {
    float: right;
    margin: 0px 0 0px 0;
    font: normal 20px Trebuchet MS, Arial, Helvetica, sans-serif;
    color: #fff;
    background: url(/static/btnBack.png) no-repeat;
    border: 0;
    cursor: pointer;
    width: 142px;
    height: 36px;
}

#btnMap2:disabled {
    float: right;
    margin: 0px 0 0px 0;
    font: normal 20px Trebuchet MS, Arial, Helvetica, sans-serif;
    color: #fff;
    background: url(/static/btnDisabled.png) no-repeat;
    border: 0;
    cursor: pointer;
    width: 142px;
    height: 36px;
    -webkit-box-shadow: none;
    box-shadow: none;
    cursor: default !important;
}

#btnLeft {
    float: left;
    margin: 0px 0 0px 0;
    font: normal 20px Trebuchet MS, Arial, Helvetica, sans-serif;
    color: #fff;
    background: url(/static/btnBackg.png) no-repeat;
    border: 0;
    cursor: pointer;
    width: 142px;
    height: 36px;
    -webkit-box-shadow: none;
    box-shadow: none;
}

#btnMapRight {
    position: absolute;
    right: 0;
    float: right;
    margin: 0px 20px 20px 0;
    font: normal 20px Trebuchet MS, Arial, Helvetica, sans-serif;
    color: #fff;
    background: url(/static/btnBackg.png) no-repeat;
    border: 0;
    cursor: pointer;
    width: 142px;
    height: 36px;
}

#btnMap2 {
    margin: 0px 0 0px 0;
    font: normal 20px Trebuchet MS, Arial, Helvetica, sans-serif;
    color: #fff;
    background: url(/static/btnBackg.png) no-repeat;
    border: 0;
    cursor: pointer;
    width: 142px;
    height: 36px;
}

#btnOKBottom {
    text-align: center;
    float: center;
    margin: 20px 0 0 15px;
    font: normal 20px Trebuchet MS, Arial, Helvetica, sans-serif;
    color: #fff;
    background: url(/static/btnBack.gif) no-repeat;
    border: 0;
    cursor: pointer;
    width: 142px;
    height: 36px;
}

#btnCenterBottom {
    text-align: center;
    float: center;
    font: normal 20px Trebuchet MS, Arial, Helvetica, sans-serif;
    color: #fff;
}

#cbxPipes {
    float: right;
    text-align: right;
    vertical-align: bottom;
    font: normal 20px Trebuchet MS, Arial, Helvetica, sans-serif;
    color: #777777;
}

#rbLanguage {
    float: right;
    text-align: right;
    vertical-align: bottom;
    margin: 5px 0px 5px;
    padding: 2px 2px 10px 5px;
    font: normal 12px Trebuchet MS, Arial, Helvetica, sans-serif;
    color: #777777;
}

#cbxPublicMap {
    float: left;
    text-align: left;
    vertical-align: bottom;
    font: normal 14px Arial, Helvetica, sans-serif;
    color: #0000FF;
}

#txtBoxMap {
    float: right;
    margin: 0px 0 0px 0;
    padding: 2px 2px 2px 2px;
    font: normal 20px Trebuchet MS, Arial, Helvetica, sans-serif;
    height: 26px;
    vertical-align: middle;
}

#btnSearchMap {
    float: right;
    margin: 0px 0 0px 5px;
    font: normal 20px Trebuchet MS, Arial, Helvetica, sans-serif;
    color: #fff;
    background: url(/static/search.png) no-repeat;
    border: 0;
    cursor: pointer;
    width: 32px;
    height: 32px;
}

#btnListenPreview {
    float: right;
    margin: 0px 0 0px 0;
    font: normal 20px Trebuchet MS, Arial, Helvetica, sans-serif;
    color: #fff;
    background: url(/static/speaker.gif) no-repeat;
    border: 0;
    cursor: pointer;
    width: 20px;
    height: 20px;
}

#btnListenPreview2 {
    float: right;
    margin: 10px 0 0px 0;
    font: normal 20px Trebuchet MS, Arial, Helvetica, sans-serif;
    color: #fff;
    background: url(/static/speaker.gif) no-repeat;
    border: 0;
    cursor: pointer;
    width: 20px;
    height: 20px;
}

#btnListenPreview3 {
    float: right;
    margin: 20px 0 0px 0;
    font: normal 20px Trebuchet MS, Arial, Helvetica, sans-serif;
    color: #fff;
    background: url(/static/speaker2.png) no-repeat;
    border: 0;
    cursor: pointer;
    width: 45px;
    height: 36px;
}

overflow-menu-header {
    font-size: 12pt;
    color: #777777;
    text-align: left;
    padding: 10px 5px 2px 5px;
}

h2 {
    font-size: 10pt !important;
    margin: 5px 0px 5px !important;
    line-height: normal !important;
    color: #777777 !important;
    text-align: left !important;
    padding: 2px 2px 10px 5px !important;
}

h2-small {
    font-size: 8pt !important;
    margin: 5px 0px 5px !important;
    line-height: normal !important;
    color: #777777 !important;
    text-align: left !important;
    padding: 2px 2px 10px 5px !important;
}

h3 {
    font-size: 8pt !important;
    margin: 2px 2px 2px !important;
    line-height: normal !important;
    color: #777777 !important;
    text-align: left !important;
    padding: 2px 2px 2px 2px !important;
}

h4 {
    font-size: 8pt !important;
    margin: 5px 5px 5px !important;
    line-height: normal !important;
    color: #777777 !important;
    text-align: center !important;
    padding: 2px 2px 10px 5px !important;
}

.radioButton {
    float: left;
    text-align: left;
    vertical-align: middle;
    font: normal 14px Trebuchet MS, Arial, Helvetica, sans-serif;
    color: #777777;
}

.cursor-default {
    cursor: default;
}

.cursor-pointer {
    cursor: pointer;
}

.sendButton {
    display: block;
    font-size: 16pt;
}

.H2OPopupPanel {
    border: 10px solid highlight;
}

.H2OMapPanel {
    padding-left: 0px;
}

.gwt-LoaderPanel {
    border: 0px solid;
}

/** Most GWT widgets already have a style name defined */
.gwt-DialogBox {
    width: 400px;
}

.gwt-DialogBox .Caption {
    background: #F1F1F1;
    padding: 4px 8px 4px 4px;
    cursor: default;
    color: #777777;
    font: bold 20px Trebuchet MS, Arial, Helvetica, sans-serif;
    border-bottom: 1px solid #bbbbbb;
    border-top: 1px solid #D2D2D2;
}


.dialogVPanel {
    margin: 5px;
}

.whiteBack {
    background: white;
}

.serverResponseLabelError {
    color: red;
}

/** Set ids using widget.getElement().setId("idOfElement") */
#closeButton {
    margin: 5px 5px 5px;
}

/** Set ids using widget.getElement().setId("idOfElement") */
#customCell {
    font-size: 26pt;
}

.cellListWidget {
    font-size: 12pt;
    margin: 15px 6px 6px;
}

.cellListEvenItem {
    cursor: pointer;
}

.cellListOddItem {
    cursor: pointer;
}

.cellListKeyboardSelectedItem {
    background: #ffc;
}

@sprite .cellListSelectedItem {
    gwt-image: 'cellListSelectedBackground';
    background-color: #628cd5;
    color: white;
    height: auto;
    overflow: visible;
}

.gwt-RadioButton {
    font-size: smaller;
}

.gwt-CheckBox {

}

.gwt-Tall-CheckBox {
    margin: 25px;
    height: 15px;
}

.gwt-RadioButtonx {
    font-size: 12pt;
    color: #777777;
    text-align: left;
    margin: 25px 0px 5px 25px;
    padding: 20px 2px 10px 5px;
}

.gwt-RadioButtonx-disabled {
    color: #888;
}

.gwt-CheckBoxx {
    font-size: 12pt;
    margin: 25px 0px 5px 50px;
    color: #777777;
    text-align: left;
    padding: 20px 2px 10px 5px;
}

.gwt-DecoratedStackPanel {
    border-bottom: 1px solid #bbbbbb;
}

.gwt-DecoratedStackPanel .gwt-StackPanelContent {
    border: 1px solid #bbbbbb;
    border-bottom: 0px;
    background: white;
    padding: 2px 2px 10px 5px;
}

.gwt-DecoratedStackPanel .gwt-StackPanelItem {
    cursor: pointer;
    cursor: hand;
}

.gwt-DecoratedStackPanel .stackItemTopLeft,
.gwt-DecoratedStackPanel .stackItemTopRight {
    height: 6px;
    width: 6px;
    zoom: 1;
}

.gwt-DecoratedStackPanel .stackItemTopLeft {
    border-left: 1px solid #bbbbbb;
    background: #000066 url(images/corner.png) no-repeat 0px -49px;
    -background: #000066 url(images/corner_ie6.png) no-repeat 0px -49px;
}

.gwt-DecoratedStackPanel .stackItemTopRight {
    border-right: 1px solid #bbbbbb;
    background: #000066 url(images/corner.png) no-repeat -6px -49px;
    -background: #000066 url(images/corner_ie6.png) no-repeat -6px -49px;
}

.gwt-DecoratedStackPanel .stackItemTopLeftInner,
.gwt-DecoratedStackPanel .stackItemTopRightInner {
    width: 1px;
    height: 1px;
}

.gwt-DecoratedStackPanel .stackItemTopCenter {
    background: url(images/hborder.png) 0px -21px repeat-x;
}

.gwt-DecoratedStackPanel .stackItemMiddleLeft {
    background: #000066 url(images/hborder.png) repeat-x 0px -989px;
    border-left: 1px solid #bbbbbb;
}

.gwt-DecoratedStackPanel .stackItemMiddleLeftInner,
.gwt-DecoratedStackPanel .stackItemMiddleRightInner {
    width: 1px;
    height: 1px;
}

.gwt-DecoratedStackPanel .stackItemMiddleRight {
    background: #000066 url(images/hborder.png) repeat-x 0px -989px;
    border-right: 1px solid #bbbbbb;
}

.gwt-DecoratedStackPanel .stackItemMiddleCenter {
    font-weight: bold;
    font-size: 1.3em;
    background: #000066 url(images/hborder.png) repeat-x 0px -989px;
}

.gwt-DecoratedStackPanel .gwt-StackPanelItem-first .stackItemTopRight,
.gwt-DecoratedStackPanel .gwt-StackPanelItem-first .stackItemTopLeft {
    border: 0px;
    background-color: white;
}

.gwt-DecoratedStackPanel .gwt-StackPanelItem-below-selected .stackItemTopLeft,
.gwt-DecoratedStackPanel .gwt-StackPanelItem-below-selected .stackItemTopRight {
    background-color: white;
}

html > body .gwt-DecoratedStackPanel {
}

* html .gwt-DecoratedStackPanel .stackItemTopLeftInner,
* html .gwt-DecoratedStackPanel .stackItemTopRightInner {
    width: 6px;
    height: 6px;
    overflow: hidden;
}

.cw-StackPanelHeader {
    padding-left: 7px;
    font-weight: bold;
    font-size: 1.4em;
}

.customPanel {
    border-style: solid;
    border-width: 1px;
    border-color: #C0C0C0;
    margin: 5px;
}

table.stats {
    font-family: verdana, arial, sans-serif;
    font-size: 11px;
    color: #777777;
    border-width: 1px;
    border-color: #666666;
    border-collapse: collapse;
}

table.stats th {
    border-width: 1px;
    padding: 5px;
    border-style: solid;
    border-color: #666666;
    background-color: #D4D0C7;
}

table.stats td {
    border-width: 1px;
    padding: 5px;
    border-style: solid;
    border-color: #666666;
    background-color: #D4D0C7;
    text-align: center;
}

/** Some rules for the GWTUpload project which we've embedded. */


/*
 * Thumbnails
 */
.tumbnailBox .middleCenter {
    padding: 0px 0px;
}

.tumbnailBox {
    float: left;
    width: 55px;
    margin-top: 10px;
    margin-left: 1px;
    margin-right: 1px;
}

.thumbnailsBox .middleCenter,
.mutiUploadBox .middleCenter,
.simpleUploadBox .middleCenter {
    width: 950px;
}


.thumbsContainer, .thumbsContainer img {
    border: 1px solid #DDDDDD;
}

.thumbsContainer img {
    margin: 3px;
}

.thumbsContainer, .thumbsContainer img {
    -moz-border-radius-bottomleft: 6px;
    -moz-border-radius-bottomright: 6px;
    -moz-border-radius-topleft: 6px;
    -moz-border-radius-topright: 6px;
}

.upldContainer {
    margin-top: 6px;
    margin-bottom: 10px;
}

.backPanel, .langPanel {
    cursor: pointer;
    margin-left: auto;
    margin-right: 0px;
}

.backPanel, .langPanel div {
    padding: 10px;
    color: blue;
    font-size: 12px;
    float: left;
    text-decoration: underline;
}

.customButton {
    background: url(images/chooseFile.png);
    font-size: 0px;
    color: transparent;
}

.customButton-over {
    background: url(images/chooseFileO.png);
}


.h2oCenterImage {
    display: block;
    margin-left: auto;
    margin-right: auto;
    vertical-align: middle;
}


.h2oPortalWidgetLabel {
    font-size: 16px;
    font-family: 'Helvetica Neue', Helvetica, sans-serif;
    color: #fff;
    border: 0;
    text-align: left;
    padding: 1px 0 0 15px;
}

.h2oPortalWidgetTabOn {
    font-size: 16px;
    font-family: 'Helvetica Neue', Helvetica, sans-serif;
    color: #0866c6;
    background-color: #fff;
    border: 0;
    text-align: left;
    cursor: pointer;
}

.h2oPortalWidgetTabOff {
    font-size: 16px;
    font-family: 'Helvetica Neue', Helvetica, sans-serif;
    color: #fff;
    background-color: #0866c6;
    border-right: 1px solid #fff;
    text-align: left;
    cursor: pointer;
}

.h2oPortalLabelOn {
    font-size: 16px;
    font-family: 'Helvetica Neue', Helvetica, sans-serif;
    color: #0866c6;
    background-color: #fff;
    text-align: left;
    padding: 10px 0 0 15px;
}

.h2oPortalLabelOff {
    font-size: 16px;
    font-family: 'Helvetica Neue', Helvetica, sans-serif;
    color: #fff;
    background-color: #0866c6;
    text-align: left;
    padding: 10px 0 0 15px;
}

/*** PORTAL LOGIN PAGE ***/
.h2oPortalTitle {
    margin: 15px 0;
    color: rgba(255, 255, 255, 0.5);
    font-family: 'RobotoRegular', 'Helvetica Neue', Helvetica, sans-serif;
    font-size: 11px;
}

.h2oMobilePortalTitle {
    margin: 0 0 0 5px;
    padding: 0 0 12px 0;
    color: white;
    float: left;
    text-align: left;
    font-family: 'RobotoRegular', 'Helvetica Neue', Helvetica, sans-serif;
    font-size: 22px;
}

.h2oMobilePortalImage {
    margin: 0 0 0 0;
    padding: 0 0 0 0;
    vertical-align: bottom;
}

.h2oMobilePortalHeader {
    margin: 0 0 0 0;
    padding: 0 0 0 0;
}

.h2oComplianceExtraStyle {
    margin-top: 0px !important;
}

.h2oPortalTitleWhiteBG {
    margin: 15px 0 5px 5px;
    padding: 0px 2px 2px 5px;
    color: rgba(8, 102, 198, 1);
    font-family: 'RobotoRegular', 'Helvetica Neue', Helvetica, sans-serif;
    font-size: 11px;
}

.h2oPortalTitleWhiteBGBold {
    margin: 15px 0 5px 5px;
    padding: 0px 2px 2px 5px;
    color: rgba(8, 102, 198, 1);
    font-family: 'RobotoRegular', 'Helvetica Neue', Helvetica, sans-serif;
    font-size: 12px;
    font-weight: bold;
}

.h2oPortalTitleWhiteBGTite {
    margin: 5px 0 3px 5px;
    padding: 0px 2px 2px 5px;
    color: rgba(8, 102, 198, 1);
    font-family: 'RobotoRegular', 'Helvetica Neue', Helvetica, sans-serif;
    font-size: 11px;
}

.h2oPortalSelect {
    border: 1px solid #0866c6;
    color: rgba(8, 102, 198, 1);
    background-color: #fff;
    padding: 5px 5px 5px 5px;
    font-family: 'RobotoRegular', 'Helvetica Neue', Helvetica, sans-serif;
    font-size: 11px;
}

.h2oPortalTextArea {
    border: 3px solid #0866c6;
    padding: 5px;
    font-family: 'RobotoRegular', 'Helvetica Neue', Helvetica, sans-serif;
    font-size: 12px;
    color: #0866c6;
}

.h2oPortalScrollbar {
    overflow: scroll !important;
    overflow-y: scroll;
    overflow: -moz-scrollbars-vertical;
    background-color: lightblue;
}

.h2oPortalPopupNoBorder {
    border: none !important;
}

.h2oPortalCoverupPanel {
    outline: none;
    display: table-cell;
    vertical-align: middle;
    text-align: center;
    border-style: solid;
    border-width: thick;
    border-color: red;
    background-color: #fff;
    opacity: 1;
    -moz-opacity: 1;
}

.h2oPortalHide {
    opacity: 0;
    -moz-opacity: 0;
    filter: alpha(opacity:0);
}

.trick_container {
    position: relative;
    width: 100%;
    height: 45px;
}

.trick_pic {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.trick_input {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
    width: 100%;
    height: 100%
}

.h2oPortalImage {
    display: block;
    padding: 5px 5px 5px 5px;
}

.h2oPortalButton {
    display: block;
    border: 1px solid #0c57a3;
    padding: 5px 5px 5px 5px;
    background: #0972dd;
    width: 150px;
    height: 40px;
    color: #fff;
    font-size: 16px;
    text-align: center;
}

.h2oPortalButton:disabled {
    display: block;
    border: 1px solid #0c57a3;
    padding: 5px 5px 5px 5px;
    background: #0972dd;
    width: 150px;
    height: 40px;
    color: #ecf0eb;
    font-size: 16px;
    text-align: center;
    cursor: default !important;
}

.h2oPortalButtonSmall {
    display: block;
    border: 1px solid #0c57a3;
    padding: 3px 3px 3px 3px;
    background: #0972dd;
    min-width: 50px;
    height: 20px;
    color: #fff;
    font-size: 10px;
    text-align: center;
    margin-left: 5px;
}

.h2oPortalButtonSmall:disabled {
    display: block;
    border: 1px solid #0c57a3;
    padding: 3px 3px 3px 3px;
    background: #c0c0c0;
    min-width: 50px;
    height: 20px;
    color: #0972dd;
    font-size: 10px;
    text-align: center;
    margin-left: 5px;
    cursor: default !important;
}

.h2oPortalButtonOverlay {
    position: relative;
    top: -20px;
    display: block;
    margin: auto;
}


.h2oPortalMessage {
    margin: 0px 0;
    color: #fff;
    font-family: 'RobotoRegular', 'Helvetica Neue', Helvetica, sans-serif;
    font-size: 20px;
    display: inline !important;
}

.h2oPortalloginpanel {
    position: absolute;
    top: 40%;
    left: 50%;
    height: 300px;
}

.h2oPortalloginpanelinner {
    position: relative;
    top: -150px;
    left: -50%;
}

.h2oPortalloginpanelinner .logo {
    text-align: center;
    padding: 20px 0;
}

.h2oPortalloginpanel .pull-right {
    margin-top: 11px;
    color: #ddd;
    font-size: 11px;
    font-family: Helvetica, sans-serif;
}

.h2oPortalloginpanel .pull-right a {
    color: #ddd;
}

.h2oPortalinputInteger {
    border: 1px solid #0866c6;
    color: #0866c6;
    background-color: #fff;
    overflow: hidden;
    padding: 5px 0px 5px 5px;
    font-family: 'RobotoRegular', 'Helvetica Neue', Helvetica, sans-serif;
    font-size: 11px;
}

.h2oPortalinputwrapper {
    margin-bottom: 10px;
    border: 0;
    padding: 10px;
    background: #fff;
    width: 250px;
}

.h2oPortalinputwrapper input {
    border: 0;
    padding: 10px;
    background: #fff;
    width: 250px;
}

.h2oPortalinputwrapper input:active, .inputwrapper input:focus {
    background: #fff;
    border: 0;
}

.h2oPortalinputwrapperWhiteBG {
    font-size: 12pt;
    margin-bottom: 10px;
    margin-left: 10px;
    border: 1px solid #0866c6;
    padding: 5px 5px 5px 5px;
    background: #fff;
    color: rgba(8, 102, 198, 1);
}

.h2oPortalinputwrapperWhiteBG input {
    border: 1px solid #0866c6;
    padding: 10px;
    background: #fff;
    width: 250px;
    color: rgba(8, 102, 198, 1);
}

.h2oPortalinputwrapperWhiteBG input:active, .inputwrapper input:focus {
    background: #fff;
    border: 1px solid #0866c6;
    color: rgba(8, 102, 198, 1);
}

.h2oPortalinputwrapperGreyBG {
    font-size: 12pt;
    margin-bottom: 10px;
    margin-left: 10px;
    border: 1px solid #0866c6;
    padding: 5px 5px 5px 5px;
    background: #f0f0f0;
    color: rgba(8, 102, 198, 1);
}

.h2oPortalinputwrapperGreyBG input {
    border: 1px solid #0866c6;
    padding: 10px;
    background: #f0f0f0;
    width: 250px;
    color: rgba(8, 102, 198, 1);
}

.h2oPortalinputwrapperGreyBG input:active, .inputwrapper input:focus {
    background: #f0f0f0;
    border: 1px solid #0866c6;
    color: rgba(8, 102, 198, 1);
}

.h2oPortalLabelWhiteBG {
    font-size: 14pt;
    margin-left: 5px;
    padding: 0px 2px 2px 5px;
    color: rgba(8, 102, 198, 1);
}

.h2oPortalLabelWhiteBGTite {
    font-size: 12pt;
    margin-left: 5px;
    padding: 0px 2px 2px 5px;
    color: rgba(8, 102, 198, 1);
}

.h2oPortalCheckboxWhiteBG {
    font-size: 12pt;
    margin-left: 5px;
    padding: 0px 2px 2px 5px;
    color: rgba(8, 102, 198, 1);
}

.h2oPortalCheckboxWhiteBGTite {
    font-size: 10pt;
    margin-left: 5px;
    padding: 0px 2px 2px 5px;
    color: rgba(8, 102, 198, 1);
}

.h2oPortalNotificationPanel {
    font-size: 12pt;
    margin: 0 10px 0 10px;
    padding: 0 10px 0 0;
    vertical-align: top;
}

.h2oPortalNotificationMsg {
    font-size: 16pt;
    margin: 0 10px 0 10px;
    padding: 0 10px 0 0;
    text-align: left;
    vertical-align: top;
}

.h2oPortalinputwrapperbutton {
    display: block;
    border: 1px solid #0c57a3;
    padding: 10px;
    background: #0972dd;
    width: 100%;
    color: #fff;
    text-transform: uppercase;
}

.h2oPortalinputwrapperbutton:focus {
    background: #1e82e8;
    border: 1px solid #0c57a3;
}

.h2oPortalinputwrapperbutton:active {
    background: #1e82e8;
    border: 1px solid #0c57a3;
}

.h2oPortalinputwrapperbutton:hover {
    background: #1e82e8;
    border: 1px solid #0c57a3;
}

.h2oPortalinputwrapper label {
    display: inline-block;
    margin-top: 10px;
    color: rgba(255, 255, 255, 0.8);
    font-size: 11px;
    vertical-align: middle;
    font-weight: normal;
}

.h2oPortalinputwrapper label input {
    width: auto;
    margin: -3px 5px 0 0;
    vertical-align: middle;
}

.h2oPortalinputwrapper .remember {
    padding: 0;
    background: none;
}

.h2oPortallogin-alert {
    font-size: 14px;
    text-align: center;
    padding: 5px 0;
    border: 0;
    background: none repeat scroll 0 0 #F6EDBA;
    border-color: #E4BF7F;
    color: #9C6C38;
    margin-bottom: 15px;
    width: 250px;
    font-family: 'RobotoRegular', 'Helvetica Neue', Helvetica, sans-serif;
}

.h2oPortalloginfooter_leftWhiteBG {
    font-size: 11px;
    color: rgba(8, 102, 198, 1);
    float: left;
    text-decoration: none;
    margin-left: 5px;
    text-align: left;
    font-family: arial, sans-serif !important;
    padding: 5px 0 0 5px;
}

.h2oPortalloginfooter_left {
    font-size: 11px;
    color: #ddd;
    float: left;
    text-decoration: none;
    text-align: left;
    font-family: arial, sans-serif !important;
    padding: 5px 0 0 3px;
}

.h2oPortalloginfooter_left:hover {
    text-decoration: underline;
    color: #ddd;
}

.h2oPortalloginfooter_right {
    font-size: 11px;
    color: #ddd;
    float: right;
    text-decoration: none;
    text-align: right;
    font-family: arial, sans-serif !important;
    padding: 5px 0;
}

.h2oPortalloginfooter_right:hover {
    text-decoration: underline;
    color: #ddd;
}

.h2oPortalLegal {
    font-size: 12px;
    font-family: Helvetica, sans-serif;
    background: #0866c6;
    color: #fff !important;
}

h1.h2oPortalLegal {
    font-size: 18px;
    font-family: Helvetica, sans-serif;
    background: #0866c6;
    color: #fff !important;
}

h2.h2oPortalLegal {
    font-size: 16px;
    font-family: Helvetica, sans-serif;
    background: #0866c6;
    color: #fff !important;
}

h3.h2oPortalLegal {
    font-size: 14px;
    font-family: Helvetica, sans-serif;
    background: #0866c6;
    color: #fff !important;
}

h4.h2oPortalLegal {
    font-size: 12px;
    font-family: Helvetica, sans-serif;
    background: #0866c6;
    color: #fff !important;
}

h5.h2oPortalLegal {
    font-size: 12px;
    font-family: 'LatoBold', 'Helvetica Neue', Helvetica, sans-serif;
    background: #0866c6;
    color: #fff !important;
    padding: 2px 0 2px 0;
    margin: 0px;
    font-weight: normal;
}

a.h2oPortalLegal {
    font-size: 11px;
    font-family: Helvetica, sans-serif;
    background: #0866c6;
    color: #fff;
    text-decoration: underline;
}

p.h2oPortalLegal {
    text-align: justify;
}

.h2oPortalPanelbutton {
    display: block;
    border: 1px solid #0c57a3;
    padding: 5px 5px 5px 5px;
    background: #0972dd;
    width: 100%;
    color: #fff;
    font-size: 11px;
    text-align: center;
}

.h2oPortalPanelbutton:focus {
    background: #1e82e8;
    border: 1px solid #0c57a3;
}

.h2oPortalPanelbutton:active {
    background: #1e82e8;
    border: 1px solid #0c57a3;
}

.h2oPortalPanelbutton:hover {
    background: #1e82e8;
    border: 1px solid #0c57a3;
}

.h2oPortalHeaderbutton {
    display: block;
    border: 1px solid #0c57a3;
    padding: 5px 5px 5px 5px;
    background: #0972dd;
    width: 100%;
    color: #fff;
    font-size: 11px;
    text-align: left;
}

.h2oPortalHeaderbutton:focus {
    background: #1e82e8;
    border: 1px solid #0c57a3;
}

.h2oPortalHeaderbutton:active {
    background: #1e82e8;
    border: 1px solid #0c57a3;
}

.h2oPortalHeaderbutton:hover {
    background: #1e82e8;
    border: 1px solid #0c57a3;
}

.h2oPortalMobile {
    font-size: 18px;
    font-family: Helvetica, sans-serif;
    background: #fff;
    color: #0866c6;
    padding: 10px 5px 5px 10px;
}

h1.h2oPortalMobile {
    font-size: 18px;
    font-family: Helvetica, sans-serif;
    background: #fff;
    color: #999;
}

h2.h2oPortalMobile {
    font-size: 16px;
    font-family: Helvetica, sans-serif;
    background: #fff;
    color: #999;
}

h3.h2oPortalMobile {
    font-size: 15px;
    font-family: Helvetica, sans-serif;
    background: #fff;
    color: #999;
}

h4.h2oPortalMobile {
    font-size: 12px;
    font-family: Helvetica, sans-serif;
    background: #fff;
    color: #999;
}

h5.h2oPortalMobile {
    font-size: 10px;
    font-family: Helvetica, sans-serif;
    background: #fff;
    color: #999;
}

.h2oPortalMobileTite {
    font-size: 18px;
    font-family: Helvetica, sans-serif;
    background: #fff;
    color: #0866c6;
    padding: 8px 5px 0px 10px;
}

h1.h2oPortalMobileTite {
    font-size: 18px;
    font-family: Helvetica, sans-serif;
    background: #fff;
    color: #999;
}

h2.h2oPortalMobileTite {
    font-size: 16px;
    font-family: Helvetica, sans-serif;
    background: #fff;
    color: #999;
}

h3.h2oPortalMobileTite {
    font-size: 15px;
    font-family: Helvetica, sans-serif;
    background: #fff;
    color: #999;
}

h4.h2oPortalMobileTite {
    font-size: 12px;
    font-family: Helvetica, sans-serif;
    background: #fff;
    color: #999;
}

h5.h2oPortalMobileTite {
    font-size: 10px;
    font-family: Helvetica, sans-serif;
    background: #fff;
    color: #999;
}

/** CSS rules for the 'facebook-style' tag editor widget  */
.auto_suggest {
    z-index: 20;
    background-color: white;
    padding: 10px;
    width: 400px;
    height: 230px;
}

.original-token-input {
    width: 396px;
    border: 1px solid #8496ba;
    font-size: 12px;
    font-family: Verdana;
    padding: 4px 8px;
}

ul.token-input-list-facebook {
    overflow: hidden;
    height: auto !important;
    height: 1%;
    width: 400px;
    border: 1px solid #8496ba;
    cursor: text;
    font-size: 12px;
    font-family: Verdana;
    min-height: 1px;
    z-index: 999;
    margin: 0;
    padding: 0;
    background-color: #fff;
}

ul.token-input-list-facebook {
    list-style-type: none;
}

ul.token-input-list-facebook li input {
    border: 0;
    width: 100px;
    padding: 3px 8px;
    background-color: white;
    margin: 2px 0;
}

li.token-input-token-facebook {
    overflow: hidden;
    height: auto !important;
    height: 1%;
    margin: 3px;
    padding: 1px 3px;
    background-color: #eff2f7;
    color: #000;
    cursor: default;
    border: 1px solid #ccd5e4;
    font-size: 11px;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    float: left;
}

li.token-input-token-facebook p {
    display: inline;
    padding: 0;
    margin: 0;
}

li.token-input-token-facebook span {
    color: #a6b3cf;
    margin-left: 5px;
    font-weight: bold;
    cursor: pointer;
}

li.token-input-selected-token-facebook {
    background-color: #5670a6;
    border: 1px solid #3b5998;
    color: #fff;
}

li.token-input-input-token-facebook {
    float: left;
}

/** end CSS rules for the tag editor widget  */


/** begin CSS rules for FlexTable styling used in Mobile Portal  */
.FlexTable {
    margin-left: 5px;
    padding: 0px 2px 2px 5px;
    background-color: #F0F0F0;
}

.FlexTable-OddRow {
    background-color: #fff;
}

.FlexTable-EvenRow {
    background-color: #F0F0F0;
}


.FlexTable-ColumnLabel {
    color: white;
    padding: 3px;
}

.FlexTable-ColumnLabelCell {
    background-color: #3366FF;
    border-width: 0 0 1px 0;
    border-style: solid;
    border-color: white;
    margin: 0;
    padding: 5px;
    text-align: left;
}

.FlexTable-Cell {
    border-width: 0px 0px 0px 1px;
    border-style: solid;
    border-color: white;
    padding: 5px;
    color: #3366FF;
}

.h2oMobilePortalLabelTop {
    font-size: 8px;
    font-family: 'Helvetica Neue', Helvetica, sans-serif;
    color: #0866c6;
    border: 0;
    text-align: left;
    padding: 10px 0px 0px 10px;
}

.h2oMobilePortalLabel {
    font-size: 8px;
    font-family: 'Helvetica Neue', Helvetica, sans-serif;
    color: #0866c6;
    border: 0;
    text-align: left;
    padding: 0px 0px 0px 10px;
}

.h2oMobilePortalText {
    font-size: 12px;
    font-family: 'Helvetica Neue', Helvetica, sans-serif;
    font-weight: bold;
    color: #0866c6;
    border: 0;
    text-align: left;
    padding: 0px 0px 0px 10px;
    margin-top: -7px;
    overflow: hidden;
}

.h2oMobilePortalExtras {
    font-size: 16px;
    font-family: 'Helvetica Neue', Helvetica, sans-serif;
    font-weight: bold;
    color: #0866c6;
    border: 0;
    text-align: left;
    width: 100%;
    padding: 15px 0px 15px 0px;
}

.h2oMobilePortalList {
    font-size: 16px;
    font-family: 'Helvetica Neue', Helvetica, sans-serif;
    font-weight: bold;
    color: #0866c6;
    text-align: left;
    verticle-align: middle;
    padding: 5px 0px 5px 0px;
    margin: 0px 0px 10px 0px;
}

.h2oMobilePortalButton {
    padding: 10px 10px 10px 10px;
    font-size: 16px;
    font-family: 'Helvetica Neue', Helvetica, sans-serif;
    font-weight: bold;
    margin: 5px 5px 5px 0px;
    border-bottom-color: rgb(128, 128, 128);
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
    border-bottom-style: none;
    border-bottom-width: 0px;
    border-collapse: separate;
    border-image-outset: 0px;
    border-image-repeat: stretch;
    border-image-slice: 100%;
    border-image-source: none;
    border-image-width: 1;
    border-left-color: rgb(128, 128, 128);
    border-left-style: none;
    border-left-width: 0px;
    border-right-color: rgb(128, 128, 128);
    border-right-style: none;
    border-right-width: 0px;
    border-top-color: rgb(128, 128, 128);
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
    border-top-style: none;
    border-top-width: 0px;
    background: rgb(216, 216, 216);
    color: rgb(12, 99, 254);
    display: inline-block;
    overflow-x: hidden;
    overflow-y: hidden;
    position: relative;
    text-align: center;
    text-overflow: ellipsis;
    white-space: nowrap;
}

button:disabled {
    color: #808080;
    cursor: default !important;
}

.h2oMobilePortalLabelTight {
    font-size: 12px;
    font-family: 'Helvetica Neue', Helvetica, sans-serif;
    font-weight: bold;
    color: #000;
    border: 0;
    text-align: left;
    padding: 8px 0px 0px 0px;
}

.h2oMobilePortalTextTight {
    font-size: 16px;
    font-family: 'Helvetica Neue', Helvetica, sans-serif;
    font-weight: bold;
    color: #000;
    border: 0;
    text-align: left;
    padding: 0px 0px 8px 0px;
    overflow: hidden;
}

.h2oMobilePortalExtrasTight {
    font-size: 16px;
    font-family: 'Helvetica Neue', Helvetica, sans-serif;
    font-weight: bold;
    color: #000;
    border: 0;
    text-align: left;
    width: 100%;
    padding: 12px 0px 12px 0px;
}

.h2oMobilePortalButtonTight {
    padding: 8px 8px 8px 8px;
    font-size: 16px;
    font-family: 'Helvetica Neue', Helvetica, sans-serif;
    font-weight: bold;
    margin: 5px 5px 5px 0px;
    border-bottom-color: rgb(128, 128, 128);
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
    border-bottom-style: none;
    border-bottom-width: 0px;
    border-collapse: separate;
    border-image-outset: 0px;
    border-image-repeat: stretch;
    border-image-slice: 100%;
    border-image-source: none;
    border-image-width: 1;
    border-left-color: rgb(128, 128, 128);
    border-left-style: none;
    border-left-width: 0px;
    border-right-color: rgb(128, 128, 128);
    border-right-style: none;
    border-right-width: 0px;
    border-top-color: rgb(128, 128, 128);
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
    border-top-style: none;
    border-top-width: 0px;
    background: rgb(216, 216, 216);;
    color: rgb(12, 99, 254);
    display: inline-block;
    overflow-x: hidden;
    overflow-y: hidden;
    position: relative;
    text-align: center;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.h2oMobilePortalListTight {
    font-size: 16px;
    font-family: 'Helvetica Neue', Helvetica, sans-serif;
    font-weight: bold;
    color: #000;
    text-align: left;
    verticle-align: middle;
    padding: 4px 0px 4px 0px;
    margin: 0px 0px 8px 0px;
}

.h2oLargeLabel {
    padding: 4px 4px 4px 4px;
    color: #777777;
    font: bold 20px Trebuchet MS, Arial, Helvetica, sans-serif;
}

/** end CSS rules for FlexTable styling used in Mobile Portal  */

.h2oMapLayersTitle {
    font-size: 18px;
    font-family: 'Arial Unicode MS', Arial, sans-serif;;
    font-weight: bold;
    color: #777777;
    border: 0;
    text-align: left;
    padding: 2px 22px 0px 5px;
    margin: 5px 0px 5px;
    overflow: hidden;
}

.h2oMapLayersItem {
    font-size: 16px !important;
    font-family: 'Arial Unicode MS', Arial, sans-serif;;
    color: #777777;
    border: 0;
    text-align: left;
    padding: 2px 2px 0px 5px;
    /** margin: 5px 5px 5px 5px; */
    overflow: hidden;
}


/* Always set the map height explicitly to define the size of the div
 * element that contains the map. */
#gmap {
    height: 100%;
}

/* The location pointed to by the popup tip. */
.popup-tip-anchor {
    height: 0;
    position: absolute;
    /* The max width of the info window. */
    width: 450px;
}

/* The bubble is anchored above the tip. */
.popup-bubble-anchor {
    position: absolute;
    width: 100%;
    bottom: /* TIP_HEIGHT= */ 8px;
    left: 0;
}

/* Draw the tip. */
.popup-bubble-anchor::after {
    content: "";
    position: absolute;
    display: none;
    top: 0;
    left: 0;
    /* Center the tip horizontally. */
    transform: translate(-50%, 0);
    /* The tip is a https://css-tricks.com/snippets/css/css-triangle/ */
    width: 0;
    height: 0;
    /* The tip is 8px high, and 12px wide. */
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-top: /* TIP_HEIGHT= */ 8px solid white;
}

/* The popup bubble itself. */
.popup-bubble-content {
    position: absolute;
    top: 0;
    left: 0;
    transform: translate(-50%, -100%);
    /* Style the info window. */
    background-color: white;
    padding: 10px;
    border-radius: 5px;
    font-family: sans-serif;
    overflow-y: auto;
    max-height: 60px;
    box-shadow: 0px 2px 10px 1px rgba(0, 0, 0, 0.5);
    font-size: 14px;
    font-family: Arial Unicode MS, Arial, sans-serif;
}

/* some styles for iscroll.js */
#iScrollWrapper {
    position: relative;
    z-index: 1;
    top: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    background: white;
    overflow: hidden;
}

#iScrollScroller {
    position: relative;
    z-index: 1;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    width: 100%;
    -webkit-transform: translateZ(0);
    -moz-transform: translateZ(0);
    -ms-transform: translateZ(0);
    -o-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-text-size-adjust: none;
    -moz-text-size-adjust: none;
    -ms-text-size-adjust: none;
    -o-text-size-adjust: none;
    text-size-adjust: none;
}

.iScrollHorizontalScrollbar {
    position: absolute;
    z-index: 9999;
    height: 16px;
    left: 2px;
    right: 2px;
    bottom: 2px;
    overflow: hidden;
}

.iScrollHorizontalScrollbar.iScrollBothScrollbars {
    right: 18px;
}

.iScrollVerticalScrollbar {
    position: absolute;
    z-index: 9999;
    width: 16px;
    bottom: 2px;
    top: 2px;
    right: 2px;
    overflow: hidden;
}

.iScrollVerticalScrollbar.iScrollBothScrollbars {
    bottom: 18px;
}

.iScrollIndicator {
    position: absolute;
    background: #cc3f6e;
    border-width: 1px;
    border-style: solid;
    border-color: #EB97B4 #7C2845 #7C2845 #EB97B4;
    border-radius: 8px;
}

.iScrollHorizontalScrollbar .iScrollIndicator {
    height: 100%;
    background: -moz-linear-gradient(left, #cc3f6e 0%, #93004e 100%);
    background: -webkit-linear-gradient(left, #cc3f6e 0%, #93004e 100%);
    background: -o-linear-gradient(left, #cc3f6e 0%, #93004e 100%);
    background: -ms-linear-gradient(left, #cc3f6e 0%, #93004e 100%);
    background: linear-gradient(to right, #cc3f6e 0%, #93004e 100%);
}

.iScrollVerticalScrollbar .iScrollIndicator {
    width: 100%;
    background: -moz-linear-gradient(top, #cc3f6e 0%, #93004e 100%);
    background: -webkit-linear-gradient(top, #cc3f6e 0%, #93004e 100%);
    background: -o-linear-gradient(top, #cc3f6e 0%, #93004e 100%);
    background: -ms-linear-gradient(top, #cc3f6e 0%, #93004e 100%);
    background: linear-gradient(to bottom, #cc3f6e 0%, #93004e 100%);
}


/** begin CSS rules for com.h2oanalytics.widgets  */
.cursor-default {
    cursor: default;
}

.cursor-pointer {
    cursor: pointer;
}

.simple-entity-selection-box__entity-label {
    border: 2px solid cornflowerblue;
    font-size: 18px;
}

.input-label input.invalid {
    border: solid red;
}

.time-picker-input-label select.invalid {
    border: solid red;
}

.right-align-text {
    text-align: right !important;
}

.date-cell__undefined-no-style {
    opacity: 0;
}

.gwt-PopupPanelGlass {
    opacity: 0 !important;
}

.date-cell__undefined {
    border: dashed cornflowerblue !important;
    background-color: lightyellow !important;
    color: lightyellow !important;
}

.info-widget__name-label {
    padding-right: 10px;
    font-weight: bold;
}

.filter-search-container {
    margin-left: 5px;
    width: 250px;
    border-radius: 5px;
}

.filter-search-box {
    width: 250px;

    border-radius: 26px;
    border: 1px solid #ada9a9;
    background-image: url(static/outline_search_black_24dp.png);
    background-size: contain;
    background-repeat: no-repeat;
    outline: 0;
    text-indent: 20px;
}

.admin-panel__top-button-row .filter-search-box {
    margin-left: 10px;
    margin-top: 3px;
    margin-right: 5px;
}

.consumption-filter-panel__params-area {
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
}

.consumption-filter-panel__predicate-box {
    display: flex;
    flex-direction: column;
}

.consumption-filter-panel__predicate {
    margin-top: 20px;
    display: flex;
    justify-content: start;
}

.consumption-filter-panel__predicate select {
    margin-left: 20px;
}

.filter-search-label {
    font-weight: bold;
}

.admin-panel__top-button-row {
    margin-top: 3px;
    position: initial !important;
    align-items: start;
}

.admin-panel__top-button-row tr {
    display: flex;
    align-items: start;
}

.admin-panel__action-buttons-detailview {
    position: initial !important;
}

.admin-panel__top-button-row .gwt-PushButton,
.admin-panel__action-buttons-detailview .gwt-PushButton,
.consumption-filter-panel .gwt-PushButton {
    border: none;
    background: none;
}

.consumption-filter-panel .gwt-PushButton {
    padding: 0px;
}

.heatmap-panel__buttons-panel .gwt-PushButton {
    border: none;
    background: none;
}

.heatmap-chart-holder .highcharts-title {
    color: #333333 !important;
    font-size: 15px !important;
    fill: #333333 !important;
}

.file-upload__upload {
    margin-left: 40px;
}

.detail-view-grid .input-label {
    width: 100%;
}

.detail-view-grid__row select.gwt-ListBox, .detail-view-grid__row .input-label > input, .detail-view-grid__row .input-label textarea, .detail-view-grid__row .gwt-PasswordTextBox {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.detail-view-grid__row_2 .input-label textarea {
    float: right;
}

.detail-view-grid__row select.gwt-ListBox {
    width: 219px;
}

.detail-view-grid__row .input-label input[type="text"], .detail-view-grid__row .input-label input[type="password"] {
    width: 219px;
}

.detail-view-grid__row_2 .input-label-clipboard input, .detail-view-grid__row_2 .input-label-secret input {
    width: 199px !important;
}

.toast {
    border-radius: 6px;
    top: 0;
    width: auto;
    clear: both;
    margin-top: 10px;
    position: relative;
    max-width: 100%;
    height: auto;
    min-height: 48px;
    line-height: 1.5em;
    word-break: break-all;
    background-color: #323232;
    padding: 10px 25px;
    font-size: 1.1rem;
    font-weight: 300;
    color: #fff;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

#toast-container {
    position: fixed;
    left: 800px;
    bottom: 20px;
}


#email-distro-text-area-id, #crew-members-text-area-id {
    width: 219px;
    height: 90px;
}

.detail-view-grid__row .input-label .gwt-PushButton.secret-key-copy {
    float: right;
    position: relative;
}

.time-picker-input-label .select-container select {
    width: 55px;
}

.detail-view-grid__row_1 .time-picker-input-label .select-container, .detail-view-grid__row_1 .input-label input, .detail-view-grid__row_1 .list-box-nullable .gwt-ListBox, .detail-view-grid__row_1 .gwt-CheckBox input {
    position: absolute;
    left: 25%;
}

.detail-view-grid__row_1 .time-picker-input-label .select-container, .detail-view-grid__row_1 .input-label input, .detail-view-grid__row_1 .list-box-nullable .gwt-ListBox, .detail-view-grid__row_1 .gwt-CheckBox input {
    position: absolute;
    left: 25%;
}

.detail-view-grid__row_1 .time-picker-input-label .select-container, .detail-view-grid__row_1 .input-label input, .detail-view-grid__row_1 .list-box-nullable .gwt-ListBox, .detail-view-grid__row_1 .gwt-CheckBox input {
    position: absolute;
    left: 25%;
}

.detail-view-grid__row_2 .input-label input, .detail-view-grid__row_2 .list-box-nullable .gwt-ListBox, .detail-view-grid__row_2 .gwt-CheckBox input {
    position: relative;
    float: right;
}

.gwt-PushButton.secret-key-copy {
    padding: 0;
}

.detail-view-grid .list-box-nullable {
    width: 100%;
}

.detail-view-grid__row_2 td + td label, .detail-view-grid__row_2 td + td .gwt-Label {
    margin-left: 40px;
}

.detail-view-grid__row_2 label, .detail-view-grid__row_2 .gwt-Label {
    margin-right: 250px;
}


.listContainer__child-nested1 .gwt-TabPanelBottom {
    border: black !important;
}

.detail-view-panel .tab-panel-drawable, .detail-view-panel .tab-panel {
    width: 100%;
}


.tab-panel-drawable .gwt-TabPanelBottom {
    /*border: none;*/
}

.detail-view-grid__row_1 + .detail-view-hr-holder {
    display: flex;
}

.detail-view-grid__row_1 + .detail-view-hr-holder hr {
    flex-grow: 1;
    width: 0;
}

textarea {
    resize: none;
}

.file-upload__textarea {
    width: 204%;
    height: 200px;
}

.file-upload__panel .file-upload__clear-button {
    font-weight: bold;
    color: red;
    margin-left: 84px;
}

.file-upload__upload {
    width: 200px;
}

.dashboard__fullscreen {
    background-color: white;
}

.highcharts-credits {
    opacity: 0;
}

.ui-methods-dialog-box {
    z-index: 1005;
}

.ui-methods-dialog-box .dialogTop {
    font-weight: bold;
}

.layout-customization-panel__panel {
    border: 2px solid darkblue;
    background-color: white;
}

.header-controls-panel__panel {
    padding-top: 5px;
}

.header-controls-panel__panel .gwt-Label {
    font-weight: bold;
}


.header-controls-panel__frequency-clicked {
    background: cornflowerblue !important;
    color: aliceblue;
}

.header-controls-panel__frequency-unclicked {
    background: darkblue !important;
    color: aliceblue;
}

.DashboardHeader {
    font-size: 14pt;
    font-weight: bold;
    color: #777777;
    margin: 5px 0px 5px;
    text-align: left;
    padding: 2px 2px 2px 5px;
}

.h2o-zone-dropdown {
    margin: 5px 5px 5px 5px;
    font-size: 11pt;
    padding: 0px 0px 0px 0px;
    float: right;
    vertical-align: top;
}

.header-controls-panel__panel .h2o-resource-icon {
    padding-top: 5px;
}

.consumption-dashboard__header-control-buttons .h2o-resource-icon {
    margin: 5px;
}

.layout-customization-panel__panel {
    padding: 18px;
}

.layout-customization-panel__row-panel {
    padding-bottom: 18px;
}

.info-widget__message {
    font-size: 17px;
    font-weight: bold;
    color: #858585;
    padding-left: 15px;
    padding-top: 13px;
}

::backdrop {
    background-color: white;
}

.id-column-header {
    text-align: right !important;
}

.tooltip-popup {
    background-color: black;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 5px 0;
}

.jsoneditor-poweredBy {
    display: none;
}

.h2o-pager {
    align-items: center;
    display: flex;
    flex-direction: row;
}

.h2o-pager .gwt-PushButton {
    border: none;
    background: none;
}

.delay-table-title {
    font-size: 10pt;
    font-weight: bold;
    color: #777777;
    margin-left: 10px;
    text-align: left;
    padding: 2px 2px 2px 5px;
}

.delay-table-pager-panel .h2o-pager {
    margin-left: 20px;
}

.consumption-filter-panel .h2o-pager {
    margin-left: 20px;
}

.h2o-pager .h2o-resource-icon {
    margin-top: 2px;
    margin-left: 5px;
    margin-right: 5px;
}

.h2o-pager__current-page {
    color: gray;
}

.client__workday-selection {
    margin-bottom: 168px;
}

.multi-select-container.invalid .multi-select-button {
    border-width: 2px;
    border-color: red;
}

.multi-select-container[disabled] .multi-select-menu {
    display: none;
}

.detail-view-panel .workday-template-editor__master {
    position: relative;
}

.workday-template-editor__master .date-picker-input-label__date-picker {
    position: absolute;
}

.date-picker-input-label input {
    padding: 0px;
}

.workday-template-editor__master .date-picker-input-label input {
    top: 0px;
    padding: 0px;
    position: relative !important;
    left: 195px !important;
}

.date-picker-input-label__project-end .gwt-HTML {
    width: 15px !important;
}

.input-label.needs-top-alignment label {
    position: absolute;
    top: 0px;
}

.input-label.needs-top-alignment input {
    position: relative;
    bottom: 35px;
}

.needs-top-alignment label, .needs-top-alignment input {
    position: static !important;
}

/** end CSS rules for com.h2oanalytics.widgets  */


/** begin H2O over-ride CSS rules for com.h2oanalytics.widgets  */

.simple-entity-selection-box__entity-label {
    border: 2px solid cornflowerblue;
    font-size: 18px;
}

.invalid {
    border: solid red;
}

.right-align-text {
    text-align: right !important;
}

.date-cell__undefined-no-style {
    opacity: 0;
}

.gwt-PopupPanelGlass {
    opacity: 0 !important;
}

.date-cell__undefined {
    border: dashed cornflowerblue !important;
    background-color: lightyellow !important;
    color: lightyellow !important;
}

.info-widget__name-label {
    padding-right: 10px;
    font-weight: bold;
}

.filter-search-box {
    margin-left: 15px;
    width: 250px;
    border-radius: 5px;
}

.filter-search-label {
    font-weight: normal;
    padding-left: 7px;
    padding-top: 3px;
}

.admin-panel__top-button-row {
    align-items: start;
}

.admin-panel__top-button-row tr {
    display: flex;
    align-items: start;
}

.admin-panel__action-buttons-detailview {

}

.admin-panel__top-button-row .gwt-PushButton, .admin-panel__action-buttons-detailview .gwt-PushButton {
    border: none;
    background: none;
}

.file-upload__upload {
    margin-left: 40px;
}

.sumTotalSeries {
    opacity: 0;
}

.detail-view-grid {
    width: 100%;
}

.detail-view-grid .input-label {
    width: 100%;
}

.detail-view-grid__row select.gwt-ListBox, .detail-view-grid__row .input-label > input, .detail-view-grid__row .input-label textarea {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.detail-view-grid__row_2 .input-label textarea {
    float: right;
}

.detail-view-grid__row .list-input-text-area, .detail-view-grid__row .input-label input[type="text"] {
    width: 219px;
}

.detail-view-panel .detail-view-grid__row_2 .input-label-clipboard input, .detail-view-panel .detail-view-grid__row_2 .input-label-secret input {
    vertical-align: top !important;
    width: 199px !important;
}

#email-distro-text-area-id, #crew-members-text-area-id {
    height: 175px;
    width: 225px;
    margin-left: 65px;
}

.detail-view-grid__row .input-label .gwt-PushButton.secret-key-copy {
    float: right;
    position: relative;
}

.detail-view-grid__row_1 .input-label input, .detail-view-grid__row_1 .list-box-nullable .gwt-ListBox, .detail-view-grid__row_1 .gwt-CheckBox input {
    position: absolute;
    left: 25%;
}

.detail-view-grid__row_2 .input-label input, .detail-view-grid__row_2 .list-box-nullable .gwt-ListBox, .detail-view-grid__row_2 .gwt-CheckBox input {
    position: relative;
    float: right;
}

.gwt-PushButton.secret-key-copy {
    padding: 0;
}

.detail-view-grid .list-box-nullable {
    width: 100%;
}

.detail-view-grid__row_2 td + td label, .detail-view-grid__row_2 td + td .gwt-Label {
    margin-left: 115px;
}

.detail-view-grid__row_2 label, .detail-view-grid__row_2 .gwt-Label {
    margin-right: 200px;
}


.listContainer__child-nested1 .gwt-TabPanelBottom {
    border: black !important;
}

.detail-view-panel .tab-panel-drawable, .detail-view-panel .tab-panel {
    width: 100%;
}

.detail-view-grid__row_1 + .detail-view-hr-holder {
    display: flex;
}

.detail-view-grid__row_1 + .detail-view-hr-holder hr {
    flex-grow: 1;
    width: 0;
}

.file-upload__textarea {
    width: 204%;
    height: 200px;
    resize: none;
}

.file-upload__panel .file-upload__clear-button {
    font-weight: bold;
    color: red;
    margin-left: 84px;
}

.file-upload__upload {
    width: 200px;
}

.dashboard__fullscreen {
    background-color: white;
}

.highcharts-credits {
    opacity: 0;
}

.ui-methods-dialog-box {
    z-index: 1005;
    width: 100%;
}

.ui-methods-dialog-box .dialogTop {
    font-weight: bold;
}

.layout-customization-panel__panel {
    border: 2px solid darkblue;
    background-color: white;
}

.header-controls-panel__panel {
    padding-top: 5px;
}

.header-controls-panel__panel .gwt-Label {
    font-weight: bold;
}

.header-controls-panel__date-text-display {
    display: flex;
}


.header-controls-panel__frequency-clicked {
    background: cornflowerblue !important;
    color: aliceblue;
}

.header-controls-panel__frequency-unclicked {
    background: darkblue !important;
    color: aliceblue;
}

.DashboardHeader {
    font-size: 14pt;
    font-weight: bold;
    color: #777777;
    margin: 5px 0px 5px;
    text-align: left;
    padding: 2px 2px 2px 5px;
}

.ZoneDropdown {
    margin: 5px 5px 5px 5px;
    font-size: 14pt;
    padding: 0px 0px 0px 0px;
    float: right;
    vertical-align: top;
}

.layout-customization-panel__panel {
    padding: 18px;
}

.layout-customization-panel__row-panel {
    padding-bottom: 18px;
}

.info-widget__message {
    font-size: 17px;
    font-weight: bold;
    color: #858585;
    padding-left: 15px;
    padding-top: 13px;
}

::backdrop {
    background-color: white;
}

.detail-view-grid__row.detail-view-grid__row_2 {
    vertical-align: top !important;
}

.id-column-header {
    text-align: right !important;
}

.tooltip-popup {
    background-color: black;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 5px 0;
}

.toast {
    border-radius: 6px;
    top: 0;
    width: auto;
    clear: both;
    margin-top: 10px;
    position: relative;
    max-width: 100%;
    height: auto;
    min-height: 48px;
    line-height: 1.5em;
    word-break: break-all;
    background-color: #323232;
    padding: 10px 25px;
    font-size: 1.1rem;
    font-weight: 300;
    color: #fff;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

#toast-container {
    position: fixed;
    left: 800px;
    bottom: 20px;
}

/* force the GWT grid loader/spinner to be horizontally centered */
.h2o-list-container table[align="center"] {
    margin: auto !important;
}

/* force padding to zero around json editors */
.no-padding .gwt-TabPanelBottom {
    padding: 0px;
}

.heatmap-button-weeks {
    display: block;
    border: 1px solid #0c57a3 !important;
    padding: 3px 3px 3px 3px !important;
    background: #0972dd !important;
    min-width: 50px;
    height: 20px;
    color: #fff !important;
    font-size: 10px !important;
    text-align: center;
    margin-left: 5px !important;
}

.heatmap-button-weeks:disabled {
    display: block;
    border: 1px solid #0c57a3 !important;
    padding: 3px 3px 3px 3px !important;
    background: #c0c0c0 !important;
    min-width: 50px;
    height: 20px;
    color: #0972dd !important;
    font-size: 10px !important;
    text-align: center;
    margin-left: 5px !important;
    cursor: default !important;
}

.heatmap-button-months {
    display: block;
    border: 1px solid #0c57a3 !important;
    padding: 3px 3px 3px 3px !important;
    background: #0972dd !important;
    min-width: 50px;
    height: 20px;
    color: #fff !important;
    font-size: 10px !important;
    text-align: center;
    margin-left: 5px !important;
}

.heatmap-button-months:disabled {
    display: block;
    border: 1px solid #0c57a3 !important;
    padding: 3px 3px 3px 3px !important;
    background: #c0c0c0 !important;
    min-width: 50px;
    height: 20px;
    color: #0972dd !important;
    font-size: 10px !important;
    text-align: center;
    margin-left: 5px !important;
    cursor: default !important;
}

.detail-view-panel .workday-template-editor__master {
    position: relative;
}

.workday-template-editor__blackout-hours input {
    width: 109px !important;
}

.workday-template-editor__blackout-thru input {
    width: 101px !important;
    margin-left: 19px;
}

.workday-template-editor__project-start input {
    width: 101px !important;
}

.workday-template-editor__project-end input {
    width: 101px !important;
    margin-left: -22px;
}

.workday-template-editor__master .date-picker-input-label__date-picker {
    position: absolute;
}


.consumption-filter-panel .filter-search-box {
    margin-left: 0px;
}


.usage-chart-button-holder {
    display: flex;
    justify-content: space-between; /* left block | right block */
    align-items: center; /* vertical centering       */
    padding-top: 10px
}

/* inner groups must also be flex rows */
.button-holder-left,
.button-holder-right {
    display: flex;
    align-items: center;
}


/* 1) left-side buttons */
.button-holder-left > * {
    margin-right: 8px; /* space between view buttons */
}

.button-holder-left > *:last-child {
    margin-right: 0;
}

/* 2) right-side widgets */

.button-holder-right {
    gap: 16px; /* << horizontal space        */
}

.button-holder-right {
    margin-right: 20px;
}

.button-holder-right .gwt-CheckBox input {
    margin-right: 4px;
}


/* Estimated Usage Tooltip */

/* feel free to fancy it up */
.usage-tooltip {
    background-color: #ffffcc;
    border: 1px solid #666666;
    border-radius: 4px;
    padding: 6px 8px;
    font-size: 16px; /* bigger text */
    color: #000000;
    z-index: 2000; /* stay on top */
    box-shadow: 2px 2px 6px rgba(0, 0, 0, .4);
}

/** end H2O over-ride CSS rules for com.h2oanalytics.widgets  */


.alarm-analysis-histogram .highcharts-xaxis-labels tspan {
    cursor: pointer;
}


input.inputError { border: 1px solid #e60000; }

/*  ────────────────────────────────────────────────────────────────
    Remove ↑/↓ spinner of <input type="number"> for the two size
    fields.  Works in Chromium, Edge, Safari and Firefox.
   ──────────────────────────────────────────────────────────────── */
input.noSpin::-webkit-inner-spin-button,
input.noSpin::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

input.noSpin {
    -moz-appearance: textfield;   /* Firefox */
}