@font-face {
   font-family: Roboto;
   src: url('../fcr_files/font/Roboto-Regular.ttf') format("truetype");
}
body { background-color: #000000; color: #a2a2a2; font-family: 'Roboto'; }
h1 { color: #ffffff; font-size: 18px; }
h2 { color: #a2a2a2; font-size: 16px; line-height: 20px; font-weight: normal}
a { color: #888888; font-size: 15px; text-decoration: none; }
a:hover {
    color: #ffffff;
    text-decoration: none;
}
#wrapper { width: 400px; margin: 40px auto; }
#caution { width: 400px; margin: 40px auto; }
ol { padding: 0px; margin: 0px; list-style: none; color: #000000; width: 460px; border-top: 1px solid #000000; font-size: 0.9em; }
ol li { position: relative; margin: 0px; padding: 7px 2px 7px; border-bottom: 1px solid #424242; cursor: pointer; }
ol li a { display: block; text-indent: 0ex; padding: 0px 0px 0px 20px; }
li.playing { color: #ffffff; }
li.playing a { color: #ffffff; font-weight: normal;}
li.playing:before { width: 16px; height: 16px; padding: 3px; line-height: 16px; margin: 0px; position: absolute; left: -24px; top: 9px; color: #000000; font-size: 14px; }
@media screen and (max-device-width: 480px) {
    #wrapper { position: relative; left: -3%; }
}