.transitionBGColor {
  -webkit-transition: background-color 0.3s;
  transition: background-color 0.3s;
}
input[type=file] {
  display: none;
}
.fileDropZone {
  border: 2px dashed rgba(0, 0, 0, 0.1);
  border-radius: 5px;
  margin: 10px auto;
  font-size: unset;
  color: rgba(0, 0, 0, 0.3);
  padding: 15px;
  min-width: 23px;
  display: block;
  cursor: default;
}
.fileDropZone:hover {
  border: 2px dashed rgba(0, 0, 0, 0.5) !important;
  color: rgba(0, 0, 0, 0.5);
}
@media only screen and (max-width: 940px) {
  .fileDropZone {
    display: none !important;
  }
}
div.fileList {
  padding: 5px 10px;
  background-color: rgba(200, 200, 255, 0.01);
  border: 1px solid transparent;
  margin: 0;
  text-align: center;
}
div.buttons {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}
.dragging {
  background-color: rgba(0, 0, 0, 0.1) !important;
  border: 2px dashed rgba(0, 0, 0, 0.5) !important;
  color: rgba(0, 0, 0, 0.5);
}
ul.fileList {
  text-align: left;
  list-style-type: none;
  padding: 0 10px;
}
li.fileList {
  border-top: 2px solid #e7e7e7;
  overflow-y: auto;
  padding: 5px 0 10px 0;
}
li.fileList:last-child {
  border-bottom: 2px solid #e7e7e7;
}
img.file {
  width: 60px;
  height: 60px;
  vertical-align: middle;
  margin: 10px;
}
div.fileInfo {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-justify-content: space-around;
      -ms-flex-pack: distribute;
          justify-content: space-around;
}
span.fileInfo {
  display: inline-block;
  padding: 3px;
  margin: 5px;
  border: 1px solid #e7e7e7;
  border-radius: 4px;
  -ms-flex: 1 1;
  -webkit-flex: 1 1;
  -webkit-box-flex: 1;
          flex: 1 1;
  min-width: 150px;
  overflow: hidden;
  white-space: nowrap;
}
span.fileInfoProgress {
  -webkit-box-flex: 4;
  -webkit-flex-grow: 4;
      -ms-flex-positive: 4;
          flex-grow: 4;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}
progress.progressPanel {
  border-radius: 3px;
  border: 2px solid rgba(200, 200, 255, 0.6);
  height: 12px;
  width: 100%;
}
.selectFiles {
  display: block !important;
}
@media only screen and (max-width: 940px) {
  .selectFiles {
    display: block !important;
  }
}
.fileAction {
  display: inline-block;
  height: 16px;
  width: 16px;
  border: 1px solid transparent;
  vertical-align: middle;
  padding: 10px 10px;
  margin: 0 10px;
  background-repeat: no-repeat;
  background-position: center center;
}
.fileRemove {
  background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAMAAAAoLQ9TAAAA/FBMVEUAAADCJQ/QLBbRIgnRJQ3bQy3bRjDhKAzhYE7haFfnRy7pLA7uY03utq/uxcDzMQ70QSD2MRD2Nxb2fmr20cv20s325OL5+fn+SSj+TS3+UDL+UzT+VTj+Vjf+Vjj+WTv+YUX+YUb+Ykb+ZEj+Zkv+e2X/NhP/PRv/QiH/TzH/UjT/Vjn/WTz/Wz//XkL/alD/b1b/c1r/dV3/emP/fGX/g27/h3P/i3b/jHj/kX7/loP/no7/ppf/qJn/rJ3/rZ//saT/v7T/xLn/y8L/zMT/zsX/08v/1c7/1s//19H/2dL/29T/39n/4dz/5N//5uH/5uL/7On/9vX/+fj/iC8RAAAAAXRSTlMAQObYZgAAAI1JREFUGNNjYMAAXvrOqAL2KoqOUKafLYh0MFBStgbznRVMwbSbgbS8obi4uKqsJUyXjYS0ibe5vDnCHB9dJSkZI2STXeQkNZH5/jpqgvxaCH6AtjqPhwG3HYwfqCfAysfAYMYiCuEHG2sw8YIYXBxiYAEnIWbOIDCLUQRMWbGz+ULUCruDKU8LVwY8AACceg8DrEK5NAAAAABJRU5ErkJggg==') /*../images/DeleteRed.png*/;
}
.fileRemove:hover {
  border: 1px solid red;
}
span.message {
  display: none;
  text-align: left;
  margin: 20px;
  padding: 5px 15px 6px 45px;
  background-repeat: no-repeat;
  background-position: 8px center;
  background-size: 20px;
}
span.error {
  color: Black;
  border: 1px solid Red;
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAABS1JREFUaN7F2GlS3EYYBmAdQUfQEfQrLjt2RU5sx7GdeHBSSSWVRUklFZJfcwRdICwDwwyLEftmG7EzzNYMS/7OEXSEjrnAl7dBMg3IMtNqQK6ncInW972tpWeQYWjYDvcPTXAPD/71gQGlaB+PE+P3Dy3jJreDvQMX2OH+AanC8W3Ig3ltwfdb+x5woBQhMEn4gfGinre3u391E2mxPWdvdy8EShBAHuy0GuL34IIPPKEOR5+81uC7zZYJvbusReeELdbKg6l+Ulou6rALtZvY12xlvxqswSzW2G0DSThr7ro6TxLqOagbXujTYLZy0Wa9aQNv1hlJAlZnV3aforZ3tp/o3+x8EvVqw27UGrxRa1KsWWu617FIoI+DflLvBhd5Ll2gtlM3a9V6u16tU6SzAho20a8uZUAejlyXy1Cr1Fhtp0aRyx94bjv6+2sbHPFT5fjjE3ncP8pSqYWQfvvubFfz1UqVJLmOg//1wgQGJAmh44lUKzUbGXicB/n89w6ubFUs4JWtHYp4Sme+uwvhu+iC7i5+1J3reAFAjpyUCSpO4sDtzW0fKNJWCv9nzgZKofQhhTyBlC28MGBzY8va2tgiidp9/8dzDyhFoFIXeUzgcT7kPbsibqxv+kARX3X1OPr9Kw8oBVOtjVyelPH0DllbXTfX1zZIovw19+i3Lz2gFL2qtZFL5ORxzrXVjZO7ZG1l3QWKsCzr99Gvz3JAKbws9ZHPl7KenIzVQPxbo0imT9u3vzy1gVI4Weojn32adfXkYQ6WV3iwvErCyvJq5r+S3v78hFJkro+c7/Iay28CCygS6vga8PanxwwoiY76yBnEmY03r5cdoEigZQI/PvaBEjAd9ZHTizMbr5feeEART8sEfvjcA0rg66iPnLk4s7G0+MoDiuiZwPePHKAEWuojpxNnNhYXXnlAEUfLBL57aAEl0FJf5IwzGwvzSx5QREsDsf337QNKoOU9kMgZZzbm5xY9oIinbQLffMaAZLpqI6cTZzZmZxc8oIi+Cby47wNJmK7aszMLuTizMTM97wAJ09NzgbYJdN33gCS+rtrI6sWZjempOQvoxGyobQLPP3GAJNquLnIGcebjHVOTMxxImJycudkXrpfYJqW8xzsmJqYDoIi2Vyf86T0LHND2RgP5bCnryR0z4U+5QBGWPfhdE3z+7B698/RuGzJPBPl8KevJ12l/fNIcH58kSabbiD/5uBcoQaZnbPzlcU4u5Tw9IS/HJnygiPKKwR/fMfkXCPt+yh+WyOVJGc++dBgb862xUZ9OjStdbv7ojgOUQmkCyGMiF5cyXnxWR0fGfaCI0msV/vC2yR/cphRKJwZ5Ailb8q04MvLSAg4kDA+PKa3d/NNbDCiB0gKBHLk4U8RJG5wHeqc82vGrRX7/lskdTMJB6FNM7O84fHnUBi5l+vDzWS6NMiChVBrhoPY8OB9Z4IDS8ehrQhhngbBcHjUvd+DQSAgkDA0Nc7jW1+uiH7TjDNDZiSwWh+1iscyBIuL/7nWELw6Wz/cmkUehUMkGDhQbHCz5YF5VeNT25H5R/5x6wYGSNTBQagOdGgoLhSGtVwP1HNQ916fE0d/WUdwsFIo+0Bn9xbC/v+iC8hURx6MOu1C7IPYN6b3S/f2Dub6+wRAoQdDXN5CH1DMmfg8uxvvAE+pw9Mlf2QOG5iZ4gOYDlAITHWCS9gfG86iueS3LXG9vwQS3p7fQBsqgjTp5Ue/G/kLq6SlY4P7TU/CBAaVoi3EYnxfHZe39P7NItNCU5DaqAAAAAElFTkSuQmCC) /*../images/important.png*/;
  background-color: lightyellow;
}
span.info {
  color: Black;
  border: 1px solid Green;
  background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAABT9JREFUaN7F2Ptu21QcB/A8gh/Bj9BH8CNECAmQEApCCAkhZIEQEgJ0NEAIodXNrUkvq9umbdbL6qbp2jS3k94Qq9gM21hp//EjnEf48U1qt04bp4mPm0X6aMuJ+/t9f65znDQWi+hxcnQSPzn+gwEHARTAAQvH6zAWe5uP48NjDcyTo2MKCz/vgAHqyIIfto7iRwdHNlAfArjPXce3mah9f4Mc8EP1sHXIgXqwgYHWf/hOjTgY4ATUMtBLiTR8q3mgg2jxA/JpP0ezAzX8STnQUMO8UZfQywH59whvcIU3WiZQl2aLQWRnCbVU1OW3+jRaidBFm/WmAnazzsnH5nV+b7sHasfRQ3T3bA4/RL3aUBq1ht2oNcnHHMUm0aw1VfS60bsx3BC1at2sV+t0rZEY5RbdPoHoa/kzINNgGWqVGqvt1+hafejwyfKFmipfGMDBxHMtzCDoz7uyVGr9L9/9vepYtVIlH2PYphPbFxoIoBv0YWtVKzUFGWwvD/LZELx5VHYrdmV3n1x82IYPt86V8a1zMV46p17w+tBb7v7evoos4jpXhfU8cO/pXgLIJWDoZr9b5xpQHyzMpYQsui8b9cz2dGfX2d3ZJZceptFvm/9pQH2wsG9sZOJePmTt3hF3yk8TQC4nbJNfN840oD5C72bIpfkyUnl75/q9sF3asbFALqkt8+f1MxuoB+eX9TOpuzeycS8nMl9eJdtbZRWorbRVFtulslSTn9beKA/W3thAPjbWpe/gyJjwsoLdWSxZJb1kbZMrsrstW/1X80R5k0NG4eXtLFibW5a1WSJXJHfcH4qvNYj/WHzN8K8J3CVdHxmv8nYWNp9YDtClrVAfjb9feZ0ADgKoDyY7AHLqXt7OwpONTXKJsEW/W37FgAYgPQByal7m2MbaEw3IxcMW/XbpFQMagPQAG+ubipc5tra6rgG5Qg/wTeElAxoAi+I95mWOrT5e14Bchmzhrxdfxr9afCmAAkQygJc59ri4pgG1FYtrRhTF9fl/DKAAkQzgZY4VV1Y1IBePoviX5t8MKEAkA3iZY8vLjzUgVyQDfDFnM6AA0gMsLRUVL/PlQqFIbYXCiohigM9nbQYUQH6AQlHzMncWCosrDtClZem/jH0284IBBZAeABl1L29nYXFhyQJqW1hYkr7Vfzr9ggEFkB5gwZe3szA/X9CBXNIf5j6Zes6AAkgPgIzCy3u5YC6qQC5hmotSH6c/zj9nQAGkBkC+hC+rffXC3NyCDeSSuow+yv3FgAJIDYBs3Jfz+mvvo9n5BJDLkWny4eSpARQg9CWKXJovY1v3lTI7YzpArlBf6t/PnMY/yJ4KoACifUyY2sjEfflun4iZ6bkEkEvAwFvqe5lTHWhIA3/FvJENAwRkm55+ZAO1TU3NDnxnfjf9jAENaaCvmsihgvByAet38BjQlfzMQB/w3kk9Y0BDunMA9FfA9mVq/7//LpnPzTAgTy43feeuFE/+mQA+pDsvIfS2/Fny+ZnBLrvc5LQF5JmcnBrpn9fRTwHTn2GQE3n1yGanlGw2bwP5GKMIn83ke/XWQxTKKWADeTJ4Dup9hUftOAh/Twh/88ukc0o6nTOBrk0KYKnUpBJVcNRSUdPq7oMTls4lomqgp1JZ6pLMCmDJZDb0bwQ/q6GGeat2Kuug51ikv95kMjM2MZHhQD3YwCYm0n23RryuQhzHGuAE1DLQS7m3NxkCJADN09SHAH4D3cFsDziyrc4wUvFxI2UBSXDAQC019rYe4+MpBeIPx1MGcBBAARywcDwD6Wv8f1Jfmjbi3jy0AAAAAElFTkSuQmCC') /*../images/info.png*/;
  background-color: lightyellow;
}