<style>
body {margin:0; padding:0;}

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:95%; text-align:center; cursor:pointer; margin-bottom:10px;}

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

.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:Impact; font-size: 30px; color:gray; cursor:pointer; height:48px; line-height:48px; width:53px; text-align:center; background-color="#c7e1fe";}

.center {cursor:pointer; height:48px; width:480px; 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:Impact; font-size: 30px; color:gray; cursor:pointer; height:48px; line-height:48px; width:60px; 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:600px; 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; left:0; overflow-y:scroll; max-width:600px; height:80vh; background-color:#ffffff; padding:10px; font-family:Arial; font-size:20px;}

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

.intro {display:block; position:fixed; top:120px; left:10px; 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:590px; 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;}

.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;
}

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

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

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

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

.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:12px;}
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    {background-color:dbf7ae;}
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; }

.wrapper {
  min-height: 100%;
  width: 600px;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
}

.content {
  flex: 1; /* Push footer down */
}

.footer {
  vertical-align:top;
  height: 60px;
  width:600px;
}


</style>
