.globalNav .colorize {
    color: white;

   
}

.globalNav .colorize.active,
.globalNav .colorize:hover {
    color: white;

}

.productNav .colorize {
    color: #7356b6;

}

.productNav .colorize.active,
.productNav .colorize:hover {
    color: white;
 
}

.narrow-container {
    max-width: 800px;
    text-align: center;
    margin: 0 auto
}

.medium-body {
    font-size: 19px;
    line-height: 29px
}

.section-header p {
    margin-top: 20px
}

.big-section {
    padding: 100px 0 20px
}

@media (min-width:880px) {
    .big-section {
        padding: 180px 0
    }
}

.stripes-container {
    pointer-events: none
}

.stripes-container>div {
    position: absolute;
    left: 0;
    right: 0;
    height: 245px;
    -webkit-transform: skewY(-12deg);
    transform: skewY(-12deg)
}

.split-feature {
    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-align: center;
    -ms-flex-align: center;
    align-items: center
}

@media (min-width:880px) {
    .split-feature {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row
    }
}

@media (min-width:880px) {
    .feature-content,
    .feature-figure {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 50%;
        flex: 0 0 50%
    }
}

.feature-content h1 {
    margin-bottom: 30px
}

.feature-content p {
    margin-top: 20px
}

.feature-content .icon {
    width: 72px;
    height: 72px;
    margin: -15px 0 20px -5px
}

.globalFooterCTA {
    background: #eef2f7;
    border: none;
    padding: 80px 0
}

.globalFooterCTA .content {
    -ms-flex-preferred-size: 60%;
    flex-basis: 60%
}

.globalFooterCTA .buttons {
    -ms-flex-preferred-size: 40%;
    flex-basis: 40%
}

.sigma-benefits {
    position: relative;
    z-index: 10;
    padding-bottom: 80px
}

@media (min-width:880px) {
    .sigma-benefits {
        padding-bottom: 120px
    }
}

.sigma-benefits .section-header {
    margin-bottom: 50px
}

.sigma-benefits .icon {
    margin-left: -1px
}

.interstitial-cta {
    border-top: 2px solid #f6f9fc;
    margin: 60px -20px 0;
    padding: 60px 20px 0
}

@media (min-width:670px) {
    .interstitial-cta {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center
    }
}

.interstitial-cta .text {
    -webkit-box-flex: 2;
    -ms-flex-positive: 2;
    flex-grow: 2
}

.interstitial-cta .text h2 {
    font-size: 24px;
    line-height: 36px
}

.interstitial-cta .buttons {
    margin-top: 20px
}

@media (min-width:670px) {
    .interstitial-cta .buttons {
        margin: 0 0 0 20px
    }
}

.sigma-data {
    background: #eef2f7;
    overflow: hidden;
    position: relative
}

.sigma-data .pattern {
    position: absolute;
    bottom: -680px;
    left: calc(50% - 600px)
}

@media (min-width:880px) {
    .sigma-data .pattern {
        top: -700px;
        bottom: auto;
        left: calc(50% - 1480px)
    }
}

.sigma-data .split-feature {
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch
}

.sigma-data .feature-figure {
    min-height: 500px;
    position: relative;
    z-index: 5
}

@media (min-width:880px) {
    .sigma-data .feature-content {
        -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
        order: 2
    }
}

.sigma-data .callout {
    margin-top: 60px;
    font-size: 15px;
    font-weight: 500;
    color: #525f7f;
    position: relative;
    text-align: center;
    margin-bottom: 20px
}

.sigma-data .callout:after,
.sigma-data .callout:before {
    content: "";
    position: absolute;
    background: #87bbfd
}

.sigma-data .callout:before {
    left: calc(50% - 1px);
    width: 2px;
    height: 200px;
    bottom: -215px
}

.sigma-data .callout:after {
    left: calc(50% - 4px);
    bottom: -15px;
    width: 8px;
    height: 8px;
    border-radius: 50%
}

@media (min-width:880px) {
    .sigma-data .callout {
        text-align: left
    }
    .sigma-data .callout:before {
        left: -220px;
        bottom: auto;
        width: 200px;
        height: 2px;
        top: 12px
    }
    .sigma-data .callout:after {
        left: -24px;
        top: 9px
    }
}

.sigma-ide {
    background: #f6f9fc;
    overflow: hidden;
    position: relative
}

.sigma-ide .pattern {
    position: absolute;
    top: -500px;
    left: calc(50% + 280px)
}

.sigma-ide .feature-figure {
    position: relative;
    z-index: 10;
    padding-top: 80px
}

@media (min-width:880px) {
    .sigma-ide .feature-figure {
        padding-top: 0;
        padding-left: 60px
    }
}

@media (min-width:1040px) {
    .sigma-ide .feature-figure {
        padding-left: 80px
    }
}

.ide-animation {
    position: relative;
    pointer-events: none;
    padding-bottom: 140px
}

@media (min-width:880px) {
    .ide-animation {
        padding-bottom: 100px
    }
}

.ide-animation .code {
    background: #fff;
    height: 216px;
    width: 100%;
    min-width: 400px;
    border-radius: 8px;
    -webkit-box-shadow: 0 15px 35px rgba(50, 50, 93, .1), 0 5px 15px rgba(0, 0, 0, .07);
    box-shadow: 0 15px 35px rgba(50, 50, 93, .1), 0 5px 15px rgba(0, 0, 0, .07);
    font-family: Source Code Pro, Consolas, Menlo, monospace;
    font-size: 18px;
    line-height: 29px
}

.ide-animation .code .line-numbers {
    white-space: pre;
    position: absolute;
    top: 20px;
    left: 30px;
    color: #cfd7df;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.ide-animation .code span {
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
    -webkit-transition: opacity 50ms;
    transition: opacity 50ms;
    will-change: opacity
}

.ide-animation .code .bold {
    color: #4078f2
}

.ide-animation .popups ul {
    position: absolute;
    left: 0;
    top: 0;
    background: #fff;
    -webkit-box-shadow: 0 4px 6px rgba(50, 50, 93, .11), 0 1px 3px rgba(0, 0, 0, .08), 0 0 0 1px rgba(0, 0, 0, .07);
    box-shadow: 0 4px 6px rgba(50, 50, 93, .11), 0 1px 3px rgba(0, 0, 0, .08), 0 0 0 1px rgba(0, 0, 0, .07);
    border-radius: 4px;
    padding: 5px 0;
    min-width: 300px;
    max-width: 500px;
    color: #6b7c93;
    opacity: 0;
    -webkit-transition: opacity .2s;
    transition: opacity .2s;
    will-change: opacity
}

.ide-animation .popups ul li {
    padding: 5px 15px 6px
}

.ide-animation .popups ul li:nth-child(odd) {
    background: #f6f9fc
}

.ide-animation .popups ul li:first-child {
    background: #e6ebf1;
    color: #32325d
}

.ide-animation .popups ul span {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    white-space: nowrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.ide-animation .popups ul code {
    font-size: 13px;
    margin-right: 15px;
    overflow: hidden;
    text-overflow: ellipsis
}

.ide-animation .popups ul small {
    color: #8898aa;
    font-size: 11px;
    font-weight: 500;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto
}

.ide-animation .popups ul p {
    margin-top: 2px;
    font-size: 11px;
    line-height: 17px;
    font-weight: 500
}

.ide-animation .popups ul a {
    color: #3297d3
}

.sigma-share {
    background: #e6ebf1;
    margin-bottom: -500px;
    padding-bottom: 650px;
    overflow: hidden;
    position: relative
}

.sigma-share.short-quotes {
    z-index: 5;
    margin-bottom: 0;
    padding-bottom: 180px
}

@media (min-width:880px) {
    .sigma-share {
        padding-bottom: 700px
    }
}

.sigma-share .pattern {
    position: absolute;
    bottom: -200px;
    left: calc(50% - 600px)
}

@media (min-width:880px) {
    .sigma-share .pattern {
        top: 200px;
        left: calc(50% + 280px)
    }
}

.sigma-share.short-quotes .pattern {
    bottom: -700px
}

.sigma-share .feature-figure {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-top: 60px
}

@media (min-width:880px) {
    .sigma-share .feature-figure {
        margin-top: 0;
        -webkit-box-pack: end;
        -ms-flex-pack: end;
        justify-content: flex-end;
        width: auto;
        padding-left: 60px
    }
}

@media (min-width:1040px) {
    .sigma-share .feature-figure {
        padding-left: 80px
    }
}

.share-animation {
    height: 450px;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    max-width: 450px;
    position: relative;
    z-index: 20
}

.share-animation .conversation {
    position: absolute;
    top: 50%;
    right: 0;
    left: 0;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    opacity: 0;
    -webkit-transition: opacity 1.2s;
    transition: opacity 1.2s;
    will-change: opacity;
    pointer-events: none
}

.share-animation .conversation.active {
    opacity: 1
}

.share-animation .conversation.active,
.share-animation .conversation.active li {
    -webkit-transition-delay: .5s;
    transition-delay: .5s
}

.share-animation .conversation.above li:first-child {
    -webkit-transform: translateY(-30px) scale(.91);
    transform: translateY(-30px) scale(.91)
}

.share-animation .conversation.above li:nth-child(2) {
    -webkit-transform: translateY(-40px) scale(.95);
    transform: translateY(-40px) scale(.95)
}

.share-animation .conversation.below li:first-child {
    -webkit-transform: translateY(40px) scale(1.05);
    transform: translateY(40px) scale(1.05)
}

.share-animation .conversation.below li:nth-child(2) {
    -webkit-transform: translateY(45px) scale(1.08);
    transform: translateY(45px) scale(1.08)
}

.share-animation .conversation li {
    font-size: 20px;
    line-height: 30px;
    background: #fff;
    border-radius: 10px;
    -webkit-box-shadow: 0 15px 35px rgba(50, 50, 93, .1), 0 5px 15px rgba(0, 0, 0, .07);
    box-shadow: 0 15px 35px rgba(50, 50, 93, .1), 0 5px 15px rgba(0, 0, 0, .07);
    position: relative;
    -webkit-transition: -webkit-transform 1.2s;
    transition: -webkit-transform 1.2s;
    transition: transform 1.2s;
    transition: transform 1.2s, -webkit-transform 1.2s;
    will-change: transform
}

.share-animation .conversation li:after {
    content: "";
    position: absolute;
    bottom: -17px;
    width: 28px;
    height: 19px;
    -webkit-filter: drop-shadow(0 13px 8px rgba(0, 0, 0, .15));
    filter: drop-shadow(0 13px 8px rgba(0, 0, 0, .15))
}

.share-animation .conversation li+li {
    margin-top: 30px
}

.share-animation .conversation li:first-child {
    margin-right: 40px;
    background: #8f6ed5;
    color: #fff;
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%
}

.share-animation .conversation li:first-child::after {
    left: 15px;
    background: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='29'%3E%3Cpath fill='%238f6ed5' d='M4 4.245V16.72a2.25 2.25 0 0 0 3.84 1.59L23.59 2.654a2.25 2.25 0 0 1 1.592-.66L28 2V0H0v2h1.75A2.25 2.25 0 0 1 4 4.245z'/%3E%3C/svg%3E")
}

.share-animation .conversation li:nth-child(2) {
    margin-left: 40px;
    background: #f6f9fc!important;
    color: #525f7f;
    position: relative;
    -webkit-transform-origin: 50% 0;
    transform-origin: 50% 0
}

.share-animation .conversation li:nth-child(2):after {
    right: 15px;
    background: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='29'%3E%3Cpath fill='%23f6f9fc' d='M26.2 2H28V0H0v2h2.8c.6 0 1.2.2 1.6.7l15.8 15.7c.4.4 1 .7 1.6.7 1.2 0 2.2-1 2.2-2.3V4.2C24 3 25 2 26.2 2z'/%3E%3C/svg%3E")
}

.share-animation .conversation li p {
    padding: 20px 25px
}

.share-animation .conversation li a {
    font-weight: 500;
    border-bottom: 2px solid rgba(103, 114, 229, .3);
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin-bottom: 3px;
    color: #6772e5
}

.share-animation .conversation li pre {
    background: #fff;
    padding: 20px 25px;
    position: relative;
    border-radius: 10px 10px 0 0;
    overflow: hidden
}

.share-animation .conversation li pre:after {
    content: "";
    position: absolute;
    pointer-events: none;
    top: 0;
    right: 0;
    bottom: 0;
    width: 40px;
    background: -webkit-gradient(linear, left top, right top, from(hsla(0, 0%, 100%, 0)), to(#fff));
    background: linear-gradient(90deg, hsla(0, 0%, 100%, 0), #fff)
}

.share-animation .conversation li pre .badge {
    background: rgba(119, 149, 248, .3);
    color: #6772e5;
    font: 500 13px/22px Camphor, Open Sans, Segoe UI, sans-serif;
    padding: 0 8px;
    margin: 3px 0 3px -2px;
    border-radius: 50px;
    display: inline-block
}

.sigma-header .stripes-container>div:first-child {
    top: -609px;
    background: -webkit-gradient(linear, left top, right top, from(#d7dee8), color-stop(20%, rgba(215, 222, 232, 0)));
    background: linear-gradient(90deg, #d7dee8, rgba(215, 222, 232, 0) 20%)
}

.sigma-header .stripes-container>div:nth-child(2) {
    top: -119px;
    background: -webkit-gradient(linear, left top, right top, color-stop(60%, rgba(224, 226, 241, 0)), to(#e0e2f1));
    background: linear-gradient(90deg, rgba(224, 226, 241, 0) 60%, #e0e2f1)
}

.sigma-header .stripes-container>div:nth-child(3) {
    top: 126px;
    background: -webkit-gradient(linear, left top, right top, from(rgba(190, 176, 244, 0)), to(rgba(190, 176, 244, .15)));
    background: linear-gradient(90deg, rgba(190, 176, 244, 0), rgba(190, 176, 244, .15))
}

.sigma-header .stripes-container>div:nth-child(4) {
    bottom: -265px;
    background: -webkit-gradient(linear, left top, right top, color-stop(75%, rgba(237, 241, 245, 0)), to(#edf1f5));
    background: linear-gradient(90deg, rgba(237, 241, 245, 0) 75%, #edf1f5)
}

.sigma-header .stripes-container .pattern {
    display: none
}

@media (min-width:670px) {
    .sigma-header .stripes-container .pattern {
        display: block
    }
}

.sigma-header .stripes-container .dyn {
    bottom: -20px;
    opacity: 0;
    will-change: opacity;
    -webkit-transition: opacity 2s;
    transition: opacity 2s
}

.sigma-header .stripes-container .dyn.businessOperations {
    background: -webkit-gradient(linear, left top, right top, from(rgba(183, 106, 196, .25)), color-stop(50%, rgba(183, 106, 196, 0)));
    background: linear-gradient(90deg, rgba(183, 106, 196, .25), rgba(183, 106, 196, 0) 50%)
}

.sigma-header .stripes-container .dyn.finance {
    background: -webkit-gradient(linear, left top, right top, from(rgba(36, 180, 126, .25)), color-stop(50%, rgba(36, 180, 126, 0)));
    background: linear-gradient(90deg, rgba(36, 180, 126, .25), rgba(36, 180, 126, 0) 50%)
}

.sigma-header .stripes-container .dyn.dataAnalysis {
    background: -webkit-gradient(linear, left top, right top, from(rgba(227, 124, 76, .25)), color-stop(50%, rgba(227, 124, 76, 0)));
    background: linear-gradient(90deg, rgba(227, 124, 76, .25), rgba(227, 124, 76, 0) 50%)
}

.sigma-header .stripes-container .dyn.productManagement {
    background: -webkit-gradient(linear, left top, right top, from(rgba(50, 151, 211, .25)), color-stop(50%, rgba(50, 151, 211, 0)));
    background: linear-gradient(90deg, rgba(50, 151, 211, .25), rgba(50, 151, 211, 0) 50%)
}

.sigma-header.businessOperations .stripes-container .businessOperations,
.sigma-header.dataAnalysis .stripes-container .dataAnalysis,
.sigma-header.finance .stripes-container .finance,
.sigma-header.productManagement .stripes-container .productManagement {
    opacity: 1
}

.sigma-header .headline {
    background: #e6ebf1;
    padding: 150px 0 690px;
    margin-bottom: -650px;
    text-align: center
}

.sigma-header .headline h1 {
    z-index: 10;
    position: relative
}

@media (min-height:1000px) {
    .sigma-header .headline {
        padding-top: 170px
    }
}

.sigma-header .content {
    position: relative;
    z-index: 2
}

.sigma-header .content:before {
    content: "";
    position: absolute;
    z-index: -1;
    left: 0;
    top: 126px;
    right: 0;
    bottom: -20px;
    -webkit-transform: skewY(-12deg);
    transform: skewY(-12deg);
    background: #323a5a linear-gradient(192deg, #51557d, #222d49)
}

.sigma-header .screencast-container {
    position: relative
}

@media (min-height:1000px) {
    .sigma-header .screencast-container {
        max-width: 1160px
    }
}

.sigma-header .screencast {
    width: 100%;
    padding-top: 56.25%;
    position: relative;
    border-radius: 6px;
    overflow: hidden;
    -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, .1), 0 15px 35px rgba(0, 0, 0, .1), 0 50px 100px rgba(50, 50, 93, .1);
    box-shadow: 0 5px 15px rgba(0, 0, 0, .1), 0 15px 35px rgba(0, 0, 0, .1), 0 50px 100px rgba(50, 50, 93, .1);
    background: #f6f9fc url(/img/v3/sigma/header/screencast-poster.jpg) 50%/100%
}

.sigma-header .screencast video {
    position: absolute;
    left: 0;
    top: 0;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    border-radius: 7px
}

.sigma-header .screencast .play-button {
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    pointer-events: none;
    display: none;
    background: #32325d;
    opacity: .9;
    border-radius: 50%;
    -webkit-box-shadow: 0 7px 14px rgba(50, 50, 93, .1), 0 3px 6px rgba(0, 0, 0, .08);
    box-shadow: 0 7px 14px rgba(50, 50, 93, .1), 0 3px 6px rgba(0, 0, 0, .08);
    width: 72px;
    height: 72px
}

.sigma-header .screencast .play-button svg {
    width: 100%;
    height: 100%
}

.sigma-header .screencast-chat {
    position: absolute;
    top: calc(50% - 180px);
    width: 360px;
    height: 360px;
    pointer-events: none;
    display: none;
    right: 5px;
    will-change: transform;
    -webkit-transform-origin: 100% 50%;
    transform-origin: 100% 50%
}

@media (min-width:670px) {
    .sigma-header .screencast-chat {
        display: block;
        -webkit-transform: scale(.7);
        transform: scale(.7)
    }
}

@media (min-width:880px) {
    .sigma-header .screencast-chat {
        -webkit-transform: scale(.85);
        transform: scale(.85)
    }
}

@media (min-width:1040px) {
    .sigma-header .screencast-chat {
        display: block;
        -webkit-transform: none;
        transform: none
    }
}

@media (min-width:1350px) {
    .sigma-header .screencast-chat {
        right: -60px
    }
}

.sigma-header .screencast-chat .background {
    position: absolute;
    left: 10px;
    top: 10px;
    right: 10px;
    bottom: 10px;
    border-radius: 50%;
    background: rgba(207, 215, 223, .75);
    opacity: .001;
    will-change: opacity, transform
}

.sigma-header .screencast-chat .bubbles {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    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-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.sigma-header .screencast-chat .bubbles li {
    font-size: 18px;
    line-height: 25px;
    padding: 17px 20px;
    position: relative;
    margin: 10px 0;
    border-radius: 10px;
    -webkit-box-shadow: 0 7px 14px rgba(50, 50, 93, .1), 0 3px 6px rgba(0, 0, 0, .08);
    box-shadow: 0 7px 14px rgba(50, 50, 93, .1), 0 3px 6px rgba(0, 0, 0, .08);
    opacity: .001;
    will-change: opacity, transform
}

.sigma-header .screencast-chat .bubbles li:after {
    content: "";
    position: absolute;
    bottom: -17px;
    width: 28px;
    height: 19px
}

.sigma-header .screencast-chat .bubbles li:first-child {
    margin-right: 50px;
    background: #8f6ed5;
    color: #fff;
    -webkit-transform-origin: 20% 100%;
    transform-origin: 20% 100%
}

.sigma-header .screencast-chat .bubbles li:first-child::after {
    left: 20px;
    background: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='29'%3E%3Cpath fill='%238f6ed5' d='M4 4.245V16.72a2.25 2.25 0 0 0 3.84 1.59L23.59 2.654a2.25 2.25 0 0 1 1.592-.66L28 2V0H0v2h1.75A2.25 2.25 0 0 1 4 4.245z'/%3E%3C/svg%3E")
}

.sigma-header .screencast-chat .bubbles li:nth-child(2) {
    margin-left: 50px;
    background: #fff;
    color: #525f7f;
    position: relative;
    -webkit-transform-origin: 80% 100%;
    transform-origin: 80% 100%
}

.sigma-header .screencast-chat .bubbles li:nth-child(2):after {
    right: 20px;
    background: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='29'%3E%3Cpath fill='%23f6f9fc' d='M26.2 2H28V0H0v2h2.8c.6 0 1.2.2 1.6.7l15.8 15.7c.4.4 1 .7 1.6.7 1.2 0 2.2-1 2.2-2.3V4.2C24 3 25 2 26.2 2z'/%3E%3C/svg%3E")
}

.sigma-header .screencast-chat .bubbles li a {
    font-weight: 500;
    border-bottom: 2px solid rgba(103, 114, 229, .3);
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #6772e5;
    opacity: .001;
    will-change: opacity, transform
}

.sigma-header .examples {
    margin: 100px 0 0;
    position: relative;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    opacity: 0;
    -webkit-transition: opacity .8s;
    transition: opacity .8s
}

.sigma-header .examples.loaded {
    opacity: 1
}

.sigma-header .examples .use-cases {
    position: relative;
    min-height: 91px;
    overflow: hidden
}

.sigma-header .examples .tabs {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.sigma-header .examples .tabs-canvas {
    -webkit-tap-highlight-color: transparent;
    -webkit-transition: -webkit-transform .4s;
    transition: -webkit-transform .4s;
    transition: transform .4s;
    transition: transform .4s, -webkit-transform .4s;
    will-change: transform
}

.sigma-header .examples .texts {
    position: relative
}

.sigma-header .examples .texts p {
    position: absolute;
    top: 20px;
    left: 0;
    right: 0;
    font-size: 22px;
    line-height: 33px;
    color: #fff;
    text-align: center;
    opacity: 0;
    pointer-events: none;
    will-change: opacity
}

.sigma-header .examples .texts p.active {
    pointer-events: auto;
    opacity: 1;
    -webkit-transition-delay: .3s!important;
    transition-delay: .3s!important
}

.sigma-header .examples .texts .businessOperations {
    color: #ffc7ee
}

.sigma-header .examples .texts .finance {
    color: #aff1b6
}

.sigma-header .examples .texts .dataAnalysis {
    color: #fdda94
}

.sigma-header .examples .texts .productManagement {
    color: #8feffb
}

.sigma-header .examples.animate .active-category {
    -webkit-transition-property: width, background-color, -webkit-transform;
    transition-property: width, background-color, -webkit-transform;
    transition-property: width, background-color, transform;
    transition-property: width, background-color, transform, -webkit-transform;
    -webkit-transition-duration: .4s;
    transition-duration: .4s
}

.sigma-header .examples.animate .active-category li {
    -webkit-transition: -webkit-transform .4s;
    transition: -webkit-transform .4s;
    transition: transform .4s;
    transition: transform .4s, -webkit-transform .4s
}

.sigma-header .examples.animate .categories li {
    -webkit-transition: color .2s, -webkit-transform .4s;
    transition: color .2s, -webkit-transform .4s;
    transition: color .2s, transform .4s;
    transition: color .2s, transform .4s, -webkit-transform .4s
}

.sigma-header .examples.animate .texts p {
    -webkit-transition: opacity .3s;
    transition: opacity .3s
}

.sigma-header .cards {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 240px;
    margin-top: 40px
}

.sigma-header .cards canvas {
    -webkit-tap-highlight-color: transparent;
    -ms-touch-action: pan-y pinch-zoom;
    touch-action: pan-y pinch-zoom
}

.sigma-pricing {
    background: #eef2f7;
    margin-top: -500px;
    padding-top: 590px;
    position: relative
}

.sigma-pricing.short-quotes {
    z-index: 2;
    margin-top: 0;
    padding-top: 100px
}

@media (min-width:880px) {
    .sigma-pricing {
        padding-top: 640px
    }
}

.sigma-pricing:before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: -600px;
    bottom: 190px;
    background: #e6ebf1;
    -webkit-transform: skewY(-12deg);
    transform: skewY(-12deg)
}

.sigma-pricing .section-header {
    position: relative;
    padding-top: 40px;
    z-index: 10
}

.sigma-pricing .pricing-box {
    padding: 0;
    margin-top: 90px;
    z-index: 20
}

.sigma-pricing .badge {
    position: absolute;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    white-space: nowrap;
    background: #6b7c93;
    color: #fff;
    padding: 3px 15px;
    border-radius: 50px
}

.sigma-pricing .totals {
    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-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    background: #f6f9fc;
    padding: 30px 0
}

.sigma-pricing .totals li {
    text-align: center;
    padding: 20px 0;
    margin: 0 40px
}

@media (min-width:670px) {
    .sigma-pricing .totals li {
        -webkit-box-flex: 1;
        -ms-flex: 1 1 50%;
        flex: 1 1 50%
    }
}

.sigma-pricing .totals h2 {
    white-space: nowrap;
    font-size: 38px;
    font-weight: 300;
    color: #32325d;
    -webkit-font-feature-settings: "tnum";
    font-feature-settings: "tnum";
    font-variant-numeric: tabular-nums
}

.sigma-pricing .totals p {
    font-size: 19px;
    color: #8898aa;
    margin-top: 7px
}

.sigma-pricing .totals .cost {
    border-top: 2px solid #e6ebf1;
    position: relative
}

.sigma-pricing .totals .cost h2 {
    font-weight: 500
}

.sigma-pricing .totals .cost .button,
.sigma-pricing .totals .cost .number {
    -webkit-transition-property: opacity, -webkit-transform, -webkit-filter;
    transition-property: opacity, -webkit-transform, -webkit-filter;
    transition-property: transform, opacity, filter;
    transition-property: transform, opacity, filter, -webkit-transform, -webkit-filter;
    -webkit-transition-duration: .4s;
    transition-duration: .4s
}

.sigma-pricing .totals .cost .button {
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%) scale(1.1);
    transform: translate(-50%, -50%) scale(1.1);
    opacity: 0;
    pointer-events: none
}

@media (min-width:670px) {
    .sigma-pricing .totals {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
        padding: 60px 0 50px
    }
    .sigma-pricing .totals li {
        padding: 0 20px;
        margin: 0;
        max-width: 350px
    }
    .sigma-pricing .totals .cost {
        border-top: none;
        border-left: 2px solid #e6ebf1
    }
}

.sigma-pricing.contact-sales .totals .cost .number {
    opacity: .3;
    pointer-events: none;
    -webkit-filter: blur(10px);
    filter: blur(10px)
}

.sigma-pricing.contact-sales .totals .cost .button {
    opacity: 1;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    pointer-events: auto
}

.sigma-pricing .slider {
    height: 6px;
    margin: -3px 30px;
    position: relative;
    -webkit-tap-highlight-color: transparent;
    -ms-touch-action: pan-y pinch-zoom;
    touch-action: pan-y pinch-zoom
}

@media (min-width:670px) {
    .sigma-pricing .slider {
        margin: -3px 60px
    }
}

.sigma-pricing .slider .rail {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 10px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.sigma-pricing .slider .rail li {
    width: 20%;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    height: 100%;
    position: relative;
    color: #cfd7df;
    background: currentColor;
    border-radius: 10px
}

.sigma-pricing .slider .rail li:after {
    content: "";
    position: absolute;
    left: 100%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 10px;
    height: 10px;
    border: 3px solid currentColor;
    border-radius: 50%;
    background: #fff;
    z-index: 10;
    pointer-events: none
}

.sigma-pricing .slider .rail li:last-child:after {
    content: none
}

.sigma-pricing .slider .rail.active li {
    width: 0
}

.sigma-pricing .slider .rail.active li:first-child {
    color: #24b47e
}

.sigma-pricing .slider .rail.active li:nth-child(2) {
    color: #3ecf8e
}

.sigma-pricing .slider .rail.active li:nth-child(3) {
    color: #55d9c2
}

.sigma-pricing .slider .rail.active li:nth-child(4) {
    color: #63bed8
}

.sigma-pricing .slider .rail.active li:nth-child(5) {
    color: #7795f8
}

.sigma-pricing .slider .rail.active li:nth-child(6) {
    color: #778aa3
}

.sigma-pricing .slider .knob {
    position: absolute;
    width: 44px;
    height: 44px;
    margin: -19px 0 0 -22px;
    z-index: 20;
    background: #424770 url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="26" height="18" stroke="white" stroke-width="1.5px" stroke-linecap="round" stroke-linejoin="round" fill="none"><path d="M8.811,3.153 L3.014,8.950 L8.811,14.748 "/><path d="M17.207,14.792 L23.004,8.995 L17.207,3.198 "/></svg>') 50% no-repeat;
    border-radius: 50%;
    -webkit-box-shadow: 0 4px 6px rgba(50, 50, 93, .11), 0 1px 3px rgba(0, 0, 0, .08);
    box-shadow: 0 4px 6px rgba(50, 50, 93, .11), 0 1px 3px rgba(0, 0, 0, .08);
    -webkit-transition-property: background-color, -webkit-box-shadow;
    transition-property: background-color, -webkit-box-shadow;
    transition-property: background-color, box-shadow;
    transition-property: background-color, box-shadow, -webkit-box-shadow;
    -webkit-transition-duration: .2s;
    transition-duration: .2s;
    cursor: ew-resize
}

.sigma-pricing .slider .knob:hover {
    background-color: #525f7f;
    -webkit-box-shadow: 0 7px 14px rgba(50, 50, 93, .1), 0 3px 6px rgba(0, 0, 0, .08);
    box-shadow: 0 7px 14px rgba(50, 50, 93, .1), 0 3px 6px rgba(0, 0, 0, .08)
}

.sigma-pricing .labels {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    padding-top: 50px
}

.sigma-pricing .labels,
.sigma-pricing .labels li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.sigma-pricing .labels li {
    font-size: 15px;
    line-height: 22px;
    color: #aab7c4;
    position: relative
}

.sigma-pricing .labels li h3,
.sigma-pricing .labels li p {
    -webkit-transition: color .2s;
    transition: color .2s;
    width: 50%;
    padding: 3px 10px
}

.sigma-pricing .labels li h3 {
    text-align: right
}

.sigma-pricing .labels li:before {
    position: absolute;
    left: 0;
    top: 50%;
    -webkit-transform: translate(-50%, -67%);
    transform: translate(-50%, -67%);
    font-size: 25px;
    font-weight: 300;
    color: #cfd7df;
    opacity: 0;
    -webkit-transition: opacity .2s;
    transition: opacity .2s
}

.sigma-pricing .labels li:first-child:before {
    content: none
}

.sigma-pricing .labels li:first-child.active h3 {
    color: #24b47e
}

.sigma-pricing .labels li:nth-child(2).active h3 {
    color: #3ecf8e
}

.sigma-pricing .labels li:nth-child(3).active h3 {
    color: #55d9c2
}

.sigma-pricing .labels li:nth-child(4).active h3 {
    color: #63bed8
}

.sigma-pricing .labels li:nth-child(5).active h3 {
    color: #7795f8
}

.sigma-pricing .labels li:nth-child(6).active h3 {
    color: #778aa3
}

.sigma-pricing .labels li.active p {
    color: #32325d
}

.sigma-pricing .labels li.active:before {
    opacity: 1
}

.sigma-pricing .labels h3 {
    font-size: inherit;
    font-weight: 500
}

.sigma-pricing .labels .slash {
    padding: 0 .1em
}

@media (min-width:670px) {
    .sigma-pricing .labels {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
        padding: 60px 60px 0
    }
    .sigma-pricing .labels li {
        width: 25%;
        display: block
    }
    .sigma-pricing .labels li:before {
        content: "+"
    }
    .sigma-pricing .labels li h3,
    .sigma-pricing .labels li p {
        width: auto;
        text-align: center;
        padding: 0
    }
}

.sigma-pricing .infra-fee-row {
    margin-top: 10px;
    height: 60px;
    position: relative;
    text-align: center
}

@media (min-width:670px) {
    .sigma-pricing .infra-fee-row {
        height: 80px;
        margin: 10px 60px 0
    }
}

.sigma-pricing .infra-fee {
    font-size: 15px;
    font-weight: 500;
    color: #32325d;
    text-align: center;
    opacity: 0;
    -webkit-transition-property: left, opacity;
    transition-property: left, opacity;
    -webkit-transition-duration: .2s;
    transition-duration: .2s
}

@media (min-width:670px) {
    .sigma-pricing .infra-fee {
        width: 400px;
        margin-left: -200px;
        position: absolute
    }
}

.sigma-pricing .footnote {
    font-size: 15px;
    line-height: 22px;
    color: #8898aa;
    padding-top: 30px
}

.sigma-pricing .footnote strong {
    font-weight: 500;
    color: #6b7c93
}

.sigma-pricing.contact-sales .infra-fee {
    opacity: 0
}

.sigma-quotes {
    position: relative;
    z-index: 10
}

.sigma-quotes .stripes-container>div:first-child {
    top: -245px;
    background: -webkit-gradient(linear, left top, right top, from(#d7dee8), color-stop(30%, rgba(215, 222, 232, 0)));
    background: linear-gradient(90deg, #d7dee8, rgba(215, 222, 232, 0) 30%)
}

.sigma-quotes .stripes-container>div:nth-child(2) {
    bottom: -245px;
    background: -webkit-gradient(linear, left top, right top, color-stop(70%, rgba(207, 217, 228, 0)), to(#cfd9e4));
    background: linear-gradient(90deg, rgba(207, 217, 228, 0) 70%, #cfd9e4)
}

.sigma-quotes .quotes-row {
    -webkit-transform: skewY(-12deg);
    transform: skewY(-12deg);
    margin: 0
}

.sigma-quotes .cell {
    background: #32325d;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-top: -1px;
    position: relative;
    overflow: hidden
}

@media (min-width:880px) {
    .sigma-quotes .cell {
        -webkit-box-flex: 1;
        -ms-flex: 1 0 50%;
        flex: 1 0 50%
    }
}

.sigma-quotes .bottom-left,
.sigma-quotes .top-left {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.sigma-quotes .quote-stripe {
    position: absolute;
    height: 245px;
    width: 600px;
    bottom: 0;
    background-position: 50%;
    background-repeat: no-repeat;
    display: none
}

@media (min-width:1040px) {
    .sigma-quotes .quote-stripe {
        display: block
    }
}

.sigma-quotes .inner {
    -webkit-transform: skewY(12deg);
    transform: skewY(12deg);
    text-align: center;
    padding: 80px 20px
}

@media (min-width:880px) {
    .sigma-quotes .inner {
        padding: 100px 60px;
        max-width: 580px
    }
}

@media (min-width:1040px) {
    .sigma-quotes .inner {
        padding: 140px 80px
    }
}

.sigma-quotes .inner .icon {
    display: block;
    margin-bottom: 35px;
    -webkit-transition: opacity .2s;
    transition: opacity .2s
}

.sigma-quotes .inner .icon:hover {
    opacity: .5
}

.sigma-quotes .inner .quote-body {
    color: #fff;
    font: italic 20px/32px Camphor
}

.sigma-quotes .inner .attribution {
    margin-top: 25px;
    color: #a78ce9
}

.sigma-quotes .top-left {
    padding-top: 60px;
    background: #222d49
}

@media (min-width:880px) {
    .sigma-quotes .top-left {
        padding-top: 0;
        background: #222d49 linear-gradient(192deg, #222d49, #32385c)
    }
}

.sigma-quotes .top-right {
    background: #2f3555
}

.sigma-quotes .top-right .quote-stripe {
    left: 580px
}

@media (min-width:880px) {
    .sigma-quotes .top-right {
        background: #313554 linear-gradient(192deg, #313554, #3b3c60)
    }
}

.sigma-quotes .bottom-left {
    background: #3e4065
}

.sigma-quotes .bottom-left .quote-stripe {
    right: 580px
}

@media (min-width:880px) {
    .sigma-quotes .bottom-left {
        background: #3b3d61 linear-gradient(192deg, #3b3d61, #4d4a78)
    }
}

.sigma-quotes .bottom-right {
    padding-bottom: 60px;
    background: #4b4874
}

@media (min-width:880px) {
    .sigma-quotes .bottom-right {
        padding-bottom: 0;
        background: #444166 linear-gradient(192deg, #444166, #564f7e)
    }
}

.sigma-quotes.short {
    padding: 80px 0;
    overflow: hidden;
    background: #222d49 -webkit-gradient(linear, left top, right top, from(#222d49), to(#4d4a78));
    background: #222d49 linear-gradient(90deg, #222d49, #4d4a78)
}

.sigma-quotes.short .container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

@media (min-width:670px) {
    .sigma-quotes.short .container {
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap
    }
}

.sigma-quotes.short a {
    display: block;
    -webkit-transition: opacity .2s;
    transition: opacity .2s;
    padding: 20px;
    -webkit-box-flex: 1;
    -ms-flex: 1 0 50%;
    flex: 1 0 50%
}

@media (min-width:670px) {
    .sigma-quotes.short a {
        -webkit-box-flex: 0;
        -ms-flex: 0 1 auto;
        flex: 0 1 auto
    }
}

.sigma-quotes.short a:hover {
    opacity: .5
}

.sigma-quotes.short a svg {
    width: 100%
}

.sigma-quotes.short .quote-stripe {
    -webkit-transform: skewY(-12deg);
    transform: skewY(-12deg)
}

.sigma-quotes.short .quote-stripe1 {
    left: calc(50% + 580px);
    bottom: -120px
}

.sigma-quotes.short .quote-stripe2 {
    right: calc(50% + 580px);
    top: -120px
}

@-webkit-keyframes schema-ui-glow {
    0% {
        opacity: 0
    }
    40% {
        opacity: .8
    }
    to {
        opacity: 0
    }
}

@keyframes schema-ui-glow {
    0% {
        opacity: 0
    }
    40% {
        opacity: .8
    }
    to {
        opacity: 0
    }
}

.schema-ui {
    position: absolute;
    top: 0;
    left: 10px;
    right: 10px;
    bottom: 0;
    max-width: 400px;
    margin: 0 auto;
    -webkit-tap-highlight-color: transparent;
    font-family: Montserrat, Open Sans, Segoe UI, sans-serif;
    background: #fff;
    border-radius: 10px 10px 0 0;
    -webkit-box-shadow: 0 15px 35px rgba(50, 50, 93, .1), 0 5px 15px rgba(0, 0, 0, .07);
    box-shadow: 0 15px 35px rgba(50, 50, 93, .1), 0 5px 15px rgba(0, 0, 0, .07)
}

@media (min-width:880px) {
    .schema-ui {
        top: 60px;
        left: 0;
        right: 60px;
        margin: 0
    }
}

.schema-ui:before {
    content: "";
    position: absolute;
    z-index: -1;
    left: -6px;
    top: -6px;
    right: -6px;
    bottom: -6px;
    border-radius: 16px 16px 0 0;
    background: #9cdbff;
    opacity: .75
}

.schema-ui .search-pill {
    margin: 20px 20px 0;
    background: #f6f9fc;
    border-radius: 4px;
    position: relative
}

.schema-ui .search-pill:before {
    content: "";
    position: absolute;
    width: 13px;
    height: 13px;
    left: 10px;
    top: 8px;
    background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMyIgaGVpZ2h0PSIxMyIgdmlld0JveD0iMCAwIDEzIDEzIj48ZyBmaWxsPSIjODg5OEFBIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPjxwYXRoIGQ9Ik01LjI1IDExYTUuMjUgNS4yNSAwIDEgMCAwLTEwLjUgNS4yNSA1LjI1IDAgMCAwIDAgMTAuNXptMC0uOTVhNC4zIDQuMyAwIDEgMCAwLTguNiA0LjMgNC4zIDAgMCAwIDAgOC42eiIvPjxwYXRoIGQ9Ik04LjU0MiA5LjY0NWwxLjA2MS0xLjA2MSAyLjU5NSAyLjU5NWEuNzQ4Ljc0OCAwIDAgMSAwIDEuMDYuNzQ4Ljc0OCAwIDAgMS0xLjA2IDBMOC41NDEgOS42NDV6Ii8+PC9nPjwvc3ZnPg==) no-repeat;
    pointer-events: none
}

.schema-ui .search-pill input {
    background: none;
    border: none;
    font-family: inherit;
    font-size: 14px;
    line-height: 27px;
    color: #424770;
    width: 100%;
    padding: 1px 28px 0;
    border-radius: 4px;
    -webkit-transition: -webkit-box-shadow .2s;
    transition: -webkit-box-shadow .2s;
    transition: box-shadow .2s;
    transition: box-shadow .2s, -webkit-box-shadow .2s;
    position: relative
}

.schema-ui .search-pill input::-webkit-input-placeholder {
    color: #8898aa
}

.schema-ui .search-pill input:-ms-input-placeholder,
.schema-ui .search-pill input::-ms-input-placeholder {
    color: #8898aa
}

.schema-ui .search-pill input::placeholder {
    color: #8898aa
}

.schema-ui .search-pill input:focus {
    outline: none;
    -webkit-box-shadow: 0 0 0 .5px rgba(50, 151, 211, .2), 0 0 0 2px rgba(50, 151, 211, .25), 0 .5px 1px rgba(0, 0, 0, .08);
    box-shadow: 0 0 0 .5px rgba(50, 151, 211, .2), 0 0 0 2px rgba(50, 151, 211, .25), 0 .5px 1px rgba(0, 0, 0, .08)
}

.schema-ui .search-pill .clear {
    border: none;
    outline: none;
    background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxNiAxNiI+PHBhdGggZD0iTTggMTZBOCA4IDAgMSAwIDggMGE4IDggMCAwIDAgMCAxNnptMC02LjgxbDIuMzcgMi4zNyAxLjE5LTEuMTlMOS4xOSA4bDIuMzctMi4zNy0xLjE5LTEuMTlMOCA2LjgxIDUuNjMgNC40NCA0LjQ0IDUuNjMgNi44MSA4bC0yLjM3IDIuMzcgMS4xOSAxLjE5TDggOS4xOXoiIGZpbGw9IiM4Nzk4QUIiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvc3ZnPg==);
    width: 16px;
    height: 16px;
    position: absolute;
    top: 6px;
    right: 6px;
    cursor: pointer;
    display: none
}

.schema-ui .list {
    position: absolute;
    top: 60px;
    left: 0;
    right: 0;
    bottom: 0;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    cursor: default
}

.schema-ui .list .inner {
    overflow: hidden;
    position: relative
}

.schema-ui .list .inner>* {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    padding: 0 20px;
    -webkit-transition: opacity .15s, -webkit-transform .2s;
    transition: opacity .15s, -webkit-transform .2s;
    transition: transform .2s, opacity .15s;
    transition: transform .2s, opacity .15s, -webkit-transform .2s;
    will-change: transform, opacity
}

.schema-ui.idle .list .inner>* {
    -webkit-transition: opacity .4s, -webkit-transform .7s cubic-bezier(.15, 0, .15, 1);
    transition: opacity .4s, -webkit-transform .7s cubic-bezier(.15, 0, .15, 1);
    transition: transform .7s cubic-bezier(.15, 0, .15, 1), opacity .4s;
    transition: transform .7s cubic-bezier(.15, 0, .15, 1), opacity .4s, -webkit-transform .7s cubic-bezier(.15, 0, .15, 1)
}

.schema-ui .no-animation {
    -webkit-transition: none!important;
    transition: none!important
}

.schema-ui .no-results-message {
    font-size: 14px;
    color: #6b7c93;
    top: 10px!important;
    opacity: 0;
    pointer-events: none;
    -webkit-transition: opacity .2s;
    transition: opacity .2s
}

.schema-ui .no-results .no-results-message {
    opacity: 1
}

.schema-ui .section-name {
    color: #8898aa;
    text-transform: uppercase;
    font-weight: 500;
    font-size: 13px;
    letter-spacing: .025em;
    margin-top: 20px
}

.schema-ui .table-name {
    font: 13px/18px Source Code Pro, monospace;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    cursor: pointer;
    color: #424770;
    font-weight: 700;
    margin-top: 9px
}

.schema-ui .table-name:hover {
    color: #32325d
}

.schema-ui .column {
    position: relative;
    padding-left: 40px!important;
    color: #8898aa;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.schema-ui .column:first-child {
    margin-top: 4px
}

.schema-ui .column:hover {
    background: rgba(227, 234, 255, .5);
    color: #555abf!important
}

.schema-ui .column.key {
    color: #6772e5
}

.schema-ui .column-name {
    font: 13px/24px Source Code Pro, monospace;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto
}

.schema-ui .column-type {
    font-size: 12px;
    line-height: 24px;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    text-transform: capitalize
}

.schema-tooltip {
    position: fixed;
    max-width: 300px;
    background: #fff;
    border-radius: 4px;
    -webkit-box-shadow: 0 0 0 1px rgba(136, 152, 170, .1), 0 15px 35px 0 rgba(49, 49, 93, .1), 0 5px 15px 0 rgba(0, 0, 0, .08);
    box-shadow: 0 0 0 1px rgba(136, 152, 170, .1), 0 15px 35px 0 rgba(49, 49, 93, .1), 0 5px 15px 0 rgba(0, 0, 0, .08);
    padding: 17px 20px;
    font-size: 14px;
    line-height: 1.6;
    color: #525f7f;
    opacity: 0;
    -webkit-transition: opacity .2s;
    transition: opacity .2s;
    pointer-events: none;
    z-index: 10;
    -webkit-transform: translate(-50%, 10px);
    transform: translate(-50%, 10px)
}

@media (min-width:670px) {
    .schema-tooltip {
        -webkit-transform: translate(-5px, -50%);
        transform: translate(-5px, -50%)
    }
}

.schema-tooltip.visible {
    opacity: 1;
    pointer-events: auto
}

.schema-tooltip:before {
    content: "";
    position: absolute;
    left: 50%;
    top: 1px;
    width: 0;
    height: 0;
    border: 6px solid #fff;
    border-right-color: transparent;
    border-bottom-color: transparent;
    border-top-left-radius: 3px;
    -webkit-box-shadow: -1px -1px 0 rgba(0, 0, 0, .08);
    box-shadow: -1px -1px 0 rgba(0, 0, 0, .08);
    -webkit-transform: translate(-50%, -50%) rotate(45deg);
    transform: translate(-50%, -50%) rotate(45deg)
}

@media (min-width:670px) {
    .schema-tooltip:before {
        left: 0;
        top: 50%;
        -webkit-transform: translate(-50%, -50%) rotate(-45deg);
        transform: translate(-50%, -50%) rotate(-45deg)
    }
}

.schema-tooltip code {
    font-size: 12px;
    background-color: #f6f9fc;
    border: 1px solid #e6ebf1;
    color: #6b7c93;
    border-radius: 3px
}

.zoom-card-overlay {
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 1000;
    pointer-events: none;
    overflow: hidden;
    -webkit-perspective: 2000px;
    perspective: 2000px;
    display: none
}

.zoom-card-overlay:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background: rgba(82, 95, 127, .7);
    opacity: 0;
    -webkit-transition: opacity .5s;
    transition: opacity .5s;
    -webkit-transform: translateZ(-2000px) scale(2);
    transform: translateZ(-2000px) scale(2);
    will-change: opacity
}

.zoom-card-overlay.visible {
    pointer-events: auto
}

.zoom-card-overlay.visible:before {
    opacity: 1
}

.zoom-card-template {
    display: none
}

.zoom-card {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1000;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -webkit-transition: -webkit-transform .6s cubic-bezier(.25, 0, .35, 1);
    transition: -webkit-transform .6s cubic-bezier(.25, 0, .35, 1);
    transition: transform .6s cubic-bezier(.25, 0, .35, 1);
    transition: transform .6s cubic-bezier(.25, 0, .35, 1), -webkit-transform .6s cubic-bezier(.25, 0, .35, 1);
    will-change: transform
}

.zoom-card>* {
    position: absolute;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}

.zoom-card canvas {
    border-radius: 10px;
    overflow: hidden;
    -webkit-box-shadow: 0 7px 14px rgba(50, 50, 93, .1), 0 3px 6px rgba(0, 0, 0, .08);
    box-shadow: 0 7px 14px rgba(50, 50, 93, .1), 0 3px 6px rgba(0, 0, 0, .08)
}

.zoom-card .backside {
    background: #f6f9fc;
    font-size: 17px;
    border-radius: 8px;
    -webkit-box-shadow: 0 50px 100px rgba(50, 50, 93, .1), 0 15px 35px rgba(50, 50, 93, .15), 0 5px 15px rgba(0, 0, 0, .1);
    box-shadow: 0 50px 100px rgba(50, 50, 93, .1), 0 15px 35px rgba(50, 50, 93, .15), 0 5px 15px rgba(0, 0, 0, .1);
    overflow: hidden;
    -webkit-transition: opacity .5s;
    transition: opacity .5s;
    will-change: opacity
}

.zoom-card .content {
    flex-direction: column;
    height: 100%
}

.zoom-card .content,
.zoom-card .content header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    position: relative
}

.zoom-card .content header {
    background: #fff;
    -webkit-box-shadow: 0 1px 3px rgba(50, 50, 93, .15), 0 1px 0 rgba(0, 0, 0, .02);
    box-shadow: 0 1px 3px rgba(50, 50, 93, .15), 0 1px 0 rgba(0, 0, 0, .02);
    padding: 17px 25px;
    flex-direction: column;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto
}

@media (min-width:670px) {
    .zoom-card .content header {
        padding: 28px 35px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center
    }
}

.zoom-card .content .text {
    padding-right: 20px;
    margin-bottom: 10px
}

@media (min-width:670px) {
    .zoom-card .content .text {
        margin: 0
    }
}

.zoom-card .content .category {
    margin-bottom: 5px
}

.zoom-card .content.businessOperations .category {
    color: #d782d9
}

.zoom-card .content.finance .category {
    color: #3ecf8e
}

.zoom-card .content.dataAnalysis .category {
    color: #f79a59
}

.zoom-card .content.productManagement .category {
    color: #45b2e8
}

.zoom-card .content .button {
    margin: 10px
}

@media (min-width:670px) {
    .zoom-card .content .button {
        margin: 0
    }
}

.zoom-card .content .hidden-code {
    position: absolute;
    width: 0;
    height: 0;
    overflow: hidden;
    left: -100px;
    top: -100px
}

.zoom-card .content .badge {
    position: absolute;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    bottom: 30px;
    white-space: nowrap;
    font-size: 15px;
    color: #fff;
    background: #525f7f;
    border-radius: 50px;
    padding: 4px 15px;
    -webkit-box-shadow: 0 4px 6px rgba(50, 50, 93, .11), 0 1px 3px rgba(0, 0, 0, .08);
    box-shadow: 0 4px 6px rgba(50, 50, 93, .11), 0 1px 3px rgba(0, 0, 0, .08);
    opacity: .75;
    -webkit-transition: opacity .25s;
    transition: opacity .25s;
    will-change: opacity;
    pointer-events: none
}

.zoom-card .content .badge.copied,
.zoom-card .content.copied .badge.copy {
    display: none;
    opacity: 0
}

.zoom-card .content.copied .badge.copied {
    display: block;
    opacity: 1
}

.zoom-card .content main {
    position: relative;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.zoom-card .content main:hover .badge.copy {
    opacity: 1
}

.zoom-card .content .scroll-area {
    position: relative;
    overflow: auto;
    -webkit-overflow-scrolling: touch
}

.zoom-card .content .query {
    margin: 30px;
    -webkit-user-select: auto;
    -moz-user-select: auto;
    -ms-user-select: auto;
    user-select: auto;
    padding-left: 3em
}

.zoom-card .content .line-nums {
    position: absolute;
    left: 20px;
    top: 30px;
    width: 2em;
    text-align: right;
    color: #aab7c5;
    overflow: hidden
}

.sigma-query-code {
    font-size: 13px;
    line-height: 23px;
    color: #6f7c82
}

.sigma-query-code .comment {
    color: #a0a1a7
}

.sigma-query-code .keyword {
    color: #4078f2
}

.sigma-query-code .string {
    color: #24b47e
}

.sigma-query-code .number {
    color: #f5b14d
}


/*# sourceMappingURL=index-cd87ee923f6e7b5d1e8d.css.map*/