.black{
    background-image: url("images/synth_colors/black.png");
    color: white;
    font-family: "neon";
}


.double-section {
    margin: 0;
    height: 100%;
    width: 49.5%;
    text-align: center;
    display: inline-block;
    float: left;
}

.envelopeKnob-container{
  margin-top: 7px;
  display: inline-block;
}

.knob-label.filterlbl{
  margin-top: 30px;
}

.section-name.fxlbl{
  margin-bottom: 5px;
}

.green {
    background-image: url("images/synth_colors/green.png");
    font-family: "neon";
}

.invert-color{
-webkit-filter: invert(1);
filter: invert(1);
}

.knob-label{
  font-weight:normal;
  font-size: 12px;
  margin-top: 4px;
  margin-bottom: 10px;
  font-weight: bold;
}

.label {
    font-weight: bold;
    margin-bottom: 10px;
    margin-top: 5px;

}

.large,.medium{
      height: 390px;
}

.large {
    width: 248px;
}

.lightblue {
    border: 2px solid rgba(207, 31, 31, 0.7);
    background-image: url("images/synth_colors/blue.png");
    font-family: "neon";
}

.main-container {
    position: absolute;
    margin: 0 0px;
    border-radius: 2px;
    text-align: center;
    display: inline-block;
    border: 2px solid rgba(25,25,25,1);
    box-shadow: 1px 4px 4px 0px rgba(0,0,0,0.7), -1px -1px 2px 0px rgba(0,0,0,0.7);
    z-index: 1;
}

.medium {
    width: 124px;
}

.oscillators {
    margin: 20px auto auto;
}

.radio-container {
    display: block;
}

.radioWaveOsc{
  margin-top: 30px;
}

.radioOctOsc{
  margin-top: 30px;
  margin-bottom: 20px;
}

.red {
  border: 2px solid rgba(207, 31, 31, 0.7);
  background-image: url("images/synth_colors/red.png");
  box-shadow: 1px 4px 4px 0px rgba(0, 0, 0, 0.7), -1px -1px 1px 0px rgba(207, 31, 31, 0.7);
  font-family: "neon";
}

.section-name {
    font-weight: bold;
    font-size: 1.2em;
    margin: 1em auto;
}

.separator {
    margin: 0;
    float: left;
    width: 1%;
    height: 310px;
    background-color: black;
}

.envelopeKnob-container > .singleKnob{
  margin : 15px;
  margin-top: 10px;
}

.envelopeKnob-container > .singleKnob:first-child{
    margin-top: 0px;
}

.singleKnob{
  margin-top: 10px;
}

.singleKnob.resonance{
  margin-top: 42px;
}
.small {
  margin: auto;
    width: 124px;
    height: 130px;
}

.toggle{
  margin-top: 0px;
}

.typelbl{
  margin-top: 42px;
  margin-bottom: 10px;
}

.vertical-radio {
    display: inline-block;
    text-align: center;
}

.yellow {
    height: 125px;
    border: 2px solid rgba(237, 217, 87, 0.7);
    background-image: url("images/synth_colors/yellow.png");
    box-shadow: 1px 1px 1px 0px rgba(0, 0, 0, 0.7), -1px -1px 1px 0px rgba(0, 0, 0, 0.7);
    font-family: "neon";
}


img {
    width: 25px;
    height: 25px;
    display: block;
}


#modulation{
  /*left: 372px; */
  left: 0px;
}

#oscillators{
/*left: 124px;*/
left: 248px;
}

#mixer{
  left: 496px;
  border-left: 0px;
  border-right: 0px;
}

#filter{
  left:620px;
}

#envelope{
  left: 744px;
  border-left: 0px;
}

#output{
  left: 992px;
}

#delay{
left: 992px;
top:130px;
}

#reverb{
left: 992px;
top:260px;
}