/***
  Styles below are only required if you're using <iframe> fallback in
  addition to HTML5 drag & drop (only working in Firefox/Chrome/Opera 15+).
 ***/

/* Essential FileDrop zone element configuration: */
.fd-zone {
  position: relative;
  overflow: hidden;
  margin: 0 auto;
  text-align: center;
  border: solid 2px #E1E1E1;
  display: block;
}
.fd-zone-p {
  padding: 10px 0 0 14px;
  text-align: left;
}
/* Hides <input type="file"> while simulating "Browse" button: */
.fd-file {
  opacity: 0;
  font-size: 118px;
  position: absolute;
  right: 0;
  top: 0;
  z-index: 1;
  padding: 0;
  margin: 0;
  cursor: pointer;
  filter: alpha(opacity=0);
  font-family: sans-serif;
}

/* Provides visible feedback when user drags a file over the drop zone: */
.fd-zone.over { border-color: maroon; background: #eee; }

.fd-zone .progress span {
  animation: progress .7s linear infinite;
  -moz-animation: progress .7s linear infinite;
  -webkit-animation: progress .7s linear infinite;
  -o-animation: progress .7s linear infinite;
  display: block;
  width: 0;
  height: 1em;
  background: url(progress.gif);
}

/***
  Styles below are only required if you're using <iframe> fallback in
  addition to HTML5 drag & drop (only working in Firefox/Chrome/Opera 15+).
 ***/

.fd-zone .progress  {
  margin-bottom: 0;
  border-radius: 0;
}