/*
  ..\wsys\webhyd.wsys.css
  Core style sheet for HYDSTRA web portal application

  May be overridden by settings in ..\wini\webhyd.wini.css
  Supersedes ..\wini\webhyd.css

***keyword-flag***     "Version %v  %f"
"Version 26  24-Jun-19,16:55:18"

*/
.hydstrav12styles {  /* retain for migration from web v8 -> v9) */
  color:black;
}
html, body {
  width:99%;
  height:99%;
}
html {
  overflow:hidden;
  padding:0px;
  margin:0px;
}
body {
  overflow:auto;
  position:fixed;
  margin:0px;
  /* trbl  note settings in webhyd.js::renderXML() to adjust padding */
  padding:5px 0 0 5px;
  -webkit-backface-visibility: hidden; /* Chrome37 workaround for layer squashing bug */
  transform:translate3d(0,0,0);        /* fixes weird scrollbar/zIndex interaction bug - lightbox was not at the front */
}
body,
input,
button,
textarea,
.menu {
  font-family:Verdana,Tahoma,Arial,MS Sans Serif;
  font-size:100.01%;
  color:black;
}
iframe {
  vertical-align:top;
  margin-top:2px;
  overflow-x:scroll;
  overflow-y:scroll;
  -webkit-overflow-scrolling:touch;
  background-color:white;
}
hr {
  color:lightgray;
  background-color:lightgray;
}
#languagesdiv {
  text-align:right;
  margin-top:5px;
}
.language {
  margin-right:3px;
  padding:1px 3px;
  border:1px solid lightblue;
  background-color:#eee;
  border-radius:3px;
  font-weight:bold;
  cursor:pointer;
}
/* DSE styles */
/* GW tabs header styles */
.gwpadleft1 { padding-left:10px; }
.gwpadleft2 { padding-left:20px; }
.gwpadleft3 { padding-left:30px; }
.gwtabhead {
  font-size:85%;
  margin-bottom:20px;
  white-space:nowrap;
  color:darkgray;
}

/* Webkit scroll bars - esp for Safari on iPad/iPod/iPhone */
::-webkit-scrollbar {
  width:10px;
  height:10px;
  border-bottom:1px solid #eee; 
  border-top:1px solid #eee;
}
::-webkit-scrollbar-thumb {
  background-color:#c3c3c3;
  border:2px solid #eee;
  -webkit-box-shadow:inset 0 0 6px rgba(0,0,0,0.5);
}

::-webkit-scrollbar-track {
  -webkit-box-shadow:inset 0 0 5px rgba(0,0,0,0.2);
}

button,
fieldset,
img,
input,
select,
textarea,
.div_site_selection,
.div_notes,
.dpTable,
.helpbox,
.menuframe,
.msgbox,
.small,
.ssui_message_box,
.submit, 
.tabledata_outsidecells,
.titlelinkon,
.titlelinkoff,
#image,
#legendimg,
#light,
#light img,
#map,
#webhydtabdoc {
  border:none;
}

#wrapper {
  margin:0 5px 0 5px;
}
#dark { /* 'dark' overlay (under lightbox) */
  position:fixed;
  top:0;
  left:0;
  display:none;
  background-color:white;
  width:100%;
  height:100%;
  z-index:9998;
  opacity:0.7;
  overflow:hidden;
}
#light { /* lightbox div */
  position:fixed;
  display:none;
  text-align:right;
  padding:6px;
  background-color:#eee;
  z-index:9999;
  overflow:hidden;
  border:1px solid lightblue;
}
#light img {
  float:none;
  margin:2px;
  vertical-align:middle;
  cursor:pointer;
}
#lbdiv {
  text-align:center;
  white-space:nowrap;
}
#lbcaption {
  font-weight:bold;
  border:none;
}
.lbbuttons {
  padding:2px;
  text-align:left
}

/* pretty links table */
.linkstable {
  border-spacing:0 7px;
}
.linkstable td {
  padding:4px;
  padding-right:12px;
  border-bottom-right-radius:10px;
  vertical-align:middle;
  background-color:#eee;
  border:1px solid lightblue;
  color:black;
  cursor:pointer;
}
.linkstable td:hover        {
  border:1px solid #003366;
  background-color:#003366;
  color:white;
}
.icondiv {
  position:relative;
  float:left;
  width:20px;
  height:20px;
  margin-right:10px;
  vertical-align:middle;
}

.prn {
  font-family:"Courier New";
  padding:5px;
  white-space:nowrap;
}

#webhydtabdoc {
  border:1px solid lightblue;
  background-color:#eee;
}

.site_loading {
  color:black;
  font-weight:bold;
}

/* site selection popups styling */
.div_site_selection {
  border:1px solid lightblue;
  background-color:#eee;
  margin-top:2px;
  padding:5px;
  overflow:auto;
}
.site_selection_left {
  white-space:nowrap;
  vertical-align:top;
  padding-right:5px;
  width:1%;
}
.site_selection_right {
  max-width:80%;
  vertical-align:top;
}
.sitelisttype_radio {  /* sitelist type radio button rows */
  margin-bottom:3px;
}
.ssui_sitecount {
  color:blue;
  font-weight:bold;
}

.div_notes {
  width:1%;
  padding:3px;
  border:1px solid gray;
}

.site_selection_upload_clear,
.site_selection_close {
  position:relative;
  float:right;
  right:-5px;
  top:-5px;
  width:25px;
  height:25px;
}
.site_selection_upload_clear {
  padding:0px 45px 0 0;
}
.site_selection_close {
  z-index:10;
}

/* make button container float if button inside table cell */
button {
  overflow:visible;
  padding:3px 6px 3px 6px;
  margin:2px 5px 2px 0px;
  width:auto;
  cursor:pointer;
}
.filterslist {
  white-space:nowrap;
}
.estimate,
.estimate_heading,
.extract {
  color:blue;
}
.estimate_heading {
  font-weight:bold;
}
.ssui_subheading {
  font-size:120%;
  font-weight:bold;
  line-height:30px;
}
.ssui_message_box {
  width:350px;
  margin:5px 0 5px 15px;
  display:none;
  white-space:normal;
}

.ssui_group {
  margin-left:10px;
}
table.ssui_interval_period td {
  padding:4px 3px 0 0;
  vertical-align:top;
}
.tab_message1 {
  color:#a9a9a9;
  font-weight:bold;
}
.tab_message2 {
  color:#a9a9a9;
}
.tab_message {  /* style for override tab specific message */
  color:#a9a9a9;
}

.questionmark { /* styling for question mark image (context help) */
  padding-left:3px;
}
.option_grpkey {
  color:black;
  font-weight:bold; /* only works in FF */
}
.option_grpval {
  color:blue;
}

p {
  margin:5px 0px 10px 0px;
}
ul,
li {
  margin-top:2px;
  line-height:120%;
}
.small,       /* deprecated image thumbnails class */
.thumbnail {
  width:100px;
  cursor:pointer;
  padding:2px;
  margin-top:5px;
  background-color:#eee;
}
#plotsize {
  font-weight:bold;
}
a {
  text-decoration:underline;
}
.treetab a,
a:hover,
.anchor:hover {
  text-decoration:none;
}
a,
a:hover,
a:visited,
.anchor,
.bookmarklink {
  color:#003366;
  cursor:pointer;
  font-weight:normal;
}
.anchor img {
  vertical-align:middle;
}
.language_icon {
  padding-left:5px;
}
.language_link {
  position:static;
  float:right;
}

.divbox,
.divhovertip,
.divhovertipp {
  position:absolute;
  font-size:80%;
  border:1px solid #808080;
  padding:0px 2px 1px 2px; /*trbl*/
  white-space:nowrap;
}

.divhovertip,
.divhovertipp {
  display:none;
  border:1px solid lightblue;
  background-color:#eee;
  opacity:1.0;
}
.divhovertipp {
  padding:3px 5px 4px 5px; /*trbl*/
}
.shadow {
  box-shadow:1px 1px 3px gray;
}
.not_opaque {
  opacity:0.0;
}
.opaque {
  opacity:1.0;
}
.dateformat {
  color:#cdcdcd;
}
.plusminus {
  font-weight:bold;
  width:20px;
}
.plusminus,
.menu_legend,
.imglink {
  cursor:pointer;
}
.dowrap {
  white-space:normal;
}
.msgbox {
  position:absolute;
  display:none;
  border:1px solid lightblue;
  background-color:#eee;
  margin:0 auto;
  margin-top:5%;
  margin-left:40%;
  margin-right:40%;
  width:20%;
  padding:10px;
  z-index:9999;
}
.msgbox_cf {
  position:fixed; /* non IE */
}
.msgbox_ssui {
  background-color:white;
}
.helpbox {
  position:absolute;
  display:none;
  border:1px solid lightblue;
  background-color:#eee;
  margin:0 auto;
  width:auto;
  overflow:auto;
  white-space:nowrap;
  padding:5px;
  z-index:9999;
}
.menubox { /* favourites, search */
  padding:0px;
  white-space:nowrap;
  overflow:hidden;
  margin-bottom:10px;
}
.bookmarklink {
  float:right;
  font-weight:normal;
  font-size:small;
}
#cattext {
  font-size:90%;
  color:#a9a9a9;
  padding-bottom:7px;
}
#titletext,
#title2text,
#coretitletext {
  font-weight:bold;
  text-align:left;
  color:#0083BE;
}
.heading_site_selection,
.heading_search,
.ssui_subheading {
  color:#0083BE;
}
.ssui_subsubheading {
  color:black;
}
#titletext,
#coretitletext,
.heading_site_selection  {
  font-size:24px;
}
#title2text {
  font-size:1.3em;
  padding-top:5px;
}
#tabstext {
  text-align:left;
  padding:10px 0 10px 0;
}

#titletext {
  font-weight:normal;
  text-transform:uppercase;
}
.bookmarklink,
#coretitletext {
  font-weight:normal;
  text-transform:none;
}

select,
button,
.titlelinkon,
.titlelinkoff,
.submit {
  background:none;
  background-image:none;
  border-radius:0;
}
.titlelinkon,
.titlelinkoff {
  /* top right bottom left */
  padding:3px 9px 3px 9px;
  margin-left:1px;
  margin-right:1px;
  border-radius:4px;
  border-bottom-left-radius:0;
  border-bottom-right-radius:0;
}
.titlelinkon {
  /* The link matching the active "tab" */
  background-color:#003366;
  font-weight:normal;
  color:white;
}
.titlelinkoff {
  /* The link matching the inactive "tab" */
  border:1px solid lightblue;
  border-bottom:none;
  background-color:#eee;
  cursor:pointer;
  color:black;
}
#tabtext_underline {
  border-top:2px solid #003366;
  margin-top:3px;
  margin-left:1px;
}

select,
fieldset,
legend,
.helpbox {
  border:1px solid lightblue;
  background-color:#eee;
}

.msgbox button {
  border:1px solid lightblue;
  background-color:#e0e0e0;
}

a.stdlink,
button,
.submit,
.stdmenulink,
.menufooterlink,
.stdlink,
.bookmarklink {
  text-decoration:none;
  border:1px solid lightblue;
  background-color:#eee;
  color:black;
}
.titlelinkoff:hover,
button:hover,
.submit:hover,
.menufooterlink:hover,
a.stdlink:hover,
.stdlink:hover,
.bookmarklink:hover,
.stdmenulink:hover,
.stdmenulinkactive {
  text-decoration:none;
  border:1px solid #003366;
  background-color:#003366;
  color:white;
}
/* various standard links */
.menufooterlink,
a.stdlink,
.stdlink,
.bookmarklink,
.stdmenulink,
.stdmenulinkactive {
  padding:1px 4px 2px 4px;  /* trbl */
  margin-bottom:4px;
  display:inline-block; /* these classes may be associated with a span NOT a div */
  cursor:pointer;
}
.menufieldsetdiv {
  margin:5px;
}

.stdmenulink,
.stdmenulinkactive,
.menufooterlink,
a.stdlink,
.stdlink,
.bookmarklink {
  padding:1px 6px 3px 5px;  /* trbl */
  border-bottom-right-radius:5px;
}


button,
.submit {
  padding:5px 11px 5px 11px;
  margin-top:10px;
  font-weight:bold;
  border-bottom-right-radius:5px;
}
fieldset {
  position:static;
  margin-top:8px;
  padding:0;
}
legend {
  font-weight:bold;
  font-style:italic;
  padding:3px 9px 3px 6px;
  color:black;
}
button,
.submit {
  margin:2px 0;
}
.menucategorydiv {
  margin-top:15px;
  padding:6px;
  border:1px solid deepskyblue;
  border-radius:5px;
  background-color:white;
}
.menucategorydiv:hover {
  border:1px solid #003366;
}
.categoryname {
  font-weight:bold;
  margin-bottom:5px;
}

#mapdiv {
  position:relative;
  left:5px;
  border-radius:5px;
  border:0.5px solid lightblue;
}

.tip { /* styles for tooltips */
  position:absolute;
  padding:10px;
  z-index:1;
  display:none;
  border:1px solid #eee;
  background-color:white;
  color:black;
  border-bottom:3px solid #eee;
  border-right:3px solid #eee;
}
#gtip { /* Google Maps tooltips */
  position:absolute;
  visibility:hidden;
  z-index:10;
}
.gtip { /* Google Maps tooltip table */
  width:1%;
  padding:0 5px 2px 5px;
  border:1px solid #808080;
  background-color:#eee;
}

#oltip { /* OpenLayers tooltips */
  position:absolute;
  visibility:hidden;
  z-index:10;
}
.oltiptable { /* OpenLayers tooltip table */
  width:1%;
  padding:0 5px 2px 5px;
  border:1px solid #808080;
  background-color:#eee; /* rgb( 211, 211, 211 ) */
}
.oltiptable td { /* OpenLayers tooltip table cell */
  font-size:80%;
  width:1%;
}

/* Google Map legend (true image) */
#legendimg {
  position:relative;
  border-radius:5px;
  top:5px;
  left:5px;
  border:1px solid gray;
  z-index:999;
}
/* Google Map legend (DIV containing HTML) */
div #legendimg {
  background-color:white;
  font-size:80%;
  white-space:nowrap;
  padding:5px;
  display:inline-block;
}
/* dynamic legend circle icons - background-color supplied in style */
.dot {
  height:7px;
  width:7px;
  border-radius:50%;
  display:inline-block;
  border:1px solid darkslategrey;
}

/* Google Map controls */
#zoomcontrol {
  margin:5px;
  background-color:white;
  border:1px solid gray;
  border-radius:5px;
  cursor:pointer;
  width:30px; 
  height:52px;
}
#zoominbuttonimg {
  padding:7px 7px 5px 7px;
}
#zoomoutbuttonimg {
  padding:0px 7px 8px 7px;
}

#fullscreencontrol {
  margin:5px;
  margin-left:6px;
  background-color:white;
  border:1px solid gray;
  border-radius:5px;
  cursor:pointer;
  width:30px;
  height:30px;
  /* for webolmap.htm */
  position:absolute;
  right:0;
  top:145px;
  z-index:999;
}
#fullscreenimg {
  padding:7px;
}

#layerscontrol,
#sitefilterscontrol,
#sitemultipermvarscontrol {
  margin:3px;
  background-color:white;
  border:1px solid gray;
  border-radius:4px;
  display:inline-block;
  box-shadow:rgba(0, 0, 0, 0.398438) 0px 2px 4px;
}
.googlemaplayer,
.sitefilter {
  font-weight:normal;
  cursor:pointer;
  white-space:nowrap;
  padding:2px 4px 3px 5px;
  border-bottom:1px solid #666;
  font-size:11px;
}
.sitefilter,
.sitemultipermvars {
  border-bottom:none;
}

/* styling to align checkboxes/radio buttons with label text */
#sitefilterscontrol input {
  padding:0;
  margin:0;
  vertical-align:bottom;
  position:relative;
}
#sitefilterscontrol label {
  display:block;
}

.sitefiltername,
.sitemultipermvarsname {
  font-weight:bold;
  white-space:nowrap;
  padding:2px 4px 5px 5px;
  font-size:11px;
  color:darkblue;
}

/* Google Map search input box */
#searchinput {
  width:220px;
  height:15px;
  margin-top:5px;
  margin-right:6px;
  opacity:0.5;
  display:none;
}
#searchinput-control { /* container for search input box */
  position:absolute;
  top:3px;
  right:200px;
  z-index:5;
}
#searchInput, #searchImg, #selectBox {
  margin:0;
  padding:0;
}
#searchInput, #selectBox {
  opacity:0.6;
  font-size:80%;
}
#searchInput {  /* search input box - span element */
  float:left;   /* enables search image icon to sit right of this */
  min-width:250px;
  max-width:1000px;
  height:15px;
  border:1px solid gray;
  background-color:white;
}
#searchImg {
  cursor:pointer;
}
#selectBox {
  display:none;
}

/* for webmap */
#homecontrol {
  margin:5px;
  background-color:white;
  border:1px solid gray;
  padding:4px;
  border-radius:5px;
  cursor:pointer;
  text-align:center;
  font-family:Arial,sans-serif;
  font-size:11px;
}

/* for webmap & webolmap */
#base-layer-control,
#home-control {
  position:absolute;
  right:5px;
  background-color:white;
  border:1px solid #666;
  box-shadow:rgba(0, 0, 0, 0.398438) 0px 2px 4px;
  z-index:9999;
  border-bottom:0;
  border-radius:4px;
}
#base-layer-control {
  top:30px;
  display:inline-block;
}
.blc-button,
#home-control {
  cursor:pointer;
  border-bottom:1px solid #666;
  padding:2px 5px 3px 5px;
  font-size:11px;
}
#home-control {
  top:5px;
}
#home-control,
.blc-button.current,
.slc-button.current {
  font-weight:bold;
}
.sites-layer-control {
  position:absolute;
  border-radius:4px;
  right:5px;
  background-color:white;
  border:1px solid #666;
  box-shadow:rgba(0, 0, 0, 0.398438) 0px 2px 4px;
  z-index:9999;
  border-bottom:0;
}
.slc-button {
  cursor:pointer;
  border-bottom:1px solid #666;
  padding:2px 0px 3px 5px;
  font-size:11px;
}
.popup {
  font-family:Verdana,Arial;
  font-size:10px;
}
#mapFoot {
  background-color:#045fa8;
  border:0.5px solid #045fa8;
  margin-left:5px;
  width:90%;
  display:none;
  border-bottom-left-radius:5px;
  border-bottom-right-radius:5px;
}
#mapScale,
#mapMousePosition,
#mapMousePositionUTM {
  background-color:#045fa8;
  font-size:9px;
  text-align:center;
  padding:6px 9px 6px 9px;
  margin:0;
  color:white;
  height:13px;
  float:left;
}
#mapMousePosition {
  min-width:100px;
}
#mapMousePositionUTM {
  min-width:120px;
}
#mapScale,
#mapMousePosition,
#mapMousePositionUTM {
  white-space:nowrap;
  border-right:solid 1px #999;
}
#mapScale {
  border-bottom-left-radius:5px;
}

.hovervalue { /* hovertip value */
  text-align:right;
  width:1%;
}
.hovervaluedt { /* hovertip value datetime */
  font-style:italic;
  width:1%;
}

#map { /* Google Maps */
  margin-left:5px;
}
#smap {  /* embedded map */
  position:absolute;
  margin-left:80px;
  z-index:1;
}

.markerlabel {   /* permanent site marker data tip e.g. for weblatest PermVar */
  position:absolute;
  background-color:white;
  border:1px solid darkgrey;
  padding:1px;
  display:inline-block;
  margin-left:7px;
  margin-top:-5px;
  z-index:99; /* so it sits atop KML */
}

.response { /* AJAX text response divs */
  display:block;
  font-weight:bold
}
.textright {
  text-align:right;
}
#floatright {
  float:right;
  padding-right:10px;
  text-align:right;
}
.aligntop td {
  vertical-align:top;
}
.tabledivider {
  line-height:0;
  background-color:#eee;
}

/* standard data table styles */
.block {
  border:none;
  border-collapse:collapse;
  border-spacing:0; /* equivalent to <table cellspacing="0" */
}
.block thead th {
  border:1px solid deepskyblue;
}
.block tbody td {
  border:1px solid lightblue;
  padding:3px 4px; /*tb rl*/  /* analagous to <table cellpadding="3" */
  vertical-align:middle;
}
.block tr {
  background-color:#eee;
}
.block tr:nth-of-type(2n) {
  _background-color:#eee;
}
.head {
  background-color:#003366;
  color:white;
  white-space:nowrap;
  text-align:left;  /* override jquery.floatThead which centers them */
  padding:3px 10px 3px 4px;
  vertical-align:bottom;
  font-weight:normal;
}
.block td.lv_group {
  border:none;
  padding-left:0px;
}
.block td.lv_head {
}

/* latest values table cells */
.lv_group {
  white-space:nowrap;
  border:none;
  background-color:white;
}
.lv_head {
  white-space:nowrap;
  min-width:140px;
}
.lv_value {
  min-width:50px;
  text-align:right;
}
.lv_datetime {
  white-space:nowrap;
  min-width:130px;
  text-align:right;
}
.lv_trendcomment {
  padding:0 3px;
  white-space:nowrap;
}
/* change trend arrow symbols */
.change {
  color:black;
  font-family:Times New Roman;
  font-size:120%;
  font-weight:bold;
}

/* latest values tab extra table */
.lv_extratable {
  margin:5px 20px 15px 20px;
  width:1%;
  font-size:90%;
}

/* Various tab headings */
.variable_type,
.variable_group,
.lv_group,
.dfsitedetails,
.dfperiod,
.posecttypestr,
.codropdowns,
#datatabletitle {
  color:#585656;
  font-weight:bold;
  padding-bottom:6px;
  padding-left:0px;
}
.cfcustomdatestable {
  border:1px solid deepskyblue;
  border-radius:4px;
  padding:3px 0px 6px 8px;
}
.cfcustomdatestable:hover {
  border:1px solid #003366;
}

/* Style for Custom Outputs Data table heading cells */
.tableheading {
  background-color:#eee;
  color:red;
  font-weight:bold;
  vertical-align:top;
  white-space:nowrap;
}
/* Style for Custom Outputs Data table datetime cells */
.tabledtimecells {
  vertical-align:top;
  white-space:nowrap;
  text-align:left;
}
/* Style for Custom Outputs Data table data cells */
.tabledatacells {
  vertical-align:top;
  text-align:right;
}
/* Style for Custom Outputs Data table outside cells */
.tabledata_outsidecells {
  vertical-align:top;
  padding-right:10px;
  border:1px solid gainsboro;
}
.data_table {
  display:none;
  cursor:pointer;
}
/* Style for Data table heading cells */
.data_table td {
  padding:3px;
  vertical-align:top;
  text-align:right;
  white-space:nowrap;
}
td .data_tableheading {
  background-color:#eee;
  color:red;
  font-weight:bold;
  text-align:left;
}

/* Style for Latest Values Data table date cells */
.data_tabledatecells {
  background-color:white;
  font-weight:bold;
}
/* Style for Latest Values Data table time cells */
.data_tabletimecells {
  background-color:white;
}
/* Style for Latest Values Data table data cells */
.data_tabledatacells {
  background-color:white;
}
/* Style for Latest Values Data table total data cells */
.data_tabletotal {
  background-color:white;
  font-weight:bold;
}

.cf_head {
  white-space:nowrap;
  text-align:left;
}
.cf_varft {
  text-align:left;
  white-space:nowrap;
  color:dimgrey;
}
.cf_period {
  white-space:nowrap;
  text-align:left;
}

.cf_select {
  background-color:#003366;
}
.cf_unselect {
  background-color:none;
}

/* styles for webhyd.pl?main body */
#webhydpl_main {
  padding:0;
  margin:0;
  left:0;
}
.variable_message {
  font-weight:normal;
}
.float_button {
  position:fixed;
  top:5px;
  left:10px;
  z-index:10;
}
.menu, .help, .output, .ws {
  overflow:auto;
}
.ws {
  font-size:80%;
  margin:5px;
}
.menuframe { /* styling for the menu iframe */
  margin-right:2px;
}
#hccontainer {
  margin:5px 5px 5px 20px;
  border:1px solid lightblue;
  text-align:center;
  font-size:80%;
}
/* styles for intro frame body */
.intro {}
/* styles for menu frame body */
.menu {}
/* styles for help frame body */
.help {}
/* styles for output frame body */
.output {}
/* styles for output frame body */
.misc {}
/* styles for output frame body */
.mail {}

/* styles for weblog body */
.weblog {
  font-family:Verdana, Geneva, Arial, Helvetica, sans-serif;
  font-size:8pt;
  color:black;
  background-color:#eee;
}
/* weblog styles */
.weblogblue {
  color:blue;
}

fieldset,
legend,
.msgbox,
.divbox,
.divhovertipp,
.frame,
.helpbox,
.div_site_selection,
.oltiptable,
#light,
#light img,
::-webkit-scrollbar-thumb,
::-webkit-scrollbar-track {
  border-radius:5px;
}

.treetab {
  table-layout:fixed;
  padding:0;
  border-spacing:0;
  background-color:none;
  width:100%;
}
.treetab td {
  vertical-align:middle;
  width:100%;
  white-space:nowrap;
  text-overflow:ellipsis;
  overflow:hidden;
}
.treelev {
  background-color:#eee;
}
.treelev img.treeplusminus,
.treelevactive img.treeplusminus {
  cursor:pointer;
  vertical-align:middle;
  margin:2px 4px 3px 3px;
  background-color:#eee;
}
.treelev:hover,
.treelevactive {
  background-color:#003366;
  color:white;
}
.treelev span:hover,
.treelevactive span {
  cursor:pointer;
}

/* datepicker styles */

/* the div that holds the date picker calendar */
.dpDiv {
  position:absolute;
  left:205px;
  bottom:-205px;
  z-index:10;
  visibility:hidden;
}
/* the table (within the div) that holds the date picker calendar */
.dpTable {
  background-color:#ece9d8;
  border-radius:4px;
}
.dpTable td {
  text-align:center;
  padding:0px;
}
.dpDayHighlight {
  /* additional style information for the cell that holds a highlighted day */
  background-color:white;
  color:#003366;
  font-weight:bold;
  border:1px solid #808080;
}
.dpTDHover {
  /* the date number table cell that the mouse pointer is currently over */
  background-color:white;
  cursor:pointer;
  font-weight:bold;
  color:#003366;
}
.dpTitleTR {
  /* the top table row that holds the month, year, and forward/ backward buttons */
  font-weight:bold;
}
.dpDayTD { /* a table cell that holds the short names of days of the week( Mo, Tu, We, etc ) */
  color:white;
  background-color:#a9a9a9;
}

.dpTR {} /* a table row that holds date numbers( either blank or 1 - 31 ) */
.dpDayTR {}/* the second table row, that holds the names of days of the week( Mo, Tu, We, etc ) */
.dpTodayButtonTR {} /* the bottom table row, that has the "This Month" and "Close" buttons */
.dpTD {}/* a table cell that holds a date number( either blank or 1 - 31 ) */
.dpTodayButtonTD {} /* the table cell that holds the "This Month" or "Close" button at the bottom */
.dpTodayButton {} /* the "This Month" and "Close" buttons at the bottom */
.dpTitleText {} /* additional style information for the text that indicates the month and year */
.dpTitleTD {} /* the table cell that holds the name of the month and the year */
.dpButton {} /* the forward / backward buttons at the top */
.dpButtonTD {} /* a table cell that holds one of the forward / backward buttons */
.dpDayHighlightTD {} /* a table cell that holds a highlighted day( either today's date or the current date field value ) */