/* TUNER */

#title-tuner {
    margin-top : 70px;
}

#tuner {
    display : block;
    width : 100%;
    max-width : 400px;
    margin : 0px auto 0px auto;
    padding : 20px;
    border : 1px solid #555;
    border-radius : 5px;
    background-color :var(--topnavBg)
}


#tuner-notename {
    display : block;
    text-align : center;
    font-size : 3em;
}

#tuner-freqdatas {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom : 10px;

}
#tuner-freqdatas-inner {

}
#tuner-visualizer-container {
    display: flex;
    justify-content: center;
    align-items: center;
    height : 1em;
}
#tuner-visualizer{
    width : 100%;
    height : 1em;
    background-image: linear-gradient(
        to right,
        red 0%,
        orange 22%,
        green 50%, orange 78%,
        red 100%
    );
  background-size: 100% 100%;
  background-repeat: no-repeat;

}
#tuner-visualizer.flat {
    /*background-color : orange;*/
}

#tuner-visualizer.sharp {
    /*background-color : orange;*/
}

#tuner-visualizer-a {
    display : block;
    height : 1em;
    width : 10%;
    margin-left : 45%;
    background-color : black;
    opacity : 0.7;

}
#tuner-visualizer-a.flat {
    margin-left : 25%;

}

#tuner-visualizer-a.sharp {
    margin-left : 65%;
}