*{margin:0;padding:0;box-sizing:border-box}body{font-family:Arial,Helvetica,sans-serif}.app{padding:1rem 0;display:flex;flex-direction:column;align-items:center}.app h1{font-size:2rem;font-weight:700;padding:0 1rem 2rem;text-align:center}.app .file-field{display:flex;flex-direction:column;width:12rem}.app .file-field label{padding-bottom:.25rem}.app .file-field p{padding-top:.5rem}.app .file-field p.hidden{display:none}#current-img{margin:2rem 0;max-width:16.25rem;max-height:16.25rem}.crop-controls,.crop-controls .inputs-wrap{display:flex;align-items:center;flex-direction:column}.crop-controls .inputs-wrap .inputs-field{display:flex;justify-content:space-between;padding-bottom:.5rem}.crop-controls .inputs-wrap .inputs-field label{width:5rem}.crop-controls .btn-box{display:flex;width:15rem;gap:1rem;padding:1rem 0}.crop-controls .btn-box .btn{width:7rem;padding:.5rem 0;background-color:#00008b;color:#fff;cursor:pointer;text-decoration:none;border:0;font-size:large;font-weight:700}.app #current-img.hidden,.app .crop-controls.hidden{display:none}.app .dims-box{align-self:center;display:flex;flex-direction:column;gap:.5rem;padding:.5rem 0;width:15rem}.app .dims-box .dimension{word-wrap:break-word}@media screen and (min-width: 20rem){#current-img{max-width:18.75rem;max-height:18.75rem}}@media screen and (min-width: 30rem){.app h1{font-size:3rem}}