.drop-div {
    border-style: dotted;
    width: 1000px;
    height: 500px;
}

.card {
    padding: 5rem 5rem;
}

footer {
    margin-top: 20px;   
    position:fixed;
    bottom:0;
    left:0;
}

#output video {
    width: 100%;
  }
  #progressBar {
      height: 5px;
      width: 0%;
      background-color: #35b44f;
      transition: width .4s ease-in-out;
  }
  body.is-seed .show-seed {
      display: inline;
  }
  body.is-seed .show-leech {
      display: none;
  }
  .show-seed {
      display: none;
  }
  #status code {
      font-size: 90%;
      font-weight: 700;
      margin-left: 3px;
      margin-right: 3px;
      border-bottom: 1px dashed rgba(255,255,255,0.3);
  }

  .is-seed #hero {
      background-color: #154820;
      transition: .5s .5s background-color ease-in-out;
  }
  #hero {
      background-color: #2a3749;
  }
  #status {
      color: #fff;
      font-size: 17px;
      padding: 5px;
  }
  a:link, a:visited {
      color: #30a247;
      text-decoration: none;
  }

  #mag-res {
    height: 500px;
    width: auto;
  }

  .pd-10 {
      padding: 10px 10px;
  }