.row{width:100%;max-width:76rem;margin:0 auto}.row:before,.row:after{content:" ";display:table}.row:after{clear:both}




	a{text-decoration:none;color:#1F2667}a:active,a:focus{outline:none}input{color:#1F2667;font-weight:600}
	input:focus{outline:none}button:focus,button:active{outline:none}
	.nav{position:relative;height:64px;background:#fff;border-bottom:1px solid #DFE1E6;z-index:5}

			
			@media (min-width: 641px){.nav-logo__image{top:8px;width:auto}}.nav-logo__title{display:inline-block;margin:0;padding:0;font-size:21px;font-weight:700;line-height:64px;padding-left:2px}
	
	@media only screen and (min-width: 641px){.nav-logo__title{font-size:24px;padding-left:8px}}.nav-by{display:none;margin-left:10px}@media only screen and (min-width: 641px){.nav-by{display:inline-block}}.nav-twitter{display:none;background:#fff;font-weight:600;font-size:14px;display:inline-block;padding:5px 7px;border-radius:4px;margin-left:6px;-webkit-transition:-webkit-box-shadow 175ms ease-out;transition:-webkit-box-shadow 175ms ease-out;transition:box-shadow 175ms ease-out;transition:box-shadow 175ms ease-out, -webkit-box-shadow 175ms ease-out;-webkit-box-shadow:0 2px 8px rgba(0,0,0,0.15);box-shadow:0 2px 8px rgba(0,0,0,0.15)}.nav-twitter:hover{-webkit-box-shadow:0 4px 10px rgba(0,0,0,0.25);box-shadow:0 4px 10px rgba(0,0,0,0.25)}.nav-mobile{position:absolute;left:0;width:100%;background:#fff;padding:1em 0;text-align:center;border-bottom:1px solid #DFE1E6;-webkit-transition:all 225ms ease-in-out;transition:all 225ms ease-in-out;-webkit-transform:translateY(-100%);transform:translateY(-100%);z-index:2}.nav-mobile.is-active{-webkit-transform:translateY(0%);transform:translateY(0%)}@media (min-width: 769px){.nav-mobile{display:none}}.nav-list-item--mobile{font-weight:bold;padding:0.5em 0}.nav-list--desktop{display:none;margin-left:auto}@media (min-width: 1024px){.nav-list--desktop{display:-webkit-box;display:-ms-flexbox;display:flex}}.nav-list-item--desktop{line-height:80px;font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:0.2em;margin-left:32px}.nav-list-item--desktop span{background:-webkit-gradient(linear, left top, right top, from(#0072ff), to(#00d4ff));background:linear-gradient(90deg, #0072ff 0%, #00d4ff 100%);margin-left:-2px;padding:2px 6px;border-radius:5px;color:#fff;font-weight:600;letter-spacing:0}.page-header{position:relative;background:#fff;padding:10em 0 4em;overflow:hidden;z-index:1}@media only screen and (min-width: 770px){.page-header{padding:6em 0 8em}}.page-header__subtitle{color:#9DA3AC;text-transform:uppercase;letter-spacing:0.1em;margin-bottom:0.5em}.page-header__title{font-size:47px;clear:both}.page-header__square{position:absolute;top:-130px;right:50px;width:200px;height:200px;background:-webkit-gradient(linear, left top, right top, from(#2336b6), to(rgba(31,38,103,0.9)));background:linear-gradient(to right, #2336b6, rgba(31,38,103,0.9));-webkit-transform:rotate(-45deg);transform:rotate(-45deg);-webkit-transition:all 250ms ease-out;transition:all 250ms ease-out}@media only screen and (min-width: 770px){.page-header__square{top:-50px;right:50px;width:300px;height:300px}}@media only screen and (min-width: 1025px){.page-header__square{top:-50px;right:200px;width:400px;height:400px}}.page-header__circle{position:absolute;top:-60px;right:-80px;width:220px;height:220px;border-radius:110px;background:-webkit-gradient(linear, left top, right top, from(rgba(49,207,171,0.5)), to(#50e3c2));background:linear-gradient(to right, rgba(49,207,171,0.5), #50e3c2);mix-blend-mode:multiply;-webkit-transition:all 250ms ease-out;transition:all 250ms ease-out;-webkit-transition-delay:50ms;transition-delay:50ms}@media only screen and (min-width: 770px){.page-header__circle{top:-145px;right:-100px;width:350px;height:350px;border-radius:175px}}@media only screen and (min-width: 1025px){.page-header__circle{top:-145px;right:-30px;width:350px;height:350px;border-radius:175px}}.header__breadcrumbs{margin-bottom:3em;font-size:12px}@media only screen and (min-width: 770px){.header__breadcrumbs{margin-bottom:2em}}.header__link{color:#9DA3AC;text-transform:uppercase;letter-spacing:0.1em;font-size:12px;font-weight:700;float:left;margin-right:12px}.header__item{float:left}.header__caret{float:left;margin-right:12px;font-size:16px;position:relative;top:-4px}.site-footer{position:relative;background:#fff;border-top:1px solid #DFE1E6;padding:96px 0 88px;overflow:hidden}@media only screen and (min-width: 770px){.site-footer{padding:56px 0 88px}}.site-footer__graphics{position:absolute;top:0;right:0;width:100%}.site-footer__graphic-1{position:absolute;top:-100px;right:-60px;display:block;width:220px;height:220px;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);background-image:-webkit-gradient(linear, left top, right top, from(#2336B6), to(rgba(31,38,103,0.9)));background-image:linear-gradient(90deg, #2336B6 0%, rgba(31,38,103,0.9) 100%)}@media only screen and (min-width: 770px){.site-footer__graphic-1{top:-60px;right:-20px}}.site-footer__graphic-2{position:absolute;top:-100px;right:80px;display:block;width:200px;height:200px;border-radius:100px;background-image:-webkit-gradient(linear, right top, left top, from(rgba(49,207,171,0.5)), to(#50E3C2));background-image:linear-gradient(-90deg, rgba(49,207,171,0.5) 0%, #50E3C2 100%);mix-blend-mode:multiply}@media only screen and (min-width: 770px){.site-footer__graphic-2{top:-60px;right:180px}}.site-footer__logo{display:inline-block;height:72px}.site-footer__logo-image{display:inline-block;position:relative;top:8px}.site-footer__logo-title{display:inline-block;margin:0;padding:0;font-size:24px;font-weight:700;line-height:80px;padding-left:8px}.site-footer__logo-title span{font-weight:500}.site-footer__copyright{margin-bottom:80px}.site-footer__heading{font-size:13px;font-weight:bold;text-transform:uppercase;color:#8F92B3;letter-spacing:0.15em;margin-bottom:20px}.site-footer__shares{display:-webkit-box;display:-ms-flexbox;display:flex;margin-top:22px}.site-footer__share{padding-right:30px}.site-footer__link{display:inline-block;text-decoration:none;color:#1F2667;font-weight:600;margin-bottom:12px}.page-center{position:relative;display:-webkit-box;display:-ms-flexbox;display:flex;max-width:76rem;margin:0 auto;z-index:1}.page-content{padding:0 1em}.page-article{background:#fff;padding:2em 1.5em 1em;margin-top:-2em;margin-bottom:3em;border:1px solid #DFE1E6;border-radius:4px;-webkit-box-flex:1;-ms-flex:1;flex:1}.page-article h2{font-size:1.8em;margin:2em 0 1em}.page-article h3{font-size:1.5em;font-weight:600;margin-bottom:0.5em}.page-article p{font-size:18px;font-weight:400;line-height:1.4;margin:0 0 1.5em}.page-article img{max-width:100%}@media only screen and (min-width: 641px){.page-article{padding:2em 2.5em 1em}.page-article p{font-size:21px}}.home-aside,.page-aside,.blog-aside{display:none}@media only screen and (min-width: 641px){.home-aside,.page-aside,.blog-aside{display:block;-webkit-box-flex:0;-ms-flex:0 0 252px;flex:0 0 252px;padding:0 1em}}@media only screen and (min-width: 770px){.home-aside,.page-aside,.blog-aside{display:block;-webkit-box-flex:0;-ms-flex:0 0 372px;flex:0 0 372px;padding:0 1em}}.home-aside h5,.page-aside h5,.blog-aside h5{text-transform:uppercase;letter-spacing:0.1em;opacity:0.3}.home-aside p,.page-aside p,.blog-aside p{margin:0.5em auto 1.5em}.page-aside{margin-top:2.5em;text-align:center}@media (min-width: 770px){.controls-group{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}}.controls-group__label{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;line-height:40px;height:40px;margin-right:1rem;text-transform:uppercase;letter-spacing:0.1em;font-size:12px;font-weight:700}.controls{display:-webkit-box;display:-ms-flexbox;display:flex}.control{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;line-height:40px;height:40px;position:relative;margin:0;margin-left:-1px;padding:0 1rem;background:#fff;border:1px solid #DFE1E6;color:#1F2667;color:#bbbfc5;font-weight:700}.control:first-child{margin-left:0;border-top-left-radius:6px;border-bottom-left-radius:6px}.control:last-child{border-top-right-radius:6px;border-bottom-right-radius:6px}.control.is-active{background:#1F2667;border-color:#1F2667;color:#fff;z-index:1}.uzi{position:absolute;top:80px;right:-50px;height:450px}.landing-h1{position:relative;font-size:66px;margin-top:3em;z-index:1}.landing-p{font-size:18px;line-height:1.5;margin-bottom:3em}.header-app{position:relative;height:280px;-webkit-animation:header 1800ms cubic-bezier(0.8, 0, 0.2, 1);animation:header 1800ms cubic-bezier(0.8, 0, 0.2, 1)}.header-app__background-transparent{position:absolute;top:0;left:0;width:100%;height:100%;background-image:linear-gradient(45deg, #ccc 25%, transparent 25%),linear-gradient(-45deg, #ccc 25%, transparent 25%),linear-gradient(45deg, transparent 75%, #ccc 75%),linear-gradient(-45deg, transparent 75%, #ccc 75%);background-size:20px 20px;background-position:0 0, 0 10px, 10px -10px, -10px 0px;z-index:1}.header-app__background-color{position:absolute;top:0;left:0;width:100%;height:100%;background-image:-webkit-gradient(linear, left top, right top, from(#000046), color-stop(#4f1c96), color-stop(33%), to(#1cb5e0));background-image:linear-gradient(90deg, #000046 0%, #4f1c96, 33%, #1cb5e0 100%);z-index:2}@-webkit-keyframes header{0%{-webkit-transform:scaleY(0);transform:scaleY(0);opacity:0}15%{-webkit-transform:scaleY(0);transform:scaleY(0);opacity:0}100%{-webkit-transform:scaleY(1);transform:scaleY(1);opacity:1}}@keyframes header{0%{-webkit-transform:scaleY(0);transform:scaleY(0);opacity:0}15%{-webkit-transform:scaleY(0);transform:scaleY(0);opacity:0}100%{-webkit-transform:scaleY(1);transform:scaleY(1);opacity:1}}.panel-app{position:relative;max-width:74rem;margin:-50px auto 0;z-index:3;-webkit-animation:panel 1600ms ease-in-out;animation:panel 1600ms ease-in-out}@-webkit-keyframes panel{0%{opacity:0;-webkit-transform:translateY(20px) scale(0.9);transform:translateY(20px) scale(0.9)}60%{opacity:0;-webkit-transform:translateY(20px) scale(0.9);transform:translateY(20px) scale(0.9)}100%{opacity:1;-webkit-transform:translateY(0) scale(1);transform:translateY(0) scale(1)}}@keyframes panel{0%{opacity:0;-webkit-transform:translateY(20px) scale(0.9);transform:translateY(20px) scale(0.9)}60%{opacity:0;-webkit-transform:translateY(20px) scale(0.9);transform:translateY(20px) scale(0.9)}100%{opacity:1;-webkit-transform:translateY(0) scale(1);transform:translateY(0) scale(1)}}.app-gradient{position:relative;height:112px;border-bottom:1px solid #dfe1e6;padding:28px 32px;background:#fff;border-top:1px solid #dfe1e6}@media (min-width: 76rem){.app-gradient{border-top-left-radius:4px;border-top-right-radius:4px;border:1px solid #dfe1e6}}.app-color{padding:16px 8px 20px;background:#fff}@media (min-width: 76rem){.app-color{border:1px solid #dfe1e6;border-top:none;border-bottom:none;min-height:268px}}.app-options{background:#fff;padding:0 8px;border:1px solid #dfe1e6;border-bottom-left-radius:4px;border-bottom-right-radius:4px}@media only screen and (min-width: 770px){.app-options{height:96px;padding:0 16px}}.app-gradient__color{width:100%;height:44px;border:2px solid #1F2667;padding:2px;border-radius:6px}.app-gradient__color-background{width:100%;height:100%;border-radius:4px;background:-webkit-gradient(linear, left top, right top, from(#020024), color-stop(#090979), color-stop(35%), to(#00d4ff));background:linear-gradient(90deg, #020024 0%, #090979, 35%, #00d4ff 100%)}.app-gradient__points{display:-webkit-box;display:-ms-flexbox;display:flex;position:absolute;top:19px;left:20px;right:24px;height:62px;cursor:copy;-webkit-tap-highlight-color:transparent}.app-gradient__point{position:absolute;width:26px;height:62px}.app-gradient__point:before{content:"";position:absolute;top:0;left:5px;width:22px;height:62px;border-radius:14px;background:#fff;-webkit-box-shadow:0 1px 2px rgba(0,0,0,0.5);box-shadow:0 1px 2px rgba(0,0,0,0.5);opacity:0;-webkit-transition:all 175ms ease-out;transition:all 175ms ease-out}.app-gradient__point-visual{position:absolute;top:3px;left:8px;width:16px;height:56px;background:#fff;border:2px solid #1F2667;border-radius:8px;-webkit-box-shadow:0 1px 2px rgba(0,0,0,0.5);box-shadow:0 1px 2px rgba(0,0,0,0.5);-webkit-transition:all 250ms ease-out;transition:all 250ms ease-out}.app-gradient__point-color{position:absolute;top:9px;left:13px;width:6px;height:44px;background:#094679;border-radius:3px}.app-gradient__point-background{position:absolute;top:0;left:5px;width:22px;height:62px;background:rgba(0,0,0,0.2);border-radius:14px;opacity:0;-webkit-transition:all 250ms ease-out;transition:all 250ms ease-out}.app-gradient__point:hover{cursor:move}.app-gradient__point:not(.is-active):hover .app-gradient__point-background{opacity:1;-webkit-transform:scale(1.1);transform:scale(1.1)}.app-gradient__point-label{position:absolute;top:76px;left:-8px;width:48px;height:32px}.app-gradient__point-label-bg{position:absolute;width:100%;height:100%;background:#fff;border:1px solid #999;border-radius:6px;-webkit-transition:all 175ms ease-out;transition:all 175ms ease-out}.app-gradient__point-input{position:absolute;top:0;left:0px;z-index:1;background:transparent;border:none;width:100%;height:100%;text-align:center;z-index:2}.app-gradient__point.is-active{z-index:10}.app-gradient__point.is-active:before{opacity:1}.app-gradient__point.is-active .app-gradient__point-label-bg{-webkit-transform:scaleX(1.1) scaleY(1.2);transform:scaleX(1.1) scaleY(1.2);border:2px solid #1F2667;border-radius:8px;-webkit-box-shadow:0 1px 2px rgba(0,0,0,0.5);box-shadow:0 1px 2px rgba(0,0,0,0.5)}.app-color__picker,.app-color__inputs,.app-color__stops{width:100%;margin-top:20px}.app-color__picker{border-radius:4px;background:-webkit-gradient(linear, left top, right top, from(#020024), color-stop(#090979), color-stop(35%), to(#00d4ff));background:linear-gradient(90deg, #020024 0%, #090979, 35%, #00d4ff 100%)}.app-color input{height:42px;padding:0 8px;border:1px solid #bbbfc5;border-radius:6px;-webkit-transition:all 175ms ease-out;transition:all 175ms ease-out;text-align:center}.app-color input:focus{border:1px solid #1F2667;-webkit-box-shadow:0 0 0px 1.5px #1F2667;box-shadow:0 0 0px 1.5px #1F2667}.app-color__stops{padding:12px 0;border-top:1px solid #DFE1E6}@media only screen and (min-width: 770px){.app-color__stops{min-height:210px;padding:0 0 0 32px;border-left:1px solid #dfe1e6;border-top:none}}.app-color__stops-title{display:-webkit-box;display:-ms-flexbox;display:flex;margin:1em 0 10px;font-weight:bold;font-size:12px;color:#bbbfc5;letter-spacing:0.2em;text-transform:uppercase;text-align:center}.app-color__stops-title h3{font-size:12px}.app-color__stop{display:-webkit-box;display:-ms-flexbox;display:flex;height:62px;border-radius:6px;padding:6px 0;border:1px solid transparent;-webkit-transition:all 175ms ease-out;transition:all 175ms ease-out}.app-color__stop-color{width:20%}.app-color__stop-hex{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;width:40%}.app-color__stop-hex input{width:92px;margin-top:3px}.app-color__stop-position{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;width:20%}.app-color__stop-position input{width:80%;margin-top:3px}.app-color__stop-action{position:relative;width:20%;text-align:center}.app-color__stop-color-bg{float:right;width:48px;height:48px;background:rgba(255,255,255,0);border:2px solid transparent;border-radius:10px}.app-color__stop-color-tile{margin-top:3px;margin-left:3px;width:38px;height:38px;background:#090979;border-radius:6px}.app-color__stop-color-tile:hover{cursor:pointer}.app-color__stop-action-button{font-size:32px;margin-top:2px;color:#dfe1e6;border:none;background:none;-webkit-transition:all 175ms ease-out;transition:all 175ms ease-out}.app-color__stop-action-button:hover{color:#1F2667}.app-color__stop.is-active{background:#f0f1f2;border:1px solid #d9dcdf}.app-color__stop.is-active .app-color__stop-color-bg{background:white;border:2px solid #1F2667;-webkit-box-shadow:0 1px 2px rgba(0,0,0,0.5);box-shadow:0 1px 2px rgba(0,0,0,0.5)}.app-color__stop.is-active .app-color__stop-action-button{color:#a7aeb9}.app-color__stop.is-active .app-color__stop-action-button:hover{color:#1F2667}.app-options__content{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;padding:16px 0}@media only screen and (min-width: 641px){.app-options__content{-ms-flex-wrap:initial;flex-wrap:initial;padding:0}}@media only screen and (min-width: 770px){.app-options__content{display:-webkit-box;display:-ms-flexbox;display:flex}}.app-option{position:relative;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:64px}.app-option:nth-child(1),.app-option:nth-child(2){width:50%}.app-option:nth-child(3){margin-left:auto}.app-option:nth-child(4){width:100%}@media only screen and (min-width: 770px){.app-option{height:96px;padding-right:32px}.app-option:nth-child(1),.app-option:nth-child(2),.app-option:nth-child(3),.app-option:nth-child(4){width:auto}.app-option:not(:first-child){padding-left:32px}.app-option:after{content:"";position:absolute;top:27px;right:0;width:1px;height:40px;background:#dfe1e6}.app-option:nth-child(2):after{display:none}.app-option:last-child{padding-right:0}.app-option:last-child:after{display:none}}.app-option__button{position:relative;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;line-height:40px;height:40px;background:#fff;color:#bbbfc5;font-weight:700;border:1px solid #bbbfc5;padding:0 12px 0 36px;-webkit-transition:all 175ms ease-out;transition:all 175ms ease-out}@media only screen and (min-width: 770px){.app-option__button{padding:0 16px 0 40px}}.app-option__button-icon{position:absolute;left:16px;display:inline-block;width:16px;height:16px;margin-right:8px;border:2px solid #bbbfc5}@media only screen and (min-width: 770px){.app-option__button-icon{left:12px}}.app-option__button--linear{border-top-left-radius:6px;border-bottom-left-radius:6px}.app-option__button--linear .app-option__button-icon:after{content:"";position:absolute;top:5px;left:0;width:12px;height:2px;background:#bbbfc5}.app-option__button--radial{border-top-right-radius:6px;border-bottom-right-radius:6px;margin-left:-1px}.app-option__button--radial .app-option__button-icon{margin-top:-1px;width:18px;height:18px;border-radius:9px}.app-option__button--radial .app-option__button-icon:after{content:"";position:absolute;top:2px;left:2px;width:10px;height:10px;border-radius:5px;border:2px solid #bbbfc5}.app-option__button.is-active{background:#1F2667;border-color:#1F2667;color:#fff;z-index:1}.app-option__button.is-active .app-option__button-icon{border-color:#fff}.app-option__input{width:54px;height:42px;padding:0 8px;margin-left:12px;border:1px solid #bbbfc5;border-radius:6px;-webkit-transition:all 175ms ease-out;transition:all 175ms ease-out;text-align:center}.app-option__input:focus{border:1px solid #1F2667;-webkit-box-shadow:0 0 0px 1.5px #1F2667;box-shadow:0 0 0px 1.5px #1F2667}@media only screen and (min-width: 770px){.app-option__input{margin-left:24px}}.app-option__angles{display:-webkit-box;display:-ms-flexbox;display:flex;height:100%;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}.app-option__angle{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;position:relative;width:36px;height:36px;border:3px solid #1F2667;border-radius:18px}@media only screen and (max-width: 320px){.app-option__angle{display:none}}.app-option__angle-center{position:relative;width:6px;height:30px;pointer-events:none}.app-option__angle-pointer{position:absolute;width:6px;height:6px;top:2px;border-radius:3px;background:#1F2667}.app-option__swatches{display:-webkit-box;display:-ms-flexbox;display:flex;margin-left:auto;-ms-flex-pack:distribute;justify-content:space-around;width:100%}.app-option__swatch{width:48px;height:48px;padding:3px;border-radius:10px;cursor:pointer}.app-option__swatch.is-active{border:2px solid #1F2667;-webkit-box-shadow:0 1px 2px rgba(0,0,0,0.5);box-shadow:0 1px 2px rgba(0,0,0,0.5)}@media only screen and (min-width: 770px){.app-option__swatch{margin-left:8px}.app-option__swatch:first-child{margin-left:0}}.app-option__swatch-color{width:100%;height:100%;background:red;border-radius:6px}.input-file{width:0.1px;height:0.1px;opacity:0;overflow:hidden;position:absolute;z-index:-1}.input-file+label{display:none;position:relative;-webkit-box-align:center;-ms-flex-align:center;align-items:center;line-height:1;height:40px;background:#fff;color:#9DA3AC;font-weight:700;border:1px solid #9DA3AC;border-radius:6px;padding:0 12px;cursor:pointer;-webkit-transition:all 175ms ease-out;transition:all 175ms ease-out}.input-file+label svg{margin-right:8px}@media only screen and (min-width: 1025px){.input-file+label{display:-webkit-box;display:-ms-flexbox;display:flex;padding:0 16px}}.panel-code{margin-top:32px}.code-editor{display:-webkit-box;display:-ms-flexbox;display:flex;background:#161a42;border-top-left-radius:4px;border-top-right-radius:4px}.code-editor__column{display:none;-webkit-box-flex:0;-ms-flex:0 0 40px;flex:0 0 40px;height:100%;border-top-left-radius:4px;background:rgba(255,255,255,0.05)}@media only screen and (min-width: 770px){.code-editor__column{display:block}}.code-editor__column-tabs{width:100%;height:48px}.code-editor__column-numbers{padding:17px 0;text-align:center;color:rgba(255,255,255,0.25);font-size:12px;font-family:monospace;font-weight:bold;line-height:24px}.code-editor__block{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-flex:1;-ms-flex:1;flex:1;overflow:hidden;border-top-left-radius:4px;border-top-right-radius:4px}.code-editor__tabs{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:100%;height:48px;border-top-left-radius:4px;border-top-right-radius:4px;background:rgba(0,0,0,0.5)}.code-editor__tab{height:48px;line-height:48px;font-size:12px;font-weight:bold;letter-spacing:0.2em;text-transform:uppercase;padding:0 24px;color:rgba(255,255,255,0.35)}.code-editor__tab.is-active{height:48px;background:#161a42;color:#fff;border-top-left-radius:4px}.code-editor__compat{font-weight:bold;margin-left:auto;margin-right:1em;color:rgba(255,255,255,0.6);cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.code-editor__compat label{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.code-editor__compat input[type="checkbox"]{opacity:0;position:absolute}.code-editor__compat .compat__text{-webkit-box-ordinal-group:3;-ms-flex-order:2;order:2}.code-editor__compat .compat__checkbox{position:relative;width:20px;height:20px;border-radius:4px;border:2px solid #fff;margin-right:8px;-webkit-box-ordinal-group:2;-ms-flex-order:1;order:1}.code-editor__compat .compat__checkbox:after{display:none;content:"";position:absolute;top:3px;left:3px;width:10px;height:10px;background:#1F2667;border-radius:7px}@media only screen and (max-width: 320px){.code-editor__compat span{display:none}}.code-editor__compat input:checked ~ .compat__checkbox{background:#fff}.code-editor__compat input:checked ~ .compat__checkbox:after{display:block}.code-editor__input{color:rgba(255,255,255,0.8);font-weight:bold;padding:16px 24px;line-height:1.5}.code-editor__input-code .blue{color:#00d4f0}.code-options{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;height:56px;background:#45496d;border-bottom-left-radius:4px;border-bottom-right-radius:4px}.code-option__button{position:relative;background:#45496d;border:none;border-bottom-left-radius:4px;border-bottom-right-radius:4px;width:100%;font-weight:bold;color:rgba(255,255,255,0.8);-webkit-transition:all 175ms ease-out;transition:all 175ms ease-out;overflow:hidden}.code-option__button span{position:relative;z-index:2}.code-option__button .code-option__button-bg{position:absolute;top:0;left:0;width:100%;height:100%;background:blue;border-bottom-left-radius:4px;border-bottom-right-radius:4px;-webkit-transform:translateY(100%);transform:translateY(100%);-webkit-transition:all 150ms ease-in-out;transition:all 150ms ease-in-out}.code-option__button:hover{color:white}.code-option__button:hover .code-option__button-bg{-webkit-transform:translateY(0);transform:translateY(0)}.code-option__button-svg{position:relative;top:3px;margin-right:5px;opacity:0.6}.home-signup{height:200px}.home-signup iframe{margin-top:-35px}.home-article{background:#fff;padding:2em 1.5em 1em;margin-top:3em;border:1px solid #DFE1E6;border-radius:4px}.home-article h1{font-size:1.8em;margin:0.25em 0 0.5em}.home-article h2{margin:1em 0}.home-article h3{font-size:1.5em;font-weight:600;margin-bottom:0.5em}.home-article h5{text-transform:uppercase;letter-spacing:0.1em}.home-article h6{margin:2em 0 0.25em;text-transform:uppercase;letter-spacing:0.1em}.home-article p{font-size:18px;font-weight:400;line-height:1.4;margin:0 0 1.5em}.home-article a{color:#0072ff}.home-article img{max-width:100%}.home-article code{border:1px solid #DFE1E6;border-radius:4px;padding:2px 6px;font-size:18px}@media only screen and (min-width: 770px){.home-article{padding:2em 2.5em 1em}.home-article p{font-size:21px}}.home-article--pb{padding-bottom:3em}.home-aside{position:relative;margin-top:3em}.index-aside{text-align:center}.home-pages{border-top:1px solid #DFE1E6;margin-top:3em;padding-top:3em}.home-page{position:relative;overflow:hidden;background:#fff;border:1px solid #DFE1E6;margin-top:-1px}.home-page:first-child{border-top-left-radius:4px;border-top-right-radius:4px}.home-page:last-child{border-bottom-left-radius:4px;border-bottom-right-radius:4px}.home-page__image{height:280px;margin-bottom:1em}.home-page__image img{position:absolute;top:-8em;right:-13em;width:520px}@media only screen and (min-width: 770px){.home-page__image img{top:-5em;right:-3em}}.home-page__content{margin-top:-3em;padding:0 1.5em 2em}.home-page__content h3{font-size:2em;font-weight:600}.home-page__content p{line-height:1.4;font-size:1.125em}@media only screen and (min-width: 641px){.home-page__content{padding:0 2.5em 2em}.home-page__content h3{font-size:2.4em}}.home-page__link{position:relative;display:inline-block;height:48px;line-height:48px;font-weight:700;margin-top:0.5em;padding:0 50px 0 30px;background:-webkit-gradient(linear, left top, right top, from(#0072ff), to(#00d4ff));background:linear-gradient(90deg, #0072ff 0%, #00d4ff 100%);border-radius:6px;border-color:#1F2667;color:#fff;z-index:1}.home-page__link:before{content:"";position:absolute;top:19px;width:10px;height:2px;background:#fff;-webkit-transform:rotate(45deg);transform:rotate(45deg);right:30px;-webkit-transition:all 175ms ease-out;transition:all 175ms ease-out}.home-page__link:after{content:"";position:absolute;top:25px;width:10px;height:2px;background:#fff;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);right:30px;-webkit-transition:all 175ms ease-out;transition:all 175ms ease-out}.home-page__link:hover:before{-webkit-transform:translateX(6px) rotate(45deg);transform:translateX(6px) rotate(45deg)}.home-page__link:hover:after{-webkit-transform:translateX(6px) rotate(-45deg);transform:translateX(6px) rotate(-45deg)}.home-explainer__code{background:#161a42;border-radius:4px;color:rgba(255,255,255,0.8);font-weight:bold;padding:16px 16px;margin-bottom:1em;line-height:1.5}.home-explainer__code span{color:#00d4f0}
.home-explainer__image{height:120px;margin:1em 0 2em;border-radius:4px;background-image:-webkit-gradient(linear, left top, right top, from(#020024), color-stop(35%, #090979), to(#00d4ff));background-image:linear-gradient(90deg, #020024 0%, #090979 35%, #00d4ff 100%)}.home-explainer__image.radial{background-image:radial-gradient(circle, #5c0067 0%, #00d4ff 100%)}.home-display__top{background:#fff;text-align:center;overflow:hidden}.home-display__top ins{margin:0.5em 0}.home-display__center{text-align:center;margin-top:2em}.blog-header{position:relative;background:#fff;padding:9em 0 4em;overflow:hidden}@media only screen and (min-width: 770px){.blog-header{padding:6em 0 8em}}
.blog-header__subtitle{color:#9DA3AC;text-transform:uppercase;letter-spacing:0.1em;margin-bottom:0.5em}.blog-header__title{font-size:36px;clear:both}@media only screen and (min-width: 770px){.blog-header__title{font-size:47px}}.blog-header__square{position:absolute;top:-130px;right:50px;width:200px;height:200px;background:-webkit-gradient(linear, left top, right top, from(#2336b6), to(rgba(31,38,103,0.9)));background:linear-gradient(to right, #2336b6, rgba(31,38,103,0.9));-webkit-transform:rotate(-45deg);transform:rotate(-45deg);-webkit-transition:all 250ms ease-out;transition:all 250ms ease-out}
@media only screen and (min-width: 770px){
	.blog-header__square{top:-50px;right:50px;width:300px;height:300px}}
@media only screen and (min-width: 1025px){
	.blog-header__square{top:-490px;right:-40px;width:600px;height:600px}
	}
	.blog-header__circle{position:absolute;top:-60px;right:-80px;width:220px;height:220px;border-radius:110px;
	background:-webkit-gradient(linear, left top, right top, from(rgba(49,207,171,0.5)), to(#50e3c2));
	background:linear-gradient(to right, rgba(49,207,171,0.5), #50e3c2);mix-blend-mode:multiply;
	-webkit-transition:all 250ms ease-out;transition:all 250ms ease-out;
	-webkit-transition-delay:50ms;transition-delay:50ms}
	
@media only screen and (min-width: 770px){
	.blog-header__circle{
		top:-145px;right:-100px;width:350px;height:350px;border-radius:175px
		}
	}
@media only screen and (min-width: 1025px){
	.blog-header__circle{top:95px;right:-30px;width:350px;height:350px;border-radius:175px}
	}
.blog-article{background:#fff;padding:2em 1.5em 1em;margin-top:-2em;margin-bottom:3em;border:1px solid #DFE1E6;border-radius:4px}
.blog-article h2{font-size:1.6em;margin:2em 0 1em}
.blog-article h3{font-size:1.4em;font-weight:600;margin-bottom:0.5em}
.blog-article p{font-size:18px;font-weight:400;line-height:1.4;margin:0 0 1.5em}
.blog-article img{display:block;position:relative;max-width:100%;margin:16px 0;
margin-bottom:16px;
border-radius:3px;
-webkit-box-shadow:0 1px 2px rgba(0,0,0,0.2);
box-shadow:0 1px 2px rgba(0,0,0,0.2)
}
.blog-article a{color:#0072ff}.blog-article code{border:1px solid #DFE1E6;border-radius:4px;padding:2px 6px;font-size:18px}
.blog-article .code-block{background:#161A42;border-top-left-radius:4px;
border-top-right-radius:4px;color:rgba(255,255,255,0.8);font-weight:bold;padding:16px 24px;margin-bottom:3em;line-height:1.5
}
.blog-article .code-block span{color:#00D4F0}
.blog-article .code-block span.white{color:#fff}
.blog-article .ordered-list{counter-reset:li;margin-bottom:2em}
.blog-article .ordered-list li{position:relative;padding-left:2em;padding-bottom:1em;font-size:1.15em;line-height:1.4}
.blog-article .ordered-list li:before{position:absolute;
top:5px;left:14px;font-size:14px;
font-weight:bold;content:counter(li);
counter-increment:li;
font-family:monospace;
color:#0fc199
}
@media only screen and (min-width: 770px){
	.blog-article{padding:2em 2.5em 1em}
	.blog-article h2{font-size:1.8em;margin:2em 0 1em}
	.blog-article h3{font-size:1.6em;font-weight:600;margin-bottom:0.5em}
	.blog-article p{font-size:21px}}
	.blog-link{
		background:#00d4ff;
		background:-webkit-linear-gradient(90deg, #0072ff 0%, #00d4ff 100%);
		-webkit-background-clip:text;-webkit-text-fill-color:transparent
		}
	.blog-aside{margin-top:3em}
	.blog-cards{margin-bottom:3em}
	.blog-cards--home{margin-top:3em;padding-top:3em;border-top:1px solid #DFE1E6}
	.blog-cards--footer{padding-top:3em;border-top:1px solid #DFE1E6}
	.blog-cards__container{padding:2em 1em 0}
	@media only screen and (min-width: 770px){
		.blog-cards__container{padding:0}
		}
	.blog-card{position:relative;display:block;background:#fff;height:380px;
	padding:0 24px;margin:0 0 2em;border-radius:4px;border:1px solid #DFE1E6;
	color:#1F2667;text-decoration:none;overflow:hidden;
	-webkit-transition:all 250ms ease-out;transition:all 250ms ease-out;
	}
.blog-card:hover{
	-webkit-transform:translateY(-1px);
	transform:translateY(-1px);
	-webkit-box-shadow:0 8px 24px rgba(0,0,0,0.1);
	box-shadow:0 8px 24px rgba(0,0,0,0.1);
}
@media only screen and (min-width: 641px){
	.blog-card{margin:0 0 2em}
	}
	.blog-card__title{
		position:relative;top:240px;font-size:21px;font-weight:500;
	}
	
	.blog-card__category{
		position:absolute;bottom:32px;text-transform:uppercase;color:#9DA3AC;letter-spacing:0.2em
		}
	.blog-card__square{
		position:absolute;top:-30px;left:-30px;width:200px;height:200px;
		background:-webkit-gradient(linear, left top, right top, from(#2336b6), to(rgba(31,38,103,0.9)));
		background:linear-gradient(to right, #2336b6, rgba(31,38,103,0.9));
		-webkit-transform:rotate(-45deg);transform:rotate(-45deg);
		-webkit-transition:all 250ms ease-out;transition:all 250ms ease-out
		}
	.blog-card__circle{position:absolute;top:-60px;right:-30px;width:180px;height:180px;border-radius:90px;background:-webkit-gradient(linear, left top, right top, from(rgba(49,207,171,0.5)), to(#50e3c2));background:linear-gradient(to right, rgba(49,207,171,0.5), #50e3c2);-webkit-transition:all 250ms ease-out;transition:all 250ms ease-out;-webkit-transition-delay:50ms;transition-delay:50ms}
	.blog-card:hover .blog-card__square{-webkit-transform:rotate(-40deg) scale(1.05);transform:rotate(-40deg) scale(1.05)}
	.blog-card:hover .blog-card__circle{-webkit-transform:rotate(-40deg) scale(1.1);transform:rotate(-40deg) scale(1.1)}
	.blog-card.hyphy{background:-webkit-gradient(linear, left top, left bottom, from(#1C7CE0), to(#150051));background:linear-gradient(to bottom, #1C7CE0, #150051);color:#fff;padding:0 26px}
	.blog-card.hyphy .blog-card__square,.blog-card.hyphy .blog-card__circle{display:none}
	.blog-card.hyphy .blog-card__title{top:80px;font-size:36px;font-weight:300;letter-spacing:-0.02em}
	.blog-card.hyphy .blog-card__category{top:40px;color:rgba(255,255,255,0.5)}
	.background .blog-card__square{top:-60px;left:-30px;width:200px;height:200px;background:-webkit-gradient(linear, left top, right top, from(#2336b6), to(rgba(31,38,103,0.9)));background:linear-gradient(to right, #2336b6, rgba(31,38,103,0.9));-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}
	.background .blog-card__circle{top:-60px;right:-30px;width:180px;height:180px;border-radius:90px;background:-webkit-gradient(linear, left top, right top, from(rgba(49,207,171,0.5)), to(#50e3c2));background:linear-gradient(to right, rgba(49,207,171,0.5), #50e3c2)}
	
	.radial .blog-card__square{top:-30px;left:-30px;width:200px;height:200px;border-radius:100px;background:radial-gradient(circle, rgba(49,207,59,0.5), #50e3c2)}
	.radial .blog-card__circle{top:-60px;right:-30px;width:200px;height:200px;border-radius:100px;background:radial-gradient(circle, rgba(31,38,103,0.9), #5f18af)}
	
	.repeating .blog-card__square{top:-30px;left:-30px;width:180px;height:180px;background:-webkit-gradient(linear, left top, right top, from(#237db6), to(rgba(31,38,103,0.9)));background:linear-gradient(to right, #237db6, rgba(31,38,103,0.9));-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}
	.repeating .blog-card__circle{top:-60px;right:-30px;width:200px;height:200px;border-radius:0px;background:-webkit-gradient(linear, left top, right top, from(rgba(49,207,171,0.5)), to(#50e3c2));background:linear-gradient(to right, rgba(49,207,171,0.5), #50e3c2);-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}
	.text .blog-card__square{top:-60px;left:50%;width:240px;height:240px;background:-webkit-gradient(linear, left top, right top, from(#1595b6), to(rgba(31,38,103,0.9)));background:linear-gradient(to right, #1595b6, rgba(31,38,103,0.9));-webkit-transform:translateY(-25%) translateX(-50%) rotate(-45deg);transform:translateY(-25%) translateX(-50%) rotate(-45deg)}
	.blog-card.text:hover .blog-card__square{-webkit-transform:translateY(-35%) translateX(-50%) rotate(-45deg);transform:translateY(-35%) translateX(-50%) rotate(-45deg)}
	.text .blog-card__circle{top:60px;left:50%;width:140px;height:140px;border-radius:70px;background:-webkit-gradient(linear, left top, right top, from(rgba(49,207,171,0.5)), to(#50e3c2));background:linear-gradient(to right, rgba(49,207,171,0.5), #50e3c2);-webkit-transform:translateX(-50%) rotate(-45deg);transform:translateX(-50%) rotate(-45deg)}
	.blog-card.text:hover .blog-card__circle{-webkit-transform:translateY(15%) translateX(-50%) rotate(-45deg);transform:translateY(15%) translateX(-50%) rotate(-45deg)}.linear .blog-card__square{top:-60px;left:auto;right:-60px;width:240px;height:240px;background:-webkit-gradient(linear, left top, right top, from(#5e18af), to(rgba(31,38,103,0.9)));background:linear-gradient(to right, #5e18af, rgba(31,38,103,0.9));-webkit-transform:none;transform:none}
	.blog-card.linear:hover .blog-card__square{-webkit-transform:translateY(-15%) translateX(-10%);transform:translateY(-15%) translateX(-10%)}
	.linear .blog-card__circle{top:60px;left:0;width:140px;height:140px;border-radius:0px;background:-webkit-gradient(linear, left top, right top, from(rgba(49,207,69,0.5)), to(#50e3c2));background:linear-gradient(to right, rgba(49,207,69,0.5), #50e3c2);-webkit-transform:none;transform:none}
	.blog-card.linear:hover .blog-card__circle{-webkit-transform:translateY(5%) translateX(10%);transform:translateY(5%) translateX(10%)}
	.photoshop .blog-card__square{top:-80px;left:auto;right:-60px;width:240px;height:240px;background:-webkit-gradient(linear, left top, right top, from(rgba(49,207,171,0.5)), to(#50e3c2));background:linear-gradient(to right, rgba(49,207,171,0.5), #50e3c2);-webkit-transform:none;transform:none}
	.blog-card.photoshop:hover .blog-card__square{-webkit-transform:translateY(-15%) translateX(-10%) rotate(5deg);transform:translateY(-15%) translateX(-10%) rotate(5deg)}
	.photoshop .blog-card__circle{top:80px;left:auto;right:0;width:120px;height:120px;border-radius:60px;background:-webkit-gradient(linear, left top, right top, from(#2336b6), to(rgba(31,38,103,0.9)));background:linear-gradient(to right, #2336b6, rgba(31,38,103,0.9));-webkit-transform:none;transform:none}.blog-card.photoshop:hover .blog-card__circle{-webkit-transform:translateY(5%) translateX(10%);transform:translateY(5%) translateX(10%)}
	.powerpoint .blog-card__square{top:-80px;left:auto;right:-60px;width:240px;height:240px;background:radial-gradient(circle, rgba(49,207,59,0.5), #50e3c2);-webkit-transform:none;transform:none}.blog-card.powerpoint:hover .blog-card__square{-webkit-transform:translateY(5%) translateX(5%);transform:translateY(5%) translateX(5%)}
	.powerpoint .blog-card__circle{top:-80px;left:-20px;right:0;width:200px;height:200px;border-radius:100px;background:-webkit-gradient(linear, left top, right top, from(#1595b6), to(rgba(31,38,103,0.9)));background:linear-gradient(to right, #1595b6, rgba(31,38,103,0.9));-webkit-transform:none;transform:none}.blog-card.powerpoint:hover .blog-card__circle{-webkit-transform:translateY(-5%) translateX(-10%);transform:translateY(-5%) translateX(-10%)}.blog-graphic{height:240px;margin-bottom:2em}
	.blog-graphic-linear{background:-webkit-gradient(linear, left top, right top, from(#833ab4), color-stop(50%, #fd1d1d), to(#fcb045));background:linear-gradient(90deg, #833ab4 0%, #fd1d1d 50%, #fcb045 100%)}.blog-graphic-radial{background:radial-gradient(circle, #1e24d6 0%, #0f151b 100%)}.blog-graphic-repeating{background:repeating-linear-gradient(45deg, #00D4F0, #00D4F0 12px, #f2f2f2 12px, #f2f2f2 20px)}.blog-graphic-background{background:-webkit-gradient(linear, left top, right top, from(#9600fb), to(#00ffd0));background:linear-gradient(90deg, #9600fb 0%, #00ffd0 100%)}
	.blog-graphic-text{background:-webkit-gradient(linear, left top, right top, from(#effaff), to(#d9e7ff));background:linear-gradient(90deg, #effaff 0%, #d9e7ff 100%);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;text-align:center}.blog-graphic-text h2{font-size:48px;font-weight:800;background:-webkit-linear-gradient(45deg, #09009f, #00ff95 80%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;margin:0}.pattern{margin-bottom:1em}
	.pattern-parallel{height:80px;background-color:#00ccd6;background-image:-webkit-gradient(linear, left top, right top, color-stop(50%, transparent), color-stop(50%, rgba(255,255,255,0.5)));background-image:linear-gradient(90deg, transparent 50%, rgba(255,255,255,0.5) 50%);background-size:50px 50px}.pattern-checkerboard{height:80px;background-image:linear-gradient(45deg, #ccc 25%, transparent 25%),linear-gradient(-45deg, #ccc 25%, transparent 25%),linear-gradient(45deg, transparent 75%, #ccc 75%),linear-gradient(-45deg, transparent 75%, #ccc 75%);background-size:20px 20px;background-position:0 0, 0 10px, 10px -10px, -10px 0px}
	.pattern-cross{height:80px;background:radial-gradient(circle, transparent 20%, #f7f7f7 20%, #f7f7f7 80%, transparent 80%, transparent),radial-gradient(circle, transparent 20%, #f7f7f7 20%, #f7f7f7 80%, transparent 80%, transparent) 20px 20px,linear-gradient(#c10074 4px, transparent 4px) 0 -2px,linear-gradient(90deg, #c10074 4px, transparent 4px) -2px 0;background-color:#f7f7f7;background-size:40px 40px, 40px 40px, 20px 20px, 20px 20px}.pattern-wave{height:80px;background:radial-gradient(circle at 100% 50%, transparent 20%, #00D4F0 21%, #00D4F0 34%, transparent 35%, transparent),radial-gradient(circle at 0% 50%, transparent 20%, #00D4F0 21%, #00D4F0 34%, transparent 35%, transparent) 0 -20px;background-color:#eee;background-size:30px 40px}.pattern-zigzag{height:80px;background:linear-gradient(135deg, #f2f2f2 25%, transparent 25%) -20px 0,linear-gradient(225deg, #f2f2f2 25%, transparent 25%) -20px 0,linear-gradient(315deg, #f2f2f2 25%, transparent 25%),linear-gradient(45deg, #f2f2f2 25%, transparent 25%);background-size:40px 40px;background-color:#50e3c2}.page-header__swatches-image{position:absolute;top:-100px;right:-100px;width:400px}
	@media only screen and (min-width: 641px){
		.page-header__swatches-image{top:-160px;right:-100px;width:600px}
		}
		@media only screen and (min-width: 770px){
			.page-header__swatches-image{top:-160px;right:-150px;width:700px}
			}
			@media only screen and (min-width: 1025px){
				.page-header__swatches-image{top:-160px;right:-100px;width:800px}
				}
				.swatch-cards{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;margin:-1rem -0.5rem 0}
				.swatch-card{-webkit-box-flex:1;-ms-flex:1 1 calc(50% - 1rem);flex:1 1 calc(50% - 1rem);width:calc(50% - 1rem);margin:0 0.5rem 1rem;-webkit-box-shadow:0 2px 10px rgba(0,0,0,0.05);box-shadow:0 2px 10px rgba(0,0,0,0.05);border-radius:8px}
				@media only screen and (min-width: 770px){
					.swatch-card{-webkit-box-flex:1;-ms-flex:1 1 calc(33.3333% - 1rem);flex:1 1 calc(33.3333% - 1rem);width:calc(33.3333% - 1rem)}
					}
					.swatch-card__color{display:-webkit-box;display:-ms-flexbox;display:flex;
					-webkit-box-align:center;-ms-flex-align:center;align-items:center;
					-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;
					-ms-flex-wrap:wrap;flex-wrap:wrap;background:blue;height:134px;
					border-top-left-radius:8px;border-top-right-radius:8px}
					.swatch-card__color-band{
						-webkit-box-flex:0;
					-ms-flex:0 0 100%;
					flex:0 0 100%;
					height:40px;
					}
				.swatch-card__bar{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background:#fff;height:60px;border-left:1px solid #DFE1E6;border-right:1px solid #DFE1E6;border-bottom:1px solid #DFE1E6;border-bottom-left-radius:8px;border-bottom-right-radius:8px}
	.swatch-card__bar h4{padding-left:20px}
	.swatch-card__copy{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;margin-left:auto;height:100%;padding:0 24px;background:#fff;border:none;border-bottom-right-radius:8px;cursor:pointer;-webkit-transition:all 250ms ease-out;transition:all 250ms ease-out}.swatch-card__copy:hover{background:#f0f1f2}.swatch-card__copy-alert{background:#fff;padding:12px 24px;font-weight:bold;border-radius:4px;-webkit-box-shadow:0 2px 40px rgba(0,0,0,0.2);box-shadow:0 2px 40px rgba(0,0,0,0.2);opacity:0}.swatch-card__copy-alert.is-copied{-webkit-animation:copied 1000ms ease-in-out;animation:copied 1000ms ease-in-out}@-webkit-keyframes copied{0%{opacity:0}33%{opacity:1}66%{opacity:1}100%{opacity:0}}@keyframes copied{0%{opacity:0}33%{opacity:1}66%{opacity:1}100%{opacity:0}}
	.page-header__resources-circle{position:absolute;top:-80px;right:100px;width:200px;height:200px;border-radius:200px;background:-webkit-gradient(linear, left top, right top, from(#2336b6), to(rgba(31,38,103,0.9)));background:linear-gradient(to right, #2336b6, rgba(31,38,103,0.9));-webkit-transform:rotate(-45deg);transform:rotate(-45deg);-webkit-transition:all 250ms ease-out;transition:all 250ms ease-out;z-index:3}.page-header__resources-circle:nth-child(2){right:30px;opacity:0.8;z-index:2}.page-header__resources-circle:nth-child(3){right:-20px;opacity:0.6;z-index:1}@media only screen and (min-width: 641px){.page-header__resources-circle{top:-50px;width:300px;height:300px}}@media only screen and (min-width: 770px){.page-header__resources-circle{top:-50px;width:400px;height:400px;border-radius:200px}}.resource-card{width:100%;margin-top:1em;border-radius:4px}.resource-card__content{margin-top:3em}
	.resource-card__image{width:100%;text-align:center;height:150px}
	@media only screen and (min-width: 641px){
		.resource-card__image{height:240px}
		}
		.resource-card__image img{
			position:relative;top:1em;width:280px;
		-webkit-box-shadow:0 2px 40px rgba(0,0,0,0.1);
		box-shadow:0 2px 40px rgba(0,0,0,0.1)
		}
		@media only screen and (min-width: 641px){
			.resource-card__image img{width:400px}}
			@media only screen and (min-width: 770px){
				.resource-card__image img{width:500px}}
				@media only screen and (min-width: 770px){
					.resource-card__image img{width:600px}
					}
					.resource-card__content-link-block{margin:2em 0 0}
					.resource-card__content-link-block p{margin-top:0.25em}.resource-card__link-block-link{font-size:1.25em;color:#0072ff}@media only screen and (min-width: 641px){.html-backgrounds{overflow:hidden}}.sidenav-backgrounds__title-link{display:block;margin-top:0.5em;opacity:0.5}.sidenav-backgrounds__title-logo{margin-top:2.5em}.sidenav-backgrounds__title{font-size:14px;font-weight:600;text-transform:uppercase;letter-spacing:0.3em;margin-top:0.5em}.subnav-backgrounds__list{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;line-height:80px;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:0.2em}@media only screen and (min-width: 641px){.main-backgrounds{display:-webkit-box;display:-ms-flexbox;display:flex}}
	.sidenav-fake{position:fixed;background-image:-webkit-gradient(linear, right top, left top, color-stop(7%, #e0ecfc), to(#bcbcdd));background-image:linear-gradient(-90deg, #e0ecfc 7%, #bcbcdd 100%);height:100vh;width:100%;z-index:2}
	@media only screen and (min-width: 641px){
		.sidenav-fake{width:360px;-webkit-box-shadow:0 2px 120px 0 rgba(31,38,103,0.4);box-shadow:0 2px 120px 0 rgba(31,38,103,0.4)}}
		@media only screen and (min-width: 641px){.sidenav-backgrounds-parent{height:100vh;width:400px;overflow:hidden}}.sidenav-backgrounds{position:relative;text-align:center;overflow-y:scroll;z-index:3}@media only screen and (min-width: 641px){.sidenav-backgrounds{width:420px;height:100vh;padding-right:40px}.sidenav-backgrounds header{margin-right:30px}}.content-backgrounds{display:none}@media only screen and (min-width: 641px){.content-backgrounds{display:block;position:relative;background:#fff;-webkit-box-flex:1;-ms-flex:1;flex:1;margin-left:-40px}.content-backgrounds iframe{width:100%;height:100vh;border:none;border-top:1px solid #DFE1E6;border-bottom:1px solid #DFE1E6}}.sidenav-backgrounds__banner{margin:16px auto 0}@media only screen and (min-width: 770px){.sidenav-backgrounds__banner{width:360px;margin:24px 0 0}}.sidenav-backgrounds__list{margin-top:2em;overflow:hidden}@media only screen and (min-width: 641px){.sidenav-backgrounds__list{overflow:visible}}.sidenav-backgrounds__list-item{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;position:relative;width:318px;height:84px;border-top-right-radius:8px;border-bottom-right-radius:8px;margin-bottom:1em}.sidenav-backgrounds__list-item h2{position:relative;font-size:22px;font-weight:600;-webkit-transition:all 375ms cubic-bezier(0.8, 0, 0.2, 1);transition:all 375ms cubic-bezier(0.8, 0, 0.2, 1)}.sidenav-backgrounds__list-item .sidenav-backgrounds__background{position:absolute;top:0;left:0;width:100%;height:100%;background:#fff;border-top-right-radius:8px;border-bottom-right-radius:8px;-webkit-box-shadow:0 2px 30px 0 rgba(31,38,103,0.2);box-shadow:0 2px 30px 0 rgba(31,38,103,0.2);overflow:hidden;-webkit-transform-origin:center left;transform-origin:center left;-webkit-transition:-webkit-transform 475ms cubic-bezier(0.8, 0, 0.26, 1.65);transition:-webkit-transform 475ms cubic-bezier(0.8, 0, 0.26, 1.65);transition:transform 475ms cubic-bezier(0.8, 0, 0.26, 1.65);transition:transform 475ms cubic-bezier(0.8, 0, 0.26, 1.65), -webkit-transform 475ms cubic-bezier(0.8, 0, 0.26, 1.65)}.sidenav-backgrounds__list-item .sidenav-backgrounds__background:after{content:"";position:absolute;top:0;right:0;width:76%;height:100%;background-image:-webkit-gradient(linear, left bottom, left top, from(#522db8), to(#1c7ce0));background-image:linear-gradient(0deg, #522db8 0%, #1c7ce0 100%);border-top-right-radius:8px;border-bottom-right-radius:8px;-webkit-transform:scaleX(0);transform:scaleX(0);-webkit-transform-origin:center right;transform-origin:center right;-webkit-transition:-webkit-transform 475ms cubic-bezier(0.8, 0, 0.2, 1);transition:-webkit-transform 475ms cubic-bezier(0.8, 0, 0.2, 1);transition:transform 475ms cubic-bezier(0.8, 0, 0.2, 1);transition:transform 475ms cubic-bezier(0.8, 0, 0.2, 1), -webkit-transform 475ms cubic-bezier(0.8, 0, 0.2, 1)}.sidenav-backgrounds__list-item:hover .sidenav-backgrounds__background:after{-webkit-transform:scaleX(0.1);transform:scaleX(0.1)}.sidenav-backgrounds__list-item.is-active h2{color:#fff;-webkit-transform:translateX(46px);transform:translateX(46px)}.sidenav-backgrounds__list-item.is-active .sidenav-backgrounds__background{-webkit-transform:scale(1.18, 1.1);transform:scale(1.18, 1.1)}.sidenav-backgrounds__list-item.is-active .sidenav-backgrounds__background:after{-webkit-transform:scaleX(1);transform:scaleX(1)}.sidenav-backgrounds__logo{position:relative;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;width:50px;height:60px;margin:0 16px 0 24px}.sidenav-backgrounds__logo img{width:50px}.sidenav-backgrounds__arrow{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;position:absolute;left:320px;height:100%;opacity:0}.sidenav-backgrounds__arrow-active{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;position:absolute;left:320px;height:100%}.sidenav-backgrounds__arrow-active svg{opacity:0;-webkit-transform:translateX(-100px) scale(14);transform:translateX(-100px) scale(14)}.backgrounds-info{text-align:left;padding:2em 2.5em 3em 1.5em}.backgrounds-info h1{font-size:16px;text-transform:uppercase;letter-spacing:0.1em}.backgrounds-info h2{margin-top:2em;font-size:12px;text-transform:uppercase;letter-spacing:0.1em}.backgrounds-info p{line-height:1.4}.backgrounds-info a{color:#001bff}.backgrounds-featured{background:rgba(255,255,255,0.5);padding:0.5rem;margin-bottom:2rem;border-radius:4px}.backgrounds-shades{display:-webkit-box;display:-ms-flexbox;display:flex;position:absolute;top:0;left:0;width:100%;height:100%;visibility:hidden}.backgrounds-shade{-webkit-box-flex:0;-ms-flex:0 0 18%;flex:0 0 18%;height:100%;background-image:-webkit-gradient(linear, left bottom, left top, from(#522db8), to(#1c7ce0));background-image:linear-gradient(0deg, #522db8 0%, #1c7ce0 100%);-webkit-transform-origin:bottom right;transform-origin:bottom right;-webkit-transition:all 875ms cubic-bezier(0.8, 0, 0.2, 1);transition:all 875ms cubic-bezier(0.8, 0, 0.2, 1);-webkit-transform:scaleX(1) scaleY(0);transform:scaleX(1) scaleY(0)}.shades-cards{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;margin-top:-1em;margin-bottom:0em}.shades-card{margin-bottom:1.5em;width:49%;margin-right:2%;-webkit-box-shadow:0 2px 10px rgba(0,0,0,0.05);box-shadow:0 2px 10px rgba(0,0,0,0.05);border-radius:8px;-webkit-transition:-webkit-box-shadow 250ms ease-out, -webkit-transform 250ms ease-out;transition:-webkit-box-shadow 250ms ease-out, -webkit-transform 250ms ease-out;transition:box-shadow 250ms ease-out, transform 250ms ease-out;transition:box-shadow 250ms ease-out, transform 250ms ease-out, -webkit-box-shadow 250ms ease-out, -webkit-transform 250ms ease-out}.shades-card:nth-child(2n){margin-right:0}@media only screen and (min-width: 770px){.shades-card{width:32%;margin-right:2%}.shades-card:nth-child(2n){margin-right:2%}.shades-card:nth-child(3n){margin-right:0}}.shades-card__color{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-ms-flex-wrap:wrap;flex-wrap:wrap;background:blue;border-top-left-radius:8px;border-top-right-radius:8px;overflow:hidden}.shades-card__color-band{-webkit-box-flex:0;-ms-flex:0 0 100%;flex:0 0 100%;height:40px}.shades-card__bar{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background:#fff;height:60px;border-left:1px solid #DFE1E6;border-right:1px solid #DFE1E6;border-bottom:1px solid #DFE1E6;border-bottom-left-radius:8px;border-bottom-right-radius:8px}.shades-card__bar h4{padding-left:20px}.shades-card__arrow{margin-left:auto;margin-right:24px;-webkit-transition:-webkit-transform 350ms ease-out;transition:-webkit-transform 350ms ease-out;transition:transform 350ms ease-out;transition:transform 350ms ease-out, -webkit-transform 350ms ease-out}@media (min-width: 770px){.shades-card:hover{-webkit-box-shadow:0 5px 40px rgba(0,0,0,0.1);box-shadow:0 5px 40px rgba(0,0,0,0.1);-webkit-transform:translateY(-1px);transform:translateY(-1px)}.shades-card:hover .shades-card__arrow{-webkit-transform:translateX(4px);transform:translateX(4px)}}.shade-menu{margin:1rem 0 3rem}@media (min-width: 770px){.shade-menu{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}}.shade-menu__results{font-size:1.5rem;font-weight:700}.link-row{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding:1.5em;border-top:1px solid #DFE1E6}@media only screen and (min-width: 770px){.link-row{padding:1em 2.5em}}.link-row__avatar{width:40px;height:40px;background:blue;border-radius:8px;margin-right:1rem;overflow:hidden;-webkit-transition:-webkit-transform 600ms cubic-bezier(0.175, 0.885, 0.32, 1.275);transition:-webkit-transform 600ms cubic-bezier(0.175, 0.885, 0.32, 1.275);transition:transform 600ms cubic-bezier(0.175, 0.885, 0.32, 1.275);transition:transform 600ms cubic-bezier(0.175, 0.885, 0.32, 1.275), -webkit-transform 600ms cubic-bezier(0.175, 0.885, 0.32, 1.275)}.link-row__avatar-color{height:10px;background:green}.link-row__title{font-size:20px;font-weight:600}.link-row__arrow{margin-left:auto;margin-right:1rem;-webkit-transition:-webkit-transform 600ms cubic-bezier(0.175, 0.885, 0.32, 1.275);transition:-webkit-transform 600ms cubic-bezier(0.175, 0.885, 0.32, 1.275);transition:transform 600ms cubic-bezier(0.175, 0.885, 0.32, 1.275);transition:transform 600ms cubic-bezier(0.175, 0.885, 0.32, 1.275), -webkit-transform 600ms cubic-bezier(0.175, 0.885, 0.32, 1.275)}
	.link-row:hover .link-row__avatar{-webkit-transform:scale(1.1);transform:scale(1.1)}
	.link-row:hover .link-row__arrow{-webkit-transform:translateX(8px);transform:translateX(8px)}