<style>
html, body {margin:0; padding:0; height:100%; margin-bottom:10px;}

footer{
  position: fixed; bottom:0; width:600px; height:80px;
}

div  {display:block; vertical-align:middle; height:20px;  font-family:Arial; font-size:15px;}

.B   {display:inline-block;font-size:20px; font-family:Arial; border:1px solid pink; background-color:#ffeeff; height:28px; padding-top:5px; width:540px; text-align:center; cursor:pointer; margin-bottom:10px;}

.C   {display:block; font-size:20px; font-family:Arial; background-color:white; height:18px; text-align:center; margin-bottom:10px; color:blue;}

.D   {display:inline-block; font-family:Arial; font-size:12px; color:lightgray; width:40px; text-align:left;} 

.plays {font-family:Arial; font-size:18px; font-weight:400;}

.btn {display:inline-block; background-color:#dbf7ae; cursor:pointer; height:30px; font-size:20px; line-height:30px; text-align:center; border-radius:10%; font-weight:400; font-family:Arial;
}
.btp {display:inline-block; background-color:#B3F9F7; cursor:pointer; height:30px; font-size:20px; line-height:30px; text-align:center; border-radius:10%; font-weight:400; font-family:Arial;
}

.H   {display:block; position:fixed; top:0; width:600px; height:60px; }

.T   { display:inline-block; 
     font-size:24px; font-family:Arial; 
     background-color:#ffeecc; 
     height:24px; line-height:24px; 
     padding:10px; margin:10px;  
     text-align:center; cursor:pointer; color:blue; 
     //border:1px solid white; 
     border-radius:20%;
     border: 2px solid #fff; 
     box-shadow: 0 0 14px rgba(155, 155, 155, 0.5); }

.com {width:550px; text-align:justify; color:brown; font-size:20px; line-height:24px;}

.tbl {width:600px;}

.lside  {display:none; font-family:Helvetica; font-size:28px; color:gray; cursor:pointer; height:50px; line-height:48px; width:110px; text-align:center; background-color:#c7e1fe;}

.center {cursor:pointer; height:48px; width:350px; background-color:white;}

.img {display:inline-block; height: 42px; padding-left:5px; padding-top:5px;}

.dq  {display:inline-block; font-family:Arial; font-size: 32px; color:#A3D5CB; line-height:50px; vertical-align:top; background-color:white;}

.rside  {display:none; font-family:Arial; font-size: 28px; color:gray; cursor:pointer; height:50px; line-height:48px; width:120px; text-align:center; background-color:#c7e1fe;}

.hqt {font-family:Lato; font-size:24px; line-height:28px; color:gray; font-weight:500;}

.tx  {display:block; position:fixed; top:120px; background-color:white; width:590px; height:100%; font-family:Arial; font-size:20px; line-height:26px; background-color:white; overflow-y:auto; z-index:3; padding:5px;}

.pr  {width:450px; height:180px; padding-left:0;}

.pb  {padding-left:0;}

.mlyr {width:520px; font-family:Arial; font-size:20px; line-height:26px; color:gray; padding-left:15px;}

.go {font-size:30px; padding:9px; width:160px; background-color:cyan; cursor:pointer; display:block; height:30px; line-height:30px; text-align:center; border-radius:10%; font-weight:400; font-family:Arial;}

.inf  {display:none; position:fixed; top:48px; overflow-y:scroll; max-width:570px; height:80vh; background-color:#ffffff; padding:10px; font-family:Arial; font-size:20px;}

.inft {font-family:Arial; font-size:40px; color:#A3D5CB; padding-left:0px;}

.infb {text-align:left; font-size:20px; color:black; padding-left:70px; padding-right:70px;}

.intro {display:block; position:fixed; top:120px;      overflow-y:scroll; width:600px; height:100%; background-color:white;}

.list {position:fixed; max-width:600px; top:20px; height:90%; overflow-y:auto;}

.clyr {position:fixed; display:none; width:580px; top:50px; height:90%; overflow-y:auto; font-family:Arial; font-size:24px; line-height:28px; font-weight:300; padding:10px; background-color:white; z-index:0; text-align:left;}

.md  {display:none; width:600px; height:50px; left:0; top:0; background-color:white;}

audio::-webkit-media-controls-panel {
  border-radius:1%;
  height:50px;
}
audio::-webkit-media-controls-play-button {
  background-color: #aaffaa;
  border-radius: 25%;
  height:50px;
}

.off {display:block; height:20px; bakcground-color:green; z-index:7;}

.ol  {display:none; width:600px; height:60px; left:0; top:40px; margin:0; padding:0; z-index:6; background-color:yellow;}

.pickfile {display:inline-block;font-size:20px; font-family:Arial; border:2px dotted lightgray; background-color:#ffeeff; }

.mn {display:inline-block; width:550px; font-family:Arial; font-size:18px;; font-weight:400;}

m    {font-family:Arial; font-size:16px; color:black; line-height:16px;}
P    {font-family:Arial; font-size:20px; color:black;}
td   {font-family:Arial; font-size:20px; color:black; }
a    {text-decoration:none; cursor:pointer; scroll-margin-top:120px; }
a:link{ color:blue; }
a:visited { color:blue; }
html {scroll-behavior:fast;}
span {scroll-margin-top:120px;}
c    {color:blue;}
g    {color:blue; font-size:16px; font-weight:500;}
d    {color:E179C8;}
f    {color:brown; font-size:20px; font-weight:400; line-height:24px;}
h3   {line-height:16px; color:blue;}
::-webkit-scrollbar { display: none; }

</style>
