@media print{#login,#mail,#header,#footer{display:none;}}
@media screen{

html{height:100%;}
body{font-family:arial,sans-serif;background:#000 url('/static/bg.png') no-repeat 98% 13%;}
a {text-decoration:none;}
table {border-collapse:collapse;}
code {font-family:monospace;font-size:1.2em;}

#page{width:900px;background:#efe;margin:32px auto;border-radius:24px;-moz-border-radius:24px;box-shadow: 0 0 24px #99c;-moz-box-shadow: 0 0 24px #99c;opacity:0.94;}
#head{padding:8px;}
#logo{width:176px;height:59px;margin:16px 0 0 24px;}
#search{width:360px;float:right;text-align:right;padding:16px 32px 0 0;}
#content{clear:both;padding:16px;}
#search h2{margin:6px 0 0 0;float:left;}

ul.nav{margin-top:24px;list-style:none;clear:both;font-size:20px;text-align:center;background:#4b455a;padding:0;}
ul.nav > li {display:inline;}
ul.nav > li > a {display:inline-block;color:#fff;text-transform:uppercase;padding:4px 20px;border-right:2px solid #fff;}
ul.nav .end {border-right:none;}
ul.nav .on, ul.nav > a:hover {background:#d2d6eb;color:#4b455a;}
ul.nav > a:hover {padding:6px 20px;margin:-2px 0;}

ul.nav.alph {margin:0 -16px;}
ul.nav.alph > li > a {padding:4px 9px;}

.gb {background: url('gb.png') repeat-x;}
.gg {background: url('gg.png') repeat-x;}
.gr {background: url('gr.png') repeat-x;}

.gb:hover {background: url('gbh.png');color: #00f;}
.gg:hover {background: url('ggh.png');}
.gr:hover {background: url('grh.png');}

.odd {background: #ddd;}

#chord {position:fixed;display:none;border:1px solid #666;box-shadow: 0 0 24px #99c;-moz-box-shadow: 2px 2px 16px #99c;}

}
@font-face{font-family:"arial";src:url(arial.ttf);}
@font-face{font-family:"monospace";src:url(liberationmono.ttf);}