/*general*/
body{font-size:12px;font-family:sans-serif;margin:0;}
input{width:150px;opacity:.8;}

button:disabled {
    opacity: 0.3;
}

/*navigation*/
#nav{
  overflow: hidden;
  background-color: #000;
  position: fixed;
  top: 0;
  width: 100%;
  color: #ddd;
  font-family: Baskerville, Georgia, serif;
  font-size:14px;
  }
#nav .button{
  background-color: #333;
  border:none;text-align:center;
  display:inline-block;
  padding:5px 10px;
  border-radius: 8px;
  -webkit-transition-duration: 0.4s; /* Safari */
  transition-duration: 0.4s;
  margin:5px 5px;color:#ddd;}
#nav .button:hover {color: white;}
#nav #goData{margin-left:150px;background: color #666;;}

/*menu*/
.menu{
  width:18%;height:900px;float:left;background-color: #ccc;
  padding:2cqi 10px;
}

.menu header{
  font-size:18px;
  font-weight: bold;
  font-family: Helvetica, Arial, sans-serif;
  margin-bottom:10px;
}

.menu hr{
  margin-top:10px;
}

#menuRender{
  display:none;
}
.menu button {
    background-color: #08519c;
    border: none;
    color: white;
    padding: 5px 10px;
    margin: 3px 0;
    text-decoration: none;
    display: inline-block;
    font-size: 12px;
}

.menu button.colors {
     border: none;
     color: white;
     padding: 5px 5px;
     width: 7px;
     display: inline-block;
     box-shadow: 1px 1px 1px #333;
}

.menu select{
    background-color: #08519c;
    color: white;
    padding: 3px 5px;
    font-size: 10px;
}

.menu label{
  display: inline-block;
  background-color: #ddd;
  padding: 5px 10px;
  margin: 3px 0;
  font-size:12px;
}

.menu input[type="radio"] {
  opacity: 0;
  position: fixed;
  width: 0;
}

.menu input[type="radio"]:focus + label {
    border: 1px dashed #444;
}

.menu input[type="radio"]:checked + label{
    background-color:#6a89a5;
    border-color: #4c4;
}

.menu label:hover {
  background-color: #9cafbc;
}

#grids{
  position:relative;
  height:130px;
}

#yval{
  position:absolute;
  top:95px;
  left:30px;
}
#xval{
  position:absolute;
  top:30px;
  left:95px;
}

#results{
  font-size:6px;
}

#controls {
  padding: 10px;
  background-color: rgb(255, 255, 255);
}
#controls a {
  display: inline;
}

/*main section*/
#dataResults{font-size:10px;color:#999;margin-top:350px;width:200px;float:left;}

#map{width:80%;height:600px;float:left;margin-top:35px}
#sketch{width:80%;height:600px;float:left;margin-top:35px; display: none;}