:root{--menu-back-color:#222;--menu-fore-color:#ccc;--menu-fore-color-active:#fff;--icon-dark:#333;--icon-light:#5a5a5a;--icon-active:#ccc}body,html{margin:0;padding:0;overflow:hidden;font-family:-apple-system,BlinkMacSystemFont,myriad-pro,sans-serif;font-weight:400;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}table{border-spacing:0;border-collapse:collapse}table td,table tr,ul{padding:0}ul{list-style:none;margin:0}body,body>table,html{height:100vh;width:100vw}svg{width:20px}a{text-decoration:none}h4{margin:10px auto 5px}p{margin:0 auto 10px}input[type=text]{background-color:hsla(0,0%,100%,.067);border:none;color:#fff;height:32px;text-align:center;padding:0}input[type=text]:not(:last-child){-webkit-box-shadow:inset -3px 0 0 #242425;box-shadow:inset -3px 0 0 #242425}.perspective{background-color:#222;position:relative;overflow:hidden}.page{width:100%;height:100%;position:absolute;top:0;overflow:hidden;pointer-events:none}.page-download{height:360px}.page-legal{height:calc(100vh - 100px)}.page-download,.page-help,.page-legal{background:#fff;-webkit-transition:opacity .5s ease;-moz-transition:opacity .5s ease;-o-transition:opacity .5s ease;-ms-transition:opacity .5s ease;transition:opacity .5s ease;opacity:0;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";filter:alpha(opacity=0);width:540px;margin-left:calc(50% - 270px);margin-top:50px;padding:20px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;overflow:auto;border-radius:5px;-webkit-box-shadow:0 0 0 9999px rgba(0,0,0,.8),0 20px 40px #000;box-shadow:0 0 0 9999px rgba(0,0,0,.8),0 20px 40px #000}.page-download h1,.page-help h1,.page-legal h1{margin-top:0}.page-download .close,.page-help .close,.page-legal .close{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border:none;position:absolute;right:10px;top:20px;outline:none;cursor:pointer}.page-download .close svg,.page-help .close svg,.page-legal .close svg{width:14px;height:14px;opacity:.75;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=75)";filter:alpha(opacity=75)}.page-download>div,.page-help>div,.page-legal>div{font-size:.7em;padding:.5em 2em}.page-download>div:first-child,.page-help>div:first-child,.page-legal>div:first-child{padding-top:15em}.download-options{margin-top:70px}.download-options li{width:33.3333%;float:left;text-align:center;padding:20px 0}.download-options li:nth-child(2){-webkit-box-shadow:1px 0 0 rgba(0,0,0,.08),-1px 0 0 rgba(0,0,0,.08);box-shadow:1px 0 0 rgba(0,0,0,.08),-1px 0 0 rgba(0,0,0,.08)}.download-options li a{display:block;width:100%;color:var(--menu-back-color)}.download-options svg{width:56px;height:56px;margin-bottom:10px}.page-current{opacity:1;-ms-filter:none;filter:none;pointer-events:auto}.menu{position:relative;background-color:var(--menu-back-color);color:var(--menu-fore-color);overflow:hidden;width:50px;vertical-align:top;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.menu .svg-logo path{-webkit-transition:all .3s ease;-moz-transition:all .3s ease;-o-transition:all .3s ease;-ms-transition:all .3s ease;transition:all .3s ease}.menu .link{cursor:pointer;margin-top:6px}.menu .link a{width:100%;display:inline-block}.menu .link:hover{color:var(--menu-fore-color-active);background:rgba(0,0,0,.2)}.menu a{color:var(--menu-fore-color)}.menu svg{overflow:visible;width:28px;padding:5px;vertical-align:middle}.menu path{fill:var(--icon-light)}.menu li{width:38px;overflow:hidden;white-space:nowrap;border-radius:5px;margin:0 6px}.menu div{display:inline-block;-webkit-transition:width .5s;-moz-transition:width .5s;-o-transition:width .5s;-ms-transition:width .5s;transition:width .5s;width:0;overflow:hidden;font-size:14px;font-weight:500;vertical-align:middle}.menu:hover div{width:200px}.menu:hover li{width:auto;overflow:auto}.menu>ul>li:hover .svg-download path,.menu>ul>li:hover .svg-gear path,.menu>ul>li:hover .svg-github path,.menu>ul>li:hover .svg-logo path,.menu>ul>li:hover .svg-twitter path{fill:var(--icon-active)}.menu>ul>li:hover .svg-download .drop,.menu>ul>li:hover .svg-gear .drop,.menu>ul>li:hover .svg-github .drop,.menu>ul>li:hover .svg-logo .drop,.menu>ul>li:hover .svg-twitter .drop{fill:#ef689a}.menu .svg-scheme{list-style:none}.menu .svg-scheme circle{fill:var(--icon-dark)}.menu .menu-btm{position:absolute;bottom:6px}.menu .menu-btm svg{width:20px;padding:6px 9px}.menu .menu-none .svg-scheme circle{display:inherit}.menu .menu-analogic-complement .svg-scheme .n,.menu .menu-analogic-complement .svg-scheme .ne,.menu .menu-analogic-complement .svg-scheme .nw,.menu .menu-analogic-complement .svg-scheme .s,.menu .menu-analogic .svg-scheme .e,.menu .menu-analogic .svg-scheme .n,.menu .menu-analogic .svg-scheme .ne,.menu .menu-analogic .svg-scheme .nw,.menu .menu-analogic .svg-scheme .w,.menu .menu-complement .svg-scheme .n,.menu .menu-complement .svg-scheme .ne,.menu .menu-complement .svg-scheme .nw,.menu .menu-complement .svg-scheme .s,.menu .menu-monochrome-dark .svg-scheme .e,.menu .menu-monochrome-dark .svg-scheme .n,.menu .menu-monochrome-dark .svg-scheme .ne,.menu .menu-monochrome-dark .svg-scheme .w,.menu .menu-monochrome-light .svg-scheme .e,.menu .menu-monochrome-light .svg-scheme .n,.menu .menu-monochrome-light .svg-scheme .nw,.menu .menu-monochrome-light .svg-scheme .w,.menu .menu-monochrome .svg-scheme .e,.menu .menu-monochrome .svg-scheme .n,.menu .menu-monochrome .svg-scheme .ne,.menu .menu-monochrome .svg-scheme .nw,.menu .menu-monochrome .svg-scheme .w,.menu .menu-quad .svg-scheme .ne,.menu .menu-quad .svg-scheme .nw,.menu .menu-quad .svg-scheme .se,.menu .menu-quad .svg-scheme .sw,.menu .menu-triad .svg-scheme .n,.menu .menu-triad .svg-scheme .ne,.menu .menu-triad .svg-scheme .nw,.menu .menu-triad .svg-scheme .se,.menu .menu-triad .svg-scheme .sw{fill:var(--icon-light)}.menu li.active.menu-none .n,.menu li:hover.menu-none .n{fill:#df2020}.menu li.active.menu-none .ne,.menu li:hover.menu-none .ne{fill:#dfaf20}.menu li.active.menu-none .e,.menu li:hover.menu-none .e{fill:#80df20}.menu li.active.menu-none .se,.menu li:hover.menu-none .se{fill:#20df50}.menu li.active.menu-none .s,.menu li:hover.menu-none .s{fill:#20dfdf}.menu li.active.menu-none .sw,.menu li:hover.menu-none .sw{fill:#2050df}.menu li.active.menu-none .w,.menu li:hover.menu-none .w{fill:#7f20df}.menu li.active.menu-none .nw,.menu li:hover.menu-none .nw{fill:#df20af}.menu li.active.menu-monochrome .w,.menu li:hover.menu-monochrome .w{fill:#bd0f0f}.menu li.active.menu-monochrome .nw,.menu li:hover.menu-monochrome .nw{fill:#cf1717}.menu li.active.menu-monochrome .n,.menu li:hover.menu-monochrome .n{fill:#df2020}.menu li.active.menu-monochrome .ne,.menu li:hover.menu-monochrome .ne{fill:#dd3c3c}.menu li.active.menu-monochrome .e,.menu li:hover.menu-monochrome .e{fill:#db5757}.menu li.active.menu-monochrome-dark .w,.menu li:hover.menu-monochrome-dark .w{fill:#595959}.menu li.active.menu-monochrome-dark .n,.menu li:hover.menu-monochrome-dark .n{fill:#d92626}.menu li.active.menu-monochrome-dark .ne,.menu li:hover.menu-monochrome-dark .ne{fill:#e96363}.menu li.active.menu-monochrome-dark .e,.menu li:hover.menu-monochrome-dark .e{fill:#f5a3a3}.menu li.active.menu-monochrome-light .w,.menu li:hover.menu-monochrome-light .w{fill:#981b1b}.menu li.active.menu-monochrome-light .nw,.menu li:hover.menu-monochrome-light .nw{fill:#df2020}.menu li.active.menu-monochrome-light .n,.menu li:hover.menu-monochrome-light .n{fill:#ed5e5e}.menu li.active.menu-monochrome-light .e,.menu li:hover.menu-monochrome-light .e{fill:#ccc}.menu li.active.menu-analogic .w,.menu li:hover.menu-analogic .w{fill:#2424a8}.menu li.active.menu-analogic .nw,.menu li:hover.menu-analogic .nw{fill:#c322c3}.menu li.active.menu-analogic .n,.menu li:hover.menu-analogic .n{fill:#df2020}.menu li.active.menu-analogic .ne,.menu li:hover.menu-analogic .ne{fill:#e8e830}.menu li.active.menu-analogic .e,.menu li:hover.menu-analogic .e{fill:#42f042}.menu li.active.menu-analogic-complement .nw,.menu li:hover.menu-analogic-complement .nw{fill:#c322c3}.menu li.active.menu-analogic-complement .n,.menu li:hover.menu-analogic-complement .n{fill:#df2020}.menu li.active.menu-analogic-complement .ne,.menu li:hover.menu-analogic-complement .ne{fill:#e8e830}.menu li.active.menu-analogic-complement .s,.menu li:hover.menu-analogic-complement .s{fill:#20dfdf}.menu li.active.menu-complement .nw,.menu li:hover.menu-complement .nw{fill:#c32222}.menu li.active.menu-complement .n,.menu li:hover.menu-complement .n{fill:#df2020}.menu li.active.menu-complement .ne,.menu li:hover.menu-complement .ne{fill:#e83030}.menu li.active.menu-complement .s,.menu li:hover.menu-complement .s{fill:#20dfdf}.menu li.active.menu-triad .nw,.menu li:hover.menu-triad .nw{fill:#c32222}.menu li.active.menu-triad .n,.menu li:hover.menu-triad .n{fill:#df2020}.menu li.active.menu-triad .ne,.menu li:hover.menu-triad .ne{fill:#e83030}.menu li.active.menu-triad .sw,.menu li:hover.menu-triad .sw{fill:#20df20}.menu li.active.menu-triad .se,.menu li:hover.menu-triad .se{fill:#2020df}.menu li.active.menu-quad .nw,.menu li:hover.menu-quad .nw{fill:#df2020}.menu li.active.menu-quad .ne,.menu li:hover.menu-quad .ne{fill:#80df20}.menu li.active.menu-quad .se,.menu li:hover.menu-quad .se{fill:#20dfdf}.menu li.active.menu-quad .sw,.menu li:hover.menu-quad .sw{fill:#7f20df}.swatches{display:-webkit-box;display:-moz-box;display:-webkit-flex;display:-ms-flexbox;display:box;display:flex;height:100vh}.swatches .swatch{-webkit-box-flex:calc(100vw/var(--swatch-count));-moz-box-flex:calc(100vw/var(--swatch-count));-o-box-flex:calc(100vw/var(--swatch-count));box-flex:calc(100vw/var(--swatch-count));-webkit-flex:calc(100vw/var(--swatch-count)) 0 1;-ms-flex:calc(100vw/var(--swatch-count)) 0 1;flex:calc(100vw/var(--swatch-count)) 0 1;color:var(--fore-color);background-color:var(--back-color);position:relative;font-size:14px}.swatches .swatch.edit{-webkit-transition:none;-moz-transition:none;-o-transition:none;-ms-transition:none;transition:none}.swatches .swatch.add,.swatches .swatch.add-scheme,.swatches .swatch.remove-scheme{cursor:pointer;-webkit-box-flex:1;-moz-box-flex:1;-o-box-flex:1;box-flex:1;-webkit-flex:0 0 50px;-ms-flex:0 0 50px;flex:0 0 50px}.swatches .swatch.add-scheme:hover path,.swatches .swatch.add:hover path,.swatches .swatch.remove-scheme:hover path{fill:var(--icon-active)}.swatches .swatch b{font-weight:500}.swatches .swatch svg{margin:7px}.swatches .swatch path{fill:var(--fore-color)}.swatches .swatch .svg-minus path,.swatches .swatch .svg-plus path{fill:var(--icon-light)}.swatches .swatch .pos-a,.swatches .swatch .pos-b,.swatches .swatch .pos-c,.swatches .swatch .pos-l,.swatches .swatch .pos-r,.swatches .swatch .pos-t{position:absolute;top:50vh;left:50%;-webkit-transform:translate(-50%,-50%);-moz-transform:translate(-50%,-50%);-o-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);transform:translate(-50%,-50%);padding:5px;border-radius:50px;font-size:0;-webkit-transition:all .15ms ease;-moz-transition:all .15ms ease;-o-transition:all .15ms ease;-ms-transition:all .15ms ease;transition:all .15ms ease}.swatches .swatch .pos-b,.swatches .swatch .pos-l,.swatches .swatch .pos-r,.swatches .swatch .pos-t{cursor:pointer;opacity:.25;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=25)";filter:alpha(opacity=25)}.swatches .swatch .pos-b:hover,.swatches .swatch .pos-l:hover,.swatches .swatch .pos-r:hover,.swatches .swatch .pos-t:hover{opacity:1;-ms-filter:none;filter:none}.swatches .swatch .pos-c{top:calc(100% - 100px)}.swatches .swatch .pos-b{top:calc(100% - 50px)}.swatches .swatch .pos-l{left:calc(50% - 50px)}.swatches .swatch .pos-r{left:calc(50% + 50px)}.swatches .swatch .pos-c{font-size:18px;text-transform:uppercase;font-weight:500;white-space:nowrap}.swatches .swatch .marker{position:absolute;background-color:var(--fore-color);width:8px;height:8px;border-radius:4px;margin:-4px 0 0 -4px}.swatches .swatch .preview{height:100vh;position:relative;-webkit-transition:height .3s ease;-moz-transition:height .3s ease;-o-transition:height .3s ease;-ms-transition:height .3s ease;transition:height .3s ease}.swatches .swatch.lifted .preview{height:calc(100vh - 400px)}.swatches .swatch.lifted .pos-l,.swatches .swatch.lifted .pos-r,.swatches .swatch.lifted .pos-t{opacity:0;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";filter:alpha(opacity=0)}.swatches .swatch .details{min-width:300px;height:400px;background-color:#242425;color:#ddd;text-transform:uppercase}.swatches .swatch .edit-color{white-space:nowrap;text-align:center;padding:2px 0}.swatches .swatch .edit-color.active{color:#fff}.swatches .swatch .edit-color.active .hint--left{position:relative}.swatches .swatch .edit-color.active .hint--left:before{content:"";position:absolute;left:-12px;top:6px;border-radius:4px;width:6px;height:6px;background:#fff}.swatches .swatch .hint--left{cursor:pointer;display:inline-block;width:50px;text-align:left}.swatches .swatch input[type=text]{width:60px;font-size:14px;text-transform:uppercase}.swatches .swatch input[type=text]:first-of-type{border-top-left-radius:5px;border-bottom-left-radius:5px}.swatches .swatch input[type=text]:last-of-type{border-top-right-radius:5px;border-bottom-right-radius:5px}.swatches .swatch input[type=text][data-type=hex]{width:180px}.swatches .swatch input[type=text][data-type=cmyk]{width:45px}.swatches .swatch .inputs{padding:30px 0}.swatches .swatch input[type=range]{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;width:180px;outline:none}.swatches .swatch input[type=range]::-webkit-slider-runnable-track{height:6px;background:-webkit-linear-gradient(left,var(--bg-0),var(--bg-1) 10%,var(--bg-2) 20%,var(--bg-3) 30%,var(--bg-4) 40%,var(--bg-5) 50%,var(--bg-6) 60%,var(--bg-7) 70%,var(--bg-8) 80%,var(--bg-9) 90%,var(--bg-10));background:-moz-linear-gradient(left,var(--bg-0) 0,var(--bg-1) 10%,var(--bg-2) 20%,var(--bg-3) 30%,var(--bg-4) 40%,var(--bg-5) 50%,var(--bg-6) 60%,var(--bg-7) 70%,var(--bg-8) 80%,var(--bg-9) 90%,var(--bg-10) 100%);background:-o-linear-gradient(left,var(--bg-0) 0,var(--bg-1) 10%,var(--bg-2) 20%,var(--bg-3) 30%,var(--bg-4) 40%,var(--bg-5) 50%,var(--bg-6) 60%,var(--bg-7) 70%,var(--bg-8) 80%,var(--bg-9) 90%,var(--bg-10) 100%);background:-ms-linear-gradient(left,var(--bg-0) 0,var(--bg-1) 10%,var(--bg-2) 20%,var(--bg-3) 30%,var(--bg-4) 40%,var(--bg-5) 50%,var(--bg-6) 60%,var(--bg-7) 70%,var(--bg-8) 80%,var(--bg-9) 90%,var(--bg-10) 100%);background:linear-gradient(90deg,var(--bg-0) 0,var(--bg-1) 10%,var(--bg-2) 20%,var(--bg-3) 30%,var(--bg-4) 40%,var(--bg-5) 50%,var(--bg-6) 60%,var(--bg-7) 70%,var(--bg-8) 80%,var(--bg-9) 90%,var(--bg-10));border-radius:9999px}.swatches .swatch input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#fff;width:18px;height:18px;margin-top:-6px;border-radius:20px}.swatches .swatch .sliders table{margin:0 auto;width:234px}.swatches .swatch .sliders td{padding:4px 0}.swatches .swatch .sliders td:last-child{text-align:right}#cookie-info{position:fixed;bottom:15px;right:15px;background:#000;color:#ccc;font-weight:500;padding:12px 18px;border-radius:5px;text-align:center;cursor:pointer}#cookie-info.hidden{-webkit-transform:translateY(50px);-moz-transform:translateY(50px);-o-transform:translateY(50px);-ms-transform:translateY(50px);transform:translateY(50px);visibility:hidden}#cookie-info .close{padding-left:15px}