* {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}

.main-container-wrapper {
    overflow: visible;
}

.banner-wrap {
    padding: 120px 0;
    height: auto;
}

.banner-cont {
    margin: 0 auto;
    max-width: 600px;
    width: 100%;
}

.banner-wrap h1 {
    padding: 0 0 20px;
}

.banner-wrap .zo-act-btns {
    margin: 40px 0 0;
}

.integration-wrap {
    background: #F3F2F0;
    position: relative;
    padding: 0 0 120px;
}

.integration-wrap * {
    overflow: visible !important;
}

.integrate-sticky {
    background: #293042;
    position: -webkit-sticky;
    position: sticky;
    top: 51px;
    width: 100%;
    z-index: 1;
}

.integrate-sticky ul {
    text-align: center;
}

.integrate-sticky ul li {
    display: inline-block;
    padding: 20px;
    color: #fff;
    cursor: pointer;
}

.integrate-sticky li.active {
    color: #FF7B00
}

.integrate-section {
    padding: 120px 0 0;
}

.integrate-section h2 {
    margin: 0 0 50px;
}

.integrate-section ul {
    margin: 0 -10px;
    padding: 0;
}

.integrate-section ul li {
    float: left;
    width: calc(25% - 20px);
    margin: 0 10px 20px 10px;
    padding: 60px 40px;
    background: #fff;
}

.integrate-section ul li span {
    display: block;
    width: 50px;
    height: 50px;
}

.integrate-section ul li h3 {
    margin: 30px 0 15px;
}

@supports (display: grid) {
    .integrate-section ul {
        display: grid;
        display: -ms-grid;
        -ms-grid-columns: repeat( 3, 1fr);
        grid-template-columns: repeat(3, 1fr);
        grid-gap: 20px;
        align-items: start;
        margin: 0;
    }
    .integrate-section ul li {
        width: auto;
        min-height: auto;
        margin: 0;
        height: 100%;
    }
}

@media only screen and (max-width: 1140px) {
    .banner-wrap {
        padding: 100px 0;
    }
    .integration-wrap {
        padding: 0 0 100px;
    }
    .integrate-sticky {
        top: 0
    }
    .integrate-section {
        padding: 100px 0 0;
    }
}

@media only screen and (max-width: 992px) {
    body,
    html {
        font-size: 16px
    }
    .integrate-section ul li {
        width: calc(50% - 20px);
    }
    @supports (display: grid) {
        .integrate-section ul {
            -ms-grid-columns: repeat( 2, 1fr);
            grid-template-columns: repeat( 2, 1fr);
        }
        .integrate-section ul li {
            width: auto;
            min-height: auto;
            margin: 0;
            height: 100%;
        }
    }
}

@media only screen and (max-width: 767px) {
    .banner-wrap {
        padding: 130px 0 60px;
    }
    .integration-wrap {
        padding: 0 0 60px;
    }
    .integrate-sticky {
        display: none;
    }
    .integrate-section {
        padding: 60px 0 0;
    }
    .integrate-section ul li {
        width: calc(100%);
        margin: 0 0 20px;
        padding: 40px 25px;
    }
    @supports (display: grid) {
        .integrate-section ul {
            -ms-grid-columns: repeat( 1, 1fr);
            grid-template-columns: repeat( 1, 1fr);
        }
        .integrate-section ul li {
            width: auto;
            min-height: auto;
            margin: 0;
            height: 100%;
        }
    }
}