body,p,h1,h2,h3,h4,ul,ol,li,div,th,address,blockquote,nobr,b,i
     { font-family:Arial,sans-serif; }


dl,dd,table,body,p { font-family:Arial,sans-serif; font-size:9pt; margin-top:3pt;}

tr, td { font-family:Arial,sans-serif; font-size:9pt; margin-top:3pt;}

dt { font-family:Arial,sans-serif; font-size:9pt; margin-top:3pt;}

h3 { font-family:Arial,sans-serif; font-weight:bold; font-size:12pt; margin-top:3pt;margin-bottom:0pt;color:#000000;}

h2 { font-family:Arial,sans-serif; font-weight:bold; font-size:15pt;color:#000000;}

td { vertical-align:top; }

a { font-family:Arial,sans-serif;
    color:#c00000;
    text-decoration: none;
  }

a:visited { font-family:Arial,sans-serif; 
    color:#c00000;
    text-decoration: none;
  }

a:hover {
    color:#c00000;
    text-decoration: underline;
  }

.header {
    height:25px;
    background-color: #000000;
    color: #ffffff;
    text-align: center;
    font-family: Arial, sans-serif; 
    font-size: 17px; 
    font-weight: bold; 
    padding-top: 7px;
    width:100%;
    position:absolute; z-index:2;
    top:0;left:0;
}

.scroll {
    overflow-y:auto;
    position:absolute; z-index:3;
    top:32px; left:205px; bottom:0px;
    scrollbar-width: thin;
    overflow-x:hidden;
    width: calc(100% - 210px); padding-right:5px;
}

.scrollh {
  overflow-x:auto; 
}
.scrollh0 {
  overflow-x:auto; 
}
.scrollh2 {
  overflow-x:auto; 
}
.scrollh3 {
  overflow-x:auto; 
}

.dropbtn {
  background-color: #444444;
  color: white;
  font-size: 16px;
  border: none;
  cursor: pointer;
  position : absolute;
  left:5px; top: 5px;
  width: 40px; height: 30px;
  z-index:5;
}
.logodark {
  position:absolute; z-index:3;
  top:2px; right:2px;
  height:34px;
  display:none;
}

@media
only screen and (max-width: 150px)  {
  .scrollh { width: calc(150px - 42px); }
  .scrollh0 { width: calc(150px - 10px); }
  .scrollh2 { width: calc(150px - 45px); }
  .scrollh3 { width: calc(150px - 50px); }
}

@media
only screen and (min-width: 151px) and (max-width: 175px)  {
  .scrollh { width: calc(150px - 42px); }
  .scrollh0 { width: calc(150px - 10px); }
  .scrollh2 { width: calc(150px - 45px); }
  .scrollh3 { width: calc(150px - 50px); }
}

@media
only screen and (min-width: 176px) and (max-width: 200px)  {
  .scrollh { width: calc(175px - 42px); }
  .scrollh0 { width: calc(175px - 10px); }
  .scrollh2 { width: calc(175px - 45px); }
  .scrollh3 { width: calc(175px - 50px); }
}

@media
only screen and (min-width: 201px) and (max-width: 225px)  {
  .scrollh { width: calc(200px - 42px); }
  .scrollh0 { width: calc(200px - 10px); }
  .scrollh2 { width: calc(200px - 45px); }
  .scrollh3 { width: calc(200px - 50px); }
}

@media
only screen and (min-width: 226px) and (max-width: 250px)  {
  .scrollh { width: calc(225px - 42px); }
  .scrollh0 { width: calc(225px - 10px); }
  .scrollh2 { width: calc(225px - 45px); }
  .scrollh3 { width: calc(225px - 50px); }
}

@media
only screen and (min-width: 251px) and (max-width: 275px)  {
  .scrollh { width: calc(250px - 42px); }
  .scrollh0 { width: calc(250px - 10px); }
  .scrollh2 { width: calc(250px - 45px); }
  .scrollh3 { width: calc(250px - 50px); }
}

@media
only screen and (min-width: 276px) and (max-width: 300px)  {
  .scrollh { width: calc(275px - 42px); }
  .scrollh0 { width: calc(275px - 10px); }
  .scrollh2 { width: calc(275px - 45px); }
  .scrollh3 { width: calc(275px - 50px); }
}

@media
only screen and (min-width: 301px) and (max-width: 325px)  {
  .scrollh { width: calc(300px - 42px); }
  .scrollh0 { width: calc(300px - 10px); }
  .scrollh2 { width: calc(300px - 45px); }
  .scrollh3 { width: calc(300px - 50px); }
}

@media
only screen and (min-width: 326px) and (max-width: 350px)  {
  .scrollh { width: calc(325px - 42px); }
  .scrollh0 { width: calc(325px - 10px); }
  .scrollh2 { width: calc(325px - 45px); }
  .scrollh3 { width: calc(325px - 50px); }
}

@media
only screen and (min-width: 351px) and (max-width: 375px)  {
  .scrollh { width: calc(350px - 42px); }
  .scrollh0 { width: calc(350px - 10px); }
  .scrollh2 { width: calc(350px - 45px); }
  .scrollh3 { width: calc(350px - 50px); }
}

@media
only screen and (min-width: 376px) and (max-width: 400px)  {
  .scrollh { width: calc(375px - 42px); }
  .scrollh0 { width: calc(375px - 10px); }
  .scrollh2 { width: calc(375px - 45px); }
  .scrollh3 { width: calc(375px - 50px); }
}

@media
only screen and (min-width: 401px) and (max-width: 425px)  {
  .scrollh { width: calc(400px - 42px); }
  .scrollh0 { width: calc(400px - 10px); }
  .scrollh2 { width: calc(400px - 45px); }
  .scrollh3 { width: calc(400px - 50px); }
}

@media
only screen and (min-width: 426px) and (max-width: 450px)  {
  .scrollh { width: calc(425px - 42px); }
  .scrollh0 { width: calc(425px - 10px); }
  .scrollh2 { width: calc(425px - 45px); }
  .scrollh3 { width: calc(425px - 50px); }
}

@media
only screen and (min-width: 451px) and (max-width: 475px)  {
  .scrollh { width: calc(450px - 42px); }
  .scrollh0 { width: calc(450px - 10px); }
  .scrollh2 { width: calc(450px - 45px); }
  .scrollh3 { width: calc(450px - 50px); }
}

@media
only screen and (min-width: 476px) and (max-width: 500px)  {
  .scrollh { width: calc(475px - 42px); }
  .scrollh0 { width: calc(475px - 10px); }
  .scrollh2 { width: calc(475px - 45px); }
  .scrollh3 { width: calc(475px - 50px); }
}

@media
only screen and (min-width: 501px) and (max-width: 525px)  {
  .scrollh { width: calc(500px - 42px); }
  .scrollh0 { width: calc(500px - 10px); }
  .scrollh2 { width: calc(500px - 45px); }
  .scrollh3 { width: calc(500px - 50px); }
}

@media
only screen and (min-width: 526px) and (max-width: 550px)  {
  .scrollh { width: calc(525px - 42px); }
  .scrollh0 { width: calc(525px - 10px); }
  .scrollh2 { width: calc(525px - 45px); }
  .scrollh3 { width: calc(525px - 50px); }
}

@media
only screen and (min-width: 551px) and (max-width: 575px)  {
  .scrollh { width: calc(550px - 42px); }
  .scrollh0 { width: calc(550px - 10px); }
  .scrollh2 { width: calc(550px - 45px); }
  .scrollh3 { width: calc(550px - 50px); }
}

@media
only screen and (min-width: 576px) and (max-width: 600px)  {
  .scrollh { width: calc(575px - 42px); }
  .scrollh0 { width: calc(575px - 10px); }
  .scrollh2 { width: calc(575px - 45px); }
  .scrollh3 { width: calc(575px - 50px); }
}

@media
only screen and (min-width: 601px) and (max-width: 625px)  {
  .scrollh { width: calc(600px - 42px); }
  .scrollh0 { width: calc(600px - 10px); }
  .scrollh2 { width: calc(600px - 45px); }
  .scrollh3 { width: calc(600px - 50px); }
}

@media
only screen and (max-width: 767px)  {
  .header { height:30px; padding-top:10px;}

  .logodark {
    display: inline-block;
  }

  .dropdown {
    display: inline-block;
    position : absolute;
    left:0px; top: 0px; width: 50px; height:100%;
  }

  .dtvlogo {
    display: none;
  }

  .scroll { left:5px; top:40px; width: calc(100% - 10px); padding-right:5px;} 

  .menu {
    display: none;
    position: absolute;
    left: 5px; top: 30px; height:calc(100% - 50px);
    background-color: #f9f9f9;
    min-width: 195px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 4;
    overflow-y:auto; 
    scrollbar-width: thin;
    padding: 5px;
    border-radius: 5px;
  }

  .dropdown:hover .menu {
    display: block;
  }
  
}

@media
only screen and (min-width: 768px)  {
  .dropbtn {
    display:none;
  }

  .menu {
    overflow-y:auto; 
    width: 195px;
    font-size: 9pt;
    /*height: 99%;*/
    position:absolute; z-index:3;
    top:32px; left:0px; bottom:0px;
    padding:5px;
    scrollbar-width: thin;
  }

}