.dragging * {
	cursor: grabbing !important;
	cursor: -moz-grabbing !important;
	cursor: -webkit-grabbing !important;
	-webkit-touch-callout: none;
	  -webkit-user-select: none;
	     -moz-user-select: none;
	      -ms-user-select: none;
	          user-select: none;
}

.dragger {
	position: fixed;
	left: 0;
	top: 0;
	z-index: 97;
	background: $blue;
	color: $white;
	padding: 12px 20px;
	pointer-events: none;
}

.dropzones {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 98;
	background: darken($dark_grey, 1%);

	.dropzone {
		@include animate();
		@include gradient_overlay(3px,0);
		margin: 15px;
		padding: 40px 20px;
		background: $grey;
		border: 5px solid transparent;
		border-radius: 3px;
		color: $white;
		font-size: 18px;
		text-align: center;

		& * {
			pointer-events: none;
		}

		.icon {
			display: block;
			margin: 0 auto 10px;
			width: 32px;
		}

		&.hover {
			border-color: $blue;

			&:before {
				opacity: 0.15;
			}
		}
	}
}