#visualizer {
    text-align: center;
}

#visualizer #canvas {
    margin-top: 4%;
}

canvas#mirror{
    opacity: 0.5;
    position: relative;
    top: -90px;
    -webkit-transform: scaleY(-0.3);
    -moz-transform: scaleY(-0.3);
    -ms-transform: scaleY(-0.3);
    transform: scaleY(-0.3);
}
div#mirrorWrapper{
    height: 150px;
}


div#mirrorWrapper:after {
    display: block;
    height: 100px;
    width: 100%;
    position: relative;
    top: -257px;
    content: " ";
    background: -moz-linear-gradient(top,rgba(39,40,34,0) 0%, rgba(39,40,34,1) 75%);
    background: -webkit-linear-gradient(top,rgba(39,40,34,0) 0%, rgba(39,40,34,1) 75%);
    background: -o-linear-gradient(top,rgba(39,40,34,0) 0%, rgba(39,40,34,1) 75%);
    background: -ms-linear-gradient(top,rgba(39,40,34,0) 0%, rgba(39,40,34,1) 75%);
    background: linear-gradient(top,rgba(39,40,34,0) 0%, rgba(39,40,34,1) 75%);
}

