/* 
	First: A couple styles to make the demo page look good
 */
.fileDropArea body {
    padding-bottom: 2rem;
}

.fileDropArea nav {
    border-top: 4px solid #28a745;
}

    .fileDropArea nav li.active {
        border-bottom: 4px solid #28a745;
    }

.fileDropArea .row {
    margin-bottom: 1rem;
}

.fileDropArea [class*="col-"] {
    padding-top: 1rem;
    padding-bottom: 1rem;
}

.fileDropArea hr {
    margin-top: 2rem;
    margin-bottom: 2rem;
}

.fileDropArea .progress {
    height: 1.5rem;
}

.fileDropArea #files {
    overflow-y: scroll !important;
    min-height: 320px;
}

@media (min-width: 768px) {
    .fileDropArea #files {
        min-height: 0;
    }
}

.fileDropArea #debug {
    overflow-y: scroll !important;
    height: 180px;
}


/* These are for the single examle */
.fileDropArea .preview-img {
    width: 64px;
    height: 64px;
}

.fileDropArea form {
    border: solid #f7f7f9 !important;
    padding: 1.5rem
}

.fileDropArea form.active {
    border-color: red !important;
}

.fileDropArea form .progress {
    height: 38px;
}

.fileDropArea .dm-uploader {
    border: 0.25rem dashed #A5A5C7;
}

    .fileDropArea .dm-uploader.active {
        border-color: red;
        border-style: solid;
    }

.p-5 {
    padding: 3rem !important;
}

.p-2 {
    padding: .5rem !important;
}

.mb-5 {
    margin-bottom: 3rem !important;
}

.mt-5 {
    margin-top: 3rem !important;
}

.mt-2 {
    margin-top: .5rem !important;
}