<Shapes xmlns="http://www.evolus.vn/Namespace/Pencil"
        xmlns:p="http://www.evolus.vn/Namespace/Pencil"
        xmlns:svg="http://www.w3.org/2000/svg"
        xmlns:xlink="http://www.w3.org/1999/xlink"
        xmlns:dc="http://purl.org/dc/elements/1.1/"
        xmlns:cc="http://web.resource.org/cc/"
        xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
        xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
        xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
        id="Evolus.iOSWireframe"
        displayName="Mobile - iOS Wireframe"
        description="Stencils for creating iOS GUI mockups"
        author="Evolus Pencil Team"
        url="http://www.evolus.vn/pencil/shapes/ioswireframe"> 
	<Script comments="Scripts for creating nine-patches">
        <![CDATA[
            collection.ANDROID_ICS_STANDARD_SIZE = 48;
            
            collection.ninePatchDom = function (ninePatchName, dim) {
                Dom.empty(F._target);
                var np = collection.ninePatches[ninePatchName];
                if (!np) return null;
                
                var specs = [];
                
                var sw = dim.w - np.patches[0].w - np.patches[2].w;
                var sh = dim.h - np.patches[0].h - np.patches[8].h;
                
                specs.push(collection._newImageForPatch(np.patches[0], 0, 0, np.patches[0].w, np.patches[0].h));
                specs.push(collection._newImageForPatch(np.patches[1], np.patches[0].w, 0, sw, np.patches[1].h));
                specs.push(collection._newImageForPatch(np.patches[2], np.patches[0].w + sw, 0, np.patches[2].w, np.patches[2].h));
                
                specs.push(collection._newImageForPatch(np.patches[3], 0, np.patches[0].h, np.patches[3].w, sh));
                specs.push(collection._newImageForPatch(np.patches[4], np.patches[0].w, np.patches[0].h, sw, sh));
                specs.push(collection._newImageForPatch(np.patches[5], np.patches[0].w + sw, np.patches[0].h, np.patches[5].w, sh));
                
                specs.push(collection._newImageForPatch(np.patches[6], 0, np.patches[0].h + sh, np.patches[6].w, np.patches[6].h));
                specs.push(collection._newImageForPatch(np.patches[7], np.patches[6].w, np.patches[0].h + sh, sw, np.patches[7].h));
                specs.push(collection._newImageForPatch(np.patches[8], np.patches[0].w + sw, np.patches[0].h + sh, np.patches[8].w, np.patches[8].h));
    
                return Dom.newDOMFragment(specs);
            };
            collection._newImageForPatch = function (patch, x, y, w, h) {
                return {
                    _name: "image",
                    _uri: PencilNamespaces.svg,
                    x: x,
                    y: y,
                    width: w,
                    height: h,
                    preserveAspectRatio: "none",
                    //transform: "translate(" + x + ", " + y + ") scale(" + (w / patch.w) + ", " + (h / patch.h) + ")",
                    "xlink:href": patch.url
                }
            };
            collection.ninePatchBound = function (ninePatchName, dim) {
                var np = collection.ninePatches[ninePatchName];
                return new Bound(np.p1.x, np.p1.y, dim.w - np.p1.x - np.p2.x, dim.h - np.p1.y - np.p2.y);
            }
            
            collection.nPatchDom = function (nPatchName, dim) {
                var np = collection.nPatches[nPatchName];
                var n = np.patches.length;
                if (n == 0) return null;
                var m = np.patches[0].length;
                
                var specs = [];
                var totalFlexW = 0;
                var totalFlexH = 0;
                for (var j = 0; j < m; j ++) {
                    var p = np.patches[0][j];
                    if (p.scaleX) totalFlexW += p.w;
                }
                for (var i = 0; i < n; i ++) {
                    var p = np.patches[i][0];
                    if (p.scaleY) totalFlexH += p.h;
                }
                
                var targetScaleX = dim.w - (np.w - totalFlexW);
                var targetScaleY = dim.h - (np.h - totalFlexH);
                var rX = targetScaleX / totalFlexW;
                var rY = targetScaleY / totalFlexH;
                
                var x = 0;
                var y = 0;
                var accumulatedScaleW = 0;
                var accumulatedScaleH = 0;
                for (var i = 0; i < n; i ++) {
                    x = 0;
                    accumulatedScaleW = 0;
                    var lastH = 0;
                    var scaledY = false;
                    for (var j = 0; j < m; j ++) {
                        var p = np.patches[i][j];
                        
                        var w = p.w;
                        var h = p.h;
                        
                        if (p.scaleX) {
                            w = (j == np.lastScaleX) ? targetScaleX - accumulatedScaleW : Math.floor(p.w * rX);
                            accumulatedScaleW += w;
                        }
                        if (p.scaleY) {
                            h = (i == np.lastScaleY) ? targetScaleY - accumulatedScaleH : Math.floor(p.h * rY);
                            scaledY = true;
                        }
                        
                        specs.push(collection._newImageForPatch(p, x, y, w, h));
                        
                        x += w;
                        lastH = h;
                    }
                    y += lastH;
                    if (scaledY) accumulatedScaleH += lastH;
                }
                
                return Dom.newDOMFragment(specs);
            };
            collection.nPatchBound = function (nPatchName, dim) {
                var np = collection.nPatches[nPatchName];
                return new Bound(np.p1.x, np.p1.y, dim.w - np.p1.x - (np.w - np.p2.x), dim.h - np.p1.y - (np.h - np.p2.y));
            }

            collection.getScaleRatio = function () {
                //var scale = collection.properties.scale.value;
                //if (scale == "small") return 30 / 48;
                //if (scale == "normal") return 36 / 48;
                return 1;
            };
            collection.getBaseSize = function () {
                return collection.getScaleRatio() * collection.ANDROID_ICS_STANDARD_SIZE;
            };
            
            collection.getThemeAwareColor = function (shapeColor, shapeTheme, type, disabled) {
                var currentThemeColor = collection.properties.defaultColorTheme.value.value == 'dark' ?
                                            collection.properties["defaultDark" + type + "Color"].value : 
                                                collection.properties["defaultLight" + type + "Color"].value;
                var color = shapeColor;
                if (shapeColor.toString() == currentThemeColor.toString()) {
                    color = shapeTheme.value == 'dark' ? 
                            collection.properties["defaultDark" + type + "Color"].value : 
                            collection.properties["defaultLight" + type + "Color"].value;
                }
                
                if (disabled.value) color = color.hollowed(0.7);
                
                return color;
            };
		]]>
    </Script>
	<Script comments="Nine Patches">
        <![CDATA[
            collection.ninePatches = {
                message_bg: {"w":290,"h":159,"p1":{"x":19,"y":12},"p2":{"x":272,"y":146},"patches":[[{"url":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAeCAYAAAAl+Z4RAAAC+0lEQVQ4jb2S20vTYRzGn2qeOihq5wNBud9+OzinqEEXQdABOuja2hZbYgcqRAhiF+G19AeUJlOna461Mjto6FJnmi4P6VyGF/OuoIwYgRaV9XN8u/m9NcYKR4cX3svn8zzP+7xA4mdZ1F2eqGg5gBUAJACSACQvVcyETJQKYCWA1YkIUwCkiaJ0q9W6PRQKWZYqTgWwCkAGgKyZmZlzkUjkPRHR78QSMS5zzayqquLn5+c7SDyvwwuz8QDMOVnsmQ4g22q1KgRBmCUi+iZEvtzoefuk+OJYYzx3FjtNFK8FsHlubs5LRPQm/Pml6cqUp6jS7yisGGiJF511Xg0gG8DmQCBwiYjoqxBZMFYHbxdU9Lvyz/k8mrPe1njuKeKDZQLYaDabNYuLix+IiOxdr4bzz/e5NWe9rXmnH95Tn7rfEdtdIkbPALAewPaenp5KIqJX7z69y7/Qe1NzpuuOuvxBe25ZW6fKcqs71j1ZdM8CsAWANBQK2YmI2p/OTjOx+mSrV2W+2as84eqPBkjE7unMHYAyHA4/IyKqdk771eUP2nNPtnqVZrdPYXI+URgd/mhAkjhbJoBNAHIAaARB+EhEdOSyr0tV1tapMrt7lSecA3JD81P58cax6P4sfjaAbQB4AMXs06jL73YoLZ5upcnVrzA6/HJ9wyivr5+IBqQAWANgnRhfBWA3A6jK2jqVZrdPbnIM8obGEZneNs7r6iYZYEVU/w0AdgDIA7CHAZSWW48UppbHvLHJLzveMCY7Zgtwx2qfRy+QKs7H+hcA2PsT4Onmjc4B3mAf5nT1zzhd3aQ0BpAmPuAWAByAQgD7GEBudvfKTY5BXt8wItPbxqXa60GutHbqVwAZgCIA+5cKkIgTZgHYyhYAcOAHwOTyyfTNg5yufpTT1k1IS2uD0qPXEgAYRID2TwC6pqF/BkiK+YXyeABO1zQkZYCS/wDYBeDgXwPwhpa+WEBOSc2LJQM4nbOP09qHpCW20Z1Hrk/kHK4J7jh09c8B3wHXA/xQA5OGfQAAAABJRU5ErkJggg==","w":16,"h":30,"scaleX":false,"scaleY":false},{"url":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACEAAAAeCAYAAACiyHcXAAAByklEQVRIie3Oy04aYQDF8ZO0Ta1NGy9vUOkw44B4Ax+itNwEA2gxUROJUR+jG03EUYKCES94K9N6AfGCFa0pomh1Jn0Clyy6Y0faBdRgU3fl+1h4kt/6/AHgUZHHRZ4QhKcAKgqeAagseE4QXgB4CaAKQHVBDYBaYjKZzEg2m43ncrnML0oDrePiYffiZ3pUvInZPvxYaBtOT7cNn03rhlJ+3VDKrx0kA7rB0xntwMmsduA42OI+mmt1J+Zb3YmFvEMi0NJ/EGrq21tu7t1Zbe6LrTX2xj429WyH86J/iYilAE1PRGzs3lhv6P682eD6tKVxiRGNS4yo34ejt7pKC+qucFTduRZTOVd2VY7lPZVjaZ93huK84x720MH/Bt4ZivP2xS+8fT5R3zF3VN8RPL5lC34lAfmz2RPOOvONswWSnDWQ5NoDpySBtfqTXLs/xVqmzliL7zxvKk0SlBbfOWv2XbBm76XSNPmdBrBm7yVj8l4xpokrxjR5/S9KoyCVEv6cKw2CdIdRkEkBY5i4ZgyC9No4LtMCxiBIZRFBM6B8IhTvxiWF3iPTBMXbh4hCBOUAhd4jo07vkWkrp4ixhwi8ejMm01YWEb8BjlYRAgt86lsAAAAASUVORK5CYII=","w":33,"h":30,"scaleX":true,"scaleY":false},{"url":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAeCAYAAAD+QjQzAAAAiklEQVQ4jWNgYGBgJQIzcBOBGYQJ4v9EAOIUmeaenE0IM5hk7l9MCDMYJm9ZSwgz6Mau2UoIM2hHLt1LCDNohS04TAgzaIbMOUEIM2gEzzxDCDOoB049TwgzqAdMvkQIM6gHTL5MCDOoBky6TAjTW5GKz8TLhDC9FSn7TLxMCNNbkZL3hMuEMFGKAIO27Ou+Pq0hAAAAAElFTkSuQmCC","w":9,"h":30,"scaleX":true,"scaleY":false},{"url":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAANoAAAAeCAYAAABKZAB5AAADVUlEQVR4nO3VW1MScRgG8Hemmk7T+RPkmoAgqePhGzSCIhoeRiyz0WzKybpv+gYKCOp4QFPzNApphjqmmYfQlA4GiHbVF2jGu2a8sS4QhVxgd/nvsjTvf+Z34Qzqw+7z7AIAnEIIEXMyyIkgcB4hRMy5A2cB4MyB0wAA1xBCxFwFgCsAcBkALgHARQC4AH/w4MHDy9nf3/+9t7fn2t3d7cKh4cEjwIHsJ+tdCKHY5TT45T7d6Mx95uq49dzd/aL/54TN+csJWY8+vEIIkbB4YLk/6/FKX3b9cm9WvbMnp2HNChk1DjtCiIspW6hpW3rt9Fh67cxY5oPZ0Yy62ZHMuvnhzIcLA5B21zaFEOKoKtTNe3aHsur1W2X1+KTy/sSbm9WT4xk1DjvIKwbfI4RY0g/O06ocnFfoh+YU+uF3isqRWeWd0Zm0KrsDUst6VxBCBJT3Lh/pW5JX9C/K9QMLCv3QHMhKrJ8QQgSVWddkpd2rstIep7zs5cfU8r4lkOo6PiOESGp3SXUdLqmuc0NW0rUuK7WugqS49RtCiCzp7bavfu1fJLp2F0iKLG6EEDcpxa3fw2vZDIwOJEUWD0KIEK3FfehwiG2bcKPI7EEIkZeitbhTtP6x4dAQ4pF/bC04NIT4FHirCTs0LQciuFgJmxvF3eHQkguaPfwyEcb2/4g9N/qvFZrdyYVmvodGUziNycsY8bIzLT2fuUVw8zndv3hnSWAaoYfGpqyCDi+CWDPHK7egRFBmMeN3aGHKmm/aYo1E2bmUno/ccR8Fh++Ow4uNxuwGqqDZQ57piMbkDQgtotEXGX15g//ev9h+ntKYvCFZo2bmnptRlkRFdw156VViEmxo7IrKvLhcMS0Qn7njPg6GDyrG3wGHFsehHbuBQUUsMGxHxXl4zAfKemRMctNmJ//AEAv6wcW/4GIhyNCOFTaojJTasEOH3fDIvWkijiyW3FGz07014zEa7tcSxxZlaEn5Jg9fKJXRS6kMW5TKsEWpjT5KbfAl5TVtX89r3GEqKa9pmytKbfAFhP5sPBLIF07Q77PJzSR7cD4xYX596a6h0ctnpxKSulnIodGUVdX4IyyOpWZS8tBiRRhbuIdDpNwsssfyEOELl2tOqQ04tihD+wutvqYL28wEjgAAAABJRU5ErkJggg==","w":218,"h":30,"scaleX":true,"scaleY":false},{"url":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAeCAYAAAAcni9KAAADN0lEQVQ4jbWSW0jTYRjGH8tOWlR0jiKqHf47uE0T6qLrLozUuTbNA9kJsYygA0Rkt11nLs105g6K//6Sy9bKcmpLraZuWlGppdDBLBgUJUnb3i78VpOsLOqF7/L3PO/zvB8ATAMQFfGmPDMBzAAQDWB6hNBvJxZADIDZTGRqAkNDQ/sdDocGwDwmEinwc5jGJ+j3+41JSUnLmUAMgFkswuTuD4c+Pg2FKEhENDY21t/W1rYFwAIAc5l7GJ4IbjzUWXa0/Jnw7v3nN8w90Nvbmwlg4S/hxPzb5sQDbabNRzwVTT5/FxFRIBB4W1BQwE0Cf19Zs8/Jb8hrqk7MbzEnHmyvGBz+NEhE5Pf77QCWMziWZQ4XBqh21tvVu67WafZer03Ic1kzT3v5L4HgGBGR2+3eBWApgPmssO8rK3Nqr8ftrLuqzr1yWbPHySfkuax17uFOIqKRkREBwCoAi1jbYdcoKHZYXcrsmsa4HMGhyrXXa/Y4+YKinmtERKOjo30A1rGVF0S4ToPccNGtyLA0KzOrb8blCA517pXLm/Jv8cFgKBAKhYLx8fFqAKsBLGZFzQIwHbLt5Xflhso7inRLszKzulGVIzSodzcIL99+eEVEZDKZsgGsBbCMZZ0NIBpSXamH01/okBtMbsUOqysum3eqcu31jwZG+oiI7Hb7YQBiACtZwzEAosFpS7s43fn7nL68XZ5+sTXs+rD/TT8RkSAIxwBwESXFApgBSarRy+lKOjld2V2Z3uSWZ1iaFNmXrj3oGx4gIuJ5/jgAJYA1AJawnDMh1hb7pNqSLkla2T2pvuKOPN3skmfVOnufvn5GRGSz2U4AULGcS7+dRawt9knSznVL0sbX5QxVLYqsmhu+J6+eM/AkAA2A9ews4wVJUop7pgDGAxBNAMXbinrEycZuaWqpR6q90M7pK1tkGbbGMGixWAoBJDBwxY9gyjgo01W2ygy2Rt+TF8+JiKqqqgoBbGAnWcF+0O9Bs9l8ioESdst/AIqSjd0SBnK6ylZuyo4pxd5IUGaw3vwDsMQj0ZZ1hEHv45eDvwDn/D24LulMj2jrWa9om9EjSi7tEGsrWjmd+f+BXwEE1xzRJP69MwAAAABJRU5ErkJggg==","w":14,"h":30,"scaleX":false,"scaleY":false}],[{"url":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAUCAYAAACEYr13AAAAs0lEQVQ4jeXMTQqCQBgG4LdFq5atA+fzBzpBN9CcUdHuVf6koRJGB3E1m1kMDHShWuQJCoLwOcADAAsASwArAGsAGwBbADsAwXPiHe6jl16lm7TKjhrtiLMhXj7w08BNe+kkrbJFo4mXhsKZBdltdJNeOvFF2aKegnxWgZMNI8WdJNEoEpW2eGFYeJpXkA4jRZ0k3ijilbbCwrD9XwV28g4YrxWFpbaC3DD/w4BNgeUfvw9ejW+JqKJSbIMAAAAASUVORK5CYII=","w":16,"h":20,"scaleX":false,"scaleY":true},{"url":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACEAAAAUCAYAAAADU1RxAAAAbUlEQVRIie3OMQ6AIAyFYW7SwF2AiFejgbs9D+TQwcRB0MSUocOfN7X5XNg7tHPaAEGUDu0MsRqiIWwNoehliLUQPjf4zJDVyRCrIRjaGeJCJAYlhp+MPvb0y1FkUKyQHVV/6QXidpz4GDaJOAHszqA+1/c7OQAAAABJRU5ErkJggg==","w":33,"h":20,"scaleX":true,"scaleY":true},{"url":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAUCAYAAABf2RdVAAAAQElEQVQokWNQ8p5wmRBmIE6R14TLhDD9FfVfJoTprUjRvf8yIUx/Rb2XCWEqKpJ3672MDSsiYQZ5157LhDBRigA4kELt+PzUqAAAAABJRU5ErkJggg==","w":9,"h":20,"scaleX":true,"scaleY":true},{"url":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAANoAAAAUCAYAAADr/yMfAAACkklEQVR4nO2WW3akIBRFayYWOpYuoXpoAiZTK581m/6wVVCwAHmZ8LFX1kqMHo53I7f871fjigLVbYFoVyDaFU/a55AMAOJxAeH3R9jrDdg+M4dkyCEZiiftV+p+ybnkraffm+a2uIaYWbtkO6xbl3N1OZ7fr1v0os2DamlgZ9F42RyLdlXhFNaSRFMV7fnVOAPRNoe0yyHpAKI9gHgAJR4nqhFA/Fbi6NqyGlcw81MCxMMCov1MDknHwv7NOLdSZlWY51tBcj+tdTB9Lj3SLke0zRFtnc7WlUB1Ek0mGifbjxTNUK4kWqSiiWTbDu7H4dK5TiKVRDBeNMogkE05t0FW62w3H1GOM5JVfMdsh0myCEQTDq0lZGJpS8YL5zx3MAxFE0iWRPsoWt1YBzFA2k5MX4h7SfoVPJhRjRNH17DP4QEMoiPj7gi5u4dp7hiYuxMDyuq9RXzt2jPf4//3Pb9/F/N1NUKIBrwN7LFkKoLJZQsti1vxjiXjO953yUiWRPMo2iKbypfiHKDU/1rtduIdarltr8UNZl858elB1nESzZ9oIuEUBtg9Mpk2wyHNHCq3XeaNSP04zG8oh70mycSigbJu3EI47iVtjYG4E2Jwr22uI05ltrFWnS40yB6kzx6VAqTPStxlpbz3fW+u5+pCQOpDtL1sPgZYRyRdgojnSORZoEk6AQdyyXuOYLhjwp9octni4oqZT2wSOl9A5U0sgsGOjSTaLxdNVTitk0IEgx0bk2jhX34iHKGP4b+CJFoi4YEkWiLhAUhfN/AgzU8kY/D5LBGh1u2a0O/4Qrxu2R/c6EEEnPlfU3Rzf8qkmtnWc2335CPX2S5dz0Sc3M1ES4Qd4pjECt3BNTbB+4O8/gEwZn7zfDAqjQAAAABJRU5ErkJggg==","w":218,"h":20,"scaleX":true,"scaleY":true},{"url":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAUCAYAAAC9BQwsAAAAvklEQVQ4jd3LPQ6CMBgG4Hd1c3aC0hp3D4EUi3/38QpAQNSoiXINpk4dGL500dHEeA8cNK4OxsTw7A+YTC0PM+JqVfNoY8TsoAeLsqLL/do0TVOW5RLAEEAfQA9AF0AHX8TEsjAjT+WvuNf9xalV0Q0Sy2RKLMxrrtZGTPZazFsWR4l1ZEpMZrWnCsOjNsbYOkFCLMhqb1wYHu20mB4rutz+MvrP6MrCMLXTYnKs6PwhOn5sHT8m9x232ot+GB/ZuKcDAcKNQQAAAABJRU5ErkJggg==","w":14,"h":20,"scaleX":false,"scaleY":true}],[{"url":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAABtCAYAAACoT+F+AAAEwUlEQVRYheXT22+TdRzH8fc4CALa83putzHngYis3dqtO3Td2o2Ng5EEEyR65YUmxMiVF9wqrGu7tqNscwuTGy+N/wBPgjxRH8aDz1BvvCABI94ICRkJIXDx86K/ktIMpIs3zb5/wCvfz/cA0ARsBXYCNsAPvAlEgTEha/fhJaXt4Ndq60RJax0v6i1jeaNlNPcrLwq0HVpS2g7Mqy0TJa11rKgHR/NGS6ou4LzSemBebRkvacHRoh5M5Y1AAwLjNUByPcBYSQs0KHDwvBLc/zTgrwdomTivBPfPqsHRMhBoRGCxDKTOaoFUQQ8kpw3/SD3A+KISGJNAsqAHRqYN30i2kYCgBPyps5o/WdB9I9OGb7gOIDC+qPhTs6oveVbzDxd0b2La8A01FrB/QfEnz6m+ZFHzJQq6dyhreDcaMLqg+JMl1Zsoar5EXvfEs4Z3cGpDAb7UguJNllRvoqB5EjndE88Yng0GeFMLimekpHqGCpp7KKe74xnDtdGAkXnFnSipnqG85o7ndPdgxnAOpDcWMDyvuIdKqmcwr7kHcrq7P2M4+zcW4EnMK+54SXUN5DVXf1Z39k0ZzthkYwFzijs+o7r6JRCrF4jPKe6BGdUpgebYlNHc21CAKz6nuCTg7JNATx2Ac3BOcfXPqM6+vOaMZXVHb0MCzRJwrAsYmFWa+4pqcxXgaFCgN685erK6I7oOwCEBe1QC0YYCmiVg75nW7NGMbo+kDVtdQN+s4ogVVVs10N1QgL1vVnHECk8AayRtWLvP1AfYYwXVFs1qtmhGt3Y3HhCbVew9BdUazWq2iAS66gBsvbOKPVpQrZGsZusuA5ZwwwEWCVi7M7p5IwLRkmKJFFRrV1azhqd0c3jSsIRPbyjAKgFLOKuZQlO6KTxpmDtPX//fgC3AjucCPecuWiIF1dL1fMAK+IA3gAgw+vDhw/tCCBE++q36BAjXAdy8efO6EEJ89qVy3dydv2wJZ8oddE4a5s6vngCbgZcBC+AFXge6gdSlS5e+E0KIC9//dsMcKV62hHM/m0Lpq2sB2wEz4AFeA8LASKFQmBRCiBu37ty1RIo/WLqyP5lC6aum0Jlf1gJMgBtoBzqBofb29uMPHjxYFUKI6cXLv1u6cj+aQpllUyh9zbzvzEot8CrgBNqAvcAAcDiXy80IIcSjR48fD35wYdkUzmim0KRu2nfaQNYm4CXgFcAOBIA9QC8wDhxbWVlZFkKIv27//U/f0SXd1JlZNnWmr1WA6mOyykF2yDkMA0c6OjpO3Lt37065k0eP0/MX/zCHMsvVwBa5CVNNjD5gAjjW3t7++ZUrV65WjuvWn7fvVgObgW1VMfzyHrpkF+8CHwKfnjp16pvV1dX7QghRDWySMXbIdbqAVuBtOYsUcAT4CPjE5XJ9cfLkySWqapOMsR3YRfkvvPIm3gFiwCjwHnAc+Bg4UQ1UYmytmoVDRukA9kkkCRwC3pfdPFWVLrbJjZiB5ipkL+UvjQNjwOFaoOkZiIPyk+0G3gJCQA8wWAs8CzFR3owbCMq57JGx1qxaZAflM7fKSF4J7X4WUIu8RHmwu2Q3Fcj9PKAaqWxnm4R2yo7M/wWsBVU62i6xF66mGqiCrasqWNO/vU4xVs1Bjy0AAAAASUVORK5CYII=","w":16,"h":109,"scaleX":false,"scaleY":false},{"url":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACEAAABtCAYAAAAvfgh4AAAC3ElEQVRoge3QSWsTYRjA8b+KGy6TVm0b20nFFQRJUtuS1tI2W0EQRKoXD4K4gQdFXPAguLQzITMTv4DngkdP3rx6qrbNO60X8Rv04LmCHhKytalJGucd4R34MczMy/P8GfrTOdGfdkThXo9TbSrnthPrFvxFaCrnhqZybijtlKXs5SqV3xpAKO2IJtRfvAX/cUS9gcnWNB2hJx23oeEpa6VR6GlH6ClH6OkNpGokG4hoYrmKWB+RcoSestcvLL2vUIzQk44bStjLm0paK2XZlernaugJWzTHcfWEVWQvby67Ul/5XIsRlSGNxGyuhYjKkNqgFiP6ErZoVfXfsFw9XqPe4qozlktf3BbtsC6gQX1xW7QtopGoemf/WUQzChGTWxw0uQVxW7ClAW2iIkoRvRO2kE1F+DHCUhEqohQRnLBEcNwSwQl5VIS/InrGLSGbivBXRPdYVsimInwWcSErZFMRPosYzYru0Ywo3OVQEeWIkYyQTUX4K6JrJCNkK0TEVIRfImIZ0RUzCyGScCRmCtlURDli2BSyqQh/RRwaMoVsdA6ZQjYVURNhSI4YNIRsKqIqokN2REcxQiYVoSJURP2IAUPIpiL8FREYMPOBAUPIpCJ8FhGdzQcihpDJRxGSQwhEzXwgOpvXIoaQBS1iLGlhM6+FZ/Na2BAyoEXMBS1iLFXHeAstmv2iRTJfCzGZxVKQh3j/4fOPhzMfvw9Pv3ODI28XgrHcYjCWW+yOOUte4bcPLubm5j7Nz89/W11d/bm2tvZLBoDHwHPgBfASeAW8Bt4AMx7hDnAfeAA8KkY9AZ4CzzzCNeA6cAO4CdwCbgN3i+55gBRwEbgEXAauANPA1WKgFxgEYsAYMA5MAnEgASQ9whngLHAOCANRYAA47yF6gRBwDDgOnABOAqeA0x6hEzgMdAHdQA8QLDrqEfYB+4EDwEFAAwIeYyewC9gN7NnAXg+wDdhetEOGP/lHB+Wwz0/EAAAAAElFTkSuQmCC","w":33,"h":109,"scaleX":true,"scaleY":false},{"url":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAABtCAYAAABz9EtcAAABHklEQVRIie3KTU7CUBiF4ZM4clTUKP7WmVMIggE1ItCyA9fgDtyA3jb0lsXh17KZmuhIU2PlfIObOzC+yTN7cT5fFhvFuSCM86LRfPkFYWTLjeJcMUW2RDiz5UaRLRFG2bpRbfx9qnE5zbJ1o6ktP+FsakvG6ZQV30x+wunESp1qauJyurfCOJxOxlaY/0lwNM6E8T0d3mXC+J7atwthvE83C2G8T9cLYVxOo1QY39PBKBXG+zRMhcH+MBHG5XSVCON72hskwmB3kAjjfeobYXxPO30jzF+fekYY31OrZ4TxPnWNMA6noGuEQdAxwiDovLwyCLpmxaA9zFcM3hWhqqo3BgCeFfCkgEcFPChgpoBLBVwo4FgBLQVsK2CL+QCy7QK4lrxVhAAAAABJRU5ErkJggg==","w":9,"h":109,"scaleX":true,"scaleY":false},{"url":"data:image/png;base64,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","w":218,"h":109,"scaleX":true,"scaleY":false},{"url":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAABtCAYAAACRKFAlAAAEyklEQVRYhd3Sy28TVxgF8MM70MI49vg1foc2KiotSRzbcezEGD8SwmNRumhVtaJSF4hF/4BKpQgpD4+dcRwnkNBSNUiVUNdlQyrBUDVDOiGXiUq649GKVmlRFmxJfLvwTRloBc6Kka80u/npnPt9F/6eoubvKZLAwbIa6DurNB2ZlHcf/WaaLP52l1JKL168eApAEEAzAAGACcB2+LOS5ssWSaB3VPUfPKsEDk3Ku49+/WLoY9DXO6r6e8eVwKFJucmgMC1pvkyR+LJV6O9bJ/RmR1Ufg4HDhoSe/8CJGmGqoHkzReLNjKq+LIOHLhgSHiho3nSReNMjqi9bVvwHa4TuAwXNm5aIJz2i+jJlxd9jaOhOVaEnU1a8PROyr+/CNLn9AuhKFjRXUiKe1IjqSZcVT3ZC9vVemJ43IsxrrqRE3Kmi6k6XFU9mQvbWG0zkNSFRIO5kUXWlRhV35pzs7fmyrqDQLWpCokCE/ZLqSpYUd2pc9tQZdHSJmjNRIM6EpArJkiKkxmVXtr6gPS5qzu48cSQkVUiUFGdyXBbS5+sPxvPE0a2DqTqDMVGzx0TiiEuqo7ukOBNjspCcnJ7/5b7xYE6zd4rEERteH7RFn0B7fERxdI/Jwn7DQlunSOydDHaNyc5ELbAjp1kZtMWewJsGhVGRWHXQXgu0RgYZzKu22IhiMziMiMQaZTA2Jtu71gH5aF61dVahzZiQjwxqfFgkfCSvWjslxdpZlm3xczXA8KDGh3PEEsmr1g5J4dfgguGgWQct64MDmjmUI5awqFo6hhU+WpL5+FlDwnYGQ6JqiTAYqwE2Bp9Ac3hY4SMlmY8aEpqCA5oplCNmBs2RkmyuN9g2oJmCQ8TcLqrm0LBiDpdkc8fLgHML9+88BzY8BRtD0kwVnrvyYtg6oHHBoXmOQVOoJJsjLxNOTU19vi5478HDJUopPXPmzEkGXwfg1MF+jWsbnOfacmpjuzRjCpWuCYnz0ysrqyuVSmXF4/H0AGgF8BqDHIODt6ow/3Nj+/BPplDp2juffn+DUkqXl5fvAEgAaAGwG4DjaRjM3TQFxdkqLF/96rv5RUopXVxcvAKgC8DbAJoA2AHsArANXMsA4dqG5rhg/kZjcOTH/R9dUh4/XnlMKaWiKH4GIAZgLwA/ACuAnQC2gmsZnOdacyrXNqzw4dHrd+/98SellC4sLFwF0AsgAmAPAC8AHsCrALaAaxua41oLs67usZkfrs/dppTSR48eLTc3N38IIKVbhQtAI4AdVdgqzh47MaX+9ffDZUopXV1dXTl9+vQQgCPsfvt09+MAbAewGXO3fv29UqlUKKV0aWnpwfHjx78A8C6ADIDwMzV3AtgGYBNYyurly5evcBx3AsB7APpYWgvbn8BqvgJgK4CN6O/v/zYajZ4C8AmA91nFJIB2XZqVraEBwGYAGwDgJICPWdIRAAfYJPcCCLCl69M2rcEPABxj9ZIMvcVeigDAwlawlrYR7Bxmg+hi9d5kyMUGsotNcos+DQDibHr7ALzB6gk6tENX8d80oPoO97AUL7uT5Rm0VnGDHjYx4GTTM7E7bX8eAqovgmeT28Wm16C70/8ioPqMdrJaDbqU5yKwStvWA9aO/ueawNrZoPtqPv8AklaxurvwKHsAAAAASUVORK5CYII=","w":14,"h":109,"scaleX":false,"scaleY":false}]],"lastScaleX":3,"lastScaleY":1},
            };
            collection.nPatches = {
                message_bg: {"w":290,"h":159,"p1":{"x":19,"y":12},"p2":{"x":272,"y":146},"patches":[[{"url":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAeCAYAAAAl+Z4RAAAC+0lEQVQ4jb2S20vTYRzGn2qeOihq5wNBud9+OzinqEEXQdABOuja2hZbYgcqRAhiF+G19AeUJlOna461Mjto6FJnmi4P6VyGF/OuoIwYgRaV9XN8u/m9NcYKR4cX3svn8zzP+7xA4mdZ1F2eqGg5gBUAJACSACQvVcyETJQKYCWA1YkIUwCkiaJ0q9W6PRQKWZYqTgWwCkAGgKyZmZlzkUjkPRHR78QSMS5zzayqquLn5+c7SDyvwwuz8QDMOVnsmQ4g22q1KgRBmCUi+iZEvtzoefuk+OJYYzx3FjtNFK8FsHlubs5LRPQm/Pml6cqUp6jS7yisGGiJF511Xg0gG8DmQCBwiYjoqxBZMFYHbxdU9Lvyz/k8mrPe1njuKeKDZQLYaDabNYuLix+IiOxdr4bzz/e5NWe9rXmnH95Tn7rfEdtdIkbPALAewPaenp5KIqJX7z69y7/Qe1NzpuuOuvxBe25ZW6fKcqs71j1ZdM8CsAWANBQK2YmI2p/OTjOx+mSrV2W+2as84eqPBkjE7unMHYAyHA4/IyKqdk771eUP2nNPtnqVZrdPYXI+URgd/mhAkjhbJoBNAHIAaARB+EhEdOSyr0tV1tapMrt7lSecA3JD81P58cax6P4sfjaAbQB4AMXs06jL73YoLZ5upcnVrzA6/HJ9wyivr5+IBqQAWANgnRhfBWA3A6jK2jqVZrdPbnIM8obGEZneNs7r6iYZYEVU/w0AdgDIA7CHAZSWW48UppbHvLHJLzveMCY7Zgtwx2qfRy+QKs7H+hcA2PsT4Onmjc4B3mAf5nT1zzhd3aQ0BpAmPuAWAByAQgD7GEBudvfKTY5BXt8wItPbxqXa60GutHbqVwAZgCIA+5cKkIgTZgHYyhYAcOAHwOTyyfTNg5yufpTT1k1IS2uD0qPXEgAYRID2TwC6pqF/BkiK+YXyeABO1zQkZYCS/wDYBeDgXwPwhpa+WEBOSc2LJQM4nbOP09qHpCW20Z1Hrk/kHK4J7jh09c8B3wHXA/xQA5OGfQAAAABJRU5ErkJggg==","w":16,"h":30,"scaleX":false,"scaleY":false},{"url":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACEAAAAeCAYAAACiyHcXAAAByklEQVRIie3Oy04aYQDF8ZO0Ta1NGy9vUOkw44B4Ax+itNwEA2gxUROJUR+jG03EUYKCES94K9N6AfGCFa0pomh1Jn0Clyy6Y0faBdRgU3fl+1h4kt/6/AHgUZHHRZ4QhKcAKgqeAagseE4QXgB4CaAKQHVBDYBaYjKZzEg2m43ncrnML0oDrePiYffiZ3pUvInZPvxYaBtOT7cNn03rhlJ+3VDKrx0kA7rB0xntwMmsduA42OI+mmt1J+Zb3YmFvEMi0NJ/EGrq21tu7t1Zbe6LrTX2xj429WyH86J/iYilAE1PRGzs3lhv6P682eD6tKVxiRGNS4yo34ejt7pKC+qucFTduRZTOVd2VY7lPZVjaZ93huK84x720MH/Bt4ZivP2xS+8fT5R3zF3VN8RPL5lC34lAfmz2RPOOvONswWSnDWQ5NoDpySBtfqTXLs/xVqmzliL7zxvKk0SlBbfOWv2XbBm76XSNPmdBrBm7yVj8l4xpokrxjR5/S9KoyCVEv6cKw2CdIdRkEkBY5i4ZgyC9No4LtMCxiBIZRFBM6B8IhTvxiWF3iPTBMXbh4hCBOUAhd4jo07vkWkrp4ixhwi8ejMm01YWEb8BjlYRAgt86lsAAAAASUVORK5CYII=","w":33,"h":30,"scaleX":true,"scaleY":false},{"url":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAeCAYAAAD+QjQzAAAAiklEQVQ4jWNgYGBgJQIzcBOBGYQJ4v9EAOIUmeaenE0IM5hk7l9MCDMYJm9ZSwgz6Mau2UoIM2hHLt1LCDNohS04TAgzaIbMOUEIM2gEzzxDCDOoB049TwgzqAdMvkQIM6gHTL5MCDOoBky6TAjTW5GKz8TLhDC9FSn7TLxMCNNbkZL3hMuEMFGKAIO27Ou+Pq0hAAAAAElFTkSuQmCC","w":9,"h":30,"scaleX":true,"scaleY":false},{"url":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAANoAAAAeCAYAAABKZAB5AAADVUlEQVR4nO3VW1MScRgG8Hemmk7T+RPkmoAgqePhGzSCIhoeRiyz0WzKybpv+gYKCOp4QFPzNApphjqmmYfQlA4GiHbVF2jGu2a8sS4QhVxgd/nvsjTvf+Z34Qzqw+7z7AIAnEIIEXMyyIkgcB4hRMy5A2cB4MyB0wAA1xBCxFwFgCsAcBkALgHARQC4AH/w4MHDy9nf3/+9t7fn2t3d7cKh4cEjwIHsJ+tdCKHY5TT45T7d6Mx95uq49dzd/aL/54TN+csJWY8+vEIIkbB4YLk/6/FKX3b9cm9WvbMnp2HNChk1DjtCiIspW6hpW3rt9Fh67cxY5oPZ0Yy62ZHMuvnhzIcLA5B21zaFEOKoKtTNe3aHsur1W2X1+KTy/sSbm9WT4xk1DjvIKwbfI4RY0g/O06ocnFfoh+YU+uF3isqRWeWd0Zm0KrsDUst6VxBCBJT3Lh/pW5JX9C/K9QMLCv3QHMhKrJ8QQgSVWddkpd2rstIep7zs5cfU8r4lkOo6PiOESGp3SXUdLqmuc0NW0rUuK7WugqS49RtCiCzp7bavfu1fJLp2F0iKLG6EEDcpxa3fw2vZDIwOJEUWD0KIEK3FfehwiG2bcKPI7EEIkZeitbhTtP6x4dAQ4pF/bC04NIT4FHirCTs0LQciuFgJmxvF3eHQkguaPfwyEcb2/4g9N/qvFZrdyYVmvodGUziNycsY8bIzLT2fuUVw8zndv3hnSWAaoYfGpqyCDi+CWDPHK7egRFBmMeN3aGHKmm/aYo1E2bmUno/ccR8Fh++Ow4uNxuwGqqDZQ57piMbkDQgtotEXGX15g//ev9h+ntKYvCFZo2bmnptRlkRFdw156VViEmxo7IrKvLhcMS0Qn7njPg6GDyrG3wGHFsehHbuBQUUsMGxHxXl4zAfKemRMctNmJ//AEAv6wcW/4GIhyNCOFTaojJTasEOH3fDIvWkijiyW3FGz07014zEa7tcSxxZlaEn5Jg9fKJXRS6kMW5TKsEWpjT5KbfAl5TVtX89r3GEqKa9pmytKbfAFhP5sPBLIF07Q77PJzSR7cD4xYX596a6h0ctnpxKSulnIodGUVdX4IyyOpWZS8tBiRRhbuIdDpNwsssfyEOELl2tOqQ04tihD+wutvqYL28wEjgAAAABJRU5ErkJggg==","w":218,"h":30,"scaleX":true,"scaleY":false},{"url":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAeCAYAAAAcni9KAAADN0lEQVQ4jbWSW0jTYRjGH8tOWlR0jiKqHf47uE0T6qLrLozUuTbNA9kJsYygA0Rkt11nLs105g6K//6Sy9bKcmpLraZuWlGppdDBLBgUJUnb3i78VpOsLOqF7/L3PO/zvB8ATAMQFfGmPDMBzAAQDWB6hNBvJxZADIDZTGRqAkNDQ/sdDocGwDwmEinwc5jGJ+j3+41JSUnLmUAMgFkswuTuD4c+Pg2FKEhENDY21t/W1rYFwAIAc5l7GJ4IbjzUWXa0/Jnw7v3nN8w90Nvbmwlg4S/hxPzb5sQDbabNRzwVTT5/FxFRIBB4W1BQwE0Cf19Zs8/Jb8hrqk7MbzEnHmyvGBz+NEhE5Pf77QCWMziWZQ4XBqh21tvVu67WafZer03Ic1kzT3v5L4HgGBGR2+3eBWApgPmssO8rK3Nqr8ftrLuqzr1yWbPHySfkuax17uFOIqKRkREBwCoAi1jbYdcoKHZYXcrsmsa4HMGhyrXXa/Y4+YKinmtERKOjo30A1rGVF0S4ToPccNGtyLA0KzOrb8blCA517pXLm/Jv8cFgKBAKhYLx8fFqAKsBLGZFzQIwHbLt5Xflhso7inRLszKzulGVIzSodzcIL99+eEVEZDKZsgGsBbCMZZ0NIBpSXamH01/okBtMbsUOqysum3eqcu31jwZG+oiI7Hb7YQBiACtZwzEAosFpS7s43fn7nL68XZ5+sTXs+rD/TT8RkSAIxwBwESXFApgBSarRy+lKOjld2V2Z3uSWZ1iaFNmXrj3oGx4gIuJ5/jgAJYA1AJawnDMh1hb7pNqSLkla2T2pvuKOPN3skmfVOnufvn5GRGSz2U4AULGcS7+dRawt9knSznVL0sbX5QxVLYqsmhu+J6+eM/AkAA2A9ews4wVJUop7pgDGAxBNAMXbinrEycZuaWqpR6q90M7pK1tkGbbGMGixWAoBJDBwxY9gyjgo01W2ygy2Rt+TF8+JiKqqqgoBbGAnWcF+0O9Bs9l8ioESdst/AIqSjd0SBnK6ylZuyo4pxd5IUGaw3vwDsMQj0ZZ1hEHv45eDvwDn/D24LulMj2jrWa9om9EjSi7tEGsrWjmd+f+BXwEE1xzRJP69MwAAAABJRU5ErkJggg==","w":14,"h":30,"scaleX":false,"scaleY":false}],[{"url":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAUCAYAAACEYr13AAAAs0lEQVQ4jeXMTQqCQBgG4LdFq5atA+fzBzpBN9CcUdHuVf6koRJGB3E1m1kMDHShWuQJCoLwOcADAAsASwArAGsAGwBbADsAwXPiHe6jl16lm7TKjhrtiLMhXj7w08BNe+kkrbJFo4mXhsKZBdltdJNeOvFF2aKegnxWgZMNI8WdJNEoEpW2eGFYeJpXkA4jRZ0k3ijilbbCwrD9XwV28g4YrxWFpbaC3DD/w4BNgeUfvw9ejW+JqKJSbIMAAAAASUVORK5CYII=","w":16,"h":20,"scaleX":false,"scaleY":true},{"url":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACEAAAAUCAYAAAADU1RxAAAAbUlEQVRIie3OMQ6AIAyFYW7SwF2AiFejgbs9D+TQwcRB0MSUocOfN7X5XNg7tHPaAEGUDu0MsRqiIWwNoehliLUQPjf4zJDVyRCrIRjaGeJCJAYlhp+MPvb0y1FkUKyQHVV/6QXidpz4GDaJOAHszqA+1/c7OQAAAABJRU5ErkJggg==","w":33,"h":20,"scaleX":true,"scaleY":true},{"url":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAUCAYAAABf2RdVAAAAQElEQVQokWNQ8p5wmRBmIE6R14TLhDD9FfVfJoTprUjRvf8yIUx/Rb2XCWEqKpJ3672MDSsiYQZ5157LhDBRigA4kELt+PzUqAAAAABJRU5ErkJggg==","w":9,"h":20,"scaleX":true,"scaleY":true},{"url":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAANoAAAAUCAYAAADr/yMfAAACkklEQVR4nO2WW3akIBRFayYWOpYuoXpoAiZTK581m/6wVVCwAHmZ8LFX1kqMHo53I7f871fjigLVbYFoVyDaFU/a55AMAOJxAeH3R9jrDdg+M4dkyCEZiiftV+p+ybnkraffm+a2uIaYWbtkO6xbl3N1OZ7fr1v0os2DamlgZ9F42RyLdlXhFNaSRFMV7fnVOAPRNoe0yyHpAKI9gHgAJR4nqhFA/Fbi6NqyGlcw81MCxMMCov1MDknHwv7NOLdSZlWY51tBcj+tdTB9Lj3SLke0zRFtnc7WlUB1Ek0mGifbjxTNUK4kWqSiiWTbDu7H4dK5TiKVRDBeNMogkE05t0FW62w3H1GOM5JVfMdsh0myCEQTDq0lZGJpS8YL5zx3MAxFE0iWRPsoWt1YBzFA2k5MX4h7SfoVPJhRjRNH17DP4QEMoiPj7gi5u4dp7hiYuxMDyuq9RXzt2jPf4//3Pb9/F/N1NUKIBrwN7LFkKoLJZQsti1vxjiXjO953yUiWRPMo2iKbypfiHKDU/1rtduIdarltr8UNZl858elB1nESzZ9oIuEUBtg9Mpk2wyHNHCq3XeaNSP04zG8oh70mycSigbJu3EI47iVtjYG4E2Jwr22uI05ltrFWnS40yB6kzx6VAqTPStxlpbz3fW+u5+pCQOpDtL1sPgZYRyRdgojnSORZoEk6AQdyyXuOYLhjwp9octni4oqZT2wSOl9A5U0sgsGOjSTaLxdNVTitk0IEgx0bk2jhX34iHKGP4b+CJFoi4YEkWiLhAUhfN/AgzU8kY/D5LBGh1u2a0O/4Qrxu2R/c6EEEnPlfU3Rzf8qkmtnWc2335CPX2S5dz0Sc3M1ES4Qd4pjECt3BNTbB+4O8/gEwZn7zfDAqjQAAAABJRU5ErkJggg==","w":218,"h":20,"scaleX":true,"scaleY":true},{"url":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAUCAYAAAC9BQwsAAAAvklEQVQ4jd3LPQ6CMBgG4Hd1c3aC0hp3D4EUi3/38QpAQNSoiXINpk4dGL500dHEeA8cNK4OxsTw7A+YTC0PM+JqVfNoY8TsoAeLsqLL/do0TVOW5RLAEEAfQA9AF0AHX8TEsjAjT+WvuNf9xalV0Q0Sy2RKLMxrrtZGTPZazFsWR4l1ZEpMZrWnCsOjNsbYOkFCLMhqb1wYHu20mB4rutz+MvrP6MrCMLXTYnKs6PwhOn5sHT8m9x232ot+GB/ZuKcDAcKNQQAAAABJRU5ErkJggg==","w":14,"h":20,"scaleX":false,"scaleY":true}],[{"url":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAABtCAYAAACoT+F+AAAEwUlEQVRYheXT22+TdRzH8fc4CALa83putzHngYis3dqtO3Td2o2Ng5EEEyR65YUmxMiVF9wqrGu7tqNscwuTGy+N/wBPgjxRH8aDz1BvvCABI94ICRkJIXDx86K/ktIMpIs3zb5/wCvfz/cA0ARsBXYCNsAPvAlEgTEha/fhJaXt4Ndq60RJax0v6i1jeaNlNPcrLwq0HVpS2g7Mqy0TJa11rKgHR/NGS6ou4LzSemBebRkvacHRoh5M5Y1AAwLjNUByPcBYSQs0KHDwvBLc/zTgrwdomTivBPfPqsHRMhBoRGCxDKTOaoFUQQ8kpw3/SD3A+KISGJNAsqAHRqYN30i2kYCgBPyps5o/WdB9I9OGb7gOIDC+qPhTs6oveVbzDxd0b2La8A01FrB/QfEnz6m+ZFHzJQq6dyhreDcaMLqg+JMl1Zsoar5EXvfEs4Z3cGpDAb7UguJNllRvoqB5EjndE88Yng0GeFMLimekpHqGCpp7KKe74xnDtdGAkXnFnSipnqG85o7ndPdgxnAOpDcWMDyvuIdKqmcwr7kHcrq7P2M4+zcW4EnMK+54SXUN5DVXf1Z39k0ZzthkYwFzijs+o7r6JRCrF4jPKe6BGdUpgebYlNHc21CAKz6nuCTg7JNATx2Ac3BOcfXPqM6+vOaMZXVHb0MCzRJwrAsYmFWa+4pqcxXgaFCgN685erK6I7oOwCEBe1QC0YYCmiVg75nW7NGMbo+kDVtdQN+s4ogVVVs10N1QgL1vVnHECk8AayRtWLvP1AfYYwXVFs1qtmhGt3Y3HhCbVew9BdUazWq2iAS66gBsvbOKPVpQrZGsZusuA5ZwwwEWCVi7M7p5IwLRkmKJFFRrV1azhqd0c3jSsIRPbyjAKgFLOKuZQlO6KTxpmDtPX//fgC3AjucCPecuWiIF1dL1fMAK+IA3gAgw+vDhw/tCCBE++q36BAjXAdy8efO6EEJ89qVy3dydv2wJZ8oddE4a5s6vngCbgZcBC+AFXge6gdSlS5e+E0KIC9//dsMcKV62hHM/m0Lpq2sB2wEz4AFeA8LASKFQmBRCiBu37ty1RIo/WLqyP5lC6aum0Jlf1gJMgBtoBzqBofb29uMPHjxYFUKI6cXLv1u6cj+aQpllUyh9zbzvzEot8CrgBNqAvcAAcDiXy80IIcSjR48fD35wYdkUzmim0KRu2nfaQNYm4CXgFcAOBIA9QC8wDhxbWVlZFkKIv27//U/f0SXd1JlZNnWmr1WA6mOyykF2yDkMA0c6OjpO3Lt37065k0eP0/MX/zCHMsvVwBa5CVNNjD5gAjjW3t7++ZUrV65WjuvWn7fvVgObgW1VMfzyHrpkF+8CHwKfnjp16pvV1dX7QghRDWySMXbIdbqAVuBtOYsUcAT4CPjE5XJ9cfLkySWqapOMsR3YRfkvvPIm3gFiwCjwHnAc+Bg4UQ1UYmytmoVDRukA9kkkCRwC3pfdPFWVLrbJjZiB5ipkL+UvjQNjwOFaoOkZiIPyk+0G3gJCQA8wWAs8CzFR3owbCMq57JGx1qxaZAflM7fKSF4J7X4WUIu8RHmwu2Q3Fcj9PKAaqWxnm4R2yo7M/wWsBVU62i6xF66mGqiCrasqWNO/vU4xVs1Bjy0AAAAASUVORK5CYII=","w":16,"h":109,"scaleX":false,"scaleY":false},{"url":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACEAAABtCAYAAAAvfgh4AAAC3ElEQVRoge3QSWsTYRjA8b+KGy6TVm0b20nFFQRJUtuS1tI2W0EQRKoXD4K4gQdFXPAguLQzITMTv4DngkdP3rx6qrbNO60X8Rv04LmCHhKytalJGucd4R34MczMy/P8GfrTOdGfdkThXo9TbSrnthPrFvxFaCrnhqZybijtlKXs5SqV3xpAKO2IJtRfvAX/cUS9gcnWNB2hJx23oeEpa6VR6GlH6ClH6OkNpGokG4hoYrmKWB+RcoSestcvLL2vUIzQk44bStjLm0paK2XZlernaugJWzTHcfWEVWQvby67Ul/5XIsRlSGNxGyuhYjKkNqgFiP6ErZoVfXfsFw9XqPe4qozlktf3BbtsC6gQX1xW7QtopGoemf/WUQzChGTWxw0uQVxW7ClAW2iIkoRvRO2kE1F+DHCUhEqohQRnLBEcNwSwQl5VIS/InrGLSGbivBXRPdYVsimInwWcSErZFMRPosYzYru0Ywo3OVQEeWIkYyQTUX4K6JrJCNkK0TEVIRfImIZ0RUzCyGScCRmCtlURDli2BSyqQh/RRwaMoVsdA6ZQjYVURNhSI4YNIRsKqIqokN2REcxQiYVoSJURP2IAUPIpiL8FREYMPOBAUPIpCJ8FhGdzQcihpDJRxGSQwhEzXwgOpvXIoaQBS1iLGlhM6+FZ/Na2BAyoEXMBS1iLFXHeAstmv2iRTJfCzGZxVKQh3j/4fOPhzMfvw9Pv3ODI28XgrHcYjCWW+yOOUte4bcPLubm5j7Nz89/W11d/bm2tvZLBoDHwHPgBfASeAW8Bt4AMx7hDnAfeAA8KkY9AZ4CzzzCNeA6cAO4CdwCbgN3i+55gBRwEbgEXAauANPA1WKgFxgEYsAYMA5MAnEgASQ9whngLHAOCANRYAA47yF6gRBwDDgOnABOAqeA0x6hEzgMdAHdQA8QLDrqEfYB+4EDwEFAAwIeYyewC9gN7NnAXg+wDdhetEOGP/lHB+Wwz0/EAAAAAElFTkSuQmCC","w":33,"h":109,"scaleX":true,"scaleY":false},{"url":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAABtCAYAAABz9EtcAAABHklEQVRIie3KTU7CUBiF4ZM4clTUKP7WmVMIggE1ItCyA9fgDtyA3jb0lsXh17KZmuhIU2PlfIObOzC+yTN7cT5fFhvFuSCM86LRfPkFYWTLjeJcMUW2RDiz5UaRLRFG2bpRbfx9qnE5zbJ1o6ktP+FsakvG6ZQV30x+wunESp1qauJyurfCOJxOxlaY/0lwNM6E8T0d3mXC+J7atwthvE83C2G8T9cLYVxOo1QY39PBKBXG+zRMhcH+MBHG5XSVCON72hskwmB3kAjjfeobYXxPO30jzF+fekYY31OrZ4TxPnWNMA6noGuEQdAxwiDovLwyCLpmxaA9zFcM3hWhqqo3BgCeFfCkgEcFPChgpoBLBVwo4FgBLQVsK2CL+QCy7QK4lrxVhAAAAABJRU5ErkJggg==","w":9,"h":109,"scaleX":true,"scaleY":false},{"url":"data:image/png;base64,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","w":218,"h":109,"scaleX":true,"scaleY":false},{"url":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAABtCAYAAACRKFAlAAAEyklEQVRYhd3Sy28TVxgF8MM70MI49vg1foc2KiotSRzbcezEGD8SwmNRumhVtaJSF4hF/4BKpQgpD4+dcRwnkNBSNUiVUNdlQyrBUDVDOiGXiUq649GKVmlRFmxJfLvwTRloBc6Kka80u/npnPt9F/6eoubvKZLAwbIa6DurNB2ZlHcf/WaaLP52l1JKL168eApAEEAzAAGACcB2+LOS5ssWSaB3VPUfPKsEDk3Ku49+/WLoY9DXO6r6e8eVwKFJucmgMC1pvkyR+LJV6O9bJ/RmR1Ufg4HDhoSe/8CJGmGqoHkzReLNjKq+LIOHLhgSHiho3nSReNMjqi9bVvwHa4TuAwXNm5aIJz2i+jJlxd9jaOhOVaEnU1a8PROyr+/CNLn9AuhKFjRXUiKe1IjqSZcVT3ZC9vVemJ43IsxrrqRE3Kmi6k6XFU9mQvbWG0zkNSFRIO5kUXWlRhV35pzs7fmyrqDQLWpCokCE/ZLqSpYUd2pc9tQZdHSJmjNRIM6EpArJkiKkxmVXtr6gPS5qzu48cSQkVUiUFGdyXBbS5+sPxvPE0a2DqTqDMVGzx0TiiEuqo7ukOBNjspCcnJ7/5b7xYE6zd4rEERteH7RFn0B7fERxdI/Jwn7DQlunSOydDHaNyc5ELbAjp1kZtMWewJsGhVGRWHXQXgu0RgYZzKu22IhiMziMiMQaZTA2Jtu71gH5aF61dVahzZiQjwxqfFgkfCSvWjslxdpZlm3xczXA8KDGh3PEEsmr1g5J4dfgguGgWQct64MDmjmUI5awqFo6hhU+WpL5+FlDwnYGQ6JqiTAYqwE2Bp9Ac3hY4SMlmY8aEpqCA5oplCNmBs2RkmyuN9g2oJmCQ8TcLqrm0LBiDpdkc8fLgHML9+88BzY8BRtD0kwVnrvyYtg6oHHBoXmOQVOoJJsjLxNOTU19vi5478HDJUopPXPmzEkGXwfg1MF+jWsbnOfacmpjuzRjCpWuCYnz0ysrqyuVSmXF4/H0AGgF8BqDHIODt6ow/3Nj+/BPplDp2juffn+DUkqXl5fvAEgAaAGwG4DjaRjM3TQFxdkqLF/96rv5RUopXVxcvAKgC8DbAJoA2AHsArANXMsA4dqG5rhg/kZjcOTH/R9dUh4/XnlMKaWiKH4GIAZgLwA/ACuAnQC2gmsZnOdacyrXNqzw4dHrd+/98SellC4sLFwF0AsgAmAPAC8AHsCrALaAaxua41oLs67usZkfrs/dppTSR48eLTc3N38IIKVbhQtAI4AdVdgqzh47MaX+9ffDZUopXV1dXTl9+vQQgCPsfvt09+MAbAewGXO3fv29UqlUKKV0aWnpwfHjx78A8C6ADIDwMzV3AtgGYBNYyurly5evcBx3AsB7APpYWgvbn8BqvgJgK4CN6O/v/zYajZ4C8AmA91nFJIB2XZqVraEBwGYAGwDgJICPWdIRAAfYJPcCCLCl69M2rcEPABxj9ZIMvcVeigDAwlawlrYR7Bxmg+hi9d5kyMUGsotNcos+DQDibHr7ALzB6gk6tENX8d80oPoO97AUL7uT5Rm0VnGDHjYx4GTTM7E7bX8eAqovgmeT28Wm16C70/8ioPqMdrJaDbqU5yKwStvWA9aO/ueawNrZoPtqPv8AklaxurvwKHsAAAAASUVORK5CYII=","w":14,"h":109,"scaleX":false,"scaleY":false}]],"lastScaleX":3,"lastScaleY":1},
            };
		]]>
    </Script>
	<Properties>
		<PropertyGroup name="Colors">
			<Property name="fillColor" type="Color" displayName="Background Color">#FFFFFFFF</Property>
			<Property name="strokeColor" type="Color" displayName="Border Color">#000000ff</Property>
			<Property name="strokeStyle" type="StrokeStyle" displayName="Border Style">1|</Property>
		</PropertyGroup>
		<PropertyGroup name="Text">
		    <Property name="defaultTextFont" type="Font" displayName="Default Font">Helvetica|normal|normal|14px</Property>
		    <Property name="defaultTextColor" type="Color" displayName="Default Text Color">#000000ff</Property>
		</PropertyGroup>
    </Properties>
	
	<Shortcut displayName="Text" icon="Icons/rich-text.png" to="Evolus.Common:PlainTextV2">
        <PropertyValue name="textColor"><E>$$defaultTextColor</E></PropertyValue>
		<PropertyValue name="textFont"><E>$$defaultTextFont</E></PropertyValue>
		<PropertyValue name="fixedWidth">false</PropertyValue>
    </Shortcut>
    <Shape id="button" displayName="Button" icon="Icons/normalButton.png">
		<Properties>
			<PropertyGroup>
				<Property name="box" type="Dimension">60,23</Property>
				<Property name="status" displayName="Status" type="Enum" p:enumValues="['normal|Normal', 'hover|Hover', 'blue|Blue', 'white|White', 'green|Green', 'red|Red', 'halfGraBlue|Half Gradient Blue', 'halfGraBlue1|Half Gradient Blue 1', 'halfGraBlack|Half Gradient Black']">normal</Property>
			</PropertyGroup>
			<PropertyGroup name="Border">
				<Property name="strokeStyle" displayName="Style" type="StrokeStyle"><E>$$strokeStyle</E></Property>
			</PropertyGroup>
			<PropertyGroup name="Text">
				<Property name="textContent" displayName="Text Content" type="PlainText"><![CDATA[Button]]></Property>
				<Property name="textFont" displayName="Default Font" type="Font">Helvetica|bold|normal|11px</Property>
				<Property name="textColor" displayName="Color" type="Color">#FFFFFFFF</Property>
				<Property name="textAlign" displayName="Alignment" type="Alignment">1,1</Property>
			</PropertyGroup>
		</Properties>
		<Behaviors>
			<For ref="stop1">
				<StopColor>
					if($status.value == 'normal') Color.fromString("#63687ccc");
					else if($status.value == 'hover') Color.fromString("#d4daecca");
					else if($status.value == 'blue') Color.fromString("#aec0e8ff");
					else if($status.value == 'white') Color.fromString("#00000000");
					else if($status.value == 'green') Color.fromString("#bfd9b1ff");
					else if($status.value == 'red') Color.fromString("#e7d0d1ff");
					else if($status.value == 'halfGraBlue') Color.fromString("#5b8ae5ff");
					else if($status.value == 'halfGraBlue1') Color.fromString("#8ea4c1ff");
					else if($status.value == 'halfGraBlack') Color.fromString("#6a6e71ff");
				</StopColor>
				<Offset>0</Offset>
			</For>
			<For ref="stop2">
				<StopColor>
					if($status.value == 'normal') Color.fromString("#262628cc");
					else if($status.value == 'hover') Color.fromString("#41475682");
					else if($status.value == 'blue') Color.fromString("#2158c7ff");
					else if($status.value == 'white') Color.fromString("#e6e6e6ff");
					else if($status.value == 'green') Color.fromString("#439e03ff");
					else if($status.value == 'red') Color.fromString("#c51722ff");
					else if($status.value == 'halfGraBlue') Color.fromString("#1f56c6ff");
					else if($status.value == 'halfGraBlue1') Color.fromString("#4a6c9bff");
					else if($status.value == 'halfGraBlack') Color.fromString("#262b2bff");
				</StopColor>
				<Offset>1</Offset>
			</For>
			<For ref="linearBgFill">
				<Attr>
					<Arg>"y2"</Arg>
					<Arg>
						if($status.value == 'halfGraBlue' || $status.value == 'halfGraBlue1' || $status.value == 'halfGraBlack') $box.h / 2
						else $box.h
					</Arg>
				</Attr>
			</For>
			<For ref="rrRect">
				<Box>$box.narrowed($strokeStyle.w % 2 == 0 ? 0 : 1)</Box>
				<Transform>[translate(($strokeStyle.w % 2 == 0 ? 0 : 1), ($strokeStyle.w % 2 == 0 ? 0 : 1))]</Transform>
			</For>
			<For ref="text">
				<TextContent>$textContent</TextContent>
				<Font>$textFont</Font>
				<Fill>$textColor</Fill>
				<BoxFit>
					<Arg>Bound.fromBox($box, 0)</Arg>
					<Arg>$textAlign</Arg>
				</BoxFit>
			</For>
			<For ref="bgMain">
				<StrokeColor>
					if($status.value == 'normal' || $status.value == 'hover') Color.fromString("#b2b2b2bf");
					else if($status.value == 'blue' || $status.value == 'disable' || $status.value == 'green' || $status.value == 'red') Color.fromString("#9e9e9eff");
					else if($status.value == 'halfGraBlue') Color.fromString("#0f2a60ff");
					else if($status.value == 'halfGraBlue1') Color.fromString("#375073ff");
					else if($status.value == 'halfGraBlack') Color.fromString("#383838ff");
				</StrokeColor>
			</For>
			<For ref="bgCopy">
				<Fill>($status.value == 'halfGraBlue' || $status.value == 'halfGraBlack') ? Color.fromString("#575757ff") : Color.fromString("#9cabc0ff")</Fill>
				<StrokeColor>($status.value == 'halfGraBlue' || $status.value == 'halfGraBlack') ? Color.fromString("#575757ff") : Color.fromString("#9cabc0ff")</StrokeColor>
				<Visibility>($status.value == 'halfGraBlue' || $status.value == 'halfGraBlue1' || $status.value == 'halfGraBlack')</Visibility>
			</For>
		</Behaviors>
		<p:Content    xmlns:p="http://www.evolus.vn/Namespace/Pencil"
								xmlns="http://www.w3.org/2000/svg">
			<defs>
				<linearGradient x1="0%" y1="0%" x2="0%" y2="100%" id="linearFill">
					<stop style="stop-color:#63697d;stop-opacity:0.8" offset="0" id="stop1"/>
					<stop style="stop-color:#262628;stop-opacity:0.8" offset="1" id="stop2"/>
				</linearGradient>
				<linearGradient
					xlink:href="#linearFill"
					id="linearBgFill"
					x1="0"
					y1="0"
					x2="0"
					y2="80"
					gradientUnits="userSpaceOnUse" />
				<rect
					width="60"
					height="24"
					rx="4"
					ry="4"
					x="0"
					y="0"
					id="rrRect" />
				<filter
				   id="shadingFilter"
				   height="1.2558399"
				   y="-0.12792"
				   width="1.06396"
				   x="-0.03198">
					<feGaussianBlur stdDeviation="1" in="SourceAlpha"/>
				</filter>
			</defs>
			<use id="bgCopy" xlink:href="#rrRect" transform="translate(0, 1)" style="stroke-width: 1px; stroke:#575757; fill: #575757; fill-opacity:1;"/>
			<use id="bgMain" xlink:href="#rrRect" style="stroke-width: 1px; fill: url(#linearBgFill); stroke:#b2b2b2; stroke-opacity:0.8;"/>
			<text id="text"/>
		</p:Content>
	</Shape>	
	<Shortcut displayName="Hover Button" icon="Icons/hoverButton.png" to="button">
        <PropertyValue name="status">hover</PropertyValue>
    </Shortcut>
	<Shortcut displayName="Blue Button" icon="Icons/blueButton.png" to="button">
        <PropertyValue name="status">blue</PropertyValue>
    </Shortcut>
	<Shortcut displayName="Green Button" icon="Icons/greenButton.png" to="button">
        <PropertyValue name="status">green</PropertyValue>
    </Shortcut>
	<Shortcut displayName="Red Button" icon="Icons/redButton.png" to="button">
        <PropertyValue name="status">red</PropertyValue>
    </Shortcut>
	<Shortcut displayName="White Button" icon="Icons/whiteButton.png" to="button">
        <PropertyValue name="status">white</PropertyValue>
    </Shortcut>
	<Shortcut displayName="Gradient Blue Button" icon="Icons/halfGraBlueButton.png" to="button">
        <PropertyValue name="status">halfGraBlue</PropertyValue>
    </Shortcut>
	<Shortcut displayName="Gradient Dark Blue Button" icon="Icons/halfGraBlue1Button.png" to="button">
        <PropertyValue name="status">halfGraBlue1</PropertyValue>
    </Shortcut>
	<Shortcut displayName="Gradient Black Button" icon="Icons/halfGraBlackButton.png" to="button">
        <PropertyValue name="status">halfGraBlack</PropertyValue>
    </Shortcut>
	
	<Shape id="buttonV2" displayName="Button" icon="Icons/buttonV2.png">
		<Properties>
			<PropertyGroup>
				<Property name="box" type="Dimension">54,23</Property>
			</PropertyGroup>
			<PropertyGroup name="Border">
				<Property name="strokeStyle" displayName="Style" type="StrokeStyle"><E>$$strokeStyle</E></Property>
			</PropertyGroup>
			<PropertyGroup name="Text">
				<Property name="textContent" displayName="Text Content" type="PlainText"><![CDATA[Send]]></Property>
				<Property name="textFont" displayName="Default Font" type="Font">Helvetica|bold|normal|11px</Property>
				<Property name="textColor" displayName="Color" type="Color">#FFFFFFFF</Property>
				<Property name="textAlign" displayName="Alignment" type="Alignment">1,1</Property>
			</PropertyGroup>
		</Properties>
		<Behaviors>
			<For ref="linearBgFill">
				<Attr>
					<Arg>"y2"</Arg>
					<Arg>$box.h/2</Arg>
				</Attr>
			</For>
			<For ref="rrRect">
				<Attr>
					<Arg>"rx"</Arg>
					<Arg>$box.h/2</Arg>
				</Attr>
				<Attr>
					<Arg>"ry"</Arg>
					<Arg>$box.h/2</Arg>
				</Attr>
				<Box>$box.narrowed($strokeStyle.w % 2 == 0 ? 0 : 1)</Box>
				<Transform>[translate(($strokeStyle.w % 2 == 0 ? 0 : 1), ($strokeStyle.w % 2 == 0 ? 0 : 1))]</Transform>
			</For>
			<For ref="text">
				<TextContent>$textContent</TextContent>
				<Font>$textFont</Font>
				<Fill>$textColor</Fill>
				<BoxFit>
					<Arg>Bound.fromBox($box, 0)</Arg>
					<Arg>$textAlign</Arg>
				</BoxFit>
			</For>
		</Behaviors>
		<p:Content    xmlns:p="http://www.evolus.vn/Namespace/Pencil"
								xmlns="http://www.w3.org/2000/svg">
			<defs>
				<linearGradient x1="0%" y1="0%" x2="0%" y2="100%" id="linearFill">
					<stop style="stop-color:#a2baea;stop-opacity:1" offset="0" id="stop1"/>
					<stop style="stop-color:#3475c5;stop-opacity:1" offset="1" id="stop2"/>
				</linearGradient>
				<linearGradient
					xlink:href="#linearFill"
					id="linearBgFill"
					x1="0"
					y1="0"
					x2="0"
					y2="12"
					gradientUnits="userSpaceOnUse" />
				<rect
					width="60"
					height="24"
					rx="12"
					ry="12"
					x="0"
					y="0"
					id="rrRect" />
			</defs>
			<use id="bgMain" xlink:href="#rrRect" style="stroke-width: 1px; fill: url(#linearBgFill); stroke:#3a66a3; stroke-opacity:1;"/>
			<text id="text"/>
		</p:Content>
	</Shape>
	<Shape id="cicleButton" displayName="Circle Button" icon="Icons/banButton.png">
        <Properties>
			<PropertyGroup>
				<Property name="type" displayName="Type" type="Enum" p:enumValues="['ban|Ban', 'checked|Checked', 'clear|Clear', 'add|Add', 'next|Next']">ban</Property>
			</PropertyGroup>
		</Properties>
		<Behaviors>
			<For ref="ban">
				<Visibility>$type.value == "ban"</Visibility>
			</For>
			<For ref="checked">
				<Visibility>$type.value == "checked"</Visibility>
			</For>
			<For ref="clear">
				<Visibility>$type.value == "clear"</Visibility>
			</For>
			<For ref="add">
				<Visibility>$type.value == "add"</Visibility>
			</For>
			<For ref="next">
				<Visibility>$type.value == "next"</Visibility>
			</For>
		</Behaviors>
		<p:Content xmlns:p="http://www.evolus.vn/Namespace/Pencil"
									xmlns="http://www.w3.org/2000/svg" >
			<image id="ban" width="24" height="24" x="0" y="0" xlink:href="data:image/png;base64, iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAN1wAADdcBQiibeAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAO4SURBVEiJvZbfS1tnHMY/SWNST5LiKuJWM380hWpqBEfS9iiChTK24aUkUsbuejOoZJf7A8pGEDaVQVfBi7ELyY3dkHaIA+lqw5as0obVKMYkEnUyrGkSTzyxybsLT4ruR2dk2wMvL+fwns/zni/nfJ9XJ4TgoHQ6nQ4wACbAApzSZgk4qS3bBRQgB2S0WQVeiD8AdQevdTqdHqgCrMDrnZ2drQMDAz2tra1tLS0tLU1NTWcAksnkejwej0ej0YWJiYkf5ufno8CvQBbYE0KUXkKFEGgmeqAaeBPo8fv9t7LZ7I74B2Wz2R2/338L6NGerQb0Za5OCFEuixF4Q5blrpGRkY9dLlc7gJpaIx9bQU2lUFNrAJhsDZhsNqrtZzHZGgAIh8ORwcHBT4PB4ENgAygIIUTZwADUdnd3905NTY3V1NRYS2qBZ3fvkfnxJ16lU5cucvq9d9GbjKTT6WxfX9/1ubm5WWBLCPFCp5XGArSFQqExl8vlVNfW2fzqa/aebb8SXlbV6deo/+B9TA1nCIfDEbfbfR1YAHIn2P9i6oeGhj7s7+/vK6kq6198yd7WFghxpFFUFPKLS5y65KahsbHearUWpqen58sGkizLncPDw58Yjcaq3ya/QVlcOjL8oEkpn8d8wUFHR8eF2dnZ71Op1LoekDwez1WLxSLtJld5fv8BFIvHGs/vP2A3uYrFYpE8Hs9VQDIAkt1u7wBQokuIYulvKn00KdElTjY1ojElA1Dd3Nx8FiAfjyOKRaS280jn7JWBl2MoC4vk43EANGa1ATCV/9B8LI4olZBaz1P7ztuVbf27aXZ+WSAf2zfQmCbDoV38HKSwuUnN5bcqgwN7a6vkHs5irK8/dN8AqMlkct3pdJ4zO50UNjfJBIOUVLUig9yjRwCYnU5gv18BqgHIJxKJlbLB9swMmWCQTDBY8VscNEgkEitAXg8osVjsCYD1snws6EGVGRpT0QNKIBCYyeVyirm9nTqv99jwOq8Xc3s7uVxOCQQCM4ByAhCpVKpQW1tr7urqclvdF9m+d5diJlMR3GSzYR8ZRV9Vxejo6Nj4+Pi3wPZfNjvl6VNiH/lQU6mjwz/7HMnh+FOz02vpowAJn893M51OZyWHA8fknSOVq87rxTF5B8nhIJ1OZ30+300gAShCiFI5zXTsZ3CzLMvXQqFQpJxYuUhEbIzdFsuDN8TjK73i8ZVesTx4Q2yM3Ra5yMtlIhQKPZFl+RrQrLH24/h/icyy/ovQP2Sgmfyrx5bfAU8EiRyeMulMAAAAAElFTkSuQmCC" />
			<image id="checked" width="24" height="24" x="0" y="0" xlink:href="data:image/png;base64, iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAN1wAADdcBQiibeAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAR6SURBVEiJvZbvT1NnFMc/90Jb+4upleAABSRZsCIJS1GLM9HEZNHxkoEj0yUzLhsLrLrEzT/AbCEmm5AlTjZfLFskJIvOGJc5TJjKyNYaokytHaXUVH5MwUrrLS3tffaitw0dgm+2neTkyfPc53y+95577nOuJIRgoUmSJAH5gAGwAAXaaAJWaNvmAAWIArPaGAeS4h9AaeFckiQZ0AFWYG1tbW3Vvn37dlRVVW2sqKioKCsrKwYIBoPjgUAg4PV67/b09FwbGhryApNABJgXQqhZqBACTUQGjMA6YEdHR8epSCTyVDzHIpHI046OjlPADi3WCMgZriSEyKRFD7zodDrrOzs7jzkcjmqAeOgBMf8o8VCIeOgBAIbSEgylpRgrN2AoLQHA4/EMt7e3fzo4OPgrMAEkhBAiI5AP2LZv377z4sWL3StXrrSq8QQzl35k9rffWc4Ktm5h9d49yAY94XA40tDQcGhgYKAfmBZCJCUtNRZgo9vt7nY4HJvjD8aZ+uZb5mceLwvPmG71KooOvImhpBiPxzNcV1d3CLgLRPNIV0zRiRMnWhsbGxvUeJzxL75kfnoahFjW9YVrkPV65qenid3zUbC1jpL164usVmvi8uXLQxkBk9PprD158uQner1e9/DcDyj3fM+F55nNlLz/Li+8Uk9sxE98YgI1FsO8yU5NTc2m/v7+K6FQaFwGTE1NTbstFotpLnifJ1evQyq1rEuyRPHBt9DZbORZLBS/cxA5P58nV68zF7yPxWIxNTU17QZMMmCqrKysAVC8PkRKXd5VQVHLG6yoqMjUOVPf9ZBSYoiUiuL1AaAxTTJgLC8v3wAQCwQQqVTW81etAlnOWbO9tger4+XsC374/XkiN4ay12OBAAAa0ygDhswXGvMHEKqKUFVko5F1h9tY/+EH5BVYEapKwbYt2Pa+moWHf7nG9E8/Z2OEqhLzpwU0piF/YbkpNwZJTE2BLPPS6W50a2zo1tgoO3qEya+/Yu3+luze2YHr+NtaEalUTsnqi4py5jIQDwaD4wDmzZvTq6pK+EofIplM13lhIes+PoaUn76fmM+H/8iRRfCFDI0Zl4HY2NjYaI4A8NfZs/gOvk1yZiYHMP/oEX+2vkcqGl0EX8jQmDEZUPx+/y0A6zZnzuaIx8Od1xtRbt9OP9jcHCOtrSQmJp4JX8jQmIoMKL29vX3RaFQxV1dT2NycE5CYnMR7YD/TFy4Q+OgoT2//sSS8sLkZc3U10WhU6e3t7QOUPECEQqGEzWYz19fX11nrtvD4x0ukZmezgSKZJHylj7nR0SXhhtJSKju7kHU6urq6us+cOXMBePzMw065cwf/YRfxUGhJ4CL4Z59jstsXHXay1n0UYMzlch0Ph8MRk92O/dz5RelaKi32c+cx2e2Ew+GIy+U6DowBihBCzXQziXQPLnc6nS1ut3s407Giw8Niovu0GGlvEzd37RQ3d+0UI+1tYqL7tIgOZ7cJt9t9y+l0tgDlGivdjv+Xlpmx/6Lp5whoIv/qb8vfT3j0JvOdkNQAAAAASUVORK5CYII=" />
			<image id="clear" width="24" height="24" x="0" y="0" xlink:href="data:image/png;base64, iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAN1wAADdcBQiibeAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAASSSURBVEiJvZZdTFNnGMd/LYVKaQFF0w2qFLkQK5KQUOCAJrq4JTNcSKLU6LIsWbxZIukud6EXGrOFkDggS5wkZn4sMb0pW4wmxBl0YHVlYcqmlYi0poAEtYUeWw7QvrvoOZWKcTfb/snJyfv1+5/3eT+eoxNCsFI6nU4HGAAjYAYK1bcJWKN2WwDigAzMq28FWBZvAHUryzqdTg/kAhbgvdra2qqDBw/urKqq2lpRUVFRXl5eChAKhaYmJiYmAoHAw8uXL/86MjISAJ4BMWBJCJHKQIUQqCZ6IB/YCOzs6Og4E4vFXol/UCwWe9XR0XEG2KmOzQf0GlcnhNDCkge8L0lSU3d391d1dXXVAEp4ksT4E5RwGCU8CYDRVobRZiO/cjNGWxkAw8PDo+3t7d/4fL7bwDSwKIQQmoEBKGlubt515cqV3uLiYktKWeTl1WvM3/2Nd6mwoZ51ez9Gb8wjGo3GWlpajgwNDQ0AL4QQyzo1NGZgq9/v762rq9uuTE4xc+ESSy8j74Rryl23Fuunn2AsK2V4eHjU6XQeAR4Ccg7pHWPt7Oz8Yv/+/S0pRWHqu+9ZevECXU4ORc0SC6GnkEqBEK8foHhHE0p4kqQsk3g0RmGDk7JNm6wWi2Wxv79/RDMwSZJU29XV9XVeXl7urPcn4o/G0BlyKP38M4p2NGMoLkb+868suNV1gLV7PmDNRhuxP+6RlGVSiQQF2xzU1NRsGxgY+CUcDk/pAVNbW9ses9lsWgg9Ze7WICSTFDU2YKraosbZidV1ID2LVAqr6wCFDU4ATFVbKGpsgGSSuVuDLISeYjabTW1tbXsAkwEwVVZW1gDEA2OIZHoLR27cxFhaSqHUkDZprM98fWFjfSb+8767RG7czLTFA2OsKd+EyjQZgHy73b4ZIDExgUgmM4Onz19CCEFRU2MarJppmrt9h2cXfszANQaAysw3AEbthCbGJxCpVBZk+oeLIARFzVI2fMjH9PlLWXCNAaAyjYaVjfHffSzOzGQNQK9nae+HvKml2WfIvpvpdVmhPKs1ezighEKhKYCC7dtXwe0nTrJ+375VBuv3tWI/cRL0+qx6jaEyFT2QCAaDT1YZaPDW1kzV874+nvd5X5u0rjbRGCozYQDi4+Pj94GPLI0ScBoA6+HD2XCvl+DxY+mCINO2vrWVxKMAMxcvApBmgMqM64G4x+O5LstyvKC6mg0uFwCzHg/zQ4PZcPUcBI8f47k3PZP5oUFmPR4ANrhcFFRXI8ty3OPxXAfiOYAIh8OLJSUlBU1NTU6Ls57ItassRyJE+vtZjkSY7O7KXkwhiA4MkJyfI9zZSUpRMNpsVHb3oM/Npaenp/fcuXM/A5G3XnbxBw8Y/9KNEg6vWty3yWizUXn6W0wOx6rLTq9mnzgQdLvdp6LRaMzkcODw9mXC9S5tcLlwePswORxEo9GY2+0+BQSBuBAipWUzHekcbJck6ZDf7x/VMpY8Oiqme8+Kx+1Hxb3du8S93bvE4/ajYrr3rJBHM92E3++/L0nSIcCustLp+H9JmZr+i6SfZaCa/Ku/LX8Djwi3Muc34/AAAAAASUVORK5CYII=" />
			<image id="add" width="24" height="24" x="0" y="0" xlink:href="data:image/png;base64, iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAN1wAADdcBQiibeAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAQGSURBVEiJtZZdSBxXFIC/2azdn+ymUg1K1F2ttpqE3SDVhlFs+xAKhS2Bojb1KRSCJA99zotvhRbxqdAmEh/ykjbxobQgKawJlFYjySZsYozRstGd6opWTVZnnf2f2wfHjZOYitAcuHPncs79zr1nzr1nJCEE20WSJAmwAjbABRwweidgN8xSgAYkgHWjTwM58QJQ2j6WJMkCFAFuoLyxsbHh1KlTbQ0NDYdrampqvF7vIQBFURZmZ2dnp6amHl+9evXPcDg8BSwCKpAVQugFqBACw4kFcABVQFtvb+9FVVU3xC6iqupGb2/vRaDNmOsALAWuAZeMkFTLstwVCoUebgGU5YwYHlfFwM2noufakui5tiQGbj4Vw+OqUJYzBUehUGhcluUuoNpgSUII4yFJVqCktbX1o6GhoUvFxcXudFbn5zsqf0xt8F/yQcN+Pnvfja3IQjweVwOBwJnR0dHfgVUhRE4yQuMCDodCoUtNTU0+ZSXLD8FVVtRcAXSkwsaRys1vPDmfYjKWLuhK3VbOfVyCt7SIu3fvPmxubj4DPAYS+4yMKevr6zvX3t4eSGV1vvllmaW1HLpOobXU7+fT9w7wTrmNpbU8j+ZSBV0ipTMxl+LDI/vxVFWUud3uTDAYDAMJC2CTZbm+u7v7NMCVkTixZ1kyeWFqef15tuV18ZI+9izLlZE4AN3d3adlWa4HbBbA2dnZecLlcjkjixmuh1WyOfFS058nHrrOjjbXwyqRxQwul8vZ2dl5AnBaAWdtba0f4H40SSZnPnjbV23awSvs7keT1JW/gcF0WgFHdXX12wCTsRTZnKCxxsHRSrtp4tEqu+n9c7nYpH80nyI8m2QylgLexGA6rIBt64ROzKXJ5AV+r50vWsyA7eL32PF7zAv46Vac2xGNibnN7DKYNut2o9jTLEtrOdY1nb3Kuqbz90qWdNYcOiuQVhRlwefz1R3z2gmOJ7j11wbpF2J8vM7J8ToHALcjSW5HNJP+3szm+Jh3c2eKoiwAaSuQjEajMz6fr87vdRAcTzA6rTE6bQZ89UnpNgca3/22suNO/N5Nm2g0OgMkLYD25MmTcYCWd517CstOssUwmJoF0AYHB28kEgnN77HT1frqj7ubdLUW4/fYSSQS2uDg4I0tB+mxsbHp/v7+ywDnTx6ksqRoz/DKkiLOnzwIQH9//+WxsbFpIL3P0OeDweBCIBA47vVUlDXXOhiZ1lhPPs8m6z74Zy3PvZkkdyIac6tZE/z7Lw9R8dbmZdfR0fE1MAekX3lda2mdb39d5sfR+K5hOX/yIE7bztf1rgXngZIUF4ZXxdmBedHSExEtPRFxdmBeXBheFQ+U5K4F57WXzNde9E0ODCf/62/Lv4AS0N7biU0dAAAAAElFTkSuQmCC" />
			<image id="next" width="24" height="24" x="0" y="0" xlink:href="data:image/png;base64, iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAN1wAADdcBQiibeAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAQASURBVEiJtZZdTBxVFMd/M2XZD3bt6lIx0AIrxoDVVRQ0C6KNtqSJJEZDkKBPGmKKvtYYExLfaggvhChNICRNtKH7YERJH6AkWMOLSwqlWDCFwpblY8M3s+z3zvWhs8vS5cNEe5IzN3fm3N9/cu6dc0YSQpBqkiRJQAagB8zAE9poAgxaWAgIAH5gWxvDQEw8ApRS55IkyYAOsADPlJaWFtfX11cVFxeX2O12e0FBQS6Ax+NZnJ2dnZ2amprs6en5Y3R0dApYBhQgKoRQk1AhBJqIDBiBU0BVS0vLZUVRdsQRpijKTktLy2WgSltrBOQkV4NLWkoKnU5ng9vtvpMAeFYiYmBcEV2D66L5mk80X/OJrsF1MTCuCM9KJCnkdrvHnU5nA1CosSQhhHaRpAzAVllZeaavr6/TarVawlGVn/9UuDm1w2H2VnEWH75uQa+T2dzcVGpqahqHh4eHgDUhREzSUmMGStxud2dZWdlLntUoP/SvsarEkiCTXqY4V8+t2WCaSLYlg6ZqGwXZOkZGRu6Ul5c3ApOA/5h2YnJaW1ubamtra0JRlUu/rODbiqGqoKpg0MlcrDnBOYeFVSXGfV8k+UxVwR9SmZgP8fYLWeSfysuxWCyR/v7+0YSAyel0lra1tV3KzMzUXbm5wZgnRFyQ9E+qnuQ1uxEJKLUbWVXiTPsie2KUkMpOWOVVuxGHw3F6aGho0Ov1LsqAqa6u7qzZbDZNL0e4PqoQjYk9fuX3De4thUmchsZ3n+JMSVZa3PVRhenlCGaz2VRXV3cWMMmAqaioyAEwNhckEhNpvrkTp9nl4+8Ukc/P2XjnRXNa7Njcwz3SmCYZMBYWFj4LcHchlPZWCd/cifPN1WWmFndFmqptVDvMe+LuLoQA0JhGGdAnvtCJ+TCRuDjQNwJxLv64xOTCrsiX57M5/4olGTMx//CZxtRnpB63hfUovq0Yh5kkwfiDECV5+qSI/elMHqxGAQhH99Y2GQh7PJ5FgJcLDBxmkgTf1ubwkfN48l7vyDZf/bSUnCcYGjMsA8G5ubn7AI4C45Hwj9+0psHju6UtydCYQRkIzMzMjANUPG/6T/BUhsYMyEDA5XLd8Pv9AUe+gYZKK4/ae6WWfwVvqLTiyDfg9/sDLpfrBhA4Bgiv1xux2WxZFRUV5W88Z+K3Wwrbwd3V95Yj2MwZOPINB8JP2nR0fJaHLkOivb29s7u7+1dgY99i95c3xBfdi3jXonvS9EH5cXpHtvaFf/9pLqdPGtKK3YHlOhBW+a53havDm/vuS2pavn7/BCb9/uX6yIZz2xMUHQNr4kKXV1Q0T4uK5mlxocsrOgbWxG1P8MiG89hb5mNv+nsENJH/9bflH1Q5EtZgrifkAAAAAElFTkSuQmCC" />
		</p:Content>
	</Shape>
	<Shortcut displayName="Checked Circle Button" icon="Icons/checkedButton.png" to="cicleButton">
        <PropertyValue name="type">checked</PropertyValue>
    </Shortcut>
	<Shortcut displayName="Next Circle Button" icon="Icons/nextButton.png" to="cicleButton">
        <PropertyValue name="type">next</PropertyValue>
    </Shortcut>
	<Shortcut displayName="Clear Circle Button" icon="Icons/clearButton.png" to="cicleButton">
        <PropertyValue name="type">clear</PropertyValue>
    </Shortcut>
	<Shortcut displayName="Add Circle Button" icon="Icons/addButton.png" to="cicleButton">
        <PropertyValue name="type">add</PropertyValue>
    </Shortcut>
	
	<Shape id="loading" displayName="Loading" icon="Icons/loading.png">
        <Properties>
		</Properties>
		<Behaviors>
		</Behaviors>
		<p:Content xmlns:p="http://www.evolus.vn/Namespace/Pencil"
									xmlns="http://www.w3.org/2000/svg" >
			<image id="loading" width="20" height="20" x="0" y="0" xlink:href="data:image/png;base64, iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAN1wAADdcBQiibeAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAANCSURBVDiNjVRNaBxlGH7e752Z1Wyy2kZSS9BIy0phW3KxoEjR3jwoQmFXKd4FITltfpYs+WaYSZaAJhcRkoN4VLDiz0FPBSsIPXiqJlgRfw4mJt22sZ1kszPf93rZDensVnxgYL7n+b7ne/9mICLIPr7ve0fXYRhuhWEovu8/2eUAUL+zChlEUfQqM18Pw/ClrNbFysrKo77vjwZBMJDVegwBjAI4SURBpVLhrEhElCTJMcdxeG9vr0fvMRwZGfkQwG8AzoyPj7+V1X3fH0qSxE3TNFlaWrrXc6GIoNFoXLDWXkjT9AOt9d0oil4B8JGINK21LzDzTQAnjDGjjuMwANVsNreXl5f319bW3J2dnZFcLne3Wq3GBIDCMPwMwCkAuyLyvrX2U2b+BIBnjJnwPG+/3W4zgNsAjgOwAG4BOM7Mx5iZ2u12S2v9J4kIgiB4hpmnAbzYqdPPuVxuulqt/t6nxpicnMwNDw+Pep7ntNttuK67WywWb5XLZUOdEQAARFH0MhFVReS+Meay1tr2MwSAIAie7rxua61bhzVcXV11Nzc3qUvk83k3juMhrfXWw8wAoFKpcKlU6umys729/bnjOG6XODg4AIBL/2UGAKVSSZRS53sMAdwXEe8omc/nJbuxH5RSBz2G9Xr9jaNEEAQqjuOeL6APHikUCjcmJiYeMH1gsBuNxhlmjpj57f8R3bnd3d2LURSdBnDYg+5gDxtj3gTwPAAQ0Vaapg2t9R0APenPzMwMDQ4OPktEJwHAWhu7rvtjrVbbIRGhhYWFd0VkhIhaxpgvReRrpdQlInqKiD4eGBi4bYxRY2NjycbGxkVmfjxN0yue5z1mrS2JSEEpdVAsFq+qTgRfAPiemafn5+e/chznBIDzIvIEM+/FcXy51Wq9s76+PqiUYhEZUEqdq9VqzXq9/h0R3UiS5KdyuWwcAJibm7sG4Fo3JWvt60REAL6dnZ29E0XRYbrMfD1N09eUUmenpqZuikgM4I++TQGAxcXFs0R0ioj+McZczeq1Wq0J4BcRcQqFwnM9zcoS1tp9AH8D+EZr3c7qnT0/ALhHRH9lNSdL1Ov1X4MgeE9r/dDh1lq3iOiKHP0RdPAvrsCKPLOMGiUAAAAASUVORK5CYII=" />
		</p:Content>
	</Shape>
	
	<Shape id="pageControl" displayName="Page Control" icon="Icons/pageControl.png">
        <Properties>
			<PropertyGroup name="Text">
				<Property name="textContent" displayName="Text Content" type="PlainText"><![CDATA[*..]]></Property>
			</PropertyGroup>
		</Properties>
		<Behaviors>
			<For ref="content">
				<DomContent>
                <![CDATA[
                    var items = $textContent.value.split("");
                    var specs = [];
                    for (var i = 0; i < items.length; i ++)
                    {
                        var item = items[i];
                        if(item == '.')
                        {                          							
							specs.push({
								_name: "circle",                            
								_uri: "http://www.w3.org/2000/svg",
								"cx": 4,
								"cy": 4,
								"r": 4,
								"transform": translate(15*i,0),
								style : "fill:#a6b4c6;stroke:#b8b8b8;opacity:1"
							});
                        } else if(item == '*')
                        {                          							
							specs.push({
								_name: "circle",                            
								_uri: "http://www.w3.org/2000/svg",
								"cx": 4,
								"cy": 4,
								"r": 4,
								"transform": translate(15*i,0),
								style : "fill:#ffffff;stroke:#b8b8b8;opacity:1"
							});
                        }
                    }
                    Dom.newDOMFragment(specs);
                ]]>
                </DomContent>
			</For>
		</Behaviors>
		<p:Content xmlns:p="http://www.evolus.vn/Namespace/Pencil"
									xmlns="http://www.w3.org/2000/svg" >
			<g id="content" />
		</p:Content>
	</Shape>
	
	<Shape id="backButton" displayName="Back Button" icon="Icons/backButton.png">
        <Properties>
            <PropertyGroup>
                <Property name="box" type="Dimension">60,23</Property>
            </PropertyGroup>
            <PropertyGroup name="Line">
                <Property name="strokeColor" displayName="Line Color" type="Color"><E>$$strokeColor</E></Property>
                <Property name="strokeStyle" displayName="Line Style" type="StrokeStyle"><E>$$strokeStyle</E></Property>
            </PropertyGroup>
			<PropertyGroup name="Text">
				<Property name="textContent" displayName="Text Content" type="PlainText"><![CDATA[Back]]></Property>
				<Property name="textFont" displayName="Default Font" type="Font">Helvetica|bold|normal|11px</Property>
				<Property name="textColor" displayName="Color" type="Color">#ffffffff</Property>
				<Property name="textAlign" displayName="Alignment" type="Alignment">1,1</Property>
			</PropertyGroup>
        </Properties>
        <Behaviors>
            <For ref="line1">
                <Transform>[translate(($strokeStyle.w % 2) / 2, ($strokeStyle.w % 2) / 2)]</Transform>
                <D>[M(10, 0), L($box.w - 10, 0),
					C($box.w, 0, $box.w, 0, $box.w, 10),
					L($box.w, $box.h - 12),
					C($box.w, $box.h - 2, $box.w, $box.h - 2, $box.w - 10, $box.h - 2),
					L(10, $box.h - 2),
					L(0, $box.h/2),z]</D>
            </For>
			<For ref="linearBgFill">
				<Attr>
					<Arg>"y2"</Arg>
					<Arg>$box.h / 2 + 1</Arg>
				</Attr>
			</For>
			<For ref="text">
				<TextContent>$textContent</TextContent>
				<Font>$textFont</Font>
				<Fill>$textColor</Fill>
				<BoxFit>
					<Arg>new Bound(7, -1, $box.w - 7, $box.h)</Arg>
					<Arg>$textAlign</Arg>
				</BoxFit>
			</For>
        </Behaviors>
        <p:Content xmlns:p="http://www.evolus.vn/Namespace/Pencil" xmlns="http://www.w3.org/2000/svg">
			<defs>
				<linearGradient x1="0%" y1="0%" x2="0%" y2="100%" id="linearFill">
					<stop style="stop-color:#8ea4c1;stop-opacity:1" offset="0" id="stop1"/>
					<stop style="stop-color:#4a6c9b;stop-opacity:1" offset="1" id="stop2"/>
				</linearGradient>
				<linearGradient
					xlink:href="#linearFill"
					id="linearBgFill"
					x1="0"
					y1="0"
					x2="0"
					y2="80"
					gradientUnits="userSpaceOnUse" />
				<path id="line1"/>
			</defs>
            <use xlink:href="#line1" id="bgCopy" transform="translate(0, 1)" style="fill: #9cabc0; fill-opacity: 1; stroke: #9cabc0;"/>
			<use xlink:href="#line1" style="fill: url(#linearBgFill); stroke:#30363e; stroke-opacity:0.8; stroke-width: 1px;"/>
			<text id="text"/>
        </p:Content>
    </Shape>
	
	<Shape id="textField" displayName="Text Field" icon="Icons/textfield.png">
		<Properties>
			<PropertyGroup>
				<Property name="box" type="Dimension">220,30</Property>
				<Property name="clear" displayName="With Clear" type="Bool">true</Property>
				<Property name="magnifier" displayName="With Magnifier" type="Bool">true</Property>
			</PropertyGroup>
			<PropertyGroup name="Border">
				<Property name="strokeStyle" displayName="Style" type="StrokeStyle"><E>$$strokeStyle</E></Property>
			</PropertyGroup>
			<PropertyGroup name="Text">
				<Property name="textContent" displayName="Text Content" type="RichText"><![CDATA[HTML Text Field]]></Property>
				<Property name="textFont" displayName="Default Font" type="Font"><E>$$defaultTextFont</E></Property>
				<Property name="textColor" displayName="Color" type="Color">#808080ff</Property>
				<Property name="textAlign" displayName="Alignment" type="Alignment">0,1</Property>
			</PropertyGroup>
		</Properties>
		<Behaviors>
			<For ref="rrRect">
				<Box>$box.narrowed($strokeStyle.w % 2 == 0 ? 0 : 1)</Box>
				<Transform>[translate(($strokeStyle.w % 2 == 0 ? 0 : 1), ($strokeStyle.w % 2 == 0 ? 0 : 1))]</Transform>
			</For>
			<For ref="text">
				<TextContent>$textContent</TextContent>
				<Font>$textFont</Font>
				<Color>$textColor</Color>
				<BoxFit>
					<Arg>$magnifier.value ? new Bound(27, 0, $box.w - 27, $box.h): Bound.fromBox($box, 10, 0)</Arg>
					<Arg>$textAlign</Arg>
				</BoxFit>
			</For>
			<For ref="clear">
				<Visibility>$clear.value</Visibility>
			</For>
			<For ref="magnifier">
				<Visibility>$magnifier.value</Visibility>
				<Transform>[translate(6, $box.h/2 - 9)]</Transform>
			</For>
			<For ref="circle">
				<Attr>
					<Arg>"cx"</Arg>
					<Arg>$box.w - 15</Arg>
				</Attr>
				<Attr>
					<Arg>"cy"</Arg>
					<Arg>$box.h/2</Arg>
				</Attr>
			</For>
			<For ref="x">
				<D>
					[M($box.w - 19, $box.h/2 - 4), L($box.w - 11, $box.h/2 + 4) , M($box.w - 11, $box.h/2 - 4), L($box.w - 19, $box.h/2 + 4)]
				</D>
			</For>
			
		</Behaviors>
		<p:Content    xmlns:p="http://www.evolus.vn/Namespace/Pencil"
								xmlns="http://www.w3.org/2000/svg">
			<defs>
				<linearGradient x1="0%" y1="0%" x2="0%" y2="100%" id="linearFill">
					<stop style="stop-color:#d1d1d1;stop-opacity:1" offset="0" id="stop1"/>
					<stop style="stop-color:#ffffff;stop-opacity:1" offset="1" id="stop2"/>
				</linearGradient>
				<linearGradient
					xlink:href="#linearFill"
					id="linearBgFill"
					x1="0"
					y1="0"
					x2="0"
					y2="10"
					gradientUnits="userSpaceOnUse" />
				<rect
					width="61"
					height="24"
					rx="8"
					ry="8"
					x="0"
					y="0"
					style="stroke-width: 1px; fill: url(#linearBgFill); stroke:#252b33; stroke-opacity:1;"
					id="rrRect" />
			</defs>
			<use xlink:href="#rrRect" />
			<foreignObject x="0" y="0" width="200" height="150" id="text">
				<div xmlns="http://www.w3.org/1999/xhtml">
				</div>
			</foreignObject>
			<g id="clear" >
				<circle id="circle" r="8" style="fill: #b4b4b4;"/>
				<path id="x" style="fill: none; stroke: #ffffff; stroke-width: 1px;"/>
			</g>
			<image id="magnifier" width="17" height="18" x="0" y="0" xlink:href="data:image/png;base64, iVBORw0KGgoAAAANSUhEUgAAABEAAAASCAYAAAC9+TVUAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAN1wAADdcBQiibeAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAGVSURBVDiNndM9aBRBFADgbwVFEpCU0YiFiFgIFldotAi293rRxkrU4B/YiFYiCJLWszcKxkqbmwWriEUqDQqKogERLGInRvEHcSxugktyZ9DXzJud4dv33rJVztlypJQ24iz2o4VhPME8rkfEe32iWkZSSntxE7v6XcRHnIuIWysP1hXgAOYKsIDj2I1tOIQHGMF0SunCqkq63e4QnmEHbuNERHxdeTGldAod/EArIp43KzlTgIVBAETEDdzBBkytbGe85FODgEZcKet4SqlqIq2Sz60BwGu9AY9gexMZLvnSWkJEZHwp26EmMr9c4lpISmkzxvANL5vI45JPNvscECfL+jQifjaRjl6fEzj/lyr24WLZXm2eVTlnKaWjmC7P7uEyXkTEr5TSVhzDJazH3Yg4sgopbzqNa/4M+hM+Y0vj/ne8q6pqot1uLzbbARHRwR7cxwdsKsASHuEw3mJnznm2ruvRVZX0mcFYqepN+bTquh7NOc/q/WOvqqo62G63Fwcig6If9M9IH+jhfyENaCbnPPkbjMyksPSGDfgAAAAASUVORK5CYII="/>
			
		</p:Content>
	</Shape>
	<Shortcut displayName="Simple Textfield" icon="Icons/textfield.png" to="textField">
        <PropertyValue name="clear">false</PropertyValue>
		<PropertyValue name="magnifier">false</PropertyValue>
    </Shortcut>
	
	<Shape id="textFieldV2" displayName="Text Field" icon="Icons/textfield.png">
		<Properties>
			<PropertyGroup>
				<Property name="box" type="Dimension">140,23</Property>
				<Property name="clear" displayName="With Clear" type="Bool">true</Property>
				<Property name="magnifier" displayName="With Magnifier" type="Bool">false</Property>
			</PropertyGroup>
			<PropertyGroup name="Border">
				<Property name="strokeStyle" displayName="Style" type="StrokeStyle"><E>$$strokeStyle</E></Property>
			</PropertyGroup>
			<PropertyGroup name="Text">
				<Property name="textContent" displayName="Text Content" type="RichText"><![CDATA[HTML Text Field]]></Property>
				<Property name="textFont" displayName="Default Font" type="Font"><E>$$defaultTextFont</E></Property>
				<Property name="textColor" displayName="Color" type="Color">#808080ff</Property>
				<Property name="textAlign" displayName="Alignment" type="Alignment">0,1</Property>
			</PropertyGroup>
		</Properties>
		<Behaviors>
			<For ref="rrRect">
				<Attr>
					<Arg>"rx"</Arg>
					<Arg>$box.h/2</Arg>
				</Attr>
				<Attr>
					<Arg>"ry"</Arg>
					<Arg>$box.h/2</Arg>
				</Attr>
				<Box>$box.narrowed($strokeStyle.w % 2 == 0 ? 0 : 1)</Box>
				<Transform>[translate(($strokeStyle.w % 2 == 0 ? 0 : 1), ($strokeStyle.w % 2 == 0 ? 0 : 1))]</Transform>
			</For>
			<For ref="text">
				<TextContent>$textContent</TextContent>
				<Font>$textFont</Font>
				<Color>$textColor</Color>
				<BoxFit>
					<Arg>$magnifier.value ? new Bound(27, 0, $box.w - 27, $box.h): Bound.fromBox($box, 10, 0)</Arg>
					<Arg>$textAlign</Arg>
				</BoxFit>
			</For>
			<For ref="clear">
				<Visibility>$clear.value</Visibility>
			</For>
			<For ref="magnifier">
				<Visibility>$magnifier.value</Visibility>
				<Transform>[translate(6, $box.h/2 - 9)]</Transform>
			</For>
			<For ref="circle">
				<Attr>
					<Arg>"cx"</Arg>
					<Arg>$box.w - 15</Arg>
				</Attr>
				<Attr>
					<Arg>"cy"</Arg>
					<Arg>$box.h/2</Arg>
				</Attr>
			</For>
			<For ref="x">
				<D>
					[M($box.w - 19, $box.h/2 - 4), L($box.w - 11, $box.h/2 + 4) , M($box.w - 11, $box.h/2 - 4), L($box.w - 19, $box.h/2 + 4)]
				</D>
			</For>
		</Behaviors>
		<p:Content    xmlns:p="http://www.evolus.vn/Namespace/Pencil"
								xmlns="http://www.w3.org/2000/svg">
			<defs>
				<linearGradient x1="0%" y1="0%" x2="0%" y2="100%" id="linearFill">
					<stop style="stop-color:#d1d1d1;stop-opacity:1" offset="0" id="stop1"/>
					<stop style="stop-color:#ffffff;stop-opacity:1" offset="1" id="stop2"/>
				</linearGradient>
				<linearGradient
					xlink:href="#linearFill"
					id="linearBgFill"
					x1="0"
					y1="0"
					x2="0"
					y2="10"
					gradientUnits="userSpaceOnUse" />
				<rect
					width="61"
					height="24"
					rx="8"
					ry="8"
					x="0"
					y="0"
					style="stroke-width: 1px; fill: url(#linearBgFill); stroke:#252b33; stroke-opacity:1;"
					id="rrRect" />
			</defs>
			<use xlink:href="#rrRect" />
			<foreignObject x="0" y="0" width="200" height="150" id="text">
				<div xmlns="http://www.w3.org/1999/xhtml">
				</div>
			</foreignObject>
			<g id="clear" >
				<circle id="circle" r="8" style="fill: #b4b4b4;"/>
				<path id="x" style="fill: none; stroke: #ffffff; stroke-width: 1px;"/>
			</g>
			<image id="magnifier" width="17" height="18" x="0" y="0" xlink:href="data:image/png;base64, iVBORw0KGgoAAAANSUhEUgAAABEAAAASCAYAAAC9+TVUAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAN1wAADdcBQiibeAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAGVSURBVDiNndM9aBRBFADgbwVFEpCU0YiFiFgIFldotAi293rRxkrU4B/YiFYiCJLWszcKxkqbmwWriEUqDQqKogERLGInRvEHcSxugktyZ9DXzJud4dv33rJVztlypJQ24iz2o4VhPME8rkfEe32iWkZSSntxE7v6XcRHnIuIWysP1hXgAOYKsIDj2I1tOIQHGMF0SunCqkq63e4QnmEHbuNERHxdeTGldAod/EArIp43KzlTgIVBAETEDdzBBkytbGe85FODgEZcKet4SqlqIq2Sz60BwGu9AY9gexMZLvnSWkJEZHwp26EmMr9c4lpISmkzxvANL5vI45JPNvscECfL+jQifjaRjl6fEzj/lyr24WLZXm2eVTlnKaWjmC7P7uEyXkTEr5TSVhzDJazH3Yg4sgopbzqNa/4M+hM+Y0vj/ne8q6pqot1uLzbbARHRwR7cxwdsKsASHuEw3mJnznm2ruvRVZX0mcFYqepN+bTquh7NOc/q/WOvqqo62G63Fwcig6If9M9IH+jhfyENaCbnPPkbjMyksPSGDfgAAAAASUVORK5CYII="/>
		</p:Content>
	</Shape>
	<Shape id="dropBox" displayName="Drop Box" icon="Icons/dropbox.png">
		<Properties>
			<PropertyGroup>
				<Property name="box" type="Dimension">200,30</Property>
			</PropertyGroup>
			<PropertyGroup name="Border">
				<Property name="strokeStyle" displayName="Style" type="StrokeStyle"><E>$$strokeStyle</E></Property>
			</PropertyGroup>
			<PropertyGroup name="Text">
				<Property name="textContent" displayName="Text Content" type="PlainText"><![CDATA[Item]]></Property>
				<Property name="textFont" displayName="Default Font" type="Font"><E>$$defaultTextFont</E></Property>
				<Property name="textColor" displayName="Color" type="Color">#000000ff</Property>
				<Property name="textAlign" displayName="Alignment" type="Alignment">0,1</Property>
			</PropertyGroup>
		</Properties>
		<Behaviors>
			<For ref="rrRect">
				<Box>$box.narrowed($strokeStyle.w % 2 == 0 ? 0 : 1)</Box>
				<Transform>[translate(($strokeStyle.w % 2 == 0 ? 0 : 1), ($strokeStyle.w % 2 == 0 ? 0 : 1))]</Transform>
				<Attr>
					<Arg>"rx"</Arg>
					<Arg>$box.h / 2</Arg>
				</Attr>
				<Attr>
					<Arg>"ry"</Arg>
					<Arg>$box.h / 2</Arg>
				</Attr>
			</For>
			<For ref="linearBgFill">
				<Attr>
					<Arg>"y2"</Arg>
					<Arg>$box.h</Arg>
				</Attr>
			</For>
			<For ref="text">
				<TextContent>$textContent</TextContent>
				<Font>$textFont</Font>
				<Fill>$textColor</Fill>
				<BoxFit>
					<Arg>Bound.fromBox($box, 15)</Arg>
					<Arg>$textAlign</Arg>
				</BoxFit>
			</For>
			<For ref="triangle">
				<D>
					[
						M($box.w - 3.5 * $box.h / 5, 2 * $box.h / 5),
						L($box.w - 2 * $box.h / 5, 2 * $box.h / 5),
						L($box.w - 2.75 * $box.h / 5, 3 * $box.h / 5)
					]
				</D>
			</For>
		</Behaviors>
		<p:Content    xmlns:p="http://www.evolus.vn/Namespace/Pencil"
								xmlns="http://www.w3.org/2000/svg">
			<defs>
				<linearGradient x1="0%" y1="0%" x2="0%" y2="100%" id="linearFill">
					<stop style="stop-color:#fafafa;stop-opacity:1" offset="0" id="stop1"/>
					<stop style="stop-color:#ababab;stop-opacity:1" offset="1" id="stop2"/>
				</linearGradient>
				<linearGradient
					xlink:href="#linearFill"
					id="linearBgFill"
					x1="0"
					y1="0"
					x2="0"
					y2="10"
					gradientUnits="userSpaceOnUse" />
				<rect
					width="61"
					height="24"
					rx="22"
					ry="22"
					x="0"
					y="0"
					style="stroke-width: 1px; fill: url(#linearBgFill); stroke:#252b33; stroke-opacity:1;"
					id="rrRect" />
			</defs>
			<use xlink:href="#rrRect" />
			<path id="triangle" style="fill: #000000; fill-opacity: 1" />
			<text id="text"/>
		</p:Content>
	</Shape>
	
	<Shape id="radio" displayName="Radio" icon="Icons/radio.png">
        <Properties>
            <PropertyGroup name="General">
                <Property name="selected" displayName="Selected" type="Bool">false</Property>
                <Property name="disabled" displayName="Disabled" type="Bool">false</Property>
            </PropertyGroup>
            <PropertyGroup name="Background">
                <Property name="fillColor" displayName="Background Color" type="Color"><E>$$fillColor</E></Property>
            </PropertyGroup>
            <PropertyGroup name="Border">
                <Property name="strokeColor" displayName="Border Color" type="Color"><E>$$strokeColor</E></Property>
                <Property name="strokeStyle" displayName="Border Style" type="StrokeStyle"><E>$$strokeStyle</E></Property>
            </PropertyGroup>
            <PropertyGroup name="Text">
                <Property name="textContent" displayName="Text Content" type="PlainText"><![CDATA[Radio]]></Property>
                <Property name="textFont" displayName="Default Font" type="Font"><E>$$defaultTextFont</E></Property>
                <Property name="textColor" displayName="Text Color" type="Color"><E>$$defaultTextColor</E></Property>
            </PropertyGroup>
        </Properties>
        <Behaviors>
			<For ref="stop1">
				<StopColor>($selected.value ? Color.fromString("#191919ff") : Color.fromString("#fefefeff")).hollowed($disabled.value ? 0.5 : 0)</StopColor>
				<Offset>0</Offset>
			</For>
			<For ref="stop2">
				<StopColor>($selected.value ? Color.fromString("#4f4f4fff") : Color.fromString("#b0b0b0ff")).hollowed($disabled.value ? 0.5 : 0)</StopColor>
				<Offset>1</Offset>
			</For>
            <For ref="text">
                <TextContent>$textContent</TextContent>
                <Font>$textFont</Font>
                <Fill>$textColor.hollowed($disabled.value ? 0.5 : 0)</Fill>
                <BoxFit>
                    <Arg>new Bound(20, 0, 15, 18)</Arg>
                    <Arg>new Alignment(0, 1)</Arg>
                </BoxFit>
                <Attr>
                    <Arg>"x"</Arg>
                    <Arg>"22"</Arg>
                </Attr>
                <Attr>
                    <Arg>"y"</Arg>
                    <Arg>"12"</Arg>
                </Attr>
            </For>
            <For ref="rdTick">
				<StrokeColor>$strokeColor.hollowed($disabled.value ? 0.5 : 0)</StrokeColor>
                <Visibility>$selected</Visibility>
             </For>
            <For ref="rdCircle">
                <StrokeColor>$strokeColor.hollowed($disabled.value ? 0.5 : 0)</StrokeColor>
                <StrokeStyle>$strokeStyle</StrokeStyle>
             </For>
        </Behaviors>
        <p:Content xmlns:p="http://www.evolus.vn/Namespace/Pencil" xmlns="http://www.w3.org/2000/svg">
			<defs>
				<linearGradient x1="0%" y1="0%" x2="0%" y2="100%" id="linearFill">
					<stop style="stop-color:#fefefe;stop-opacity:1" offset="0" id="stop1"/>
					<stop style="stop-color:#b0b0b0;stop-opacity:1" offset="1" id="stop2"/>
				</linearGradient>
				<linearGradient
					xlink:href="#linearFill"
					id="linearBgFill"
					x1="0"
					y1="0"
					x2="0"
					y2="18"
					gradientUnits="userSpaceOnUse" />
				
				<linearGradient x1="0%" y1="0%" x2="0%" y2="100%" id="tickLinearFill">
					<stop style="stop-color:#fefefe;stop-opacity:1" offset="0"/>
					<stop style="stop-color:#b0b0b0;stop-opacity:1" offset="1"/>
				</linearGradient>
				<linearGradient
					xlink:href="#tickLinearFill"
					id="tickBgLinearFill"
					x1="0"
					y1="0"
					x2="0"
					y2="18"
					gradientUnits="userSpaceOnUse" />
			</defs>
            <circle id="rdCircle" cx="8" cy="7" r="9" style="fill: url(#linearBgFill);"/>
			<circle id="rdTick" cx="8" cy="7" r="4" style="fill: url(#tickBgLinearFill);"/>
            <text id="text"/>
        </p:Content>
    </Shape>
	<Shortcut displayName="Selected Radio" icon="Icons/selectedRadio.png" to="radio">
        <PropertyValue name="selected">true</PropertyValue>
    </Shortcut>
	
	<Shape id="checkbox" displayName="CheckBox" icon="Icons/checkbox.png">
        <Properties>
            <PropertyGroup name="General">
                <Property name="selected" displayName="Selected" type="Bool">false</Property>
                <Property name="disabled" displayName="Disabled" type="Bool">false</Property>
            </PropertyGroup>
            <PropertyGroup name="Background">
                <Property name="fillColor" displayName="Background Color" type="Color"><E>$$fillColor</E></Property>
            </PropertyGroup>
            <PropertyGroup name="Border">
                <Property name="strokeColor" displayName="Border Color" type="Color"><E>$$strokeColor</E></Property>
                <Property name="strokeStyle" displayName="Border Style" type="StrokeStyle"><E>$$strokeStyle</E></Property>
            </PropertyGroup>
            <PropertyGroup name="Text">
                <Property name="textContent" displayName="Text Content" type="PlainText"><![CDATA[CheckBox]]></Property>
                <Property name="textFont" displayName="Default Font" type="Font"><E>$$defaultTextFont</E></Property>
                <Property name="textColor" displayName="Text Color" type="Color"><E>$$defaultTextColor</E></Property>
            </PropertyGroup>
        </Properties>
        <Behaviors>
			<For ref="stop1">
				<StopColor>($selected.value ? Color.fromString("#191919ff") : Color.fromString("#fefefeff")).hollowed($disabled.value ? 0.5 : 0)</StopColor>
				<Offset>0</Offset>
			</For>
			<For ref="stop2">
				<StopColor>($selected.value ? Color.fromString("#4f4f4fff") : Color.fromString("#b0b0b0ff")).hollowed($disabled.value ? 0.5 : 0)</StopColor>
				<Offset>1</Offset>
			</For>
            <For ref="text">
                <TextContent>$textContent</TextContent>
                <Font>$textFont</Font>
                <Fill>$textColor.hollowed($disabled.value ? 0.5 : 0)</Fill>
                <BoxFit>
                    <Arg>new Bound(20, 0, 15, 17)</Arg>
                    <Arg>new Alignment(0, 1)</Arg>
                </BoxFit>
                <Attr>
                    <Arg>"x"</Arg>
                    <Arg>"22"</Arg>
                </Attr>
                <Attr>
                    <Arg>"y"</Arg>
                    <Arg>"14"</Arg>
                </Attr>
            </For>
            <For ref="tick">
				<StrokeColor>$strokeColor.hollowed($disabled.value ? 0.5 : 0)</StrokeColor>
                <Visibility>$selected</Visibility>
             </For>
            <For ref="rrRect">
                <StrokeColor>$strokeColor.hollowed($disabled.value ? 0.5 : 0)</StrokeColor>
                <StrokeStyle>$strokeStyle</StrokeStyle>
             </For>
        </Behaviors>
        <p:Content xmlns:p="http://www.evolus.vn/Namespace/Pencil" xmlns="http://www.w3.org/2000/svg">
			<defs>
				<linearGradient x1="0%" y1="0%" x2="0%" y2="100%" id="linearFill">
					<stop style="stop-color:#fefefe;stop-opacity:1" offset="0" id="stop1"/>
					<stop style="stop-color:#b0b0b0;stop-opacity:1" offset="1" id="stop2"/>
				</linearGradient>
				<linearGradient
					xlink:href="#linearFill"
					id="linearBgFill"
					x1="0"
					y1="0"
					x2="0"
					y2="18"
					gradientUnits="userSpaceOnUse" />
			</defs>
            <rect
				width="18" height="18"
				rx="3" ry="3"
				x="0" y="0"
				style="stroke-width: 1px; fill: url(#linearBgFill); stroke:#252b33; stroke-opacity:1;"
				id="rrRect" />
			<path id="tick" d="M 1.6130873,9.0924163 3.7123106,6.993193 7.3141358,10.595018 14.451495,3.4576594 16.594912,5.6010771 7.4246212,14.771368 z" style="fill: #ffffff; fill-opacity: 1; stroke: #000000; stroke-width: 1px;"/>
            <text id="text"/>
        </p:Content>
    </Shape>
	<Shortcut displayName="Selected Checkbox" icon="Icons/selectedCheckbox.png" to="checkbox">
        <PropertyValue name="selected">true</PropertyValue>
    </Shortcut>
	
	<Shape id="seek" displayName="Seek" icon="Icons/seek.png">
        <Properties>
            <PropertyGroup>
                <Property name="box" displayName="Box" type="Dimension" p:lockHeight="true">200,20</Property>
                <Property name="a" displayName="Start" type="Handle" p:lockY="true" p:minX="7.5" p:maxX="$box.w - 7.5">50,0</Property>
				<Property name="disabled" displayName="Disabled" type="Bool">false</Property>
            </PropertyGroup>
            <PropertyGroup name="Background">
                <Property name="fillColor" displayName="Background Color" type="Color"><E>$$fillColor</E></Property>
            </PropertyGroup>
            <PropertyGroup name="Border">
                <Property name="strokeColor" displayName="Border Color" type="Color"><E>$$strokeColor</E></Property>
                <Property name="strokeStyle" displayName="Border Style" type="StrokeStyle"><E>$$strokeStyle</E></Property>
            </PropertyGroup>
        </Properties>
        <Behaviors>
			<For ref="stop1">
				<StopColor>Color.fromString("#e9e9e9ff").hollowed($disabled.value ? 0.5 : 0)</StopColor>
				<Offset>0</Offset>
			</For>
			<For ref="stop2">
				<StopColor>Color.fromString("#fdfdfdff").hollowed($disabled.value ? 0.5 : 0)</StopColor>
				<Offset>1</Offset>
			</For>
			<For ref="stop3">
				<StopColor>Color.fromString("#adc7ebff").hollowed($disabled.value ? 0.5 : 0)</StopColor>
				<Offset>0</Offset>
			</For>
			<For ref="stop4">
				<StopColor>Color.fromString("#2472d2ff").hollowed($disabled.value ? 0.5 : 0)</StopColor>
				<Offset>1</Offset>
			</For>
            <For ref="rect">
				<Attr>
					<Arg>"width"</Arg>
					<Arg>$box.w</Arg>
				</Attr>
                <StrokeColor>$strokeColor.hollowed($disabled.value ? 0.5 : 0)</StrokeColor>
                <StrokeStyle>$strokeStyle</StrokeStyle>
             </For>
			<For ref="blueRect">
				<Attr>
					<Arg>"width"</Arg>
					<Arg>$a.x</Arg>
				</Attr>
             </For>
             <For ref="rdCircle">
                <StrokeColor>$strokeColor.hollowed($disabled.value ? 0.6 : 0)</StrokeColor>
                <StrokeStyle>$strokeStyle</StrokeStyle>
                <Transform>[translate($a.x - 7.5, $box.h / 2 - 7.5)]</Transform>
             </For>
        </Behaviors>
        <p:Content xmlns:p="http://www.evolus.vn/Namespace/Pencil" xmlns="http://www.w3.org/2000/svg">
			<defs>
				<linearGradient x1="0%" y1="0%" x2="0%" y2="100%" id="linearFill">
					<stop style="stop-color:#e9e9e9;stop-opacity:1" offset="0" id="stop1"/>
					<stop style="stop-color:#fdfdfd;stop-opacity:1" offset="1" id="stop2"/>
				</linearGradient>
				<linearGradient
					xlink:href="#linearFill"
					id="linearBgFill"
					x1="0"
					y1="9"
					x2="0"
					y2="13"
					gradientUnits="userSpaceOnUse" />
				
				<linearGradient x1="0%" y1="0%" x2="0%" y2="100%" id="blueLinearFill">
					<stop style="stop-color:#275eca;stop-opacity:1" offset="0" id="stop3"/>
					<stop style="stop-color:#5d8be6;stop-opacity:1" offset="1" id="stop4"/>
				</linearGradient>
				<linearGradient
					xlink:href="#blueLinearFill"
					id="blueBgLinearFill"
					x1="0"
					y1="7"
					x2="0"
					y2="13"
					gradientUnits="userSpaceOnUse" />
				
				<linearGradient x1="0%" y1="0%" x2="0%" y2="100%" id="ccLinearFill">
					<stop style="stop-color:#bfbfbf;stop-opacity:1" offset="0" id="stop5"/>
					<stop style="stop-color:#f8f8f8;stop-opacity:1" offset="1" id="stop6"/>
				</linearGradient>
				<linearGradient
					xlink:href="#ccLinearFill"
					id="ccBgLinearFill"
					x1="0"
					y1="1"
					x2="0"
					y2="19"
					gradientUnits="userSpaceOnUse" />
			</defs>
            <rect x="0" y="7"
				  rx="3" ry="3"
				  height="6"
				  id="rect" style="fill: url(#linearBgFill);"/>
			<rect x="1" y="8"
				  rx="2" ry="2"
				  height="4.5"
				  id="blueRect" style="fill: url(#blueBgLinearFill);"/>
            <circle cx="8" cy="8" r="10" id="rdCircle" style="fill: url(#ccBgLinearFill);"/>
        </p:Content>
    </Shape>
	
	<Shape id="progressBar" displayName="Progress Bar" icon="Icons/progress.png">
        <Properties>
            <PropertyGroup>
                <Property name="box" displayName="Box" type="Dimension" p:lockHeight="true">200,8</Property>
                <Property name="a" displayName="Start" type="Handle" p:lockY="true" p:minX="0" p:maxX="$box.w">50,0</Property>
				<Property name="disabled" displayName="Disabled" type="Bool">false</Property>
            </PropertyGroup>
            <PropertyGroup name="Background">
                <Property name="fillColor" displayName="Background Color" type="Color"><E>$$fillColor</E></Property>
            </PropertyGroup>
            <PropertyGroup name="Border">
                <Property name="strokeColor" displayName="Border Color" type="Color"><E>$$strokeColor</E></Property>
                <Property name="strokeStyle" displayName="Border Style" type="StrokeStyle"><E>$$strokeStyle</E></Property>
            </PropertyGroup>
        </Properties>
        <Behaviors>
			<For ref="stop1">
				<StopColor>Color.fromString("#b2b2b2ff").hollowed($disabled.value ? 0.5 : 0)</StopColor>
				<Offset>0</Offset>
			</For>
			<For ref="stop2">
				<StopColor>Color.fromString("#fdfdfdff").hollowed($disabled.value ? 0.5 : 0)</StopColor>
				<Offset>1</Offset>
			</For>
			<For ref="stop3">
				<StopColor>Color.fromString("#adc7ebff").hollowed($disabled.value ? 0.5 : 0)</StopColor>
				<Offset>0</Offset>
			</For>
			<For ref="stop4">
				<StopColor>Color.fromString("#2472d2ff").hollowed($disabled.value ? 0.5 : 0)</StopColor>
				<Offset>1</Offset>
			</For>
            <For ref="rect">
				<Attr>
					<Arg>"width"</Arg>
					<Arg>$box.w</Arg>
				</Attr>
                <StrokeColor>$strokeColor.hollowed($disabled.value ? 0.5 : 0)</StrokeColor>
                <StrokeStyle>$strokeStyle</StrokeStyle>
             </For>
			<For ref="blueRect">
				<Attr>
					<Arg>"width"</Arg>
					<Arg>$a.x</Arg>
				</Attr>
             </For>
        </Behaviors>
        <p:Content xmlns:p="http://www.evolus.vn/Namespace/Pencil" xmlns="http://www.w3.org/2000/svg">
			<defs>
				<linearGradient x1="0%" y1="0%" x2="0%" y2="100%" id="linearFill">
					<stop style="stop-color:#b2b2b2ff;stop-opacity:1" offset="0" id="stop1"/>
					<stop style="stop-color:#ffffffff;stop-opacity:1" offset="1" id="stop2"/>
				</linearGradient>
				<linearGradient
					xlink:href="#linearFill"
					id="linearBgFill"
					x1="0"
					y1="0"
					x2="0"
					y2="5"
					gradientUnits="userSpaceOnUse" />
				
				<linearGradient x1="0%" y1="0%" x2="0%" y2="100%" id="blueLinearFill">
					<stop style="stop-color:#275eca;stop-opacity:1" offset="0" id="stop3"/>
					<stop style="stop-color:#5d8be6;stop-opacity:1" offset="1" id="stop4"/>
				</linearGradient>
				<linearGradient
					xlink:href="#blueLinearFill"
					id="blueBgLinearFill"
					x1="0"
					y1="0"
					x2="0"
					y2="6"
					gradientUnits="userSpaceOnUse" />
			</defs>
            <rect x="0" y="0"
				  rx="3" ry="3"
				  height="8"
				  id="rect" style="fill: url(#linearBgFill);"/>
			<rect x="0.5" y="0.5"
				  rx="2" ry="2"
				  height="7"
				  id="blueRect" style="fill: url(#blueBgLinearFill);"/>
        </p:Content>
    </Shape>
	
	<Shape id="switch" displayName="Switch Button" icon="Icons/switch.png">
		<Properties>
			<PropertyGroup>
				<Property name="status" displayName="Status" type="Enum" p:enumValues="['blue|Blue', 'orange|Orange', 'off|Off']">blue</Property>
			</PropertyGroup>
			<PropertyGroup name="Border">
				<Property name="strokeStyle" displayName="Style" type="StrokeStyle"><E>$$strokeStyle</E></Property>
			</PropertyGroup>
			<PropertyGroup name="Text">
				<Property name="textFont" displayName="Default Font" type="Font">Helvetica|bold|normal|12px</Property>
				<Property name="textColor" displayName="Color" type="Color"><E>$$defaultTextColor</E></Property>
				<Property name="textAlign" displayName="Alignment" type="Alignment">1,1</Property>
			</PropertyGroup>
		</Properties>
		<Behaviors>
			<For ref="stop1">
				<StopColor>
					if($status.value == 'blue') Color.fromString("#2058c6ff");
					else if($status.value == 'orange') Color.fromString("#ba7c00ff");
					else if($status.value == 'off') Color.fromString("#e6e6e6ff");
				</StopColor>
				<Offset>0</Offset>
			</For>
			<For ref="stop2">
				<StopColor>
					if($status.value == 'blue') Color.fromString("#608ee8ff");
					else if($status.value == 'orange') Color.fromString("#f3b946ff");
					else if($status.value == 'off') Color.fromString("#ffffffff");
				</StopColor>
				<Offset>1</Offset>
			</For>
			<For ref="rrRect">
				<Transform>[translate(($strokeStyle.w % 2 == 0 ? 0 : 1), ($strokeStyle.w % 2 == 0 ? 0 : 1))]</Transform>
				<StrokeColor>
					if($status.value == 'blue')' || $status.value == 'orange') Color.fromString("#404040ff");
					else  Color.fromString("#808080ff");
				</StrokeColor>
			</For>
			<For ref="tick">
				<Transform>[translate(($strokeStyle.w % 2 == 0 ? 0 : 1), ($strokeStyle.w % 2 == 0 ? 0 : 1))]</Transform>
				<Attr>
					<Arg>"x"</Arg>
					<Arg>($status.value == 'blue' || $status.value == 'orange') ? 35 : 0</Arg>
				</Attr>
			</For>
			<For ref="bgCopy">
				<Transform>($status.value == 'blue' || $status.value == 'orange') ? [translate(-3,0)] : [translate(2,0)] </Transform>
				<Fill>
					if($status.value == 'blue') Color.fromString("#39548bff");
					else if($status.value == 'orange') Color.fromString("#845c0fff");
					else if($status.value == 'off') Color.fromString("#999999ff");
				</Fill>
			</For>
			<For ref="text">
				<TextContent>($status.value == 'blue' || $status.value == 'orange') ? PlainText.fromString("ON") : PlainText.fromString("OFF")</TextContent>
				<Font>$textFont</Font>
				<Fill>($status.value == 'blue' || $status.value == 'orange') ? Color.fromString("#ffffffff") : Color.fromString("#000000ff")</Fill>
				<BoxFit>
					<Arg>($status.value == 'blue' || $status.value == 'orange') ? new Bound(6, 1, 29, 20) : new Bound(36, 1, 29, 20)</Arg>
					<Arg>$textAlign</Arg>
				</BoxFit>
			</For>
		</Behaviors>
		<p:Content    xmlns:p="http://www.evolus.vn/Namespace/Pencil"
								xmlns="http://www.w3.org/2000/svg">
			<defs>
				<linearGradient x1="0%" y1="0%" x2="0%" y2="100%" id="linearFill">
					<stop style="stop-color:#2058c6;stop-opacity:1" offset="0" id="stop1"/>
					<stop style="stop-color:#608ee8;stop-opacity:1" offset="1" id="stop2"/>
				</linearGradient>
				<linearGradient
					xlink:href="#linearFill"
					id="linearBgFill"
					x1="0"
					y1="0"
					x2="0"
					y2="23"
					gradientUnits="userSpaceOnUse" />
				
				<linearGradient x1="0%" y1="0%" x2="0%" y2="100%" id="tickLinearFill">
					<stop style="stop-color:#c0c0c0;stop-opacity:1" offset="0"/>
					<stop style="stop-color:#f3f3f3;stop-opacity:1" offset="1"/>
				</linearGradient>
				<linearGradient
					xlink:href="#tickLinearFill"
					id="tickLinearBgFill"
					x1="0" y1="0"
					x2="0" y2="23"
					gradientUnits="userSpaceOnUse" />
				<rect
					width="30" height="20"
					rx="7" ry="7"
					x="35" y="0"
					id="tick"/>
			</defs>
			<rect
				width="65" height="20"
				rx="7" ry="7"
				x="0" y="0"
				id="rrRect" style="fill: url(#linearBgFill); stroke: #404040; stroke-width: 1px;"/>
			<use xlink:href="#tick" transform="translate(-2, 0)" id="bgCopy" style="fill: #39548b; fill-opacity:1; stroke: none;"/>
			<use xlink:href="#tick" style="fill: url(#tickLinearBgFill); stroke: #666666; stroke-width: 1px;"/>
			<text id="text"/>
		</p:Content>
	</Shape>
	<Shortcut displayName="Orange Switch" icon="Icons/orangeSwitch.png" to="switch">
        <PropertyValue name="status">orange</PropertyValue>
    </Shortcut>
	<Shortcut displayName="Off Switch" icon="Icons/offSwitch.png" to="switch">
        <PropertyValue name="status">off</PropertyValue>
    </Shortcut>
	
	<Shape  id="messagebox" displayName="Message Box" icon="Icons/messagebox.png">
        <Properties>
			<PropertyGroup>
				<Property name="box" displayName="Box" width="298" type="Dimension" >197,140</Property>
				<Property name="type" displayName="Type" type="Enum" p:enumValues="['one|One Button', 'two|Two Button']">two</Property>
			</PropertyGroup> 
            <PropertyGroup name="Border">
                <Property name="strokeStyle" displayName="Border Style" type="StrokeStyle"><E>$$strokeStyle</E></Property>
            </PropertyGroup>
			<PropertyGroup name="Title">
				<Property name="dialoglabel" displayName="Dialog Label" type="PlainText"><![CDATA[Message label]]></Property>
                <Property name="labelFont" displayName="Font" type="Font">Helvetica|bold|normal|15px</Property>
				<Property name="labelColor" displayName="Label Font" type="Color">#ffffffff</Property>
			</PropertyGroup>
			<PropertyGroup name="Content">
				<Property name="textFont" displayName="Text Font" type="Font"><E>$$defaultTextFont</E></Property>
                <Property name="textContent" displayName="Content" type="PlainText" p:editInfo="var size = 80; ({targetName: 'content', bound: new Bound(0, 42, $box.w, $box.h - 90), font: $textFont, align: $textAlign, multi: true})"><![CDATA[Dialog content]]></Property>
				<Property name="textAlign" displayName="Text Alignment" type="Alignment">1,1</Property>
			</PropertyGroup>
            <PropertyGroup name="Buttons">
				<Property name="textBtLeft" displayName="Content" type="PlainText"><![CDATA[OK]]></Property>
				<Property name="textBtRight" displayName="Content" type="PlainText"><![CDATA[Cancel]]></Property>
				<Property name="buttonFont" displayName="Text Font" type="Font">Helvetica|bold|normal|14px</Property>
				<Property name="buttonColor" displayName="Text Color" type="Color">#ffffffff</Property>
			</PropertyGroup>
		</Properties>
		<Behaviors>  
            <For ref="bg">
                <DomContent>
                    collection.nPatchDom("message_bg", $box)
                </DomContent>
            </For>
			<For ref="label">
				<TextContent>$dialoglabel</TextContent>
				<Font>$labelFont</Font>
				<Fill>$labelColor</Fill>
				<BoxFit>
                    <Arg>new Bound(0, 0, $box.w, 42)</Arg>
                    <Arg>new Alignment(1, 1)</Arg>
                </BoxFit>
			</For>
			<For ref="content">
				<Font>$textFont</Font>
				<Fill>Color.fromString("#ffffffff")</Fill>
				<PlainTextContent>
                    <Arg>$textContent</Arg>
					<Arg>new Bound(0, 42, $box.w, $box.h - 110)</Arg>
					<Arg>new Alignment(1, 1)</Arg>
				</PlainTextContent>
			</For>
			<For ref="buttonleft">
				<Attr>
					<Arg>"y"</Arg>
					<Arg>$box.h - 48</Arg>
				</Attr>
				<Attr>
					<Arg>"width"</Arg>
					<Arg>$type.value == "two" ? ($box.w /2 - 17) : ($box.w - 28)</Arg>
				</Attr>
                <StrokeStyle>$strokeStyle</StrokeStyle>
			</For>
			<For ref="leftBtnBgLinearFill">
				<Attr>
					<Arg>"y1"</Arg>
					<Arg>$box.h - 38</Arg>
				</Attr>
				<Attr>
					<Arg>"y2"</Arg>
					<Arg>$box.h - 8</Arg>
				</Attr>
			</For>
			<For ref="rightBtnBgLinearFill">
				<Attr>
					<Arg>"y1"</Arg>
					<Arg>$box.h - 38</Arg>
				</Attr>
				<Attr>
					<Arg>"y2"</Arg>
					<Arg>$box.h - 8</Arg>
				</Attr>
			</For>
            <For ref="OKtext">
				<TextContent>$textBtLeft</TextContent>
				<Font>$buttonFont</Font>
				<Fill>$buttonColor</Fill>
				<BoxFit>
                    <Arg>$type.value == "two" ? new Bound(15, $box.h - 48, $box.w /2 - 17, 30) : new Bound(15, $box.h - 48, $box.w - 30, 30)</Arg>
                    <Arg>new Alignment(1,1)</Arg>
                </BoxFit>           
			</For>
			<For ref="buttonright">
				<Attr>
					<Arg>"x"</Arg>
					<Arg>$box.w / 2 + 4</Arg>
				</Attr>
				<Attr>
					<Arg>"y"</Arg>
					<Arg>$box.h - 48</Arg>
				</Attr>
				<Attr>
					<Arg>"width"</Arg>
					<Arg>$box.w /2 - 17</Arg>
				</Attr>
                <StrokeStyle>$strokeStyle</StrokeStyle>
			</For>
			<For ref="Canceltext">
				<TextContent>$textBtRight</TextContent>
				<Font>$buttonFont</Font>
				<Fill>$buttonColor</Fill>
				<BoxFit>
                    <Arg>$type.value == "two" ? new Bound($box.w/2 + 4, $box.h - 48, $box.w /2 - 12, 30) : new Bound(0,0,0,0)</Arg>
                    <Arg>new Alignment(1,1)</Arg>
                </BoxFit>           
			</For>			
            <For ref="btnCancle">
				<Visibility>$type.value == "two"</Visibility>				       
			</For>
		</Behaviors>
		<p:Content xmlns:p="http://www.evolus.vn/Namespace/Pencil"
									xmlns="http://www.w3.org/2000/svg" >
			<defs>
				<linearGradient x1="0%" y1="0%" x2="0%" y2="100%" id="leftBtnLinearFill">
					<stop style="stop-color:#555f7b;stop-opacity:1" offset="0"/>
					<stop style="stop-color:#222838;stop-opacity:1" offset="1"/>
				</linearGradient>
				<linearGradient
					xlink:href="#leftBtnLinearFill"
					id="leftBtnBgLinearFill"
					x1="0"
					y1="0"
					x2="0"
					y2="35"
					gradientUnits="userSpaceOnUse" />
				
				<linearGradient x1="0%" y1="0%" x2="0%" y2="100%" id="rightBtnLinearFill">
					<stop style="stop-color:#aebbd4;stop-opacity:1" offset="0" id="stop1"/>
					<stop style="stop-color:#2b3c66;stop-opacity:1" offset="1" id="stop2"/>
				</linearGradient>
				<linearGradient
					xlink:href="#rightBtnLinearFill"
					id="rightBtnBgLinearFill"
					x1="0"
					y1="0"
					x2="0"
					y2="35"
					gradientUnits="userSpaceOnUse" />
			</defs>
			<g id="bg"></g>
			<rect id="buttonleft" x="15" y="90" height="30" rx="4" ry="4" style="fill: url(#leftBtnBgLinearFill); stroke: #8f9195; stroke-width: 1px;"/>
			<text  id="OKtext" />
			<g id="btnCancle" >
				<rect height="30" rx="4" ry="4" id="buttonright" style="fill: url(#rightBtnBgLinearFill); stroke: #8f9195; stroke-width: 1px;"/>
				<text  id="Canceltext" />
			</g>
			<text id="content" transform="translate(0, 60)" />
			<text id="label" />
		</p:Content>
    </Shape>
	
	
	<Shape  id="cellPhoneKeyboard" displayName="CellPhone Keyboard" icon="Icons/cellPhoneKeyboard.png">
        <Properties>             
		</Properties>
		<Behaviors>
		</Behaviors>
		<p:Content xmlns:p="http://www.evolus.vn/Namespace/Pencil"
									xmlns="http://www.w3.org/2000/svg" >
			<image id="type4" width="240" height="180" x="-1" y="0" xlink:href="data:image/png;base64, [encoded data, 17600 characters]" />
		</p:Content>
	</Shape>
	
	<Shape  id="keyboard" displayName="Keyboard" icon="Icons/keyboard.png">
        <Properties>
			<PropertyGroup>
				<Property name="type" displayName="Type" type="Enum" p:enumValues="['normalStyle|Normal Style', 'markStyle|Symbol Style', 'numStyle|Number Style']">normalStyle</Property>
			</PropertyGroup>                
		</Properties>
		<Behaviors>  
			<For ref="type1">   		
				<Visibility>$type.value == "normalStyle"</Visibility>
			</For>
            <For ref="type2">			
				<Visibility>$type.value == "markStyle"</Visibility>
			</For>
            <For ref="type3">			
				<Visibility>$type.value == "numStyle"</Visibility>
			</For>
		</Behaviors>
		<p:Content xmlns:p="http://www.evolus.vn/Namespace/Pencil"
									xmlns="http://www.w3.org/2000/svg" >
			<image id="type1" width="240" height="163" x="0" y="0" xlink:href="data:image/png;base64,[encoded data, 29188 characters]" />
			<image id="type3" width="240" height="163" x="0" y="0" xlink:href="data:image/png;base64,[encoded data, 26688 characters]" />
			<image id="type2" width="240" height="163" x="0" y="0" xlink:href="data:image/png;base64,[encoded data, 25400 characters]" />
		</p:Content>
	</Shape>
	<Shortcut displayName="Mark Keyboard" icon="Icons/keyboard.png" to="keyboard">
        <PropertyValue name="type">markStyle</PropertyValue>
    </Shortcut>
	<Shortcut displayName="Number Keyboard" icon="Icons/numberKeyboard.png" to="keyboard">
        <PropertyValue name="type">numStyle</PropertyValue>
    </Shortcut>
	
	<Shape id="statusBar" displayName="Status Bar" icon="Icons/statusBar.png">
        <Properties>  
		</Properties>
		<Behaviors>  
		</Behaviors>
        <Actions>
            <Action id="getSnappingGuide">
                <Impl>
                    <![CDATA[
                        var b = this.getBounding();
                        return [
                            new SnappingData("MovedBottom", b.y + 15, "Top", false, this.id)
                        ]
                    ]]>
                </Impl>
            </Action>
        </Actions>
		<p:Content xmlns:p="http://www.evolus.vn/Namespace/Pencil"
									xmlns="http://www.w3.org/2000/svg" >
			<image id="type2" width="240" height="15" x="0" y="0" xlink:href="data:image/png;base64, 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" />
		</p:Content>
	</Shape>
	
	<Shape id="picker" displayName="Picker" icon="Icons/picker.png">
        <Properties>
			<PropertyGroup>
				<Property name="box" type="Dimension">60,100</Property>
			</PropertyGroup>
			<PropertyGroup name="Text">
				<Property name="textContent" displayName="Text Content" type="PlainText"><![CDATA[Option]]></Property>
				<Property name="textFont" displayName="Default Font" type="Font"><E>$$defaultTextFont</E></Property>
			</PropertyGroup>
		</Properties>
		<Behaviors>
			<For ref="bottomLinearBgFill">
				<Attr>
					<Arg>"y1"</Arg>
					<Arg>$box.h - 30</Arg>
				</Attr>
				<Attr>
					<Arg>"y2"</Arg>
					<Arg>$box.h</Arg>
				</Attr>
			</For>
            <For ref="topBg">
				<Box>new Bound(0, 0, $box.w, $box.h/2)</Box>
            </For>
			<For ref="border">
				<Box>Bound.fromBox($box)</Box>
            </For>
			<For ref="bottompBg">
				<Attr>
					<Arg>"y"</Arg>
					<Arg>$box.h/2</Arg>
				</Attr>
				<Attr>
					<Arg>"width"</Arg>
					<Arg>$box.w</Arg>
				</Attr>
				<Attr>
					<Arg>"height"</Arg>
					<Arg>$box.h/2</Arg>
				</Attr>
            </For>
			<For ref="text">
				<TextContent>$textContent</TextContent>
				<Font>$textFont</Font>
				<BoxFit>
					<Arg>Bound.fromBox($box)</Arg>
					<Arg>new Alignment(1,1)</Arg>
				</BoxFit>
			</For>
        </Behaviors>
        <p:Content xmlns:p="http://www.evolus.vn/Namespace/Pencil" xmlns="http://www.w3.org/2000/svg">
			<defs>
				<linearGradient x1="0%" y1="0%" x2="0%" y2="100%" id="linearFill">
					<stop style="stop-color:#a1a7b3;stop-opacity:1" offset="0"/>
					<stop style="stop-color:#fafafe;stop-opacity:1" offset="1"/>
				</linearGradient>
				<linearGradient
					xlink:href="#linearFill"
					id="linearBgFill"
					x1="0"
					y1="0"
					x2="0"
					y2="30"
					gradientUnits="userSpaceOnUse" />
				
				<linearGradient x1="0%" y1="0%" x2="0%" y2="100%" id="bottomLinearFill">
					<stop style="stop-color:#fafafe;stop-opacity:1" offset="0" id="stop1"/>
					<stop style="stop-color:#a1a7b3;stop-opacity:1" offset="1" id="stop2"/>
				</linearGradient>
				<linearGradient
					xlink:href="#bottomLinearFill"
					id="bottomLinearBgFill"
					x1="0"
					y1="0"
					x2="0"
					y2="30"
					gradientUnits="userSpaceOnUse" />
			</defs>
            <rect id="topBg" style="fill: url(#linearBgFill); stroke:none;"/>
			<rect x="0" id="bottompBg" style="fill: url(#bottomLinearBgFill); stroke:none;"/>
			<rect id="border" style="fill: none; stroke:#a2a2b0;"/>
			<text id="text" style="fill: #000000;" />
        </p:Content>
    </Shape>
	
	<Shape id="tabBar" displayName="First Tab" icon="Icons/tab.png">
        <Properties>
			<PropertyGroup>
				<Property name="box" type="Dimension">68,28</Property>
				<Property name="type" displayName="Type" type="Enum" p:enumValues="['first|First', 'middle|Middle', 'last|Last']">first</Property>
				<Property name="selected" displayName="Selected" type="Bool">false</Property>
			</PropertyGroup>
			<PropertyGroup name="Text">
				<Property name="textContent" displayName="Text Content" type="PlainText"><![CDATA[Tab]]></Property>
				<Property name="textFont" displayName="Default Font" type="Font"><E>$$defaultTextFont</E></Property>
			</PropertyGroup>
		</Properties>
		<Behaviors>
			<For ref="stop1">
				<StopColor>
					$selected.value ? Color.fromString("#2158c7ff") : Color.fromString("#ffffffff")
				</StopColor>
				<Offset>0</Offset>
			</For>
			<For ref="stop2">
				<StopColor>
					$selected.value ? Color.fromString("#608ee8ff") : Color.fromString("#e6e6e6ff")
				</StopColor>
				<Offset>1</Offset>
			</For>
			<For ref="linearBgFill">
				<Attr>
					<Arg>"y2"</Arg>
					<Arg>$box.h</Arg>
				</Attr>
			</For>
            <For ref="bg">
				<D>
					if($type.value == "first") {
						[M(4,0), L($box.w, 0), L($box.w, $box.h), L(4, $box.h), C(2, $box.h, 0, $box.h -2, 0, $box.h - 4), L(0, 4), C(0, 2, 2, 0, 4, 0), z]	
					} else if($type.value == "last") {
						[M(0,0), L($box.w - 4, 0), C($box.w - 2, 0, $box.w, 2, $box.w, 4), L($box.w, $box.h - 4), C($box.w, $box.h - 2, $box.w - 2, $box.h, $box.w - 4, $box.h), L(0, $box.h), z]
					} else {
						[M(0,0), L($box.w, 0), L($box.w, $box.h), L(0, $box.h), z]
					}
				</D>
            </For>
			<For ref="text">
				<TextContent>$textContent</TextContent>
				<Font>$textFont</Font>
				<Fill>$selected.value ? Color.fromString("#ffffffff") : Color.fromString("#808080ff")</Fill>
				<BoxFit>
					<Arg>Bound.fromBox($box, 0)</Arg>
					<Arg>new Alignment(1,1)</Arg>
				</BoxFit>
			</For>
        </Behaviors>
		<Actions>
			<Action id="getSnappingGuide">
                <Impl>
                    <![CDATA[
                        var b = this.getBounding();
						var type = this.getProperty("type");
						if(type == "middle") {
							return [
								new SnappingData("ContentLeft", b.x + b.width - 1, "Left", true, this.id),
								new SnappingData("ContentRight", b.x + 1, "Right", true, this.id)
							]
						} else if(type == "first") {
							return [
								new SnappingData("ContentLeft", b.x + b.width - 1, "Left", true, this.id)
							]
						} else {
							return [
								new SnappingData("ContentRight", b.x + 1, "Right", true, this.id)
							]
						}
                    ]]>
                </Impl>
            </Action>
		</Actions>
        <p:Content xmlns:p="http://www.evolus.vn/Namespace/Pencil" xmlns="http://www.w3.org/2000/svg">
			<defs>
				<linearGradient x1="0%" y1="0%" x2="0%" y2="100%" id="linearFill">
					<stop style="stop-color:#2158c7;stop-opacity:1" offset="0" id="stop1"/>
					<stop style="stop-color:#608ee8;stop-opacity:1" offset="1" id="stop2"/>
				</linearGradient>
				<linearGradient
					xlink:href="#linearFill"
					id="linearBgFill"
					x1="0"
					y1="0"
					x2="0"
					y2="40"
					gradientUnits="userSpaceOnUse" />
			</defs>
            <path id="bg" style="fill: url(#linearBgFill); stroke:#9e9e9e; stroke-width: 1px;"/>
			<text id="text"/>
        </p:Content>
    </Shape>
	<Shortcut displayName="Middle Tab" icon="Icons/middleTab.png" to="tabBar">
        <PropertyValue name="type">middle</PropertyValue>
		<PropertyValue name="selected">true</PropertyValue>
    </Shortcut>
	<Shortcut displayName="Last Tab" icon="Icons/lastTab.png" to="tabBar">
        <PropertyValue name="type">last</PropertyValue>
    </Shortcut>
	
	<Shape  id="bottomTab" displayName="Bottom Tab Item" icon="Icons/bottom_tab_item.png">
        <Properties>
			<PropertyGroup>
                <Property name="imageData" displayName="Image" type="ImageData">new ImageData(0, 0, "xxx")</Property>
            </PropertyGroup>
            <PropertyGroup name="Text">
                <Property name="textContent" displayName="Text Content" type="PlainText"><![CDATA[Item]]></Property>
                <Property name="textFont" displayName="Default Font" type="Font">Helvetica|normal|normal|12px</Property>
                <Property name="textColor" displayName="Text Color" type="Color">#FFFFFFFF</Property>
		    </PropertyGroup>
		</Properties>
		<Behaviors>  
			<For ref="image">
                <Image>$imageData</Image>
				<Transform>[scale(30/$imageData.w, 30/$imageData.h)]</Transform>
            </For>
			<For ref="imageContainer">
            </For>
            <For ref="title">
                <TextContent>$textContent</TextContent>
                <Font>$textFont</Font>
                <Fill>$textColor</Fill>
				<BoxFit>
                    <Arg>new Bound(0, 30, 30, 5)</Arg>
                    <Arg>new Alignment(1, 0)</Arg>
                </BoxFit>
		    </For>
		</Behaviors>
		<Actions>
            <Action id="setImage" displayName="Select Image...">
                <Impl>
                    <![CDATA[
                        var thiz = this;
                        ImageData.prompt(function(data) {
                            if (!data) return;
                            thiz.setProperty("imageData", data);
                        });
                    ]]>
                    </Impl>
            </Action>
            <Action id="removeImage" displayName="Remove Image">
                <Impl>
                    <![CDATA[
                        this.setProperty("imageData", new ImageData(0, 0, "xxx"));
                    ]]>
                </Impl>
            </Action>
        </Actions>
		<p:Content xmlns:p="http://www.evolus.vn/Namespace/Pencil"
									xmlns="http://www.w3.org/2000/svg" >
            <text id="title"/>
			<g id="imageContainer">
				<image id="image" x="0" y="0" width="30" height="30"/>
			</g>
		</p:Content>
    </Shape>
	
	<Shape  id="optionLabel" displayName="Option Label" icon="Icons/optionLabel.png">
        <Properties>
			<PropertyGroup>
				<Property name="box" type="Dimension">220,35</Property>
				<Property name="frameType" displayName="Frame" type="Enum" p:enumValues="['first|First', 'middle|Middle', 'last|Last', 'only|Only']">only</Property>
				<Property name="firstSign" displayName="First Sign" type="Enum" p:enumValues="['none|None', 'checked|Checked', 'uncheck|Uncheck', 'ban|Ban']">checked</Property>
				<Property name="lastSign" displayName="Last Sign" type="Enum" p:enumValues="['none|None', 'caret|Caret', 'disclosure|Disclosure', 'checked|Checked', 'list|List']">none</Property>
				<Property name="selected" displayName="Selected" type="Bool">false</Property>
			</PropertyGroup>
			<PropertyGroup name="Text">
				<Property name="textItemFont" displayName="Item Font" type="Font">Helvetica|bold|normal|13px</Property>
				<Property name="textStatusFont" displayName="Status Font" type="Font">Helvetica|normal|normal|14px</Property>
				<Property name="textItem" displayName="Text Content" type="PlainText"><![CDATA[Item]]></Property>
				<Property name="textStatus" displayName="Text Content" type="PlainText"><![CDATA[Option Status]]></Property>
			</PropertyGroup>
		</Properties>
		<Behaviors>
			<For ref="stop1">
				<StopColor>
					$selected.value ? Color.fromString("#4286f5ff") : Color.fromString("#ffffffff")
				</StopColor>
				<Offset>0</Offset>
			</For>
			<For ref="stop2">
				<StopColor>
					$selected.value ? Color.fromString("#194fdbff") : Color.fromString("#ffffffff")
				</StopColor>
				<Offset>1</Offset>
			</For>
			<For ref="linearBgFill">
				<Attr>
					<Arg>"y2"</Arg>
					<Arg>$box.h</Arg>
				</Attr>
			</For>
            <For ref="bg">
				<D>
					if($frameType.value == "first") {
						[M(4,0), L($box.w - 4, 0), C($box.w - 2, 0, $box.w, 2, $box.w, 4), L($box.w, $box.h), L(0, $box.h), L(0, 4), C(0, 2, 2, 0, 4, 0), z]	
					} else if($frameType.value == "last") {
						[M(0,0), L($box.w, 0), L($box.w, $box.h - 4), C($box.w, $box.h - 2, $box.w - 2, $box.h, $box.w - 4, $box.h), L(4, $box.h), C(2, $box.h, 0, $box.h - 2, 0, $box.h - 4), z]
					} else if($frameType.value == "only") {
						[M(4,0), L($box.w - 4, 0), C($box.w - 2, 0, $box.w, 2, $box.w, 4), L($box.w, $box.h - 4), C($box.w, $box.h - 2, $box.w - 2, $box.h, $box.w - 4, $box.h), L(4, $box.h), C(2, $box.h, 0, $box.h - 2, 0, $box.h - 4), L(0, 4), C(0, 2, 2, 0, 4, 0), z]	
					} else {
						[M(0,0), L($box.w, 0), L($box.w, $box.h), L(0, $box.h), z]
					}
				</D>
            </For>
			<For ref="caret">
				<Visibility>$lastSign.value == 'caret'</Visibility>
				<D>
					[
						M($box.w - 18, $box.h/2 - 6), L($box.w - 13, $box.h/2), L($box.w - 18, $box.h/2 + 6)
					]
				</D>
				<StrokeColor>$selected.value ? Color.fromString("#ffffffff") : Color.fromString("#767676ff")</StrokeColor>
			</For>
			<For ref="check">
				<Visibility>$firstSign.value == 'checked'</Visibility>
				<D>
					[
						M(11, $box.h/2 - 1), L(15, $box.h/2 + 4), L(20, $box.h/2 - 6)
					]
				</D>
				<StrokeColor>$selected.value ? Color.fromString("#ffffffff") : Color.fromString("#293ca6ff")</StrokeColor>
			</For>
			<For ref="lastCheck">
				<Visibility>$lastSign.value == 'checked'</Visibility>
				<D>
					[
						M($box.w - 20, $box.h/2 - 1), L($box.w - 16, $box.h/2 + 4), L($box.w - 11, $box.h/2 - 6)
					]
				</D>
				<StrokeColor>$selected.value ? Color.fromString("#ffffffff") : Color.fromString("#445b7dff")</StrokeColor>
			</For>
			<For ref="list">
				<Visibility>$lastSign.value == 'list'</Visibility>
				<D>
					[
						M($box.w - 10, $box.h/2), L($box.w - 22, $box.h/2),
						M($box.w - 10, $box.h/2 - 4), L($box.w - 22, $box.h/2 - 4),
						M($box.w - 10, $box.h/2 + 4), L($box.w - 22, $box.h/2 + 4)
					]
				</D>
				<StrokeColor>$selected.value ? Color.fromString("#ffffffff") : Color.fromString("#b3b3b3ff")</StrokeColor>
			</For>
			<For ref="disclosure">
				<Visibility>$lastSign.value == 'disclosure'</Visibility>
				<Attr>
					<Arg>"x"</Arg>
					<Arg>$box.w - 26</Arg>
				</Attr>
				<Attr>
					<Arg>"y"</Arg>
					<Arg>$box.h/2 - 10</Arg>
				</Attr>
			</For>
			<For ref="ban">
				<Visibility>$firstSign.value == 'ban'</Visibility>
				<Attr>
					<Arg>"x"</Arg>
					<Arg>5</Arg>
				</Attr>
				<Attr>
					<Arg>"y"</Arg>
					<Arg>$box.h/2 - 10</Arg>
				</Attr>
			</For>
			<For ref="item">
				<TextContent>$textItem</TextContent>
				<Fill>$selected.value ? Color.fromString("#ffffffff") : ($firstSign.value == 'checked' ? Color.fromString("#293ca6ff") : ($lastSign.value == 'checked' ? Color.fromString("#445b7dff") : Color.fromString("#000000ff")))</Fill>
				<Font>$textItemFont</Font>
				<BoxFit>
					<Arg>var padding = $firstSign.value == 'none' ? 7 : 29; new Bound(padding, 0, $box.w/2 - padding, $box.h)</Arg>
					<Arg>new Alignment(0,1)</Arg>
				</BoxFit>
			</For>
			<For ref="status">
				<TextContent>$textStatus</TextContent>
				<Fill>$selected.value ? Color.fromString("#ffffffff") : Color.fromString("#445b7dff")</Fill>
				<Font>$textStatusFont</Font>
				<BoxFit>
					<Arg>new Bound($box.w/2, 0, $box.w/2 - ($lastSign.value == 'none' ? 10 : 30), $box.h)</Arg>
					<Arg>new Alignment(2,1)</Arg>
				</BoxFit>
			</For>
        </Behaviors>
        <Actions>
			<Action id="getSnappingGuide">
                <Impl>
                    <![CDATA[
                        var b = this.getBounding();
						var type = this.getProperty("frameType");
						if(type == "first") {
							return [
								new SnappingData("ContentTop", b.y + b.height - 1 , "Top", false, this.id),
							]
						} else if(type == "middle") {
							return [
								new SnappingData("ContentTop", b.y + b.height - 1 , "Top", false, this.id),
								new SnappingData("ContentBottom", b.y + 1 , "Bottom", false, this.id),
							]
						} else if(type == "last") {
							return [
								new SnappingData("ContentBottom", b.y + 1 , "Bottom", false, this.id),
							]
						}
                    ]]>
                </Impl>
            </Action>
		</Actions>
		<p:Content xmlns:p="http://www.evolus.vn/Namespace/Pencil" xmlns="http://www.w3.org/2000/svg">
			<defs>
				<linearGradient x1="0%" y1="0%" x2="0%" y2="100%" id="linearFill">
					<stop style="stop-color:#2158c7;stop-opacity:1" offset="0" id="stop1"/>
					<stop style="stop-color:#608ee8;stop-opacity:1" offset="1" id="stop2"/>
				</linearGradient>
				<linearGradient
					xlink:href="#linearFill"
					id="linearBgFill"
					x1="0"
					y1="0"
					x2="0"
					y2="40"
					gradientUnits="userSpaceOnUse" />
			</defs>
            <path id="bg" style="fill: url(#linearBgFill); stroke:#9f9f9f; stroke-width: 1px;"/>
			<text id="item" />
			<text id="status" />
			<path id="caret" style="stroke: #767676; stroke-width: 2px; fill: none;" />
			<image id="disclosure" width="21" height="21" x="0" y="0" xlink:href="data:image/png;base64, iVBORw0KGgoAAAANSUhEUgAAABUAAAAVCAYAAACpF6WWAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAN1wAADdcBQiibeAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAPgSURBVDiNjZRtTFtlFMd/94W30W6IuA2nTAcWlEBGRBDnCzH4SRcJk0Q/LNsi08wQ91mjiel8JSxZnIkE4/ywpB80gmxkMSYj1TCJJDiLgSY0gF0o0A1WVgpt6b0cP1zqLes+eJJ/bu455/k//3POk4OIcC9sWU5zc7NjZGSkYX5+viMUCh31+XzVzc3NOnDPcyJy7wCQOz4+fuTOnTt/GoaRkLvMNM1oIpG4Gg6HG/8XaXd3975AIDCYSRKJbJiBKZHpaZFYzPZvbm4aa2trX4hIbiaHki5VURRlbGysobq6+nJeXt4DqZQpw79pis8HiTjbzOGExkaobwBFAdM0JzRNexG4Cdikhw8fvs/j8Yw6nc6KYHDdGBzYoS/dYutCsNts20MPQ2sb3F8ChmEM6LreCqBuqcx1u91dTqezYnFxKXnxwg49vACmAQUF8NYpOHDA+s9EcBYufAOJBOi6/ur6+vrr/5F6PJ6m2traEyJC/w8leSsrsL4Omg7H34S9pfDGUSjbb/kzEV6ES/2W8vz8/PNAkaooSo7L5TqhaZo2dDWw6p+AjaQFMUHPsQ7oOhzvgPIKO57G8K8wOw2qqpbE4/GXVSDf4XDUAQRnXM7M8m7dhHNdcHvZJj55Ciqrslvhn7ByRKReBXL37NnzKMB0AJLJ7ZgPQdfHsLxkE7/dCY9Vbs+bmU7H9Tq1ra3NUVRU5DQMQ+ZuZJe2sUV89jP7Beg6vHMaCgvtnBv/WDFN0yr0vr6+eCwWSzgcjvzCQltRphUUwLEO62lZJcLFb2Fx3s7Ztcv6GoYRUgEzGAwugjXdu1XqGrz3EVQ+bhP2fgWDP23PK3vEiicSiXEVMObm5mYAyl3h5DZCHT78ZDvh1+fg0o/Zl1c9YeXE4/HrKpAYHR39GaD1tZLc3Xvt5jt3QumDNuGX3dD3ffYwaw7CU0+DaZobs7OzvwAogGtoaOgvEZG/fbHUC0+KPFdn4Vi7yO1lkbOf2r5MvPSMyELIWjB+v/9zQFdEBEVRdlZVVb1y7dq13uLi4sIrA9a0Y6uWSqcTVlezB1iyGz44A03PQiQSmaypqXk+FApF0vtTBXa73e4zyWQyJSISXhR596TIwfJs1FWIuN8XWY1aCtfWkmv9/f1NQC6gpkkVIAcoa29vP+33++fTO3N5SWTYK9J7XuS7HpHR30WiUXunTk1N/dHZ2VkP5AEaoGSSaluBfZqmHenp6bkcjUaztr69uCOR3t7ebmA/ULglSgOUdE/TLVABHSgGSoHylpYW16FDh6pqa2v3maaZmpycDHi93uter9cHLAArQAowgU1g819HDeHnw28SEgAAAABJRU5ErkJggg==" />
			<path id="check" style="stroke: #293ca6; stroke-width: 2px; fill: none;" />
			<image id="ban" width="21" height="21" x="0" y="0" xlink:href="data:image/png;base64, iVBORw0KGgoAAAANSUhEUgAAABUAAAAVCAYAAACpF6WWAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAN1wAADdcBQiibeAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAOmSURBVDiNlZRdTJtlFMd/T9v3LbDQ8mXbEQeMEmxSnCCLF5sSopnocDGiN4rGOOdivObGoQmX3nhpYjLFRC/E+IEmmBqsDTi52LIAxcCKfDtGBpWOrt3a96uPFys4GYNxkn/yfJ3/c/7nPM8RUkp2MiGEANTBwUF/bW3t0dLS0iOAkclkRk3TvFhTU3NV3s9ZSnkPKisrixYWFs5pmpaQ9zHTNJcTiUTnTv5i+2XDw8OPBoPBLysqKhoB9PX1nH55zJYdHUOoKgWPN1LQ1Ii9xA2AYRg/KYpyFli7J1JATExMnDRNMyOllOnVNWPu1MtyjMIdsXT6XWluJKWUUuZyubiU8pEtrs1BV1dXZTqdvi6llIvffq+NlvrkJQp2xfjDfpkMRzbTcVFKad+SL4RQZ2Zmvq6rq+tYiU5ofzcfc0rL2rEG281eXMxjf17GWV2Fruvvq6r6kU0IIfr6+k75/f4O0zDkSudbTt2yMOCBkE2l+Oud9wBQFKVH07RqG6BWVVV1CCGY+uRTLTk59cCEm1j79TfWvutHCOE0TfOEA1DLysoaAMzIUIGBBCFQ3O49pUspMZNJANZ/v4DnlZcQQjQ7AKfX6z0MkBiPYgCK280zN67vSWokk/xS4mXTF8DhcDQ5AoGA6na7i03TlOnlawLAtifdf7ZZzvTCIgB2u/2QIxaLWfF4/KbH43Ep/sOkZ+fIyRxGXtbukd5E487nKQnUA6Dr+rwDsJaWllY8Ho/L1dTIjdk5jGSSb0o8+4gXXE2NAGSz2agNMJaXl6cBXC+c1K28pP3i4HNtAKRSqXEboA8MDAxalpU78kanWt7y1L6fVPXrr3Hw6VYMw7gViUTCdkCOjY2tB4PBhoaGhtrylidzV85/LkzTIAd7wun18vxAP47CQsbHxz9ob2+PCO4U+4DL5ToWjUa/qqmpeWjlwh+E3z7Lxszsrnn0HG3mxBefUd4QZHV19YLP53sRuGXP71uapqXj8fhGa2vrcW8goAbPnEbXdP6JTaNnMv+LrtDn44kPz/Fs73mKfF4SicTV3t7eV8Ph8Fr+CAKwA06g2u/3vxkKhSbvbsgbi0ty+ocf5ezAzzK1srK1bplmbmhoqL++vj4AFAEq4NgkteUnTqAMON7d3f1xLBa7ls1mje1dP3P7tj4/Pz/Z09NzBvAAB/K+CmAXefniLtgBN+AD6hRFKWtra6tvaWk5ZFmWMTIyciUUCk1ZlrUErALJvGQLkID8F9IPZpnci4FvAAAAAElFTkSuQmCC" />
			<path id="lastCheck" style="stroke: #293ca6; stroke-width: 2px; fill: none;" />
			<path id="list" style="stroke: #b3b3b3; stroke-width: 2px; fill: none;" />
        </p:Content>
    </Shape>
	<Shortcut displayName="First Option" icon="Icons/optionLabel.png" to="optionLabel">
        <PropertyValue name="frameType">first</PropertyValue>
		<PropertyValue name="firstSign">none</PropertyValue>
		<PropertyValue name="lastSign">caret</PropertyValue>
    </Shortcut>
	<Shortcut displayName="Middle Option" icon="Icons/optionLabel.png" to="optionLabel">
		<PropertyValue name="firstSign">ban</PropertyValue>
		<PropertyValue name="lastSign">list</PropertyValue>
        <PropertyValue name="frameType">middle</PropertyValue>
    </Shortcut>
	<Shortcut displayName="Last Option" icon="Icons/optionLabel.png" to="optionLabel">
        <PropertyValue name="frameType">last</PropertyValue>
		<PropertyValue name="firstSign">none</PropertyValue>
		<PropertyValue name="lastSign">disclosure</PropertyValue>
    </Shortcut>
	<Shortcut displayName="List Item" icon="Icons/optionLabel.png" to="optionLabel">
        <PropertyValue name="box">240,35</PropertyValue>
		<PropertyValue name="frameType">middle</PropertyValue>
		<PropertyValue name="firstSign">none</PropertyValue>
		<PropertyValue name="lastSign">checked</PropertyValue>
		<PropertyValue name="textStatus"><![CDATA[status]]></PropertyValue>
		<PropertyValue name="textItem"><![CDATA[List Item]]></PropertyValue>
    </Shortcut>
	
	<Shape  id="buttonLabel" displayName="Button Label" icon="Icons/buttonLabel.png">
        <Properties>
			<PropertyGroup>
				<Property name="box" type="Dimension">220,35</Property>
				<Property name="frameType" displayName="Frame" type="Enum" p:enumValues="['first|First', 'middle|Middle', 'last|Last', 'only|Only']">first</Property>
				<Property name="disable" displayName="Disable" type="Bool">false</Property>
			</PropertyGroup>
			<PropertyGroup name="Text">
				<Property name="textFont" displayName="Text Font" type="Font">Helvetica|bold|normal|13px</Property>
				<Property name="text" displayName="Text" type="PlainText"><![CDATA[Button]]></Property>
			</PropertyGroup>
		</Properties>
		<Behaviors>
            <For ref="bg">
				<D>
					if($frameType.value == "first") {
						[M(4,0), L($box.w - 4, 0), C($box.w - 2, 0, $box.w, 2, $box.w, 4), L($box.w, $box.h), L(0, $box.h), L(0, 4), C(0, 2, 2, 0, 4, 0), z]	
					} else if($frameType.value == "last") {
						[M(0,0), L($box.w, 0), L($box.w, $box.h - 4), C($box.w, $box.h - 2, $box.w - 2, $box.h, $box.w - 4, $box.h), L(4, $box.h), C(2, $box.h, 0, $box.h - 2, 0, $box.h - 4), z]
					} else if($frameType.value == "only") {
						[M(4,0), L($box.w - 4, 0), C($box.w - 2, 0, $box.w, 2, $box.w, 4), L($box.w, $box.h - 4), C($box.w, $box.h - 2, $box.w - 2, $box.h, $box.w - 4, $box.h), L(4, $box.h), C(2, $box.h, 0, $box.h - 2, 0, $box.h - 4), L(0, 4), C(0, 2, 2, 0, 4, 0), z]	
					} else {
						[M(0,0), L($box.w, 0), L($box.w, $box.h), L(0, $box.h), z]
					}
				</D>
            </For>
			<For ref="item">
				<TextContent>$text</TextContent>
				<Fill>$disable.value ? Color.fromString("#b9b9b9ff") : Color.fromString("#000000ff")</Fill>
				<Font>$textFont</Font>
				<BoxFit>
					<Arg>Bound.fromBox($box)</Arg>
					<Arg>new Alignment(1,1)</Arg>
				</BoxFit>
			</For>
        </Behaviors>
        <Actions>
			<Action id="getSnappingGuide">
                <Impl>
                    <![CDATA[
                        var b = this.getBounding();
						var type = this.getProperty("frameType");
						if(type == "first") {
							return [
								new SnappingData("ContentTop", b.y + b.height - 1 , "Top", false, this.id),
							]
						} else if(type == "middle") {
							return [
								new SnappingData("ContentTop", b.y + b.height - 1 , "Top", false, this.id),
								new SnappingData("ContentBottom", b.y + 1 , "Bottom", false, this.id),
							]
						} else if(type == "last") {
							return [
								new SnappingData("ContentBottom", b.y + 1 , "Bottom", false, this.id),
							]
						}
                    ]]>
                </Impl>
            </Action>
		</Actions>
		<p:Content xmlns:p="http://www.evolus.vn/Namespace/Pencil" xmlns="http://www.w3.org/2000/svg">
            <path id="bg" style="fill: #ffffff; stroke:#b9b9b9; stroke-width: 1px;"/>
			<text id="item" />
        </p:Content>
    </Shape>
	<Shortcut displayName="Last Button Label" icon="Icons/buttonLabel.png" to="buttonLabel">
        <PropertyValue name="frameType">last</PropertyValue>
		<PropertyValue name="disable">true</PropertyValue>
    </Shortcut>
	
	<Shape  id="groupPanel" displayName="Group Panel" icon="Icons/groupPanel.png">
        <Properties>
			<PropertyGroup>
				<Property name="box" type="Dimension">240,18</Property>
			</PropertyGroup>
			<PropertyGroup name="Text">
				<Property name="textContent" displayName="Text Content" type="PlainText"><![CDATA[Group Label]]></Property>
				<Property name="textFont" displayName="Default Font" type="Font">Helvetica|normal|normal|14px</Property>
			</PropertyGroup>
		</Properties>
		<Behaviors>
			<For ref="linearBgFill">
				<Attr>
					<Arg>"y1"</Arg>
					<Arg>$box.h/2</Arg>
				</Attr>
				<Attr>
					<Arg>"y2"</Arg>
					<Arg>$box.h</Arg>
				</Attr>
			</For>
            <For ref="bg">
				<Box>Bound.fromBox($box)</Box>
            </For>
			<For ref="text">
				<TextContent>$textContent</TextContent>
				<Font>$textFont</Font>
				<BoxFit>
					<Arg>new Bound(10, 0, $box.w - 10, $box.h)</Arg>
					<Arg>new Alignment(0,1)</Arg>
				</BoxFit>
			</For>
			<For ref="textCopy">
				<TextContent>$textContent</TextContent>
				<Font>$textFont</Font>
				<BoxFit>
					<Arg>new Bound(11, 1, $box.w - 10, $box.h)</Arg>
					<Arg>new Alignment(0,1)</Arg>
				</BoxFit>
			</For>
        </Behaviors>
        <Actions>
            <Action id="getSnappingGuide">
                <Impl>
                    <![CDATA[
                        var b = this.getBounding();
                        return [
                            new SnappingData("MovedBottom", b.y + b.height, "Top", false, this.id),
                        ]
                    ]]>
                </Impl>
            </Action>
        </Actions>

        <p:Content xmlns:p="http://www.evolus.vn/Namespace/Pencil" xmlns="http://www.w3.org/2000/svg">
			<defs>
				<linearGradient x1="0%" y1="0%" x2="0%" y2="100%" id="linearFill">
					<stop style="stop-color:#7d92ac;stop-opacity:0.75" offset="0" id="stop1"/>
					<stop style="stop-color:#b0bcce;stop-opacity:0.75" offset="1" id="stop2"/>
				</linearGradient>
				<linearGradient
					xlink:href="#linearFill"
					id="linearBgFill"
					x1="0"
					y1="0"
					x2="0"
					y2="40"
					gradientUnits="userSpaceOnUse" />
			</defs>
            <rect id="bg" style="fill: url(#linearBgFill); stroke:#9e9e9e; stroke-width: 1px;"/>
			<text id="textCopy" style="fill: #434c5a" />
			<text id="text" style="fill: #ffffff" />
        </p:Content>
    </Shape>
	
	<Shape  id="programPanel" displayName="Program Panel" icon="Icons/programPanel.png">
        <Properties>
			<PropertyGroup>
				<Property name="box" type="Dimension">240,45</Property>
				<Property name="type" displayName="Type" type="Enum" p:enumValues="['blue|Blue', 'black|Black', 'white|White']">blue</Property>
			</PropertyGroup>
			<PropertyGroup name="Text">
				<Property name="textContent" displayName="Text Content" type="PlainText"><![CDATA[Panel Label]]></Property>
				<Property name="titleContent" displayName="Title Content" type="PlainText"><![CDATA[Title Label]]></Property>
				<Property name="textFont" displayName="Text Font" type="Font">Helvetica|bold|normal|14px</Property>
				<Property name="titleFont" displayName="Title Font" type="Font">Helvetica|normal|normal|12px</Property>
			</PropertyGroup>
		</Properties>
		<Behaviors>
			<For ref="stop1">
				<StopColor>
					if($type.value == 'blue') Color.fromString("#b0bccdff")
					else if($type.value == 'black') Color.fromString("#606060d9")
					else Color.fromString("#f6f7fcff")
				</StopColor>
				<Offset>0</Offset>
			</For>
			<For ref="stop2">
				<StopColor>
					if($type.value == 'blue') Color.fromString("#8195afff")
					else if($type.value == 'black') Color.fromString("#000000e5")
					else Color.fromString("#d0cfd5ff")
				</StopColor>
				<Offset>1</Offset>
			</For>
			<For ref="linearBgFill">
				<Attr>
					<Arg>"y2"</Arg>
					<Arg>$box.h/2</Arg>
				</Attr>
			</For>
            <For ref="bg">
				<Box>Bound.fromBox($box)</Box>
				<StrokeColor>
					if($type.value == 'blue') Color.fromString("#9e9e9eff")
					else if($type.value == 'black') Color.fromString("#585b62ff")
					else Color.fromString("#cfd2d7ff")
				</StrokeColor>
            </For>
			<For ref="title">
				<Visibility>$type.value == 'blue'</Visibility>
				<TextContent>$titleContent</TextContent>
				<Font>$titleFont</Font>
				<BoxFit>
					<Arg>new Bound(0, 0, $box.w, $box.h/2)</Arg>
					<Arg>new Alignment(1,1)</Arg>
				</BoxFit>
			</For>
			<For ref="text">
				<TextContent>$textContent</TextContent>
				<Font>$textFont</Font>
				<BoxFit>
					<Arg>new Bound(0, $box.h - 35, $box.w, 35)</Arg>
					<Arg>new Alignment(1,1)</Arg>
				</BoxFit>
			</For>
			<For ref="textCopy">
				<TextContent>$textContent</TextContent>
				<Font>$textFont</Font>
				<BoxFit>
					<Arg>new Bound(1, $box.h - 36, $box.w - 1, 35)</Arg>
					<Arg>new Alignment(1,1)</Arg>
				</BoxFit>
			</For>
        </Behaviors>
		<Actions>
			<Action id="getSnappingGuide">
                <Impl>
                    <![CDATA[
                        var b = this.getBounding();
                        return [
                            new SnappingData("ContentMiddle", b.y + b.height - 35/2 , "HCenter", false, this.id),
                            new SnappingData("MovedBottom", b.y + b.height, "Top", false, this.id),
                        ]
                    ]]>
                </Impl>
            </Action>
		</Actions>
        <p:Content xmlns:p="http://www.evolus.vn/Namespace/Pencil" xmlns="http://www.w3.org/2000/svg">
			<defs>
				<linearGradient x1="0%" y1="0%" x2="0%" y2="100%" id="linearFill">
					<stop style="stop-color:#b0bccd;stop-opacity:1" offset="0" id="stop1"/>
					<stop style="stop-color:#8195af;stop-opacity:1" offset="1" id="stop2"/>
				</linearGradient>
				<linearGradient
					xlink:href="#linearFill"
					id="linearBgFill"
					x1="0"
					y1="0"
					x2="0"
					y2="40"
					gradientUnits="userSpaceOnUse" />
			</defs>
            <rect id="bg" style="fill: url(#linearBgFill); stroke:#9e9e9e; stroke-width: 1px;"/>
			<text id="textCopy" style="fill: #434c5a;" />
			<text id="text" style="fill: #ffffff;" />
			<text id="title" style="fill: #000000;" />
        </p:Content>
    </Shape>
	<Shortcut displayName="Black Panel" icon="Icons/blackPanel.png" to="programPanel">
        <PropertyValue name="type">black</PropertyValue>
		<PropertyValue name="box">240,32</PropertyValue>
    </Shortcut>
	<Shortcut displayName="Title Panel" icon="Icons/bluePanel.png" to="programPanel">
		<PropertyValue name="box">240,32</PropertyValue>
		<PropertyValue name="titleContent"><![CDATA[]]></PropertyValue>
    </Shortcut>
	<Shortcut displayName="Panel" icon="Icons/whitePanel.png" to="programPanel">
		<PropertyValue name="box">240,32</PropertyValue>
		<PropertyValue name="type">white</PropertyValue>
		<PropertyValue name="titleContent"><![CDATA[]]></PropertyValue>
		<PropertyValue name="textContent"><![CDATA[]]></PropertyValue>
    </Shortcut>
		
	<Shape  id="alphaSearch" displayName="Alpha Search" icon="Icons/AlphaSearch.png">
        <Properties>             
		</Properties>
		<Behaviors>
		</Behaviors>
		<p:Content xmlns:p="http://www.evolus.vn/Namespace/Pencil"
									xmlns="http://www.w3.org/2000/svg" >
			<image id="type4" width="19" height="350" x="0" y="0" xlink:href="data:image/png;base64, [encoded data, 7660 characters]" />
		</p:Content>
	</Shape>
	<Shape  id="phone" displayName="Phone" icon="Icons/phone.png">
        <Properties>
			<PropertyGroup>
				<Property name="box" type="Dimension" p:lockRatio="true">285,557</Property>
				<Property name="background" displayName="With Background" type="Bool">false</Property>
			</PropertyGroup>
		</Properties>
		<Behaviors>
			<For ref="bg">
				<Visibility>$background.value</Visibility>
				<Transform>[scale($box.h/557, $box.h/557)]</Transform>
			</For>
			<For ref="phone">
				<Transform>[scale($box.h/557, $box.h/557)]</Transform>
			</For>
		</Behaviors>
		<Actions>
			<Action id="getSnappingGuide">
                <Impl>
                    <![CDATA[
                        var b = this.getBounding();
                        return [
                            new SnappingData("ContentLeft", b.x + 24, "Left", true, this.id),
                            new SnappingData("VCenter", b.x + 144, "VCenter", true, this.id),
                            new SnappingData("ContentTop", b.y + 99 , "Top", false, this.id),
                            new SnappingData("ContentRight", b.x + 264, "Right", true, this.id),
                            new SnappingData("ContentBottom", b.y + 459, "Bottom", false, this.id)
                        ]
                    ]]>
                </Impl>
            </Action>
		</Actions>
		<p:Content xmlns:p="http://www.evolus.vn/Namespace/Pencil"
									xmlns="http://www.w3.org/2000/svg" >
			<image id="phone" width="285" height="557" x="0" y="0" xlink:href="data:image/png;base64, [encoded data, 87796 characters]"/>
			<image id="bg" width="240" height="360" x="24" y="99" xlink:href="data:image/png;base64, iVBORw0KGgoAAAANSUhEUgAAAPAAAAFoCAYAAABpF3YIAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAN1wAADdcBQiibeAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAROSURBVHic7dOhDQIBEEXB5Y6C6ARKoGkUhj4OCBaDwcBLZtwmX6x5u8v1dtq2+3HerOsyj8fz421jY/Mfm/3MHGbmPEDO8usHgO8JGMIEDGEChjABQ5iAIUzAECZgCBMwhAkYwgQMYQKGMAFDmIAhTMAQJmAIEzCECRjCBAxhAoYwAUOYgCFMwBAmYAgTMIQJGMIEDGEChjABQ5iAIUzAECZgCBMwhAkYwgQMYQKGMAFDmIAhTMAQJmAIEzCECRjCBAxhAoYwAUOYgCFMwBAmYAgTMIQJGMIEDGEChjABQ5iAIUzAECZgCBMwhAkYwgQMYQKGMAFDmIAhTMAQJmAIEzCECRjCBAxhAoYwAUOYgCFMwBAmYAgTMIQJGMIEDGEChjABQ5iAIUzAECZgCBMwhAkYwgQMYQKGMAFDmIAhTMAQJmAIEzCECRjCBAxhAoYwAUOYgCFMwBAmYAgTMIQJGMIEDGEChjABQ5iAIUzAECZgCBMwhAkYwgQMYQKGMAFDmIAhTMAQJmAIEzCECRjCBAxhAoYwAUOYgCFMwBAmYAgTMIQJGMIEDGEChjABQ5iAIUzAECZgCBMwhAkYwgQMYQKGMAFDmIAhTMAQJmAIEzCECRjCBAxhAoYwAUOYgCFMwBAmYAgTMIQJGMIEDGEChjABQ5iAIUzAECZgCBMwhAkYwgQMYQKGMAFDmIAhTMAQJmAIEzCECRjCBAxhAoYwAUOYgCFMwBAmYAgTMIQJGMIEDGEChjABQ5iAIUzAECZgCBMwhAkYwgQMYQKGMAFDmIAhTMAQJmAIEzCECRjCBAxhAoYwAUOYgCFMwBAmYAgTMIQJGMIEDGEChjABQ5iAIUzAECZgCBMwhAkYwgQMYQKGMAFDmIAhTMAQJmAIEzCECRjCBAxhAoYwAUOYgCFMwBAmYAgTMIQJGMIEDGEChjABQ5iAIUzAECZgCBMwhAkYwgQMYQKGMAFDmIAhTMAQJmAIEzCECRjCBAxhAoYwAUOYgCFMwBAmYAgTMIQJGMIEDGEChjABQ5iAIUzAECZgCBMwhAkYwgQMYQKGMAFDmIAhTMAQJmAIEzCECRjCBAxhAoYwAUOYgCFMwBAmYAgTMIQJGMIEDGEChjABQ5iAIUzAECZgCBMwhAkYwgQMYQKGMAFDmIAhTMAQJmAIEzCECRjCBAxhAoYwAUOYgCFMwBAmYAgTMIQJGMIEDGEChjABQ5iAIUzAECZgCBMwhAkYwgQMYQKGMAFDmIAhTMAQJmAIEzCECRjCBAxhAoYwAUOYgCFMwBAmYAgTMIQJGMIEDGEChjABQ5iAIUzAECZgCBMwhAkYwgQMYQKGMAFDmIAhTMAQJmAIEzCECRjCBAxhAoYwAUOYgCFMwBAmYAgTMIQJGMIEDGEChjABQ5iAIUzAECZgCBMwhAkYwgQMYQKGMAFDmIAhTMAQJmAIEzCECRjCBAxhAoYwAUOYgCHsBReppYuz7W1IAAAAAElFTkSuQmCC" />
		</p:Content>
	</Shape>
    <Shape id="tablet" displayName="iPad" icon="Icons/ipad.png">
        <Properties>
            <PropertyGroup>
                <Property name="box" type="Dimension" p:lockRatio="true">930,716</Property>
                <Property name="background" displayName="With Background" type="Bool">false</Property>
            </PropertyGroup>
        </Properties>
        <Behaviors>
            <For ref="bg">
                <Visibility>$background.value</Visibility>
                <Transform>[scale($box.h/716, $box.h/716)]</Transform>
            </For>
            <For ref="phone">
                <Transform>[scale($box.h/716, $box.h/716)]</Transform>
            </For>
        </Behaviors>
        <Actions>
            <Action id="getSnappingGuide">
                <Impl>
                    <![CDATA[
                        var b = this.getBounding();
                        return [
                            new SnappingData("ContentLeft", b.x + 81, "Left", true, this.id),
                            new SnappingData("VCenter", b.x + 81 + 768 / 2, "VCenter", true, this.id),
                            new SnappingData("ContentTop", b.y + 70 , "Top", false, this.id),
                            new SnappingData("ContentRight", b.x + 81 + 768, "Right", true, this.id),
                            new SnappingData("HCenter", b.y + 70 + 576 / 2, "HCenter", false, this.id),
                            new SnappingData("ContentBottom", b.y + 70 + 576, "Bottom", false, this.id)
                        ]
                    ]]>
                </Impl>
            </Action>
        </Actions>
        <p:Content xmlns:p="http://www.evolus.vn/Namespace/Pencil"
                                    xmlns="http://www.w3.org/2000/svg" >
            <image id="phone" width="930" height="716" x="0" y="0" xlink:href="data:image/png;base64,[encoded data, 27200 characters]"/>
            <image id="bg" preserveAspectRatio="none" width="768" height="576" x="81" y="70" xlink:href="data:image/png;base64, iVBORw0KGgoAAAANSUhEUgAAAPAAAAFoCAYAAABpF3YIAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAN1wAADdcBQiibeAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAROSURBVHic7dOhDQIBEEXB5Y6C6ARKoGkUhj4OCBaDwcBLZtwmX6x5u8v1dtq2+3HerOsyj8fz421jY/Mfm/3MHGbmPEDO8usHgO8JGMIEDGEChjABQ5iAIUzAECZgCBMwhAkYwgQMYQKGMAFDmIAhTMAQJmAIEzCECRjCBAxhAoYwAUOYgCFMwBAmYAgTMIQJGMIEDGEChjABQ5iAIUzAECZgCBMwhAkYwgQMYQKGMAFDmIAhTMAQJmAIEzCECRjCBAxhAoYwAUOYgCFMwBAmYAgTMIQJGMIEDGEChjABQ5iAIUzAECZgCBMwhAkYwgQMYQKGMAFDmIAhTMAQJmAIEzCECRjCBAxhAoYwAUOYgCFMwBAmYAgTMIQJGMIEDGEChjABQ5iAIUzAECZgCBMwhAkYwgQMYQKGMAFDmIAhTMAQJmAIEzCECRjCBAxhAoYwAUOYgCFMwBAmYAgTMIQJGMIEDGEChjABQ5iAIUzAECZgCBMwhAkYwgQMYQKGMAFDmIAhTMAQJmAIEzCECRjCBAxhAoYwAUOYgCFMwBAmYAgTMIQJGMIEDGEChjABQ5iAIUzAECZgCBMwhAkYwgQMYQKGMAFDmIAhTMAQJmAIEzCECRjCBAxhAoYwAUOYgCFMwBAmYAgTMIQJGMIEDGEChjABQ5iAIUzAECZgCBMwhAkYwgQMYQKGMAFDmIAhTMAQJmAIEzCECRjCBAxhAoYwAUOYgCFMwBAmYAgTMIQJGMIEDGEChjABQ5iAIUzAECZgCBMwhAkYwgQMYQKGMAFDmIAhTMAQJmAIEzCECRjCBAxhAoYwAUOYgCFMwBAmYAgTMIQJGMIEDGEChjABQ5iAIUzAECZgCBMwhAkYwgQMYQKGMAFDmIAhTMAQJmAIEzCECRjCBAxhAoYwAUOYgCFMwBAmYAgTMIQJGMIEDGEChjABQ5iAIUzAECZgCBMwhAkYwgQMYQKGMAFDmIAhTMAQJmAIEzCECRjCBAxhAoYwAUOYgCFMwBAmYAgTMIQJGMIEDGEChjABQ5iAIUzAECZgCBMwhAkYwgQMYQKGMAFDmIAhTMAQJmAIEzCECRjCBAxhAoYwAUOYgCFMwBAmYAgTMIQJGMIEDGEChjABQ5iAIUzAECZgCBMwhAkYwgQMYQKGMAFDmIAhTMAQJmAIEzCECRjCBAxhAoYwAUOYgCFMwBAmYAgTMIQJGMIEDGEChjABQ5iAIUzAECZgCBMwhAkYwgQMYQKGMAFDmIAhTMAQJmAIEzCECRjCBAxhAoYwAUOYgCFMwBAmYAgTMIQJGMIEDGEChjABQ5iAIUzAECZgCBMwhAkYwgQMYQKGMAFDmIAhTMAQJmAIEzCECRjCBAxhAoYwAUOYgCFMwBAmYAgTMIQJGMIEDGEChjABQ5iAIUzAECZgCBMwhAkYwgQMYQKGMAFDmIAhTMAQJmAIEzCECRjCBAxhAoYwAUOYgCHsBReppYuz7W1IAAAAAElFTkSuQmCC" />
        </p:Content>
    </Shape>
</Shapes>
