#canvas {background-color:#fafafa;}

#canvas-raw {position:absolute; top:-2000px;}
#canvas-merged {position:absolute; top:-2000px;}
#canvas-thumbnail {position:absolute; top:-2000px;}

div#container {position:relative; border:10px solid #888; border-radius:10px; height:554px; width:893px; background-color:#3F4045; font-family:verdana; overflow:hidden; margin:0 auto;}
div#version {position:absolute; top:538px; left:862px; color:#555; z-index:10; font-size:9px;}
div#loading-layer {position:absolute; top:0px; left:0px; z-index:99999; height:289px; width:888px; background-color:rgba(255,255,255,0.9); padding-top:265px; color:#000; font-size:10px; text-align:center; background-image:url('../img/loading.gif'); background-repeat:no-repeat; background-position:center 70px; display:block;}
div#suspended-layer {position:absolute; top:0px; left:0px; z-index:99999; height:289px; width:894px; background-color:rgba(255,255,255,0.9); padding-top:265px; color:#BB2E2E; font-size:14px; text-align:center; display:block;}

table#error-table {height:100%; width:100%; border:0; margin:0; padding:0;}
table#error-table td {height:100%; width:100%; vertical-align:middle; text-align:center; color:#333; font-size:13px;}

#image-cache {position:absolute; top:-2000px; height:100px; width:100px; overflow:hidden;}
#image-cache img {position:absolute; top:0px; left:0px;}

div#toolbar {position:absolute; top:0px; left:0px; padding:3px 0; z-index:103; width:31px; height:548px; background-color:#bbb; border-right:1px solid #aaa;}
div#toolbar-cover {position:absolute; top:0px; left:0px; width:31px; height:554px; background-color:#fff; z-index:10; opacity:0.6; display:block;}
div#toolbar-download-cover {position:absolute; top:494px; left:0px; width:31px; height:60px; background-color:#fff; z-index:9999; opacity:0.6; display:block;}
div#toolbar div#tool-title {height:31px; width:31px; background-image:url('../img/tool-icons.png'); background-repeat:no-repeat; background-position:0 -64px;}
div#toolbar div.tool-divider {height:1px; background-color:#ccc; margin:5px 3px;}
div#toolbar div.tool {position:relative; margin-bottom:5px;}
div#toolbar div.tool-icon {height:31px; width:31px; background-image:url('../img/tool-icons.png'); cursor:pointer; background-repeat:no-repeat;}
div#toolbar div.tool-icon:HOVER {background-color:#aaa;}
div#toolbar div.tool-options-panel {position:absolute; top:-4px; left:30px; display:none;}
div#toolbar div.tool-options-panel-open {display:block;}
div#toolbar div.tool-options-panel img {z-index:104; float:left; padding-top:9px;}
div#toolbar div.tool-options {display:block; margin-left:8px; padding:5px; border:1px solid #aaa; background-color:#ddd; white-space:nowrap; z-index:103;}
div#toolbar div.tool-option {height:31px; cursor:pointer; line-height:31px; vertical-align:top; font-size:12px; padding:1px 5px 1px 0; position:relative; padding-right:40px;}
div#toolbar div.tool-option-overlay {height:31px; display:block; position:absolute; top:0; left:0; width:100%;}
div#toolbar div.tool-option:HOVER {background-color:#ccc;}
div#toolbar div.tool-option-icon {height:31px; width:31px; padding-right:2px; display:inline-block; float:left; background-image:url('../img/tool-icons.png'); background-repeat:no-repeat;}

div#toolbar div#tool-grid div.tool-icon {background-position:0 0;}
div#toolbar div#tool-grid-off div.tool-option-icon {background-position:-32px 0;}
div#toolbar div#tool-grid-5 div.tool-option-icon {background-position:-32px -32px;}
div#toolbar div#tool-grid-10 div.tool-option-icon {background-position:-32px -64px;}

div#toolbar div#tool-bright div.tool-icon {background-position:-64px 0;}
div#toolbar div#tool-bright-up div.tool-option-icon {background-position:-64px -32px;}
div#toolbar div#tool-bright-down div.tool-option-icon {background-position:-64px -64px;}

div#toolbar div#tool-contrast div.tool-icon {background-position:-64px 0;}
div#toolbar div#tool-contrast-up div.tool-option-icon {background-position:-64px -32px;}
div#toolbar div#tool-contrast-down div.tool-option-icon {background-position:-64px -64px;}

div#toolbar div#tool-sharp div.tool-icon {background-position:-128px 0;}
div#toolbar div#tool-sharpen div.tool-option-icon {background-position:-128px -32px;}
div#toolbar div#tool-blur div.tool-option-icon {background-position:-128px -64px;}
div#toolbar div#tool-reset div.tool-option-icon {background-position:0 -32px;}

div#toolbar div#tool-download {margin-top:354px; position:relative; z-index:11;}
div#toolbar div#tool-download div.tool-icon {background-position:-160px 0;}
div#toolbar div#tool-download div.tool-options-panel {top:-45px;}
div#toolbar div#tool-download div.tool-options-panel img {padding-top:50px;}
div#toolbar div#tool-save-raw div.tool-option-icon {background-position:-160px -32px;}
div#toolbar div#tool-save-merged div.tool-option-icon {background-position:-160px -64px;}

div#toolbar div#tool-download.static div.tool-options-panel {top:-12px;}
div#toolbar div#tool-download.static div#tool-save-raw {display:none;}
div#toolbar div#tool-download.static div.tool-options-panel img {padding-top:16px;}

div#working-area {position:absolute; top:-3px; left:29px; padding:10px; z-index:100;}
div#working-area-grid {position:absolute; top:10px; left:10px; height:480px; width:640px; display:block; z-index:101; opacity:0.6;}
div#working-area-grid.grid5 {background-image:url('../img/grid5.png');}
div#working-area-grid.grid10 {background-image:url('../img/grid10.png');}
div#working-area-overlay {position:absolute; top:10px; left:10px; height:480px; width:640px; display:block; z-index:102;}
div#working-area-overlay img {height:480px; width:640px; position:absolute; top:0; left:0;}

div#working-area-delete, div#working-area-reset {position:absolute; top:10px; left:549px; height:20px; width:100px; display:block; background-color:#fff; opacity:0.6; color:#333; line-height:20px; font-size:12px; text-align:center; z-index:103; cursor:pointer; display:none;}
div#working-area-reset {left:594px; width:50px; padding-left:3px;}
div#working-area-delete:HOVER, div#working-area-reset:HOVER {opacity:0.9; background-color:red; color:#fff;}

div#controls {position:absolute; top:494px; left:31px; height:60px; width:868px; background-color:#fff; z-index:101;}

div#controls-cover-1, div#controls-cover-4 {position:absolute; top:0px; left:0px; height:60px; width:165px; background-color:#fff; z-index:10; opacity:0.6; display:block;}
div#controls-cover-2 {position:absolute; top:0px; left:165px; height:60px; width:500px; background-color:#fff; z-index:10; opacity:0.6; display:block;}
div#controls-cover-3 {position:absolute; top:0px; left:669px; height:60px; width:160px; background-color:#fff; z-index:9999; opacity:0.6; display:block;}
div#controls-cover-4 {display:none;}

div#controls.photo-enabled div#controls-cover-1 {display:none;}
div#controls.controls-enabled div#controls-cover-2 {display:none;}
div#controls.save-enabled div#controls-cover-3 {display:none;}

div#controls-select {position:absolute; top:5px; left:0px;}
div#controls-zoom {position:absolute; top:5px; left:180px;}
div#controls-move {position:absolute; top:5px; left:306px;}
div#controls-rotate {position:absolute; top:5px; left:541px;}

div#controls-zoom div, div#controls-move div, div#controls-rotate div {background-image:url(../img/panel-icons3.png); float:left; height:50px; width:50px; cursor:pointer; margin-left:4px;}

div#controls-zoom-in {background-position:0 0;}
div#controls-zoom-in:HOVER {background-position:0 -50px;}
div#controls-zoom-in:ACTIVE {background-position:0 -100px;}
div#controls-zoom-out {background-position:-50px 0;}
div#controls-zoom-out:HOVER {background-position:-50px -50px;}
div#controls-zoom-out:ACTIVE {background-position:-50px -100px;}
div#controls-move-left {background-position:-100px 0;}
div#controls-move-left:HOVER {background-position:-100px -50px;}
div#controls-move-left:ACTIVE {background-position:-100px -100px;}
div#controls-move-up {background-position:-150px 0;}
div#controls-move-up:HOVER {background-position:-150px -50px;}
div#controls-move-up:ACTIVE {background-position:-150px -100px;}
div#controls-move-down {background-position:-200px 0;}
div#controls-move-down:HOVER {background-position:-200px -50px;}
div#controls-move-down:ACTIVE {background-position:-200px -100px;}
div#controls-move-right {background-position:-250px 0;}
div#controls-move-right:HOVER {background-position:-250px -50px;}
div#controls-move-right:ACTIVE {background-position:-250px -100px;}
div#controls-rotate-left {background-position:-300px 0;}
div#controls-rotate-left:HOVER {background-position:-300px -50px;}
div#controls-rotate-left:ACTIVE {background-position:-300px -100px;}
div#controls-rotate-right {background-position:-350px 0;}
div#controls-rotate-right:HOVER {background-position:-350px -50px;}
div#controls-rotate-right:ACTIVE {background-position:-350px -100px;}

div#controls-overlays {height:138px; width:861px; position:absolute; top:491px; left:32px; z-index:100; background-color:#fff; border-top:3px solid #3073AD;}
div#controls-overlays-inner {height:138px; overflow-x:auto; overflow-y:hidden; white-space:nowrap;}
div#controls-overlays .overlay-option {display:inline-block; margin-left:5px; margin-top:5px; overflow:hidden; height:120px; width:124px;}
div#controls-overlays .overlay-option:last-child {margin-right:5px;]} 
div#controls-overlays .overlay-option a {position:relative;}
div#controls-overlays .overlay-option img {width:120px; border:2px solid #aaa;}
div#controls-overlays .overlay-option img:HOVER {border-color:#5599D4;}
div#controls-overlays .overlay-option a.active img {border-color:#30AD3A;}
div#controls-overlays .overlay-option-name {text-align:center; font-size:12px;}
div#controls-overlays .overlay-option-active {display:none; background-color:#30AD3A; position:absolute; top:-2px; left:0; font-size:11px; color:#fff; padding:2px 4px; border-top:1px solid #30AD3A; border-top-right-radius:5px; border-right:1px solid #30AD3A; font-weight:bold; font-family:verdana;}
div#controls-overlays a.active .overlay-option-active {display:block;}
div#controls-overlays-tab {height:16px; line-height:16px; padding-right:10px; border-right:3px solid #3073AD; border-top:3px solid #3073AD; position:absolute; top:-19px; left:0px; background-color:#3073AD; color:#fff; font-weight:bold; font-size:12px; border-top-right-radius:10px; cursor:pointer; padding-left:3px;}
div#controls-overlays-tab:HOVER {background-color:#5599D4; border-color:#5599D4; color:#fff;}

div#template {position:absolute; top:0px; left:679px; height:45px; width:210px; padding-top:4px; font-size:11px; font-weight:bold; color:#333; text-align:center; line-height:28px; overflow:hidden; border:2px solid #3F4045; background-color:#eee;}
div#template span {display:block; font-size:10px; color:#999; line-height:10px;}
div#template A {font-size:10px; color:#485ac5; line-height:10px;}

div#template #activeContent {padding-top:6px;}
div#template #changeContent {display:none;}
div#template #changeContent select {padding:5px 10px; border:2px solid #888; border-radius:10px; width:182px; margin-top:3px;}

div#thumbnails {position:absolute; top:54px; left:686px; height:433px; width:208px; overflow-x:hidden; overflow-y:auto;}
div.thumbnail {float:left; height:60px; width:80px; margin:0 5px 5px 0; position:relative; cursor:pointer; border:4px solid #ddd;}
div.thumbnail:HOVER {border:4px solid #ccc;}
div.thumbnail-active {border:4px solid #00AA00;}
div.thumbnail-active:HOVER {border:4px solid #00AA00;}
div.mand-field {border:4px solid #AA0000;}
div.thumbnail div.caption {position:absolute; padding:5px 0; width:80px; bottom:0; background-color:rgba(0,0,0,0.4); text-align:center; font-size:12px; font-weight:bold; color:#fff;}
div.thumbnail div.thumbnail-mand {position:absolute; top:0; left:0; height:60px; width:80px; background-image:url(../img/icon_required.png); z-index:998;}
div.thumbnail div.thumbnail-loading {position:absolute; top:0; left:0; height:60px; width:80px; background-image:url(../img/loading.gif); background-position:-126px -133px; z-index:999; background-color:rgba(255,255,255,0.7); display:none;}

input#image_file {visibility:hidden; width:0; height:0;}
button#fileSelect {background-image:url(../img/select3.png); background-position:0 0; height:50px; width:144px; margin:0; padding:0; border:0; cursor:pointer; margin-left:7px;}
button#fileSelect:HOVER {background-position:0 -50px;}
button#fileSelect:ACTIVE {background-position:0 -100px;}

div#controls-save {position:absolute; top:5px; left:682px; background-image:url(../img/save3.png); height:50px; width:144px; cursor:pointer;}
div#controls-save:HOVER {background-position:0 -50px;}
div#controls-save:ACTIVE {background-position:0 -100px;}

div#textzone-container {position:absolute; z-index:105;}
div#textzone-container div.edit {position:absolute; cursor:pointer;}
div#textzone-container div.edit input {display:none; border:0; padding:0; margin:0;}
div#textzone-container canvas {display:none;}