@import url(//fonts.googleapis.com/earlyaccess/notonastaliqurdu.css);
@import url(//fonts.googleapis.com/earlyaccess/lohitdevanagari.css);

body{margin:0;}
:lang(en),:lang(so),:lang(in),:lang(tr),:lang(es),:lang(sw),:lang(fr),:lang(ms),:lang(de),:lang(ny),:lang(pt),:lang(om),:lang(bn),:lang(ha),:lang(ln),:lang(ta), :lang(tl), :lang(sr), :lang(nl), :lang(az), :lang(tyl), :lang(hu) {font-family:'Varela Round',sans-serif;}
:lang(ar),:lang(ps),:lang(fa),:lang(ku),:lang(sd) {font-family:'Scheherazade', serif;line-height:1.25em;}
:lang(ug) {font-family:'Mirza',serif}
:lang(uk),:lang(ru) {font-family:'Open Sans',sans-serif}
:lang(ne){font-family: 'Annapurna SIL',sans-serif;}
:lang(ur) {font-family:'Noto Nastaliq Urdu', serif;}
:lang(hi) {font-family: 'Lohit Devanagari', sans-serif;}
body:lang(ar),body:lang(ps),body:lang(fa),body:lang(ug) {}
[lang="ar"] body{font-size:150%;}
[lang="ps"] body{font-size:150%;}
[lang="fa"] body{font-size:150%;}
[lang="ku"] body{font-size:150%;}
[lang="sd"] body{font-size:150%;}
[lang="ug"] body{font-size:130%;}
[lang="am"] body{line-height:1.5em;}
[lang="am"] .copy{line-height:1.2em;}

.vfnt{font-family:'Varela Round',sans-serif; font-size: 12pt; line-height: 12pt}

.mb{width:100%;background:#660000;}
.menu{width:900px;margin:auto;}
.mn,.ft{width:900px;margin:0 auto;padding-top:8px;}
audio{width:95%;margin:auto;display:block;}
.ref{font-size:80%;color:#aaa;margin:4px 0;}
.bnr{background-color:#550000;height:46px;}
.bnr2{width:960px;margin:auto}
.logo{vertical-align:middle; margin:0 30px;}
h1{display:inline;font-size:150%;color:#fff;line-height:46px;vertical-align:middle;}
h2{margin:0;color:#550000;font-size:150%}
.nmb{margin:4px 0;}
a{text-decoration:none;font-weight:bold;}
a{color:#550000;}
a:hover{color:#dd0000;}
.disbtn{background:#440000;color:#880000;display:inline-block;font-weight:bold;font-size:90%;padding:4px 0;width:14.28%;text-align:center;}
a.btn{background:#660000;color:#fff;display:inline-block;font-size:90%;padding:4px 0;width:14.28%;text-align:center;}
a.btn:hover{background:#990000;}
hr{background-color:#550000;height:2px;border:0;margin:2px 0;width:100%;clear:both;}
a.done{color:#220000;}
a.unsel{color:#777;}
a.new{color:#770000;}
a.new:hover,a.done:hover,a.unsel:hover{color:#dd0000;}
.menu img{vertical-align:middle;margin:0 4px;}
.psg,.list{width:95%;border:1px solid #ddd;border-radius:8px;padding:8px;}
.psg{background:#fbfbfb;margin:-2px auto 8px auto;}
.list{margin:6px auto;}
.ln{text-align:center;width:100%}
.lnbx{border:1px solid #ddd;text-align:center;padding:12px;border-radius:10px;width:160px;height:140px;margin:10px;display:inline-block;}
.pli {display:inline-block;margin:2px 10px;}
.pli img {text-height:60px;vertical-align:middle;}
.sel{background:#eee;}
.copy{direction::ltr;font-size:10pt;text-align:left}
.sml{font-size:80%;}
p{margin:6px 0;}
.stno{white-space:nowrap;padding-right: 5px;vertical-align:top;}
.spd{font-family:sans-serif;text-align: center;font-size:15px;cursor:pointer;line-height:24px;}

.cntrl{width:16.6%;float:left;}
.plyr{background:#660000;height:25px;padding:5px 0 2px 0;color:#fff;width:740px; margin:0 auto 10px auto;}
#prgbr{width:68%;float:left;background:url("/graphics/progbck.png");height:24px;cursor:pointer;}
#prgss{width:0%;background:url("/graphics/prog.png");float:left;height:24px;}
.ply{background:url('/graphics/play.png') no-repeat;}
.pse{background:url('/graphics/pause.png') no-repeat;}
#pBtn{height:24px;width:24px;margin:auto;cursor:pointer;}
input[type="text"],textarea{width:100%}

html[dir="rtl"] ol li{padding-bottom:.3em;padding-right:12px;}
html[dir="ltr"] ol li{padding-bottom:.3em;padding-left:6px;}

@media(max-width:900px) {
  .menu {position:fixed;bottom:0;width:100%;}
  .wide{display:none;}
  .mn,.ft{width:92%;}
  .plyr{width:100%;position:fixed;bottom:30px;}
  .ft{padding-bottom:74px;}
  .bnr2{width:100%;}
  }