#dont-use-ie,#info-box-wrapper,#share-container{position:fixed;left:0;width:100vw}#background-display{transition:transform .3s linear;background-position:0 0,1em 1em;background-size:2em 2em}#background-display .show-gradient{width:90%!important;height:215px;margin:0 auto}#background-display.show-social-networks{transform:translatey(-10vh)}#dont-use-ie{top:0;padding:.8em;display:flex;font-size:1.1em;background:#fde073;animation:.5s forwards show-ie;color:#6f5802}#dont-use-ie .text{flex-grow:1;display:flex;justify-content:center;align-items:center}#dont-use-ie .text a{margin:0 5px}#dont-use-ie .close{font-size:1.3em;cursor:pointer;width:1.3em;display:flex;justify-content:center;align-items:center;opacity:.6;transition:.3s}#controls-container .controls-wrapper .control.color .color-delete:hover:not(.disabled),#controls-container .controls-wrapper .gradients-stack .gradients-stack-container>div.highlight,#controls-container .controls-wrapper .gradients-stack .gradients-stack-container>div.highlight .delete:hover,#controls-container .controls-wrapper .gradients-stack .gradients-stack-container>div.highlight .hide:hover,#controls-container .controls-wrapper .gradients-stack .gradients-stack-container>div:hover,#controls-container .controls-wrapper .gradients-stack .gradients-stack-container>div:hover .delete:hover,#controls-container .controls-wrapper .gradients-stack .gradients-stack-container>div:hover .hide:hover,#controls-container .controls-wrapper .user-actions-container>div.share:hover,#dont-use-ie .close:hover,#info-box-wrapper .info-box .close:hover,#info-box-wrapper .info-box .resources li a:hover,#share-container>div:hover{opacity:1}#info-box-wrapper .info-box .close,#share-container>div{width:1em;height:1em;opacity:.8;cursor:pointer;display:flex;transition:.2s}#presets-fullview-container .presets-fullview-close{width:28px;height:28px;background:#4e7affdb;border-radius:5px;position:sticky;top:0;float:right;z-index:10}#presets-fullview-container .presets-fullview-close a{color:azure;font-size:20px;position:absolute;left:7px}#presets-fullview-container{position:absolute;bottom:16%;width:61.7vw;left:3.5%;height:336px;background-color:#152b6c;padding:10px;z-index:5;overflow:auto;transition:.4s ease-in-out;transform:translateY(110%)}#presets-fullview-container.show,#share-container.show{transform:translateY(0)}#presets-fullview-container .presets-wrapper{width:100%;display:grid;grid-template-columns:repeat(auto-fill,90px);grid-gap:12px;overflow:auto;padding:9px 0;position:absolute}#presets-fullview-container .presets-wrapper>div{height:50px;border:2px solid #fff;box-shadow:0 0 1px 2px rgba(180,180,180,.8);border-radius:3px;overflow:hidden;cursor:pointer}#share-container{bottom:0;height:10vh;background-color:#bdc3c7;z-index:1;display:flex;justify-content:center;align-items:center;font-size:2em;transition:transform .3s linear;transform:translateY(100%)}#share-container>div{justify-content:center;align-items:center;margin:0 15px;border-radius:2px;font-family:Socicon!important;color:#fff}#share-container>div i{font-size:.5em}#info-box-wrapper{bottom:0;height:100vh;transition:.3s ease-in-out;z-index:5;background:#c1b6a4}#info-box-wrapper .info-box{padding:50px;position:relative;display:grid;grid-template-columns:15% 60% 15%;grid-template-rows:15% 85%;grid-gap:4em;height:100%}#info-box-wrapper .info-box .logo{grid-column:1/4;grid-row:1;font-size:3.5em;background:0 0/600% 600% padding-box text #dcd9d4;background-image:linear-gradient(90deg,#9795f0,#fbc8d4,#13547a,#80d0c7,#88d3ce,#6e45e2);font-weight:700;display:flex;justify-content:center;align-items:center;-webkit-background-clip:text;color:transparent;font-family:"Fredoka One";animation:30s infinite reverse move-gradient}#info-box-wrapper .info-box h1{font-size:1.5em;margin:15px 0;font-family:Baloo;color:#48443a}#info-box-wrapper .info-box h2{font-size:1.2em;margin:5px 0;font-family:Baloo;color:#48443a}#info-box-wrapper .info-box p{margin:20px 0;font-size:.8em;line-height:1.5em;text-align:justify;color:#48443a}#info-box-wrapper .info-box p:first-child{margin-top:0}#info-box-wrapper .info-box .close{position:absolute;top:3%;right:2%;font-size:2em;font-weight:700;color:#100f0c;justify-content:center;align-items:center}#info-box-wrapper .info-box .howto{position:relative}#info-box-wrapper .info-box .howto .howto-wrapper{column-count:3;column-gap:2.5em}#info-box-wrapper .info-box .howto .howto-wrapper::after,#info-box-wrapper .info-box .howto .howto-wrapper::before{content:"";height:80%;width:1px;background-color:rgba(72,68,58,.1);position:absolute;right:-3.5%;top:10%}#controls-container .controls-wrapper .colors-slider .gradient-bar::before,#controls-container .controls-wrapper .gradients-stack .gradients-stack-container>div .gradient-box-container{background:linear-gradient(45deg,rgba(0,0,0,.0980392) 25%,transparent 25%,transparent 75%,rgba(0,0,0,.0980392) 75%,rgba(0,0,0,.0980392) 0),linear-gradient(45deg,rgba(0,0,0,.0980392) 25%,transparent 25%,transparent 75%,rgba(0,0,0,.0980392) 75%,rgba(0,0,0,.0980392) 0),#fff}#info-box-wrapper .info-box .howto .howto-wrapper::after{left:-3.5%}#info-box-wrapper .info-box .resources li{list-style-type:none;font-size:.9em;line-height:2em}#info-box-wrapper .info-box .resources li a{transition:.2s;opacity:.7;color:#48443a;text-decoration:none}#info-box-wrapper .info-box .resources li a:active,#info-box-wrapper .info-box .resources li a:visited{color:#48443a}#info-box-wrapper .info-box .resources hr{border:.5px solid;width:50%;position:relative;color:rgba(72,68,58,.1)}#controls-container .controls-wrapper{padding:0 20px;box-shadow:2px 0 2px 0 rgba(0,0,0,.15);background-color:#fff;display:grid;grid-template-columns:100px minmax(150px,170px) minmax(200px,250px) 240px minmax(50px,100px);grid-gap:35px;max-width:1040px;left:50%;position:relative;height:100%;transform:translateX(-50%);border:1px solid #286090;top:-50px}#controls-container .controls-wrapper .colors-slider{width:100%;height:40px;margin-top:10px;position:relative;grid-column:1/6;grid-row:1}#controls-container .controls-wrapper .colors-slider::after{position:absolute;bottom:-20px;left:0;width:100%;height:1px;background-color:rgba(128,128,128,.3);content:""}#controls-container .controls-wrapper .colors-slider .gradient-bar{width:100%;border-radius:5px;height:100%;box-shadow:0 0 0 2px #2b2b2b;border:2px solid #fff;cursor:copy;z-index:2}#controls-container .controls-wrapper .colors-slider .gradient-bar::before{background-position:0 0,.5em .5em;background-size:1em 1em;content:"";position:absolute;top:0;left:0;width:100%;height:100%;border-radius:inherit;z-index:-1}#controls-container .controls-wrapper .colors-slider .color-stop{position:absolute;top:0;height:100%;width:10px;z-index:1;transform:translateX(-25%);transition:box-shadow .2s}#controls-container .controls-wrapper .colors-slider .color-stop.selected,#controls-container .controls-wrapper .colors-slider .color-stop.stackTop{z-index:2}#controls-container .controls-wrapper .colors-slider .color-stop.hide,#controls-container .controls-wrapper .control.switch input,#controls-container .controls-wrapper .gradients-stack .gradients-stack-container>div.noneed .delete,#controls-container .controls-wrapper .gradients-stack .gradients-stack-container>div.noneed .hide{display:none}#controls-container .controls-wrapper .colors-slider .color-stop.selected .color-view{box-shadow:0 0 0 2px #2b2b2b,0 0 0 5px rgba(189,195,199,.71)}#controls-container .controls-wrapper .colors-slider .color-stop.selected .stop-input input{box-shadow:inset 0 0 0 2px #bdc3c7;opacity:1;font-size:1em;transform:translate(0,15%)}#controls-container .controls-wrapper .colors-slider .color-stop .color-view{width:20px;height:20px;position:absolute;bottom:100%;left:0;display:flex;justify-content:center;align-content:center;border-radius:40% 60% 100% 0/100% 60% 40% 0;cursor:move;border:2px solid #fff;box-shadow:0 0 0 2px #2b2b2b;transition:box-shadow .2s;transform:rotate(-45deg) translateX(-50%);z-index:1}#controls-container .controls-wrapper .colors-slider .color-stop .color-view:hover{box-shadow:0 0 0 2px #2b2b2b,0 0 0 5px rgba(180,180,180,.6)}#controls-container .controls-wrapper .colors-slider .color-stop .stop-input{position:absolute;bottom:100%;left:0;transform:translate(-50%,-80%)}#controls-container .controls-wrapper .colors-slider .color-stop .stop-input input{border:0 solid gray;text-align:center;outline:0;font-size:.8em;box-shadow:0 0 0 0 gray;transition:.2s;max-width:100%;border-radius:5px;padding:.4em;opacity:.5}#controls-container .controls-wrapper .title{width:20%}#controls-container .controls-wrapper .title h1{position:relative;margin:40px 0 60px;color:#16527a;font-size:2.5em;font-weight:700;line-height:1.2em}#controls-container .controls-wrapper .title h1::after{content:attr(data-title);position:absolute;top:50%;left:50%;font-size:1.7em;line-height:1em;transform:translate(-50%,-50%);opacity:.1;font-weight:700;color:rgba(52,152,219,.9)}#controls-container .controls-wrapper h3{width:100%;text-align:left;text-transform:capitalize;font-size:1em;color:#000;text-indent:5%;margin-top:15px;margin-bottom:10px}#controls-container .controls-wrapper .gradients-stack .gradients-stack-container{max-height:200px;overflow:auto;margin-bottom:10px}#controls-container .controls-wrapper .gradients-stack .gradients-stack-container>div{width:100%;display:grid;grid-template-columns:2fr 1fr;grid-template-rows:1fr 1fr;margin:3px 0;height:50px;cursor:pointer;transition:.3s;opacity:.5;grid-column-gap:2px}#controls-container .controls-wrapper .gradients-stack .gradients-stack-container>div.highlight .delete,#controls-container .controls-wrapper .gradients-stack .gradients-stack-container>div.highlight .hide,#controls-container .controls-wrapper .gradients-stack .gradients-stack-container>div:hover .delete,#controls-container .controls-wrapper .gradients-stack .gradients-stack-container>div:hover .hide{transform:translateX(0)}#controls-container .controls-wrapper .gradients-stack .gradients-stack-container>div .gradient-box-container{grid-column:1;grid-row:1/span 2;border-radius:0;z-index:3;position:relative;display:block;background-position:0 0,.25em .25em;background-size:.5em .5em}#controls-container .controls-wrapper .gradients-stack .gradients-stack-container>div .gradient-box-container .gradient-box{position:absolute;top:0;left:0;width:100%;height:100%}#controls-container .controls-wrapper .gradients-stack .gradients-stack-container>div .hide{transform:translateX(-110%);transition:.2s;grid-column:2;grid-row:2;opacity:.8;cursor:pointer;text-align:center;background-color:#1abc9c;background-position:50% 50%;background-size:90% 90%;background-image:url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjxzdmcgdmVyc2lvbj0iMS4xIiB2aWV3Qm94PSIwIDAgMzIgMzIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgPjx0aXRsZS8+PGRlc2MvPjxkZWZzLz48ZyBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIj48ZyBmaWxsPSIjZmZmZmZmIj48cGF0aCBkPSJNMTcsOSBDOCw5IDQsMTYgNCwxNiBDNCwxNiA4LDIzLjAwMDAwMSAxNywyMyBDMjYsMjIuOTk5OTk5IDMwLDE2IDMwLDE2IEMzMCwxNiAyNiw5IDE3LDkgTDE3LDkgWiBNMTcsMjAgQzE5LjIwOTEzOTEsMjAgMjEsMTguMjA5MTM5MSAyMSwxNiBDMjEsMTMuNzkwODYwOSAxOS4yMDkxMzkxLDEyIDE3LDEyIEMxNC43OTA4NjA5LDEyIDEzLDEzLjc5MDg2MDkgMTMsMTYgQzEzLDE4LjIwOTEzOTEgMTQuNzkwODYwOSwyMCAxNywyMCBMMTcsMjAgWiBNMTcsMTkgQzE4LjY1Njg1NDMsMTkgMjAsMTcuNjU2ODU0MyAyMCwxNiBDMjAsMTQuMzQzMTQ1NyAxOC42NTY4NTQzLDEzIDE3LDEzIEMxNS4zNDMxNDU3LDEzIDE0LDE0LjM0MzE0NTcgMTQsMTYgQzE0LDE3LjY1Njg1NDMgMTUuMzQzMTQ1NywxOSAxNywxOSBMMTcsMTkgWiBNMTcsMTcgQzE3LjU1MjI4NDgsMTcgMTgsMTYuNTUyMjg0OCAxOCwxNiBDMTgsMTUuNDQ3NzE1MiAxNy41NTIyODQ4LDE1IDE3LDE1IEMxNi40NDc3MTUyLDE1IDE2LDE1LjQ0NzcxNTIgMTYsMTYgQzE2LDE2LjU1MjI4NDggMTYuNDQ3NzE1MiwxNyAxNywxNyBMMTcsMTcgWiIvPjwvZz48L2c+PC9zdmc+")}#controls-container .controls-wrapper .gradients-stack .gradients-stack-container>div .hide.hidden{background-image:url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjxzdmcgIHZlcnNpb249IjEuMSIgdmlld0JveD0iMCAwIDMyIDMyIiAgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48dGl0bGUvPjxkZXNjLz48ZGVmcy8+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIiBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSI+PGcgZmlsbD0iI2ZmZmZmZiI+PHBhdGggZD0iTTguMTA4Njk4OTEsMjAuODkxMzAxMSBDNC42MTcyMDgxNiwxOC44MzAxMTQ3IDMsMTYgMywxNiBDMywxNiA3LDkgMTYsOSBDMTcuMzA0NTEwNyw5IDE4LjUwMzk3NTIsOS4xNDcwNjQ2NiAxOS42MDE0Mzg4LDkuMzk4NTYxMjIgTDE2Ljg5ODY1MzEsMTIuMTAxMzQ2OSBDMTYuNjA5Nzg4NSwxMi4wMzUwMzQyIDE2LjMwODk4NTYsMTIgMTYsMTIgQzEzLjc5MDg2MDksMTIgMTIsMTMuNzkwODYwOSAxMiwxNiBDMTIsMTYuMzA4OTg1NiAxMi4wMzUwMzQyLDE2LjYwOTc4ODUgMTIuMTAxMzQ2OSwxNi44OTg2NTMxIEw4LjEwODY5ODkxLDIwLjg5MTMwMTEgTDguMTA4Njk4OTEsMjAuODkxMzAxMSBMOC4xMDg2OTg5MSwyMC44OTEzMDExIFogTTEyLjM5ODU2MSwyMi42MDE0MzkgQzEzLjQ5NjAyNDYsMjIuODUyOTM1NiAxNC42OTU0ODkyLDIzLjAwMDAwMDEgMTYsMjMgQzI1LDIyLjk5OTk5OSAyOSwxNiAyOSwxNiBDMjksMTYgMjcuMzgyNzkxOCwxMy4xNjk4ODU2IDIzLjg5MTMwMDgsMTEuMTA4Njk5MiBMMTkuODk4NjUzMSwxNS4xMDEzNDY5IEMxOS45NjQ5NjU4LDE1LjM5MDIxMTUgMjAsMTUuNjkxMDE0NCAyMCwxNiBDMjAsMTguMjA5MTM5MSAxOC4yMDkxMzkxLDIwIDE2LDIwIEMxNS42OTEwMTQ0LDIwIDE1LjM5MDIxMTUsMTkuOTY0OTY1OCAxNS4xMDEzNDY5LDE5Ljg5ODY1MzEgTDEyLjM5ODU2MSwyMi42MDE0MzkgTDEyLjM5ODU2MSwyMi42MDE0MzkgTDEyLjM5ODU2MSwyMi42MDE0MzkgWiBNMTksMTYgQzE5LjAwMDAwMDEsMTYuNzY3NzY2OSAxOC43MDcxMDY4LDE3LjUzNTUzMzkgMTguMTIxMzIwMywxOC4xMjEzMjAzIEMxNy41MzU1MzM5LDE4LjcwNzEwNjggMTYuNzY3NzY2OSwxOS4wMDAwMDAxIDE2LDE5IEwxOSwxNiBMMTksMTYgTDE5LDE2IFogTTE2LDEzIEMxNS4yMzIyMzMxLDEyLjk5OTk5OTkgMTQuNDY0NDY2MSwxMy4yOTI4OTMyIDEzLjg3ODY3OTcsMTMuODc4Njc5NyBDMTMuMjkyODkzMiwxNC40NjQ0NjYxIDEyLjk5OTk5OTksMTUuMjMyMjMzMSAxMywxNiBMMTYsMTMgTDE2LDEzIEwxNiwxMyBaIE0yNCw3IEw3LDI0IEw4LDI1IEwyNSw4IEwyNCw3IEwyNCw3IFoiLz48L2c+PC9nPjwvc3ZnPg==")}#controls-container .controls-wrapper .gradients-stack .gradients-stack-container>div .delete{transform:translateX(-110%);transition:.2s;cursor:pointer;text-align:center;font-size:1.2em;font-weight:700;background-color:#e74c3c;color:#fff;grid-column:2;grid-row:1;opacity:.8}#controls-container .controls-wrapper .gradients-stack .add-gradient{font-size:15px;cursor:pointer}#controls-container .controls-wrapper .colors-options-container{display:flex;flex-wrap:wrap;position:relative;align-content:flex-start}#controls-container .controls-wrapper .colors-options-container::after,#controls-container .controls-wrapper .colors-options-container::before{position:absolute;top:10%;right:-12.5px;height:80%;width:1px;background-color:rgba(128,128,128,.1);content:""}#controls-container .controls-wrapper .colors-options-container::before{left:-12.5px}#controls-container .controls-wrapper .colors-options-container .colors-options-top{width:100%;display:grid;justify-items:center;grid-template-columns:1fr 1fr 1fr}#controls-container .controls-wrapper .colors-options-container .colors-options-bottom{justify-content:center;display:flex;width:100%;padding:1em 0;flex-direction:column;min-height:150px}#controls-container .controls-wrapper .color-stops-container .vc-chrome{width:100%;box-shadow:0 0 1px 0 gray}#controls-container .controls-wrapper .color-stops-container .vc-chrome .vc-chrome-saturation-wrap .vc-saturation-circle{transform:translate(-50%,-50%);box-shadow:0 0 0 2px #fff,inset 0 0 1px 2px rgba(0,0,0,.5),0 0 1px 1px #000}#controls-container .controls-wrapper .color-presets-container,#controls-container .controls-wrapper .user-actions-container{display:flex;flex-direction:column}#controls-container .controls-wrapper .color-presets-container .user-generated{border-bottom:1px solid rgba(180,180,180,.4);display:grid;width:100%;grid-template-columns:70% 30%;padding:10px}#controls-container .controls-wrapper .color-presets-container .user-generated .user-presets{display:grid;grid-template-columns:repeat(auto-fill,35px);grid-gap:10px;padding:5px 0}#controls-container .controls-wrapper .color-presets-container .user-generated .user-presets::after{content:"";background-color:rgba(180,180,180,.4);position:absolute;right:0;top:20%;height:80%;width:1px}#controls-container .controls-wrapper .color-presets-container .user-generated .user-presets>span{height:35px;cursor:pointer;border-radius:3px;border:2px solid #fff;box-shadow:0 0 0 1px rgba(0,0,0,.3);position:relative;z-index:1;transition:.2s}#controls-container .controls-wrapper .color-presets-container .user-generated .user-presets>span.selected{box-shadow:0 0 4px 3px rgba(0,0,0,.7)}#controls-container .controls-wrapper .color-presets-container .user-generated .presets-actions{display:flex;justify-content:space-around;padding:5px 0}#controls-container .controls-wrapper .color-presets-container .user-generated .presets-actions>div{filter:grayscale(1);opacity:.2;cursor:default;transition:.2s;width:45%;color:#00a5d2;display:flex;justify-content:center;align-items:center;border:1px solid;border-radius:2px;font-size:.9em;padding:5px;background-color:#6ce0ff}#controls-container .controls-wrapper .color-presets-container .user-generated .presets-actions>div.save-preset{color:#1b7943;background-color:#54d98c}#controls-container .controls-wrapper .color-presets-container .user-generated .presets-actions.enable-apply .apply-preset,#controls-container .controls-wrapper .color-presets-container .user-generated .presets-actions.enable-save .save-preset{opacity:1;cursor:pointer;filter:grayscale(0)}#controls-container .controls-wrapper .color-presets-container .user-generated .presets-actions.enable-apply .apply-preset:hover,#controls-container .controls-wrapper .color-presets-container .user-generated .presets-actions.enable-save .save-preset:hover{opacity:.7}#controls-container .controls-wrapper .color-presets-container .other-presets{display:grid;grid-template-columns:repeat(auto-fill,35px);grid-gap:10px;padding:10px;max-height:220px;overflow:auto;width:100%}#controls-container .controls-wrapper .color-presets-container .other-presets>.gradient-div{height:35px;cursor:pointer;border-radius:3px;border:2px solid #fff;box-shadow:0 0 0 1px rgba(0,0,0,.3);position:relative;z-index:1}#controls-container .controls-wrapper .color-presets-container .more-presets{font-size:15px;margin:10px;cursor:pointer}#controls-container .controls-wrapper .user-actions-container>button{opacity:1;font-size:15px;margin:10px 0;cursor:pointer}#controls-container .controls-wrapper .user-actions-container>div.share{animation:15s infinite forwards share-btn;color:#fff;opacity:.8;background-color:#9b59b6}@keyframes share-btn{10%{background-color:#3b5999;border-color:#3b5999}20%{background-color:#dd4b39;border-color:#dd4b39}30%{background-color:#ff5700;border-color:#ff5700}40%{background-color:#55acee;border-color:#55acee}50%{background-color:#0077b5;border-color:#0077b5}60%{background-color:#bd081c;border-color:#bd081c}70%{background-color:#34465d;border-color:#34465d}80%{background-color:#f57d00;border-color:#f57d00}90%{background-color:#c71610;border-color:#c71610}100%{background-color:#21759b;border-color:#21759b}}#controls-container .controls-wrapper .control{display:flex;font-size:.7em}#controls-container .controls-wrapper .control.toggle{color:#fff;cursor:pointer;text-align:center;text-transform:uppercase;height:3em;width:3em}#controls-container .controls-wrapper .control.toggle>div{display:flex;width:100%;padding:.3em;background-color:#3498db;border-radius:5px;transition:.3s;opacity:1;position:relative}#controls-container .controls-wrapper .control.toggle>div:after{content:attr(data-tip);position:absolute;top:0;left:50%;transform:translate(-50%,0) scale(0);background-color:inherit;border-radius:3px;padding:.3em .5em;opacity:0;transition:.3s;pointer-events:none}#controls-container .controls-wrapper .control.toggle>div:hover{background-color:#258cd1}#controls-container .controls-wrapper .control.toggle>div:hover:after{transform:translate(-50%,-150%) scale(1);opacity:1}#controls-container .controls-wrapper .control.toggle>div.off{opacity:.5}#controls-container .controls-wrapper .control.toggle>div .icon{flex-grow:1;background-repeat:no-repeat;padding:10px;display:block}#controls-container .controls-wrapper .control.range{padding:.9em 0;width:100%;position:relative;display:flex}#controls-container .controls-wrapper .control.range .title{width:100%;text-align:left;text-transform:capitalize;display:inline-block!important;font-size:1.1em;position:absolute;top:0;color:rgb(45 45 45);text-indent:10%;pointer-events:none;transition:.2s;z-index:-1;line-height:1;padding:0;margin:0}#controls-container .controls-wrapper .control.range .amount{width:20%;display:inline-flex;font-size:.7em;color:#000;justify-content:flex-end;align-items:center}#controls-container .controls-wrapper .control.range .range{width:75%;display:inline-flex;align-items:center}#controls-container .controls-wrapper .control.color{margin-bottom:10px;width:100%;border:1px solid rgba(180,180,180,.7);border-radius:5px;overflow:hidden;padding:3px 5px}#controls-container .controls-wrapper .control.color>span{box-sizing:border-box;display:flex;justify-content:center;align-items:center}#controls-container .controls-wrapper .control.color .color-box{width:20%;position:relative}#controls-container .controls-wrapper .control.color .color-box>span{position:absolute;top:10%;left:10%;width:80%;height:80%;cursor:pointer}#controls-container .controls-wrapper .control.color .color-box>span::after,#controls-container .controls-wrapper .control.color .color-box>span::before{position:absolute;top:0;right:-30%;height:100%;width:1px;background-color:rgba(180,180,180,.7);content:""}#controls-container .controls-wrapper .control.color .color-box>span::before{left:-30%}#controls-container .controls-wrapper .control.color .color-input{flex-grow:1}#controls-container .controls-wrapper .control.color .color-stop{width:30%}#controls-container .controls-wrapper .control.color .color-stop input{text-align:center}#controls-container .controls-wrapper .control.color .color-delete{width:10%;transition:.2s;font-size:2em;cursor:pointer;opacity:.5}#controls-container .controls-wrapper .control.color .color-delete.disabled{opacity:0;cursor:default}#controls-container .controls-wrapper .control.color input{padding:5px 10px;border:0 solid gray;width:100%;outline:0}#controls-container .controls-wrapper .control.circle{position:relative;justify-content:center}#controls-container .controls-wrapper .control.circle svg g circle:last-child{cursor:pointer}#controls-container .controls-wrapper .control.circle .amount{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:1.5em;text-align:center;display:flex;flex-direction:column}#controls-container .controls-wrapper .control.circle .amount input{border:0 solid;width:auto;text-align:center;font-size:1.2em}#controls-container .controls-wrapper .control.circle .amount span:last-child{font-size:.7em}#controls-container .controls-wrapper .control.switch{display:flex;margin:1.2em 0;color:rgba(180,180,180,.5);flex-direction:column}#controls-container .controls-wrapper .control.switch input:checked+label{background-color:#3498db}#controls-container .controls-wrapper .control.switch input:checked+label .switch{left:55%}#controls-container .controls-wrapper .control.switch label{width:30px;height:15px;border-radius:10px;background-color:gray;display:inline-block;margin-right:10px;position:relative;transition:.3s;cursor:pointer}#controls-container .controls-wrapper .control.switch label span{background-color:#fff;height:80%;width:40%;position:absolute;border-radius:50%;left:5%;top:8%;transition:.3s}input[type=range]{border:1px solid transparent;width:100%;-webkit-appearance:none}input[type=range]::-webkit-slider-runnable-track{width:100%;height:3px;background:#ddd;border:none;border-radius:3px;transition:.2s}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;border:none;height:10px;width:10px;border-radius:50%;background:#3498db;margin-top:-4px}input[type=range]:focus{outline:0}input[type=range]:focus::-moz-range-track{background:#75b9e7}input[type=range]:focus::-webkit-slider-runnable-track{background:#75b9e7}input[type=range]:focus::-ms-fill-lower{background:#75b9e7}input[type=range]:focus::-ms-fill-upper{background:#75b9e7}input[type=range]::-moz-range-track{width:100%;height:3px;background:#ddd;border:none;border-radius:3px;transition:.2s;z-index:2}input[type=range]::-moz-range-thumb{border:none;height:10px;width:10px;border-radius:50%;background:#3498db;z-index:2}input[type=range]:-moz-focusring{outline:white solid 1px;outline-offset:-1px}input[type=range]::-ms-track{width:100%;height:3px;background:0 0;border-color:transparent;border-width:6px 0;color:transparent}input[type=range]::-ms-fill-lower{background:#ddd;border-radius:10px}input[type=range]::-ms-fill-upper{background:#ddd;border-radius:10px}input[type=range]::-ms-thumb{border:none;height:10px;width:10px;border-radius:50%;background:#3498db;transform:translateY(20%)}@keyframes move-gradient{0%,100%{background-position:0 50%}50%{background-position:100% 50%}}.hide-background-enter-active{animation:1.5s ease-in reverse forwards hide-background}.hide-background-leave-active{animation:1s ease-in forwards hide-background}@keyframes hide-background{0%{transform:scale(1) perspective(500px) rotateX(0)}50%{transform:scale(.8) perspective(500px) rotateX(2deg)}100%{transform:scale(.8) perspective(500px) rotateX(2deg) translatey(-120%)}}.show-info-enter-active{animation:1s ease-in forwards show-info}.show-info-leave-active{animation:1s reverse forwards show-info}@keyframes show-info{0%,50%{transform:translateY(100%);opacity:0}100%{transform:translateY(0);opacity:1}}@keyframes show-ie{0%{transform:translateY(-100%)}100%{transform:translateY(0)}}@media screen and (max-width:1691px){#controls-container .controls-wrapper{grid-template-columns:22% minmax(38px,117px) minmax(166px,152px) 212px minmax(50px,100px)}}@media screen and (max-width:1530px){#controls-container .controls-wrapper{grid-template-columns:16% minmax(108px,110px) minmax(127px,30px) 205px minmax(87px,68px)}}@media screen and (max-width:1467px){#controls-container .controls-wrapper{grid-template-columns:10% minmax(108px,110px) minmax(127px,30px) 205px minmax(87px,68px)}}@media screen and (max-width:1411px){#controls-container .controls-wrapper{display:inline-block}#background-display .show-gradient{width:70%!important}}