body{ text-align: center; }

#container{
  margin: auto;
  width: 1050px;
  overflow: auto;
}

canvas{
  display: block;
  float: left;
  cursor: default;
}

#controls{ 
  width: 540px;
  float: left;
}

#controls form{
  padding: 0 5px;
  float: left;
  text-align: center;
}

#controls-container{ overflow: auto; }

form#scene-controls{ width: 240px; }
form#instance-controls{ width: 280px; }

#scene-controls select#instanceSelect{ width: 100%; }
#scene-controls select#meshSelect{ width: 77%; }
#scene-controls button#createBtn{ width: 20%; margin-left: 5px; }
#scene-controls button#exportBtn{ width: 100%; }
#scene-controls button#importBtn{ width: 100%; }
#scene-controls button#deleteBtn{ width: 100%; }
#scene-controls button#clearBtn{ width: 100%; }
#scene-controls input#importFile{ display: none; }
#scene-controls button{ margin-bottom: 10px; }

#instance-controls label[for=name]{ width: 20%; }
#instance-controls input#name{ width: 60%; }
#instance-controls label[for=color]{ width: 20%; }
#instance-controls input#color{ width: 60%; }

fieldset{ border: none; }

.ranges input{float: right;}

.ranges output{
  float: right;
  width: 40px;
}

label{
  display: inline-block;
  margin-bottom: 10px;
}

#info{margin-top: 30px;}
#info p{
  margin: 10px 0;
  color: #666;
}

#comments{margin-top: 30px;}