/******* Do not edit this file *******
Woody Code Snippets CSS and JS
Saved: Jun 14 2023 | 14:06:58 */
/*** UPLOAD AREA & BUTTON BEGIN ***/

.dropzone {
    min-height: 200px !important;
	border: 2px dashed #dedede !important;
    /*border: 2px solid rgba(0,0,0,.3);*/
	border-radius: 0.75rem !important;
    background: #fff;
    padding: 20px 20px;
	transition: background .2s ease-in-out, border .2s ease-in-out;
}

.dropzone:hover {
	color: #000;
/*	color: #868587;*/
	background: #fafafa;
	border-color: #000 !important;
}

.dragover {
	color: #000;
	background: #fafafa;
	border: 2px dashed #000 !important;
	transition: background .2s ease-in-out, border .2s ease-in-out;
}

/*.dragover:hover {
	background: #fafafa;
	border-color: #000 !important;
}*/





.dropzone .dz-preview .dz-success-mark, .dropzone .dz-preview .dz-error-mark {
	top: 45% !important;
}

.dz-error-mark {
	background: rgba(255,0,0,.8) !important;
}




.dropzone .dz-preview .dz-progress {
/*  opacity: 1;
	z-index: 1000;
	pointer-events: none;
	position: absolute;*/
	height: 12px !important;
 	top: 75% !important;
/*	left: 50% !important;*/
/*  top: 50%;
	margin-top: -10px;
	left: 15%;
	right: 15%;*/
	border: 2px solid rgba(0,0,0,.8) !important;
/*  background: rgba(0,0,0,.8);*/
	border-radius: 6px !important;
/*  overflow: hidden;*/
}







/*.dropzone .dz-preview .dz-progress {
	background: rgba(0,0,0,0.15) !important;
/*	background: transparent !important;*/
/*	border-radius: 3px !important;
	height: 6px !important;*/
/*  	top: 75% !important;
}*/

/*.dropzone .dz-preview .dz-progress .dz-upload {
/*	background: #084cdf !important;*/
/*	background: #000 !important;*/
/*.dropzone .dz-preview .dz-progress .dz-upload {
	background: rgba(0,0,0,0.5) !important;
	border: 2px solid #000000;
	height: 4px !important;
  	top: 115% !important;*/
/*}*/

.dropzone .dz-preview.dz-image-preview {
    background: transparent !important;
}

.dropzone .dz-preview.dz-file-preview .dz-image {
    border-radius: 20px;
	background: #efefef !important;
    /*background: #999;
    background: linear-gradient(to bottom, #eee, #ddd);*/
}

.dropzone .dz-preview:hover .dz-image img {
      /*-webkit-transform: scale(1.05, 1.05);
      -moz-transform: scale(1.05, 1.05);
      -ms-transform: scale(1.05, 1.05);
      -o-transform: scale(1.05, 1.05);
      transform: scale(1.05, 1.05);
      -webkit-filter: blur(8px);*/
      filter: blur(10px) !important;
    }

.dropzone-upload-icon {
	font-size: 2rem;
    margin-bottom: 1rem;
}




.dropzone .dz-message {
    text-align: center;
    margin: 1em 0 !important;
}

.dropzone .dz-preview .dz-error-message {
	background: #d22730 !important;
    top: 150px !important;
	box-shadow: 0 0 0 0.3125rem rgb(210 39 48 / 15%); /* Border shadow */
	-webkit-box-shadow: 0 0 0 0.3125rem rgb(210 39 48 / 15%); /* Border shadow */
	animation: dz-error-message-pulse 2s infinite; /* Pulse animaton */
}

/*** DZ ERROR MESSAGE PULSE ANIMATION BEGIN ***/
@-webkit-keyframes dz-error-message-pulse {
	0% { -webkit-box-shadow: 0 0 0 0 rgba(210, 39, 48, 0.4); }
	70% { -webkit-box-shadow: 0 0 0 10px rgba(210, 39, 48, 0); }
	100% { -webkit-box-shadow: 0 0 0 0 rgba(210, 39, 48, 0); }
}
@keyframes dz-error-message-pulse {
	0% {
		-moz-box-shadow: 0 0 0 0 rgba(210, 39, 48, 0.4);
		box-shadow: 0 0 0 0 rgba(210, 39, 48, 0.4);
	}
	70% {
		-moz-box-shadow: 0 0 0 10px rgba(210, 39, 48, 0);
		box-shadow: 0 0 0 10px rgba(210, 39, 48, 0);
	}
	100% {
		-moz-box-shadow: 0 0 0 0 rgba(210, 39, 48, 0);
		box-shadow: 0 0 0 0 rgba(210, 39, 48, 0);
	}
}
/*** DZ ERROR MESSAGE PULSE ANIMATION END ***/

.dropzone .dz-preview .dz-error-message:after {
    border-bottom: 6px solid #d22730 !important;
}







input[type=file]::file-selector-button {
	margin-right: 20px;
	border: none;
	/*border: 2px solid #000;*/
	/*border-radius: 10px;*/
	border-radius: 0.5rem;
	/*background: transparent;*/
	background: #084cdf;
	padding: 10px 20px;
	color: #fff;
	cursor: pointer;
	transition: background .2s ease-in-out;
}

input[type=file]::file-selector-button:hover {
	/*color: #fff;
	background: #000;*/
	background: #0d45a5;
}

.drop-container {
	left: 0;
	position: relative;
	display: flex;
	gap: 10px;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	height: 200px;
	padding: 20px;
	border-radius: 0.75rem;
	/*border-radius: 10px;*/
	border: 2px dashed #dedede;
	/*  border: 2px dashed #555;*/
	color: #000;
	cursor: pointer;
	transition: background .2s ease-in-out, border .2s ease-in-out;
}

.drop-container:hover {
	background: #fafafa;
	border-color: #000;
}

.drop-container:hover .drop-title {
	color: #000;
}

.drop-title {
	color: #000;
	font-size: 20px;
	font-weight: 500;
	text-align: center;
	transition: color .2s ease-in-out;
}
/*** UPLOAD AREA & BUTTON END ***/