/* overwrites */
.content { margin-left: 0 !important; }

.productinfo { margin-top: -15px !important; margin-bottom: 10px; }

/*
 * multi upload 
*/
.upload-area { height: 140px; overflow-x: hidden; overflow-y: auto; border: 1px dotted #ccc; padding: 10px; cursor: move; margin-bottom: 10px; position: relative; background-color: #eee; text-align: center; }

.upload-area h5 { width: 100%; z-index: 0; text-align: center; vertical-align: middle; top: 55px; left: 0; border: none; }

.upload-area button.uploadButton { margin-top: 10px; }

input.multiUpload { display: none; }

.invalid { border: 1px solid red !important; }

.upload-area .unknownIcon, .upload-area .imageIcon, .upload-area .loading { width: 16px; height: 16px; padding: 5px; }

.upload-area .unknownIcon { background: url(../img/unknown.png) no-repeat center center transparent; float: left; }

.upload-area .imageIcon { background: url(../img/image.png) no-repeat center center transparent; float: left; }

.upload-area .loading { background: url(../img/ajax-loader.gif) no-repeat center center transparent; position: absolute; right: 0; }

.dfiles { clear: both; border: 1px solid #ccc; background-color: rgba(200, 200, 200, 0.5); padding: 3px; position: relative; height: 25px; margin: 3px; z-index: 1; width: 97%; opacity: 1; cursor: default; }

.dfiles h5 { line-height: 26px; }

/* /multi upload */
div.center { position: absolute; width: 4px; height: 4px; background-color: #00f; border-radius: 2px; z-index: 1000; }

input[type=checkbox] { border: 0px solid transparent !important; background: none; }

section.navigation { width: 100%; display: block; position: relative; }

section.navigation a { color: #677d89; text-decoration: none; padding-bottom: 10px; }

section.navigation a i { font-size: 20px; }

section.navigation a:hover, section.navigation a.active { color: #fea20d; }

section.navigation nav { position: absolute; right: 0; }

section.navigation nav:first-child { position: static; margin: 0; width: 690px; }

section.navigation nav { display: inline-block; }

section.navigation nav a { position: relative; font: normal normal 12px/1 OpenSansRegular, Helvetica, Arial, sans-serif; display: inline-block; padding-left: 10px; padding-right: 10px; margin: 0 4px 5px 4px; white-space: nowrap; }

section.navigation nav a:hover:after, section.navigation nav a.active:after { content: ''; display: inline-block; width: 100%; height: 2px; background: #fea20d; position: absolute; bottom: -2px; left: 0; }

section.navigation nav a.choose-product i { background: url("../img/sprite.png") no-repeat 0 -38px transparent; display: inline-block; width: 32px; }

section.navigation nav a.choose-product:hover i, section.navigation nav a.choose-product.active i { background-position: -5px -70px; }

.designer-widget .mask { width: 624px; height: 680px; position: relative; }

.designer-widget .bound { background-color: rgba(128, 128, 128, 0.2); border: 1px dotted #888; position: absolute; }

.designer-widget .controller { position: absolute; z-index: 5; cursor: move; }

.designer-widget .controller.loading { background: url(../img/loader.gif) no-repeat center center rgba(100, 100, 100, 0.6); }

.designer-widget .controller.out { border: 1px solid #d00; box-shadow: 0px 0px 3px #d00; }

.designer-widget .controller.loading, .designer-widget .bound.loading { background: url(../img/loader.gif) no-repeat center center rgba(100, 100, 100, 0.6); }

.designer-widget .ui-state-disabled { opacity: 1; }

.designer-widget .corner { position: absolute; width: 16px; height: 16px; background: url("../img/sprite.png") no-repeat top left #fff; border: 1px solid #bbb; cursor: pointer; z-index: 10; }

.designer-widget .corner:hover { border-color: #666; }

.designer-widget .corner.delete { background-position: 0 0; top: 0px; left: 0px; }

.designer-widget .corner.rotate { background-position: -16px 0; top: 0px; right: 0px; }

.designer-widget .corner.layers { background-position: -32px 0; bottom: 0px; left: 0px; }

.designer-widget .corner.resize { background-position: -48px 0; bottom: 0px; right: 0px; cursor: se-resize; }

.designer-widget .layerList { position: absolute; top: 16px; }

.designer-widget .layerList li.ui-state-disabled { opacity: .35; }

.designer-widget .layerList a { font-size: 0.8em; white-space: nowrap; }

.designer-widget .layerList .ui-icon { background-image: url("../img/sprite.png"); }

.designer-widget .layerList .ui-icon.layers1 { background-position: 0 -16px; }

.designer-widget .layerList .ui-icon.layers2 { background-position: -16px -16px; }

.designer-widget .layerList .ui-icon.layers3 { background-position: -32px -16px; }

.designer-widget .layerList .ui-icon.layers4 { background-position: -48px -16px; }

.tab-panel { width: 250px; vertical-align: top; padding: 0; display: none; }

.tab-panel.active { display: inline-block; }

.tab-panel .tabs-menu li { display: inline-block; }

.tab-panel .tabs-menu li.active { position: relative; background-color: #fff; border-bottom: 1px solid #fff; z-index: 5; }

.tab-panel .tabs-menu li.active a { color: #2e7da3; }

.tab-panel .tabs-menu li a { padding: 5px; color: #fff; text-decoration: none; }

.tab-panel .tab { border: 1px solid #d4d4d1; background-color: #fff; float: left; margin-bottom: 20px; width: auto; }

.tab-panel .tab-content { display: none; }

.tab-panel.text-editor .tab-add-text .text-color { float: right; }

.tab-panel.text-editor .tab-add-text .submit-text button.add-text { display: block; }

.tab-panel.text-editor .tab-add-text .submit-text button.edit-text { display: none; }

.tab-panel.text-editor .tab-add-text.modify-mode .submit-text button.add-text { display: none; }

.tab-panel.text-editor .tab-add-text.modify-mode .submit-text button.edit-text { display: block; }

.tab-panel.text-editor .tab-add-text .bending .ui-slider { position: relative; left: 10px; }

.tab-panel.text-editor .tab-add-text .bending .ui-spinner { position: relative; top: 38px; left: 20px; }

.right-panels { display: inline-block; width: 238px; vertical-align: top; }

.right-panels > div, .right-panels > div .ui-widget-content { padding: 10px; margin-bottom: 20px; }

.right-panels div > form > div { width: 100%; margin-bottom: 15px; clear: both; }

.right-panels select { width: 100%; padding: 5px 2px; }

.right-panels textarea { resize: vertical; width: 95%; height: 70px; }

.right-panels *:disabled { color: #a2a2a2; }

.right-panels .price { font-weight: bold; font-size: 16px; }

.right-panels .right-align { width: 110px; float: right; }

.right-panels .right-align .ui-spinner { width: 100%; }

.right-panels .right-align .ui-spinner input { width: 100%; }

.right-panels .total { color: #198506; font-size: 18px; }

.right-panels .total.right-align { text-align: right; }

.right-panels .multichoice { text-align: left; }

.right-panels .multichoice.disabled { color: #a2a2a2; cursor: default; }

@media screen and (max-width: 1279px) { .right-panels { display: block; width: 100%; }
  .right-panels div > form > div { width: auto; display: inline-block; }
  .right-panels hr { display: none; } }

input.ui-spinner-input[type="text"] { border: none; width: 25px; min-width: 0; padding: 0 5px; }

.ui-state-disabled, .ui-widget-content .ui-state-disabled, .ui-widget-header .ui-state-disabled { opacity: 0.7; }

#designerContent { text-align: center; }

#designerContent > * { text-align: left; }

#designerContent .panel { width: 250px; vertical-align: top; border-radius: 10px; display: none; padding: 0; }

#designerContent .panel select { width: 100%; }

#designerContent .panel .fontStyle .ui-spinner { vertical-align: super; }

#designerContent .panel.active { display: inline-block; }

#designerContent .panel > .sliderContainer > div { display: inline-block; }

#designerContent .panel > .sliderContainer label { width: 50px; display: inline-block; }

#designerContent .panel > .sliderContainer.sizer .slider, #designerContent .panel > .sliderContainer.rotatory .slider { width: 100px; position: relative; top: 6px; margin: 0 10px 0 5px; }

#designerContent .panel > div.title { font-weight: bold; padding: 3px 0 0 5px; background-color: #60BB46; border-radius: 5px 5px 0 0; }

#designerContent .panel > .header { background: #e8e8e8; padding: 5px 10px; border-radius: 5px 5px 0 0; }

#designerContent .panel > div { position: relative; padding: 5px 10px; }

#designerContent .panel > div.content { padding: 0; margin: 0; height: 460px; }

#designerContent .panel > div.content .loading { background: url(../img/ajax-loader.gif) no-repeat center center rgba(50, 50, 50, 0.5); height: 460px; width: 100%; position: absolute; z-index: 1; }

#designerContent .panel > div.content .list { position: absolute; overflow-y: auto; height: 460px; }

#designerContent .panel > div.content .list ul { list-style-type: none; }

#designerContent .panel > div.content .list ul li { list-style-type: none; }

#designerContent .panel.productList .list ul li a { text-decoration: none; color: #333; padding-left: 50px; display: block; height: 50px; padding-top: 10px; border-bottom: 1px solid #7b9dca; background: url("") no-repeat 5px center transparent; }

#designerContent .panel.productList .list ul li a:hover { background-color: #bacde4; }

#designerContent .panel.clipartList .list ul li, #designerContent .panel.myGallery .list ul li { position: relative; display: inline-block; margin: 5px; }

#designerContent .panel.clipartList .list ul li:hover, #designerContent .panel.myGallery .list ul li:hover { background-color: #bacde4; }

#designerContent .panel.clipartList .list ul li:hover .remove, #designerContent .panel.myGallery .list ul li:hover .remove { display: block; }

#designerContent .panel.clipartList .list ul li a, #designerContent .panel.myGallery .list ul li a { display: inline-block; text-decoration: none; background: url("") no-repeat center center transparent; }

#designerContent .panel.clipartList .list ul li .remove, #designerContent .panel.myGallery .list ul li .remove { background: url(../img/ico/delete.png) top right no-repeat transparent; position: absolute; left: 0; top: 0; width: 16px; height: 16px; display: none; cursor: pointer; }

#designerContent .panel.clipartList .list ul li .loading, #designerContent .panel.myGallery .list ul li .loading { background: url(../img/ajax-loader.gif) no-repeat center center rgba(50, 50, 50, 0.5); width: 100%; height: 100%; left: 0; top: 0; }

#designerContent .panel.clipartList .list ul li .tooltipcontent, #designerContent .panel.myGallery .list ul li .tooltipcontent { display: none; }

#designerContent .panel select option.main { color: #fff; background-color: #FEA412; }

#designerContent .panel textarea, #designerContent .panel input[type=file] { width: 95%; }

#designerContent .panel textarea { resize: none; height: 110px; }

#designerContent .panel textarea[readonly="readonly"], #designerContent .panel textarea[readonly] { background: #ddd; }

#designerContent .panel > div > .sp-replacer { float: right; }

#designerContent .panel .ui-button-icon-only .ui-button-text, #designerContent .panel .ui-button-text-only .ui-button-text { padding: 0 0.5em; }

#designerContent .panel button.ui-button-icon-only { width: 1.7em; }

#designerContent .panel .ui-icon-alignCenter { background: url("../img/sprite.png") no-repeat -64px -16px transparent; }

#designerContent .panel .ui-icon-alignToHeart { background: url("../img/sprite.png") no-repeat -64px 0 transparent; }

#designerContent .panel .textAlignButtons { display: inline-block; }

#designerContent .panel .textAlignButtons .ui-icon-text-align-left, #designerContent .panel .textAlignButtons .ui-icon-text-align-center, #designerContent .panel .textAlignButtons .ui-icon-text-align-right { background: url("../img/sprite.png") no-repeat -80px 0 transparent; }

#designerContent .panel .textAlignButtons .ui-icon-text-align-left { background-position: -80px 0; }

#designerContent .panel .textAlignButtons .ui-icon-text-align-center { background-position: -80px -16px; }

#designerContent .panel .textAlignButtons .ui-icon-text-align-right { background-position: -96px 0; }

#designerContent .panel .textAlignButtons .selected { background: #fafaf4; }

#designerContent .panel .textAlignButtons .selected .ui-icon-text-align-left { background-position: -80px -32px !important; }

#designerContent .panel .textAlignButtons .selected .ui-icon-text-align-center { background-position: -80px -48px !important; }

#designerContent .panel .textAlignButtons .selected .ui-icon-text-align-right { background-position: -96px -32px !important; }

#designerContent .panel.tab-various-text .clear { float: right; color: #666; }

#designerContent .panel.tab-various-text .title { font-weight: bold; }

#designerContent .panel.tab-various-text .id { font-size: 0.8em; }

#designerContent .panel.tab-various-text input { width: 95%; }

#designerContent .panel.tab-various-text .change-amount { display: none; }

#designerContent .editor { background: url("") no-repeat top left transparent; display: inline-block; }

#designerContent .editor .biancotypes, #designerContent .editor .colortypes { position: absolute; right: 0; left: auto; top: 0; z-index: 100; }

#designerContent .editor .biancotypes .color, #designerContent .editor .colortypes .color { width: 24px; height: 24px; margin: 5px; border: 1px solid #000; cursor: pointer; background-color: transparent; /* Fallback Color */ background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0.3)), to(transparent)); /* Saf4+, Chrome */ background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.3), transparent); /* Chrome 10+, Saf5.1+, iOS 5+ */ background-image: -moz-linear-gradient(top, rgba(255, 255, 255, 0.3), transparent); /* FF3.6 */ background-image: -ms-linear-gradient(top, rgba(255, 255, 255, 0.3), transparent); /* IE10 */ background-image: -o-linear-gradient(top, rgba(255, 255, 255, 0.3), transparent); /* Opera 11.10+ */ background-image: linear-gradient(top, rgba(255, 255, 255, 0.3), transparent); filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#4DFFFFFF, EndColorStr=#00000000); }

#designerContent .editor .biancotypes .color:hover, #designerContent .editor .colortypes .color:hover { box-shadow: 0px 0px 4px 1px #000; }

#designerContent .editor .biancotypes .color.selected, #designerContent .editor .colortypes .color.selected { border-color: #fff; box-shadow: 0px 0px 4px 1px #000; }

#designerContent .editor .maskColor { position: absolute; top: 0; left: 0; z-index: 200; }

#designerContent .editor .biancotypes { right: auto; left: 0; top: 50%; margin-top: -82px; }

#designerContent .editor .biancotypes img { display: block; cursor: pointer; }

#designerContent .editor .biancotypes img.selected { border: 1px solid blue; margin: -1px; }

#designerContent .editor .biancotypes .imageView { position: relative; display: block; }

#designerContent .editor .biancotypes .imageView div { position: absolute; top: 0; left: 0; width: 16px; height: 16px; z-index: 100; cursor: pointer; }

#designerContent .editor .biancotypes .imageView:hover .defaultSign { display: block; }

#designerContent .editor .biancotypes .imageView .defaultSign { background: url(../images/icon-tick1.png) top left no-repeat transparent; display: none; bottom: 0; }

#designerContent .editor .biancotypes .imageView .defaultSign.selected { display: block; }

#designerContent .editor .colortypes .icons { position: absolute; bottom: 0; width: 12px; height: 12px; display: none; z-index: 100; bottom: -3px; }

#designerContent .editor .colortypes .color { position: relative; }

#designerContent .editor .colortypes .color:hover .removecolor, #designerContent .editor .colortypes .color:hover .addcolor { display: block; }

#designerContent .editor .colortypes .removecolor { background: url(../img/ico/delete.png) top right no-repeat transparent; left: -3px; }

#designerContent .editor .colortypes .addcolor { background: url(../img/ico/add.png) top left no-repeat transparent; right: -3px; }

#designerContent .dragClone { display: inline-block; text-decoration: none; background: url("") no-repeat center center transparent; z-index: 110; }

.sp-replacer { border-radius: 5px; -webkit-box-shadow: 1px 1px 2px 0px #777; -moz-box-shadow: 1px 1px 2px 0px #777; box-shadow: 1px 1px 2px 0px #777; }

.sp-replacer .sp-preview-inner { background-color: transparent; /* Fallback Color */ background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0.3)), to(transparent)); /* Saf4+, Chrome */ background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.3), transparent); /* Chrome 10+, Saf5.1+, iOS 5+ */ background-image: -moz-linear-gradient(top, rgba(255, 255, 255, 0.3), transparent); /* FF3.6 */ background-image: -ms-linear-gradient(top, rgba(255, 255, 255, 0.3), transparent); /* IE10 */ background-image: -o-linear-gradient(top, rgba(255, 255, 255, 0.3), transparent); /* Opera 11.10+ */ background-image: linear-gradient(top, rgba(255, 255, 255, 0.3), transparent); filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#4DFFFFFF, EndColorStr=#00000000); }

hr { border: 0; border-bottom: 1px dashed #ccc; background: #999; width: 90%; }

.ui-dialog .productSizes > div { text-align: right; margin-right: 80px; }

.dd-option-image, .dd-selected-image { max-width: 120px !important; }

.dd-container { display: inline-block; }

@media (max-width: 624px) {
    section.navigation {
        width: 60%;
    }

    section.navigation nav:first-child {
        width: unset;
        position: inherit;
    }

    section.navigation nav {
        display: block;
        position: inherit;
    }

    .navigation_container {
        display: flex;
        justify-content: center;
    }

    #designerContent .panel > div.content {
        height: 232px;
    }

    #designerContent .panel > div.content .list {
        height: 232px;
    }

    #designerContent .panel > div.content .loading {
        height: 232px;
    }

    .upload-area {
        height: 94px;
    }

    #designerContent .panel textarea {
        height: 55px;
    }

    .right-panels {
        display: flex;
        justify-content: center;
    }

    .right-panels div {
        width: 60%;
    }

    .right-panels div > form > div {
        width: 100%;
    }

    #designerContent .editor .biancotypes .imageView {
        display: inline-block;
    }

    #designerContent .editor .biancotypes {
        right: auto;
        left: 0;
        top: 93%;
        margin-left: 10px;
        margin-top: unset;
    }

    .drag-images-here {
        display:none;
    }

    .upload-area button.uploadButton {
           margin-top: 0px !important;
    }
}