.dropzone, .dropzone *, .dropzone-previews, .dropzone-previews * {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.dropzone {
    position: relative;
   border: 1px dashed rgba(0,0,0,.3);
    border-radius: 5px;
   
   background-image: linear-gradient(135deg,rgba(0,0,0,.03) 25%,transparent 25%,transparent 50%,rgba(0,0,0,.03) 50%,rgba(0,0,0,.03) 75%,transparent 75%,transparent);
    background-color: #fafcfd;
    background-size: 16px 16px;
    padding: 1em;
    -webkit-transition: 250ms linear 0s;
    -moz-transition: 250ms linear 0s;
    -o-transition: 250ms linear 0s;
    transition: 250ms linear 0s;
    min-height: 100px;
}

    .dropzone.dz-clickable, .dropzone.dz-clickable .dz-message, .dropzone.dz-clickable .dz-message span {
        cursor: pointer;
    }

        .dropzone.dz-clickable * {
            cursor: default;
        }

    .dropzone .dz-message {
        opacity: 1;
        -ms-filter: none;
        filter: none;
    }

    .dropzone.dz-drag-hover {
        border-color: rgba(0,0,0,.25);
        background: rgba(0,0,0,.08);
        -webkit-transition: 500ms linear 0s;
        -moz-transition: 250ms linear 0s;
        -o-transition: 250ms linear 0s;
        transition: 250ms linear 0s;
    }

    .dropzone.dz-started .dz-message {
        margin-bottom: 20px;
    }

    .dropzone .dz-preview, .dropzone-previews .dz-preview {
        background: rgba(255,255,255,.8);
        position: relative;
        display: inline-block;
        vertical-align: top;
        border: 1px solid #acacac;
        padding: 6px;
        width: 100%;
    }

        .dropzone .dz-preview.dz-file-preview [data-dz-thumbnail], .dropzone-previews .dz-preview.dz-file-preview [data-dz-thumbnail] {
            display: none;
        }

.dz-filename span {
    word-wrap: break-word;
    display: inline-block;
}

.dropzone .dz-preview .dz-details, .dropzone-previews .dz-preview .dz-details {
    width: 65px;
    height: 65px;
    position: relative;
    background: #ebebeb;
    padding: 5px;
    word-wrap: break-word;
}

    .dropzone .dz-preview .dz-details .dz-filename, .dropzone-previews .dz-preview .dz-details .dz-filename {
        width: 340px;
        word-wrap: break-word;
        overflow: hidden;
        float: left;
        padding-left: 80px;
    }

    .dropzone .dz-preview .dz-details img, .dropzone-previews .dz-preview .dz-details img {
        position: absolute;
        top: 0;
        left: 0;
        width: 65px;
        height: 65px;
       
    }

    .dropzone .dz-preview .dz-details .dz-size, .dropzone-previews .dz-preview .dz-details .dz-size {
        position: absolute;
        height: 28px;
        right: -350px;
        margin-top:1px;
    }

.dropzone .dz-preview.dz-error .dz-error-mark, .dropzone .dz-preview.dz-success .dz-success-mark, .dropzone-previews .dz-preview.dz-error .dz-error-mark, .dropzone-previews .dz-preview.dz-success .dz-success-mark {
    display: none;
}

.dropzone .dz-preview .dz-error-mark, .dropzone .dz-preview .dz-success-mark, .dropzone-previews .dz-preview .dz-error-mark, .dropzone-previews .dz-preview .dz-success-mark {
    display: none;
    position: absolute;
    width: 40px;
    height: 40px;
    font-size: 30px;
    text-align: center;
    right: -10px;
    top: -10px;
}

.dropzone .dz-preview .dz-success-mark, .dropzone-previews .dz-preview .dz-success-mark {
    color: #8cc657;
}

.dropzone .dz-preview .dz-error-mark, .dropzone-previews .dz-preview .dz-error-mark {
    color: #ee162d;
}

.dropzone .dz-preview .dz-progress, .dropzone-previews .dz-preview .dz-progress {
    border: 2px solid #C3C3C3;
    position: absolute;
    top: 45px;
    left: 90px;
    width: 335px;
    height: 25px;
    display: none;
}

    .dropzone .dz-preview .dz-progress .dz-upload, .dropzone-previews .dz-preview .dz-progress .dz-upload {
        background-color: #e3ffd1;
        display: block;
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        width: 0;
    }

.dropzone .dz-preview.dz-processing .dz-progress, .dropzone-previews .dz-preview.dz-processing .dz-progress {
    display: block;
}

.dropzone .dz-preview .dz-error-message, .dropzone-previews .dz-preview .dz-error-message {
    display: none;
    position: absolute;
    top: -5px;
    left: -20px;
    background: rgba(245,245,245,.8);
    padding: 8px 10px;
    color: #800;
    min-width: 140px;
    max-width: 500px;
    z-index: 500;
}

.dropzone .dz-preview:hover.dz-error .dz-error-message, .dropzone-previews .dz-preview:hover.dz-error .dz-error-message {
    display: none;
}