﻿.fileupload {
    border: 3px dotted rgb(106, 156, 237);
    background-color: rgb(206, 224, 255);
    padding: 15px;
    cursor: pointer;
}

	.fileupload:hover {
		background-color: rgb(211, 227, 255);
		border-color: rgb(124, 174, 255);
		color: rgb(58, 87, 132);
	}

    .fileupload.on-dragover {
        background-color: lightgreen;
        border-color: green;
        color: green;
    }

    .fileupload > .upload-inner-container {
        display: flex;
    }

        .fileupload > .upload-inner-container > .icon-container {
            font-size: 38px;
            height: 100%;
        }

        .fileupload > .upload-inner-container > .text-container {
            padding-left: 10px;
            font-weight: bold;
        }

.fileUploadCenterContent {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 50px;
    float: left;
}

.fileUploadCenterContent .file-name {
    margin-right: 10px;
}


.file-container {
    padding: 0px;
    border-radius: 5px;
}

    .file-container .file-item {
        position: relative;
        border: 1px solid #a8a8a8;
        border-collapse: collapse;
        padding: 5px;
        display: block;
        border-radius: 5px;
        margin-bottom: 10px;
        box-shadow: rgb(51,51,51) 0px 0px 5px 0px;
        background-color: whitesmoke;
        min-height: 77px;
    }

        

        .file-container .file-item .on-edit .name {
            border: 1px solid #404677;
            background-color: #d1d4ed;
            padding: 3px;
            padding-left: 5px;
            padding-right: 5px;
            border-radius: 5px;
        }

        .file-container .file-item .on-error .name {
            border: 2px solid red;
        }

        .file-container .file-item:last-child {
            margin-bottom: 0;
        }

        .file-container .file-item .edit {
            text-align: center;
            border-radius: 5px;
            font-size: smaller;
            cursor: pointer;
            color: #337ab7;
        }

            .file-container .file-item .edit:hover {
                color: #23527c;
            }

        .file-container .file-item .file-close-x {
            position: absolute;
            right: 10px;
            top: 10px;
            max-height: 18px;
            max-width: 18px;
        }

            .file-container .file-item .file-close-x:hover {
                color: red;
                cursor: pointer;
            }



        .file-container .file-item .tag-cloud {
            display: flex;
            flex-wrap: wrap;
            list-style-type: none;
            margin: 0;
            padding: 0;
        }

    .file-container li {
        border: 1px solid #a8a8a8;
        margin-right: 1px;
        margin-bottom: 1px;
        padding-left: 5px;
        padding-right: 5px;
        text-align: center;
        border-radius: 5px;
        font-size: smaller;
        cursor: pointer;
        color: #a8a8a8;
    }

        .file-container li label {
            cursor: pointer;
            margin: 0;
        }

        .file-container li:hover {
            color: black;
            border-color: black;
        }

        .file-container li.selected {
            background-color: #d1d4ed;
            color: #404677;
            border: 1px solid #404677;
        }

    .file-container .file-item .uploading-error-text {
        color: red;
        font-size: small;
    }

    .file-container .lds-spinner,
    .uploading .lds-spinner{
        height: 25px;
        width: 25px;
    }

        .file-container .lds-spinner div,
        .uploading .lds-spinner div{
            left: 50%;
            top: 50%;
            width: 2px;
            height: 4px;
            transform-origin: 8px 8px;
        }

    .file-container .uploading {
        display: inline-flex;
    }

    .file-container .uploading-success {
        color: green;
    }

    .file-container .uploading-error {
        color: red;
    }

    .file-container .edit-and-status-bar {
        margin-right:3rem;
    }

    .file-container .edit-and-status-bar > * {
        margin-right: 10px;
    }

        .file-container .edit-and-status-bar > *:last-child {
            margin-right: 0px;
        }

.fileupload-disabled {
	opacity: 0.5;
}

.file-container .file-item .file-name {
	display: inline-block;
	word-break: break-all;
}

.file-icon i {
    font-size: 65px;
}

.file-icon-outer {
    float: left;
    padding-right: 10px;
}

.small-font-size {
    font-size: small;
}

.outer-container-center-content {
    max-width: 750px;
    margin-left: auto;
    margin-right: auto;
}

    .outer-container-center-content .panel-heading {
        display:flex;
    }

        .outer-container-center-content .panel-heading h3 {
            width: 100%;
            padding: 8px 0 0 0;
            margin: 0px;
        }