#progress-wrp { border:1px solid #0099CC; padding:1px; position:relative; height:30px; border-radius:3px; margin:20px; display:none; text-align:left; background:#fff; box-shadow:inset 1px 3px 6px rgba(0, 0, 0, 0.12); } #progress-wrp .progress-bar { height:100%; border-radius:3px; background-color:#bddaff; width:0; box-shadow:inset 1px 1px 10px rgba(0, 0, 0, 0.11); } #progress-wrp .status { top:6px; left:45%; position:absolute; display:inline-block; color:#000000; } #dl-wrp { border:1px solid #000; padding:20px; margin:5px; background-color:#fff; text-align:center; min-height:170px; } #progress-wrp{ display:none; } #dl-wrp.is-dragover { background-color:#ddd; } .dl-panel input { display:none; } .get-file { display:inline-block; border:1px dotted; padding:10px; margin:20px; } .dl-btn { margin:20px; } .fileList{ min-height:30px; } .f-name { display:inline-block; border:1px solid #000; padding:2px 5px; margin:2px; border-radius:20px; } #btnDlProgres { display:inline-block; min-width:45px; } .btn.dl-oki { background-color:#4ac140; border-color:#3f9d37; } .btn.dl-oki:hover { background-image:linear-gradient(to bottom, transparent, #245720); } .file-block { margin:2px 0; padding:1px; } .file { display:flex; margin:2px 0; padding:2px 20px 2px 2px; border:1px solid #6a6a6a; position:relative; } .file .dl-label { } .file .file-name { padding:0 2px; } .dl-label, .dl-del-block { position:absolute; right:1px; top:1px; } .file.error { color:#ab1814; }  .dl-del b {display:none; margin-right:5px;} .dl-del i {padding:0 4px 0 2px;} .dl-del.confirm b {display:inline-block;} .file-label-date { font-size:0.7em; display:inline-block; margin:0 5px; } .dl-panel {width:400px} .blury {filter:blur(5px);} .spinner { margin:0; width:50px; text-align:center; display:inline-block; } .spinner > div { width:15px; height:15px; background-color:rgb(0, 0, 0); border-radius:100%; display:inline-block; -webkit-animation:sk-bouncedelay 1.4s infinite ease-in-out both; animation:sk-bouncedelay 1.4s infinite ease-in-out both; } .spinner .bounce1 { -webkit-animation-delay:-0.32s; animation-delay:-0.32s; } .spinner .bounce2 { -webkit-animation-delay:-0.16s; animation-delay:-0.16s; } @-webkit-keyframes sk-bouncedelay { 0%, 80%, 100% { -webkit-transform:scale(0) } 40% { -webkit-transform:scale(1.0) } } @keyframes sk-bouncedelay { 0%, 80%, 100% { -webkit-transform:scale(0); transform:scale(0); } 40% { -webkit-transform:scale(1.0); transform:scale(1.0); } } .fa-exclamation-circle:before { content:"\f06a"; } .fa-check:before { content:"\f00c"; } .fa-window-close:before { content:"\f2d3"; }