body {
    background: #000;
    margin: 0;
    color:  #fff;
    font-family: Arial, Verdana, sans-serif;
    height:  100%;
  }
  a {
      color: #03a9f4;
  }
  #canvas {
    /* width: 50%; */
    /* height: auto; */
    max-height: 750px;
    /* max-width: 30%; */
}
  .clip-polygon {
    clip-path: polygon(10% 0%, 64% 0%, 64% 100%, 10% 100%);
    /* Note that percentages work as well as px */
  }
  #vidcanvas {
    /* width: 50%; */
    height: 752px;
    width: 100%;
    background-color: #ff0202;
}
  #video {
    display: none;
  }
  #view_3d {
    background: #fff;
    position:  fixed;
    width:  600px;
    height: 600px;
    bottom: 0;
    right: 0;
    opacity:  0.9;
    display:  none;
  }
  #info_debug {
    position: fixed;
    top: 0;
    left: 0;
    color:  #fff;
    text-align:  left;
    font-size:  0.8rem;
  }
  #info_counter {
    position: fixed;
    top: 0;
    left: 0;
    color:  #fff;
    font-size: 3rem;
    font-weight: bold;
    color:  yellow;
  }
  #controls {
      margin-top: 20px;
    margin-bottom: 20px;
      text-align: center;
      display: none;
  }
  #status {
    color: yellow;
  }
  #btn_toggle_controls {
    position:  fixed;
    top: 0;
    right: 80px;
    font-size:  0.8rem;
  }
  .container-fluid {
      width: 100%;
    height: auto;
      text-align:center;
      margin-top: 10px;
  }
  .copyright {
      margin-top: 10px;
      font-size:  0.8rem;
      color:  gray;
  }
  .footer {
    text-align:  center;
    color:  silver;
    font-size:  0.7rem;
  }
  .clickable:hover {
    cursor: pointer;
  }
  .camera {
    height:  100% !important;
  }
  .github-corner {
      position: fixed;
      top: 0;
      right: 0;
      z-index: 9999;
  }
  
  .github-corner:hover .octo-arm {
      animation: octocat-wave 560ms ease-in-out;
  }
  
  @keyframes octocat-wave {
      0% {
          transform: rotate(0deg);
      }
  
      20% {
          transform: rotate(-25deg);
      }
  
      40% {
          transform: rotate(10deg);
      }
  
      60% {
          transform: rotate(-25deg);
      }
  
      80% {
          transform: rotate(10deg);
      }
  
      100% {
          transform: rotate(0deg);
      }
  }
  
  @media (max-width: 500px) {
      .github-corner:hover .octo-arm {
          animation: none;
      }
  
      .github-corner .octo-arm {
          animation: octocat-wave 560ms ease-in-out;
      }
  }