html,body{height:100%}body{margin:0;overflow:hidden;}ul,li{list-style:none;margin:0;padding:0}.ui-btn{display:inline-block;width:78px;height:28px;background:-webkit-gradient(linear,left top, left bottom, from(#FFF), to(#F8F8F8));border:1px solid #D9D9D9;border-radius:2px;color:#5386BE;line-height:28px;text-align:center;font-size:12px;font-weight:bold;cursor:pointer;box-shadow:0 0 1px #FDFDFD inset}.btn-container{padding-bottom:15px}.container{position:absolute;left:0;right:0;top:0;bottom:0;margin:auto;width:620px;height:360px;padding:10px;border:1px solid #EEE;box-shadow:1px 1px 5px rgba(0, 0, 0, .1)}.clip-container{display:table-cell;text-align:center;vertical-align:middle;position:relative;width:491px;height:233px;border:1px solid #E9F2FA}.clip-content{display:inline-block;position:relative;overflow:hidden}.clip-area{display:inline-block;background:#000}.clip-rect{position:absolute;top:0;left:0}.clip-img{max-width:491px;max-height:233px;opacity:.5;vertical-align:bottom}.clip-box{display:none;position:absolute;left:0;top:0;z-index:99;border:1px solid #0a7cca;cursor:move}.clip-box.down{cursor:move}.clip-box span{position:absolute;width:4px;height:4px;border-style:solid;border-color:transparent;background-color:#0a7cca;background-clip:content-box}.clip-box span.resizable-nw{left:-4px;top:-4px;border-width:1px;cursor:nw-resize}.clip-box span.resizable-n{left:50%;top:-3px;margin-left:-4px;border-width:0 2px;cursor:n-resize}.clip-box span.resizable-ne{right:-4px;top:-4px;border-width:1px;cursor:ne-resize}.clip-box span.resizable-w{left:-3px;top:50%;margin-top:-4px;border-width:2px 0;cursor:w-resize}.clip-box span.resizable-e{right:-3px;top:50%;margin-top:-4px;border-width:2px 0;cursor:e-resize;}.clip-box span.resizable-sw{left:-4px;bottom:-4px;border-width:1px;cursor:sw-resize}.clip-box span.resizable-s{left:50%;bottom:-3px;margin-left:-4px;border-width:0 2px;cursor:s-resize}.clip-box span.resizable-se{right:-4px;bottom:-4px;border-width:1px;cursor:se-resize}.clip-box i{position:absolute;border:0 dashed #c8c8c8}.clip-box.down i{opacity:.8}.clip-box i:nth-of-type(1){left:0;top:33%;width:100%;border-bottom-width:1px}.clip-box i:nth-of-type(2){left:0;top:66%;width:100%;border-bottom-width:1px}.clip-box i:nth-of-type(3){top:0;left:33%;height:100%;border-right-width:1px}.clip-box i:nth-of-type(4){top:0;left:66%;height:100%;border-right-width:1px}.thumb-container{padding:15px 0 0 15px}.thumb-container li{float:left;height:66px;padding:0 5px;text-align:center}.thumb-container div{width:40px;height:40px;padding:1px;border:1px solid #b1bac5;border-radius:2px;box-shadow:0 0 3px rgba(0, 0, 0, .5)}.thumb-container div.on{border:1px solid #0ab1ff;box-shadow:inset 0 0 0 1px #45c4ff, 0 0 2px #0ab1ff}.thumb-container span{font-size:12px}.preview-container{position:absolute;top:55px;right:10px;width:116px;height:200px;text-align:center}.preview-box{display:inline-block;width:100px;height:100px;border:1px solid #b0bac3;border-radius:2px;box-shadow:0 0 2px #b0bac3}.preview-container a{display:inline-block;margin-top:10px;font-size:12px;color:#808080;text-decoration:none;cursor:default}.preview-container a.hashd{color:#0ab1ff;cursor:pointer}