body {
  background-color: #ccffff;
  font-size: 100%;
}


h1 {
  color: DodgerBlue;
  text-align: center;
  font-size: 2.5em; /* 40px/16=2.5em */
  font-family: Georgia, Verdana, sans-serif;
  display: block;
  margin-top: 0.67em;
  margin-bottom: 0em;
  margin-left: 0;
  margin-right: 0;
  font-weight: bold;
}

h2 {font-size: 1.875em; color: DodgerBlue;  margin-top: 0.3em;  margin-bottom: 0em;}
h3 {font-size: 1.875em; color: DodgerBlue;  margin-top: 0.3em;  margin-bottom: 0em; text-align: center;}
h4 {font-size: 1.875em; color: Black;  margin-top: 0.3em;  margin-bottom: 0em; text-align: center;}
p {font-size: 1.125em;}
h2, p, label, input {font-family: Verdana, Tahoma, sans-serif;}


.center {text-align: center;   color: blue;}
.error {color: red;}

p.rptext{padding-left: 5%; color: red;}
p.t1 {padding-left: 5%; padding-right: 5%; margin-top: 0.3em; margin-bottom: 0.3em;}
p.t1red {padding-left: 5%; padding-right: 5%; margin-top: 0.3em; margin-bottom: 0.3em; color: red;}
p.leftpad {font-size: 1.0em; padding-left: 5%;}
p.spacer{font-size: 1.0em;}
p.resultsdisplay {font-size: 1.125em; padding-left: 5%; color: DodgerBlue;}
label.finput {padding-left: 5%; font-size: 1.125em;}
label.slidevalue {font-size: 1.0em; text-align: center; margin-top: 0.0em; margin-bottom: 1.125em; color: #4CAF50;}
input.valueBox {font-size: 1.0em; border: none; color: #4CAF50; background-color: #ccffff;}
p.iderror {padding-left: 5%; font-size: 1.875em; color: Fuchsia;  font-weight: bold; margin-top: 0.3em;  margin-bottom: 0em;}

table {
  border: 0px;
  width: 95%;
  padding: 0px;
}

td, th {
  border: 0px;
  text-align: center;
  font-size: 0.875em;
  padding-left: 1px;
  padding-right: 1px;
}

td {width: 20%;}

/* h3.hidden {visibility: hidden;  visibility: visible;} */

ul {
  list-style-type: none;
  margin: 0;
  padding: 3%;
  margin-top: 0em;
  margin-bottom: 0em;
}
li {
  display: inline;
  font-size: 1.125em;
}
li a:hover {
  background-color: white;
}
a {text-decoration: none;}

label {font-size: 1.125em;}
input {font-size: 1.125em;}

.selecttext {font-size: 1.125em; font-family: Verdana;}

button {
background-color: #4CAF50; /* Green */
text-align: center;
color: white;
font-weight : bold ;
text-decoration: none;
display: inline-block;
font-size: 1.25em;
border-style: solid;
border-color: #006600
}

button:hover {
  background-color: DodgerBlue;
  border-color: #000099;
}

#submitButton{
  background-color: #4CAF50; /* Green */
  text-align: center;
  color: white;
  font-weight : bold ;
  text-decoration: none;
  display: inline-block;
  font-size: 1.25em;
  border-style: solid;
  border-color: #006600
  }

  #submitButton:hover {
  background-color: DodgerBlue;
  border-color: #000099;
  }

.slidecontainer {
  width: 100%;
}

.slider {
  -webkit-appearance: none;
  appearance: none;
  width: 77%;
  height: 25px;
  background: #d3d3d3;
  outline: none;
  opacity: 0.9;
  -webkit-transition: .2s;
  transition: opacity .2s;
}

.slider:hover {
  opacity: 1;
}

.slider::-moz-range-thumb {
  width: 3px;
  height: 25px;
  background: #4CAF50;
  cursor: pointer;
}

.slider::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 3px;
  height: 25px;
  background: #4CAF50;
  cursor: pointer;
}

input[type=range]:active::-webkit-slider-thumb{
  -webkit-appearance: none;
  appearance: none;
  opacity: 0;

}

input[type=range]:active::-moz-range-thumb{
  appearance: none;
  opacity: 0;
}