html {
  background: black;
  color: white;
  font-family: 'Raleway', 'sans-serif';
}
body {
  text-align: center;
}
#content {
  text-align: left;
  margin: auto;
  width: 850px;
}

.mmtchart {
  background: black;
}

.axis path,
.axis line {
    fill: none;
    stroke: white;
    shape-rendering: crispEdges;
}
.axis text {
    font-size: 11px;
    fill: white;
}

path.line {
  fill: none;
}
svg {
   -moz-user-select: -moz-none;
   -khtml-user-select: none;
   -webkit-user-select: none;
   -ms-user-select: none;
   user-select: none;
}

#lim1 text, #lim2 text {
  stroke: white;
  font-size: 12px;
}

#lim1_line, #lim2_line {
  stroke: rgb(150,150,150);
  stroke-width: 1px;
}


.sel, .selact {
  display: inline-block;
  padding: 5px 15px;
  border-radius: 10px;
  font-weight: bold;
}
.sel {
  background: rgb(200,200,200);
  color: rgb(50,50,50);
  border: 2px solid rgb(200,200,200);
}
.selact:hover {
  border: 2px solid rgb(200,200,200);
  color: rgb(200,200,200);
}
.selact {
  color: rgb(50,50,50);
}


path.rtrack {
  stroke-opacity: .3;
}

path.line_mmt13 {
  stroke: rgb(150,150,250);
}
#btn_mmt13.sel:hover {
  border: 2px solid rgb(150,150,250);
  color: rgb(150,150,250);
}
#btn_mmt13.selact {
  background: rgb(150,150,250);
  border: 2px solid rgb(150,150,250);
}


path.line_mmt12 {
  stroke: rgb(150,250,150);
}
#btn_mmt12.sel:hover {
  border: 2px solid rgb(150,250,150);
  color: rgb(150,250,150);
}
#btn_mmt12.selact {
  background: rgb(150,250,150);
  border: 2px solid rgb(150,250,150);
}

path.line_mmt11 {
  stroke: rgb(250,150,150);
}
#btn_mmt11.sel:hover {
  border: 2px solid rgb(250,150,150);
  color: rgb(250,150,150);
}
#btn_mmt11.selact {
  background: rgb(250,150,150);
  border: 2px solid rgb(250,150,150);
}

.aspoints {
  fill: white;
  font-size: 9px;
}