.ui-file-progressbar-container-relative {
	position: relative;
}

.ui-file-progressbar-item-blurred {
	filter:blur(4px);
	animation: ui-file-progressbar-blur .3s linear;
}

.ui-file-progressbar-loader-wrapper {
	width: 100%;
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	position: absolute;
	flex-direction: column;
	z-index: 100;
	cursor: default;
}

.ui-file-progressbar-loader-horizontal {
	flex-direction: initial;
	justify-content: space-between;
}

.ui-file-progressbar-loader {
	width: 54px;
	height: 54px;
	border-radius: 50%;
	background-color: rgba(0, 0, 0, 0.5);
	transition: opactity 0.3s ease-in-out;
	position: relative;
	flex-shrink: 0;
}

.ui-file-progressbar-icon {
	width: 100%;
	position: absolute;
	height: 100%;
	transition: transform 0.1s ease-in;
	background-position: center;
	background-repeat: no-repeat;
	background-size: 20px;
	cursor: pointer;
	z-index: 1;
}

.ui-file-progressbar-done {
	transition: transform 0.2s ease-out;
	background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20width%3D%22980%22%20height%3D%22741%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%3Cpath%20d%3D%22M872.305.14L334.7%20537.939%20102.953%20300.21%200%20406.6l325.5%20325.5%209.2%208.9%209.8-8.9L980%2096.8z%22%20fill%3D%22%23FFF%22%20fill-rule%3D%22evenodd%22/%3E%3C/svg%3E');
	cursor: default;
}

.ui-file-progressbar-cancel {
	transition: transform 0.2s ease-out;
	background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2214%22%20height%3D%2214%22%20viewBox%3D%220%200%2014%2014%22%3E%0A%20%20%3Cpath%20fill%3D%22%23FFFFFF%22%20fill-rule%3D%22evenodd%22%20d%3D%22M16.093021%2C13.906979%20L22.6511473%2C13.906979%20L22.6511473%2C16.093021%20L16.093021%2C16.093021%20L16.093021%2C22.6511473%20L13.906979%2C22.6511473%20L13.906979%2C16.093021%20L7.34885266%2C16.093021%20L7.34885266%2C13.906979%20L13.906979%2C13.906979%20L13.906979%2C7.34885266%20L16.093021%2C7.34885266%20L16.093021%2C13.906979%20Z%22%20transform%3D%22rotate%2845%2020.657%201.343%29%22/%3E%0A%3C/svg%3E%0A');
	cursor: pointer;
}

.ui-file-progressbar-cloud {
	transition: transform 0.2s ease-out;
	background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20width%3D%2265%22%20height%3D%2248%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%3Cpath%20d%3D%22M64.285%2034.65a13.044%2013.044%200%200%200-9.362-12.648c0-.113.008-.224.008-.338.12-7.444-5.816-13.576-13.26-13.7-1.5%200-2.99.262-4.4.776A13.629%2013.629%200%200%200%2024.672%200C17.024.125%2010.925%206.427%2011.05%2014.076c0%20.085%200%20.168.006.253A17.2%2017.2%200%200%200%200%2030.54C0%2040.047%207.46%2047.755%2016.66%2047.755c.186%200%20.37-.008.554-.015v.015h34.464c7.09-.16%2012.721-6.014%2012.607-13.105z%22%20fill%3D%22%23FFF%22%20fill-rule%3D%22evenodd%22/%3E%3C/svg%3E');
	cursor: default;
}

.ui-file-progressbar-error {
	transition: transform 0.2s ease-out;
	background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20width%3D%2256%22%20height%3D%2255%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%3Cg%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%3E%3Cpath%20d%3D%22M28.393%204.98c-.325-.603-.835-.98-1.4-.98h-.01c-.565%200-1.075.388-1.39%201.002L4.275%2046.627a2.512%202.512%200%200%200%20.098%202.457c.195.313.619.851%201.324.851L49.331%2050c.706%200%201.13-.539%201.314-.851a2.55%202.55%200%200%200%20.054-2.5L28.393%204.98zM25.007%2016.5a2.17%202.17%200%200%201%202.17-2.156c1.195%200%202.172.97%202.172%202.155v15.086a2.17%202.17%200%200%201-2.171%202.155%202.17%202.17%200%200%201-2.171-2.155V16.499zm2.17%2027.94a3.12%203.12%200%200%201-3.136-3.114%203.12%203.12%200%200%201%203.137-3.114%203.12%203.12%200%200%201%203.137%203.114%203.12%203.12%200%200%201-3.137%203.114z%22/%3E%3Cpath%20d%3D%22M28%2034c1.1%200%202-1%202-2.222V16.222C30%2015%2029.1%2014%2028%2014s-2%201-2%202.222v15.556C26%2033%2026.9%2034%2028%2034z%22%20fill%3D%22%23FFF%22/%3E%3Ccircle%20fill%3D%22%23FFF%22%20cx%3D%2228%22%20cy%3D%2242%22%20r%3D%223%22/%3E%3Cpath%20d%3D%22M55.191%2045.25L32.756%203.269C31.664%201.216%2029.7%200%2027.494%200h-.055c-2.216.022-4.181%201.27-5.25%203.355L.745%2045.295a6.893%206.893%200%200%200%20.262%206.709c1.125%201.823%203.013%202.93%205.055%202.93L49.951%2055h.011c2.063%200%203.952-1.118%205.066-2.964a6.923%206.923%200%200%200%20.163-6.785zm-3.908%204.55c-.186.314-.611.857-1.321.857l-43.888-.065c-.71%200-1.135-.532-1.332-.847a2.566%202.566%200%200%201-.098-2.475L26.096%205.309c.317-.619.83-1.01%201.398-1.01h.01c.569%200%201.082.37%201.41.988l22.424%2042.005c.502.933.294%201.921-.055%202.508z%22%20fill%3D%22%23FFF%22%20fill-rule%3D%22nonzero%22/%3E%3C/g%3E%3C/svg%3E');
}

.ui-file-progressbar-label {
	line-height: 20px;
	top: 0;
	left: 0;
	padding: 0 10px;
	font-size: 12px;
	color: rgba(255, 255, 255, 0.54);
	height: 20px;
	background: rgba(0, 0, 0, 0.55);
	margin-top: 4px;
	border-radius: 20px;
	transition: .2s ease-in-out;
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;
}

.ui-file-progressbar-rotating {
	animation: ui-file-progressbar-rotating 2s linear infinite;
	transform-origin: 50% 50%;
}

@keyframes ui-file-progressbar-rotating {
	from {
		transform: rotate(0deg);
	}
	to {
		transform: rotate(360deg);
	}
}

@keyframes ui-file-progressbar-blur {
	from {
		filter:blur(0);
	}
	to {
		filter:blur(4px);
	}
}