.droparea-control.in {
  border: 2px #eee dashed !important;
  background-color: #ccc !important; }

.droparea-control {
  background-color: #eee;
  border: 2px #ccc solid;
  min-height: 100px;
  cursor: pointer; }

.droparea-control input[type=file] {
  display: inline-block;
  font-size: 9pt;
  height: 24px;
  margin: 0;
  padding: 0 2px;
  -ms-filter: 'alpha(opacity=0)';
  opacity: 0;
  position: absolute;
  top: 0;
  left: -1000px; }

.droparea-preview {
  position: relative;
  display: inline-block;
  vertical-align: top;
  margin: 0.5em;
  min-height: 100px;
  border: 1px solid #004F76;
  padding: 0.2em;
  z-index: 11; }

.droparea-preview .droparea-preview-delete {
  margin: 0px 0px -1px;
  z-index: 11;
  cursor: pointer;
  font-weight: bold;
  font-size: 1.3em;
  color: #004F76;
  display: inline-block;
  width: 100%; }

.droparea-preview .droparea-preview-delete span {
  position: relative;
  top: 0;
  right: 0;
  float: right; }

.droparea-preview .droparea-preview-image .droparea-preview-image-content {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%); }

.droparea-preview .droparea-preview-image,
.droparea-preview .droparea-preview-details {
  width: 120px; }

.droparea-preview .droparea-preview-image span {
  position: absolute;
  top: 41%;
  left: 34%;
  font-weight: bold; }

.droparea-preview .droparea-preview-details-filename {
  white-space: nowrap; }

.droparea-preview .droparea-preview-image {
  /*border-radius: 20px;*/
  overflow: hidden;
  position: relative;
  display: block;
  z-index: 10; }

.droparea-preview .droparea-preview-image img {
  display: none; }

.droparea-preview .droparea-preview-image-progress {
  width: 0%;
  /*position: absolute;*/
  background-color: #ccc;
  top: 0;
  left: 0; }

.droparea-preview .droparea-preview-image-progress div {
  width: 0%;
  display: block;
  position: absolute;
  top: 0;
  left: 0; }

.droparea-preview .droparea-preview-details {
  z-index: 20;
  font-size: 0.8em;
  min-width: 100%;
  max-width: 100%;
  padding: 0.5em 0.5em;
  overflow: hidden; }

.droparea-preview .droparea-preview-details:hover {
  overflow: inherit; }

.droparea-control.fade {
  -webkit-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  -ms-transition: all 0.3s ease-out;
  -o-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
  opacity: 1; }

.droparea-control-detail canvas {
  max-width: 100%;
  max-height: 100%; }

.droparea-control-detail .pager {
  margin-top: 0 !important;
  margin-bottom: 0 !important; }

.droparea-control-detail .pager span {
  font-weight: bold;
  line-height: 2.0em;
  vertical-align: middle;
  font-size: 1.2em; }

.droparea-control-detail .modal-body {
  text-align: center; }

.droparea-control-detail .glyphicon-refresh-animate {
  -animation: spin 1s infinite linear;
  -ms-animation: spin 1s infinite linear;
  -webkit-animation: spinw 1s infinite linear;
  -moz-animation: spinm 1s infinite linear;
  font-size: 6em;
  color: #004F76; }

@keyframes spin {
  from {
    transform: scale(1) rotate(0deg); }
  to {
    transform: scale(1) rotate(360deg); } }

@-webkit-keyframes spinw {
  from {
    -webkit-transform: rotate(0deg); }
  to {
    -webkit-transform: rotate(360deg); } }

@-moz-keyframes spinm {
  from {
    -moz-transform: rotate(0deg); }
  to {
    -moz-transform: rotate(360deg); } }