#edit_tab #canvasAreaDesigner {
    width    : 100%;
    height   : 100%;
    position : relative;
    top      : 0;
    overflow : hidden;
    display  : block;
}

#edit_tab #canvasAreaDesigner .area_content {
    display  : block;
    height   : 100%;
    margin   : 0 auto;
    position : relative;
    padding  : 0;
    top      : 0%;
    overflow : hidden;
}

#edit_tab #canvasAreaDesigner .droppable {
    display           : block;
    position          : absolute;
    left              : 50%;
    top               : 50%;
    -webkit-transform : translate(-50%, -50%); -moz-transform : translate(-50%, -50%); -ms-transform : translate(-50%, -50%); -o-transform : translate(-50%, -50%); transform : translate(-50%, -50%);
}

#preview_tab .magnify {
    display   : inline-block;
    position  : relative;
    position  : absolute;
    left      : 50%;
    top       : 50%;
    transform : translate(-50%, -50%);

}

#canvasAreaPreview {
    padding-bottom : 102px;
}

#preview_tab .magnify img.small {
    max-width  : 100%;
    max-height : 600px;
}

#preview_tab .magnify .large {
    width                 : 300px;
    height                : 300px;
    position              : absolute !important;
    border-radius         : 100%;
    -moz-border-radius    : 100%;
    -webkit-border-radius : 100%;
    box-shadow            : 0 0 0 7px rgba(255, 255, 255, 0.85), 0 0 7px 7px rgba(0, 0, 0, 0.25), inset 0 0 40px 2px rgba(0, 0, 0, 0.25);
    -moz-box-shadow       : 0 0 0 7px rgba(255, 255, 255, 0.85), 0 0 7px 7px rgba(0, 0, 0, 0.25), inset 0 0 40px 2px rgba(0, 0, 0, 0.25);
    -webkit-box-shadow    : 0 0 0 7px rgba(255, 255, 255, 0.85), 0 0 7px 7px rgba(0, 0, 0, 0.25), inset 0 0 40px 2px rgba(0, 0, 0, 0.25);
    display               : none;
}

.droppable .tempCanvas {
    width    : 1px;
    height   : 1px;
    overflow : hidden;
    position : absolute;
    margin   : 0px auto;
}
.droppable .tempCanvasInitialy {
    width    : 1px;
    height   : 1px;
    overflow : hidden;
    position : absolute;
    margin   : 0px auto;
}

.loader_canvas {
    background          : url('../default/images/designer_loading.gif');
    position            : absolute;
    /* top: 40%; */
    /* left: 46%; */
    width               : 70px;
    height              : 70px;
    background-size     : inherit;
    -webkit-transition  : opacity 0.1s ease;
    -moz-transition     : opacity 0.1s ease;
    -ms-transition      : opacity 0.1s ease;
    -o-transition       : opacity 0.1s ease;
    transition          : opacity 0.1s ease;
    opacity             : 1;
    background-repeat   : no-repeat;
    background-position : center;
    width               : 100%;
    height              : 100%;
}


.droppable .canvas-container {
    opacity : 0;
}

body.loading_canvas .droppable .canvas-container {
    -webkit-transition : opacity 0.1s ease;
    -moz-transition    : opacity 0.1s ease;
    -ms-transition     : opacity 0.1s ease;
    -o-transition      : opacity 0.1s ease;
    transition         : opacity 0.1s ease;

    opacity            : 1;
}

body.loading_canvas .loader_canvas {
    opacity : 0;
}

.scrollerContainer {
    opacity : 0;
}

body.loading_canvas .scrollerContainer {
    opacity : 1;
}

#tdIframe {
    position         : absolute;
    overflow         : hidden;
    background-color : #FFFFFF;
    display          : block;
    right            : 0;
    top              : 0;
    z-index          : 900;
    border           : 1px solid #CBCBCB;
}

#frame_3d {
    width    : 100%;
    height   : 100%;
    outline  : none;
    border   : none;
    margin   : 0 auto;
    display  : block;
    position : relative;

}

.canvas-container .canvas_snap_handlers_horizontal {
    height           : 0px;
    width            : 100%;
    top              : 0px;
    border-top-width : 0.8pt;
    border-top-style : dashed;
    border-top-color : #A06FDA;
    display          : none;
    position         : absolute;
    z-index          : 1000;
}

.canvas-container .canvas_snap_handlers_vertical {
    height             : 100%;
    width              : 0px;
    top                : 0px;
    border-right-width : 0.8pt;
    border-right-style : dashed;
    border-right-color : #A06FDA;
    display            : none;
    position           : absolute;
    z-index            : 1000;
}

/* rightClick ObjectSelect*/

#contextMenuCanvasRightClick {
    position           : absolute;
    left               : -1500px;
    top                : -1500px;
    -webkit-transition : max-height 0.3s ease;
    -moz-transition    : max-height 0.3s ease;
    -o-transition      : max-height 0.3s ease;
    transition         : max-height 0.3s ease;
    background-color   : #FFFFFF;
    border             : 1px solid rgba(0, 0, 0, 0.099);
    box-shadow         : 1px 1.732px 5px 0px rgba(0, 0, 0, 0.050);
    width              : 140px;
    z-index            : 999;
    max-height         : 0px;
    overflow           : hidden;
}

#contextMenuCanvasRightClick.notransition {
    -webkit-transition : none !important;
    -moz-transition    : none !important;
    -ms-transition     : none !important;
    -o-transition      : none !important;
    transition         : none !important;
}

#contextMenuCanvasRightClick .dropdown_menu_canvas {
    padding         : 0px;
    margin          : 0px;
    list-style-type : none;
    font-size       : 16px;
    color           : #384347;
    padding-top     : 10px;
    max-height      : 700px;
}

#contextMenuCanvasRightClick .dropdown_menu_canvas li {
    padding     : 10px 20px 0px 20px;
    display     : inline-block;
    line-height : 16px;
    cursor      : pointer;
}

#contextMenuCanvasRightClick .dropdown_menu_canvas li.current_object a, #contextMenuCanvasRightClick .dropdown_menu_canvas li a:hover {
    color : #33A0D6
}

#contextMenuCanvasRightClick .dropdown_menu_canvas li a {
    text-decoration : none;
    color           : #384347;
    width           : 100%;
    height          : 100%;
    display         : inline-block;
}

#contextMenuCanvasRightClick .dropdown_menu_canvas li.current_object span.icon {
    display : inline-block;
}

#contextMenuCanvasRightClick .dropdown_menu_canvas li span.icon {
    position    : relative;
    left        : 22px;
    font-size   : 12px;
    line-height : 16px;
    color       : #A6D73F;
    display     : none;
}

#contextMenuCanvasRightClick .dropdown_menu_canvas li span.border_pagination {
    width         : 100px;
    height        : 1px;
    border-bottom : 1px solid #C7C7C7;
    display       : inline-block;
    float         : left;
    padding-top   : 10px;
}

#contextMenuCanvasRightClick .dropdown_menu_canvas li:last-child span.border_pagination {
    visibility : hidden;
}

/*end*/

/*draggble li **/
li.ui-draggable.listItem a {
    background-size     : contain;
    display             : block;
    width               : 100%;
    height              : 100%;
    background-color    : none;
    background-repeat   : no-repeat;
    background-position : center center;
    text-decoration     : none;
    position            : relative;
    padding             : 0px;
}

li.ui-draggable.listItem {
    list-style : none;
    width      : 90px;
    height     : 90px;
    display    : block;
    margin     : 5px 0 5px 0;
    float      : left;
}

li.ui-draggable.listItem a .icon {
    display : none;
}

/*end*/

/**preview area**/
#mainContent #subcontent #preview_tab {
    position : relative;
    display  : none;
}

#mainContent #subcontent #preview_tab.active {
    display : block;
}

.pages-container {
    width    : 100%;
    height   : 100%;
    position : relative;
    overflow : auto;
    left     : 0;
    top      : 0;
}

#mainContent #subcontent .pages {
    display  : block;
    height   : 100%;
    margin   : 0 auto;
    position : relative;
    padding  : 0;
    overflow : hidden;
}

#mainContent #subcontent #preview_page {
    display      : inline-block;
    position     : initial;
    left         : 50%;
    top          : 50%;
    transition   : opacity 200ms ease;
    z-index      : 0;
    padding-left : 0px;
}

.confirm_options {
    text-align    : center;
    top           : 0px;
    position      : relative;
    margin-bottom : 20px;
    width         : 90%;
    left          : 5%;
    margin-top    : 20px;
}
.confirm_options  label{
    cursor:pointer;
}
#mainContent #subcontent .tab_pane {
    float : left;
}


/*end**/
.download_pdf_preview {
    width           : 100%;
    height          : 100%;
    line-height     : 20px;
    display         : inline-block;
    text-align      : center;
    text-decoration : none;
    color           : #2C9DD5;
    display         : table;
}

.download_pdf_group {
    width        : 37px;
    height       : 37px;
    font-size    : 16px;
    display      : block;
    border-right : none;
    margin       : 0 auto;
}

.download_pdf_group a span {
    line-height : 36px;
}

.checkbox_label:before {
    content          : "";
    display          : inline-block;
    width            : 20px;
    height           : 20px;
    vertical-align   : bottom;
    background-color : transparent;
    color            : #000000;
    text-align       : center;
    box-shadow       : inset 0px 0px 1px rgba(0, 0, 0, 0.5), 0px 1px 0px rgba(255, 255, 255, 0.2);
    border-radius    : 0px;
}

input[type=checkbox]:checked + .checkbox_label:before {
    content   : "\2714";
    font-size : 12px;
}

.checkbox_label a {
    font-size : 16px;
}

/**scrollerDesginer**/
.scrollerContainer {
    width    : 0px;
    height   : 0px;
    position : absolute;
    overflow : scroll;
    z-index  : 1;
}

/**end scrollerDesginer**/
.logoContainer div.small_logo.back_button,
.logoContainer div.large_logo.back_button {
    font-size   : 22px;
    text-align  : center;
    color       : #FFFFFF;
    line-height : 30px;
}

.logoContainer div.large_logo.back_button .title {
    display     : inline-block;
    font-size   : 16px;
    height      : auto;
    line-height : 30px;
    padding     : 0;
    position    : absolute;
    left        : 63px;
    width       : 98px;

}

.logoContainer div.large_logo.back_button {
    text-align   : left;
    padding-left : 8px;
}

/**scrollerDesginer**/
.scrollerContainer {
    width    : 0px;
    height   : 0px;
    position : absolute;
    overflow : scroll;
    z-index  : 1;
}

.scrollerContainer::-webkit-scrollbar {
    -webkit-appearance : none;
}

.scrollerContainer::-webkit-scrollbar:vertical {
    width : 11px;
}

.scrollerContainer::-webkit-scrollbar:horizontal {
    height : 11px;
}

.scrollerContainer::-webkit-scrollbar-thumb {
    border-radius    : 8px;
    border           : 2px solid white; /* should match background, can't be transparent */
    background-color : rgba(0, 0, 0, .5);
}

.scrollerContainer::-webkit-scrollbar-track {
    background-color : #FFFFFF;
    border-radius    : 8px;
}

/**end scrollerDesginer**/
/*center gallery*/

body.hide_toolbar aside.sidebar {
    left     : -60px;
    position : fixed;
    top      : 0px;
    z-index  : 1001;
}

body.expand.hide_toolbar aside.sidebar {
    left : 0px;
}

body.hide_toolbar .navbarTopLeft ul #close {
    display : none
}

body.hide_toolbar.expand #paginationContainer_Edit_Preview {
    position : relative;
    left     : 140px;
}

body.hide_toolbar #paginationContainer_Edit_Preview {
    position : relative;
    left     : 60px;

}

aside.sidebar ul.mainMenu li.mainItem.close_sidebar_group {
    display : none;
}

body.hide_toolbar aside.sidebar ul.mainMenu li.mainItem.close_sidebar_group {
    display : block;

}

aside.sidebar ul.mainMenu li.mainItem.close_sidebar_group a.mainTrigger div.icon {
    line-height : 24px;
}

.headerContainer {
    height   : 60px;
    position : fixed;
    top      : 0px;
    width    : 100%;
}

body.allow_header #editorTopbarContainer {
    top : 60px;
}

body.allow_header .container {
    padding-top : 120px;
}

body .wrapper_sidebar_gallery {
    display : none;
}

body.expand.hide_toolbar #mainContent #subcontent,
body.hide_toolbar #mainContent #subcontent,
body.expand.side-gallery-open.hide_toolbar .galleryContainer,
body.side-gallery-open.hide_toolbar .galleryContainer,
body.expand.hide_toolbar .galleryContainer,
body.hide_toolbar .galleryContainer {
    padding-left : 0px;
}

body.expand.hide_toolbar aside.sidebar ul.mainMenu {
    padding-top : 10px;
}

body.crosshair {
    cursor : crosshair !important;
}

/*end center gallery*/
body.hide_toolbar.allow_back .group.helper_group {
    bottom : 60px;
}

body.hide_toolbar .group.back_group {
    bottom   : 0px;
    position : absolute;
}

aside.sidebar ul.mainMenu li.mainItem.active.group.back_group a.mainTrigger div.icon.inactive {
    left : 0px;
}

.page_navigation {
    width     : 30px;
    height    : 30px;
    position  : absolute;
    font-size : 25px;
}

#preview_tab.tdpreview .page_navigation {
    display : none !important;
}

.page_navigation a {
    color           : #666666;
    width           : 100%;
    height          : 100%;
    display         : inline-block;
    text-decoration : none;
}

body.hide_toolbar #mainContent #subcontent {
    transition : none;
}


.page div.page_blocks div.blockBorder {
    z-index : 2;
}

body.center_gallery.hide_toolbar .galleryContainer .uploadImagesContainer {
    right : 0px;
}

body.hide_toolbar #mainContent #subcontent,
body.hide_toolbar.expand #mainContent #subcontent {
    padding-left : 0px;
}

/*apo v22 update stop*/


.droppable canvas {
    z-index : 500;
}
.register, .back_login {
    color: #fff;
    padding: 0 0 5px 0;
    display: inline-block;
    width: 100%;
    height: 100%;
    font-size: 16px;
    text-align: center;
    height: auto;
    cursor: pointer;
}
#registerUser {
    display: none;
}
.register_user_expand #registerUser {
    display: block;
}
.show_advice {
    color: #f00;
    font-size: 12px;
    padding-top: 4px;
}
.select_model {
    display: block;
    position: absolute;
    left: 0px;
    bottom: 7px;
    float: left;
    font-size: 18px;
    height: 30px;
    width: 70%;
}
.select_model .select_box {
    height: 28px;
    line-height: 28px;
    font-size: 16px;
    display: block;
    margin-left: 7px;
    width: 100%;
}
body.hide_second_loading .loader_canvas{
    opacity: 0 !important;
}
body.hide_pagination #paginationContainer_Edit_Preview{
    display:none;
}