/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */

legend,
td,
th {
    padding: 0
}

body,
h1,
p {
    margin: 0
}

html {
    font-family: sans-serif;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
    box-sizing: border-box
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
    display: block
}

audio,
canvas,
progress,
video {
    display: inline-block;
    vertical-align: baseline
}

audio:not([controls]) {
    display: none;
    height: 0
}

[hidden],
template {
    display: none
}

a {
    background-color: transparent;
    color: #133C7F;
    text-decoration: none
}

.pica-btn__link:active,
.pica-btn__link:focus,
.pica-btn__link:hover,
a:active,
a:focus,
a:hover {
    text-decoration: underline
}

a:active,
a:hover {
    outline: 0
}

abbr[title] {
    border-bottom: 1px dotted
}

b,
optgroup,
strong {
    font-weight: 700
}

dfn {
    font-style: italic
}

h1 {
    font-size: 2em;
    padding: 0 0 .9375em
}

mark {
    background: #ff0;
    color: #000
}

small {
    font-size: 80%
}

sub,
sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline
}

sup {
    top: -.5em
}

sub {
    bottom: -.25em
}

img {
    border: 0
}

svg:not(:root) {
    overflow: hidden
}

figure {
    margin: 1em 40px
}

hr {
    box-sizing: content-box;
    height: 0
}

pre,
textarea {
    overflow: auto
}

code,
kbd,
pre,
samp {
    font-family: monospace, monospace;
    font-size: 1em
}

button,
input,
optgroup,
select,
textarea {
    color: inherit;
    font: inherit;
    margin: 0
}

.f-d1,
.f-d2,
a:active,
a:focus,
a:hover,
body {
    color: #133C7F
}

button {
    overflow: visible
}

button,
select {
    text-transform: none
}

button,
html input[type=button],
input[type=reset],
input[type=submit] {
    -webkit-appearance: button;
    cursor: pointer
}

button[disabled],
html input[disabled] {
    cursor: default
}

button::-moz-focus-inner,
input::-moz-focus-inner {
    border: 0;
    padding: 0
}

input {
    line-height: normal
}

input[type=checkbox],
input[type=radio] {
    box-sizing: border-box;
    padding: 0
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    height: auto
}

input[type=search] {
    -webkit-appearance: textfield;
    box-sizing: content-box
}

input[type=search]::-webkit-search-cancel-button,
input[type=search]::-webkit-search-decoration {
    -webkit-appearance: none
}

fieldset {
    border: 1px solid silver;
    margin: 0 2px;
    padding: .35em .625em .75em
}

legend {
    border: 0
}

table {
    border-collapse: collapse;
    border-spacing: 0
}

*,
::after,
::before {
    box-sizing: inherit
}

body {
    font: 400 100%/1.3 "Univers Deutsche Bank", Arial, sans-serif;
    font-size: 16px
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: 400
}

p {
    padding: 0 0 1.875em
}

@media (min-width:528px) {
    h1 {
        margin: 0;
        padding: 0 0 .625em
    }
    p {
        padding: 0 0 1.25em
    }
}

.f-d1 {
    font-size: 2.5em;
    line-height: 2.875em
}

.f-d2 {
    font-size: 1.375em;
    line-height: 1.625em
}

.f-d4,
.f-d5 {
    font-size: 1em
}

.f-d3,
.pica-gallery__area-category-headline,
.pica-gallery__area-thumbselect-headline,
.pica-gallery__pick-category {
    color: #133C7F;
    font-size: 1em;
    line-height: 1.25em
}

.f-d4 {
    color: #2282C1;
    line-height: 1.25em
}

.f-d5,
.f-m1,
.f-m2 {
    line-height: 1.21875em
}

.f-d5 {
    color: grey
}

.f-m1,
.f-m2,
.f-m4 {
    font-size: .8125em
}

.f-m1 {
    color: #133C7F
}

.f-m2 {
    color: #2282C1
}

.f-m3,
.pica-gallery__area-category-image-description {
    color: #666;
    font-size: .8125em;
    line-height: 1.21875em
}

.f-m4 {
    background-color: #d8d8d8;
    color: #fff;
    line-height: 1.21875em
}

.f-i1,
.f-i2 {
    font-size: .6875em;
    line-height: 1.21875em
}

.f-i1 {
    color: #666
}

.f-i2 {
    color: #133C7F
}

.f-i3 {
    color: grey;
    font-size: .5625em;
    line-height: .6875em
}

.clearfix::after,
.pica-area-page::after,
.pica-gallery::after,
.pica-gallery__area-category::after,
.pica-gallery__area-thumbselect::after,
.pica-page-custom-imageeditor-buttons::after,
.pica-page-custom-imageselect-buttons::after,
.pica-page-gallery-buttons::after {
    clear: both;
    content: '';
    display: table
}

.container {
    max-width: 1180px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 1.25em;
    padding-right: 1.25em;
    width: 100%
}

.hide-text {
    overflow: hidden;
    padding: 0;
    text-indent: 101%;
    white-space: nowrap
}

.visually-hidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -.0625em;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: .0625em
}

@media (max-width:28.74em) {
    .hidden-xs {
        display: none!important
    }
}

@media (min-width:28.75em) and (max-width:32.99em) {
    .hidden-sm {
        display: none!important
    }
}

@media (min-width:28.75em) and (max-width:46.74em) {
    .hidden-md {
        display: none!important
    }
    .pica-page-custom-imageeditor-buttons {
        text-align: center
    }
}

@media (min-width:46.75em) {
    .hidden-lg {
        display: none!important
    }
}

@media (min-width:46.75em) and (-webkit-min-device-pixel-ratio:2) {
    .hidden-lg-retina {
        display: none!important
    }
}

@media (min-width:46.75em) and (min-resolution:192dpi) {
    .hidden-lg-retina {
        display: none!important
    }
}

@media (min-width:28.75em) and (max-width:46.74em) and (-webkit-min-device-pixel-ratio:2) {
    .hidden-md-retina {
        display: none!important
    }
}

@media (min-width:28.75em) and (max-width:46.74em) and (min-resolution:192dpi) {
    .hidden-md-retina {
        display: none!important
    }
}

@media (max-width:28.74em) and (-webkit-min-device-pixel-ratio:2) {
    .hidden-sm-retina {
        display: none!important
    }
}

@media (max-width:28.74em) and (min-resolution:192dpi) {
    .hidden-sm-retina {
        display: none!important
    }
}

.is-invisible,
.pica-header #pica_logo {
    display: none !important;
}

.is-flipped-h {
    -moz-transform: scaleX(-1);
    -webkit-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    transform: scaleX(-1);
    -ms-filter: fliph;
    filter: fliph
}

.is-flipped-v {
    -moz-transform: scaleY(-1);
    -webkit-transform: scaleY(-1);
    -o-transform: scaleY(-1);
    transform: scaleY(-1);
    -ms-filter: flipv;
    filter: flipv
}

.is-flipped-hv {
    -moz-transform: scaleX(-1) scaleY(-1);
    -webkit-transform: scaleX(-1) scaleY(-1);
    -o-transform: scaleX(-1) scaleY(-1);
    transform: scaleX(-1) scaleY(-1);
    -ms-filter: fliph flipv;
    filter: fliph flipv
}

.pica-header {
    width: 100%
}

.pica-header__close {
    position: absolute;
    top: .3125em;
    right: .3125em;
    height: 1.5em;
    width: 1.5em;
    background: url(../img/close_icon.svg) 0 center no-repeat;
    cursor: pointer
}

.pica-header__tabs {
    margin-bottom: 1em;
    padding-top: 1.25em;
    border-bottom: 1px solid #ddecf6
}

@media (min-width:748px) {
    .pica-header__tabs {
        margin: 0 .625em 1.25em;
        padding-top: 3.125em
    }
}

.pica-header__tabs:after {
    clear: both;
    content: '';
    display: table
}

.pica-header__tabs__tab {
    position: relative;
    float: left;
    width: 50%;
    padding: 0 0 .25em;
    border-bottom: .375em solid transparent;
    cursor: pointer;
    text-align: center;
    color: #2282C1;
    font-size: .8125em;
    line-height: 1.21875em
}

@media (min-width:28.75em) {
    .pica-header__tabs__tab {
        color: #2282C1;
        font-size: 1em;
        line-height: 1.25em;
        width: 8.4375em;
        min-width: 8.4375em;
        margin: 0 auto;
        padding: 0 0 .9375em
    }
}

.pica-header__tabs__tab.is-selected {
    border-bottom-color: #ddecf6;
    color: #133C7F;
    font-size: .8125em;
    line-height: 1.21875em
}

@media (min-width:28.75em) {
    .pica-header__tabs__tab.is-selected {
        color: #133C7F;
        font-size: 1em;
        line-height: 1.25em
    }
}

@media (min-width:46.75em) {
    .pica-header__tabs__tab.is-selected:after {
        display: block;
        position: absolute;
        left: 50%;
        bottom: -1em;
        width: 0;
        height: 0;
        margin: 0 auto 0 -1em;
        border-left: .625em solid transparent;
        border-right: .625em solid transparent;
        border-top: .625em solid #ddecf6;
        border-width: 1em 1em 0;
        content: ' '
    }
}

.pica-footer {
    text-align: center
}

@media (max-width:527px) {
    .pica-footer .pica_textbutton {
        display: table;
        margin: 0 auto 1.875em
    }
    .pica_page h1,
    .pica_page h2,
    .pica_page h3 {
        color: #133C7F;
        font-size: 1em;
        line-height: 1.25em
    }
    .pica_page li,
    .pica_page p {
        color: #133C7F;
        font-size: .8125em;
        line-height: 1.21875em
    }
    .pica_page h1,
    .pica_page h2,
    .pica_page h3,
    .pica_page ol,
    .pica_page p,
    .pica_page ul {
        padding-left: .625em;
        padding-right: .625em
    }
    .pica_page ul li {
        margin-left: .625em
    }
}

@media (min-width:528px) {
    .pica_page h1,
    .pica_page h2,
    .pica_page p {
        color: #133C7F
    }
    .pica_page h1 {
        font-size: 1.375em;
        line-height: 1.625em
    }
    .pica_page h2 {
        font-size: 1em;
        line-height: 1.25em
    }
    .pica_page li,
    .pica_page p {
        font-size: .8125em;
        line-height: 1.21875em
    }
    .pica_page li {
        color: #666
    }
}

.pica-btn,
.pica-btn__link,
.pica-btn__primary,
.pica-btn__secondary {
    height: 2.5em;
    margin: 1.875em 0;
    padding: 0 1.25em;
    cursor: pointer;
    text-align: center;
    float: left
}

.pica-btn__primary {
    color: #fff;
    font-size: .8125em;
    background-color: #2282C1;
    border-radius: .1875em;
    -webkit-border-radius: .1875em;
    -moz-border-radius: .1875em;
    box-shadow: 0 0 2px 0 rgba(0, 0, 0, .12), 0 2px 2px 0 rgba(0, 0, 0, .25);
    -webkit-box-shadow: 0 0 2px 0 rgba(0, 0, 0, .12), 0 2px 2px 0 rgba(0, 0, 0, .25);
    -moz-box-shadow: 0 0 2px 0 rgba(0, 0, 0, .12), 0 2px 2px 0 rgba(0, 0, 0, .25);
    line-height: 2.5em
}

.pica-btn__primary:focus,
.pica-btn__primary:hover {
    background-color: #5093C0
}

.pica-btn__primary:active {
    background-color: #5093C0;
    box-shadow: 0 0 8px 0 rgba(0, 0, 0, .12), 0 6px 8px 0 rgba(0, 0, 0, .24);
    -webkit-box-shadow: 0 0 8px 0 rgba(0, 0, 0, .12), 0 6px 8px 0 rgba(0, 0, 0, .24);
    -moz-box-shadow: 0 0 8px 0 rgba(0, 0, 0, .12), 0 6px 8px 0 rgba(0, 0, 0, .24)
}

.pica-btn__primary.is-disabled {
    opacity: .2;
    background: #999;
    box-shadow: 0 2px 3px 0 rgba(0, 0, 0, .25);
    -webkit-box-shadow: 0 2px 3px 0 rgba(0, 0, 0, .25);
    -moz-box-shadow: 0 2px 3px 0 rgba(0, 0, 0, .25)
}

.pica-btn__secondary {
    font-size: .8125em;
    background-color: #f4f3f2;
    border-radius: .1875em;
    -webkit-border-radius: .1875em;
    -moz-border-radius: .1875em;
    box-shadow: 0 2px 3px 0 rgba(0, 0, 0, .25);
    -webkit-box-shadow: 0 2px 3px 0 rgba(0, 0, 0, .25);
    -moz-box-shadow: 0 2px 3px 0 rgba(0, 0, 0, .25);
    color: #666;
    line-height: 2.5em
}

.pica-btn__secondary:focus,
.pica-btn__secondary:hover {
    background-color: #F6F6F5
}

.pica-btn__secondary:active {
    background-color: #F6F6F5;
    box-shadow: 0 0 8px 0 rgba(0, 0, 0, .12), 0 6px 8px 0 rgba(0, 0, 0, .24);
    -webkit-box-shadow: 0 0 8px 0 rgba(0, 0, 0, .12), 0 6px 8px 0 rgba(0, 0, 0, .24);
    -moz-box-shadow: 0 0 8px 0 rgba(0, 0, 0, .12), 0 6px 8px 0 rgba(0, 0, 0, .24)
}

.pica-btn__link {
    color: #2282C1;
    font-size: .8125em;
    line-height: 1.21875em;
    line-height: 2.5em;
    background: 0 0;
    padding: 0
}

.pica-btn--arrow-left .svg-icon,
.pica-btn--arrow-right .svg-icon {
    margin-top: -.125em;
    height: 1em;
    width: 1em;
    vertical-align: middle
}

.pica-btn--arrow-left .svg-icon {
    margin-right: .5em
}

.pica-btn--arrow-right .svg-icon {
    margin-left: .5em
}

.pica-btn-hidden-input {
    position: absolute;
    width: .0625em;
    margin: 0 0 0 .0625em;
    /* filter: alpha(opacity: 0); */
    opacity: 0;
    -moz-opacity: 0;
    z-index: 2;
    cursor: pointer
}

.pica-btn-container-vertical {
    display: inline-block;
    position: relative
}

.pica-btn-container-vertical .pica-btn__link,
.pica-btn-container-vertical .pica-btn__primary,
.pica-btn-container-vertical .pica-btn__secondary {
    float: none;
    margin-bottom: 1.875em
}

.pica-btn-container-horizontal .pica-btn__link,
.pica-btn-container-horizontal .pica-btn__primary,
.pica-btn-container-horizontal .pica-btn__secondary {
    margin: 0 1.5625em;
    float: right
}

.pica-btn-container-horizontal--first-left>:first-child {
    float: left
}

.pica-btn-wrapper {
    text-align: center;
    width: 100%
}

@media (max-width:527px) {
    .pica-gallery__thumbnails-and-preview-container .pica-btn-wrapper {
        margin-top: 60%
    }
}

@media (min-width:28.75em) {
    .pica-page-custom-imageeditor-buttons,
    .pica-page-custom-imageselect-buttons,
    .pica-page-gallery-buttons {
        margin-bottom: 1.25em
    }
}

.pica-button-choose-image__text-label,
.pica-button-finalize-custom-img__text-label,
.pica-button-image-upload__text-label {
    line-height: 2.75em
}

ol.progress-indicator {
    margin: 0;
    padding: 0;
    counter-reset: li;
    list-style: none;
    overflow: hidden
}

@media (max-width:527px) {
    ol.progress-indicator {
        padding-left: 1.25em
    }
}

ol.progress-indicator li {
    color: #666;
    font-size: .8125em;
    line-height: 1.21875em
}

@media (min-width:528px) {
    ol.progress-indicator li {
        color: grey;
        font-size: 1em;
        line-height: 1.21875em
    }
}

ol.progress-indicator li span:before {
    content: counter(li) ". ";
    counter-increment: li
}

ol.progress-indicator li.current {
    color: #133C7F;
    font-size: .8125em;
    line-height: 1.21875em
}

@media (min-width:528px) {
    ol.progress-indicator li {
        position: relative;
        /* width: calc(50% - ((6px + 2 * $progress-indicator-arrow-size)/ 2)); */
        margin-left: 46px;
        margin-bottom: 1.25em;
        background: #f2f7fb;
        list-style-image: none;
        list-style-type: none;
        text-align: center;
        font-size: 1em;
        line-height: 1.21875em;
        color: #666
    }
    ol.progress-indicator li span:after,
    ol.progress-indicator li:after {
        position: absolute;
        top: 50%;
        content: " ";
        height: 0;
        width: 0;
        pointer-events: none;
        margin-top: -20px
    }
    ol.progress-indicator li:after {
        left: 100%;
        border: solid transparent;
        border-left-color: #f2f7fb;
        border-width: 20px
    }
    ol.progress-indicator li:first-child {
        margin-left: 0
    }
    ol.progress-indicator li:first-child span {
        padding: 10px
    }
    ol.progress-indicator li:first-child span:after {
        border: none
    }
    ol.progress-indicator li:last-child:after {
        border-width: 0
    }
    ol.progress-indicator li span {
        display: block;
        padding: 10px 30px 10px 10px
    }
    ol.progress-indicator li span:after {
        right: 100%;
        border: solid #f2f7fb;
        border-left-color: transparent;
        border-width: 20px
    }
    ol.progress-indicator>li {
        float: left;
        width: calc(50% - 23px)
    }
    ol.progress-indicator li.current {
        color: #133C7F;
        font-size: 1em;
        line-height: 1.25em;
        background-color: #f2f7fb
    }
    ol.progress-indicator li.current:after {
        border-left-color: #f2f7fb
    }
    ol.progress-indicator li.current span:after {
        border-color: #f2f7fb #f2f7fb #f2f7fb transparent
    }
    ol.progress-indicator li.progress-step1 {
        z-index: 9
    }
    ol.progress-indicator li.progress-step2 {
        z-index: 8
    }
    ol.progress-indicator li.progress-step3 {
        z-index: 7
    }
    ol.progress-indicator li.progress-step4 {
        z-index: 6
    }
    ol.progress-indicator li.progress-step5 {
        z-index: 5
    }
    ol.progress-indicator li.progress-step6 {
        z-index: 4
    }
    ol.progress-indicator li.progress-step7 {
        z-index: 3
    }
    ol.progress-indicator li.progress-step8 {
        z-index: 2
    }
    ol.progress-indicator li.progress-step9 {
        z-index: 1
    }
    ol.progress-indicator li.progress-step10 {
        z-index: 0
    }
    .pica-custom-image-manual__text__heading {
        padding-left: .625em
    }
}

.pica-custom-image-icon {
    background: url(../img/choose-picture.svg) center center no-repeat;
    width: 3.4375em;
    height: 3.3125em;
    margin: 3.125em auto -.625em
}

.pica-custom-image-manual__images {
    display: table;
    table-layout: fixed;
    width: 100%;
    margin-bottom: 1.25em;
    border-top: 1px solid #ddecf6;
    border-bottom: 1px solid #ddecf6
}

.pica-custom-image-manual__images__image-container {
    display: table-cell
}

.pica-custom-image-manual__images__image-container__img,
.pica-custom-image-manual__images__image-container__img--left,
.pica-custom-image-manual__images__image-container__img--right {
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
    height: 7.1875em;
    margin-top: .9375em;
    margin-bottom: 1.25em
}

.pica-custom-image-manual__images__image-container__img--left {
    background-image: url('img/default.jpg')
}

.pica-custom-image-manual__images__image-container__img--right {
    background-image: url('img/default-sw.jpg')
}

.pica-custom-image-manual__text {
    display: table;
    table-layout: fixed;
    width: 100%;
    margin-bottom: 3.125em
}

.pica-custom-image-manual__text__column {
    display: table-cell;
    padding-left: 5.3125em;
    list-style: none
}

.pica-custom-image-manual__text__column-item {
    line-height: 1.5em;
    margin-top: 1.25em;
    position: relative
}

.pica-custom-image-manual__text__column-item__text {
    padding: .3125em 0 0 2.5em
}

.pica-custom-image-manual__text__column-item__icon {
    background: url(../img/check_icon.svg) 0 center no-repeat;
    width: 2em;
    height: 2em;
    position: absolute
}

@media (min-width:528px) {
    .pica-custom-image__headline {
        padding-left: .4375em
    }
    .pica-custom-image__description {
        padding-left: .625em
    }
    .msg-box-container--custom-image {
        max-width: 690px
    }
}

.pica-custom-image-editor {
    overflow: auto
}

@media (min-width:28.75em) and (max-width:46.74em) {
    .pica-custom-image-editor__preview-container-wrapper {
        float: right;
        width: calc(100% - 206px);
        background-color: #f2f7fb
    }
}

@media (min-width:46.75em) {
    .pica-custom-image-editor__preview-container-wrapper {
        width: 100%
    }
    .pica-custom-image-editor {
        display: -webkit-box;
        display: -moz-box;
        display: box;
        display: -webkit-flex;
        display: -moz-flex;
        display: -ms-flexbox;
        display: flex
    }
}

@media (min-width:28.75em) and (max-width:46.74em) {
    .pica-custom-image-editor__preview-container-tablet-controls {
        float: left;
        width: 12.875em
    }
}

@media (min-width:28.75em) {
    .pica-custom-image-editor {
        border-bottom: 1px solid #ddecf6;
        border-top: 1px solid #ddecf6;
        margin-bottom: 1.875em
    }
}

.pica-custom-image-editor__card-preview {
    /* -webkit-box-shadow: -1px -1px 32px -2px rgba(0, 0, 0, .75);
    -moz-box-shadow: -1px -1px 32px -2px rgba(0, 0, 0, .75);
    box-shadow: -1px -1px 32px -2px rgba(0, 0, 0, .75) */
}

.pica-custom-image-editor__card-preview .pica_gallery_cardpreview_img {
    border-radius: .625em
}

.pica-custom-image-editor__card-preview-icon {
    background: 0 0;
    position: absolute;
    left: 5%;
    right: 5%;
    top: 5%;
    bottom: 5%;
    width: auto;
    height: auto;
    border-radius: .625em;
    overflow: hidden;
    pointer-events: none
}

.pica-custom-image-editor__card-preview-icon i {
    display: block;
    height: 3.125em;
    width: 3.125em;
    background-position: center center;
    background-repeat: no-repeat;
    position: absolute;
    top: calc(50% - 25px);
    left: calc(50% - 25px);
    pointer-events: none
}

.pica-custom-image-editor__card-preview-icon--scale-position i {
    background-image: url(../img/image-preview/scale_position.svg)
}

.pica-custom-image-editor__card-preview-icon--brightness i {
    background-image: url(../img/image-preview/brightness.svg)
}

.pica-custom-image-editor__card-preview-icon--rotate i {
    background-image: url(../img/image-preview/rotate.svg)
}

.pica-custom-image-editor__card-preview-icon--mirror i {
    background-image: url(../img/image-preview/mirror.svg)
}

@media (max-width:527px) {
    .pica-custom-image {
        margin-top: 1.5625em
    }
    h1.pica-custom-image__headline {
        padding-left: 1.25em
    }
    p.pica-custom-image__description {
        padding-left: 1.5em
    }
    .pica-custom-image-select {
        margin-bottom: 1.25em
    }
}

.pica-gallery__area-category,
.pica-gallery__area-thumbselect {
    float: left
}

@media (min-width:28.75em) {
    .pica-gallery__area-category,
    .pica-gallery__area-thumbselect {
        background-color: #f2f7fb;
        padding: 0 0 0 .3125em;
        height: 24.4375em;
        width: 13.0625em;
        overflow-y: auto
    }
}

@media (min-width:46.75em) {
    .pica-custom-image-editor__preview-container {
        -webkit-box-ordinal-group: 2;
        -moz-box-ordinal-group: 2;
        box-ordinal-group: 2;
        -webkit-order: 2;
        -moz-order: 2;
        order: 2;
        -ms-flex-order: 2
    }
    .pica-gallery__area-category,
    .pica-gallery__area-thumbselect {
        width: 20em;
        padding: 0 .3125em .625em .625em
    }
}

@media (min-width:28.75em) {
    .pica-gallery__area-category-headline,
    .pica-gallery__area-thumbselect-headline {
        background-color: #f2f7fb;
        margin: 0;
        padding: 0 0 .625em .3125em;
        width: 13.0625em
    }
}

@media (min-width:46.75em) {
    .pica-gallery__area-category-headline,
    .pica-gallery__area-thumbselect-headline {
        width: 20em;
        padding: 1.25em .3125em .625em .625em
    }
    .pica-gallery {
        margin-bottom: 1.875em
    }
}

.pica-gallery__area-category-image-container,
.pica-gallery__area-thumbselect-thumbnail-container {
    background: #fff;
    border: .1875em solid #fff;
    border-radius: .1875em;
    width: auto
}

@media (max-width:28.74em) {
    .pica-gallery {
        padding: 0 0 .625em
    }
}

@media (min-width:28.75em) {
    .pica-gallery__area-category-image-container,
    .pica-gallery__area-thumbselect-thumbnail-container {
        height: 5.5625em;
        width: 5.5625em
    }
    .pica-gallery {
        border-bottom: 1px solid #ddecf6
    }
    .pica-gallery__pick-category {
        border-bottom: 1px solid #ddecf6;
        padding-left: .625em;
        padding-bottom: 1.25em
    }
    .pica-gallery__pick-category-headline {
        margin-top: .625em
    }
    .pica-gallery__area-category-headline {
        line-height: 1.875em!important
    }
}

.pica-gallery__area-category-category-container {
    float: left;
    margin: .3125em .3125em 0 0;
    width: 5.5625em;
    width: calc(33% - 5px);
    overflow: hidden
}

@media (min-width:28.75em) {
    .pica-gallery__area-category-category-container {
        height: 7.8125em;
        width: 5.5625em
    }
}

.pica-gallery__area-category-image {
    vertical-align: middle;
    width: 100%
}

.pica-gallery__area-category-image-positioning-helper {
    display: inline-block;
    height: 100%;
    vertical-align: middle
}

.pica-gallery__area-category-image-description {
    font-size: .75em;
    height: 2.5em;
    margin: .25em 0 0;
    padding: 0;
    text-align: center;
    overflow: hidden
}

@media (max-width:28.74em) {
    .pica-gallery__area-category-image-container.is-selected {
        border-color: #fff
    }
    .pica-gallery__thumbnails-and-preview-container {
        position: relative
    }
    .pica-gallery__area-thumbselect {
        float: none;
        margin: 0 auto
    }
}

.pica-gallery__area-thumbselect-headline-link {
    display: block
}

.pica-gallery__area-thumbselect-headline-link:hover {
    text-decoration: none
}

.pica-gallery__area-thumbselect-headline-link i {
    background: url(../img/back_triangle.svg) 0 center no-repeat;
    display: inline-block;
    height: 1.875em;
    width: 1.25em;
    margin-right: .625em;
    vertical-align: middle
}

.pica-gallery__area-thumbselect-headline-link-text {
    display: inline-block;
    vertical-align: middle
}

@media (min-width:28.75em) {
    .pica-gallery__area-thumbselect-headline-link-text {
        padding-top: .125em
    }
}

@media (max-width:28.74em) {
    .pica-gallery__area-thumbselect-headline-category {
        margin-top: 0;
        padding-top: .9375em;
        position: relative
    }
}

.pica-gallery__area-thumbselect-thumbnail-container {
    float: left;
    margin: .3125em .3125em 0 0;
    width: 5.5625em;
    overflow: visible
}

.pica-gallery__area-thumbselect-thumbnail-container.is-selected {
    border-color: #0098db;
    position: relative
}

@media (max-width:28.74em) {
    .pica-gallery__area-thumbselect-thumbnail-container {
        width: calc(33% - 5px)
    }
    .pica-gallery__area-thumbselect-thumbnail-container.is-selected {
        margin-bottom: 10px
    }
    .pica-gallery__area-thumbselect-thumbnail-container.is-selected:after {
        display: block;
        position: absolute;
        left: 40%;
        bottom: -.8125em;
        width: 0;
        height: 0;
        border-left: .625em solid transparent;
        border-right: .625em solid transparent;
        border-bottom: .625em solid #ECEAE7;
        content: ' '
    }
}

.pica-gallery__area-thumbselect-thumbnail-image {
    vertical-align: middle;
    width: 100%
}

.pica-gallery__area-thumbselect-thumbnail-image-positioning-helper {
    display: inline-block;
    height: 100%;
    vertical-align: middle
}

.pica-gallery__preview-container {
    height: 27.5625em;
    margin-left: 20em;
    margin-top: -3.125em
}

@media (min-width:28.75em) and (max-width:46.74em) {
    .pica-gallery__preview-container {
        margin-left: 13.75em
    }
    .pica-btn-wrapper--gallery-small .pica-btn__primary {
        margin-top: 0
    }
}

@media (max-width:28.74em) {
    .pica-gallery__preview-container {
        margin: 0;
        height: auto;
        width: 100%;
        position: absolute;
        top: 1.25em;
        left: 0
    }
    .pica-gallery__preview-row-container {
        float: left;
        position: relative;
        width: 100%;
        overflow: hidden;
        background: #ECEAE7
    }
    .pica-btn-wrapper--gallery-small {
        display: none
    }
    .pica-gallery__preview-row-container .pica-btn-wrapper--gallery-small {
        display: block
    }
    .pica-gallery__preview-container {
        display: none
    }
    .pica-gallery__preview-row-container .pica-gallery__preview-container {
        display: block
    }
}

.pica-gallery__preview-row-container__close-btn {
    position: absolute;
    top: .3125em;
    left: .3125em;
    height: 1.5em;
    width: 1.5em;
    background: url(../img/close_icon_white.svg) 0 center no-repeat;
    cursor: pointer
}

@media (min-width:28.75em) {
    .pica-gallery__preview-area-wrapper {
        height: 100%;
        width: 100%;
        max-width: 690px
    }
}

.pica-gallery__card-preview {
    -webkit-box-shadow: -1px -1px 32px -2px rgba(0, 0, 0, .75);
    -moz-box-shadow: -1px -1px 32px -2px rgba(0, 0, 0, .75);
    box-shadow: -1px -1px 32px -2px rgba(0, 0, 0, .75)
}

@media (max-width:28.74em) {
    p.pica-gallery__area-category-image-description {
        color: #666
    }
    h2.pica-gallery__area-thumbselect-headline {
        color: #2282C1;
        font-size: .8125em;
        line-height: 1.21875em
    }
    a.pica-gallery__area-thumbselect-headline-link {
        color: #2282C1
    }
}

.pica-wait-spinner--custom-image-editor,
.pica-wait-spinner--final {
    background: url(../img/spinning_icon.svg) center center no-repeat;
    height: 1.875em;
    width: 1.875em;
    -webkit-animation-name: rotate;
    -webkit-animation-duration: 1s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -moz-animation-name: rotate;
    -moz-animation-duration: 1s;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear
}

@-webkit-keyframes rotate {
    from {
        -webkit-transform: rotate(0)
    }
    to {
        -webkit-transform: rotate(360deg)
    }
}

@-moz-keyframes rotate {
    from {
        -moz-transform: rotate(0)
    }
    to {
        -moz-transform: rotate(360deg)
    }
}

.pica-wait-spinner--custom-image-editor {
    position: absolute;
    top: calc(50% - 15px);
    left: calc(50% - 15px)
}

.pica-wait-spinner-container--custom-image-editor {
    background-color: #ebebeb;
    border-radius: .625em;
    width: auto;
    height: auto;
    position: absolute;
    left: 5%;
    right: 5%;
    top: 5%;
    bottom: 5%;
}

.pica-wait-spinner-container--custom-image-editor__description {
    color: #133C7F;
    font-size: 1em;
    line-height: 1.25em;
    position: absolute;
    bottom: -3.125em;
    left: 0
}

.pica-wait-spinner--final {
    height: 3.125em;
    width: 3.125em;
    position: absolute;
    top: 50%;
    left: 50%
}

.pica-wait-spinner-container--final {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    background-color: #fff;
    opacity: .6
}

.pica-slider-container {
    width: 17.5em;
    margin: .9375em 0 .625em .3125em;
    position: relative;
    display: inline-block;
    overflow: hidden
}

.pica-slider-container__label {
    color: #666;
    font-size: .8125em;
    line-height: 1.21875em;
    width: 100%;
    text-align: center;
    padding-bottom: .3125em
}

.pica-slider-container__bg {
    height: 2.5em;
    background-color: #ECEAE7;
    position: relative;
    border-radius: 1.25em;
    -webkit-border-radius: 1.25em;
    -moz-border-radius: 1.25em;
    box-shadow: inset rgba(0, 0, 0, .22) 0 1px 3px;
    -webkit-box-shadow: inset rgba(0, 0, 0, .22) 0 1px 3px;
    -moz-box-shadow: inset rgba(0, 0, 0, .22) 0 1px 3px
}

.pica-slider-container__bg__inner {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 14.375em;
    height: .125em;
    background-color: #fff
}

.pica-slider-container__bg__inner .ui-slider-handle {
    position: absolute;
    z-index: 2;
    width: 1.625em;
    height: 1.625em;
    margin: -.75em 0 0 -.8125em;
    background-color: #fff;
    border: .5625em solid #2282C1;
    border-radius: .8125em;
    -webkit-border-radius: .8125em;
    -moz-border-radius: .8125em;
    cursor: pointer
}

.pica-slider-container__bg__inner .ui-slider-handle:focus {
    outline: 0!important
}

.pica-slider-container__bg__bullet,
.pica-slider-container__bg__bullet__left,
.pica-slider-container__bg__bullet__middle,
.pica-slider-container__bg__bullet__right {
    width: .5em;
    height: .5em;
    margin-top: -.1875em;
    border-radius: .25em;
    -webkit-border-radius: .25em;
    -moz-border-radius: .25em;
    box-shadow: inset rgba(0, 0, 0, .31) 0 1px 3px;
    -webkit-box-shadow: inset rgba(0, 0, 0, .31) 0 1px 3px;
    -moz-box-shadow: inset rgba(0, 0, 0, .31) 0 1px 3px
}

.pica-slider-container__bg__bullet__left {
    background: #888;
    position: absolute;
    left: -.25em
}

.pica-slider-container__bg__bullet__middle {
    background: #D3D1CF;
    margin-left: auto;
    margin-right: auto
}

.pica-slider-container__bg__bullet__right {
    background: #888;
    position: absolute;
    right: -.25em
}

.svg-sprite #icon-forward_arrow_2 .cls-1,
.svg-sprite #icon-forward_arrow_2 .cls-2 {
    stroke: #fff
}

.svg-sprite #icon-back_arrow .cls-1,
.svg-sprite #icon-back_arrow .cls-2 {
    stroke: #666
}

.svg-icon--white .cls-1,
.svg-icon--white .cls-2 {
    stroke: #fff
}

.svg-icon--gray .cls-1,
.svg-icon--gray .cls-2 {
    stroke: #666
}

@media (min-width:46.75em) {
    .pica-control-area {
        -webkit-box-ordinal-group: 1;
        -moz-box-ordinal-group: 1;
        box-ordinal-group: 1;
        -webkit-order: 1;
        -moz-order: 1;
        order: 1;
        -ms-flex-order: 1;
        background-color: #fff
    }
}

@media (min-width:28.75em) {
    .pica-control-area__control-container {
        padding: .625em .5625em;
        background-color: #fff
    }
    .pica-control-area__control-container.is-selected {
        background-color: #f2f7fb;
        overflow: auto;
        min-height: 4.8125em
    }
    .pica-control-area__control-container--filters.is-selected {
        min-height: 5.8125em
    }
}

@media (min-width:28.75em) and (max-width:46.74em) {
    .pica-control-area {
        width: 100%
    }
    .pica-control-area__control-container {
        padding: 0;
        background-color: transparent
    }
    .pica-control-area__control-container.is-selected {
        min-height: auto
    }
    .pica-custom-image-editor__preview-container-tablet-controls .pica-control-area__control-container {
        padding: .625em .5625em
    }
}

@media (min-width:46.75em) {
    .pica-control-area {
        width: 19.375em
    }
    .pica-control-area__control-box--switches {
        float: right;
        padding-top: .3125em;
        padding-right: .8125em;
        padding-bottom: .3125em
    }
}

.pica-control-area__control-buttons {
    display: -webkit-box;
    display: -moz-box;
    display: box;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100vw;
    height: 4.75em;
    margin: 0 auto
}

.pica-control-area__control-button {
    display: inline-block;
    cursor: pointer
}

@media (min-width:18.75em) and (max-width:28.74em) {
    .pica-control-area__control-button {
        width: 11vw;
        overflow: hidden
    }
}

.pica-control-area__control-button i {
    display: block;
    width: 11vw;
    height: 11vw;
    margin-bottom: .3125em;
    background: center center no-repeat #fff;
    border: 2px solid #2282C1
}

@media (min-width:28.75em) {
    .pica-control-area__control-button i {
        display: inline-block;
        vertical-align: top
    }
}

@media (min-width:28.75em) and (max-width:46.74em) {
    .pica-control-area__control-button i {
        background-size: contain;
        border: 0
    }
}

.pica-control-area__control-button i.pica-control-area__control-button-icon {
    background-size: auto;
    border: none
}

.pica-control-area__control-button span {
    display: block;
    text-align: center;
    font-size: .5625em;
    color: #2282C1;
    line-height: 1em
}

@media (min-width:28.75em) {
    .pica-control-area__control-button span {
        display: inline-block;
        vertical-align: top;
        color: #2282C1;
        font-size: .8125em;
        line-height: 1.21875em;
        margin-left: 1.25em
    }
    .pica-control-area__control-button.is-hovered i,
    .pica-control-area__control-button.is-selected i {
        width: 3.125em;
        height: 3.125em
    }
}

@media (min-width:28.75em) and (max-width:46.74em) {
    .pica-control-area__control-button span {
        margin-left: .625em
    }
}

.pica-control-area__control-button+.pica-control-area__control-button {
    margin-left: .4375em
}

.pica-control-area__control-button--filter-bw span,
.pica-control-area__control-button--filter-sepia span,
.pica-control-area__control-button--filter-3d span {
    margin-left: 0;
    font-size: .625em;
    margin-top: .3125em
}

.pica-control-area__control-button.is-hovered i,
.pica-control-area__control-button.is-selected i {
    background-color: #2282C1
}

.pica-control-area__control-button--movescale i {
    background-image: url(../img/controls/position-scale-inactive.png)
}

.pica-control-area__control-button--movescale.is-hovered i,
.pica-control-area__control-button--movescale.is-selected i {
    background-image: url(../img/controls/position-scale-active.png)
}

.pica-control-area__control-button--brightness i {
    background-image: url(../img/controls/brightness-inactive.png)
}

.pica-control-area__control-button--brightness.is-hovered i,
.pica-control-area__control-button--brightness.is-selected i {
    background-image: url(../img/controls/brightness-active.png)
}

.pica-control-area__control-button--rotate i {
    background-image: url(../img/controls/rotate-inactive.png)
}

.pica-control-area__control-button--rotate.is-hovered i,
.pica-control-area__control-button--rotate.is-selected i {
    background-image: url(../img/controls/rotate-active.png)
}

.pica-control-area__control-button--mirror i {
    background-image: url(../img/controls/mirror-inactive.png)
}

.pica-control-area__control-button--mirror.is-hovered i,
.pica-control-area__control-button--mirror.is-selected i {
    background-image: url(../img/controls/mirror-active.png)
}

.pica-control-area__control-button--filters i {
    background-image: url(../img/controls/filters-inactive.png)
}

.pica-control-area__control-button--filters.is-hovered i,
.pica-control-area__control-button--filters.is-selected i {
    background-image: url(../img/controls/filters-active.png)
}

.pica-control-area__control-button--filter-sepia {
    text-align: center
}

.pica-control-area__control-button--filter-sepia i {
    background-image: url(../img/controls/filter_sepia_inactive.svg);
    border-radius: 1.5625em
}

.pica-control-area__control-button--filter-sepia.is-hovered i,
.pica-control-area__control-button--filter-sepia.is-selected i {
    background-color: #f5a723;
    background-image: url(../img/controls/filter_sepia_active.svg)
}

.pica-control-area__control-button--filter-bw {
    text-align: center
}

.pica-control-area__control-button--filter-3d {
    text-align: center
}

@media (min-width:28.75em) {
    .pica-control-area__control-button--filter-bw,
    .pica-control-area__control-button--filter-3d,
    .pica-control-area__control-button--filter-sepia {
        width: 3.125em
    }
}

.pica-control-area__control-button--filter-bw i {
    background-image: url(../img/controls/filter_bw_inactive.svg);
    border-radius: 1.5625em
}


.pica-control-area__control-button--filter-3d i {
    background-image: url(../img/controls/filter_bw_inactive.svg);
    border-radius: 1.5625em
}

@media (max-width:46.74em) {
    .pica-control-area__control-button--filter-3d i,
    .pica-control-area__control-button--filter-bw i {
        width: 2.9375em;
        height: 2.9375em
    }
}

.pica-control-area__control-button--filter-bw.is-hovered i,
.pica-control-area__control-button--filter-bw.is-selected i {
    background-color: #000;
    background-image: url(../img/controls/filter_bw_active.svg)
}

.pica-control-area__control-button--filter-3d.is-selected i {
    background-color: #FDCE23;
    background-image: url(../img/controls/filter_bw_active.svg)
}

.pica-control-area__control-button--flip-horizontal .pica-control-area__control-button-icon {
    background-image: url(../img/controls/flip_horizontal_inactive.svg);
    border-radius: 1.5625em
}

.pica-control-area__control-button--flip-horizontal.is-hovered i,
.pica-control-area__control-button--flip-horizontal.is-selected i {
    background-image: url(../img/controls/flip_horizontal_active.svg)
}

.pica-control-area__control-button--flip-vertical .pica-control-area__control-button-icon {
    background-image: url(../img/controls/flip_vertical_inactive.svg);
    border-radius: 1.5625em
}




@media (max-width:527px) {
    .pica-wait-spinner-container--custom-image-editor__description {
        bottom: -3.75em
    }
    .pica-control-area__control-button--flip-horizontal .pica-control-area__control-button-icon,
    .pica-control-area__control-button--flip-vertical .pica-control-area__control-button-icon {
        width: 2.9375em;
        height: 2.9375em
    }
}

.pica-control-area__control-button--flip-vertical.is-hovered i,
.pica-control-area__control-button--flip-vertical.is-selected i {
    background-image: url(../img/controls/flip_vertical_active.svg)
}



@media (max-width:28.74em) {
    .pica-control-area__control-box--switches {
        padding-top: .9375em;
        min-height: 5em
    }
}

#pica_custom_canvas {
    width: 100%;
    height: 100%;
    /* height: auto; */
    position: absolute;
    top: 0;
    pointer-events: none
}


.mask-img-v{
    position: absolute;
    left: calc(25vw + 1.9vw);
    top: calc(20px + 1.74vw);
    width: calc(50vw - 3.8vw);
    height: calc(79.5vw - 3.48vw);
    box-shadow: 0px 0px 0px 20px #f8f8f8;
    border-radius: 10px;
}

.mask-img-h{
    position: absolute;
    left: calc(10vw + 1.9vw);
    top: calc(20px + 1.74vw);
    width: calc(80vw - 3.8vw);
    height: calc(50.3vw - 3.48vw);
    box-shadow: 0px 0px 0px 20px #f8f8f8;
    border-radius: 10px;
}

.pica_gallery_cardpreview_img_ext {
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    /* height: auto; */
    position: absolute;
    /* top: 0; */
    pointer-events: none;
    /* border: 1px dashed #666666; */
    z-index: 100;
}

.pica_gallery_cardpreview_img {
    width: 96.2%;
    height: 96.52%;
    left: 1.9%;
    top: 1.74%;
    /* height: auto; */
    position: absolute;
    /* top: 0; */
    pointer-events: none;
    border: 1px dashed rgba(198, 198, 198, 0.5);
    box-shadow: 0px 1px 20px 0px rgba(0, 0, 0,0.3);
    z-index: 100;
}


.pica_previewarea {
    position: relative;
    display: inline-block
}

.pica_cardpreview {
    position: absolute;
    left: 7%;
    right: 7%;
    top: 4%;
    bottom: 10%;
    width: auto;
    height: auto;
    /* border-radius: .625em; */
    overflow: hidden
}

.pica_canvascontainer {
    /* border-radius: .625em; */
    -webkit-mask-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAA5JREFUeNpiYGBgAAgwAAAEAAGbA+oJAAAAAElFTkSuQmCC);
    width: 100%;
    height: 100%
}

.pica_previewdummy {
    padding-top: 64.15%
}

.pica_dragoverlay {
    opacity: .1;
    position: absolute
}

.pica_previewarea--editor {
    overflow: hidden
}

@media (min-width:46.75em) {
    #pica_custom_previewcontainer {
        top: 25%;
        bottom: auto;
        float: right;
        width: calc(100% - 19.375em)
    }
    .pica_previewarea {
        width: 100%;
        min-height: 12.5em
    }
    .pica_previewarea--editor {
        max-width: 690px
    }
}

@media (min-width:18.75em) and (max-width:46.74em) {
    .pica-control-area__control-box {
        text-align: center
    }
    .pica_previewarea {
        width: 100%
    }
    .pica_portrait{
        width: 67vw !important;
        height: 108.7946vw !important;
        left: 16.5vw !important;
        padding-top: 0 !important;
        margin-top: 0vh !important;
    }
    .pica_portrait_small{
        width: 56vw !important;
        height: 92vw !important;
        left: 22vw !important;
        padding-top: 0 !important;
        margin-top: 0vh !important;
    }
    .pica_previewarea--editor {
        margin-top: 1em
    }
}

@media (min-width:28.75em) and (max-width:46.74em) {
    .pica_previewarea {
        width: 100%
    }
    .pica_previewarea--editor {
        max-width: 690px
    }
}

.msg-box-container {
    display: inline-block;
    margin: .625em .625em 1.875em;
    min-width: 250px
}

.msg-box-container--custom-image__msg-box,
.msg-box-container__msg-box {
    color: #2282C1;
    font-size: .6875em;
    line-height: 1.21875em;
    background: #fff;
    box-shadow: 0 1px 6px 0 rgba(0, 0, 0, .25);
    height: auto;
    overflow: hidden;
    padding: .75em;
    text-align: center
}

.msg-box-container__msg-box__close-icon {
    background: url(../img/close_icon.svg) 0 center no-repeat;
    cursor: pointer;
    float: right;
    height: 1.5em;
    margin-left: .625em;
    width: 1.5em
}

.msg-box-container__msg-box__close-button-container {
    margin-left: 1.5em
}

@media (max-width:527px) {
    .msg-box-container__msg-box__close-button-container {
        margin-left: 0
    }
}

.msg-box-container__msg-box__close-button-container__close-button {
    display: inline-block;
    float: none;
    min-width: 7.5em;
    margin: 1.25em 0 .5em
}

.msg-box-container--custom-image {
    display: block;
    margin: 0
}

.msg-box-container--custom-image__msg-box {
    margin: 0 10%
}

.is-page-gallery .msg-box-container--custom-image {
    display: none!important
}


/*Demo diycard 3d, sticker*/
.pica_sticker_item{
    float: left;
    width: 80%;
    padding: 10px;
  }
  
  .pica_sticker_item2{
    float: left;
    width: 49%;
    margin-right:1%;
  }
  
  .pica_sticker_item_container{
    overflow: hidden;
    width: 100%;
    height: 100%;
  }
  
  .pica_sticker_item_line{
    overflow: hidden;
    width: 100%;
    margin: 10px 0;
  }
  
  .pica_sticker_item img{
    width: 100%;
  }
  
  .pica_sticker_item2 img{
    width: 100%;
  }
  
  .del {
    top: -15px;
    left: -15px;
    background: url(../img/modBtn.png) #999999 no-repeat;
    background-position: 8px 7px;
    background-size: 250%;
    position: absolute;
    width: 30px;
    height: 30px;
    z-index: 20;
    border-radius: 50%;
  }
  
  .scale {
    bottom: -15px;
    right: -15px;
    background: url(../img/modBtn.png) #fff no-repeat;
    background-position: -23px 7px;
    background-size: 250%;
    position: absolute;
    width: 30px;
    height: 30px;
    z-index: 20;
    border-radius: 50%;
  }

.text-edit {
    bottom: -15px;
    left: -15px;
    background: url(../img/modBtn.png) #fff no-repeat;
    background-position: -52px 7px;
    background-size: 250%;
    position: absolute;
    width: 30px;
    height: 30px;
    z-index: 20;
    border-radius: 50%;
}

.text-edit-layer {
    display: none;
    position: absolute;
    z-index: 1999;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /* padding-bottom: 30px; */
    overflow: hidden;
}

.preview-layer {
    position: absolute;
    z-index: 1999;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    padding-bottom: 30px;
}

.preview-layer .editC {
    width: 100%;
    height: 100%;
    display: table;
}

.preview-layer .editC div {
    display: table-cell;
    width: 100%;
    min-height: 20px;
    font-size: 20px;
    color: #fff;
    line-height: 20px;
    text-align: left;
    vertical-align: middle;
    overflow: hidden;
    overflow-y: auto;
    word-break: break-all;
    word-wrap: break-word;
    padding: 0 30px;
}

.preview-layer .btn {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 40px;
    background: #fff;
}

.preview-layer .btn div:nth-child(1) {
    float: left;
}

.preview-layer .btn div {
    padding: 0 20px;
    font-size: 14px;
    line-height: 40px;
}

.preview-layer::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(0,0,0,0.9);
    z-index: -1;
}

.preview-layer .btn div:nth-child(2) {
    float: right;
}

.show {
    display: block !important;
}

.text-edit-layer .editC {
    width: 100%;
    height: 100%;
    display: table;
}

.text-edit-layer .editC div {
    display: table-cell;
    width: 100%;
    min-height: 20px;
    font-size: 20px;
    color: #fff;
    line-height: 20px;
    text-align: left;
    vertical-align: middle;
    overflow: hidden;
    overflow-y: auto;
    word-break: break-all;
    word-wrap: break-word;
    padding: 0 30px;
}

.text-edit-layer .btn {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 40px;
    background: #fff;
}

.text-edit-layer .btn div:nth-child(1) {
    float: left;
}

.text-edit-layer .btn div {
    padding: 0 20px;
    font-size: 14px;
    line-height: 40px;
}

.text-edit-layer::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(0,0,0,0.6);
    z-index: -1;
}

.text-edit-layer .btn div:nth-child(2) {
    float: right;
}