﻿.ºdragndrop{
	border-radius: var(--control-border-radius-2);
	border: 2px dashed var(--control-border-color);
	margin-bottom: var(--size-2);
	transition: 
		border-color .3s ease-out, 
		background .3s ease-out;
}
	.ºdragndrop .container{
		text-align: center;
		height: 100%;
	}
	.ºdragndrop	input.file{
		width: 0.1px;
		height: 0.1px;
		opacity: 0;
		overflow: hidden;
		position: absolute;
		z-index: -1;
	}
	.ºdragndrop	input.file + label{
		max-width: 80%;
		text-overflow: ellipsis;
		white-space: nowrap;
		cursor: pointer;
		display: inline-block;
		overflow: hidden;
	}
	.ºdragndrop .form .input label{
		padding: 5.5% 0 5% 0;
	}
	.ºdragndrop .is-uploading .input, .ºdragndrop .is-success .input, .ºdragndrop .is-error .input,
	.ºdragndrop .uploading, .ºdragndrop .success, .ºdragndrop .error{
		display: none;
	}
	.ºdragndrop .is-uploading .uploading, .ºdragndrop .is-success .success, .ºdragndrop .is-error .error{
		display: block;
	}
		.ºdragndrop .button{
			border-radius: 6px;
    		margin: 2px;
		}
			.ºdragndrop .button:hover, .ºdragndrop .button:focus{
				background-color: #0f3c4b;
			}
	.ºdragndrop .ºbutton{
		display: none;
	}

	.ºdragndrop .input a.link{
		transition: 
			color .3s ease-in;
	}
		.ºdragndrop .input:hover a.link{
			color: var(--color-5);

		}

	.ºdragndrop.is-dragover{
		border-color: #0066ff;
		background: #f5f9ff;
		color: #003f99;
		transition: 
			border-color .5s ease-in, 
			background .5s ease-in;

	}


.ºlayout .ºdragndrop{
	margin-bottom: unset;
}