div{
}
#card_editor{
    background:#e0e0e0;
    min-height:450px;
    overflow:hidden;
    position:relative;
    border-radius:6px; 
    -webkit-border-radius:6px; 
    -moz-border-radius:5px; 
    -khtml-border-radius:10px;
	display:none;
}
#dialog{

}
#toolbox{
    float:left;
    width:160px;
    min-height:450px;
    margin:30px;
    border:3px solid #d7d7d7;
    background:#fff;
    padding-top:10px;
    border-radius:6px; 
    -webkit-border-radius:6px; 
    -moz-border-radius:5px; 
    -khtml-border-radius:10px;
    overflow:hidden;
}
#toolbox .button{
    cursor:pointer;
    padding:2px;
    margin:3px 1px 3px 1px;
    background:#efefef;
    overflow:hidden;
    font:10px Verdana;
    line-height:21px;
}
#toolbox .button img{
    display:block;
    float:left;
    margin-left:5px;
    margin-right:3px;
}
#topbox{
    float:left;
    width:auto;
    height:20px;
    right:0px;
    position:absolute;
    left:200px;
}

/* the overlayed element */
.wnd, .font_wnd {
 
    /* must be initially hidden */
    display:none;
 
    /* place overlay on top of other elements */
    z-index:10000;
 
    /* styling */
    background-color:#fff;
 
    width:675px;
    min-height:200px;
    border:2px solid #999;
 
    /* CSS3 styling for latest browsers */
    -moz-box-shadow:3px 3px 5px 5px #777;
    -webkit-box-shadow: 3px 3px 5px #777;
    border-radius:6px; 
    -webkit-border-radius:6px; 
    -moz-border-radius:5px; 
    -khtml-border-radius:10px;
}
.font_wnd{
    overflow:auto;
    width:300px !important;
    height:400px;
}
.themes{
    margin:8px;    
    border:2px solid #999;
    width:130px;
    border-radius:4px; 
    -webkit-border-radius:4px; 
    -moz-border-radius:4px; 
    -khtml-border-radius:4px;
    float:left;
} 
.items{
    margin:5px;
    width:354px;
    overflow:hidden;
    float:left;
}
.items img{
    display:block;
    border-radius:4px; 
    -webkit-border-radius:4px; 
    -moz-border-radius:4px; 
    -khtml-border-radius:4px;
    border:3px solid #d7d7d7;
    float:left;
    margin:3px;
    height:74px;
    width:74px;
}
/* close button positioned on upper right corner */
.wnd .close, .font_wnd .close {
    background-image:url(../images/close.png);
    position:absolute;
    right:7px;
    top:3px;
    cursor:pointer;
    height:20px;
    width:20px;
}
.theme_layout{
    display:none;
}
.item{
    cursor:pointer;
}
.themes .item{
    color:#444;
    font:14px Verdana;
    margin:3px;
    border-bottom:1px solid #999;
    padding:3px 0 3px 0;
}
.themes .header{
    text-align:center;
    color:#444;
    font:14px Verdana;
    border-bottom:2px solid #999;
    padding:3px;
}
.preview_box {
    width:100px;
    height:130px;
    border:2px solid #000;
    margin:0 auto;
    display:block;
}
.preview{
    float:left;
    width:150px;
    margin:8px 0 0 0;
}
.just_button{
    padding:2px;
    margin:10px auto;
    cursor:pointer;
    background:#f60;
    border-radius:4px; 
    -webkit-border-radius:4px; 
    -moz-border-radius:4px; 
    -khtml-border-radius:4px;
    color:#fff;
    font:bold 11px sans-serif;
    text-align:center;
}
.wnd .title{
    color:#ff7112;
    font:14px Verdana;
    padding:6px 0 2px 6px;
    border-bottom:1px solid #d7d7d7;
}
#layer_list_front, #layer_list_back{
    list-style:none; 
    display:block;
    border:1px solid #222;
    padding:2px;
    margin:10px;
    overflow:auto;
    height:100px;
}
#layer_list_back{display:none;}
#layer_list_front li, #layer_list_back li{
    cursor:pointer;
    font:10px Verdana;
    color:#444;
    clear:both;
}
#layer_list_front li.selected, #layer_list_back li.selected{
    background:#d7d7d7;
    border:1px solid #444;
}
.layer_item div{
    float:right;
}
.layer{
    position:absolute;
    cursor:default;
}
.layer img{
    display:block;
    margin:0;
    width:100%;
    height:100%;
}
.frame{
    display:none;
    border:1px solid #f60;
    z-index:1000;
    position:absolute;
}
#card_front, #card_back{
    position:relative;
    overflow:hidden;
}
#card_back{
    display:none;
}
.drag_button{
    background:url(../images/move.jpg);
    width:17px;
    height:17px;
    position:absolute;
    top:-15px;
    left:3px;
    cursor:move;
}
.scale_button{
    background:url(../images/scale.png);
    width:16px;
    height:16px;
    position:absolute;
    right:-8px;
    bottom:-8px;
    cursor:se-resize;
}
.editor{
    display:none;
    padding:5px;
}
.mirror img{
    -moz-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
    filter: FlipH;
    -ms-filter: "FlipH";
}
.mirror_normal{
    width:20px;
    height:20px;
    background:#e0e0e0;
    border:1px solid #444;
    float:right;
    background:#e0e0e0;
}
.mirror_reflection{
    width:20px;
    height:20px;
    background:#e0e0e0;
    border:1px solid #444;
    float:right;
    background:#e0e0e0;
    margin-right:4px;
}
.unselected_mirror img{
	width: 100%; 
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
	filter: alpha(opacity=50);
	-moz-opacity:0.5;
	-khtml-opacity: 0.5;
	opacity: 0.5;
}
.editor_line{
    color:#a2a2a2;
    font:bold 11px sans-serif;
    line-height:24px;
    clear:both;
    margin:10px;
}
.editor_line .input{
    float:right;
    width:48px;
}
.editor_line input{
    width:28px !important;
    height:20px;
    border:1px solid #444;
}
.ui-spinner {position: absolute; border: 0px solid white;}
.ui-spinner-buttons {position: absolute;}
.ui-spinner-button {overflow: hidden;}
.editor textarea{
    border:1px solid #444;
    resize:none;
    margin:0 auto;
    display:block;
    width:138px;
    font:10px sans-serif;
    color:#444;
    height:50px;
    overflow:auto;
}
.fontselect{
    height:20px;
    border:1px solid #444;
    color:#444;
    text-align:center;
    padding:2px;
    cursor:pointer;
}
.fontcase{
    margin:5px;
    padding:5px;
    clear:both;
    font-size:14px;
    cursor:pointer;
    border:1px solid #fff;
}
.fontcase:hover{
    border:1px solid #999;
}
.fontlist{
    overflow:auto;
    margin-top:30px;
    height:370px;
}
.colorlist{
	overflow:hidden;
}
.color{
	border:1px solid #000;
	cursor:pointer;
	float:left;
	margin:2px;
	width:20px;
	height:8px;
}
.progressbar{
	display:none;
	margin:20px auto;
	border-radius:4px; 
    -webkit-border-radius:4px; 
    -moz-border-radius:4px; 
    -khtml-border-radius:4px;
	border:1px solid #444;
	width:120px;
	height:4px;
}
.progress{
	width:0px;
	height:100%;
	background:#0f3;
}
.top_button{
    float:right;
	border-radius:3px; 
    -webkit-border-radius:3px; 
    -moz-border-radius:3px; 
    -khtml-border-radius:3px;
    background:#676767;
    color:#fff;
    padding:2px 10px 2px 10px;
    margin:10px;
    cursor:pointer;
    font:12px sans-serif;
}