* {
  margin: 0px;
  padding: 0px;
  font-size: 16px; }

body {
  border: 0px;
  text-align: left;
  color: black;
  font-size: 16px;
  font-family: "Roboto", sans-serif;
  background-color: #FFFFFF;
  width: 100%;
  height: 100%; }
  body .medal {
    position: absolute;
    left: 0.625em;
    bottom: 0.625em;
    background-color: #FFFFFF;
    width: 18.75em;
    height: 3.75em;
    z-index: 200;
    pointer-events: none;
    -moz-border-radius: 0.625em;
    -webkit-border-radius: 0.625em;
    border-radius: 0.625em; }
    body .medal img {
      width: 3.125em;
      height: 3.125em;
      position: absolute;
      left: 0.3125em;
      top: 0.3125em;
      -moz-border-radius: 0.3125em;
      -webkit-border-radius: 0.3125em;
      border-radius: 0.3125em;
      background-color: #F0F0F0; }
    body .medal span {
      font-size: 1.25em;
      width: 2.5em;
      height: 2.5em;
      position: absolute;
      right: 0.25em;
      top: 0.25em;
      -moz-border-radius: 0.25em;
      -webkit-border-radius: 0.25em;
      border-radius: 0.25em;
      line-height: 2.5em;
      background-color: #00cc00;
      color: #FFFFFF;
      text-align: center;
      -moz-box-shadow: 0px -0.1em 0px 0px #00b300 inset, 0px 0.1em 0px 0px #00e600 inset;
      -webkit-box-shadow: 0px -0.1em 0px 0px #00b300 inset, 0px 0.1em 0px 0px #00e600 inset;
      box-shadow: 0px -0.1em 0px 0px #00b300 inset, 0px 0.1em 0px 0px #00e600 inset; }
    body .medal h2 {
      font-size: 1.25em;
      width: 2.5em;
      height: 2.5em;
      position: absolute;
      left: 3em;
      right: 3em;
      top: 0.25em;
      line-height: 2.5em;
      color: #000000;
      text-overflow: ellipsis;
      white-space: nowrap;
      text-align: left;
      font-size: 1.25em;
      font-weight: normal; }
  body #container {
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: #FFFFFF;
    z-index: 0; }
  body #promo {
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: #FFFFFF;
    z-index: 1;
    display: none; }
  body #promo {
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: #FFFFFF;
    z-index: 1;
    display: none; }
  body #preloder {
    overflow: hidden;
    position: absolute;
    left: 0em;
    top: 0em;
    height: 100%;
    width: 100%;
    z-index: 150; }
    body #preloder #preloader-play {
      display: none;
      opacity: 0;
      position: absolute;
      top: 50%;
      left: 50%;
      width: 50%;
      height: 50%;
      border-radius: 50%;
      line-height: 50%;
      font-size: 1.875em;
      text-align: center;
      margin-left: 25%;
      margin-top: 0.66667em;
      z-index: 152;
      background-image: url("../bgplay.png");
      background-position: center center;
      background-repeat: no-repeat;
      background-size: contain; }
    body #preloder #preloader-progress {
      overflow: hidden;
      position: absolute;
      bottom: 0.625em;
      left: 0.625em;
      right: 0.625em;
      z-index: 151;
      border-radius: 1.25em; }
      body #preloder #preloader-progress div {
        height: 2.5em;
        width: 0%;
        width-min: 2.5em;
        border-radius: 1.25em; }
    body #preloder #preloader-branding {
      position: absolute;
      left: 50%;
      top: 50%;
      width: 50%; }
      body #preloder #preloader-branding img {
        margin-top: -100%;
        margin-left: -50%;
        width: 100%; }

a {
  color: white;
  text-decoration: none; }

div, article, aside, figcaption, figure, footer, nav, section, time {
  display: block; }
