:root{
	--previewCntWidth: 80px;
	}
.upload-preview{
	display: flex;
	flex-direction: row;
	padding: 0;
	margin-top: 40px;
	max-width: 80%;
	overflow: scroll;
	}
	
 .upload-preview li .wrap{
	align-content: center;
	display: flex;
	flex-direction: column;
	height: inherit;
	justify-content: center;
	overflow: hidden;
	width: inherit
	}
	
.upload-preview li{
	border-radius: 4px;
	display: block;
	height: var(--previewCntWidth);
 	list-style: none;
	overflow: hidden;
	position: relative;
	width: var(--previewCntWidth);
	border: 1px solid #ccc;
	margin-right: 20px;
	flex-shrink: 0;
	}

.upload-preview li:last-of-type{
	margin-right: 0;
	}
	
 .upload-preview li img{
	height: auto;
	width: 100%;
	}
	
.upload-preview li .removeBtn{
	background: rgba(0,0,0,0.2) url("../images/remove.svg") center center no-repeat;
	background-size: calc(var(--previewCntWidth) - (var(--previewCntWidth) / 2));
	height: inherit;
	left: 0;
	position: absolute;
	top: var(--previewCntWidth);
	transition: top .15s ease-in-out;
	width: inherit;
	}
	
.upload-preview li:hover .removeBtn{
	top: 0px;
	}

.dndCnt.has-advanced-upload{				
	/*border-radius: 20px;
	border: 6px dashed #fff;*/
	outline-offset: -2px;;
	outline-color: #fff;
	outline-style: dashed;
	-webkit-transition: outline-offset .15s ease-in-out, background-color .15s linear;
	transition: outline-offset .15s ease-in-out, background-color .15s linear;
}

.dndCnt label:before{
	display: block;
	height: 4vw;
	margin: 0 auto 20px;
	min-width: 44px;
	min-height: 44px;
	position: relative;
	width: 4vw;
	background: url(../images/upload-icon.svg) no-repeat;
	background-size: cover;
	content: '';

}

.dndCnt .dndCnt__file {
	width: 0.1px;
height: 0.1px;
opacity: 0;
overflow: hidden;
position: absolute;
z-index: -1;
}

.dndCnt.is-dragover
{
	outline-offset: -20px;
	outline-color: #c8dadf;
	
}
	.dndCnt__dragndrop,
	.dndCnt__icon
	{
		display: none;
	}
	.dndCnt.has-advanced-upload .dndCnt__dragndrop
	{
		display: inline;
	}
	.dndCnt.has-advanced-upload .dndCnt__icon
	{
		width: 100%;
		height: 80px;
		fill: #92b0b3;
		display: block;
		margin-bottom: 40px;
	}

	.dndCnt.is-uploading .dndCnt__input,
	.dndCnt.is-success .dndCnt__input,
	.dndCnt.is-error .dndCnt__input
	{
		visibility: hidden;
	}

	.dndCnt__uploading,
	.dndCnt__success,
	.dndCnt__error
	{
		display: none;
	}
	.dndCnt.is-uploading .dndCnt__uploading,
	.dndCnt.is-success .dndCnt__success,
	.dndCnt.is-error .dndCnt__error
	{
		display: block;
		position: absolute;
		top: 50%;
		right: 0;
		left: 0;

		-webkit-transform: translateY( -50% );
		transform: translateY( -50% );
	}
	.dndCnt__uploading
	{
		font-style: italic;
	}
	.dndCnt__success
	{
		-webkit-animation: appear-from-inside .25s ease-in-out;
		animation: appear-from-inside .25s ease-in-out;
	}