﻿
.dropzone {
    min-height: auto !important;
}

    .dropzone.dropzone-default {
        padding: 20px;
        text-align: center;
        cursor: pointer;
        border: 2px dashed #EBEDF3;
        border-radius: 0.42rem;
    }

        .dropzone.dropzone-default .dropzone-msg-title {
            color: #3F4254;
            margin: 0 0 5px 0;
            padding: 0;
            font-weight: 500;
            font-size: 1.2rem;
        }

        .dropzone.dropzone-default .dropzone-msg-desc {
            color: #B5B5C3;
            font-weight: 400;
            font-size: 1rem;
        }

        .dropzone.dropzone-default .dz-preview .dz-image {
            border-radius: 0.42rem;
        }

        .dropzone.dropzone-default .dz-error-message {
            top: 145px;
        }

        .dropzone.dropzone-default .dz-remove {
            color: #7E8299;
            font-size: 0.9rem;
            font-weight: 500;
            font-weight: 500;
            -webkit-transition: color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease, -webkit-box-shadow 0.15s ease;
            transition: color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease, -webkit-box-shadow 0.15s ease;
            transition: color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
            transition: color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease, -webkit-box-shadow 0.15s ease;
        }

            .dropzone.dropzone-default .dz-remove:hover {
                -webkit-transition: color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease, -webkit-box-shadow 0.15s ease;
                transition: color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease, -webkit-box-shadow 0.15s ease;
                transition: color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
                transition: color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease, -webkit-box-shadow 0.15s ease;
                color: #6993FF;
            }

        .dropzone.dropzone-default.dropzone-primary {
            border-color: #6993FF;
        }

        .dropzone.dropzone-default.dropzone-secondary {
            border-color: #E4E6EF;
        }

        .dropzone.dropzone-default.dropzone-success {
            border-color: #1BC5BD;
        }

        .dropzone.dropzone-default.dropzone-info {
            border-color: #8950FC;
        }

        .dropzone.dropzone-default.dropzone-warning {
            border-color: #FFA800;
        }

        .dropzone.dropzone-default.dropzone-danger {
            border-color: #F64E60;
        }

        .dropzone.dropzone-default.dropzone-light {
            border-color: #F3F6F9;
        }

        .dropzone.dropzone-default.dropzone-dark {
            border-color: #181C32;
        }

        .dropzone.dropzone-default.dropzone-white {
            border-color: #ffffff;
        }

    .dropzone.dropzone-multi {
        border: 0;
        padding: 0;
    }

        .dropzone.dropzone-multi .dz-message {
            display: none;
        }

        .dropzone.dropzone-multi .dropzone-panel .dropzone-upload,
        .dropzone.dropzone-multi .dropzone-panel .dropzone-remove-all {
            display: none;
        }

        .dropzone.dropzone-multi .dropzone-item {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
            -ms-flex-align: center;
            align-items: center;
            margin-top: 0.75rem;
            border-radius: 0.42rem;
            padding: 0.5rem 1rem;
            background-color: #F3F6F9;
        }

            .dropzone.dropzone-multi .dropzone-item .dropzone-file {
                -webkit-box-flex: 1;
                -ms-flex-positive: 1;
                flex-grow: 1;
            }

                .dropzone.dropzone-multi .dropzone-item .dropzone-file .dropzone-filename {
                    font-size: 0.9rem;
                    font-weight: 500;
                    color: #7E8299;
                    text-overflow: ellipsis;
                    margin-right: 0.5rem;
                }

                    .dropzone.dropzone-multi .dropzone-item .dropzone-file .dropzone-filename b {
                        font-size: 0.9rem;
                        font-weight: 500;
                        color: #B5B5C3;
                    }

                .dropzone.dropzone-multi .dropzone-item .dropzone-file .dropzone-error {
                    margin-top: 0.25rem;
                    font-size: 0.9rem;
                    font-weight: 400;
                    color: #F64E60;
                    text-overflow: ellipsis;
                }

            .dropzone.dropzone-multi .dropzone-item .dropzone-progress {
                width: 15%;
            }

                .dropzone.dropzone-multi .dropzone-item .dropzone-progress .progress {
                    height: 5px;
                    -webkit-transition: all 0.2s ease-in-out;
                    transition: all 0.2s ease-in-out;
                }

@media (prefers-reduced-motion: reduce) {
    .dropzone.dropzone-multi .dropzone-item .dropzone-progress .progress {
        -webkit-transition: none;
        transition: none;
    }
}

.dropzone.dropzone-multi .dropzone-item .dropzone-toolbar {
    margin-left: 1rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
}

    .dropzone.dropzone-multi .dropzone-item .dropzone-toolbar .dropzone-start,
    .dropzone.dropzone-multi .dropzone-item .dropzone-toolbar .dropzone-cancel,
    .dropzone.dropzone-multi .dropzone-item .dropzone-toolbar .dropzone-delete {
        height: 25px;
        width: 25px;
        display: -webkit-inline-box;
        display: -ms-inline-flexbox;
        display: inline-flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        cursor: pointer;
        -webkit-transition: color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease, -webkit-box-shadow 0.15s ease;
        transition: color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease, -webkit-box-shadow 0.15s ease;
        transition: color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
        transition: color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease, -webkit-box-shadow 0.15s ease;
    }

        .dropzone.dropzone-multi .dropzone-item .dropzone-toolbar .dropzone-start i,
        .dropzone.dropzone-multi .dropzone-item .dropzone-toolbar .dropzone-cancel i,
        .dropzone.dropzone-multi .dropzone-item .dropzone-toolbar .dropzone-delete i {
            -webkit-transition: color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease, -webkit-box-shadow 0.15s ease;
            transition: color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease, -webkit-box-shadow 0.15s ease;
            transition: color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
            transition: color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease, -webkit-box-shadow 0.15s ease;
            font-size: 0.8rem;
            color: #7E8299;
        }

        .dropzone.dropzone-multi .dropzone-item .dropzone-toolbar .dropzone-start:hover,
        .dropzone.dropzone-multi .dropzone-item .dropzone-toolbar .dropzone-cancel:hover,
        .dropzone.dropzone-multi .dropzone-item .dropzone-toolbar .dropzone-delete:hover {
            -webkit-transition: color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease, -webkit-box-shadow 0.15s ease;
            transition: color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease, -webkit-box-shadow 0.15s ease;
            transition: color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
            transition: color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease, -webkit-box-shadow 0.15s ease;
        }

            .dropzone.dropzone-multi .dropzone-item .dropzone-toolbar .dropzone-start:hover i,
            .dropzone.dropzone-multi .dropzone-item .dropzone-toolbar .dropzone-cancel:hover i,
            .dropzone.dropzone-multi .dropzone-item .dropzone-toolbar .dropzone-delete:hover i {
                color: #6993FF;
            }

    .dropzone.dropzone-multi .dropzone-item .dropzone-toolbar .dropzone-start {
        -webkit-transition: color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease, -webkit-box-shadow 0.15s ease;
        transition: color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease, -webkit-box-shadow 0.15s ease;
        transition: color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
        transition: color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease, -webkit-box-shadow 0.15s ease;
    }

    .dropzone.dropzone-multi .dropzone-item .dropzone-toolbar .dropzone-delete i:before {
        font-family: FontAwesome;
        content: "\f00d";
        font-style: normal;
        font-weight: normal;
        text-decoration: inherit;
    }

    .dropzone .dz-preview .dz-image img {
        width: 120px !important;
        height: 120px !important;
    }