html, body {
  height:100%;
  width:100%;
  box-sizing:border-box;
}
body {
  padding:5px;
}
body, * {
  font-family:ptsans;
  font-size:14px;
}
select,option {
  font-family:ptsans;
}
strong {
  font-weight:bold;
}
#body {
  display:table;
  height:100%;
  width:100%;
}
    #body>* {
      display:table-row;
    }
    #body>*>* {
      display:table-cell;
    }
    #body>*>*>div {
      height:100%;
      width:100%;
      position:relative;
      box-sizing:border-box;
    }
    #body>main>section {
      height:100%;
    }

body.FINISH #frequency,
body.RECORD.STANDBY #frequency sub,
body.STANDBY #frequency sub:after,
body.STANDBY #frequency sup {
	display:none;
}
body.PRERACE #frequency sup,
body.STARTED #frequency sup,
body.RUNNING #frequency sup {
  display:inline-block;
}


#header {
  min-height:40px;
}
    #logo {
      display:block;
      text-align:center;
      margin-left:auto;
      margin-right:auto;
      z-index:1000;
      height:80px;
    }
    #subtitle {
      text-align:center;
      font-size:30px;
      font-weight:bold;
      line-height:30px;
      text-transform:uppercase;
    }
    #legtitle {
      text-align:center;
      font-size:18px;
      font-weight:bold;
      line-height:18px;
    }
    #subtitle:empty {
      display:none;
    }

nav  {
  position:absolute;
  left:5px;
  top:5px;
  z-index:1000;
}
nav.on  {
 right:5px;
 bottom:5px;
}
    nav sup {
      position:absolute;
      left:0;
      top:0;
      width:39px;
      height:39px;
      -moz-border-radius:39px;
      -webkit-border-radius:39px;    
      border-radius:39px;
      cursor:pointer;
    }
        nav sup span {
          position:relative;
          display:inline-block;
          width:21px;
          height:3px;
          margin:18px 0 0 9px;
          box-sizing:border-box;
        }
        nav sup span:before  {
          content:'';
          position:absolute;
          top:-7px;
          display:block;
          width:21px;
          height:3px;
        }
        nav sup span:after  {
          content:'';
          position:absolute;
          bottom:-7px;
          display:block;
          width:21px;
          height:3px;
        }
    nav sub {
      position:absolute;
      display:none;
      top:5px;
      left:5px;
      width:29px;
      height:29px;
      cursor:pointer;
    }
        nav sub:before,
        nav sub:after {
          content:'';
          top:12px;
          left:2px;
          position:absolute;
          display:block;
          width:25px;
          height:4px;
        }
        nav sub:before {
          -ms-transform:rotate(45deg);
          -webkit-transform:rotate(45deg);
          transform:rotate(45deg);
        }
        nav sub:after  {
          -ms-transform:rotate(-45deg);
          -webkit-transform:rotate(-45deg);
          transform:rotate(-45deg);
        }
    nav section {
      display:none;
      height:100%;
      width:100%;
    }
    nav article {
      display:table-cell;
      vertical-align:middle;
      text-align:center;
    }
    nav ul {
      display:block;
      width:calc(100% - 10px);
      margin-left:5px;
    }
    nav li {
      display:block;
      width:100%;
      margin:2px 0;
    }
      nav a {
      display:block;
      font-size:4vh;
      width:100%;
      }
      nav a:hover {
      }
      nav li.on a {
      }
      nav ul#legs {
        border-bottom:4px solid #FFFFFF;
      }
    nav.on section {
      display:table;
    }
    nav.on sub {
      display:block;
    }
    nav.on sup  {
      display:none;
    }
    nav ul.pages {
      display:none;
    }
    nav ul.pages.on {
      display:inline-block;
    }

#reportDate {
  text-align:center;
  font-size:26px;
  font-weight:bold;
  line-height:30px;
}
  #reportDate em {
  }
  #reportDate small {
    display:none;
  }

#frequency {
  text-align:center;
  font-size:14px;
  height:18px;
}
  #frequency i {
    display:inline-block;
    margin: 0 3px;
  }
  #frequency i.on {
  }
  #frequency i:before {
    content:'• ';
  }

  #frequency i:first-of-type:before {
    content:'';
  }
#frequency sup {
	*display:none;
}
#frequency sub+sup:before {
  content:' | ';
}
#frequency sub+sup:empty:before {
  display:none;
}
#frequency sub:empty+sup:before {
  display:none;
}

#main {
  position:relative;
}

#footer {
}
    #credits {
      text-align:center;
      font-size:15px;
      line-height:20px;
    }
    #credits a {
      opacity:0.6;
    }
    #credits a:hover {
      opacity:1;
    }



.clock b {
  font-weight:bold;
  opacity:1 !important;
}
.clock * {
  font-style:normal;
  text-decoration:none;
  font-weight:normal;
  opacity:1;
  display:inline-block;
  padding:1px 7px;
  border:1px solid rgba(0,0,0,0.1); 
  border-left-width:0px;
}
.clock>*:first-child {
  border-left-width:1px !important;
}
  
  
@keyframes uwait {
    0%   {transform:rotate(0deg);}
    25%  {transform:rotate(90deg);}
    50%  {transform:rotate(180deg);}
    75%  {transform:rotate(270deg);}
    100% {transform:rotate(360deg);}
}    
u.wait {
  width:20px;
  height:20px;
}
    u.wait svg {
      width:20px;
      height:20px;
      animation-name: uwait;
      animation-duration: 1s;
      animation-iteration-count: infinite;
      transform-origin:10px 10px;
      animation-timing-function: steps(2, end);
    }
    u.wait path {
      stroke-width:2px;
      stroke-linejoin:round;
      fill:none;
    }

img.imglink {
  cursor:pointer;
}

@media screen and (max-width:900px) {
  #logo {
    height:60px;
  }
  #subtitle {
    font-size:26px;
    height:23px;
    line-height:23px;
  }
  #reportDate {
    font-size:22px;
    height:30px;
    line-height:30px;
  }
  #frequency {
    font-size:12px;
    height:18px;
    line-height:18px;
  }
  #credits {
    font-size:12px;
  }
}



@media screen and (max-width:500px) {
  #header {
    padding-bottom:0px;
  }
  #logo {
    height:45px;
  }
  #subtitle {
    font-size:23px;
    height:20px;
    line-height:20px;
  }
  #legtitle {
    font-size:16px;
    line-height:16px;
  }
  #reportDate {
    font-size:16px;
    line-height:24px;
    height:24px;
  }
  #frequency sub {
    display:none;
  }
  #frequency sub+sup:before {
    display:none;
  }
  
}



@media screen and (max-width:425px) {
  #logo {
    height:35px;
  }
  #subtitle {
    font-size:18px;
    height:16px;
    line-height:16px;
  }
  #legtitle {
    font-size:14px;
    line-height:14px;
    font-weight:normal;
  }
  #reportDate {
    line-height:20px;
    height:20px;
    padding-top:0px;
  }
  #reportDate big {
    display:none;
  }
  #reportDate small {
    display:block;
  }
  #frequency {
    height:13px;
    line-height:13px;
  }
  #credits {
    font-size:11px;
  }
}