
.printqBox {
    background : rgb(251, 251, 253);
    box-shadow : 1px 1.732px 5px 0 rgba(0, 0, 0, 0.043);
    border     : 1px solid #C7C7C7;
}

/*toolbar start*/
.printqToolbar {
    background-color : rgb(251, 251, 253);
    box-shadow       : 1px 1.732px 5px 0px rgba(0, 0, 0, 0.043);
    width            : auto;
    height           : auto;
    left             : -1500px;
    position         : fixed;
    top              : -1500px;
    border           : 1px solid #C7C7C7;
    z-index          : 1000;
}

.printqToolbar .toolbarSection .group {
    color      : rgba(150, 155, 167, 1);
    font-size  : 14px;
    width      : auto;
    height     : 44px;
    float      : left;
    display    : inline-block;
    text-align : center;
    position   : relative;
    padding    : 0 10px;
    border     : none;
}

.colorList {
    display : none;
}

.printqToolbarTop {
    height           : 44px;
    border-bottom    : 1px solid #C7C7C7;
    background-color : #FFFFFF;
}

.printqtoolbarBottom {
    height : 44px;
}

.printqToolbarTop ul {
    padding : 0px;
    margin  : 0px;
    /* display: none;*/
}

.printqToolbar .fontsContainer.changer.open ul,
.printqToolbar .position_group .changer.open ul,
#printqImageEditorToolbar .position_group .changer.open ul,
#printqImageEditorToolbar .morePhoto_group .changer.open ul,
.printqDefaultToolbar .position_group .changer.open ul,
.printqToolbar .valignment_group .changer.open ul,
.printqToolbar .moreText_group .changer.open ul {
    -webkit-transform : scaleY(1);
    -moz-transform    : scaleY(1);
    -ms-transform     : scaleY(1);
    -o-transform      : scaleY(1);
    transform         : scaleY(1);
}

.printqToolbar .fontsContainer .font-list-image {
    display : block;
}

.printqToolbar .toolbarSection .group.fontname_group ul {
    width : 300px;
}

.printqToolbar .fontsContainer .current_font {
    font-size     : 14px;
    color         : #384347;
    line-height   : 44px;
    width         : 133px;
    text-align    : left;
    overflow      : hidden;
    text-overflow : ellipsis;
    white-space   : nowrap;
    float         : left;
}

.printqToolbar a, .printqDefaultToolbar a {
    text-decoration : none;
}

.printqToolbar .changer.pt {
    display     : inline-block;
    float       : left;
    width       : auto;
    line-height : 44px;
}

.printqToolbar .changeFont, .printqToolbar .change_size {
    line-height : 45px;
}

.printqToolbar .moreText_group .curvedTextOption {
    display : none;
}

.printqToolbar .moreText_group li span.border_bottom.hide_border_bottom {
    display : none;
}

.printqToolbar .moreText_group .curvedTextOption.active {
    display : block;
}

.printqToolbar .changer.pt input {
    border      : none;
    max-width   : 50px;
    float       : left;
    padding     : 0;
    line-height : 44px;
    font-size   : 14px;
    height      : 43px;
    padding     : 0 5px;
    outline     : none;
}

.changer.buttons {
    height : 100%;
    float  : left;
    color  : rgba(150, 155, 167, 1);
    cursor : pointer;
    margin : 0 5px 0 10px;
}

.changer.buttons div {
    height : 20px;
}

.changer.buttons div span {
    height      : 100%;
    display     : block;
    line-height : 22px;
    font-size   : 18px;
}

.changer.buttons div:nth-child(2) {
    padding-left : 2px;
}

.printqToolbar .toolbarSection .forecolor_selector .current_color {
    width            : 24px;
    height           : 24px;
    background-color : red;
    display          : block;
    margin-top       : 10px;
    border-radius    : 50%;
    border           : 1px solid #CCCCCC;
}

.printqDefaultToolbar .changeForecolor {
    width : 0px !important;
}

.printqDefaultToolbar .forecolor_selector.selector {
    margin-left : 0px;
}

.printqDefaultToolbar .group.group_group,
.printqDefaultToolbar .group.ungroup_group {
    display : none;
}

.printqDefaultToolbar .group.group_group.show,
.printqDefaultToolbar .group.ungroup_group.show {
    display : inline-block !important;
}

.printqToolbar .icon {
    font-size   : 16px;
    color       : rgba(150, 155, 167, 1);
    line-height : 44px;
}

.printqToolbar .printqtoolbarBottom .group.position_group .icon,
.printqDefaultToolbar .group.position_group .icon {
    line-height : 48px;
}

.printqToolbar .printqtoolbarBottom .group.valignment_group .icon {
    line-height : 43px;
}

.printqToolbar ul li:last-child {
    border-bottom : none;
}

.printqToolbar .printqtoolbarBottom .group.position_group .current .icon,
.printqDefaultToolbar .group.position_group .current .icon,
.printqToolbar .printqtoolbarBottom .group.valignment_group .current .icon {
    line-height : 48px;
}

.printqToolbar .toolbarSection .group a {
    height    : 100%;
    display   : inline-block;
    margin    : 0 5px;
    outline   : none;
    min-width : 16px;
}

.printqToolbar .printqtoolbarBottom .decorations_group .changer div,
.printqToolbar .printqtoolbarBottom .alignment_group .changer div,
.printqToolbar .printqtoolbarBottom .vertical_alignment_group .changer div {
    color        : rgba(150, 155, 167, 1);
    font-size    : 14px;
    width        : 33px;
    height       : 44px;
    float        : left;
    display      : inline-block;
    border-right : none;
}

.current.current_valignment {
    margin-left : 1px;
}

.printqToolbar .valignment_group ul li {
    margin-left : 0px !important;
}


.printqDefaultToolbar .position_group ul,
.printqToolbar .printqtoolbarBottom .position_group ul {
    top : -99px;
}

.printqToolbar .toolbarSection .group.moreText_group {
    float       : right;
    border-left : 1px solid #C7C7C7;
}

.printqToolbar .printqtoolbarBottom .moreText_group li {
    width      : 60px;
    background : #FFFFFF;
}

.printqToolbar .printqtoolbarBottom .valignment_group li {
    padding    : 0 10px;
    width      : auto;
    background : #FFFFFF;
}

.printqToolbar div.valignment_group ul {
    top : -45px;
}

.printqToolbar .printqtoolbarBottom .decorations_group .changer div .icon {
    left : 11px;
}

.defaultPrintqEditorToolbar .fontsContainer ul .mCSB_3_scrollbar {
    width : 10px;
}

.defaultPrintqEditorToolbar .fontsContainer ul .mCSB_container {
    margin-right : 10px;
}

.defaultPrintqEditorToolbar .fontsContainer ul li {
    padding : 0 0 0 10px;
}

.printqToolbar .fontsContainer .fontListSearch li {
    padding       : 10px 0;
    border-bottom : 1px solid #CCCCCC;
}

.printqToolbar .toolbarSection .group.fontname_group #searchFontInput {
    width   : 98%;
    padding : 5px;
}

.printqToolbar .fontsContainer ul .fontListInner {
    max-height : 250px;
}

.printqToolbar ul li, .printqDefaultToolbar ul li {
    padding    : 0 10px;
    width      : auto;
    background : #FFFFFF;
}

#printqImageEditorToolbar ul, .printqToolbar ul, .printqDefaultToolbar ul {
    top                : -46px;
    left               : -1;
    list-style-type    : none;
    padding            : 0;
    margin             : 0;
    position           : absolute;
    background-color   : #FFFFFF;
    z-index            : 99;
    border             : 1px solid rgba(0, 0, 0, 0.099);
    box-shadow         : 1px 1.732px 5px 0 rgba(0, 0, 0, 0.050);
    -webkit-transform  : scaleY(0.0000);
    -moz-transform     : scaleY(0.0000);
    -ms-transform      : scaleY(0.0000);
    -o-transform       : scaleY(0.0000);
    transform          : scaleY(0.0000);
    -webkit-transition : -webkit-transform 0.3s ease;
    -moz-transition    : -moz-transfrom 0.3s ease;
    -ms-transition     : -ms-transform 0.3s ease;
    -o-transition      : -o-transform 0.3s ease;
    transition         : transform 0.3s ease;
}

.printqToolbar ul li a {
    color : #384347;
}

.printqToolbar .changer.active .current {
    display : none;
}

span.border_bottom {
    width         : 100%;
    height        : 1px;
    border-bottom : 1px solid #C7C7C7;
    display       : block;
}

.printqToolbar .group .current a span.icon,
.printqDefaultToolbar .group .current a span.icon {
    color : rgba(33, 64, 170, 1)
}

.printqToolbar .fontsContainer ul {
    top   : -34px;
    width : 100%;
}

.printqToolbar .fontsContainer ul li a {
    display : inline-block;
    width   : 100%;
}

.printqToolbar .fontsContainer ul li:last-child span.border_font {
    display : none;
}

.printqToolbar .fontsContainer ul li a:hover {
    color : #33A0D6;
}

.printqToolbar .toolbarSection .group.fontname_group ul li a {
    height      : 36px;
    line-height : 36px;
    text-align  : left;
    width       : 100%;
    margin      : 0;
    min-width   : 160px;
}

span.border_font {
    width         : 100%;
    height        : 1px;
    display       : block;
    border-bottom : 1px solid rgb(199, 199, 199);
}

.printqToolbar .moreText_group ul li a span.icon {
    line-height : 44px;
}

.printqToolbar .moreText_group ul li a {
    display : inline-block;
}

.printqToolbar .moreText_group ul {
    top : -1px;
}

.printqToolbar .group .current a span.icon, .printqDefaultToolbar .group .current a span.icon {
    color : rgba(33, 64, 170, 1);
}

/*toolbar end*/


/*start color toolbar*/
.mainTabsColorContainer {
    position         : fixed;
    top              : -1500px;
    left             : 1500px;
    border           : 1px solid #C7C7C7;
    z-index          : 2000;
    background-color : rgb(251, 251, 253);
}

.tabsContainer {
    width   : 100%;
    display : inline-block;
    color   : rgba(150, 155, 167, 1);
}

.tabsContainer div {
    float       : left;
    width       : 50%;
    cursor      : pointer;
    text-align  : center;
    height      : 24px;
    line-height : 24px;
}

.tabsContainer div.current {
    color : rgba(33, 64, 170, 1);
}

.tabsContainer div:last-child {
    border : none;
}

.colorContainer {
    background-color : rgb(255, 255, 255);
    box-shadow       : 1px 1.732px 5px 0px rgba(0, 0, 0, 0.043);
    width            : 384px;
    height           : 70px;
}

.colorItem {
    cursor : pointer;
}

.colorContainer .colorList {
    max-height  : 60px;
    height      : 60px;
    width       : 377px;
    overflow    : hidden;
    padding     : 0px;
    margin      : 0px;
    margin-left : 9px;
    margin-top  : 9px;
    display     : inline-block;
}

.colorContainer ul li {
    width           : 28px;
    height          : 28px;
    padding         : 0px;
    margin          : 0px;
    float           : left;
    text-align      : center;
    list-style-type : none;
}

.colorContainer .colorList .colorItem b {
    display : none;
}

.colorContainer .colorList .current_color.colorItem b {
    width            : 18px;
    height           : 18px;
    background-color : #FFFFFF;
    display          : inline-block;
    border-radius    : 50px;
    line-height      : 20px;
    margin-top       : 5px;
    font-size        : 8px;
    color            : #00ABEB;
}

.colorContainer .mCSB_inside > .mCSB_container {
    margin : 0px;
}

.colorContainer ul li.colorPicker {
    border      : 1px solid rgba(150, 155, 167, 1);
    margin-left : 1px;
}

.colorContainer ul.colorList li.colorPicker b {
    display     : block;
    line-height : 28px;
    font-size   : 10px;
    color       : rgba(150, 155, 167, 1);
}

.colorPickerContainer {
    position         : absolute;
    width            : auto;
    display          : block;
    height           : auto;
    background-color : rgb(251, 251, 253);
    border           : 1px solid #C7C7C7;
    border-radius    : 7px;
}

.color_picker_button {
    width       : 35px;
    margin-left : 30px;
    display     : block;
    float       : initial;
    height      : 18px;
    padding     : 0 !important;
    line-height : 18px;
    border      : 1px solid #CCCCCC;
    box-sizing  : border-box;
}

/*end color toolbar*/

/*tooltip*/
.tooltipContainer {
    background-color : rgb(29, 44, 63);
    opacity          : 0.902;
    min-width        : 185px;
    width            : 100%;
    min-height       : 65px;
    position         : absolute;
    color            : #FFFFFF;
}

.ui-tooltip {
    background : transparent !important;
    border     : none !important;
    box-shadow : none !important;
    width      : 100%;
    min-width  : 185px;
    max-width  : 240px !important;
    position   : absolute !important;
}

.tooltipTitle p {
    margin    : 0px;
    padding   : 10px 0px 5px 10px;
    font-size : 16px;
}

.tooltipDescription p {
    margin    : 0px;
    padding   : 0px 10px 10px 10px;
    font-size : 14px;
    color     : #6CBFE8;
}

/*tooltip end*/

/* transparency spacing radius */
#printqTransparencyPicker,
#printqSpacingPicker,
#printqCharSpacingToolbar,
#printqLineHeightToolbar,
#printqRadiusPicker {
    background-color : #FBFBFD;
    box-shadow       : 1px 1.732px 5px 0px rgba(0, 0, 0, 0.043);
    width            : 100%;
    height           : 100%;
    max-width        : 350px;
    max-height       : 50px;
    right            : -1500px;
    position         : fixed;
    top              : -1500px;
    border           : 1px solid #C7C7C7;
    z-index          : 2000;
}

#printqTransparencyPicker .pickerBody,
#printqCharSpacingToolbar .pickerBody,
#printqLineHeightToolbar .pickerBody,
#printqSpacingPicker .pickerBody,
#printqRadiusPicker .pickerBody {
    width : 350px;
}

#printqTransparencyPicker .leftContainer,
#printqSpacingPicker .leftContainer,
#printqLineHeightToolbar .leftContainer,
#printqCharSpacingToolbar .leftContainer,
#printqRadiusPicker .leftContainer {
    width : 50px;
    float : left;
}

#printqTransparencyPicker .rightContainer,
#printqSpacingPicker .rightContainer,
#printqLineHeightToolbar .rightContainer,
#printqCharSpacingToolbar .rightContainer,
#printqRadiusPicker .rightContainer {
    width  : 300px;
    height : 100%;
    float  : left;
}

#printqTransparencyPicker .leftContainer span,
#printqSpacingPicker .leftContainer span,
#printqCharSpacingToolbar .leftContainer span,
#printqLineHeightToolbar .leftContainer span,
#printqRadiusPicker .leftContainer span {
    font-size : 30px;
    margin    : 10px;
    display   : inline-block;
    color     : rgba(150, 155, 167, 1);
}

#printqTransparencyPicker .rightContainer #transparencySlider,
#printqSpacingPicker .rightContainer #editor_curvedspacing_slider,
#printqCharSpacingToolbar .rightContainer #editor_charspacing_slider,
#printqLineHeightToolbar .rightContainer #editor_lineheight_slider,
#printqRadiusPicker .rightContainer #editor_spacing_slider {
    width  : 90%;
    margin : 0 auto;
    top    : 22px;
}

/*end transparency*/

/* imageGallery */

#printqImageEditorToolbar a {
    text-decoration : none;
}

#printqImageEditorToolbar .deletePhoto_group a span, #printqImageEditorToolbar .returnGroup a span {
    line-height : 35px;
}

#printqImageEditorToolbar .group.edit {
    background-color : #FBFBFD;
}

#printqImageEditorToolbar .resizeImageGroup .ui-state-default, #printqTransparencyPicker .rightContainer .ui-state-default,
#printqSpacingPicker .ui-state-default, #printqRadiusPicker .rightContainer .ui-state-default,
#printqBrightnessSlider .rightContainer .ui-state-default,
#printqContrastSlider .rightContainer .ui-state-default,
#printqCharSpacingToolbar .ui-state-default,
#printqLineHeightToolbar .ui-state-default {
    border        : 2px solid rgba(150, 155, 167, 1);
    background    : #FFFFFF;
    font-weight   : bold;
    color         : #1C94C4;
    border-radius : 20px;
    outline       : none;
    width         : 1.2em;
    height        : 1.2em;
    text-align    : center;
    cursor        : pointer;
}

#printqImageEditorToolbar .resizeImageGroup .ui-widget-content, #printqTransparencyPicker .rightContainer .ui-widget-content,
#printqCharSpacingToolbar .ui-widget-content,
#printqLineHeightToolbar .ui-widget-content,
#printqSpacingPicker .ui-widget-content, #printqRadiusPicker .rightContainer .ui-widget-content {
    border           : 1px solid #DDDDDD;
    background       : none;
    color            : #333333;
    background-color : rgb(51, 160, 214);
    box-shadow       : inset 0.5px 0.866px 3px 0px rgba(0, 0, 0, 0.11);
    height           : 3px;
}

#printqImageEditorToolbar .resizeImageGroup .ui-slider-handle, #printqTransparencyPicker .rightContainer .ui-slider-handle,
#printqSpacingPicker .ui-slider-handle, #printqRadiusPicker .rightContainer .ui-slider-handle,
#printqCharSpacingToolbar .ui-slider-handle,
#printqLineHeightToolbar .ui-slider-handle {
    top : -.50em;
}

#printqImageEditorToolbar .position_group ul {
    top : -91px;
}

#printqImageEditorToolbar.no_photo .resizeImageGroup,
#printqImageEditorToolbar.no_photo .cnv_block_group,
#printqImageEditorToolbar.no_photo .fx_group,
#printqImageEditorToolbar.no_photo .morePhoto_group,
#printqImageEditorToolbar.no_photo .quality_block_group,
body.no_photo .toolbarImagesMobile ul.imagesToolbarMobile li.effect_group,
body.no_photo .toolbarImagesMobile ul.imagesToolbarMobile li.transparency_group,
body.no_photo .toolbarImagesMobile ul.imagesToolbarMobile li.duplicate_group {
    display : none;
}

body.no_photo .toolbarImagesMobile ul.imagesToolbarMobile li.upload_image_group {
    display : inline-block;
}

.toolbarImagesMobile ul.imagesToolbarMobile li.upload_image_group {
    display : none;
}

/* imageToolbar*/
/*printqImagePicker*/
#printqImagePicker {
    max-height : 349px;
}

#printqImagePicker .imageGallery .imageContainer div.actions {
    width              : 100%;
    height             : 100%;
    background-color   : none;
    -webkit-transition : background-color 0.3s ease;
    -moz-transition    : background-color 0.3s ease;
    -ms-transition     : background-color 0.3s ease;
    -o-transition      : background-color 0.3s ease;
    transition         : background-color 0.3s ease;
    text-align         : center;
}

#printqImagePicker .imageGallery .imageContainer .actions .pic {
    position    : absolute;
    width       : 30px;
    height      : 30px;
    display     : inline-block;
    line-height : 30px;
    text-align  : center;
    top         : 23px;
    cursor      : pointer;
}

#printqEditorToolbar .moreText_group ul .printqicon-reverse_text {
    font-size : 12px;
}

#printqImagePicker .imageGallery .imageContainer .actions .pic.select {
    background-color   : #33A0D6;
    color              : #FFFFFF;
    left               : -50px;
    -webkit-transition : left 0.3s ease;
    -moz-transition    : left 0.3s ease;
    -ms-transition     : left 0.3s ease;
    -o-transition      : left 0.3s ease;
    transition         : left 0.3s ease;
    font-size          : 16px;
}

#printqImagePicker .imageGallery .imageContainer .actions .pic.remove {
    background-color   : rgba(255, 255, 255, 0.2);
    color              : #FFFFFF;
    right              : -50px;
    -webkit-transition : right 0.3s ease;
    -moz-transition    : right 0.3s ease;
    -ms-transition     : right 0.3s ease;
    -o-transition      : right 0.3s ease;
    transition         : right 0.3s ease;
}

#printqImagePicker .imageGallery .hasPhoto.imageContainer:hover div.actions {
    background-color : rgba(29, 44, 63, 0.7);
}

#printqImagePicker .imageGallery .hasPhoto.imageContainer:hover .pic.select {
    left : 19px;
}

#printqImagePicker .imageGallery .hasPhoto.imageContainer:hover .pic.remove {
    right : 19px;
}

#printqImagePicker .pickerBody .imageUploadSection {
    width        : 320px;
    height       : 70px;
    border       : 1px solid #C7C7C7;
    margin       : 0 auto;
    margin-top   : 15px;
    border-style : dashed;
    color        : #AAACB1;
    display      : block;
    line-height  : 70px;
    position     : relative;
}

#printqImagePicker .pickerBody .imageUploadSection input {
    position    : absolute;
    right       : 0px;
    top         : 0px;
    margin      : 0px;
    padding     : 0px;
    cursor      : pointer !important;
    opacity     : 0;
    width       : 100%;
    height      : 100%;
    z-index     : 10;

    cursor: pointer !important;
    font-size: 0px !important;
}

#printqImagePicker .pickerBody .imageUploadSection .upload_text {

    font-family: 'Lato', sans-serif;
    font-size: 13px;
    float: left;
    padding-left: 15px;
    text-align: left;
    position: static;
    width: 180px;
}

#printqImagePicker .pickerBody .imageUploadSection .upload_arrow {
    background          : url('../../../personalization/designer_assets/upload_helper.png');
       background-repeat: no-repeat;
    width: 45px;
    height: 68px;
    float: left;
    background-position: 7px 27px;
    font-family: 'Lato', sans-serif;
    display: inline-block;
    -webkit-transform: rotate(-40deg);
    -moz-transform: rotate(-40deg);
    -ms-transform: rotate(-40deg);
    -o-transform: rotate(-40deg);
    transform: rotate(-40deg);
    margin-left: 15px;
    position: static;
}

#printqImagePicker .pickerBody .imageUploadSection .upload_ico {
    color       : #2C9DD5;
     font-size: 24px;
    float: left;
    margin: 0 auto;
    display: inline-block;
    width: 78px !important;
    position: static !important;
    border: none !important;
    cursor: pointer;
    height: 100%;
    line-height: 50px;
    text-align: center;
}

/*ImagePicker end*/
/*printqEffectPicker*/
#printqEffectPicker {
    background-color : #FBFBFD;
    box-shadow       : 1px 1.732px 5px 0px rgba(0, 0, 0, 0.043);
    width            : 100%;
    height           : 100%;
    max-width        : 385px;
    right            : -1500px;
    left             : -1500px;
    position         : fixed;
    top              : 100px;
    border           : 1px solid #C7C7C7;
    z-index          : 1000;
}

#printqEffectPicker {
    max-height : 346px;
}

#printqEffectPicker .effectGallery, #printqImagePicker .imageGallery {
    display       : inline;
    max-width     : 362px;
    width         : 362px;
    position      : relative;
    overflow      : auto;
    overflow      : hidden;
    padding       : 0px;
    margin-top    : -1px;
    margin-bottom : 0px;
}

#printqEffectPicker .effectGallery .allEffects, #printqImagePicker .allMyImages {
    max-height : 249px;
    height     : 249px;
}

#printqImagePicker .allMyPresetImages .allMyImages {
    max-height : 342px;
    height     : 342px;
}

#printqEffectPicker .effectGallery .effectContainer {
    display             : block;
    width               : 120px;
    height              : 125px;
    position            : relative;
    cursor              : pointer;
    padding             : 0px;
    margin              : 0px;
    float               : left;
    background-size     : contain;
    cursor              : pointer;
    background-position : center center;
    background-repeat   : no-repeat;
    background-size     : contain;
    cursor              : pointer;
    overflow            : hidden;
    box-sizing          : border-box;
    border-right        : 1px solid #C7C7C7;
    border-bottom       : 1px solid #C7C7C7;
}

#printqEffectPicker .effectGallery .effectContainer {
    background : none;
}

#printqEffectPicker .effectGallery .effectContainer > div {
    overflow   : hidden;
    position   : absolute;
    width      : 85%;
    height     : 80%;
    display    : block;
    text-align : center;
    margin     : 0 auto;
    position   : relative;
}

#printqEffectPicker .pickerBody {
    overflow : hidden;
    display  : block;
    width    : 100%;
    height   : 100%;
}

#printqEffectPicker .effectGallery .effectContainer img {
    display    : inline-block;
    width      : auto;
    height     : 110px;
    top        : 0px;
    position   : static !important;
    max-width  : 90px;
    max-height : 80px;
    margin-top : 13px;
}

#printqEffectPicker .effectGallery .effectContainer .imageEffect {
    position            : absolute;
    width               : 100%;
    height              : 85%;
    position            : absolute;
    left                : 0px;
    top                 : 10%;
    opacity             : 1;
    background-size     : cover;
    background-position : 50% 50%;
    background-repeat   : no-repeat;
}

#printqEffectPicker .effectGallery {
    display : block;
}

#printqEffectPicker .effectGallery .effectContainer span.effectTitle {
    display        : block;
    color          : #384347;
    cursor         : pointer;
    font-size      : 10px;
    height         : 18px;
    line-height    : 20px;
    white-space    : nowrap;
    text-align     : center;
    vertical-align : middle;
}

#printqEffectPicker .mCSB_inside > .mCSB_container, #printqImagePicker .mCSB_inside > .mCSB_container {
    margin-right : 0px;
}

#printqEffectPicker .effectGallery .effectContainer.active {
    box-shadow : inset 5.5px 0.266px 9px 2px rgba(45, 48, 60, 0.063);
}

#printqEffectPicker .effectGallery .effectContainer .mask {
    background-color   : none;
    opacity            : 0.7;
    width              : 100%;
    height             : 85%;
    position           : absolute;
    -webkit-transition : background-color 0.3s ease;
    -moz-transition    : background-color 0.3s ease;
    -ms-transition     : background-color 0.3s ease;
    -o-transition      : background-color 0.3s ease;
    transition         : background-color 0.3s ease;
    left               : 0px;
    top                : 10%;
}

#printqEffectPicker .effectGallery .effectContainer:hover .mask {
    background-color : rgb(29, 44, 63);
}

#printqEffectPicker .effectGallery .effectContainer.active .mask {
    background-color : rgb(29, 44, 63);
}

#printqEffectPicker .effectGallery li.effectContainer .ico {
    width              : 30px;
    height             : 30px;
    position           : absolute;
    margin             : 0 auto;
    left               : 31px;
    top                : 39px;
    background-color   : #33A0D6;
    opacity            : 0;
    font-size          : 14px;
    line-height        : 30px;
    -webkit-transition : opacity 0.3s ease;
    -moz-transition    : opacity 0.3s ease;
    -ms-transition     : opacity 0.3s ease;
    -o-transition      : opacity 0.3s ease;
    transition         : opacity 0.3s ease;
    color              : #FFFFFF;
}

#printqEffectPicker .effectGallery .effectContainer:hover .ico {
    opacity : 1;
}

#printqEffectPicker .effectGallery li.effectContainer.active .ico {
    display : block;
}

#printqEffectPicker .pickerInfo {
    width            : 50px;
    height           : 50px;
    position         : absolute;
    left             : -50px;
    line-height      : 50px;
    text-align       : center;
    background-color : #FBFBFD;
    box-shadow       : 1px 1.732px 5px 0px rgba(0, 0, 0, 0.043);
    border           : 1px solid #C7C7C7;
    top              : -1px;
    cursor           : pointer;
}

#printqEffectPicker .pickerInfo span, #printqImagePicker .pickerInfo span {
    vertical-align : middle;
    font-size      : 30px;
    top            : 10px;
    position       : relative;
    color          : rgba(150, 155, 167, 1);
}


.blur {
    filter         : blur(1px);
    -webkit-filter : blur(1px);
    -moz-filter    : blur(1px);
    -o-filter      : blur(1px);
    -ms-filter     : blur(1px);
}

.sharpen {
    filter         : blur(1px) invert(0.1) contrast(1.5);
    -webkit-filter : blur(1px) invert(0.1) contrast(1.5);
    -moz-filter    : blur(1px) invert(0.1) contrast(1.5);
    -ms-filter     : blur(1px) invert(0.1) contrast(1.5);
}

.flip_horizontal {
    -moz-transform    : scaleX(-1);
    -o-transform      : scaleX(-1);
    -webkit-transform : scaleX(-1);
    transform         : scaleX(-1);
    filter            : FlipH;
    -ms-filter        : FlipH;
}

.flip_vertical {
    -moz-transform    : scaleY(-1);
    -o-transform      : scaleY(-1);
    -webkit-transform : scaleY(-1);
    transform         : scaleY(-1);
    filter            : FlipV;
    -ms-filter        : FlipV;
}

.flip_both {
    -moz-transform    : scale(-1);
    -o-transform      : scale(-1);
    -webkit-transform : scale(-1);
    transform         : scale(-1);
    filter            : Flip;
    -ms-filter        : Flip;
}

/*printqEffectpicker*/
.qq-upload-drop-area {
    position   : relative !important;
    background : #FFFFFF !important;
    display    : inline-block !important;
}

.qq-upload-drop-area span {
    top        : 0px !important;
    margin-top : 0px !important;
}

.back-to-cloud-albums {
    display : none !important;
}

.qq-upload-button {
    cursor : pointer;
}

.qq-upload-button-hover {
    background : transparent !important;
    width      : 150px !important;
}

.qq-upload-list {
    display : none !important;
}

#printqImagePicker .imageGallery .imageContainer:hover .actions .select {
    left : 15px;
}

#printqImagePicker .imageGallery .imageContainer:hover .actions .remove {
    right : 15px;
}

#printqImagePicker .pickerBody, #printqImagePicker .selectboxPickerBody, #printqImagePicker .facebookPickerBody, #printqImagePicker .facebookPhotoPickerBody, #printqImagePicker .instagramPickerBody, #printqImagePicker .fotoliaPickerBody {
    display  : none;
    position : relative;
    z-index  : 1;
}

#printqImagePicker.myphotos .pickerBody,
#printqImagePicker.selectbox .selectboxPickerBody,
#printqImagePicker.facebook .facebookPickerBody,
#printqImagePicker.facebookPhoto .facebookPhotoPickerBody,
#printqImagePicker.instagram .instagramPickerBody {
    display : block;
}

/*toolbar default start*/

/*curvedTextEditMode*/
.curvedTextEditMode.show {
    display : block;
}

.curvedTextEditMode {
    text-align : center;
    z-index    : 99999;
    width      : 100%;
    height     : 100%;
    background : rgba(240, 240, 240, 0.58) !important;
    position   : fixed;
    top        : 0;
    display    : none;
}

.curvedTextEditMode .containerCurved .editZone {
    padding : 25px 0px 25px 0px;
}

.curvedTextEditMode .containerCurved {
    width    : 500px;
    height   : 200px;
    margin   : 0 auto;
    top      : 35%;
    position : relative;
}

.curvedTextEditMode .containerCurved textarea {
    width         : 90%;
    height        : 85px;
    position      : relative;
    padding       : 2px;
    border        : 1px solid rgba(33, 64, 170, 1);
    border-radius : 5px;
    outline       : none;
    resize        : none;
    overflow      : auto;
}

/*end*/

/*button style*/
button.button {
    border-style     : solid;
    border-width     : 0;
    cursor           : pointer;
    font-weight      : normal;
    line-height      : normal;
    margin           : 0 0 8px;
    position         : relative;
    text-decoration  : none;
    text-align       : center;
    padding-top      : 0.5625rem;
    padding-right    : 1.125rem;
    padding-bottom   : 0.625rem;
    padding-left     : 1.125rem;
    font-size        : 1rem;
    color            : white;
    background-color : rgba(33, 64, 170, 1);
}

/*end*/
/*save project*/


aside.sidebar #saveProjectFrame ul {
    width      : 100%;
    display    : block;
    position   : relative;
    list-style : none;
    padding    : 0;
    margin     : 0;
}

aside.sidebar #saveProjectFrame ul li input,
aside.sidebar #saveProjectFrame ul li textarea {
    width       : 100%;
    margin-top  : 5px;
    height      : 29px;
    margin-left : 0px;
}

aside.sidebar #saveProjectFrame ul li textarea {
    height : 150px;
}

aside.sidebar #saveProjectFrame ul li {
    list-style     : none;
    display        : block;
    margin         : 5px 0 5px 0;
    color          : #FFFFFF;
    padding-bottom : 12px;
}

body.load_project_frame_expanded aside.sidebar ul.mainMenu #loadProjectFrame {
    right : -300px;
}

aside.sidebar #loadProjectFrame ul {
    width      : 100%;
    display    : block;
    position   : relative;
    list-style : none;
    padding    : 0;
    margin     : 0;
}

aside.sidebar #loadProjectFrame ul li {
    list-style : none;
    display    : block;
    margin     : 5px 0 5px 0;
    color      : #FFFFFF;
    text-align : center;
}

aside.sidebar #loadProjectFrame ul li span.span_border {
    width         : 97%;
    height        : 1px;
    border-bottom : 1px solid rgba(33, 64, 170, 1);
    display       : inline-block;
    float         : left;
    margin-left   : 4px;
}


aside.sidebar ul.mainMenu li.mainItem ul button.button:nth-of-type(2) {
    margin-left : 0px;
}

aside.sidebar ul.mainMenu li.mainItem ul button.button:hover { background : #6CBFE8; }

aside.sidebar ul.mainMenu li.mainItem ul button.button:active { top : 1px; }

aside.sidebar div.submenu > ul li.subItem.saveProject_group a.subTrigger,
aside.sidebar div.submenu > ul li.subItem.loadProject_group a.subTrigger {
    font-size : 20px;
    padding   : 20px;
}


aside.sidebar #saveProjectFrame ul li:nth-of-type(3) {
    text-align : center;
}

/*end save/load project*/

/* printqImagePicker */
.tabsContainerImage {
    width    : 50px;
    position : absolute;
    left     : -50px;
    display  : inline-block;
    height   : 100%;
}

#printqImagePicker .pickerInfo:first-child {
    border : 1px solid #C7C7C7;
}

#printqImagePicker .pickerInfo {
    width      : 100%;
    height     : 50px;
    cursor     : pointer;
    text-align : center;
}

#printqImagePicker .imageGallery .imageContainer {
    display          : block;
    width            : 124px;
    height           : 98px;
    border-color     : #C7C7C7;
    border-style     : solid;
    border-width     : 1px;
    position         : relative;
    padding          : 10px;
    margin           : -1px 0 0 -1px;
    float            : left;
    overflow         : hidden;
    background-color : #FFFFFF;
}

#printqImagePicker .imageGallery .imageContainer div.placeholder {
    width               : 104px;
    height              : 78px;
    display             : inline-block;
    position            : relative;
    background-size     : contain;
    background-repeat   : no-repeat;
    background-position : center center;
    text-decoration     : none;
    margin              : 0;
}

.images_messages {
    width      : 100%;
    height     : 100%;
    display    : table;
    text-align : center;
}

.hasPhoto + .images_messages {
    display : none;
}

.images_messages span.message {
    display        : table-cell;
    vertical-align : middle;
    color          : #AAACB1;
}

#printqEffectPicker .effectGallery .effectContainer div.itemTitle, #printqImagePicker .imageGallery .imageContainer div.itemTitle {
    width         : 104px;
    height        : 18px;
    line-height   : 10px;
    font-size     : 10px;
    color         : #384347;
    display       : block;
    position      : relative;
    padding-top   : 8px;
    overflow      : hidden;
    white-space   : nowrap;
    text-overflow : ellipsis;
}

#printqImagePicker .imageGallery .imageContainer.hasTitle {
    height : 116px;
}

#printqImagePicker .selectboxPickerBody .imageGallery .hasPhoto.imageContainer:hover .pic.select, #printqImagePicker .selectboxPickerBody .imageGallery .hasPhoto.imageContainer:hover .pic.select {
    left : 37px;
}

#printqImagePicker {
    width     : 100%;
    height    : 100%;
    max-width : 385px;
    right     : -1500px;
    left      : -1500px;
    position  : fixed;
    top       : 100px;
    z-index   : 55;
}

#printqImagePicker .imageGallery .imageContainer .animation-container {
    top : -70px;
}

#printqImagePicker .connectBtn {
    display : none;
}

#printqEffectPicker .effectGallery .effectContainer:hover .pic.select, #printqImagePicker .selectboxPickerBody .imageGallery .hasPhoto.imageContainer:hover .pic.select, #printqImagePicker .selectboxPickerBody .imageGallery .hasPhoto.imageContainer:hover .pic.select, #printqImagePicker .fotoliaPickerBody .imageGallery .hasPhoto.imageContainer:hover .pic.select, #printqImagePicker .facebookPickerBody .imageGallery .hasPhoto.imageContainer:hover .pic.select, #printqImagePicker .facebookPhotoPickerBody .imageGallery .hasPhoto.imageContainer:hover .pic.select, #printqImagePicker .instagramPickerBody .imageGallery .hasPhoto.imageContainer:hover .pic.select {
    left : 37px;
}

#printqImagePicker .imageGallery.connect + .connectBtn {
    display    : inline-block;
    margin-top : 50px;
    left       : 88px;
    top        : -14px;
}

#printqImagePicker .imageGallery .imageContainer.hasPhoto div.animation-container, #printqImagePicker .imageGallery .imageContainer.empty div.animation-container {
    display : none;
}

/* end */

/*resizer image slider*/
#printqImageEditorToolbar .resizeImageGroup {
    width            : 250px;
    border-left      : 1px solid #C7C7C7;
    border-right     : 1px solid #C7C7C7;
    box-sizing       : border-box;
    background-color : #FFFFFF;
    padding          : 0 15px;
}

#printqImageEditorToolbar .resizeImageGroup #slider {
    width  : 100%;
    margin : 0 auto;
    top    : 22px;
}

#printqImageEditorToolbar .resizeImageGroup .ui-widget-content {
    border           : 1px solid #DDDDDD;
    background       : none;
    color            : #333333;
    background-color : rgb(51, 160, 214);
    box-shadow       : inset 0.5px 0.866px 3px 0 rgba(0, 0, 0, 0.11);
    height           : 3px;
}

#printqImageEditorToolbar .resizeImageGroup .ui-slider-handle {
    top : -11px;
}

#printqImageEditorToolbar .resizeImageGroup .ui-state-default {
    border        : 2px solid rgba(150, 155, 167, 1);
    background    : #FFFFFF;
    font-weight   : bold;
    color         : #1C94C4;
    border-radius : 20px;
    outline       : none;
    width         : 22px;
    height        : 22px;
    text-align    : center;
    cursor        : pointer;
}

/*resizer image slider*/
#printqImageEditorToolbar .group.quality_block .icon.printqicon-normalsmiley {
    color : #FA9C1E !important;
}

#printqImageEditorToolbar .group.quality_block .icon.printqicon-goodsmiley {
    color : #008000 !important;
}

#printqImageEditorToolbar .group.quality_block .icon.printqicon-badsmiley {
    color : rgb(255, 0, 0) !important;
}

#addResetContainer.hide {
    display : none;
}

/*effects toolbar*/
#printqEffectPicker .pickerBody ul.effectGallery li.effectContainer.grayscale .imageEffect,
.effectToolBarMobile ul.subItemEffects li.grayscale a.mainItem .imageholder_effect {
    -webkit-filter : grayscale(100%);
    -moz-filter    : grayscale(100%);
    -ms-filter     : grayscale(100%);
    -o-filter      : grayscale(100%);
    filter         : grayscale(100%);
}

#printqEffectPicker .pickerBody ul.effectGallery li.effectContainer.invert .imageEffect,
.effectToolBarMobile ul.subItemEffects li.invert a.mainItem .imageholder_effect {
    -webkit-filter : invert(100%);
    -moz-filter    : invert(100%);
    -ms-filter     : invert(100%);
    -o-filter      : invert(100%);
    filter         : invert(100%);
}

#printqEffectPicker .pickerBody ul.effectGallery li.effectContainer.sepia .imageEffect,
.effectToolBarMobile ul.subItemEffects li.sepia a.mainItem .imageholder_effect {
    -webkit-filter : sepia(100%);
    -moz-filter    : sepia(100%);
    -ms-filter     : sepia(100%);
    -o-filter      : sepia(100%);
    filter         : sepia(100%);
}

#printqEffectPicker .pickerBody ul.effectGallery li.effectContainer.vintagePinhole .imageEffect,
.effectToolBarMobile ul.subItemEffects li.vintagePinhole a.mainItem .imageholder_effect {
    -webkit-filter : url(#vintagePinhole);
    -moz-filter    : url(#vintagePinhole);
    -ms-filter     : url(#vintagePinhole);
    -o-filter      : url(#vintagePinhole);
    filter         : url(#vintagePinhole);
}

#printqEffectPicker .pickerBody ul.effectGallery li.effectContainer.kodachrome .imageEffect,
.effectToolBarMobile ul.subItemEffects li.kodachrome a.mainItem .imageholder_effect {
    -webkit-filter : url(#kodachrome);
    -moz-filter    : url(#kodachrome);
    -ms-filter     : url(#kodachrome);
    -o-filter      : url(#kodachrome);
    filter         : url(#kodachrome);
}

#printqEffectPicker .pickerBody ul.effectGallery li.effectContainer.technicolor .imageEffect,
.effectToolBarMobile ul.subItemEffects li.technicolor a.mainItem .imageholder_effect {
    -webkit-filter : url(#technicolor);
    -moz-filter    : url(#technicolor);
    -ms-filter     : url(#technicolor);
    -o-filter      : url(#technicolor);
    filter         : url(#technicolor);
}

#printqEffectPicker .pickerBody ul.effectGallery li.effectContainer.brownie .imageEffect,
.effectToolBarMobile ul.subItemEffects li.brownie a.mainItem .imageholder_effect {
    -webkit-filter : url(#brownie);
    -moz-filter    : url(#brownie);
    -ms-filter     : url(#brownie);
    -o-filter      : url(#brownie);
    filter         : url(#brownie);
}

#svgEffects {
    display  : none;
    position : absolute;
    left     : -1500px;
    top      : -1500px;
}

#printqEffectPicker .pickerInfo.brightness_contrast_effects {
    top : 48px;
}


#printqEffectPicker .pickerInfo.brightness_contrast_effects {
    top : 48px;
}

#printqEffectPicker .effectsPickerBody,
#printqEffectPicker .bightnessContrastPickerBody {
    display : none;
}

#printqEffectPicker.myeffects .effectsPickerBody,
#printqEffectPicker.brightness_contrast .bightnessContrastPickerBody {
    display : block;
}

.brightnessContrastImageWrapper #currentImage {
    max-width  : 280px;
    height     : auto;
    width      : auto;
    max-height : 200px
}

.brightnessContrastImageWrapper {
    text-align : center;
    padding    : 20px;
}

.sliderPipe {
    width            : 2px;
    height           : 8px;
    display          : inline-block;
    background-color : rgba(150, 155, 167, 1);
    position         : absolute;
    top              : -4px;
    left             : 50%;
}

.slidersWrapper {
    padding : 0 20px;
}

.sliderValues {
    font-size   : 10px;
    float       : left;
    line-height : 15px;
}

#printqContrastSlider, #printqBrightnessSlider {
    width     : 100%;
    max-width : 100%;
}

#printqBrightnessSlider, #printqContrastSlider {
    width      : 100%;
    height     : 100%;
    max-width  : 100%;
    max-height : 30px;
    z-index    : 56;
}

#printqBrightnessSlider .leftContainer, #printqContrastSlider .leftContainer {
    width : 60px;
    float : left;
}

#printqBrightnessSlider .leftContainer span, #printqContrastSlider .leftContainer span {
    font-size   : 12px;
    color       : rgba(150, 155, 167, 1);
    margin      : 0px;
    line-height : 15px;
}

#printqBrightnessSlider .rightContainer, #printqContrastSlider .rightContainer {
    width  : 280px;
    height : 100%;
    float  : left;
}

#printqBrightnessSlider .rightContainer #brightnessSlider, #printqContrastSlider .rightContainer #contrastSlider {
    top    : 7px;
    width  : 87%;
    float  : left;
    margin : 0 8px;
}

#printqBrightnessSlider .rightContainer .ui-widget-content, #printqContrastSlider .rightContainer .ui-widget-content {
    border           : 1px solid #DDDDDD;
    background       : none;
    color            : #333333;
    background-color : rgb(51, 160, 214);
    box-shadow       : inset 0.5px 0.866px 3px 0 rgba(0, 0, 0, 0.11);
    height           : 3px;
}

.sliderPipe {
    width            : 2px;
    height           : 8px;
    display          : inline-block;
    background-color : rgba(150, 155, 167, 1);
    position         : absolute;
    top              : -4px;
    left             : 50%;
}

#printqBrightnessSlider .rightContainer .ui-slider-handle, #printqContrastSlider .rightContainer .ui-slider-handle {
    top : -7px;
}

#printqBrightnessSlider .rightContainer .ui-state-default, #printqContrastSlider .rightContainer .ui-state-default {
    width       : 14px;
    height      : 14px;
    margin-left : -.3em;
}

#printqImagePicker .facebookPickerBody .allFacebookalbums {
    height  : 100%;
    width   : 100%;
    padding : 0px;
}

/**fxEffectPrintPicker**/
#fxEffectPrintPicker {
    background-color : #FBFBFD;
    box-shadow       : 1px 1.732px 5px 0px rgba(0, 0, 0, 0.043);
    width            : 100%;
    height           : 100%;
    max-width        : 385px;
    right            : -1500px;
    left             : -1500px;
    position         : fixed;
    top              : 100px;
    border           : 1px solid #C7C7C7;
    z-index          : 1000;
}

#fxEffectPrintPicker {
    max-height : 346px;
}

#fxEffectPrintPicker .fxInfo {
    width            : 50px;
    height           : 50px;
    position         : absolute;
    left             : -50px;
    line-height      : 50px;
    text-align       : center;
    background-color : #FBFBFD;
    box-shadow       : 1px 1.732px 5px 0px rgba(0, 0, 0, 0.043);
    border           : 1px solid #C7C7C7;
    top              : -1px;
    cursor           : pointer;
}

#fxEffectPrintPicker .fxInfo span {
    vertical-align : middle;
    font-size      : 27px;
    top            : 10px;
    position       : relative;
    color          : rgba(150, 155, 167, 1);
}

#fxEffectPrintPicker .pickerBody div.fx_options {
    height   : 100%;
    position : relative;
}

#fxEffectPrintPicker .pickerBody div.fx_select_option {
    width          : 90px;
    height         : 90px;
    top            : 50%;
    position       : absolute;
    display        : block;
    border         : 1px solid #CCCCCC;
    -moz-transform : translateY(-50%);
    -ms-transform  : translateY(-50%);
    -o-transform   : translateY(-50%);
    transform      : translateY(-50%);
    cursor         : pointer;
}

#fxEffectPrintPicker .pickerBody div.fx_select_option.cmyk {
    left : 25px;
}

#fxEffectPrintPicker .pickerBody div.fx_select_option.spot {
    left              : 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%);
}

#fxEffectPrintPicker .pickerBody div.fx_select_option.texture {
    right : 25px;
}

#fxEffectPrintPicker .pickerBody div.fx_select_option div.image_title {
    width           : 100%;
    height          : 80%;
    background-size : cover;
}


#fxEffectPrintPicker .pickerBody div.fx_select_option:hover .mask, #fxEffectPrintPicker .pickerBody div.fx_select_option.current .mask {
    background-color : rgb(29, 44, 63);
}

#fxEffectPrintPicker .pickerBody div.fx_select_option:hover .ico, #fxEffectPrintPicker .pickerBody div.fx_select_option.current .ico {
    opacity : 1;
}

#fxEffectPrintPicker .pickerBody div.fx_select_option div.title {
    text-align     : center;
    font-size      : 11px;
    height         : 20%;
    vertical-align : middle;
    line-height    : 19px;
}

#fxEffectPrintPicker .pickerBody div.fx_select_option .mask {
    background-color : unset;
    opacity          : 0.7;
    width            : 100%;
    height           : 100%;
    position         : absolute;

    left             : 0px;
    top              : 0;
}

#fxEffectPrintPicker.edit .pickerBody div.fx_select_option .mask {
    -webkit-transition : background-color 0.1s ease;
    -moz-transition    : background-color 0.1s ease;
    -ms-transition     : background-color 0.1s ease;
    -o-transition      : background-color 0.1s ease;
    transition         : background-color 0.1s ease;
}

#fxEffectPrintPicker.edit .pickerBody div.fx_select_option .ico {
    -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;
}

#fxEffectPrintPicker .pickerBody div.fx_select_option .ico {
    width            : 30px;
    height           : 30px;
    position         : absolute;
    margin           : 0 auto;
    left             : 30px;
    top              : 30px;
    background-color : #33A0D6;
    opacity          : 0;
    font-size        : 14px;
    line-height      : 30px;
    color            : #FFFFFF;
    text-align       : center;
}

.printqToolbar .fx_group .icon {
    font-family : 'Lato' !important;
}

/** end fxEffectPrintPicker**/
.colorContainer ul li.transparentColor {
    display : none;
}

.mainTabsColorContainer.bgcolor .colorContainer ul li.transparentColor {
    display : block;
}

.colorContainer ul li.transparentColor {
    opacity          : 0.5;
    background-color : rgba(0, 0, 0, 0.1);
}

.colorContainer ul li.transparentColor .line1 {
    width             : 2px;
    height            : 40px;
    border-left       : 2px solid red;
    position          : absolute;
    top               : -7px;
    left              : 12px;
    -webkit-transform : rotate(-45deg);
    -moz-transform    : rotate(-45deg);
    transform         : rotate(-45deg);
}

.colorContainer ul li.hide {
    display : none;
}

/* start imageToShapeContainerToolbar*/
#imageToShapeContainerToolbar {
    background-color : #FBFBFD;
    box-shadow       : 1px 1.732px 5px 0px rgba(0, 0, 0, 0.043);
    width            : 100%;
    height           : 100%;
    max-width        : 385px;
    right            : -1500px;
    left             : -1500px;
    position         : fixed;
    top              : 100px;
    border           : 1px solid #C7C7C7;
    z-index          : 1000;
    max-height       : 346px;
}

#imageToShapeContainerToolbar .pickerBody {
    overflow : hidden;
    display  : block;
    width    : 100%;
    height   : 100%;
    padding  : 15px;
}

#imageToShapeContainerToolbar .pickerBody .potraceimageContainer {
    width    : 100%;
    height   : 65%;
    display  : block;
    position : relative;
}

#imageToShapeContainerToolbar .pickerBody .ui-widget-content {
    border           : 1px solid #DDDDDD;
    background       : none;
    color            : #333333;
    background-color : rgb(51, 160, 214);
    box-shadow       : inset 0.5px 0.866px 3px 0 rgba(0, 0, 0, 0.11);
    height           : 3px;
    width            : 90%;
    margin-top       : 13px;
    margin-bottom    : 18px;
}

#imageToShapeContainerToolbar .pickerBody .ui-state-default {
    border        : 2px solid rgba(150, 155, 167, 1);
    background    : #FFFFFF;
    font-weight   : bold;
    color         : #1C94C4;
    border-radius : 20px;
    outline       : none;
    width         : 1.2em;
    height        : 1.2em;
    text-align    : center;
    cursor        : pointer;
    top           : -10px;
}

#loading-mask-potrace {
    position         : absolute;
    top              : 0px;
    width            : 100%;
    text-align       : center;
    height           : 100%;
    display          : none;
    background-color : rgba(29, 44, 63, 1);
}

#loading-mask-potrace > div {
    width             : 18px;
    height            : 18px;
    background-color  : #FFFFFF;
    border-radius     : 100%;
    display           : inline-block;
    -webkit-animation : sk-bouncedelay 1.4s infinite ease-in-out both;
    animation         : sk-bouncedelay 1.4s infinite ease-in-out both;
    position          : relative;
    top               : 50%;
}

#loading-mask-potrace .bounce2 {
    -webkit-animation-delay : -0.16s;
    animation-delay         : -0.16s;
}

#loading-mask-potrace .bounce1 {
    -webkit-animation-delay : -0.32s;
    animation-delay         : -0.32s;
}

#imageToShapeContainerToolbar .pickerBody .potraceimageContainer.processing #loading-mask-potrace {
    display : block;
}

#imageToShapeContainerToolbar .pickerBody .title_slider p {
    margin-left   : 0px;
    margin-top    : 5px;
    margin-bottom : 10px;
}

#imageToShapeContainerToolbar .pickerBody .slider .slider_value {
    position  : absolute;
    right     : -35px;
    top       : -8px;
    font-size : 14px;
}

#imageToShapeContainerToolbar .pickerBody .actionsContainer .button_imagetoshape {
    width       : 100px;
    height      : 25px;
    border      : 1px solid rgba(150, 155, 167, 1);
    text-align  : center;
    line-height : 25px;
    font-size   : 14px;
}

#imageToShapeContainerToolbar .pickerBody .actionsContainer .button_imagetoshape a {
    width           : 100%;
    display         : block;
    height          : 100%;
    text-decoration : none;
    color           : rgba(150, 155, 167, 1);
}

#imageToShapeContainerToolbar .pickerBody .actionsContainer .button_imagetoshape.close {
    float : left;
}

#imageToShapeContainerToolbar .pickerBody .actionsContainer .button_imagetoshape.confirm {
    float : right;
}

#imageToShapeContainerToolbar .invert_threshold {
    margin-top : 5px;
    cursor     : pointer;
}

#imageToShapeContainerToolbar .invert_threshold .invertConvert {
    vertical-align : middle;
    cursor         : pointer;
    margin-left    : 12px;
}

.printqDefaultToolbar.printqToolbar.group .fx_group {
    display : none;
}

/*end imageToShapeContainerToolbar*/

/*fxContainer*/
.fxContainerPopup {
    display          : none;
    width            : 100%;
    height           : 100%;
    background-color : rgba(0, 0, 0, 0.5);
    position         : absolute;
    left             : 0px;
    top              : 0px;
    z-index          : 99999;
}

.fxContainerPopup .fxMainContainer {
    max-width         : 750px;
    max-height        : 650px;
    left              : 50%;
    top               : 50%;
    transform         : translate(-50%, -50%);
    -webkit-transform : translate(-50%, -50%);
    -moz-transform    : translate(-50%, -50%);
    -ms-transform     : translate(-50%, -50%);
    -o-transform      : translate(-50%, -50%);
    width             : 750px;
    height            : 650px;
    position          : absolute;
}

.fxContainerPopup .fxMainContainer .title {
    height        : 40px;
    line-height   : 40px;
    border-bottom : 1px solid #E8E8E8;
    display       : block;
    position      : relative;

}

.fxContainerPopup .fxMainContainer .title .step {
    width             : 20px;
    display           : block;
    position          : absolute;
    height            : 18px;
    top               : 50%;
    transform         : translateY(-50%);
    -webkit-transform : translateY(-50%);
    -moz-transform    : translateY(-50%);
    -ms-transform     : translateY(-50%);
    -o-transform      : translateY(-50%);
    line-height       : 18px;
    background-color  : rgba(150, 155, 167, 1);
    color             : #FFFFFF;
    text-align        : center;
    font-size         : 13px;
}

.fxContainerPopup .fxMainContainer .title .step:after {
    content       : '';
    position      : absolute;
    right         : -7px;
    top           : 0;
    width         : 0;
    height        : 0;
    border-left   : -15px solid transparent;
    clear         : both;
    border-top    : 9px solid transparent;
    border-bottom : 9px solid transparent;
    border-left   : 7px solid rgba(150, 155, 167, 1);
}

.fxContainerPopup .fxMainContainer .title.step2 {
    border-top : 1px solid #E8E8E8;
}

.fxContainerPopup .fxMainContainer .text {
    margin-left : 45px;
    font-size   : 15px;
}

.fxContainerPopup .fxMainContainer .close {
    display           : block;
    position          : absolute;
    right             : 10px;
    top               : 50%;
    font-size         : 20px;
    width             : 10px;
    line-height       : 20px;
    -webkit-transform : translateY(-50%);
    -moz-transform    : translateY(-50%);
    -ms-transform     : translateY(-50%);
    -o-transform      : translateY(-50%);
    cursor            : pointer;
}

.fxContainerPopup .fxType {
    width      : 110px;
    height     : 110px;
    display    : inline-block;
    position   : relative;
    text-align : center;
    margin     : 15px;
}

.fxContainerPopup .fxType .round_content {
    width               : 80px;
    height              : 80px;
    background-color    : #CCCCCC;
    border-radius       : 50%;
    display             : inline-block;
    position            : relative;
    cursor              : pointer;
    background-size     : cover;
    background-position : center center;
    background-repeat   : no-repeat;
}

.fxContainerPopup .fxType .round_content .active_check {
    width            : 28px;
    height           : 28px;
    display          : none;
    background-color : #3F9C02;
    border-radius    : 50%;
    right            : 0px;
    position         : absolute;
    border           : 2px solid #FFFFFF;
    top              : 0px;
    font-size        : 10px;
    text-align       : center;
    line-height      : 26px;
    color            : #FFFFFF;
}

.fxContainerPopup .fxType .round_content.active .active_check {
    display : block
}

.fxContainerPopup .fxType .text {
    margin-left   : 0px;
    font-size     : 12px;
    margin-top    : 10px;
    display       : block;
    position      : relative;
    width         : 100%;
    height        : 20px;
    overflow      : hidden;
    text-overflow : ellipsis;
    white-space   : nowrap;
}

.fxContainerPopup .fxMainContainer .fxTypes {
    text-align : center;
}

.fxContainerPopup .confirm_btn,
.fxContainerPopup .close_btn {
    line-height : 30px;
    height      : 30px;
    display     : block;
    width       : 120px;
    float       : right;
}

.fxContainerPopup .confirm_btn {
    float : right;
}

.fxContainerPopup .close_btn {
    float : left;
}

.fxContainerPopup .confirm_btn a,
.fxContainerPopup .close_btn a {
    color           : rgba(150, 155, 167, 1);
    width           : 100%;
    height          : 100%;
    display         : block;
    text-align      : center;
    text-decoration : none;
    border          : 1px solid rgba(150, 155, 167, 1);
    font-size       : 14px;
}

.fxContainerPopup .confirm_btn a span.title_btn,
.fxContainerPopup .close_btn a span.title_btn {
    display        : block;
    vertical-align : top;
    text-align     : center;
    width          : 100%;
}

.fxContainerPopup .actions {
    display    : block;
    height     : 52px;
    padding    : 10px 10px;
    width      : 100%;
    border-top : 1px solid #E8E8E8;
}

.fxContainerPopup.edit {
    display : block;
}

.fxContainerPopup .options_effect_container .switcherContainer {
    display      : block;
    width        : 35%;
    height       : 110px;
    float        : left;
    border-right : 1px solid #E8E8E8;
}

.fxContainerPopup .options_effect_container .switcherContainer .title_spec,
.fxContainerPopup .options_effect_container .sliderContainer .title_spec {
    font-size      : 11px;
    color          : #505050;
    text-align     : center;
    padding-top    : 20px;
    font-weight    : 500;
    padding-bottom : 13px;
}

.fxContainerPopup .options_effect_container .switcherContainer .box,
.fxContainerPopup .options_effect_container .sliderContainer .box {
    width      : 40px;
    text-align : center;
    float      : left;
}

.fxContainerPopup .options_effect_container .switcherContainer .box.left,
.fxContainerPopup .options_effect_container .sliderContainer .box.left {
    margin-left : 25px;
    position    : relative;
}

.fxContainerPopup .options_effect_container .switcherContainer .box span.icon_fontawesome,
.fxContainerPopup .options_effect_container .sliderContainer .box span.icon_fontawesome {
    font-size : 38px;
}

.fxContainerPopup .options_effect_container .switcherContainer .box span.iconsax,
.fxContainerPopup .options_effect_container .sliderContainer .box span.iconsax {
    font-size : 33px;
    display   : block;
    position  : relative;
}

.fxContainerPopup .options_effect_container .switcherContainer .box span.box_title,
.fxContainerPopup .options_effect_container .sliderContainer .box span.box_title {
    font-size   : 11px;
    text-align  : center;
    line-height : 11px;
    display     : block;
    margin-top  : 8px;
}

.fxContainerPopup .options_effect_container .sliderContainer {
    display : block;
    width   : 65%;
    height  : 100px;
    float   : left;
}

.fxContainerPopup .options_effect_container .switcherContainer .on_off_switcher_slider {
    width               : 39px;
    float               : left;
    margin              : 0 20px;
    background          : none;
    color               : #333333;
    background-color    : #EAE7E7;
    height              : 5px;
    border-radius       : 0px;
    margin-top          : 15px;
    border              : none;
    -moz-user-select    : none;
    -khtml-user-select  : none;
    -webkit-user-select : none;
    -o-user-select      : none;
    user-select         : none;
    position            : relative;
}

.fxContainerPopup .options_effect_container .switcherContainer .on_off_switcher_slider:after {
    position           : absolute;
    content            : '';
    -webkit-transform  : translate(0);
    -ms-transform      : translate(0);
    transform          : translateX(0);
    transition         : all 0.2s ease-in-out;
    -webkit-transition : all 0.2s ease-in-out;
    -moz-transition    : all 0.2s ease-in-out;
    border-radius      : 50%;
    margin-top         : -10px;
    width              : 22px;
    height             : 22px;
    background         : none rgba(150, 155, 167, 1);
    border             : 2px solid rgb(255, 255, 255);
    outline            : none;
    cursor             : pointer;
}

.fxContainerPopup .options_effect_container .switcherContainer .on_off_switcher_slider.on:after {
    -webkit-transform : translate(17px);
    -ms-transform     : translate(17px);
    transform         : translateX(17px);
}

.fxContainerPopup .options_effect_container .sliderContainer .refinement_slider {
    width            : 210px;
    float            : left;
    margin           : 0 20px;
    background       : none;
    color            : #333333;
    background-color : #EAE7E7;
    height           : 5px;
    border-radius    : 0px;
    margin-top       : 15px;
    border           : none;
}

.fxContainerPopup .options_effect_container .switcherContainer .on_off_switcher_slider .ui-slider-handle.ui-state-default,
.fxContainerPopup .options_effect_container .sliderContainer .refinement_slider .ui-slider-handle.ui-state-default {
    left          : 0%;
    border-radius : 50%;
    margin-top    : -5px;
    width         : 26px;
    height        : 26px;
    background    : none rgba(150, 155, 167, 1);
    border        : 2px solid rgb(255, 255, 255);
    outline       : none;
    cursor        : pointer;
}

.fxContainerPopup .options_effect_container {
    border-bottom : 1px solid #E8E8E8;
    height        : 110px;
}

.fxContainerPopup .effect_result_container {
    height   : 265px;
    display  : block;
    position : relative;
}

.fxContainerPopup .subContainer {
    background-color : #FFFF;
}

.fxContainerPopup .fxMainContainer .step2 {
    display : none;
}

.fxContainerPopup.step2 .fxMainContainer .step2 {
    display : block;
}

.fxContainerPopup .effect_result_container .placeholderResult {
    width               : 100%;
    height              : 100%;
    display             : block;
    background-size     : contain;
    background-position : center center;
    background-repeat   : no-repeat;
}

#loading-mask-refinement {
    position   : absolute;
    text-align : center;
    z-index    : 99999;
    width      : 100%;
    height     : 100%;
    background : rgba(240, 240, 240, 1) !important;
    top        : 0;
    display    : none;
}

#loading-mask-refinement .loader {
    position          : absolute;
    top               : 50%;
    left              : 50%;
    width             : 300px;

    padding           : 10px;
    transform         : translate(-50%, -50%);
    -webkit-transform : translate(-50%, -50%);
    -moz-transform    : translate(-50%, -50%);
    -ms-transform     : translate(-50%, -50%);
    -o-transform      : translate(-50%, -50%);
}

#loading-mask-refinement .loader > span {
    width       : 100%;
    line-height : 30px;
    margin      : 0 auto 10px;
    font-size   : 17px;
    font-weight : 300;
    display     : block;
    color       : #384347;
}

/*end fxContainer*/
#printqEditorToolbar.hide_more .moreText_group {
    display : none !important;
}

.sweet-alert .confirmCheckbox_popup input {
    display : inline-block;
    width   : 15px;
    height  : 15px;
}

.confirmCheckbox_popup {
    display : block;
}

.printqToolbar .toolbarSection .group.zoom_group .text_zoom {
    float : left;
}

.printqToolbar .toolbarSection .group.zoom_group .text_zoom a {
    margin : 0 10px;
}
#printqEditorToolbar.printqToolbar .toolbarSection .group.zoom_group{
        cursor: not-allowed;
    opacity: 0.5;
}
#printqEditorToolbar.printqToolbar .toolbarSection .group.zoom_group a{
     cursor: not-allowed;
}
#printqEditorToolbar.printqToolbar.edit_block .toolbarSection .group.zoom_group{
        cursor: pointer;
    opacity: 1;
}
#printqEditorToolbar.printqToolbar.edit_block .toolbarSection .group.zoom_group a{
     cursor: pointer;
}


.tabsContainer.svgTabs
{
    display:flex;
    flex-direction: row;
    flex-wrap: wrap;
    background-color: #EFEFEF;
    width: 384px;
}

.tabsContainer.svgTabs div
{
    width:33%;
}

.tabsContainer.svgTabs div .squareColor
{
    border-radius: 50%;
    width: 100%;
    height: 100%;
    border: 1px solid #CCCCCC;
    display: flex;
    justify-content: center;
    align-items: center;
}

.tabsContainer.svgTabs div .squareColor .activeSvgTab {
    display: none;
}
.tabsContainer.svgTabs div.current .squareColor .activeSvgTab {
    display: block;
}

.tabsContainer.svgTabs .color
{
    display: flex;
    justify-content: flex-start;
    align-items: center;        
    width: 34px;
    height: 34px;
    padding: 5px;     
}

.tabsContainer.svgTabs .color.current
{
    background-color: white;
}


.svgColorLine1 {
    position: relative;
    height: 24px;
    width: 12px;
    left: 11px;
    top: -1px;
    border-bottom-right-radius: 12px;
    border-top-right-radius: 12px;
    border: 1px solid #cccccc;
    border-left: none;
}
.svgColorLine2 {
    position: relative;
    height: 22px;
    width: 6px;
    left: 8px;
    top: -24px;
    border-radius: 2px;
}

.tabsContainer.svgTabs div.current .squareColor .activeSvgTab {
    width: 14px;
    background-color: white;
    height: 14px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.tabsContainer.svgTabs div.current .squareColor .activeSvgTab span{
    color:black;
    font-size: 10px;
    font-weight: 800;
}