*{margin:0; padding:0}



/*Base*/
.flu-base-button{vertical-align:top; background:#000; display:inline-block; cursor:pointer; min-width:70px; text-align:center; padding:5px 13px; margin-right:4px; font-size:14px; color:#fff; border-radius:3px; -moz-border-radius:3px; -webkit-border-radius:3px;}
.flu-base-button.disabled{display:none}

.fileinput-button {position: relative;overflow: hidden;   background:#5CB85C; }
.fileinput-button:hover{background:#47A447; }
.flu-container{margin-top:7px;}
.flu-container .start, .flu-container .start-fake {background:#428BCA;}
.flu-container .start:hover, .flu-container .start-fake:hover, .flu-container .start:focus, .flu-container .start-fake:focus {background:#3276B1;}
.flu-container .cancel {background:#EEA236;}
.flu-container .cancel.flu-del {background:#D64F4F;}
.flu-container .cancel.flu-del:hover, .flu-container .cancel.flu-del:focus{background:#BA4343;}
.flu-container .cancel:hover, .flu-container .cancel:focus {background:#D58512;}
.flu-container .delete {background:#D9534F;}
.flu-container .delete:hover, .flu-container .delete:focus {background:#D2322D;}


.fileinput-button input {position: absolute;top: 0;right: 0;margin: 0;opacity: 0;-ms-filter: 'alpha(opacity=0)';font-size: 200px;direction: ltr;cursor: pointer;}
@media screen\9 {
  .fileinput-button input {filter: alpha(opacity=0);font-size: 100%;height: 100%;}
}

/* UI*/

.fileupload-buttonbar .btn,.fileupload-buttonbar .toggle {margin-bottom: 5px;}
.flu-buttonholder{display:inline-block; vertical-align:top;}
.fileupload-progress{width:300px; display:inline-block; height:22px; vertical-align:top; margin-top:5px;}
.progress-animated .progress-bar,.progress-animated .bar {background: url("/images/progressbar.gif") !important;filter: none; height:22px; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px;}
.fileupload-process {float:right; display: none;}
.flu-tpl-prev{width:105px;}
.flu-tpl-last{text-align:right; vertical-align:middle; width:220px;}
.fileupload-processing .fileupload-process,.files .processing .preview {display: block;width:15px; height:15px; background: url("/images/wait.gif") center no-repeat;}
.files audio,.files video {max-width: 300px;}
.fileupload-buttonbar{margin-top:10px; }
.flu-table{width:100%; border-collapse:collapse; border-left:1px solid #e6e6e6; border-right:1px solid #e6e6e6;}
.flu-table td{border-top:1px solid #e6e6e6; border-bottom:1px solid #e6e6e6; background:#fff; padding:10px 7px 10px 7px; vertical-align:top}
.flu-table td .preview{display:inline-block; }
.flu-table td .preview canvas, .flu-table td .preview img{display:block; padding:1px; border:1px solid #ccc;}
.flu_dropzone{border:2px dashed #ccc; position:relative; z-index:1; margin-bottom:10px; border-radius:3px; -moz-border-radius:3px; -webkit-border-radius:3px; }
.flu_dropzone.in, .flu_dropzone.hover{border-color:#3b76a8; }
.flu_dopzone_text{font-size:17px; text-align:center; padding:10px;  line-height:1.8}
.flu_dropzone_ico{display:inline-block;  margin-top:3px; vertical-align:top; border:3px solid #ccc; width:25px; height:25px;}
.flu_dropzone_ico:before{display:inline-block; content:''; vertical-align:top; border:3px solid #ccc; width:25px; height:25px; margin:-9px 0 0 -11px}
.flu_kloader_wrap{padding:10px; text-align:center;}
.flu_kloader{width:15px; height:15px; background:#fff url("/images/wait.gif") center no-repeat; display:inline-block;  border: 1px solid #545454; padding:10px; box-shadow:0 0 5px #7f7363; -moz-box-shadow:0 0 5px #7f7363; -webkit-box-shadow:0 0 5px #7f7363; border-radius:3px; -moz-border-radius:3px; -webkit-border-radius:3px;}


.fade{
opacity: 0;
transition: opacity 0.15s linear 0s;
}

.fade.in {opacity:1}
@-moz-keyframes progress-bar-stripes {
0% {
    background-position: 40px 0;
}
100% {
    background-position: 0 0;
}
}
.progress {
    background-color: #F5F5F5;
    border-radius: 4px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1) inset;
    height: 20px;
    overflow: hidden;
    margin-left:5px;
}

.template-upload .progress{width:150px}

.progress-extended{margin-left:5px;}

.progress-bar {
    background-color: #428BCA;
    box-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15) inset;
    color: #FFFFFF;
    float: left;
    font-size: 12px;
    height: 100%;
    line-height: 20px;
    text-align: center;
    transition: width 0.6s ease 0s;
    width: 0;
}
.progress-striped .progress-bar {
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, rgba(0, 0, 0, 0) 25%, rgba(0, 0, 0, 0) 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, 0));
    background-size: 40px 40px;
}
.progress.active .progress-bar {
    animation: 2s linear 0s normal none infinite progress-bar-stripes;
}
.progress-bar-success {
    background-color: #5CB85C;
}
.progress-striped .progress-bar-success {
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, rgba(0, 0, 0, 0) 25%, rgba(0, 0, 0, 0) 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, 0));
}
.progress-bar-info {
    background-color: #5BC0DE;
}
.progress-striped .progress-bar-info {
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, rgba(0, 0, 0, 0) 25%, rgba(0, 0, 0, 0) 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, 0));
}
.progress-bar-warning {
    background-color: #F0AD4E;
}
.progress-striped .progress-bar-warning {
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, rgba(0, 0, 0, 0) 25%, rgba(0, 0, 0, 0) 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, 0));
}
.progress-bar-danger {
    background-color: #D9534F;
}
.progress-striped .progress-bar-danger {
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, rgba(0, 0, 0, 0) 25%, rgba(0, 0, 0, 0) 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, 0));
}


@media (max-width: 767px) {
.fileupload-buttonbar .toggle,.files .toggle,.files .btn span {display: none;}
.files .name {width: 80px;word-wrap: break-word;}
.files audio,.files video {max-width: 80px;}
.files img,.files canvas {max-width: 100%;}
}