@import url(https://fonts.googleapis.com/css2?family=Nunito:wght@400;800&display=swap);*{margin:0;padding:0;box-sizing:border-box;font-family:Nunito,system-ui,BlinkMacSystemFont,-apple-system,sans-serif}.container{position:absolute;top:0;right:0;bottom:0;left:0;display:flex}.dragdrop{max-width:500px;max-height:300px;width:100%;height:80%;border:2px #4099de;border-color:#4099de;border-style:solid;border-radius:5px;margin:auto;padding:15px 30px;display:flex;flex-direction:column;justify-content:center;align-items:center}.dragdrop.active{border-style:dashed;background-color:#dbf0ff}header{font-size:24px;margin-bottom:0}span{color:#4a4a4a;margin:20px 0}.hide{display:none}button{outline:0;border:0;border-radius:5px;height:40px;display:flex;justify-content:center;align-items:center;font-size:18px;cursor:pointer}a#browse{outline:0;border:0;border-radius:5px;height:40px;display:flex;justify-content:center;align-items:center;font-size:18px;cursor:pointer;text-decoration:none}a#browse svg{fill:transparent;margin-right:10px}a#browse,button#browse{padding:0 20px 0 20px;background-color:#4099de;color:#fff}button#upload{position:relative;padding:0 30px 0 30px;background-color:#fff;border:2px #4099de solid;color:#4099de}button#upload .progress{background-color:rgba(64,153,222,.2);position:absolute;top:0;bottom:0;left:0;transition:width .3s}button svg{margin-right:10px}button#browse svg{fill:#fff}button#upload{fill:#4099de}p#cancel{color:#e74444;margin:20px 0;cursor:pointer;font-size:14px}p.red{color:#e74444;margin-top:5px;cursor:pointer;font-size:14px}p.green{color:green;margin-top:5px;cursor:pointer;font-size:14px}.green{color:green}@media screen and (max-width:400px){header,span{margin-bottom:5px}button,header{font-size:16px}span{font-size:14px}}@media screen and (max-height:190px){header,span{margin-bottom:5px}button,header{font-size:16px}span{font-size:14px}}