/* CSS Document */
@import url('//fonts.googleapis.com/css2?family=Anton&display=swap');
@import url('//fonts.googleapis.com/css2?family=PT+Sans+Caption:wght@400;700&family=PT+Sans+Narrow:wght@400;700&family=PT+Sans:ital,wght@0,400;0,700;1,400;1,700&display=swap');
@import url('//fonts.googleapis.com/css2?family=Alex+Brush&family=Comforter+Brush&family=Water+Brush&display=swap');
@import url('//fonts.googleapis.com/css2?family=Courier+Prime:ital,wght@0,400;0,700;1,400;1,700&display=swap');
@import url('//fonts.googleapis.com/css2?family=Lato:ital,wght@0,300;0,400;0,700;1,300;1,400;1,700&display=swap');
@import url('//fonts.googleapis.com/css2?family=GFS+Didot&display=swap');
@import url('//fonts.googleapis.com/css2?family=Noto+Serif+Georgian:wght@300;400;700&display=swap');
@import url('//fonts.googleapis.com/css2?family=Roboto+Condensed:ital,wght@0,300;0,400;0,700;1,300;1,400;1,700&family=Roboto+Serif:ital,wght@0,300;0,400;0,700;1,300;1,400;1,700&family=Roboto:ital,wght@0,300;0,400;0,700;1,300;1,400;1,700&display=swap');
@import url('//fonts.googleapis.com/css2?family=Oswald:wght@300;400;700&display=swap');
@import url('//fonts.googleapis.com/css2?family=Lobster&display=swap');
@import url('//fonts.googleapis.com/css2?family=Monoton&display=swap');
@import url('//fonts.googleapis.com/css2?family=Pacifico&display=swap');
@import url('//fonts.googleapis.com/css2?family=Tinos:ital,wght@0,400;0,700;1,400;1,700&display=swap');
@import url('//fonts.googleapis.com/css2?family=Archivo+Black&display=swap');
@import url('//fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300;0,400;0,700;1,300;1,400;1,700&family=PT+Sans+Caption:wght@400;700&display=swap');

#page-content {min-height:94vh}

#page-content #page-header + section#ad-editor {margin-top:0;width: 100%;float: left;}

/*ad-tools*/
.ad-tools {float:left;width:38%;/*max-width:444px;*/height:94vh;padding-right:2%;display:flex;/*max-height:796px;*/}
.ad-tools .navigation {background-color:#fff;width:90px;display:block;border:1px solid rgba(102,120,138,0.2);padding:18px 0;border-top:0;border-bottom:0;}
.ad-tools .content {background-color:#E3E6E9;width:100%;display:block;border:1px solid rgba(102,120,138,0.2);border-left:0;border-top:0;border-bottom:0;/*padding:20px 15px;overflow-x:scroll;-webkit-touch-callout: none;-webkit-user-select: none;-khtml-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;*//*max-width:340px*/}
.ad-tools .navigation a {float:left;width:100%;text-align:center;}
.ad-tools .navigation a + a {margin-top:14px;padding-top:14px;border-top:1px solid rgba(102,120,138,0.1);}
.ad-tools .navigation a i {color:#66788A;font-size:120%}
.ad-tools .navigation a small {float:left;width:100%;color:#000;font-size:80%;}
.ad-tools .navigation a:hover i, .ad-tools .navigation a:hover small, .ad-tools .navigation a.active i, .ad-tools .navigation a.active small {color:#04BFAD;}
.ad-tools .content .options {display:none;}
.ad-tools .content .active {display:block;}

/*ad-html*/
section#ad-editor {display:none;}
section#ad-editor .ad-html {position: relative;z-index:0;float:left;/*width:60%;*/height:100%;}
#ad-template {width:100%;height:100%;/*border: 1px solid rgba(102,120,138,0.2);box-shadow: 1px 1px 5px rgb(0 0 0 / 5%);*/}

.ad-options {padding:15px 0;}
.ad-options a {font-weight:600;color:#000;}
.ad-options a + a {padding-left:25px}

/*body#advert #page-content {position: absolute;right: 0;height: 100vh;}*/
.canvas-container {width:100% !important;height:100% !important;/*max-width:1440px;max-height:720px;*/ /*max-width:calc(100vh - 430px) !important;max-height:calc(100vh - 115px) !important;*/}
/*canvas {max-width:1200px !important;max-height:600px !important;}*/

/*campaign meta*/
#text-container {width:100%;padding:10px;background:#f9f9f9;border-top: 1px solid #e8e8e8;}
#text-container .title {font-size:100%;/*line-height:22px;*/width:100%;border:0;/*padding-left:5px;padding-right:5px;*/font-weight:600;/*margin-bottom:2px;*/overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 1;-webkit-box-orient: vertical;}
#text-container .description, #text-container .address {font-size:90%;/*line-height:23px;*/width:100%;border:0;/*padding-left:5px;padding-right:5px;*/font-weight:300;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;/*height: 23px;*/}
#text-container .title::first-letter, #text-container .description::first-letter {text-transform:capitalize;}

.ad-meta-row {margin-right: -30px;}
.ad-meta {padding-right: 30px;}
.ad-meta-preview {background-color:#F8F8F8;height: 100vh;margin-top: -30px;padding: 30px;}
.ad-meta-preview .networks {min-height:453px;margin-top:30px;display:flex;align-items:center;}
.ad-meta-preview .networks .ad-container {border: 1px solid #e8e8e8;overflow:hidden;padding: 0;max-width:690px;margin:0 auto;display:none;}
.ad-meta-preview .networks .ad-container.active {display:block;}
.ad-meta-preview .networks .ad-container.twitter {border-radius:16px;border-color: rgb(196, 207, 214);color: rgb(15, 20, 25);}
.ad-meta-preview .networks .ad-container.twitter #text-container {background:#fff;border-color: rgb(196, 207, 214);}
.ad-meta-preview .networks .ad-container.twitter .description {color: rgb(91, 112, 131);font-weight:400}
.ad-meta-preview .networks .ad-container.twitter .description .fa-link {color: rgb(91, 112, 131, 0.55);}
.ad-meta-preview .networks .ad-container.whatsapp {width: 100%;background-color: #dcf8c6;padding: 5px;border: 0;border-radius: 0.5rem;max-width:200px}
/*.ad-meta-preview .networks .ad-container.whatsapp.active {display: flex;}*/
.ad-meta-preview .networks .ad-container.whatsapp img {border-radius: 0.4rem;border-bottom-left-radius: 0;border-bottom-right-radius: 0;}
.ad-meta-preview .networks .ad-container.whatsapp #text-container {width: 100%;float: left;border:0;/*height:90px;display: flex;align-items: center;*/background-color: rgba(0,0,0,.06);border-bottom-left-radius: 0.4rem;border-bottom-right-radius: 0.4rem;}
.ad-meta-preview .networks .ad-container.whatsapp #text-container .title {padding-left:0;font-weight:400;}
.ad-meta-preview .networks .ad-container.whatsapp #text-container .description {padding-left:0;color:#777;font-weight: 400;-webkit-line-clamp: 2;}
.ad-meta-preview .networks .ad-container.whatsapp #text-container .description + .fs-75 {color:rgb(30,31,68);}
.ad-meta-preview .networks .ad-container.whatsapp #text-container .address {padding-left:0;}
.ad-meta-preview .networks .ad-container.whatsapp .address-link {color: #0C70F2;padding:7px 5px 0 5px;float:left;width:100%;display:block;word-break:break-word;line-height:120%;}
.ad-meta-preview .networks .ad-container.linkedin {border: 1px solid var(--warm-gray-30,#e6e9ec);}
.ad-meta-preview .networks .ad-container.linkedin #text-container {border-top: 1px solid var(--warm-gray-30,#e6e9ec);background-color: #f6fbff;}
.ad-meta-preview .networks .ad-container.linkedin #text-container .description {margin-top:8px;color:rgba(0,0,0,0.75)}
.ad-meta-preview .networks .ad-container.facebook #text-container .description {color:#777;}
.ad-meta-preview .navigation {font-size:150%;margin-top:30px;}
.ad-meta-preview .navigation a {float:left;width:45px;color:#fff;border-radius:50%;text-align:center;padding:0;line-height:100%;}
.ad-meta-preview .navigation a i {line-height:45px;}
.ad-meta-preview .navigation a.muted {background:#ccc;}
.ad-meta-preview .navigation a + a {margin-left:15px;}

.campaign_meta {display:flex;}
.campaign_meta .thumb {width:142px;height:75px;float:left;border:1px solid #e8e8e8;border-radius:10px}
.campaign_meta div, .campaign_meta a {display: flex;align-items: center;}
.campaign_meta div {width:100%;padding-left:20px;}
.campaign_meta div.d-block {padding-left:0;}
#modal .campaign_meta a {position:relative;}

input#url {border-top-left-radius: 0;border-bottom-left-radius: 0;}

body {overflow: hidden;}
body.account #footer {display:none}
/*general template*/
#canvas {position:relative;/*width:1080px;height:1080px;*/overflow:hidden;/*font-family:"Arial";*/}
#canvas.drag-area {border:0;}
#canvas .ad-info {position: absolute;top: 0;left:0;width:100%;height:100%;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;}
#canvas .ad-info div {overflow:hidden;overflow-wrap:break-word;line-height:100%;}
#canvas .ad-info div:focus {outline:none;}
#canvas .ad-info .text, #canvas .ad-info .image, #canvas .ad-info .overlay, #canvas .ad-info .button, #canvas .ad-info .icon {cursor:pointer;overflow:hidden;width:auto;}
#canvas .ad-info .overlay, #canvas .ad-info .text, #canvas .ad-info .text div {overflow:visible;}
#canvas .ad-info .overlay.circle {border-radius:50%;border-style:solid;}
#canvas .ad-info .text.edit {cursor:text;}
#canvas .ad-info div[contenteditable].text.edit {cursor:text;outline:auto;outline-color:aqua;}
#canvas .ad-info .image {padding:0;margin:0;min-height:auto;min-width:auto;}
#canvas .ad-info .image img {/*min-width:auto;max-width: 100%;max-height: 100%;display: block;min-height: 100%;*/display: block;margin-left: auto;margin-right: auto;}
#canvas .ad-info .draggable {overflow: visible;border:1px solid #000;touch-action: none;box-sizing: border-box;}

/*drag points*/
#canvas .ad-info div.dragpoints {position: absolute;box-sizing:border-box;width:100%;height:100%;top:0;left:0;overflow: visible;}
#nwgrip, #negrip, #swgrip, #segrip, #ngrip, #egrip, #sgrip, #wgrip {width: 10px;height: 10px;background-color: #ffffff;border: 1px solid #000000;}
#negrip {top:-5px; right:-5px;}
#segrip {bottom:-5px; right:-5px;}
#nwgrip {top:-5px; left:-5px;}
#swgrip {bottom:-5px; left:-5px;}
#ngrip {top:-5px; left:50%; margin-left:-5px;}
#egrip {right:-5px; top:50%; margin-top:-5px;}
#sgrip {bottom:-5px; left:50%; margin-left:-5px;}
#wgrip {left:-5px; top:50%; margin-top:-5px;}

.ui-rotatable-handle {position: absolute;left: 45%;top: 45%;display: block;background-image: none;width: 50px;height: 50px;}
.ui-rotatable-handle::after {font-family: "Font Awesome 5 Free";font-size:50px;content: "\f2f1";font-weight: 900;line-height: 50px;color:#000;text-shadow: 1px 1px 1px #fff;}

#canvas .ad-info .image img {max-width:100%;min-width: 100%;width: 100%;}
#canvas .ad-info div.ui-draggable-handle {overflow:visible !important;}

.ad-info div.selected {outline:none;border:1px solid aqua}

/*canvas elements*/
#canvas .ad-info {background: #fff;}
#canvas .ad-info div {resize: none;font-weight:400;}
#canvas .ad-info .image, #canvas .ad-info .text, #canvas .ad-info .overlay, #canvas .ad-info .button, #canvas .ad-info .icon  {position: absolute;width:fit-content;}
#canvas .ad-info .overlay {width:300px;height:308px;padding: 0;background-color: rgba(0,0,0, 1);}
#canvas .ad-info .text {font-size:130%;line-height:100%;color:#000000;}
#canvas .ad-info .text div {line-height:100%;}
#canvas .ad-info .button {padding:10px 40px;border-radius:.25rem;background-color:rgb(58, 134, 255);color:#fff;font-size:24px;width:auto;line-height:100%;}
#canvas .ad-info .icon  {font-family: "Font Awesome 6 Free";font-weight: 900;color: rgba(0,0,0, 1);padding:0;line-height: 100%;}

/*ad-editor tools*/
/*.ad-tools #icon.options a, .ad-tools #text.options a, .ad-tools #overlay a, .ad-tools #overlay-circle a, .ad-tools #image a, .ad-tools #multiple a, .ad-tools #shapes a {width:16.6%;height:40px;line-height: 38px;text-align: center;float: left;color: rgba(30, 31, 68, 0.5);border-bottom: 1px solid rgba(30, 31, 68, 0.1);border-top: 1px solid rgba(255,255,255,0.5);border-right: 1px solid rgba(30, 31, 68, 0.1);border-left: 1px solid rgba(255,255,255,0.5);}
.ad-tools #text.options .font-type {width:100%;float:left;}
.ad-tools #text.options .font-type a.dropdown-toggle {width:68% !important;float:left;text-align: left;padding-left: 10px;font-weight: 400;background: #ffffff;border-radius:.25rem;border-bottom: 1px solid rgba(30, 31, 68, 0.2);border-top: 1px solid rgba(255,255,255,0.5);border-right: 1px solid rgba(30, 31, 68, 0.2);border-left: 1px solid rgba(255,255,255,0.5);}
.ad-tools #text.options .font-type a.dropdown-toggle + .dropdown-menu {width:100%;max-width:200px;text-align:left;padding-top:0;padding-bottom:0;overflow-x:scroll}
.ad-tools #text.options .font-type a.dropdown-toggle + .dropdown-menu a {width:100%; float:left;text-align:left;padding-left:10px;padding-right:10px}
.ad-tools #text.options .font-type .font-size {width:30%;float:left;margin-left:2%;height: 40px;line-height: 38px;border-bottom: 1px solid rgba(30, 31, 68, 0.1);border-top: 1px solid rgba(255,255,255,0.5);border-right: 1px solid rgba(30, 31, 68, 0.1);border-left: 1px solid rgba(255,255,255,0.5);color: rgba(30, 31, 68, 0.5);}
ad-tools #text.options .font-type .font-size input#fontsize {padding-right:0;padding-left:7px;text-align:center;width:auto;max-width:70px}
.ad-tools #text.options .font-btn-group {width:100%;float:left;margin:10px 0;}
.ad-tools #text-transform + .dropdown-menu {width:100%;max-width:200px;}
.ad-tools #text-transform + .dropdown-menu a {width:100%;max-width:200px; float:left;text-align:left;padding-left:10px;padding-right:10px}
.ad-tools #text.options .line-height, .ad-tools .image-btn-group, .ad-tools .image-opacity, .ad-tools .overlay-btn-group, .ad-tools .overlay-opacity {width:100%;float:left;}
.ad-tools #text.options .line-height input, .ad-tools #overlay.options input, .ad-tools #overlay-circle.options input, .image-opacity input {width: 100%;margin-top:4px;}*/

.options .list, .options .list-btn-group {float:left;width:100%;}
.options .list a {width:40px;height:40px;float:left;margin:0 7px 7px 0;text-align:center;}
.options .list a.w50p {width:50px;}
.options .list a.w-50 {width:50%;margin:0;padding:7px}
#shapes.options .list a {width:50px;height:50px;}
#shapes.options .list a img {max-width:40px;max-height:40px;}
#buttons.options .list a {height:50px;float:left;margin:0;padding:7px}
#buttons.options .list a img {width:100%;max-height:40px}
#text-menu.options .list a {height:auto;max-height:120px;}
#text-menu.options .list a:nth-child(2) img {width:90%}
#text-menu.options .list a:nth-child(3) img {width:35%}
#text-menu.options .list a:nth-child(4) img {width:30%}
/*.options .list a {width:auto;height:auto;float:left;color:#aaa;margin:0 7px 7px 0;}
.options .list a:hover {color:#000;}
.options .list a svg {height:100%;}
#shapes.options .list a {width:50px;height:50px;}
#shapes.options .list a svg {width:40px;fill:#aaa;}
#shapes.options .list a:hover svg {fill:#000;}
#buttons.options .list a {width:auto;height:auto;float:left;margin:0 0 10px 0;}
.w-47 {width:47%!important;}
.w-47:nth-child(2n) {float:right !important;}
.options .list a.w140p svg {width:140px;}
.options .list a.w50p svg {width:50px;}
.options .list a.w40p svg {width:40px;}
.options .list a.h80p svg {height:80px;}
.options .list a.h60p svg {height:60px;}
.options .list a.h50p svg {height:50px;}
.options .list a.h40p svg {height:40px;}
.options .list a.h30p svg {height:30px;}
.options .list a.h20p svg {height:20px;}
.options .list a.w100 svg {width:100%;}
.options .list a.w96 svg {width:96%;}
.options .list a.w90 svg {width:90%;}
.options .list a.w80 svg {width:80%;}
.options .list a.w70 svg {width:70%;}
.options .list a.w60 svg {width:60%;}
.options .list a.w50 svg {width:50%;}
.options .list a.w40 svg {width:40%;}
.options .list a.w35 svg {width:35%;}
.options .list a.w30 svg {width:30%;}
.options .list a.w25 svg {width:25%;}
.options .list a.m-0-7 svg {margin:0 7px;}
.options .list a.hauto svg {height:auto}
.options .list a.h100 svg {height:100%}*/


/*.options .list a > * {fill:rgba(30, 31, 68, 0.5) !important;}*/
/*#shapes.options .list a {transform: scale(0.15);transform-origin: 0px 0px;}*/

.options .list-btn-group a {width:16.6%;height:40px;/*line-height: 38px;text-align: center;*/float: left;color: rgba(30, 31, 68, 0.5);border-bottom: 1px solid rgba(30, 31, 68, 0.1);border-top: 1px solid rgba(255,255,255,0.5);border-right: 1px solid rgba(30, 31, 68, 0.1);border-left: 1px solid rgba(255,255,255,0.5);display: flex;align-items: center;-webkit-box-pack: end!important;-ms-flex-pack: end!important;justify-content: center!important;}
#text.options .list-btn-group .dropdown-menu.show a {justify-content: left !important;}

#text.options .font-type {width:100%;float:left;}
#text.options .font-type a.dropdown-toggle {width:68% !important;float:left;text-align: left;padding-left: 10px;font-weight: 400;background: #ffffff;border-radius:.25rem;border-bottom: 1px solid rgba(30, 31, 68, 0.2);border-top: 1px solid rgba(255,255,255,0.5);border-right: 1px solid rgba(30, 31, 68, 0.2);border-left: 1px solid rgba(255,255,255,0.5);}
#text.options .font-type a.dropdown-toggle + .dropdown-menu {width:100%;max-width:200px;text-align:left;padding-top:0;padding-bottom:0;overflow-x:scroll;height:80vh}
#text.options .font-type a.dropdown-toggle + .dropdown-menu a {width:100%; float:left;text-align:left;padding-left:10px;padding-right:10px}
#text.options .font-type .font-size {width:30%;float:left;margin-left:2%;height: 40px;line-height: 38px;border-bottom: 1px solid rgba(30, 31, 68, 0.1);border-top: 1px solid rgba(255,255,255,0.5);border-right: 1px solid rgba(30, 31, 68, 0.1);border-left: 1px solid rgba(255,255,255,0.5);color: rgba(30, 31, 68, 0.5);}
#text.options .font-type .font-size input#fontsize {padding-right:0;padding-left:7px;text-align:center;width:auto;max-width:70px}
#text.options .font-btn-group {width:100%;float:left;margin:10px 0;}
#text-transform + .dropdown-menu {width:100%;max-width:200px;}
#text-transform + .dropdown-menu a {width:100%;max-width:200px; float:left;text-align:left;padding-left:10px;padding-right:10px}


/*color picker*/
#color-picker {/*text-transform:uppercase;*/}
.sp-colorize-container {cursor:pointer;}

/*draggable*/
.ad-info .ui-draggable {cursor: move !important;/*cursor: grab !important;cursor: -moz-grab !important;cursor: -webkit-grab !important;*/}
/*resize*/
.ui-resizable-handle {background:aqua !important;}
.ui-resizable-handle.ui-resizable-sw, .ui-resizable-handle.ui-resizable-ne, .ui-resizable-handle.ui-resizable-nw {background:aqua !important;}
.ui-resizable-se {cursor:se-resize;width:9px;height:9px;right:-5px;bottom:-5px;}
.ui-resizable-e {width:1px;right:-1px;}
.ui-resizable-w {width:1px;left:-1px;right:0;}
.ui-resizable-n {width:100%;height:1px;top:-1px;}
.ui-resizable-s {width:100%;height:1px;bottom:-1px;}
/*crop*/
.cropper-crop-box {overflow:visible !important;}
.cropper-view-box {outline: 1px solid aqua;outline-color:none !important;}
.cropper-point, .cropper-line {background-color: aqua;}
.cropper-line.line-n, .cropper-line.line-s {height:1px !important;}
.cropper-line.line-w, .cropper-line.line-e {width:1px !important;}
.cropper-point {width: 7px !important;height: 7px !important;opacity:1 !important;}
.cropper-point.point-n {top: -4px;}
.cropper-point.point-e {right: -4px;}
.cropper-point.point-w {left: -4px;}
.cropper-point.point-s {bottom: -4px;}
.cropper-point.point-ne {right: -4px;top: -4px;}
.cropper-point.point-nw {left: -4px;top: -4px;}
.cropper-point.point-sw {bottom: -4px;left: -4px;}
.cropper-point.point-se {bottom: -4px;right: -4px;}

.color-input {/*width:auto !important;padding:13px !important;*/width:100%;float:left;overflow:visible;}
.color-input input {background-color:#f8f8f8;color:#222;font-size: 90%;}
.color-input .input-group-text.colorpicker-input-addon {padding:0;border:0;background:0;}
.color-input .input-group-text.colorpicker-input-addon i {height:40px;width:40px;border-top-right-radius:.25rem;border-bottom-right-radius:.25rem;}
.color-input .colorpicker-input-addon:before {height:40px;width:40px;border-top-right-radius: .25rem;border-bottom-right-radius: .25rem;}
.color-input .input-group + .input-group {margin-top:25px}
.color-input #colorselector {/*background: #fff;border-radius: .25rem;*/width:165px;float:left;height: 128px;}
.color-input .colorpicker-inline.colorpicker-visible {/*width:200px !important;*/width:100%;float:left;height:128px}
.color-input .colorpicker div.colorpicker-saturation {width:80%;margin: 0;height: 128px;}
.color-input .colorpicker div.colorpicker-hue, .color-input .colorpicker div.colorpicker-alpha {width:8%;margin: 0;margin-left:2%;height: 128px;}
.color-input .colorpicker-bar.colorpicker-preview {display:none;}
.color-input #colorselector + #colorcode {/*margin-top:10px;*/float:right;width:120px}
.color-input #colorselector + #colorcode span {float:left;width:100%;/*line-height:35px*/}
.color-input #colorselector + #colorcode input {float:left;width:100%;/*margin-left:2%*/font-size:80%;padding:.4rem .5rem}
.color-input #colorselector + #colorcode .color-preview {background-color:#ffffff;margin-bottom:10px;padding:1px;width:40px}
.color-input #colorselector + #colorcode .color-preview div {height:40px;width:100%;display:block}
.color-input .colorpicker div.colorpicker-saturation .colorpicker-guide {width:10px;height:10px;box-shadow: 0 0 0 1px aqua;}

#ad-editor .options .block-title {color: rgba(30, 31, 68, 0.5);}

/*tooltips*/
.tooltip.meta .tooltip-inner {background:#3a0ca3;padding:7px 15px}
.tooltip.meta .arrow::before {border-left-color: #3a0ca3;}
.tooltip.meta {left:-12px !important;}

#ad-editor #image #upload { border: 1px solid rgba(102,120,138,0.1);}
#ad-editor #image #upload .drag-and-drop {min-height: 300px;font-size: 80%;}
#ad-editor #image #upload .drag-and-drop .upload-info {padding-left: 27px;}
#ad-editor #image #upload .drag-and-drop .upload-info h3 {font-size: 100%;}
#ad-editor #image #upload .drag-and-drop .upload-info::before {top: 4px;}


#templates .col-6 {margin-top:15px}

/*#layers.active div {display:block;width:auto;padding:13px;max-width:200px;}*/
#layers.active ul {display:block;position:relative;float: left;border-bottom: 0;overflow: hidden;width: 100%;height: 100%;overflow-y: hidden;min-height:calc(100vh -165px)}
#layers.active ul li {float:left;width:100%;height: 52px;cursor:move;text-align:left;padding:0 0 0 25px;font-size:80%;display:flex;align-items:center;line-height:50px;border: 1px solid rgba(0,0,0,0.065);border-top: 1px solid rgba(255,255,255,0.65);background: rgba(0,0,0,0.03);position: relative;}
#layers.active ul li::before {content:"\f58e";font-family: "Font Awesome 5 Free";position:absolute;left:0;top:0;color: rgba(0,0,0,0.165);font-size: 90%;line-height: 50px;text-shadow:0 1px 0 rgba(255,255,255,0.075);font-weight: 900;/*border-right: 1px solid rgba(0,0,0,0.045);*/width: 25px;text-align: center;}
#layers.active ul li + li {margin-top:4px;}
#layers.active ul li.image img {padding:0;margin:0;max-height:25px;max-width:100px;}
#layers.active ul li.overlay div {display: block;height:100%;width:25px;max-height:25px;padding:0;}
#layers.active ul li.overlay.circle div {border-radius:50%;}
#layers.active ul li.text {text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 1;-webkit-box-orient: vertical;overflow: hidden;color:rgba(30, 31, 68, 0.65)}
#layers.active ul li.sel-none div {cursor:default}
#layers.active ul li .fa-lock, #layers ul#sortable li .fa-eye-slash {color:#333333;}
ul#sortable li div {/*width:100%;max-width:204px;*/height:50px;max-height:50px;/*display:block;*/cursor:pointer;}
ul#sortable li a {/*position:absolute;left:auto;right:30px;top:0;*/font-size: 90%;line-height: 50px !important;text-shadow:0 1px 0 rgba(255,255,255,0.075);cursor:pointer;color:rgba(0,0,0,0.25);width:24px;/*border-left:1px solid rgba(0,0,0,0.045);*/text-align:center;}
/*ul#sortable li a:not(:first-child) + a {font-size:85%;right:0;}*/
ul#sortable li.active_layer { border: 1px solid aqua !important}
ul#sortable svg, ul#sortable img {max-width:200px;}
ul#sortable svg > * {visibility:visible !important;}
ul#sortable li img {width:auto;max-height:30px;}

#text-font.dropdown-toggle::after {float: right;/*margin-top: 16px;*/margin-right: 7px;}

#templates.options .btn-group {width:100%;}
#templates.options button, #templates.options button:hover {color:#66788A;border:0;background: #fff;line-height: 40px;padding: 0 15px;border-radius: .25rem;width: 100%;text-align: left;}
#templates.options .dropdown-toggle::after {font-family: "Font Awesome 6 Free";font-weight: 900;content: "\f078";font-size:70%;line-height: 40px;vertical-align:middle;border-top:0;border-right: 0;border-bottom: 0;border-left:0;right: 15px;position: absolute;}
#templates.options button + .dropdown-menu {width:100%}
#templates.options .btn-group + .row {margin-left: -11px;margin-right: -11px;}

.pay-now {margin-top:10px}

.zoom-60 {zoom:60%}
.templates-btn-group a {width:100%;display: flex;}
.templates-btn-group a div {width:auto;}
.templates-btn-group a + a {margin-top:20px;}

#background.options .images a {background-size:100% 100%;float:left;width:150px;height:78px;border: 1px solid rgba(30, 31, 68, 0.075);border-bottom: 1px solid rgba(30, 31, 68, 0.3);border-right: 1px solid rgba(30, 31, 68, 0.3);}
#background.options .images a + a{}

/*context menu*/
.context-menu-list {-webkit-box-shadow:none !important;box-shadow:none !important;border:1px solid #e8e8e8 !important;border-radius:.25rem !important;}
.context-menu-separator {border-bottom: 1px solid #e8e8e8 !important;}
.context-menu-item {font-weight:300 !important;color:#333 !important;}
.context-menu-item:hover {background-color:transparent !important;color:#0C70F2 !important;}
.context-menu-icon::before {font-size:90% !important;color: #aaa !important;}
.context-menu-icon:hover::before {color:#0C70F2 !important;}

.image-to-crop {max-height:80vh}

#page-content {min-height: calc(100vh - 57px);}
section#ad-editor {display:flex;}
section#ad-editor .ad-tools {/*width:calc(100vw - 62vw);*/height: calc(100vh - 57px);/*margin-right: 2vw;*/padding-right:0;}
section#ad-editor .ad-html {/*width:calc(100vw - 42vw);*/width:100%;}
section#ad-editor #ad-template {/*width:calc(100vw - 42vw);height:calc(100vw - 42vw);*/}
.btn-options-close {display:none;}
.ad-tools .content {overflow-x:hidden;overflow-y:hidden;padding:0;}
.ad-tools .content .tools-inner {width:100%;float:left;height:100%;display: block;padding:20px 15px;overflow-x:scroll;-webkit-touch-callout: none;-webkit-user-select: none;-khtml-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;}

@media (min-width:992px) {
	section#ad-editor .ad-html {/*max-width:82vh*/}
	section#ad-editor #ad-template {/*max-height:82vh;max-width:82vh*/}
	.ad-tools .content {width:340px}
	section#ad-editor .ad-tools {width:auto;}
}

@media (max-width:991px) {
	#navigation.container-fluid {position: relative;z-index: 1;}
	section#ad-editor {width:100vw;height:calc(100vh - 120px);position: absolute;top:0;z-index: 0;background-color: #f8f8f8;}
	section#ad-editor .ad-tools {position:fixed;bottom:0;width:100vw;height:60px;padding: 0;margin:0;z-index: 2;border-top: 1px solid #e8e8e8;}
	section#ad-editor .ad-html {width:100vw;padding:0;/*padding-left:4vw; padding-right:4vw;*/}
	section#ad-editor .ad-html.shrink {/*padding-left:10vw; padding-right:10vw;*/}
	section#ad-editor .ad-html.shrink .ad-options {/*padding:7px 0;*/}
	section#ad-editor #ad-template {/*width:calc(100vw - 8vw);height:calc(100vw - 8vw);*/}
	section#ad-editor .ad-html.shrink #ad-template {/*width:calc(100vw - 20vw);height:calc(100vw - 20vw);*/}
	.ad-tools .navigation {padding:0;width: 100%;min-width: 100%;border:0;align-items: center;display: flex;}
	.ad-tools .navigation a {width: 11.11%;float: left;padding:0 0.5%;margin:0;border-top:0;}
	.ad-tools .navigation a + a {margin-top:0;padding-top:0;border-top:0;}
	.ad-tools .navigation a i {font-size:100%}
	.ad-tools .navigation a small {font-size: 70%;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 1;-webkit-box-orient: vertical;line-height: 1;}
	.ad-tools .content {min-width:100%;position: fixed;bottom:0;height: calc(100vh - 100vw);z-index:2;display:none;border-top-left-radius:1rem;border-top-right-radius:1rem;border-top:1px solid rgba(0,0,0,0.075);box-shadow: 0px -2px 2px rgba(0,0,0,0.075);overflow-x:hidden;overflow-y:hidden;padding-bottom: 25px;}
	.ad-tools .content.active {display:block;}
	.ad-tools .content .tools-inner {padding: 0 15px 35px 15px;}
	.btn-options-close, .btn-options-close:hover {display:block;width:100%;text-align:center;line-height:1;color:#999999;font-size:130%;float: left;box-shadow: 0px 1px 3px rgba(0,0,0,0.075);margin-bottom: 10px;padding: 6px 0 3px 0;background-color: #ffffff;}
	#page-content {position: relative;z-index: 0;min-height: calc(100vh — 20vh);display: block;float: left;}
	#footer {display:none;}
	#ad-editor {overflow:hidden;}
	
	.ad-meta-preview {margin-top:0;padding:15px;}
	.ad-meta-row {margin-right: -15px;}
	.ad-meta-row .ad-meta {padding-right: 15px;}
	
}


/*additions: 20230510*/
#page-content.container-fluid {padding-right: 0;}
section#ad-editor .ad-tools {/*width: calc(100vw - 72vw);*/margin-right: 0;}
.ad-options {background-color: #fff;padding-left:15px;padding-right:15px;border-bottom:1px solid rgba(102,120,138,0.2)}
section#ad-editor #ad-template {height: calc(100vh - 115px);}

#ad-template .upload-info {position: absolute; z-index: 9;line-height: 100%;}
#ad-template .upload-info h3 {line-height: 100%; margin: 0;color:rgba(0,0,0,0.15);}
#ad-template .upload-info small {line-height: 100%;color:rgba(0,0,0,0.25);}

/*tour*/
.tourElementWrapper .panel {
  position: fixed;
  top: 100px;
  left: 100px;
  background-color: #0d3b66;
  backdrop-filter: blur(5px);
  box-shadow: 0 1px 3px hsla(0deg, 0%, 0%, 0.3), 0 3px 2px hsla(0deg, 0%, 0%, 0.2);
  border-radius: 4px;
  padding: 1rem;
  width: 275px;
  font-family: "Open Sans";
  color:#ffffff;
  transition-property: top left;
  transition-duration: 0.5s;
  transition-timing-function: ease;
	font-size:90%
}
.tourElementWrapper .panel h2 {
  margin-top: 0;
  margin-bottom: 0.2rem;
	font-size:140%;
	font-weight:400;
}
.tourElementWrapper .panel p {
  margin-top: 0;
	font-weight:300;
}
.tourElementWrapper .panel a, .tourElementWrapper .panel a:hover {
  color: #a2d2ff;
	font-size: 90%;
	font-weight: 600;
	float: right;
	margin-top: 12px;
	cursor:pointer;
}
.tourElementWrapper .panel .buttonBar {
  display: flex;
  justify-content: space-between;
}
.tourElementWrapper .panel .buttonBar button {
  font: inherit;
  background-color: #ffffff;
  border: 0;
  border-radius: 35px;
	padding: 0 15px;
	line-height: 24px;
	font-size: 90%;
}
.tourElementWrapper .panel .buttonBar button:hover {
  /*border-color: rgba(0,0,0,0.3);*/
  cursor: pointer;
}
.tourElementWrapper .indicator {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background-color: rgba(0, 0, 0, 0.5);
  transition-property: clip-path;
  transition-duration: 0.5s;
  transition-timing-function: ease;
}