
body {
  font-family:"Times New Roman";
 text-decoration: bold;
  background: #111;
}

.waveform {
  margin: 0 auto;
  width: 300px;
}

.left_hand {
  position: fixed;
  bottom: 10px;
  left: 10px;
}

.right_hand {
  position: fixed;
  bottom: 10px;
  right: 10px;
}

.metronome {
  margin: 0 auto;
  text-align: center;
  width: 700px;
  height: 500px;
  background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(102, 102, 102)), color-stop(0.6, rgb(51, 51, 51)), to(rgb(102, 102, 102)));
  background-image: -moz-linear-gradient(19% 75% 90deg,#5C5C5C, #6E6E6E, #3B3B3B 100%);
/*
  -moz-box-shadow: -3px -3px 10px #000;
  -webkit-box-shadow: -3px -3px 10px #000;
  box-shadow: -3px -3px 10px #000;
*/

  -moz-border-radius: 15px;
  border-radius: 15px;

}

.sheet_music {
  padding: 15px 0px 20px 0px;
  margin: 10px 0px 0px 0px;
  width: 500px;
/*
  -moz-box-shadow: -3px -3px 10px #000;
  -webkit-box-shadow: -3px -3px 10px #000;
  box-shadow: -3px -3px 10px #000;
*/

  -moz-border-radius: 15px;
  border-radius: 15px;
}


select {
    font-family: silkscreen;
    padding:3px;
    margin: 0;
    -webkit-border-radius:4px;
    -moz-border-radius:4px;
    border-radius:4px;
    
/*
    width: 150px;
*/

    color:#aaa;
    background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(102, 102, 102)), color-stop(0.6, rgb(51, 51, 51)), to(rgb(102, 102, 102)));
    background-image: -moz-linear-gradient(19% 75% 90deg,#5C5C5C, #6E6E6E, #3B3B3B 100%);

    border:none;
    outline:none;
    display: inline-block;
    -webkit-appearance:none;
    -moz-appearance:none;
    appearance:none;
    cursor:pointer;
    text-indent: 20px;
}

.center {
  margin: 0 auto;
  width: 75%;
}

.user_interface {
  margin: 0 auto;
  position:relative;
  text-align: center;
  padding: 20px 10px 10px 5px;
  width: 686px;
  height: 140px;
  background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(102, 102, 102)), color-stop(0.6, rgb(51, 51, 51)), to(rgb(102, 102, 102)));
  background-image: -moz-linear-gradient(19% 75% 90deg,#5C5C5C, #6E6E6E, #3B3B3B 100%);
/*
  -moz-box-shadow: -3px -3px 10px #000;
  -webkit-box-shadow: -3px -3px 10px #000;
  box-shadow: -3px -3px 10px #000;
*/

  -moz-border-radius: 15px;
  border-radius: 15px;
  border: 1px solid #000;
}

.rolodex {
  float: left;

  text-align: center;
  padding: 1px 1px 1px 1px;
/*
  width: 40;
*/
  height: 100px;
  border-collapse: collapse;
  color: #ccc;
/*
  color: hsla(170, 45%, 45%, 1);
  background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(102, 102, 102)), color-stop(0.6, rgb(51, 51, 51)), to(rgb(102, 102, 102)));
  background-image: -moz-linear-gradient(19% 75% 90deg,#5C5C5C, #6E6E6E, #3B3B3B 100%);
*/
/*
  -moz-box-shadow: -3px -3px 10px #000;
  -webkit-box-shadow: -3px -3px 10px #000;
  box-shadow: -3px -3px 10px #000;
  -moz-border-radius: 5px;
  border-radius: 5px;
*/

}



.slider {
  float: right;
  margin-right: -20px;
/*
  height: 100;
*/
  text-align: left;
  border-collapse: collapse;
  color: #ccc;
/*
  padding: 0px 0px 0px 10px;
*/
}


.up {
  /*padding: 10px 10px 10px 10px;*/
  cursor: pointer;
  color: hsla(184, 5%, 5%, 0.81);
}

.up:hover {
  color: hsla(184, 85%, 55%, 0.81);
}

.down {
  /*padding: 8px 8px 8px 8px;*/

  cursor: pointer;
  color: hsla(184, 5%, 5%, 0.81);
}

.down:hover {
  color: hsla(184, 85%, 55%, 0.81); 
}

.play {
  padding: 1px 1px 1px 1px;
}

.stop {
  padding: 1px 1px 1px 1px;
}


.table {
  float: left;
  font-size: x-small;
  color: #ccc;
/*
  border-left: 1px solid #888;
  border-top: 1px solid #888;
*/
}

td,th {
/*
  border-right: 1px solid #888;
  border-bottom: 1px solid #888;
*/
  text-align: center;
  padding: 2px;
}

/*awesome trick for centering div within div */
/* http://stackoverflow.com/questions/114543/how-to-center-a-div-in-a-div-horizontally */
.centerme {
  width: 50%;
  margin: 0 auto;
}

.remote_cli {
  font-size: xx-small;
  font-family:"Times New Roman",Times,serif;
}


.select_sounds {
  position: absolute;
  top: 10px;
  right: 10px;
  padding: 15px 0px 20px 0px;
  margin: 10px 0px 0px 0px;
  width: 600px;
  -moz-box-shadow: -3px -3px 10px #000;
  -webkit-box-shadow: -3px -3px 10px #000;
  box-shadow: -3px -3px 10px #000;

  -moz-border-radius: 15px;
  border-radius: 15px;
}


.gantt {
  width: 500px;
  margin: 0 auto;
}
