﻿
/* webuploader-container */
.webuploader-container { position: relative; }
.webuploader-element-invisible { position: absolute !important; clip: rect(1px 1px 1px 1px); /* IE6, IE7 */ clip: rect(1px,1px,1px,1px); }
.webuploader-pick { float:left;border: 1px solid #dcdcdc; background:#f5f5f5; padding: 10px 15px; color: #666; position: relative; display: inline-block; cursor: pointer;  margin-top:10px;margin-right:10px;   text-align: center; border-radius: 1px; overflow: hidden; }
.webuploader-pick-disable { opacity: 0.6; pointer-events: none; }



/* webuploader_form   */
.webuploader_form .thumbnail { width: 60px;height:60px; }
.webuploader_form .thumbnail img { width: 100%; }
.webuploader_form .uploader-list { width: 100%; overflow: hidden; }
.webuploader_form .file-item { float: left; position: relative; margin:10px 10px 10px 0; padding: 0; border: 1px solid #dcdcdc; background: #f8f8f8; text-align: center; }
.webuploader_form .file-item.media{background-image:url(../img/media.png); background-repeat:no-repeat; background-position:center; }
.webuploader_form .file-item span{font-size:13px;}
.webuploader_form .file-item .error { position: absolute; top: 4px; left: 4px; right: 4px; background: red; color: white; text-align: center; height: 20px; font-size: 12px; line-height: 23px; }
.webuploader_form .file-item .info { position: absolute; left: 0; bottom: 0; right: 0; height: 20px; line-height: 20px; text-indent: 5px; background: rgba(0, 0, 0, 0.6); color: white; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: 12px; z-index: 10; }
.webuploader_form .file-item.upload-state-done .info { background: url(../img/success.png) no-repeat right center; color: #fff; }
.webuploader_form .upload-state-done:after { content: ""; font-style: normal; font-weight: normal; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-size: 12px; position: absolute; bottom: 10px; right: 10px; color: #4cae4c; z-index: 99; }
.webuploader_form .file-item .progress { position: absolute; right: 4px; bottom: 4px; height: 3px; left: 4px; height: 4px; overflow: hidden; z-index: 15; margin: 0; padding: 0; border-radius: 0; background: transparent; }
.webuploader_form .file-item .progress span { display: block; overflow: hidden; width: 0; height: 100%; background: rgba(0,128,255,0.2); -webit-transition: width 200ms linear; -moz-transition: width 200ms linear; -o-transition: width 200ms linear; -ms-transition: width 200ms linear; transition: width 200ms linear; -webkit-animation: progressmove 2s linear infinite; -moz-animation: progressmove 2s linear infinite; -o-animation: progressmove 2s linear infinite; -ms-animation: progressmove 2s linear infinite; animation: progressmove 2s linear infinite; -webkit-transform: translateZ(0); }
.webuploader_form .file-item.media-icon a{display:block;height:100px;background:url(/plug/webuploader/img/media.png);background-position:center 70% ;background-repeat:no-repeat;}

@-webkit-keyframes progressmove {
    0% { background-position: 0 0; }
    100% { background-position: 17px 0; }
}

@-moz-keyframes progressmove {
    0% { background-position: 0 0; }
    100% { background-position: 17px 0; }
}

@keyframes progressmove {
    0% { background-position: 0 0; }
    100% { background-position: 17px 0; }
}
