@-webkit-keyframes dropzone-move { 0% { background-position: 0 0; }
  100% { background-position: 50px 50px; } }
.elgg-dropzone [data-template] { display: none; visibility: hidden; }

.elgg-input-dropzone { position: relative; min-height: 100px; padding: 1px; border: 1px solid #dddddd; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }

.elgg-dropzone-instructions { cursor: pointer; font-size: 16px; text-align: center; display: block; padding: 20px; padding-top: 70px; }
.elgg-dropzone-instructions * { text-align: center; }
.elgg-dropzone-instructions strong, .elgg-dropzone-instructions span { line-height: 20px; color: #dddddd; }
.elgg-dropzone-instructions .elgg-icon { cursor: pointer; position: absolute; top: 0; left: 0; right: 0; width: 100%; font-size: 50px; color: #dddddd; margin: 0 auto; line-height: 50px; padding: 20px 0; z-index: 1; }

.elgg-dropzone-preview { border-bottom: 1px solid #dddddd; display: block; vertical-align: middle; width: 100%; border: 0; position: relative; padding: 10px 10px 15px; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
.elgg-dropzone-instructions + .elgg-dropzone-preview { border-top: 1px solid #dddddd; margin-top: 10px; }
.elgg-dropzone-preview:last-child { margin-bottom: 10px; }
.elgg-dropzone-preview:nth-child(odd) { background: #fafafa; }
.elgg-dropzone-preview:nth-child(even) { background: #f4f4f4; }
.elgg-dropzone-preview .elgg-dropzone-item-props { display: -webkit-flex; display: flex; -webkit-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-align-items: center; align-items: center; }
.elgg-dropzone-preview .elgg-dropzone-item-props > * { padding: 5px 10px; }
.elgg-dropzone-preview .elgg-dropzone-filename { font-size: 12px; text-align: left; overflow: hidden; -webkit-flex-grow: 2; flex-grow: 2; -webkit-flex-basis: 50%; flex-basis: 50%; }
.elgg-dropzone-preview .elgg-dropzone-filename > * { vertical-align: middle; }
.elgg-dropzone-preview .elgg-dropzone-size { font-size: 10px; text-align: center; overflow: hidden; white-space: nowrap; -webkit-flex-grow: 0; flex-grow: 0; -webkit-flex-shrink: 1; flex-shrink: 1; -webkit-flex-basis: 50px; flex-basis: 50px; }
.elgg-dropzone-preview .elgg-dropzone-thumbnail { text-align: center; padding: 0; max-height: 30px; overflow: hidden; vertical-align: middle; -webkit-flex-grow: 0; flex-grow: 0; -webkit-flex-shrink: 0; flex-shrink: 0; -webkit-flex-basis: 30px; flex-basis: 30px; }
.elgg-dropzone-preview .elgg-dropzone-thumbnail img { width: 100%; height: auto; max-width: 30px; line-height: 30px; display: inline-block; }
.elgg-dropzone-preview .elgg-dropzone-controls { -webkit-flex-grow: 0; flex-grow: 0; -webkit-flex-shrink: 0; flex-shrink: 0; -webkit-flex-basis: auto; flex-basis: auto; }
.elgg-dropzone-preview .elgg-dropzone-success-icon { display: none; margin: 0 5px; }
.elgg-dropzone-preview .elgg-dropzone-success-icon .elgg-icon { font-size: 16px; color: #4690D6; cursor: default; }
.elgg-dropzone-preview .elgg-dropzone-success-icon .elgg-icon:hover { color: #4690D6; }
.elgg-dropzone-preview .elgg-dropzone-error-icon { display: none; margin: 0 5px; }
.elgg-dropzone-preview .elgg-dropzone-error-icon .elgg-icon { font-size: 16px; color: #67080a; cursor: default; }
.elgg-dropzone-preview .elgg-dropzone-error-icon .elgg-icon:hover { color: #67080a; }
.elgg-dropzone-preview .elgg-dropzone-remove-icon { margin: 0 5px; }
.elgg-dropzone-preview .elgg-dropzone-remove-icon .elgg-icon { font-size: 16px; cursor: pointer; }
.elgg-dropzone-preview .elgg-dropzone-remove-icon .elgg-icon:hover { color: #67080a; text-decoration: none; }
.elgg-dropzone-preview .elgg-dropzone-messages { font-size: 10px; color: #4690D6; }
.elgg-dropzone-preview.elgg-dropzone-success .elgg-dropzone-success-icon { display: inline; }
.elgg-dropzone-preview.elgg-dropzone-success .elgg-dropzone-progress { width: 100%; opacity: 0.5; }
.elgg-dropzone-preview.elgg-dropzone-success .elgg-dropzone-progress .elgg-dropzone-upload:after { display: none; }
.elgg-dropzone-preview.elgg-dropzone-error .elgg-dropzone-error-icon { display: inline; }
.elgg-dropzone-preview.elgg-dropzone-error .elgg-dropzone-messages, .elgg-dropzone-preview.elgg-dropzone-error .elgg-dropzone-filename { color: #67080a; }
.elgg-dropzone-preview.elgg-dropzone-error .elgg-dropzone-progress { width: 100%; opacity: 0.5; }
.elgg-dropzone-preview.elgg-dropzone-error .elgg-dropzone-progress .elgg-dropzone-upload { background: #67080a; }
.elgg-dropzone-preview.elgg-dropzone-error .elgg-dropzone-progress .elgg-dropzone-upload:after { display: none; }

.elgg-dropzone-progress { position: absolute; bottom: 0; left: 0; width: 90%; height: 4px; border-bottom: 1px solid #fff; }

.elgg-dropzone-upload { position: absolute; background-color: #4690D6; background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #4690D6), color-stop(1, #85b6e4)); background-image: -moz-linear-gradient(center bottom, #2bc253 37%, #54f054 69%); overflow: hidden; left: 0; top: 0; right: 0; bottom: 0; width: 1%; }
.elgg-dropzone-upload:after { content: ""; position: absolute; top: 0; left: 0; bottom: 0; right: 0; height: 100%; background-image: -webkit-gradient(linear, 0 0, 100% 100%, color-stop(0.25, rgba(255, 255, 255, 0.2)), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, rgba(255, 255, 255, 0.2)), color-stop(0.75, rgba(255, 255, 255, 0.2)), color-stop(0.75, transparent), to(transparent)); background-image: -moz-linear-gradient(-45deg, rgba(255, 255, 255, 0.2) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.2) 50%, rgba(255, 255, 255, 0.2) 75%, transparent 75%, transparent); z-index: 1; -webkit-background-size: 25px 25px; -moz-background-size: 25px 25px; -webkit-animation: dropzone-move 2s linear infinite; overflow: hidden; }