.js .unsupported-browser { display: none }
.no-js .supported-browser { display: none }
.template { display: none }

.dropzone {
    min-height: 120px;
    border-color: #dbdbdb;
    border-radius: 4px;
    border-width: 1px;
    background: white;
    padding: 20px 20px;
}

.cir-dz-message {
    max-height: 8rem;
    overflow: auto;
}

/* state management (rather than doing this in javascript) */

/* queued state (default) */
.cir-dz-processing,
.cir-dz-success,
.cir-dz-error { display: none }
/* .cir-dz-queued { display: inline-flex } /* default */
.cir-dz-message { display: none }

/* processing */
.dz-processing .cir-dz-queued,
.dz-processing .cir-dz-success,
.dz-processing .cir-dz-error { display: none }
.dz-processing .cir-dz-processing { display: inline-flex }
.dz-processing .cir-dz-message { display: none } /* unchanged from default */

/* success */
.dz-success .cir-dz-queued,
.dz-success .cir-dz-processing,
.dz-success .cir-dz-error { display: none }
.dz-success .cir-dz-success { display: inline-flex }
.dz-success .cir-dz-message { display: none } /* unchanged from default */

/* error */
.dz-error .cir-dz-queued,
.dz-error .cir-dz-processing,
.dz-error .cir-dz-success { display: none }
.dz-error .cir-dz-error { display: inline-flex }
.dz-error .cir-dz-message { display: block }