upload.css

/*
CSS for upload.html
*/
/*font declration*/
@font-face{
    font-family: "DINOT-Bold";
    src: url(DINOT-Bold.otf);
}
@font-face{
    font-family: "DINOT-BoldItalic";
    src: url(DINOT-BoldItalic.otf);
}
@font-face{
    font-family: "DINOT-CondMediIta";
    src: url(DINOT-CondMediIta.otf);
}
@font-face{
    font-family: "DINOT-Italic";
    src: url(DINOT-Italic.otf);
}
@font-face{
    font-family: "DINOT-LightItalic";
    src: url(DINOT-LightItalic.otf);
}
@font-face{
    font-family: "DINOT";
    src: url(DINOT.otf);
}

html {
  font-family: "DINOT-Bold", "DINOT-BoldItalic", "DINOT-CondMediIta", "DINOT-Italic", "DINOT-LightItalic", "DINOT";
}


body {
  overflow:hidden;
  background-color: #FFFFFF;
  font-family: "DINOT";
  font-size:1.8em;
}
nav {
  background-color:#000000;
  font-family: "DINOT-Bold";
  /*transform: skewX(-20deg);*/
  margin: 0 50px;
  margin-top:1vh;
}
.nav-wrapper{
  margin-left:1.4vh;
}
nav .brand-logo{
  font-size:1.7em;
}

label {
  color: #333;
  font-weight: 500;
  font-size: 1.5rem;
  margin-top: 1rem;
  line-height: 1rem;
}
  label span {
    font-size: 1rem;
    font-weight: 800;
    color: #666;
  }

form#dropzone-input {
  margin:1vh 0;
  height:45vh;
  border-style:dashed !important;
  border-width:0.4vh !important;
  border-color:#000000 !important;
}

progress{
  width:100%;
  background-color:black;
}

.dropzone .dz-message{
  margin:0.2vh !important;
}
#submit-button {
  height: 10vh;
  background-color: #009BDF;
  font-size: 3rem;
}
  #submit-button i {
    font-size: 2.25rem;
  }

#preview {
  text-align: center;
  height: 100%;
  overflow: hidden;
}

#preview img{
  margin:2% 0;
  max-width:100%;
  max-height: 90%;
}

#preview video{
  max-width:100%;
  max-height: 38vh;
}