.imageBox{position:relative;width:100%;background:rgba(255,255,255,.5);overflow:hidden;background-repeat:no-repeat;cursor:move}.imageBox .thumbBox{position:absolute;top:50%;left:50%;width:200px;height:200px;margin-top:-100px;margin-left:-100px;box-sizing:border-box;border-radius:3px;box-shadow:0 0 0 1000px rgba(255,255,255,.5);background:none repeat scroll 0 0 transparent;border:3px solid rgba(000,000,000,.5);z-index:1}@keyframes blink{0%{opacity:1}50%{opacity:0}100%{opacity:1}}@-webkit-keyframes blink{0%{opacity:1}50%{opacity:0}100%{opacity:1}}.none_001{-moz-transition:all .5s ease-in-out;-webkit-transition:all .5s ease-in-out;-o-transition:all .5s ease-in-out;-ms-transition:all .5s ease-in-out;transition:all .5s ease-in-out;-moz-animation:blink normal 1.5s infinite ease-in-out;-webkit-animation:blink normal 1.5s infinite ease-in-out;-ms-animation:blink normal 1.5s infinite ease-in-out;animation:blink normal 1.5s infinite ease-in-out}.imageBox .spinner{background:#428bca none repeat scroll 0 0;border-radius:1px;bottom:0;height:0;left:0;position:absolute;right:0;width:100%;z-index:1;-webkit-transition:height .6s ease;-moz-transition:height .6s ease;-o-transition:height .6s ease;transition:height .6s ease}.container{position:absolute;top:10%;left:10%;right:0;bottom:0}.action{background:#fff none repeat scroll 0 0;height:100%;padding:0 1em 0 1em;width:100%}.action .button{width:100%;text-align:center}.cropped>img{margin-right:10px}.smalll{position:fixed;left:0;top:0;width:20%;margin-right:1em}.smalll input{width:30%;margin-right:1%}.smalll input:first-of-type{margin-right:0}.croppable{box-shadow:none;background:0 0}.croppable article{margin-bottom:0;margin-bottom:0;background:0 0;padding:0}.croppable article form{padding:1rem}.imageBox:after,.imageBox:before{position:absolute;height:100%;content:'';display:block;top:0;bottom:0;width:20%;z-index:2;background:red}.imageBox:after{right:0;background:linear-gradient(to right,rgba(255,255,255,0) 0,#fff 100%)}.imageBox:before{left:0;background:linear-gradient(to right,#fff 0,rgba(255,255,255,0) 100%)}.imageBox{height:0;-webkit-transition:height .2s;-moz-transition:height .2s;transition:height .2s}.imageBox.active_selection{height:300px;-webkit-transition:height .2s;-moz-transition:height .2s;transition:height .2s}.cropped{position:fixed;bottom:0;left:0}.cropped img{border:1px solid #ddd;width:100px}.croppable .uploader_mask{width:100%;text-align:center;cursor:pointer}.croppable form.active_form{display:none}.ghost{position:absolute;border:2px solid red;z-index:5}.ghast{position:absolute;border:2px solid green;z-index:5}.g_top{width:20px;height:5px}.g_bottom{width:20px;height:5px}.g_left{height:20px;width:5px}.g_right{height:20px;width:5px}.g_bottom,.g_left,.g_right,.g_top{position:absolute;background:#00f;z-index:5}.ray{height:2px;background:orange;position:absolute;z-index:5}.imageBox .g_bottom,.imageBox .g_left,.imageBox .g_right,.imageBox .g_top,.imageBox .ghast,.imageBox .ghost{display:none}.imageBox.debug .g_bottom,.imageBox.debug .g_left,.imageBox.debug .g_right,.imageBox.debug .g_top,.imageBox.debug .ghast,.imageBox.debug .ghost{display:block}.active_selection .img_original{opacity:0;-webkit-animation:fadein 2s;-moz-animation:fadein 2s;-ms-animation:fadein 2s;-o-animation:fadein 2s;animation:fadein 2s;-webkit-animation-fill-mode:forwards;-moz-animation-fill-mode:forwards;animation-fill-mode:forwards}.imageBox .img_original{position:absolute;z-index:0;max-width:none!important;max-height:none!important;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;border-radius:2px}@keyframes fadein{from{opacity:0}to{opacity:1}}@-moz-keyframes fadein{from{opacity:0}to{opacity:1}}@-webkit-keyframes fadein{from{opacity:0}to{opacity:1}}@-ms-keyframes fadein{from{opacity:0}to{opacity:1}}@-o-keyframes fadein{from{opacity:0}to{opacity:1}}
.common{position:absolute;bottom:10px;border:1px solid #000;height:28px;z-index:5000}.cursor{cursor:-webkit-grab;cursor:-moz-grab}.drag_cursor{cursor:move}.viewer{width:50%;height:300px;border:1px solid #000;position:relative}.wrapper{overflow:hidden}.ui_view_controls{position:absolute;top:0;left:0;z-index:10;padding:1em 0 0 1em;height:100%;width:15%;max-width:7rem}.ui_view_controls .btn{text-align:center;float:left;clear:both;line-height:1.6rem;height:2.8rem;width:100%;margin-bottom:.5rem}.ui_view_controls .btn:last-of-type{margin-bottom:0}.zoom_in{cursor:-webkit-zoom-in;cursor:-moz-zoom-in}.zoom_out{cursor:-webkit-zoom-out;cursor:-moz-zoom-out}.zoom_zero{cursor:nesw-resize}.ui_view_controls .zoom_in{margin-right:.5rem}.ui_view_controls .zoom_in,.ui_view_controls .zoom_out{width:calc(50% - .25rem);clear:none;text-align:center;padding:.5em 0}