/********************************************
   AUTHOR:  			Erwin Aligam
   WEBSITE:   			http://www.styleshout.com/
	TEMPLATE NAME:		Envision
   TEMPLATE CODE: 	S-0013
   VERSION:          1.1
	LAST MODIFIED     Nov-14-2007
 *******************************************/

/********************************************
   HTML ELEMENTS
********************************************/

/* Top Elements */
* { margin: 0; padding: 0; }

body {
  background: #CCC;
  font: 90%/1.5em Verdana, Tahoma, arial, sans-serif;
  color: #555;
  text-align: center;
}

/* links */
a{
  text-decoration: none;
  color: #3344dd;
  /*	background: inherit;*/
}
a:visited {
  color: #884488;
  text-decoration: none;
}
a:hover {
  color: #bb1122;
  /*	background: inherit;*/
  text-decoration: underline;
}

a[role="button"] {
  cursor: pointer;
}

/* headers */
h1, h2, h3 {
  font-family: 'Trebuchet MS', Tahoma, Sans-serif;
}
h1 {
  font-size: 150%;
  font-weight: normal;
  color: #006699;
}
h2 {
  font-size: 140%;
  text-transform: uppercase;
  color: #88ac0b;
}
h3 {
  font-size: 120%;
  color: #666666;
}

/* images */
img {
  background: #FAFAFA;
  border: 1px solid #E5E5E5;
  padding: 5px;
}
img.float-right {
  margin: 5px 0px 10px 10px;
}
img.float-left {
  margin: 5px 10px 10px 0px;
}

h1, h2, h3, p {
  padding: 10px;
  margin: 0;
}
ul, ol {
  margin: 5px 20px;
  padding: 0 20px;
}

code {
  margin: 5px 0;
  padding: 10px;
  text-align: left;
  display: block;
  overflow: auto;
  font: 500 1em/1.5em 'Lucida Console', 'courier new', monospace ;
  /* white-space: pre; */
  background: #FAFAFA;
  border: 1px solid #f2f2f2;
}
acronym {
  cursor: help;
  border-bottom: 1px dotted #777;
}
blockquote {
  margin: 10px;
 	padding: 0 0 0 28px;
  border: 1px solid #f2f2f2;
  background: #FAFAFA url(/images/quote.gif) no-repeat 5px 5px;
}

.qtip-content a {
  font-size: 14px;
  line-height: 1.2;
  margin-bottom: 4px;
  display: inline-block;
}

/* start - table */
table {
  border-collapse: collapse;
  margin: 10px;
}
th strong {
  color: #fff;
}
th {
  background: #93BC0C;
  height: 29px;
  padding-left: 12px;
  padding-right: 12px;
  color: #FFF;
  text-align: left;
  border-left: 1px solid #B6D59A;
  border-bottom: solid 2px #FFF;
}
tr {
  height: 30px;
}
td {
  padding-left: 1px;
  padding-right: 1px;
  border-left: 1px solid #FFF;
  border-bottom: solid 1px #ffffff;
}
td.first,th.first {
  border-left: 0px;
}
tr.row-a {
  background: #F8F8F8;
}
tr.row-b {
  background: #EFEFEF;
}
/* end - table */

/* form elements */
form {
  margin:10px; padding: 0 5px;
  border: 1px solid #f2f2f2;
  background-color: #FAFAFA;
}
label {
  display:block;
  font-weight:bold;
  margin:5px 0;
}
label.inline-label {
  display: inline;
  margin-right: 10px;
  margin-left: 10px;
  font-weight: normal;
}

input {
  padding:2px;
  border:1px solid #7a7575;
  font: normal 1em Verdana, sans-serif;
  color:#494949;
}
textarea {
  width:400px;
  padding:2px;
  font: normal 1em Verdana, sans-serif;
  border:1px solid #eee;
  height:100px;
  display:block;
  color:#494949;
}
input.button {
  font: bold 12px Arial, Sans-serif;
  height: 24px;
  margin: 0;
  padding: 2px 3px;
  color: #FFF;
  background: #8EB50C url(/images/button-bg.jpg) repeat-x 0 0;
  border: none;
}

input[type=button], input[type=submit]{
  font: bold 12px Arial, Sans-serif;
  padding: 2px 3px;
  height: 24px;
  margin : 0;
  background: #8EB50C url(/images/button-bg.jpg) repeat-x 0 0;
  border: none;
}
input[type=submit][disabled]{
  color: #CCC;
}
/* search form */
.searchform {
  background-color: transparent;
  border: none;
  margin: 0; padding: 5px 0 15px 0;
  width: 190px;
}
.searchform p { margin: 0; padding: 0; }
.searchform input.textbox {
  width: 120px;
  color: #494949;
  height: 18px;
  padding: 2px;
  border: 1px solid #E5E5E5;
  vertical-align: top;
}
.searchform input.button {
  width: 60px;
  height: 24px;
  padding: 2px 5px;
  vertical-align: top;
}

/********************************************
   LAYOUT
********************************************/
#wrap {
  /*background: #CCC url(/images/content_wide.jpg) repeat-y center top;*/
  background: #CCC;
  margin: 0 auto;
  text-align: left;
}
#content-wrap {
  clear: both;
  padding: 0;
  background: #fff;
  border: 10px solid #237fbe;
}
#header {
  position: relative;
  height: 65px;
  /*background: #CCC url(/images/header_wide.jpg) no-repeat center top;*/
  background: #237fbe;
  padding: 0;
  color: #FFF;
}
/*#header h1#logo-text a {
  position: absolute;
  margin: 0; padding: 0;
  font: bolder 44px 'Trebuchet MS', Arial, Sans-serif;
  letter-spacing: -2px;
  color: #FFF;
  text-transform: none;
  text-decoration: none;
  background: transparent;

  top: 25px;
  left: 10px;
}*/
#header p#slogan {
  position: absolute;
  margin: 0; padding: 0;
  font: normal 12px 'Trebuchet MS', Arial, Sans-serif;
  text-transform: none;
  color: #FFF;

  /* change the values of top and left to adjust the position of the slogan*/
  top: 70px; left: 55px;
}

/* header links */
/*
#header #header-links {
  position: absolute;
  top: 20px; right: 30px;
  color: #C6DDEE;
  font-size: 10px;
}
#header #header-links a {
  color: #FFF;
  text-decoration: none;
}
#header #header-links a:hover {
  color: #D4E59F;
}
*/
#header h1#logo-text {
float: left;
margin: 0;
padding: 0;
padding-left: 10px;
}
#header h1#logo-text a {
font: bolder 44px 'Trebuchet MS', Arial, Sans-serif;
letter-spacing: -2px;
color: #FFF;
text-decoration: none;
}
#header #header-links {
float: right;
color: #FFF;
}
#header #header-links a {
color: #FFF;
}
#header #header-links a:hover {
color: #D4E59F;
}

#logo-text img {margin-top: 20px; padding: 0; border: none;}


/* Menu */
#menu {
  clear: both;
  margin: 0 auto; padding: 0;
  background: url(/images/menu.jpg) repeat-x 0 0;
  font: bold 14px/37px Verdana, Arial, Tahoma, Sans-serif;
  height: 37px;
}
#menu ul {
  float: right;
  list-style: none;
  margin:0; padding: 0;
}
#menu ul li {
  display: inline;
}
#menu ul li a {
  display: block;
  float: left;
  padding: 0 12px;
  color: #FFF;
  text-decoration: none;
}
#menu ul li.last a {
  padding-right: 20px;
}
#menu ul li a:hover {
  color: #D4E59F;
}
#menu ul li#current a {
  color: #D4E59F;
}

/* Main Column */
#main {
  float: left;
  width: 70%;
  padding: 0; margin: 5px 0 0 5px;
  display: inline;
}
#main h2 {
  margin-top: 10px;
  font: Bold 140% 'Trebuchet MS', Tahoma, Sans-serif;
  color: #88ac0b;
  padding: 5px 0 5px 25px;
  border-bottom: 1px solid #EFF0F1;
  background: #FFF url(/images/square-green.png) no-repeat 3px 50%;
  text-transform: none;
}
#main h2 a {
  background: none;
  color: #88ac0b;
  text-decoration: none;
}

#main ul li {
  list-style-image: url(/images/bullet.gif);
}

.post-footer {
  background-color: #FAFAFA;
  padding: 5px; margin: 20px 10px 10px 10px;
  border: 1px solid #f2f2f2;
  font-size: 95%;
}
.post-footer .date {
  background: url(/images/clock.gif) no-repeat left center;
  padding-left: 20px; margin: 0 10px 0 5px;
}
.post-footer .comments {
  background: url(/images/comment.gif) no-repeat left center;
  padding-left: 20px; margin: 0 10px 0 5px;
}
.post-footer .readmore {
  background: url(/images/page.gif) no-repeat left center;
  padding-left: 20px; margin: 0 10px 0 5px;
}

/* Sidebar */
#sidebar {
  float: right;
  width: 26.5%;
  padding: 0; margin: 0;
  color: #68774A;
}
#sidebar h3 {
  margin-top: 10px;
  padding: 5px 5px;
  font: bold 1.4em 'Trebuchet MS', Tahoma, Sans-serif;
  color: #728D26;
}
#sidebar ul.sidemenu {
  list-style: none;
  text-align: left;
  margin: 7px 4px 8px 0; padding: 0;
  text-decoration: none;
  background: url(/images/dots.jpg) repeat-x left top;
}
#sidebar ul.sidemenu li {
  list-style: none;
  background: url(/images/dots.jpg) repeat-x left bottom;
  padding: 4px 0 4px 5px;
  margin: 0 2px;
  color: #68774A;
}
* html body #sidebar ul.sidemenu li {
  height: 1%;
}
#sidebar ul.sidemenu li a {
  text-decoration: none;
  background-image: none;
  color: #666666;
}
#sidebar ul.sidemenu li a:hover {
  color: #1773BC;
}
#sidebar ul.sidemenu ul { margin: 0 0 0 5px; padding: 0; }
#sidebar ul.sidemenu ul li { background: none; }


/* Footer */
#footer {
  color: #C6DDEE;
  /*background: #CCC url(/images/footer.jpg) no-repeat center top;*/
  background: #237fbe;
  clear: both;
  height: 65px;
  text-align: center;
  font-size: 92%;
}
#footer a {
  color: #FFF;
  text-decoration: none;
}

/* alignment classes */
.float-left  { float: left; }
.float-right { float: right; }
.align-left  { text-align: left; }
.align-right { text-align: right; }

/* display and additional classes */
.clear { clear: both; }

div#form-account-button, #form-emission-button, #form-child-node-button, #form-usages-button{
  padding-left: 12px;
}
td[title='Click to edit...']{
  font-style:italic;
}
.breadscrumb{
  margin-left: 10px;
}
.delete-node{
  float:left;
  margin-left: 10px;
  margin-top: 5px;
  clear: both;
}
.left-column{
  width: 48%;
  float: left;
}
.right-column{
  width: 48%;
  float: right;
}
.left-column table th, .right-column table th{
  height: 4em;
}

#submenu {
  clear: both;
  margin: 0 auto;
  padding: 5px;
  background: url(/images/menu.jpg) repeat-x 0 0;
  font: bold 12px/37px Verdana, Arial, Tahoma, Sans-serif;
  height: 37px;

  color: #FFF;
}
#submenu a {
  color: #FFF;
  text-decoration: none;
  margin-left: 20px;
}
/* jeditable highlight */
td[title="Click to edit."]{
  border: 1px solid;
  border-color: #c3efa5;
  margin: 5px;
  padding: 2px;
}
p.instruction{
  padding-bottom: 5px;
}

img.ui-datepicker-trigger{
  margin-bottom: -7px;
  border: none ;
}
#super-generate{
  width: 900px;
}

#generate-permission-div{
  width: 270px;
  height: 240px;
  float: left;
}
#generate-permission-div fieldset{
  width: 270px;
  height: 240px;
}
#generate-report{
  width: 300px;
  height: 240px;
  float: left;
}
.generate-export{
  width: 80%;
  /*height: 240px;
  float: left;*/
}
.generate-export form {
  margin-top: 0px;
  background-color: #EDF7E7;
}
.generate-export form fieldset{
  height: 240px;
}
#generate-report fieldset{
  width: 270px;
  height: 240px;
}
#usages-form-row th{
  text-align: center;
}

#energy-title{
  font-family: "Arial";
  font-weight: bold;
}
#insight-title{
  font-family: "Arial Black";
  font-weight: bold;
  margin-left: -13px;
}
#container input[type='button']{
  margin-left: 20px;
  margin-bottom: 5px;
}


.breadscrumb{
  margin-top: 5px;
}
.breadscrumb-span{
  display:inline-block;
  width: 600px;
}
.back-button{
  display:inline-block;
  width: 200px;
}
#browser-warning{
  padding-top: 1em;
  text-align: center;
  font-size: 1.4em;
}
#browser-warning #browser-energy{
  font-size: 1.6em;
  font-family: "Arial";
}
#browser-warning #browser-insight{
  font-size: 1.6em;
  font-family: "Arial Black";
}
table#usages-table-original {
  white-space: nowrap;
}
table#usages-table  td[field=usage_end] form input{
  width: 120px;
}
table#usages-table td[field=usage_end]{
    width: 100px;
}
table#usages-table #use, #use_demand_kw, #cost_utility, #cost_water, #cost_sewer, #cost_total, #cost_competitive_supply, #use_ccf, #cost, #use_onpeak, #use_offpeak, #use_shoulder, #fuel_grade{
  width: 5em;
}
table#usages-table td.unusable-end-date{
    /* color: green; */
}

.text-italic {
  font-style: italic;
}

.left-justify{
  text-align: left;
}
.right-justify{
  text-align: right;
}
.center-justify{
  text-align: center;
}

.node-tree {
  max-width: 700px;
}
.jstree-default .jstree-anchor {
  display: inline;
}
.node-buttons {
  float: right;
  clear: both;
}
.jstree-anchor .clear {
  display: inline;
}
.jstree-node {
  clear: both;
}

/* Overlay */
#confirm-overlay {background-color:#eee; cursor:wait;}

/* Container */
#confirm-container {height:auto; width:320px; font-family:'Trebuchet MS', Verdana, Arial; font-size:16px; line-height:26px; text-align:left; background:#fff; border:2px solid #336699;}
/*#confirm-container .header {height:30px; width:100%; background:url(../img/confirm/header.gif) repeat-x; color:#fff; font-size:1.1em; font-weight:bold; line-height:30px;}
#confirm-container .header span {padding-left:8px;}
#confirm-container .message {color:#333; margin:0; padding:12px 4px 12px 8px; font-size:1em;}
#confirm-container .buttons {width:160px; float:right; padding:10px 8px 0;}
#confirm-container .buttons div {float:right; margin-left:4px; width:70px; height:26px; color:#666; font-weight:bold; text-align:center; background:url(../img/confirm/button.gif) repeat-x; border:1px solid #bbb; cursor:pointer;}*/
#confirm-container a.modal-close,
#confirm-container a.modal-close:link,
#confirm-container a.modal-close:active,
#confirm-container a.modal-close:visited {text-decoration:none; font-size:1.1em; position:absolute; top:-1px; left:300px; color:#ccc;}
#confirm-container a.modal-close:hover {color:#eee;}
#simplemodal-data {text-align: center; width: 100%;}
#simplemodal-data .alert_box{padding-top:20px;}
td[us_type^='date']{
  width: 100px;
}

.pagination,
#pagination {
  position: relative;
  width: 100%;
  height: 20px;
}
.pagination .page_info,
#pagination #page_info{
  position: absolute;
  left: 10px;
  top: 3px;
}
.pagination .usage_links,
#pagination .usage_links{
  position: absolute;
  right: 10px;
  top: 3px;
}
.pagination .loading-link{
  color: red;
  padding-right: 5px;
}
#help_instruction{
  width: 100%;
  height: auto;
}
.hidden{
  display: none;
}
.invalid-pattern{
  color: #e7be00;
}

.admin-forms input[type='text']{
  width: 300px;
}
#flash_error {
  margin:10px; padding: 0 5px;
  border: 1px solid #f2f2f2;
  background-color: #FAFAFA;
  color: #3C3C3C;
}

#flash {
  padding: 1px;
}

#flash_errors, #flash_error {
  border: solid 2px #C00;
  background-color: #FA6;
  padding: 1em;
  font-weight: bold;
  color: #3C3C3C;
}

/* Styles that might be overwritten by branded css.html, but otherwise they look pretty much correct the way I have them */

.error-message { 
  color: red 
}

.stayblue:visited, .stay-blue:visited { 
  color: #0000DD 
}

/* Styles that ought to be run no matter what (only real way would be to add a (usually dummy) class and have that class defined in the branded css.html) */

.no-border, fieldset.no-border {
  border: none;
  padding: 0px
}

.no-left-margin, label.no-left-margin { /*used e.g. in spreadsheet import pages to flushify the labels with the readonly fields (have to add a label.no-left-margin because otherwise in css a label.inline overrides a bland no-left-margin*/
  margin-left: 0
}

.no-top-margin, label.no-top-margin {
  margin-top: 0
}

.no-bold, label.no-bold {
  font-weight: normal  
}

div.relation-download-choice a {
  color: #287DB2;
}

button.relation-expander,
a.relation-download {
  border: none;
  background: white;
  color: #151515;
  cursor: pointer;
}

table.relations-table {
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 0;
}

table.relations-table tr {
  height: auto;
}

table.relations-table > tbody > tr:nth-of-type(odd) > td {
  background-color: white;
}

table.relations-table > tbody > tr.force-prior-stripe:nth-of-type(even) > td {
  background-color: white;
}

table.relations-table > tbody > tr:nth-of-type(even) > td {
  background-color: #C3C3C3;
}

table.relations-table > tbody > tr.force-prior-stripe:nth-of-type(odd) > td {
  background-color: #C3C3C3;
}

table.relations-table > tbody > tr.warning-row > td {
  background-color: tomato;
}

table.relations-table tbody[id^="form-create-"] td {
  padding-top: 3px;
}

table.relations-table td,
table.relations-table td a.relation-delete img {
  padding: 0 3px;
}

table.relations-table tr td:last-child:not([colspan]) {
  text-align: center;
}

table.relations-table tr td:last-child,
table.relations-table tr th:last-child {
  border-right: 1px solid #dddddd;
}

table.relations-table thead.relation-header {
  position: sticky;
  top: 0;
  z-index: 3;
}

table.relations-table thead.relation-header th input.col-resizer {
  --thumb-height: 30px;
  -webkit-appearance: none;
  appearance: none;
  background: transparent;
  border: none;
  cursor: ew-resize;
  height: 0;
  left: 0;
  padding: 0;
  pointer-events: none;
  position: absolute;
  top: 1px;
  width: 10000px;
}

/* Firefox */
@supports (-moz-appearance:none) {
  table.relations-table thead.relation-header th input.col-resizer {
    --thumb-offset: 15px;
    top: var(--thumb-offset);
  }
}

table.relations-table thead.relation-header th input.col-resizer[disabled] {
  cursor: not-allowed;
}

/* Chrome, Safari, Opera, and Edge Chromium */
table.relations-table thead.relation-header th input.col-resizer::-webkit-slider-runnable-track {
  background: #d9eaf5;
  height: 0;
}

/* Firefox */
table.relations-table thead.relation-header th input.col-resizer::-moz-range-track {
  background: #d9eaf5;
  height: 0;
}

/* Chrome, Safari, Opera, and Edge Chromium */
table.relations-table thead.relation-header th input.col-resizer::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  background: #000;
  border: none;
  height: var(--thumb-height);
  pointer-events: auto !important;
  width: 4px;
}

  /* Firefox */
table.relations-table thead.relation-header th input.col-resizer::-moz-range-thumb {
  -webkit-appearance: none;
  appearance: none;
  background: #000;
  border: none;
  height: var(--thumb-height);
  pointer-events: auto !important;
  width: 4px;
}

table.relations-table thead.relation-header th {
  overflow: hidden;
}

table.relations-table tbody[id^="form-create-"] td.relation-sticky,
table.relations-table tbody[id$="-list"] td.relation-sticky,
table.relations-table thead.relation-header th.relation-sticky {
  position: sticky;
}

table.relations-table tbody[id^="form-create-"] td.relation-frozen-last,
table.relations-table tbody[id$="-list"] td.relation-frozen-last,
table.relations-table thead.relation-header th.relation-frozen-last {
  border-right: 1px solid #DDDDDD;
}

table.relations-table thead.relation-header th a.column-resizer {
  font-size: large;
}

table.relations-table thead.relation-header th a.column-resizer[resizing="on"] {
  color: black;
}

table.relations-table thead.relation-header th.light a.column-resizer[resizing="on"] {
  color: red;
}

table.relations-table thead.relation-header th a.required {
  color: tomato;
}

table.relations-table thead.relation-header th a.required:hover {
  color: #d9eaf5;
}

table.relations-table thead.relation-header th.light {
  background: #fff;
  border-bottom: 1px solid black;
}

table.relations-table thead.relation-header th.light a {
  color: #000;
}

table.relations-table thead.relation-header th.light a:hover {
  color: #8ed0fb;
}

table.relations-table thead.relation-header th.light a.required {
  color: tomato;
}

table.relations-table thead.relation-header th.light a.required:hover {
  color: #8ed0fb;
}

div.relation-tab:not(.relation-tab-expanded) table.relations-table .hide-relation-field {
  display: none;
}

div.relation-tab.relation-tab-expanded table.relations-table .hide-relation-field {
  display: revert;
}

table.relations-vertical-form {
  border: none;
  margin: 0;
  width: 100%;
}

table.relations-vertical-form tbody,
table.relations-vertical-form td {
  border: none;
}

table.relations-vertical-form td.input {
  width: 70%;
}

table.relations-vertical-form td.input input[type="button"],
table.relations-vertical-form td.input input[type="button"] ~ span {
  float: left;
}

table.relations-vertical-form td.input input[type="button"][embedded] ~ div {
  clear: left;
}

table.relations-vertical-form td.label {
  text-align: right;
  width: 30%;
}

table.relations-vertical-form td.buttons {
  text-align: left;
}

div#TB_ajaxContent.TB_modal.workflow-container {
  padding: 0 15px 15px 15px;
}

div#TB_ajaxContent.TB_modal.workflow-container h3.workflow-header {
  background-color: white;
  position: sticky;
  top: 0;
  z-index: 6
}

div#TB_ajaxContent.TB_modal.workflow-container div.workflow-wrapper {
  --workflow-header-height: 37px;
}

div.ui-dialog.relation-dialog {
  z-index: 107;
}

div.ui-dialog.relation-dialog ~ div.ui-widget-overlay ~ #TB_overlay {
  z-index: 108;
}

div.ui-dialog.relation-dialog ~ div.ui-widget-overlay ~ #TB_overlay ~ #TB_window {
  z-index: 109;
}

button.ui-dialog-titlebar-close.relation-dialog {
  display: none;
}

div.ui-dialog.relation-dialog ~ div.ui-widget-overlay {
  position: fixed;
  height: 100vh;
  width: 100vw;
}

div.ui-tooltip.relation-tooltip {
  opacity: 1;
  width: fit-content;
}

span.search-highlight {
  background-color: #eded68;
  display: inline !important;
}

.ml-0 {
  margin-left: 0 !important;
}

.grecaptcha-badge { visibility: hidden; }