#opd-design *{-webkit-box-sizing:border-box;box-sizing:border-box}#opd-design-content:after,#opd-design-element:after,.side-tab-nav:after,#opd-design-top:after,#main-opd-design:after,.opd-left-content-tabs:after,#opd-upload-list:after,.side-layer-content:after{clear:both;content:".";display:block;font-size:0;line-height:0;overflow:hidden}#opd-design{width:100%;position:relative}#opd-design ul{margin:0;padding:0}#opd-design ul li{list-style:none}#opd-design-content,.opd-steps-content #opd-design{background:url(../images/pattern1.jpg) repeat transparent;position:relative;width:100%;height:100%}#opd-design-top{min-height:46px;width:100%;padding:8px 18px;background:#1abc9c;color:#fff;position:relative;z-index:99}#opd-design-top,#opd-design-top a,#opd-design-top a:hover,#opd-design-top a:focus{color:#fff;font-weight:500;font-size:1em;text-decoration:none !important}#opd-design-top #opd-design-design-side,#opd-design-top #opd-design-design-side a,#opd-design-top #opd-design-design-side a:hover,#opd-design-top #opd-design-design-side a:focus{color:#333}#opd-design-designs{float:left;position:relative;min-width:300px;padding-left:80px}.full-scr{position:absolute;top:0;left:0}.full-scr .fas{width:30px;height:30px;line-height:26px;font-size:1.8em;cursor:pointer;border:2px solid #ffffffb8;text-align:center}.full-scr .fa-compress-arrows-alt{display:none}.opd-dropdown{position:absolute;background:#fff;top:100%;left:0;padding:30px 12px 18px;min-width:180px;border:1px solid #cdcdcd;border-radius:0 0 6px 6px;-webkit-box-shadow:0px 2px 10px -2px rgba(0,0,0,.3);box-shadow:0px 2px 10px -2px rgba(0,0,0,.3)}#opd-design-designs-content .opd-dropdown{left:80px}#opd-design-designs-tabs li.active>a{background:#ffffff42}#main-opd-design{position:relative;min-height:760px}#opd-design-element-content{margin:10px auto 0;height:35px}#opd-design-element .edit-object{border:1px solid #cccccc6b;max-width:800px;text-align:center;border-radius:4px;background:#fff}#opd-design-element li{float:left;margin:0}#opd-design-element input[type=text],#opd-design-element select{border:0;box-shadow:0 0 0 transparent !important;height:33px}#opd-design-element select{-webkit-appearance:none;-moz-appearance:none;-ms-appearance:none;appearance:none;background-size:30px 60px;text-indent:.01em;text-overflow:'';padding:4px 25px 5px 10px;box-sizing:border-box;background:#fff url('../images/select-bg.svg') no-repeat 100% 45%;text-align:right}#opd-design-element div>ul>li{position:relative}.element-list-icon>li>a,.opd-text-style>a,.opd-text-align>a,#opd-color-text,#opd-color-svg{line-height:30px;width:30px;display:block;text-align:center}#opd-design-element div li{list-style:none}#opd-color-text-list{position:absolute;width:300px;background:#fff;padding:16px;border:1px solid #cdcdcd;-webkit-box-shadow:0px 2px 10px -2px rgba(0,0,0,.3);box-shadow:0px 2px 10px -2px rgba(0,0,0,.3);z-index:99999}#opd-color-svg-list{position:absolute;width:300px;background:#fff;padding:16px;border:1px solid #cdcdcd;-webkit-box-shadow:0px 2px 10px -2px rgba(0,0,0,.3);box-shadow:0px 2px 10px -2px rgba(0,0,0,.3);z-index:99999}#opd-color-text-list:before,#opd-color-svg-list:before{content:"";position:absolute;border-style:solid;bottom:100%;left:8px;border-width:6px;border-color:transparent transparent #fff}#opd-color-text-list li,#opd-color-svg-list li{width:32px;text-align:center;font-size:1.8em}#opd-design-top #color-svg-close,#opd-design-top #color-text-close{position:absolute;color:#333;top:-2px;right:6px}#opd-design-action{float:right}#opd-design-action li,#opd-design-designs-tabs li{float:left;margin:0;line-height:30px}#opd-design-action li a,#opd-design-designs-tabs li a{display:block;padding:0 12px}#opd-design-action li a:hover{background:#ffffff42}#opd-design-action li a i,#opd-design-designs-tabs li a i{margin-right:3px}#opd-design-right{margin-left:120px;z-index:1;position:relative;height:100%;overflow:auto}#opd-design-right .canvas-container{margin:10px auto;z-index:10000}#opd-design-left-menu{position:absolute;width:98px;background:#272c33;top:0;bottom:0;left:0;z-index:2}#opd-design-left-menu ul{text-align:center;height:100%;overflow:auto}#opd-design-left-menu ul li{margin:0;width:100%}#opd-left-content{position:absolute;top:0;left:98px;bottom:0;background:#fff;-webkit-box-shadow:0px 2px 10px -2px rgba(0,0,0,.3);box-shadow:0px 2px 10px -2px rgba(0,0,0,.3);overflow-x:hidden;overflow-y:auto}.opd-left-content-tabs{width:300px;padding:30px 20px 20px;position:relative}.opd-left-content-tabs .opd-action-close-left,#opd-design-design-side .opd-action-close-left{position:absolute;top:2px;right:2px;font-size:2em;line-height:1;color:#000}.opd-left-content-tabs .opd-action-close-left:hover,#opd-design-design-side .opd-action-close-left:hover{font-size:2em}#opd-design-left-menu>ul>li>a{display:block;color:#fff;padding:8px;position:relative;text-decoration:none !important}#opd-design-left-menu ul li a i{font-size:2.8rem;width:100%;line-height:36px}#opd-design-left-menu ul li.active>a,#opd-design-left-menu ul li.active>a:hover{background:#ffffff42}#opd-design-left-menu ul li.active>a:before{content:"";position:absolute;border-style:solid;border-width:8px;border-color:transparent #fff transparent transparent;right:0;top:50%;margin-top:-8px}.opd-left-content-tabs span.opd-image{width:33.3333%;float:left;padding:8px;max-height:100px;text-align:center;position:relative;overflow:hidden}.opd-left-content-tabs span.opd-image:nth-child(3n+2){clear:left}.opd-left-content-tabs span.opd-image img{max-width:100%;height:68px}.opd-left-content-tabs span.opd-image .opd-image-price{position:absolute;bottom:0;right:0;background:#ffffff80;color:#f75212;font-weight:700;width:100%}#opd-design ul.side-layer-content{padding:12px 0}.side-layer-content li{white-space:nowrap;display:inline-block;padding:6px 0;margin:0;border-bottom:1px solid #cccccc3d}.side-layer-content li>.opd-layer-title{width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:1.4rem;text-align:left}.side-layer-content li>span{display:inline-block;vertical-align:middle}.side-layer-content li>span:not(:first-child){margin-left:18px}.side-layer-content li img{width:38px !important;max-height:38px}.side-layer-content li span i{cursor:pointer}.side-layer-content li span.opd-layer-title{cursor:pointer}#opd-upload-list img{width:100%;max-height:100px}#opd-upload-list span{position:relative;float:left;width:50%;padding:8px;margin:8px 0}#opd-upload-list span:nth-child(2n+1){clear:left}#opd-upload-list span a{position:absolute;top:-3px;right:0;color:red}#opd-upload-list span a.opd-crop-image{right:15px}.list-canvas{width:99%;margin:0 auto;margin-top:10px}#bnt-opd-design{background:#1abc9c;border:0;color:#fff;width:100%;padding:6px 0;font-size:1.3em;border-radius:30px;margin-top:10px}#opd-design-left-menu ul.side-tab-nav li.active{border:1px solid #f7f7f7;box-shadow:2px 3px #f7f7f7;z-index:999999}#bnt-opd-design:hover{background:#19a88c}#bnt-opd-design>img{position:absolute;max-height:30px;top:50%;margin-top:-15px;right:8px}#opd-preview svg{max-width:100%}#opd-design-top input[type=text]{width:100%;background:#fff;border:1px solid #c2c2c2;height:30px;line-height:1.42857143;padding:0 9px;color:#666}#opd-design-top select{color:#666;border:1px solid #c2c2c2;height:30px;-webkit-appearance:none;-moz-appearance:none;-ms-appearance:none;appearance:none;background-size:30px 60px;text-indent:.01em;text-overflow:'';background:#fff url('../images/select-bg.svg') no-repeat 100% 45%;padding:4px 25px 5px 10px}#opd-left-content textarea{border:1px solid #c2c2c2;width:100%}.side-tab-nav>li{float:left;margin:0}.side-tab-nav>li:not(:first-child){margin-left:18px}.side-tab-nav>li>a{display:grid}.opd-side-layer{display:block;white-space:nowrap}.full-opd-design{position:fixed !important;z-index:99;left:0;top:0;bottom:0;right:0;background:#fff}.full-opd-design #main-opd-design{position:absolute;top:0;left:0;right:0;bottom:0;padding-top:46px}.full-opd-design #opd-design-left-menu{top:46px}.full-opd-design #main-opd-design{min-height:0}.opd-side img{width:90%}.opd-side svg{width:76px;max-height:150px;height:auto}.opd-shapes img{width:30%}#opd-element-text ul li.active a{color:red}#opd-qr-menu{float:left;margin-bottom:5px}#opd-qr-menu li{display:inline;padding:0 10px}#opd-qr-menu li:first-child{padding-left:0 !important}#opd-qr-menu li.active-qr a{color:red}#opd-action-left-zoom ul li{display:inline;float:left;width:30%}#opd-preview-design .rcrop-wrapper{float:left;width:70%}.opd-template-item{float:left;width:40%;margin-left:2%;text-align:center}.opd-template-item svg{max-width:100%;height:150px}#opd-action-left-template .opd-template-item-active label{color:red;font-weight:700}#opd-action-left-background ul li{display:inline;float:left}#opd-action-left-background ul li i{font-size:2em}#opd-action-left-design-colors ul li{display:inline;float:left;margin-left:5px;width:10%}.opd-drawing-content label{float:left;width:100%}.opd-drawing-content input{float:left;width:70%}.opd-drawing-content span{width:25%;float:left}#opd-design-action li a.opd-undo-inactive,#opd-design-action li a.opd-redo-inactive{color:#ccc}.opd-color-white{border:1px solid #ccc}.opd-category-image-sku{float:left;width:33.33%;min-height:100px;padding:5px}.opd-category-image-sku img{height:80px}.opd-category-image-sku-price{width:100%;padding:3px 0;text-align:center;float:left;background:#ffffff80;color:#f75212;font-weight:700}.opd-image-categories{float:left;width:100%;padding-bottom:10px;border-bottom:1px solid #bfbfbf;margin-bottom:10px}.opd-image-category{float:left;width:30%;text-align:center;border:1px solid #bfbfbf;padding:28px 0;margin-left:3%;margin-top:10px;border-radius:3px}.opd-image-category-active{border:1px solid #006400}.opd-login-input{margin-top:10px}.opd-sides-right{position:absolute;top:10px;right:10px;border:1px solid #fff;border-radius:5px;background-color:#fff;padding:10px}.modal-popup .modal-inner-wrap{width:80% !important;margin:1rem auto !important;max-height:1000px !important}#opd-login-content{width:60%;margin:5px auto}#opd-login-content label{width:100%}#opd-login-content input{width:100%}.grid-toggle-switch{display:inline-block;position:relative;width:50px;height:26px}.grid-toggle-input{display:none}.grid-toggle-label{display:block;position:absolute;top:5px;left:0;width:50px;height:26px;border-radius:13px;background-color:#ccc;cursor:pointer;transition:background-color .3s ease-in-out}.grid-toggle-input:checked+.grid-toggle-label{background-color:#4caf50}.grid-toggle-label:before{content:"";display:block;position:absolute;top:2px;left:2px;width:22px;height:22px;border-radius:50%;background-color:#fff;box-shadow:0px 2px 5px rgba(0,0,0,.3);transition:transform .3s ease-in-out}.grid-toggle-input:checked+.grid-toggle-label:before{transform:translateX(24px)}.scroll-canvas{position:relative}.scroll-canvas .grid{display:grid;grid-template-columns:repeat(40,40px);grid-template-rows:repeat(30,40px);grid-gap:0;margin:0 auto;border:1px solid #ccc;pointer-events:none;position:absolute;z-index:999999;opacity:.2}.scroll-canvas .grid .grid-item{background-color:#fff;border:1px solid #ccc}@media only screen and (min-width:768px){#opd-preview{width:57%}.mobile-action{display:none !important}}@media only screen and (max-width:767px){#opd-design-element-content:after{clear:both;content:".";display:block;font-size:0;line-height:0;overflow:hidden}#opd-design-element-content{height:auto}#opd-design-element div>ul>li.color-text{clear:left}#opd-design-action{position:relative}.mobile-action{display:block;line-height:30px;padding:0;padding:0 20px;display:inline-block;cursor:pointer;font-size:1.6rem;font-weight:600}.mobile-action>i{margin-left:6px}.mobile-dropdown{display:none;position:absolute;background:#fff;width:298px;right:0;top:100%;-webkit-box-shadow:0px 2px 10px -2px rgba(0,0,0,.3);box-shadow:0px 2px 10px -2px rgba(0,0,0,.3)}#opd-design-action li{width:50%}#opd-design-top #opd-design-action a,#opd-design-top #opd-design-action a:hover,#opd-design-top #opd-design-action a:focus{color:#333}.mobile-action.active+.mobile-dropdown{display:block}#opd-design-right{margin-left:66px}#opd-design-left-menu{width:58px}#opd-left-content{left:58px}#opd-design-left-menu>ul>li>a{font-size:.9em;padding-bottom:3px}#opd-design-left-menu ul li a i{line-height:26px;font-size:2rem}}@media only screen and (max-width:639px){#opd-design-element div>ul>li.opd-text-font{clear:left}#opd-design-element div>ul>li:not(:first-child){border-top:1px solid #dddddf78}}@media only screen and (max-width:482px){#bnt-opd-design{width:100% !important}}