.dragdropzone {
	  width: 100%; 
	  min-height: 40vh; 
	  margin: 0 auto 1em auto; 
	  padding: 1em 1em 1em 1em; 
	  background-color: #333856; 
	  border-width: 3px; 
	  border-style: dashed; 
	  border-color: rgba(255,255,255,0.2);
	}
	
	.drag-drop {
	  margin: auto;
	  margin-top: 2em;
	  padding-bottom: 1em;
	  width: 100%; 
	  text-align: center; 
	  font-size: 2em; 
	  font-weight: 600; 
	  color: rgba(255,255,255,0.2); 
	  line-height: 1em;
	}

	#previews {
	  color: #fff;
		z-index: 1;
	}
	
	.file-row {
		background-color: #333856; 
	}
	
	
    #actions {
      margin: 0 0 1em 0;
    }
	
	.filebuttons {
		margin-left: -2em;
	}
	
	.progress {
		background-color: #e9ecef;
		border-radius: 1px;
		background: linear-gradient(#a4f1fe, #ffffff);
		background-repeat: repeat-x;
		height: 20px;
		margin-top: -30px;
		-webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,.1);
		box-shadow: inset 0 1px 2px rgba(0,0,0,.1);
	}


    /* Mimic table appearance */
    div.table {
      display: table;
    }
    div.table .file-row {
      display: table-row;
    }
    div.table .file-row > div {
      display: table-cell;
      vertical-align: top;
      border-top: solid 1px rgba(212, 212, 255, 0.1);
      padding: 8px;
    }
    div.table .file-row:nth-child(odd) {
	  background-color: rgba(212, 212, 255, 0.035);
    }



    /* The total progress gets shown by event listeners */
    #total-progress {
      opacity: 0;
      transition: opacity 0.3s linear;
    }

    /* Hide the progress bar when finished */
    #previews .file-row.dz-success .progress {
      opacity: 0;
      transition: opacity 0.3s linear;
    }

    /* Hide the delete button initially */
    #previews .file-row .delete {
      display: none;
    }

    /* Hide the start and cancel buttons and show the delete button */

    #previews .file-row.dz-success .start,
    #previews .file-row.dz-success .cancel {
      display: none;
    }
    #previews .file-row.dz-success .delete {
      display: block;
    }