body {
  background: url( background.png ) repeat-x;
  background-image: linear-gradient( #d8e5e0, white 250px );
  font-family: Arial, Helvetica, sans-serif;
  margin-left:10px;
  color: #222;
}

a       { color: #386351; }
a:hover { color: #50856b; }

h1 {
  font-weight:bold;
  font-size:2.5em; color:#36614e;
  text-shadow:1px 2px 2px #b9c9b9;
}

hr { border:0;
     height:1px;
     background:#36614e;
     background:linear-gradient( to right, rgba( 54, 97, 78, 0.3 ),
                                           rgba( 54, 97, 78, 0   ) 90% ); }


h2,h3,h4 { font-weight:bold; margin-top:15px; color:#546856; }
h2 { font-size:22px; }
h3 { font-size:19px; }
h4 { font-size:19px; }

p { margin-top: 10px; }

#tabular table {
  margin-left: auto;
  margin-right: auto;
}

#tabular {
  overflow:auto;
  height:300px;
}

#tabular th {
  background-color:#386351;
  padding: 0px 5px;
  color:white;
  border-left:1px solid #dcece9;
  vertical-align:bottom;
  text-align:center;
}

#tabular td {
  border-left:1px solid black;
  padding: 0px 5px;
  text-align:center;
}

td.ws {
  background-color:#ccc;
  color:black;
}

tr.wsodd       { background-color:#eee; }
tr.wsodd td.ws { background-color:#bbb; }

.demo-container {
  position:relative;
  box-sizing: border-box;
  width: 90%;
  height: 70%;
  padding: 20px 15px 15px 15px;
  margin: 15px auto 30px auto;
  border: 1px solid #ddd;
  background: #fff;
  background:         linear-gradient(#f6f6f6 0, #fff 50px);
  background:      -o-linear-gradient(#f6f6f6 0, #fff 50px);
  background:     -ms-linear-gradient(#f6f6f6 0, #fff 50px);
  background:    -moz-linear-gradient(#f6f6f6 0, #fff 50px);
  background: -webkit-linear-gradient(#f6f6f6 0, #fff 50px);
  box-shadow:         0 3px 10px rgba(0,0,0,0.15);
  -o-box-shadow:      0 3px 10px rgba(0,0,0,0.1);
  -ms-box-shadow:     0 3px 10px rgba(0,0,0,0.1);
  -moz-box-shadow:    0 3px 10px rgba(0,0,0,0.1);
  -webkit-box-shadow: 0 3px 10px rgba(0,0,0,0.1);
}

.demo-container:before { content:""; display:block; padding-top:67%; }

.demo-placeholder {
  min-height: 200px;
  font-size:  14px;
  position:   absolute;
  top:    0;
  bottom: 0;
  left:   0;
  right:  0;
  line-height: 1.2em;
}

.legend table { border-spacing: 5px; }
