-
Notifications
You must be signed in to change notification settings - Fork 1.3k
/
tui-image-editor.css.map
1 lines (1 loc) 路 68.5 KB
/
tui-image-editor.css.map
1
{"version":3,"sources":["webpack://tui.ImageEditor/src/css/main.styl","webpack://tui.ImageEditor/index.styl","webpack://tui.ImageEditor/src/css/gridtable.styl","webpack://tui.ImageEditor/src/css/submenu.styl","webpack://tui.ImageEditor/src/css/checkbox.styl","webpack://tui.ImageEditor/src/css/range.styl","webpack://tui.ImageEditor/src/css/position.styl","webpack://tui.ImageEditor/src/css/icon.styl","webpack://tui.ImageEditor/src/css/colorpicker.styl","webpack://tui.ImageEditor/src/css/buttons.styl","webpack://tui.ImageEditor/src/css/index.styl"],"names":[],"mappings":"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","file":"tui-image-editor.css","sourcesContent":["body > textarea\n position: fixed !important;\n\n+prefix-classes(prefix)\n .-container\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n min-height: 300px;\n height: 100%;\n position: relative;\n background-color: #282828;\n overflow: hidden;\n letter-spacing: 0.3px;\n \n div, ul, label, input, li\n box-sizing: border-box;\n margin: 0;\n padding: 0;\n -ms-user-select: none; \n -moz-user-select: -moz-none;\n -khtml-user-select: none;\n -webkit-user-select: none;\n user-select: none;\n \n .-header\n /* BUTTON AND LOGO */\n min-width: 533px;\n position: absolute;\n background-color: #151515;\n top: 0;\n width: 100%;\n .-header-buttons,\n .-controls-buttons\n float: right;\n margin: 8px;\n\n .-header-logo,\n .-controls-logo\n float: left;\n width: 30%;\n padding: 17px;\n\n .-controls-logo,\n .-controls-buttons\n width: 270px;\n height: 100%;\n display: none;\n\n .-header-buttons button,\n .-header-buttons div,\n .-controls-buttons button,\n .-controls-buttons div\n display: inline-block;\n position: relative;\n width: 120px;\n height: 40px;\n padding: 0;\n line-height: 40px;\n outline: none;\n border-radius: 20px;\n border: 1px solid #ddd;\n font-family: 'Noto Sans', sans-serif;\n font-size: 12px;\n font-weight: bold;\n cursor: pointer;\n vertical-align: middle;\n letter-spacing: 0.3px;\n text-align: center;\n\n .-download-btn\n background-color: #fdba3b;\n border-color: #fdba3b;\n color: #fff;\n .-load-btn\n position: absolute;\n left: 0;\n right: 0;\n display: inline-block;\n top: 0;\n bottom: 0;\n width: 100%;\n cursor: pointer;\n opacity: 0;\n .-main-container\n position: absolute;\n width: 100%;\n top: 0;\n bottom: 64px;\n .-main\n position: absolute;\n text-align: center;\n top: 64px;\n bottom: 0;\n right: 0;\n left: 0;\n .-wrap\n position: absolute;\n bottom: 0;\n width: 100%;\n overflow: auto;\n .-size-wrap\n display: table;\n width: 100%;\n height: 100%\n .-align-wrap\n display: table-cell;\n vertical-align: middle;\n .\n position: relative;\n display: inline-block;\n\n\n/* BIG MENU */\n.{prefix}-container\n .{prefix}-menu\n width: auto;\n list-style: none;\n padding: 0;\n margin: 0 auto;\n display: table-cell;\n text-align: center;\n vertical-align: middle;\n white-space: nowrap;\n > .{prefix}-item\n position: relative;\n display: inline-block;\n border-radius: 2px;\n padding: 7px 8px 3px 8px;\n cursor: pointer;\n margin: 0 4px;\n > .{prefix}-item[tooltip-content]:hover\n &:before\n content: '';\n position: absolute;\n display: inline-block;\n margin: 0 auto 0;\n width: 0;\n height: 0;\n border-right: 7px solid transparent;\n border-top: 7px solid #2f2f2f;\n border-left: 7px solid transparent;\n left: 13px;\n top: -2px;\n &:after\n content: attr(tooltip-content);\n position: absolute;\n display: inline-block;\n background-color: #2f2f2f;\n color: #fff;\n padding: 5px 8px;\n font-size: 11px;\n font-weight: lighter;\n border-radius: 3px;\n max-height: 23px;\n top: -25px;\n left: 0;\n min-width: 24px;\n > .{prefix}-item.active\n background-color: #fff;\n transition: all .3s ease;\n .{prefix}-wrap\n position: absolute;\n","body > textarea {\n position: fixed !important;\n}\n.tui-image-editor-container {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n min-height: 300px;\n height: 100%;\n position: relative;\n background-color: #282828;\n overflow: hidden;\n letter-spacing: 0.3px;\n}\n.tui-image-editor-container div,\n.tui-image-editor-container ul,\n.tui-image-editor-container label,\n.tui-image-editor-container input,\n.tui-image-editor-container li {\n box-sizing: border-box;\n margin: 0;\n padding: 0;\n -ms-user-select: none;\n -moz-user-select: -moz-none;\n -khtml-user-select: none;\n -webkit-user-select: none;\n user-select: none;\n}\n.tui-image-editor-container .tui-image-editor-header {\n/* BUTTON AND LOGO */\n min-width: 533px;\n position: absolute;\n background-color: #151515;\n top: 0;\n width: 100%;\n}\n.tui-image-editor-container .tui-image-editor-header-buttons,\n.tui-image-editor-container .tui-image-editor-controls-buttons {\n float: right;\n margin: 8px;\n}\n.tui-image-editor-container .tui-image-editor-header-logo,\n.tui-image-editor-container .tui-image-editor-controls-logo {\n float: left;\n width: 30%;\n padding: 17px;\n}\n.tui-image-editor-container .tui-image-editor-controls-logo,\n.tui-image-editor-container .tui-image-editor-controls-buttons {\n width: 270px;\n height: 100%;\n display: none;\n}\n.tui-image-editor-container .tui-image-editor-header-buttons button,\n.tui-image-editor-container .tui-image-editor-header-buttons div,\n.tui-image-editor-container .tui-image-editor-controls-buttons button,\n.tui-image-editor-container .tui-image-editor-controls-buttons div {\n display: inline-block;\n position: relative;\n width: 120px;\n height: 40px;\n padding: 0;\n line-height: 40px;\n outline: none;\n border-radius: 20px;\n border: 1px solid #ddd;\n font-family: 'Noto Sans', sans-serif;\n font-size: 12px;\n font-weight: bold;\n cursor: pointer;\n vertical-align: middle;\n letter-spacing: 0.3px;\n text-align: center;\n}\n.tui-image-editor-container .tui-image-editor-download-btn {\n background-color: #fdba3b;\n border-color: #fdba3b;\n color: #fff;\n}\n.tui-image-editor-container .tui-image-editor-load-btn {\n position: absolute;\n left: 0;\n right: 0;\n display: inline-block;\n top: 0;\n bottom: 0;\n width: 100%;\n cursor: pointer;\n opacity: 0;\n}\n.tui-image-editor-container .tui-image-editor-main-container {\n position: absolute;\n width: 100%;\n top: 0;\n bottom: 64px;\n}\n.tui-image-editor-container .tui-image-editor-main {\n position: absolute;\n text-align: center;\n top: 64px;\n bottom: 0;\n right: 0;\n left: 0;\n}\n.tui-image-editor-container .tui-image-editor-wrap {\n position: absolute;\n bottom: 0;\n width: 100%;\n overflow: auto;\n}\n.tui-image-editor-container .tui-image-editor-wrap .tui-image-editor-size-wrap {\n display: table;\n width: 100%;\n height: 100%;\n}\n.tui-image-editor-container .tui-image-editor-wrap .tui-image-editor-size-wrap .tui-image-editor-align-wrap {\n display: table-cell;\n vertical-align: middle;\n}\n.tui-image-editor-container .tui-image-editor {\n position: relative;\n display: inline-block;\n}\n.tui-image-editor-container .tui-image-editor-menu {\n width: auto;\n list-style: none;\n padding: 0;\n margin: 0 auto;\n display: table-cell;\n text-align: center;\n vertical-align: middle;\n white-space: nowrap;\n}\n.tui-image-editor-container .tui-image-editor-menu > .tui-image-editor-item {\n position: relative;\n display: inline-block;\n border-radius: 2px;\n padding: 7px 8px 3px 8px;\n cursor: pointer;\n margin: 0 4px;\n}\n.tui-image-editor-container .tui-image-editor-menu > .tui-image-editor-item[tooltip-content]:hover:before {\n content: '';\n position: absolute;\n display: inline-block;\n margin: 0 auto 0;\n width: 0;\n height: 0;\n border-right: 7px solid transparent;\n border-top: 7px solid #2f2f2f;\n border-left: 7px solid transparent;\n left: 13px;\n top: -2px;\n}\n.tui-image-editor-container .tui-image-editor-menu > .tui-image-editor-item[tooltip-content]:hover:after {\n content: attr(tooltip-content);\n position: absolute;\n display: inline-block;\n background-color: #2f2f2f;\n color: #fff;\n padding: 5px 8px;\n font-size: 11px;\n font-weight: lighter;\n border-radius: 3px;\n max-height: 23px;\n top: -25px;\n left: 0;\n min-width: 24px;\n}\n.tui-image-editor-container .tui-image-editor-menu > .tui-image-editor-item.active {\n background-color: #fff;\n transition: all 0.3s ease;\n}\n.tui-image-editor-container .tui-image-editor-wrap {\n position: absolute;\n}\n.tui-image-editor-container .tui-image-editor-grid-visual {\n display: none;\n position: absolute;\n width: 100%;\n height: 100%;\n border: 1px solid rgba(255,255,255,0.7);\n}\n.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-flip .tui-image-editor,\n.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-rotate .tui-image-editor {\n transition: none;\n}\n.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-flip .tui-image-editor-grid-visual,\n.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-rotate .tui-image-editor-grid-visual {\n display: block;\n}\n.tui-image-editor-container .tui-image-editor-grid-visual table {\n width: 100%;\n height: 100%;\n border-collapse: collapse;\n}\n.tui-image-editor-container .tui-image-editor-grid-visual table td {\n border: 1px solid rgba(255,255,255,0.3);\n}\n.tui-image-editor-container .tui-image-editor-grid-visual table td.dot:before {\n content: '';\n position: absolute;\n box-sizing: border-box;\n width: 10px;\n height: 10px;\n border: 0;\n box-shadow: 0 0 1px 0 rgba(0,0,0,0.3);\n border-radius: 100%;\n background-color: #fff;\n}\n.tui-image-editor-container .tui-image-editor-grid-visual table td.dot.left-top:before {\n top: -5px;\n left: -5px;\n}\n.tui-image-editor-container .tui-image-editor-grid-visual table td.dot.right-top:before {\n top: -5px;\n right: -5px;\n}\n.tui-image-editor-container .tui-image-editor-grid-visual table td.dot.left-bottom:before {\n bottom: -5px;\n left: -5px;\n}\n.tui-image-editor-container .tui-image-editor-grid-visual table td.dot.right-bottom:before {\n bottom: -5px;\n right: -5px;\n}\n.tui-image-editor-container .tui-image-editor-submenu {\n display: none;\n position: absolute;\n bottom: 0;\n width: 100%;\n height: 150px;\n white-space: nowrap;\n z-index: 2;\n}\n.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button:hover svg > use.active {\n display: block;\n}\n.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item li {\n display: inline-block;\n vertical-align: top;\n}\n.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-image-editor-newline {\n display: block;\n margin-top: 0;\n}\n.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-image-editor-button {\n position: relative;\n cursor: pointer;\n display: inline-block;\n font-weight: normal;\n font-size: 11px;\n margin: 0 9px 0 9px;\n}\n.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-image-editor-button.preset {\n margin: 0 9px 20px 5px;\n}\n.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item label > span {\n display: inline-block;\n cursor: pointer;\n padding-top: 5px;\n font-family: \"Noto Sans\", sans-serif;\n font-size: 11px;\n}\n.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-image-editor-button.apply label,\n.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-image-editor-button.cancel label {\n vertical-align: 7px;\n}\n.tui-image-editor-container .tui-image-editor-submenu > div {\n display: none;\n vertical-align: bottom;\n}\n.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-style {\n opacity: 0.95;\n z-index: -1;\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n display: block;\n}\n.tui-image-editor-container .tui-image-editor-partition > div {\n width: 1px;\n height: 52px;\n border-left: 1px solid #3c3c3c;\n margin: 0 8px 0 8px;\n}\n.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-filter .tui-image-editor-partition > div {\n height: 108px;\n margin: 0 29px 0 0px;\n}\n.tui-image-editor-container .tui-image-editor-submenu-align {\n text-align: left;\n margin-right: 30px;\n}\n.tui-image-editor-container .tui-image-editor-submenu-align label > span {\n width: 55px;\n white-space: nowrap;\n}\n.tui-image-editor-container .tui-image-editor-submenu-align:first-child {\n margin-right: 0;\n}\n.tui-image-editor-container .tui-image-editor-submenu-align:first-child label > span {\n width: 70px;\n}\n.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-crop .tui-image-editor-submenu > div.tui-image-editor-menu-crop,\n.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-flip .tui-image-editor-submenu > div.tui-image-editor-menu-flip,\n.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-rotate .tui-image-editor-submenu > div.tui-image-editor-menu-rotate,\n.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-shape .tui-image-editor-submenu > div.tui-image-editor-menu-shape,\n.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-text .tui-image-editor-submenu > div.tui-image-editor-menu-text,\n.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-mask .tui-image-editor-submenu > div.tui-image-editor-menu-mask,\n.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-icon .tui-image-editor-submenu > div.tui-image-editor-menu-icon,\n.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-draw .tui-image-editor-submenu > div.tui-image-editor-menu-draw,\n.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-filter .tui-image-editor-submenu > div.tui-image-editor-menu-filter {\n display: table-cell;\n}\n.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-crop .tui-image-editor-submenu,\n.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-flip .tui-image-editor-submenu,\n.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-rotate .tui-image-editor-submenu,\n.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-shape .tui-image-editor-submenu,\n.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-text .tui-image-editor-submenu,\n.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-mask .tui-image-editor-submenu,\n.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-icon .tui-image-editor-submenu,\n.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-draw .tui-image-editor-submenu,\n.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-filter .tui-image-editor-submenu {\n display: table;\n}\n.tui-image-editor-container .filter-color-item {\n display: inline-block;\n}\n.tui-image-editor-container .filter-color-item .tui-image-editor-checkbox {\n display: block;\n}\n.tui-image-editor-container .tui-image-editor-checkbox-wrap {\n display: inline-block !important;\n text-align: left;\n}\n.tui-image-editor-container .tui-image-editor-checkbox-wrap.fixed-width {\n width: 187px;\n white-space: normal;\n}\n.tui-image-editor-container .tui-image-editor-checkbox {\n display: inline-block;\n margin: 1px 0 1px 0;\n}\n.tui-image-editor-container .tui-image-editor-checkbox input {\n width: 14px;\n height: 14px;\n opacity: 0;\n}\n.tui-image-editor-container .tui-image-editor-checkbox > label > span {\n color: #fff;\n height: 14px;\n position: relative;\n}\n.tui-image-editor-container .tui-image-editor-checkbox input + label:before,\n.tui-image-editor-container .tui-image-editor-checkbox > label > span:before {\n content: '';\n position: absolute;\n width: 14px;\n height: 14px;\n background-color: #fff;\n top: 6px;\n left: -19px;\n display: inline-block;\n margin: 0;\n text-align: center;\n font-size: 11px;\n border: 0;\n border-radius: 2px;\n padding-top: 1px;\n box-sizing: border-box;\n}\n.tui-image-editor-container .tui-image-editor-checkbox input[type='checkbox']:checked + span:before {\n background-size: cover;\n background-image: url(\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAAAXNSR0IArs4c6QAAAMBJREFUKBWVkjEOwjAMRe2WgZW7IIHEDdhghhuwcQ42rlJugAQS54Cxa5cq1QM5TUpByZfS2j9+dlJVt/tX5ZxbS4ZU9VLkQvSHKTIGRaVJYFmKrBbTCJxE2UgCdDzMZDkHrOV6b95V0US6UmgKodujEZbJg0B0ZgEModO5lrY1TMQf1TpyJGBEjD+E2NPN7ukIUDiF/BfEXgRiGEw8NgkffYGYwCi808fpn/6OvfUfsDr/Vc1IfRf8sKnFVqeiVQfDu0tf/nWH9gAAAABJRU5ErkJggg==\");\n}\n.tui-image-editor-container .tui-image-editor-selectlist-wrap {\n position: relative;\n}\n.tui-image-editor-container .tui-image-editor-selectlist-wrap select {\n width: 100%;\n height: 28px;\n margin-top: 4px;\n border: 0;\n outline: 0;\n border-radius: 0;\n border: 1px solid #cbdbdb;\n background-color: #fff;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n padding: 0 7px 0 10px;\n}\n.tui-image-editor-container .tui-image-editor-selectlist-wrap .tui-image-editor-selectlist {\n display: none;\n position: relative;\n top: -1px;\n border: 1px solid #ccc;\n background-color: #fff;\n border-top: 0px;\n padding: 4px 0;\n}\n.tui-image-editor-container .tui-image-editor-selectlist-wrap .tui-image-editor-selectlist li {\n display: block;\n text-align: left;\n padding: 7px 10px;\n font-family: 'Noto Sans', sans-serif;\n}\n.tui-image-editor-container .tui-image-editor-selectlist-wrap .tui-image-editor-selectlist li:hover {\n background-color: rgba(81,92,230,0.05);\n}\n.tui-image-editor-container .tui-image-editor-selectlist-wrap:before {\n content: '';\n position: absolute;\n display: inline-block;\n width: 14px;\n height: 14px;\n right: 5px;\n top: 10px;\n background-image: url(\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAAAXNSR0IArs4c6QAAAHlJREFUKBVjYBgFOEOAEVkmPDxc89+/f6eAYjzI4kD2FyYmJrOVK1deh4kzwRggGiQBVJCELAZig8SQNYHEmEEEMrh69eo1HR0dfqCYJUickZGxf9WqVf3IakBsFBthklpaWmVA9mEQhrJhUoTp0NBQCRAmrHL4qgAAuu4cWZOZIGsAAAAASUVORK5CYII=\");\n background-size: cover;\n}\n.tui-image-editor-container .tui-image-editor-selectlist-wrap select::-ms-expand {\n display: none;\n}\n.tui-image-editor-container .tui-image-editor-virtual-range-bar .tui-image-editor-disabled,\n.tui-image-editor-container .tui-image-editor-virtual-range-subbar .tui-image-editor-disabled,\n.tui-image-editor-container .tui-image-editor-virtual-range-pointer .tui-image-editor-disabled {\n backbround-color: #f00;\n}\n.tui-image-editor-container .tui-image-editor-range {\n position: relative;\n top: 5px;\n width: 166px;\n height: 17px;\n display: inline-block;\n}\n.tui-image-editor-container .tui-image-editor-virtual-range-bar {\n top: 7px;\n position: absolute;\n width: 100%;\n height: 2px;\n background-color: #666;\n}\n.tui-image-editor-container .tui-image-editor-virtual-range-subbar {\n position: absolute;\n height: 100%;\n left: 0;\n right: 0;\n background-color: #d1d1d1;\n}\n.tui-image-editor-container .tui-image-editor-virtual-range-pointer {\n position: absolute;\n cursor: pointer;\n top: -5px;\n left: 0;\n width: 12px;\n height: 12px;\n background-color: #fff;\n border-radius: 100%;\n}\n.tui-image-editor-container .tui-image-editor-range-wrap {\n display: inline-block;\n margin-left: 4px;\n}\n.tui-image-editor-container .tui-image-editor-range-wrap.short .tui-image-editor-range {\n width: 100px;\n}\n.tui-image-editor-container .color-picker-control .tui-image-editor-range {\n width: 108px;\n margin-left: 10px;\n}\n.tui-image-editor-container .color-picker-control .tui-image-editor-virtual-range-pointer {\n background-color: #333;\n}\n.tui-image-editor-container .color-picker-control .tui-image-editor-virtual-range-bar {\n background-color: #ccc;\n}\n.tui-image-editor-container .color-picker-control .tui-image-editor-virtual-range-subbar {\n background-color: #606060;\n}\n.tui-image-editor-container .tui-image-editor-range-wrap.tui-image-editor-newline.short {\n margin-top: -2px;\n margin-left: 19px;\n}\n.tui-image-editor-container .tui-image-editor-range-wrap.tui-image-editor-newline.short label {\n color: #8e8e8e;\n font-weight: normal;\n}\n.tui-image-editor-container .tui-image-editor-range-wrap label {\n vertical-align: baseline;\n font-size: 11px;\n margin-right: 7px;\n color: #fff;\n}\n.tui-image-editor-container .tui-image-editor-range-value {\n cursor: default;\n width: 40px;\n height: 24px;\n outline: none;\n border-radius: 2px;\n box-shadow: none;\n border: 1px solid #d5d5d5;\n text-align: center;\n background-color: #1c1c1c;\n color: #fff;\n font-weight: lighter;\n vertical-align: baseline;\n font-family: 'Noto Sans', sans-serif;\n margin-top: 21px;\n margin-left: 4px;\n}\n.tui-image-editor-container .tui-image-editor-controls {\n position: absolute;\n background-color: #151515;\n width: 100%;\n height: 64px;\n display: table;\n bottom: 0;\n z-index: 2;\n}\n.tui-image-editor-container .tui-image-editor-icpartition {\n display: inline-block;\n background-color: #282828;\n width: 1px;\n height: 24px;\n}\n.tui-image-editor-container.left .tui-image-editor-menu > .tui-image-editor-item[tooltip-content]:before {\n left: 28px;\n top: 11px;\n border-right: 7px solid #2f2f2f;\n border-top: 7px solid transparent;\n border-bottom: 7px solid transparent;\n}\n.tui-image-editor-container.left .tui-image-editor-menu > .tui-image-editor-item[tooltip-content]:after {\n top: 7px;\n left: 42px;\n white-space: nowrap;\n}\n.tui-image-editor-container.left .tui-image-editor-submenu {\n left: 0;\n height: 100%;\n width: 248px;\n}\n.tui-image-editor-container.left .tui-image-editor-main-container {\n left: 64px;\n width: calc(100% - 64px);\n height: 100%;\n}\n.tui-image-editor-container.left .tui-image-editor-controls {\n width: 64px;\n height: 100%;\n display: table;\n}\n.tui-image-editor-container.left .tui-image-editor-menu,\n.tui-image-editor-container.right .tui-image-editor-menu {\n white-space: inherit;\n}\n.tui-image-editor-container.left .tui-image-editor-submenu,\n.tui-image-editor-container.right .tui-image-editor-submenu {\n white-space: normal;\n}\n.tui-image-editor-container.left .tui-image-editor-submenu > div,\n.tui-image-editor-container.right .tui-image-editor-submenu > div {\n vertical-align: middle;\n}\n.tui-image-editor-container.left .tui-image-editor-controls li,\n.tui-image-editor-container.right .tui-image-editor-controls li {\n display: inline-block;\n margin: 4px auto;\n}\n.tui-image-editor-container.left .tui-image-editor-icpartition,\n.tui-image-editor-container.right .tui-image-editor-icpartition {\n position: relative;\n top: -7px;\n width: 24px;\n height: 1px;\n}\n.tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-partition,\n.tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-partition {\n display: block;\n width: 75%;\n margin: auto;\n}\n.tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-partition > div,\n.tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-partition > div {\n border-left: 0;\n height: 10px;\n border-bottom: 1px solid #3c3c3c;\n width: 100%;\n margin: 0;\n}\n.tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-submenu-align,\n.tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-submenu-align {\n margin-right: 0;\n}\n.tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-submenu-item li,\n.tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-submenu-item li {\n margin-top: 15px;\n}\n.tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-colorpicker-clearfix li,\n.tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-colorpicker-clearfix li {\n margin-top: 0;\n}\n.tui-image-editor-container.left .tui-image-editor-checkbox-wrap.fixed-width,\n.tui-image-editor-container.right .tui-image-editor-checkbox-wrap.fixed-width {\n width: 182px;\n white-space: normal;\n}\n.tui-image-editor-container.left .tui-image-editor-range-wrap.tui-image-editor-newline label.range,\n.tui-image-editor-container.right .tui-image-editor-range-wrap.tui-image-editor-newline label.range {\n display: block;\n text-align: left;\n width: 75%;\n margin: auto;\n}\n.tui-image-editor-container.left .tui-image-editor-range,\n.tui-image-editor-container.right .tui-image-editor-range {\n width: 136px;\n}\n.tui-image-editor-container.right .tui-image-editor-menu > .tui-image-editor-item[tooltip-content]:before {\n left: -3px;\n top: 11px;\n border-left: 7px solid #2f2f2f;\n border-top: 7px solid transparent;\n border-bottom: 7px solid transparent;\n}\n.tui-image-editor-container.right .tui-image-editor-menu > .tui-image-editor-item[tooltip-content]:after {\n top: 7px;\n left: unset;\n right: 43px;\n white-space: nowrap;\n}\n.tui-image-editor-container.right .tui-image-editor-submenu {\n right: 0;\n height: 100%;\n width: 248px;\n}\n.tui-image-editor-container.right .tui-image-editor-main-container {\n right: 64px;\n width: calc(100% - 64px);\n height: 100%;\n}\n.tui-image-editor-container.right .tui-image-editor-controls {\n right: 0;\n width: 64px;\n height: 100%;\n display: table;\n}\n.tui-image-editor-container.top .tui-image-editor-submenu .tui-image-editor-partition.only-left-right,\n.tui-image-editor-container.bottom .tui-image-editor-submenu .tui-image-editor-partition.only-left-right {\n display: none;\n}\n.tui-image-editor-container.bottom .tui-image-editor-submenu > div {\n padding-bottom: 24px;\n}\n.tui-image-editor-container.top .color-picker-control .triangle {\n top: -8px;\n border-right: 7px solid transparent;\n border-top: 0px;\n border-left: 7px solid transparent;\n border-bottom: 8px solid #fff;\n}\n.tui-image-editor-container.top .tui-image-editor-size-wrap {\n height: 100%;\n}\n.tui-image-editor-container.top .tui-image-editor-main-container {\n bottom: 0;\n}\n.tui-image-editor-container.top .tui-image-editor-menu > .tui-image-editor-item[tooltip-content]:before {\n left: 13px;\n border-top: 0;\n border-bottom: 7px solid #2f2f2f;\n top: 33px;\n}\n.tui-image-editor-container.top .tui-image-editor-menu > .tui-image-editor-item[tooltip-content]:after {\n top: 38px;\n}\n.tui-image-editor-container.top .tui-image-editor-submenu {\n top: 0;\n bottom: auto;\n}\n.tui-image-editor-container.top .tui-image-editor-submenu > div {\n padding-top: 24px;\n vertical-align: top;\n}\n.tui-image-editor-container.top .tui-image-editor-controls-logo {\n display: table-cell;\n}\n.tui-image-editor-container.top .tui-image-editor-controls-buttons {\n display: table-cell;\n}\n.tui-image-editor-container.top .tui-image-editor-main {\n top: 64px;\n height: calc(100% - 64px);\n}\n.tui-image-editor-container.top .tui-image-editor-controls {\n top: 0;\n bottom: inherit;\n}\n.tui-image-editor-container .tie-icon-add-button .tui-image-editor-button {\n min-width: 42px;\n}\n.tui-image-editor-container .svg_ic-menu,\n.tui-image-editor-container .svg_ic-helpmenu {\n width: 24px;\n height: 24px;\n}\n.tui-image-editor-container .svg_ic-submenu {\n width: 32px;\n height: 32px;\n}\n.tui-image-editor-container .svg_img-bi {\n width: 257px;\n height: 26px;\n}\n.tui-image-editor-container .tui-image-editor-controls svg > use {\n display: none;\n}\n.tui-image-editor-container .tui-image-editor-controls .enabled svg:hover > use.hover,\n.tui-image-editor-container .tui-image-editor-controls .normal svg:hover > use.hover {\n display: block;\n}\n.tui-image-editor-container .tui-image-editor-controls .active svg:hover > use.hover {\n display: none;\n}\n.tui-image-editor-container .tui-image-editor-controls svg > use.normal {\n display: block;\n}\n.tui-image-editor-container .tui-image-editor-controls .active svg > use.active {\n display: block;\n}\n.tui-image-editor-container .tui-image-editor-controls .enabled svg > use.enabled {\n display: block;\n}\n.tui-image-editor-container .tui-image-editor-controls .active svg > use.normal,\n.tui-image-editor-container .tui-image-editor-controls .enabled svg > use.normal {\n display: none;\n}\n.tui-image-editor-container .tui-image-editor-controls .help svg > use.disabled,\n.tui-image-editor-container .tui-image-editor-controls .help.enabled svg > use.normal {\n display: block;\n}\n.tui-image-editor-container .tui-image-editor-controls .help.enabled svg > use.disabled {\n display: none;\n}\n.tui-image-editor-container .tui-image-editor-controls:hover {\n z-index: 3;\n}\n.tui-image-editor-container div.tui-colorpicker-clearfix {\n width: 159px;\n height: 28px;\n border: 1px solid #d5d5d5;\n border-radius: 2px;\n background-color: #f5f5f5;\n margin-top: 6px;\n padding: 4px 7px 4px 7px;\n}\n.tui-image-editor-container .tui-colorpicker-palette-hex {\n width: 114px;\n background-color: #f5f5f5;\n border: 0;\n font-size: 11px;\n margin-top: 2px;\n font-family: 'Noto Sans', sans-serif;\n}\n.tui-image-editor-container .tui-colorpicker-palette-hex[value='#ffffff'] + .tui-colorpicker-palette-preview,\n.tui-image-editor-container .tui-colorpicker-palette-hex[value=''] + .tui-colorpicker-palette-preview {\n border: 1px solid #ccc;\n}\n.tui-image-editor-container .tui-colorpicker-palette-hex[value=''] + .tui-colorpicker-palette-preview {\n background-size: cover;\n background-image: url(\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAdBJREFUWAnFl0FuwjAQRZ0ukiugHqFSOQNdseuKW3ALzkA4BateICvUGyCxrtRFd4WuunH/TzykaYJrnLEYaTJJsP2+x8GZZCbQrLU5mj7Bn+EP8HvnCObd+R7xBV5lWfaNON4AnsA38E94qLEt+0yiFaBzAV/Bv+Cxxr4co7hKCDpw1q9wLeNYYdlAwyn8TYt8Hme3+8D5ozcTaMCZ68PXa2tnM2sbEcOZAJhrrpl2DAcTOGNjZPSfCdzkw6JrfbiMv+osBe4y9WOedhm4jZfhbENWuxS44H9Wz/xw4WzqLOAqh1+zycgAwzEMzr5k5gaHOa9ULBwuuDkFlHI1Kl4PJ66kgIpnoywOTmRFAYcbwYk9UMApWkD8zAV5ihcwHk4Rx7gl0IFTQL0EFc+CTQ9OZHWH3YhlVJiVpTHbrTGLhTHLZVgff6s9lyBsI9KduSS83oj+34rTwJutmBmCnMsvozRwZqB5GTkBw6/jdPDu69iJ6BYk6eCcfbcgcQIK/MByaaiMqm8rHcjol2TnpWDhyAKSGdA3FrxtJUToX0ODqatetfGE+8tyEUOV8GY5dGRwLP/MBS4RHQr4bT7NRAQjlcOTfZxmv2G+c4hI8nn+Ax5PG/zhI393AAAAAElFTkSuQmCC\");\n}\n.tui-image-editor-container .tui-colorpicker-palette-preview {\n border-radius: 100%;\n float: left;\n width: 17px;\n height: 17px;\n border: 0;\n}\n.tui-image-editor-container .color-picker-control {\n position: absolute;\n display: none;\n z-index: 99;\n width: 192px;\n background-color: #fff;\n box-shadow: 0 3px 22px 6px rgba(0,0,0,0.15);\n padding: 16px;\n border-radius: 2px;\n}\n.tui-image-editor-container .color-picker-control .tui-colorpicker-palette-toggle-slider {\n display: none;\n}\n.tui-image-editor-container .color-picker-control .tui-colorpicker-palette-button {\n border: 0;\n border-radius: 100%;\n margin: 2px;\n background-size: cover;\n font-size: 1px;\n}\n.tui-image-editor-container .color-picker-control .tui-colorpicker-palette-button[title='#ffffff'] {\n border: 1px solid #ccc;\n}\n.tui-image-editor-container .color-picker-control .tui-colorpicker-palette-button[title=''] {\n border: 1px solid #ccc;\n}\n.tui-image-editor-container .color-picker-control .triangle {\n width: 0;\n height: 0;\n border-right: 7px solid transparent;\n border-top: 8px solid #fff;\n border-left: 7px solid transparent;\n position: absolute;\n bottom: -8px;\n left: 84px;\n}\n.tui-image-editor-container .color-picker-control .tui-colorpicker-container,\n.tui-image-editor-container .color-picker-control .tui-colorpicker-palette-container ul,\n.tui-image-editor-container .color-picker-control .tui-colorpicker-palette-container {\n width: 100%;\n height: auto;\n}\n.tui-image-editor-container .filter-color-item .color-picker-control label {\n font-color: #333;\n font-weight: normal;\n margin-right: 7pxleft;\n}\n.tui-image-editor-container .filter-color-item .tui-image-editor-checkbox {\n margin-top: 0;\n}\n.tui-image-editor-container .filter-color-item .tui-image-editor-checkbox input + label:before,\n.tui-image-editor-container .filter-color-item .tui-image-editor-checkbox > label:before {\n left: -16px;\n}\n.tui-image-editor-container .color-picker {\n width: 100%;\n height: auto;\n}\n.tui-image-editor-container .color-picker-value {\n width: 32px;\n height: 32px;\n border: 0px;\n border-radius: 100%;\n margin: auto;\n margin-bottom: 1px;\n}\n.tui-image-editor-container .color-picker-value.transparent {\n border: 1px solid #cbcbcb;\n background-size: cover;\n background-image: url(\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAdBJREFUWAnFl0FuwjAQRZ0ukiugHqFSOQNdseuKW3ALzkA4BateICvUGyCxrtRFd4WuunH/TzykaYJrnLEYaTJJsP2+x8GZZCbQrLU5mj7Bn+EP8HvnCObd+R7xBV5lWfaNON4AnsA38E94qLEt+0yiFaBzAV/Bv+Cxxr4co7hKCDpw1q9wLeNYYdlAwyn8TYt8Hme3+8D5ozcTaMCZ68PXa2tnM2sbEcOZAJhrrpl2DAcTOGNjZPSfCdzkw6JrfbiMv+osBe4y9WOedhm4jZfhbENWuxS44H9Wz/xw4WzqLOAqh1+zycgAwzEMzr5k5gaHOa9ULBwuuDkFlHI1Kl4PJ66kgIpnoywOTmRFAYcbwYk9UMApWkD8zAV5ihcwHk4Rx7gl0IFTQL0EFc+CTQ9OZHWH3YhlVJiVpTHbrTGLhTHLZVgff6s9lyBsI9KduSS83oj+34rTwJutmBmCnMsvozRwZqB5GTkBw6/jdPDu69iJ6BYk6eCcfbcgcQIK/MByaaiMqm8rHcjol2TnpWDhyAKSGdA3FrxtJUToX0ODqatetfGE+8tyEUOV8GY5dGRwLP/MBS4RHQr4bT7NRAQjlcOTfZxmv2G+c4hI8nn+Ax5PG/zhI393AAAAAElFTkSuQmCC\");\n}\n.tui-image-editor-container .color-picker-value + label {\n color: #fff;\n}\n.tui-image-editor-container .tui-image-editor-submenu svg > use {\n display: none;\n}\n.tui-image-editor-container .tui-image-editor-submenu svg > use.normal {\n display: block;\n}\n.tie-icon-add-button.icon-bubble .tui-image-editor-button[data-icontype=\"icon-bubble\"] svg > use.active,\n.tie-icon-add-button.icon-heart .tui-image-editor-button[data-icontype=\"icon-heart\"] svg > use.active,\n.tie-icon-add-button.icon-location .tui-image-editor-button[data-icontype=\"icon-location\"] svg > use.active,\n.tie-icon-add-button.icon-polygon .tui-image-editor-button[data-icontype=\"icon-polygon\"] svg > use.active,\n.tie-icon-add-button.icon-star .tui-image-editor-button[data-icontype=\"icon-star\"] svg > use.active,\n.tie-icon-add-button.icon-star-2 .tui-image-editor-button[data-icontype=\"icon-star-2\"] svg > use.active,\n.tie-icon-add-button.icon-arrow-3 .tui-image-editor-button[data-icontype=\"icon-arrow-3\"] svg > use.active,\n.tie-icon-add-button.icon-arrow-2 .tui-image-editor-button[data-icontype=\"icon-arrow-2\"] svg > use.active,\n.tie-icon-add-button.icon-arrow .tui-image-editor-button[data-icontype=\"icon-arrow\"] svg > use.active {\n display: block;\n}\n.tie-draw-line-select-button.line .tui-image-editor-button.line svg > use.normal,\n.tie-draw-line-select-button.free .tui-image-editor-button.free svg > use.normal {\n display: none;\n}\n.tie-draw-line-select-button.line .tui-image-editor-button.line svg > use.active,\n.tie-draw-line-select-button.free .tui-image-editor-button.free svg > use.active {\n display: block;\n}\n.tie-flip-button.resetFlip .tui-image-editor-button.resetFlip svg > use.normal,\n.tie-flip-button.flipX .tui-image-editor-button.flipX svg > use.normal,\n.tie-flip-button.flipY .tui-image-editor-button.flipY svg > use.normal {\n display: none;\n}\n.tie-flip-button.resetFlip .tui-image-editor-button.resetFlip svg > use.active,\n.tie-flip-button.flipX .tui-image-editor-button.flipX svg > use.active,\n.tie-flip-button.flipY .tui-image-editor-button.flipY svg > use.active {\n display: block;\n}\n.tie-mask-apply.apply.active .tui-image-editor-button.apply label {\n color: #fff;\n}\n.tie-mask-apply.apply.active .tui-image-editor-button.apply svg > use.active {\n display: block;\n}\n.tie-crop-button .tui-image-editor-button.apply,\n.tie-crop-preset-button .tui-image-editor-button.apply {\n margin-right: 24px;\n}\n.tie-crop-button .tui-image-editor-button.preset.active svg > use.active,\n.tie-crop-preset-button .tui-image-editor-button.preset.active svg > use.active {\n display: block;\n}\n.tie-crop-button .tui-image-editor-button.apply.active svg > use.active,\n.tie-crop-preset-button .tui-image-editor-button.apply.active svg > use.active {\n display: block;\n}\n.tie-shape-button.rect .tui-image-editor-button.rect svg > use.normal,\n.tie-shape-button.circle .tui-image-editor-button.circle svg > use.normal,\n.tie-shape-button.triangle .tui-image-editor-button.triangle svg > use.normal {\n display: none;\n}\n.tie-shape-button.rect .tui-image-editor-button.rect svg > use.active,\n.tie-shape-button.circle .tui-image-editor-button.circle svg > use.active,\n.tie-shape-button.triangle .tui-image-editor-button.triangle svg > use.active {\n display: block;\n}\n.tie-text-effect-button .tui-image-editor-button.active svg > use.active {\n display: block;\n}\n.tie-text-align-button.left .tui-image-editor-button.left svg > use.active,\n.tie-text-align-button.center .tui-image-editor-button.center svg > use.active,\n.tie-text-align-button.right .tui-image-editor-button.right svg > use.active {\n display: block;\n}\n.tie-mask-image-file,\n.tie-icon-image-file {\n opacity: 0;\n position: absolute;\n width: 100%;\n height: 100%;\n border: 1px solid #008000;\n cursor: inherit;\n left: 0;\n top: 0;\n}\n.tui-image-editor-container.top.tui-image-editor-top-optimization .tui-image-editor-controls ul {\n text-align: right;\n}\n.tui-image-editor-container.top.tui-image-editor-top-optimization .tui-image-editor-controls-logo {\n display: none;\n}\n/*# sourceMappingURL=src/css/index.css.map */","/* GRID VISUAL OF FLIP AND ROTATE MENU */\n.{prefix}-container\n .{prefix}-grid-visual\n display: none;\n position: absolute;\n width: 100%;\n height: 100%;\n border: 1px solid rgba(255,255,255,0.7);\n .{prefix}-main.{prefix}-menu-flip,\n .{prefix}-main.{prefix}-menu-rotate\n .tui-image-editor\n transition: none;\n .{prefix}-main.{prefix}-menu-flip .{prefix}-grid-visual,\n .{prefix}-main.{prefix}-menu-rotate .{prefix}-grid-visual\n display: block;\n .{prefix}-grid-visual \n table\n width: 100%;\n height: 100%;\n border-collapse: collapse;\n td\n border: 1px solid rgba(255,255,255,0.3);\n td.dot:before\n content: '';\n position: absolute;\n box-sizing: border-box;\n width: 10px;\n height: 10px;\n border: 0;\n box-shadow: 0 0 1px 0 rgba(0,0,0,0.3);\n border-radius: 100%;\n background-color: #fff;\n td.dot.left-top:before\n top: -5px;\n left: -5px;\n td.dot.right-top:before\n top: -5px;\n right: -5px;\n td.dot.left-bottom:before\n bottom: -5px;\n left: -5px;\n td.dot.right-bottom:before\n bottom: -5px;\n right: -5px;\n","/* SUBMENU */\n.{prefix}-container\n .{prefix}-submenu\n display: none;\n position: absolute;\n bottom: 0;\n width:100%;\n height: 150px;\n white-space: nowrap;\n z-index: 2;\n .{prefix}-button:hover svg > use.active\n display: block;\n .{prefix}-submenu-item\n li\n display: inline-block;\n vertical-align: top;\n .{prefix}-newline\n display: block;\n margin-top: 0;\n .{prefix}-button\n position: relative;\n cursor: pointer;\n display: inline-block;\n font-weight: normal;\n font-size: 11px;\n margin: 0 9px 0 9px;\n .{prefix}-button.preset\n margin: 0 9px 20px 5px;\n label > span\n display: inline-block;\n cursor: pointer;\n padding-top: 5px;\n font-family: \"Noto Sans\", sans-serif;\n font-size: 11px;\n .{prefix}-button.apply label,\n .{prefix}-button.cancel label\n vertical-align: 7px;\n > div\n display: none;\n vertical-align: bottom;\n .{prefix}-submenu-style\n opacity: 0.95;\n z-index: -1;\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n display: block;\n\n .{prefix}-partition > div\n width: 1px;\n height: 52px;\n border-left: 1px solid #3c3c3c;\n margin: 0 8px 0 8px;\n .{prefix}-main.{prefix}-menu-filter .{prefix}-partition > div\n height: 108px;\n margin: 0 29px 0 0px;\n .{prefix}-submenu-align\n text-align: left;\n margin-right: 30px;\n label > span\n width: 55px;\n white-space: nowrap;\n .{prefix}-submenu-align:first-child\n margin-right: 0;\n label > span\n width: 70px;\n .{prefix}-main.{prefix}-menu-crop .{prefix}-submenu > div.{prefix}-menu-crop,\n .{prefix}-main.{prefix}-menu-flip .{prefix}-submenu > div.{prefix}-menu-flip,\n .{prefix}-main.{prefix}-menu-rotate .{prefix}-submenu > div.{prefix}-menu-rotate,\n .{prefix}-main.{prefix}-menu-shape .{prefix}-submenu > div.{prefix}-menu-shape,\n .{prefix}-main.{prefix}-menu-text .{prefix}-submenu > div.{prefix}-menu-text,\n .{prefix}-main.{prefix}-menu-mask .{prefix}-submenu > div.{prefix}-menu-mask,\n .{prefix}-main.{prefix}-menu-icon .{prefix}-submenu > div.{prefix}-menu-icon,\n .{prefix}-main.{prefix}-menu-draw .{prefix}-submenu > div.{prefix}-menu-draw,\n .{prefix}-main.{prefix}-menu-filter .{prefix}-submenu > div.{prefix}-menu-filter\n display: table-cell;\n .{prefix}-main.{prefix}-menu-crop,\n .{prefix}-main.{prefix}-menu-flip,\n .{prefix}-main.{prefix}-menu-rotate,\n .{prefix}-main.{prefix}-menu-shape,\n .{prefix}-main.{prefix}-menu-text,\n .{prefix}-main.{prefix}-menu-mask,\n .{prefix}-main.{prefix}-menu-icon,\n .{prefix}-main.{prefix}-menu-draw,\n .{prefix}-main.{prefix}-menu-filter\n .{prefix}-submenu\n display: table;\n\n","/* VIRTUAL CHECKBOX */\n.{prefix}-container\n .filter-color-item\n display: inline-block;\n .tui-image-editor-checkbox\n display: block;\n .{prefix}-checkbox-wrap\n display: inline-block !important;\n text-align: left;\n .{prefix}-checkbox-wrap.fixed-width\n width: 187px;\n white-space: normal;\n .{prefix}-checkbox\n display: inline-block;\n margin: 1px 0 1px 0;\n input\n width: 14px;\n height: 14px;\n opacity: 0;\n > label > span\n color: #fff;\n height: 14px;\n position: relative;\n input + label:before,\n > label > span:before\n content: '';\n position: absolute;\n width: 14px;\n height: 14px;\n background-color: #fff;\n top: 6px;\n left: -19px;\n display: inline-block;\n margin: 0;\n text-align: center;\n font-size: 11px;\n border: 0;\n border-radius: 2px;\n padding-top: 1px;\n box-sizing: border-box;\n input[type='checkbox']:checked + span:before\n background-size: cover;\n background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAAAXNSR0IArs4c6QAAAMBJREFUKBWVkjEOwjAMRe2WgZW7IIHEDdhghhuwcQ42rlJugAQS54Cxa5cq1QM5TUpByZfS2j9+dlJVt/tX5ZxbS4ZU9VLkQvSHKTIGRaVJYFmKrBbTCJxE2UgCdDzMZDkHrOV6b95V0US6UmgKodujEZbJg0B0ZgEModO5lrY1TMQf1TpyJGBEjD+E2NPN7ukIUDiF/BfEXgRiGEw8NgkffYGYwCi808fpn/6OvfUfsDr/Vc1IfRf8sKnFVqeiVQfDu0tf/nWH9gAAAABJRU5ErkJggg==');\n\n .{prefix}-selectlist-wrap\n position: relative;\n select\n width: 100%;\n height: 28px;\n margin-top: 4px;\n border: 0;\n outline: 0;\n border-radius: 0;\n border: 1px solid #cbdbdb;\n background-color: #fff;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n padding: 0 7px 0 10px;\n .{prefix}-selectlist\n display: none;\n position: relative;\n top: -1px;\n border: 1px solid #ccc;\n background-color: #fff;\n border-top: 0px;\n padding: 4px 0;\n li\n display: block;\n text-align: left;\n padding: 7px 10px;\n font-family: 'Noto Sans', sans-serif;\n li:hover\n background-color: rgba(81, 92, 230, 0.05);\n .{prefix}-selectlist-wrap:before\n content: '';\n position: absolute;\n display: inline-block;\n width: 14px;\n height: 14px;\n right: 5px;\n top: 10px;\n background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAAAXNSR0IArs4c6QAAAHlJREFUKBVjYBgFOEOAEVkmPDxc89+/f6eAYjzI4kD2FyYmJrOVK1deh4kzwRggGiQBVJCELAZig8SQNYHEmEEEMrh69eo1HR0dfqCYJUickZGxf9WqVf3IakBsFBthklpaWmVA9mEQhrJhUoTp0NBQCRAmrHL4qgAAuu4cWZOZIGsAAAAASUVORK5CYII=');\n background-size: cover;\n .{prefix}-selectlist-wrap select::-ms-expand\n display:none;\n","/* VIRTUAL RANGE */\n.{prefix}-container\n\n .{prefix}-virtual-range-bar\n .{prefix}-virtual-range-subbar\n .{prefix}-virtual-range-pointer\n .{prefix}-disabled\n backbround-color: red;\n\n .{prefix}-range\n position: relative;\n top: 5px;\n width: 166px;\n height: 17px;\n display: inline-block;\n .{prefix}-virtual-range-bar\n top: 7px;\n position: absolute;\n width: 100%;\n height: 2px;\n background-color: #666666;\n .{prefix}-virtual-range-subbar\n position: absolute;\n height: 100%;\n left: 0;\n right: 0;\n background-color: #d1d1d1;\n .{prefix}-virtual-range-pointer\n position: absolute;\n cursor: pointer;\n top: -5px;\n left: 0;\n width: 12px;\n height: 12px;\n background-color: #fff;\n border-radius: 100%;\n .{prefix}-range-wrap\n display: inline-block;\n margin-left: 4px;\n &.short .tui-image-editor-range\n width: 100px;\n .color-picker-control\n .{prefix}-range\n width: 108px;\n margin-left: 10px;\n .{prefix}-virtual-range-pointer\n background-color: #333;\n .{prefix}-virtual-range-bar\n background-color: #ccc;\n .{prefix}-virtual-range-subbar\n background-color: #606060;\n .{prefix}-range-wrap.{prefix}-newline.short\n margin-top: -2px;\n margin-left: 19px;\n label\n color: #8e8e8e;\n font-weight: normal;\n .{prefix}-range-wrap label\n vertical-align: baseline;\n font-size: 11px;\n margin-right: 7px;\n color: #fff;\n .{prefix}-range-value\n cursor: default;\n width: 40px;\n height: 24px;\n outline: none;\n border-radius: 2px;\n box-shadow: none;\n border: 1px solid #d5d5d5;\n text-align: center;\n background-color: #1c1c1c;\n color: #fff;\n font-weight: lighter;\n vertical-align: baseline;\n font-family: 'Noto Sans', sans-serif;\n margin-top: 21px;\n margin-left: 4px;\n .{prefix}-controls\n position: absolute;\n background-color: #151515;\n width: 100%;\n height: 64px;\n display: table;\n bottom: 0;\n z-index: 2;\n .{prefix}-icpartition\n display: inline-block;\n background-color: #282828;\n width: 1px;\n height: 24px;","/* POSITION LEFT */\n.{prefix}-container\n &.left\n .{prefix}-menu\n > .{prefix}-item[tooltip-content]\n &:before\n left: 28px;\n top: 11px;\n border-right: 7px solid #2f2f2f;\n border-top: 7px solid transparent;\n border-bottom: 7px solid transparent;\n &:after\n top: 7px;\n left: 42px;\n white-space: nowrap;\n .{prefix}-submenu\n left: 0;\n height: 100%;\n width: 248px;\n .{prefix}-main-container\n left: 64px;\n width: calc(100% - 64px);\n height: 100%;\n .{prefix}-controls\n width: 64px;\n height: 100%;\n display: table;\n\n/* POSITION LEFT & RIGHT */\n.{prefix}-container\n &.left, &.right\n .{prefix}-menu\n white-space: inherit;\n .{prefix}-submenu\n white-space: normal;\n > div\n vertical-align: middle;\n .{prefix}-controls li\n display: inline-block;\n margin: 4px auto;\n .{prefix}-icpartition\n position: relative;\n top: -7px;\n width: 24px;\n height: 1px;\n .{prefix}-submenu\n .{prefix}-partition\n display: block;\n width: 75%;\n margin: auto;\n > div\n border-left: 0;\n height:10px;\n border-bottom: 1px solid #3c3c3c;\n width: 100%;\n margin: 0;\n .{prefix}-submenu-align\n margin-right: 0;\n .{prefix}-submenu-item\n li\n margin-top: 15px;\n .tui-colorpicker-clearfix li\n margin-top: 0;\n\n .{prefix}-checkbox-wrap.fixed-width\n width: 182px;\n white-space: normal;\n .{prefix}-range-wrap.{prefix}-newline label.range\n display: block;\n text-align: left;\n width: 75%;\n margin: auto;\n .{prefix}-range\n width: 136px;\n\n\n/* POSITION RIGIHT */\n.{prefix}-container\n &.right\n .{prefix}-menu\n > .{prefix}-item[tooltip-content]\n &:before\n left: -3px;\n top: 11px;\n border-left: 7px solid #2f2f2f;\n border-top: 7px solid transparent;\n border-bottom: 7px solid transparent;\n &:after\n top: 7px;\n left: unset;\n right: 43px;\n white-space: nowrap;\n .{prefix}-submenu\n right: 0;\n height: 100%;\n width: 248px;\n .{prefix}-main-container \n right: 64px;\n width: calc(100% - 64px);\n height: 100%;\n .{prefix}-controls\n right: 0;\n width: 64px;\n height: 100%;\n display: table;\n\n\n/* POSITION TOP & BOTTOM */\n.{prefix}-container\n &.top, &.bottom\n .{prefix}-submenu\n .{prefix}-partition.only-left-right\n display: none;\n\n\n/* POSITION BOTTOM */\n.{prefix}-container\n &.bottom .tui-image-editor-submenu > div\n padding-bottom: 24px;\n\n/* POSITION TOP */\n.{prefix}-container\n &.top\n .color-picker-control .triangle\n top: -8px;\n border-right: 7px solid transparent;\n border-top: 0px;\n border-left: 7px solid transparent;\n border-bottom: 8px solid #fff;\n .{prefix}-size-wrap\n height: 100%;\n .{prefix}-main-container\n bottom: 0;\n .{prefix}-menu\n > .{prefix}-item[tooltip-content]\n &:before\n left: 13px;\n border-top: 0;\n border-bottom: 7px solid #2f2f2f;\n top: 33px;\n &:after\n top: 38px;\n .{prefix}-submenu\n top: 0;\n bottom: auto;\n > div\n padding-top: 24px;\n vertical-align: top;\n .{prefix}-controls-logo\n display: table-cell;\n .{prefix}-controls-buttons\n display: table-cell;\n .{prefix}-main\n top: 64px;\n height: calc(100% - 64px);\n .{prefix}-controls\n top: 0;\n bottom: inherit;\n\n","/* ICON */\n.{prefix}-container\n .tie-icon-add-button .{prefix}-button\n min-width: 42px;\n .svg_ic-menu\n .svg_ic-helpmenu\n width: 24px;\n height: 24px;\n .svg_ic-submenu\n width: 32px;\n height: 32px;\n .svg_img-bi\n width: 257px;\n height: 26px;\n\n .{prefix}-controls\n svg > use\n display: none;\n .enabled svg:hover > use.hover\n .normal svg:hover > use.hover\n display: block;\n .active svg:hover > use.hover\n display: none;\n svg > use.normal\n display: block;\n .active svg > use.active\n display: block;\n .enabled svg > use.enabled\n display: block;\n .active svg > use.normal,\n .enabled svg > use.normal\n display: none;\n .help svg > use.disabled,\n .help.enabled svg > use.normal\n display: block;\n .help.enabled svg > use.disabled\n display: none;\n\n .{prefix}-controls:hover\n z-index: 3;\n","/* COLOR PICKER */\n.{prefix}-container\n div.tui-colorpicker-clearfix\n width: 159px;\n height: 28px;\n border: 1px solid #d5d5d5;\n border-radius: 2px;\n background-color: #f5f5f5;\n margin-top: 6px;\n padding: 4px 7px 4px 7px;\n .tui-colorpicker-palette-hex\n width: 114px;\n background-color: #f5f5f5;\n border: 0;\n font-size: 11px;\n margin-top: 2px;\n font-family: 'Noto Sans', sans-serif;\n .tui-colorpicker-palette-hex[value='#ffffff'] + .tui-colorpicker-palette-preview,\n .tui-colorpicker-palette-hex[value=''] + .tui-colorpicker-palette-preview\n border: 1px solid #ccc;\n .tui-colorpicker-palette-hex[value=''] + .tui-colorpicker-palette-preview\n background-size: cover;\n background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAdBJREFUWAnFl0FuwjAQRZ0ukiugHqFSOQNdseuKW3ALzkA4BateICvUGyCxrtRFd4WuunH/TzykaYJrnLEYaTJJsP2+x8GZZCbQrLU5mj7Bn+EP8HvnCObd+R7xBV5lWfaNON4AnsA38E94qLEt+0yiFaBzAV/Bv+Cxxr4co7hKCDpw1q9wLeNYYdlAwyn8TYt8Hme3+8D5ozcTaMCZ68PXa2tnM2sbEcOZAJhrrpl2DAcTOGNjZPSfCdzkw6JrfbiMv+osBe4y9WOedhm4jZfhbENWuxS44H9Wz/xw4WzqLOAqh1+zycgAwzEMzr5k5gaHOa9ULBwuuDkFlHI1Kl4PJ66kgIpnoywOTmRFAYcbwYk9UMApWkD8zAV5ihcwHk4Rx7gl0IFTQL0EFc+CTQ9OZHWH3YhlVJiVpTHbrTGLhTHLZVgff6s9lyBsI9KduSS83oj+34rTwJutmBmCnMsvozRwZqB5GTkBw6/jdPDu69iJ6BYk6eCcfbcgcQIK/MByaaiMqm8rHcjol2TnpWDhyAKSGdA3FrxtJUToX0ODqatetfGE+8tyEUOV8GY5dGRwLP/MBS4RHQr4bT7NRAQjlcOTfZxmv2G+c4hI8nn+Ax5PG/zhI393AAAAAElFTkSuQmCC');\n .tui-colorpicker-palette-preview\n border-radius: 100%;\n float: left;\n width: 17px;\n height: 17px;\n border: 0;\n .color-picker-control\n position: absolute;\n display: none;\n z-index: 99;\n width: 192px;\n background-color: #fff;\n box-shadow: 0 3px 22px 6px rgba(0, 0, 0, .15);\n padding: 16px;\n border-radius: 2px;\n .tui-colorpicker-palette-toggle-slider\n display: none;\n .tui-colorpicker-palette-button\n border: 0;\n border-radius: 100%;\n margin: 2px;\n background-size: cover;\n font-size: 1px;\n &[title='#ffffff']\n border: 1px solid #ccc;\n &[title='']\n border: 1px solid #ccc;\n .triangle\n width: 0;\n height: 0;\n border-right: 7px solid transparent;\n border-top: 8px solid #fff;\n border-left: 7px solid transparent;\n position: absolute;\n bottom: -8px;\n left: 84px;\n .tui-colorpicker-container,\n .tui-colorpicker-palette-container ul,\n .tui-colorpicker-palette-container\n width: 100%;\n height: auto;\n\n\n .filter-color-item\n .color-picker-control label\n font-color: #333;\n font-weight: normal;\n margin-right: 7pxleft\n .tui-image-editor-checkbox\n margin-top: 0;\n input + label:before,\n > label:before\n left: -16px;\n .color-picker\n width: 100%;\n height: auto;\n .color-picker-value \n width: 32px;\n height: 32px;\n border: 0px;\n border-radius: 100%;\n margin: auto;\n margin-bottom: 1px;\n &.transparent\n border: 1px solid #cbcbcb;\n background-size: cover;\n background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAdBJREFUWAnFl0FuwjAQRZ0ukiugHqFSOQNdseuKW3ALzkA4BateICvUGyCxrtRFd4WuunH/TzykaYJrnLEYaTJJsP2+x8GZZCbQrLU5mj7Bn+EP8HvnCObd+R7xBV5lWfaNON4AnsA38E94qLEt+0yiFaBzAV/Bv+Cxxr4co7hKCDpw1q9wLeNYYdlAwyn8TYt8Hme3+8D5ozcTaMCZ68PXa2tnM2sbEcOZAJhrrpl2DAcTOGNjZPSfCdzkw6JrfbiMv+osBe4y9WOedhm4jZfhbENWuxS44H9Wz/xw4WzqLOAqh1+zycgAwzEMzr5k5gaHOa9ULBwuuDkFlHI1Kl4PJ66kgIpnoywOTmRFAYcbwYk9UMApWkD8zAV5ihcwHk4Rx7gl0IFTQL0EFc+CTQ9OZHWH3YhlVJiVpTHbrTGLhTHLZVgff6s9lyBsI9KduSS83oj+34rTwJutmBmCnMsvozRwZqB5GTkBw6/jdPDu69iJ6BYk6eCcfbcgcQIK/MByaaiMqm8rHcjol2TnpWDhyAKSGdA3FrxtJUToX0ODqatetfGE+8tyEUOV8GY5dGRwLP/MBS4RHQr4bT7NRAQjlcOTfZxmv2G+c4hI8nn+Ax5PG/zhI393AAAAAElFTkSuQmCC');\n\n .color-picker-value + label\n color: #fff;\n\n .{prefix}-submenu svg > use\n display: none;\n .{prefix}-submenu svg > use.normal\n display: block;\n","/* ICON BUTTON */\n.tie-icon-add-button\n &.icon-bubble .{prefix}-button[data-icontype=\"icon-bubble\"] svg > use.active,\n &.icon-heart .{prefix}-button[data-icontype=\"icon-heart\"] svg > use.active,\n &.icon-location .{prefix}-button[data-icontype=\"icon-location\"] svg > use.active,\n &.icon-polygon .{prefix}-button[data-icontype=\"icon-polygon\"] svg > use.active,\n &.icon-star .{prefix}-button[data-icontype=\"icon-star\"] svg > use.active,\n &.icon-star-2 .{prefix}-button[data-icontype=\"icon-star-2\"] svg > use.active,\n &.icon-arrow-3 .{prefix}-button[data-icontype=\"icon-arrow-3\"] svg > use.active,\n &.icon-arrow-2 .{prefix}-button[data-icontype=\"icon-arrow-2\"] svg > use.active,\n &.icon-arrow .{prefix}-button[data-icontype=\"icon-arrow\"] svg > use.active,\n &.icon-bubble .{prefix}-button[data-icontype=\"icon-bubble\"] svg > use.active\n display: block;\n\n/* DRAW BUTTON */\n.tie-draw-line-select-button\n &.line .{prefix}-button.line svg > use.normal,\n &.free .{prefix}-button.free svg > use.normal\n display: none;\n\n &.line .{prefix}-button.line svg > use.active,\n &.free .{prefix}-button.free svg > use.active\n display: block;\n\n/* FLIP BUTTON */\n.tie-flip-button\n &.resetFlip .{prefix}-button.resetFlip,\n &.flipX .{prefix}-button.flipX,\n &.flipY .{prefix}-button.flipY\n svg > use.normal\n display: none;\n svg > use.active\n display: block;\n\n/* MASK BUTTON */\n.tie-mask-apply.apply.active .{prefix}-button.apply\n label\n color: #fff;\n svg > use.active\n display: block;\n\n/* CROP BUTTON */\n.tie-crop-button,\n.tie-crop-preset-button\n .{prefix}-button.apply\n margin-right: 24px;\n .{prefix}-button.preset.active svg > use.active\n display: block;\n .{prefix}-button.apply.active svg > use.active\n display: block;\n\n\n/* SHAPE BUTTON */\n.tie-shape-button\n &.rect .{prefix}-button.rect,\n &.circle .{prefix}-button.circle,\n &.triangle .{prefix}-button.triangle\n svg > use.normal\n display: none;\n svg > use.active\n display: block;\n\n/* TEXT BUTTON */\n.tie-text-effect-button\n .{prefix}-button.active svg > use.active\n display: block;\n.tie-text-align-button\n &.left .{prefix}-button.left svg > use.active,\n &.center .{prefix}-button.center svg > use.active,\n &.right .{prefix}-button.right svg > use.active\n display: block;\n.tie-mask-image-file,\n.tie-icon-image-file\n opacity: 0;\n position: absolute;\n width: 100%;\n height: 100%;\n border: 1px solid green;\n cursor: inherit;\n left: 0;\n top: 0;\n","prefix = 'tui-image-editor'\n\n@import 'main.styl'\n@import 'gridtable.styl'\n@import 'submenu.styl'\n@import 'checkbox.styl'\n@import 'range.styl'\n@import 'position.styl'\n@import 'icon.styl'\n@import 'colorpicker.styl'\n@import 'buttons.styl'\n.{prefix}-container.top\n &.{prefix}-top-optimization\n .{prefix}-controls ul\n text-align: right;\n .{prefix}-controls-logo\n display: none;\n"],"sourceRoot":""}