@charset "UTF-8";
/* CSS Document */

body {
    font-family: Palatino;
    text-align: center;
    color: white;
    padding: 20px;
    background-color: #000000;
}

a:link {
    color: white;
}

a:visited {
    color: white;
}

a:hover {
    color: orange;
}

a:active {
    color: yellow;
}

.tuner-button {
    display: inline-block;
    margin: 10px;
    padding: 20px;
    color: #000000;
    font-size: 3em;
    font-weight: bold;
    border: none;
    border-radius: 5px;
    cursor: pointer;
}
#e2 { /* 6th string - Red */
    background-color: #ff0000;
}
#e2:hover {
    background-color: #cc0000;
}
#a2 { /* 5th string - Orange */
    background-color: #ff7f00;
}
#a2:hover {
    background-color: #cc6600;
}
#d3 { /* 4th string - Yellow */
    background-color: #ffff00;
}
#d3:hover {
    background-color: #cccc00;
}
#g3 { /* 3rd string - Green */
    background-color: #00ff00;
}
#g3:hover {
    background-color: #00cc00;
}
#b3 { /* 2nd string - Blue */
    background-color: #0000ff;
}
#b3:hover {
    background-color: #0000cc;
}
#e4 { /* 1st string - Purple */
    background-color: #800080;
}
#e4:hover {
    background-color: #660066;
}
canvas { 
    display: block; 
    margin: auto;
}