/* Chart fonts */
@font-face {
  font-family: 'Roboto';
  src: url(fonts/Roboto-Medium.ttf) format('truetype');
}
@font-face {
  font-family: 'Roboto Condensed';
  src: url(fonts/RobotoCondensed-Regular.ttf) format('truetype');
}
@font-face {
  font-family: 'Roboto Condensed';
  src: url(fonts/RobotoCondensed-Bold.ttf) format('truetype');
  font-weight: bold;
}
/* Subscript that doesn't increase line height*/
sup, sub {
  vertical-align: 0;
  position: relative;
}
sup {
  bottom: 1ex;
}
sub {
  top: 0.8ex;
}
body {
  color: #231f20;
  background-color: #e6e7e8;
}
/*
Don't pad the bottom, because it sometimes causes a vertical scrollbar to appear.
Instead, include the padding when calculating canvas height.
Use Bootstrap styles for padding-left and -right, matching it here on top.
This also works around a jQuery 2 bug that rounds element widths, throwing
off layout calculations and resulting in scrollbars.
*/
.main-wnd {
  padding-top: 15px;
}
.help-wnd {
  padding: 15px;
}
canvas {
  padding: 15px 15px 0 15px;
  background-color: #ffffff;
}
.legend {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between;
  align-items: center;
  height: 6.3vh;
  background-color: #fff;
  padding-left: 1vh;
  padding-right: 1vh;
}
.legend-item {
  color: #fff;
  padding: 0.5vh 1vh 0.5vh 1vh;
  text-align: center;
  /*smaller box height*/
  line-height: 1.1;
  flex: 1 0 auto;
}
#tempPanel {
  margin-top: 4vh;
}
#tempGauge {
  background-color: #fff;
  display: flex;
  flex-flow: column nowrap;
  justify-content: center;
  align-items: center;
}
#tempBox {
  padding: 1vh;
  text-align: center;
}
/* The font sizes for temp box strings are set dynamically.
These values serve as starting points. */
#tempIncreaseValue {
  font-size: 11vh;
}
#tempIncreaseUnits {
  font-size: 6vh;
  vertical-align: 40%;
}
#tempIncreaseLabel {
  font-size: 2.1vh;
}
.logo {
  display: block;
  width: 100%;
  margin-bottom: 1vh;
  margin-left: auto;
  margin-right: auto;
  background-color: #fff;
}
.form-control {
  height: 6vh;
  font-size: 3.5vh;
  background-color: #fff;
  border-style: none;
}
input[type="text"] {
  height: 2vh;
  font-size: 2vh;
}
.input-table-errmsg {
  height: 4vh;
  color: #fff;
  padding-left: 2.5vh;
  margin-left: 2vh;
  margin-right: 2vh;
  display: flex;
  align-items: center;
}
/* separate table cells */
#inputTable > table {
  border-collapse: separate;
  border-spacing: 0.5vh;
  margin-bottom: 0;
}
/* row header */
#inputTable > table > tbody > tr > th {
  font-family: "Roboto Condensed";
  font-size: 2.0vh;
  color: #fff;
  line-height: 1;
  vertical-align: middle;
  padding-top: 0;
  padding-bottom: 0;
  padding-left: 0.3vw;
  padding-right: 0.3vw;
}
/* column header */
#inputTable > table > thead > tr > th {
  font-family: "Roboto Condensed";
  font-size: 2.0vh;
  line-height: 1.1;
  text-align: center;
  vertical-align: middle;
  padding-top: 0;
  padding-bottom: 0.3vw;
  padding-left: 0.1vw;
  padding-right: 0.1vw;
}
/* table cell */
#inputTable > table > tbody > tr > td {
  font-size: 2.5vh;
  background-color: #fff;
  text-align: center;
  vertical-align: middle;
}
/* individual row header colors */
#inputTable > table > tbody > tr.region-1 > th {
  background-color: #d33700;
}
#inputTable > table > tbody > tr.region-2 > th {
  background-color: #009e73;
}
#inputTable > table > tbody > tr.region-3 > th {
  background-color: #e69f00;
}
#inputTable > table > tbody > tr.region-4 > th {
  background-color: #56b4e9;
}
#inputTable > table > tbody > tr.region-5 > th {
  background-color: #cc79a7;
}
#inputTable > table > tbody > tr.region-6 > th {
  background-color: #0072b2;
}
#inputCell {
  display: none;
  position: absolute;
  font-size: 2.5vh;
  color: #231f20;
}
/* data table */
#dataTable {
  width: auto;
}
#dataTable > tbody > tr > td.data-label {
  text-align: left;
  font-size: 1.5em;
}
#dataTable > tbody > tr > td.data-value {
  text-align: right;
  font-size: 1.5em;
}
/* assumptions & sensitivies panel */
#assumptionsPanel {
  position: fixed;
  background-color: #fff;
  color: #000;
  z-index: 900;
  overflow-x: hidden;
  overflow-y: scroll;
  display: none;
}
#assumptionsPanel > header > span {
  font-family: "Roboto Condensed";
  font-weight: bold;
  padding-left: 1vh;
}
#assumptionsButtons {
  float: right;
  margin-right: 0.8vh;
  margin-bottom: 1vh;
}
#assumptionsForm {
  margin: 0 0.5vh;
}
#assumptionsForm > table > tbody > tr:nth-child(odd) {
  background-color: #e5e5e5;
}
#assumptionsForm > table > tbody > tr > td {
  font-family: "Roboto Condensed";
  font-weight: bold;
  padding: 0 1vh 0 1vh;
  white-space: nowrap;
}
#assumptionsForm > table > tbody > tr > td > label {
  margin-bottom: 0;
}
#assumptionsForm > table > tbody > tr > td:last-child {
  width: 100%;
}
/* The loading spinner is centered in the window. */
#loadingSpinner {
  width: 128px;
  height: 128px;
  position: absolute;
  top:0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 901;
  margin: auto;
  display: none;
}