.feature-page *,
.feature-page *:after,
.feature-page *:before {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
.content-wrap {
    padding: 0;
    max-width: 1170px;
}
header {
    background: #fef3cf;
}
section#block-panels-mini-product-menu {
    background: #fef3cf;
}
.contracts-cta {
    background: #f0483e;
    color: #fff;
    font-family: var(--zf-primary-semibold), sans-serif;
    padding: 12px 30px;
    text-align: center;
    text-transform: uppercase;
    margin: 0;
    border: 1px solid transparent;
    cursor: pointer;
    z-index: 1;
    font-size: 16px;
    display: inline-block;
}
h1 {
    font-size: 52px;
    font-family: var(--primaryfont-bold), sans-serif;
}
h2 {
    font-size: 42px;
    font-family: var(--primaryfont-bold), sans-serif;
}
h3 {
    font-size: 30px;
    font-family: var(--primaryfont-bold), sans-serif;
}
h4 {
    font-size: 26px;
    font-family: var(--primaryfont-bold), sans-serif;
}
p {
    font-size: 17px;
    line-height: 30px;
}
.banner-sec {
    background-color: #fef3cf;
    padding: 60px 0 120px;
    position: relative;
    overflow: hidden;
}
.banner-inner-sec .flex-sec {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    align-items: center;
}
.banner-inner-sec .flex-sec .left-bar-sec,
.banner-inner-sec .flex-sec .right-bar-sec {
    width: 100%;
    max-width: 50%;
    z-index: 1;
}
.banner-inner-sec .flex-sec .left-bar-sec .content-sec p {
    max-width: 580px;
    width: 100%;
}
.banner-inner-sec .flex-sec .left-bar-sec .content-sec p b{
    font-family: var(--zf-secondary-bold);
}
.img-wrap video {
    display: block;
    max-width: 500px;
    margin-left: auto;
    width: 100%;
}
.template-sec{
    position: relative;
}
.template-sec:before{
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    height: 15%;
    background: #fdf3cf;
}

.template-inner-sec .flex-sec .row-half {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: space-between;
}
.template-inner-sec .flex-sec .row-half .single-sec {
    position: relative;
    width: 100%;
    max-width: 48%;
    padding-top: 80px;
}


.template-inner-sec .flex-sec .row-full .single-sec {
    position: relative;
    width: 100%;
    max-width: 100%;
}

.template-inner-sec .flex-sec .row-full .single-sec .single-inner-sec {
    width: 100%;
    max-width: 1000px;
}

.template-inner-sec .flex-sec .row-half .single-sec .single-inner-sec {
    width: 100%;
    max-width: 420px;
}

.template-inner-sec .flex-sec .row-half .single-sec:nth-child(1){   
    background: #ffe3df;    
    padding: 120px 50px 50px;    
    border-radius: 15px;
}
.template-inner-sec .flex-sec .row-half .single-sec:nth-child(2){
    background: #dee8fd;    
    padding: 120px 50px 50px;    
    border-radius: 15px;
}

.template-inner-sec .flex-sec .row-full .single-sec{
    background: #dffff1;
    padding: 120px 50px 50px;
    border-radius: 15px;
    margin-top: 4%;
}


.template-inner-sec .flex-sec .single-sec h3:before {
    position: absolute;
    content: "";
    left: 0;
    top: -70px;
    width: 60px;
    height: 60px;
    background: url("//www.zohowebstatic.com/sites/zweb/images/contracts/features/contracts-feature-sprite-1.png") no-repeat;
    background-size: 240px auto;
}
.template-inner-sec .flex-sec .row-half .single-sec:nth-child(1) h3:before {
    background-position: 0 0;
}
.template-inner-sec .flex-sec .row-half .single-sec:nth-child(2) h3:before {
    background-position: -70px 0;
}
.template-inner-sec .flex-sec .row-full .single-sec:nth-child(1) h3:before {
    background-position: -140px 0;
}

.template-inner-sec .flex-sec .single-sec .single-inner-sec h3 {
    font-size: 30px;
    position: relative;
}

.benefits-inner-sec {
    padding: 130px 0;
}
.benefits-inner-sec .heading-sec {
    text-align: left;
}
.benefits-inner-sec .heading-sec h2 {margin-bottom: 30px;}
.benefits-inner-sec .flex-sec {
    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;
}
.benefits-inner-sec .flex-sec .left-sec{
    width: 100%;
    max-width: 55%;
}

.benefits-inner-sec .flex-sec .right-sec {
    width: 100%;
    max-width: 45%;
}

.benefits-inner-sec .flex-sec .right-sec .tick{
    padding-top: 25px;
}

.benefits-inner-sec .flex-sec .right-sec .img-wrap {
    width: 100%;
    max-width: 100%;
    margin: 0 auto;
}
.benefits-inner-sec .flex-sec .right-sec .img-wrap img {
    display: block;
}
.benefits-inner-sec .flex-sec .left-sec li {
    font-size: 22px;
    margin-bottom: 20px;
    position: relative;
    padding-left: 30px;
}
.benefits-inner-sec .flex-sec .left-sec li::before {
    position: absolute;
    content: "";
    left: 0;
    top: 5px;
    width: 22px;
    height: 20px;
    border-radius: 50%;
    background: url(//www.zohowebstatic.com/sites/zweb/images/contracts/features/contracts-feature-sprite-1.png) no-repeat;
    background-size: 150px auto;
    background-position: -129px -9px;
}
.templatization-sec-inner .flex-sec.full-row  {
    flex-direction: column;
}

.flex-sec.row-four.full-row .right-sec {
    background: #dee8fd;
}

.templatization-sec-inner .flex-sec.row-four.full-row .right-sec .content-sec{
    text-align: center;
    width: 100%;
    max-width: 800px;
    margin: 0 auto;
    padding: 80px 50px 40px;
}

.templatization-sec-inner .flex-sec.full-row .right-sec {
    width: 100%;
    max-width: 100%;
    border-radius: 20px 20px 0 0;
}

.templatization-sec-inner .flex-sec.full-row .left-sec {
    width: 100%;
    max-width: 100%;
    position: relative;
}

.templatization-sec-inner .flex-sec.full-row .left-sec::before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    height: 45%;
    background: #DEEAFD;
    border-radius: 0 0 20px 20px;
}

.templatization-sec-inner .flex-sec.full-row .left-sec img {
    margin: 0 auto;
    width: 100%;
    max-width: 800px;
    position: relative;
    display: block;
    box-shadow: 0 0 5px #0000001f;
}
.templatization-sec-inner .flex-sec.row-two .left-sec .analytical-img{
    max-width:85%;
}

/* Free Templates Cards */
.free_temp_cards span:after {
    position: absolute;
    content: "";
    left: 0;
    top: 4px;
    right: 0;
    bottom: 0;
    margin: auto;
    width: 34px;
    height: 34px;
    background: url(//www.zohowebstatic.com/sites/zweb/images/contracts/features/slider-icon-sprite.png) no-repeat;
    background-size: 610px auto;
    background-position: -21px -63px;
    transform: scale(1.1);
}
.free_temp_cards span {
    position: relative;
    display: flex;
    width: 72px;
    height: 72px;
    background: #fff;
    border-radius: 100%;
    justify-content: center;
    align-items: center;
    align-self: center; 
    margin: 0 auto;
    box-shadow: 0px 3px 6px #a8a8a829;
}
.zwc_free_templates {
    background: #FAFAFA;
    padding: 90px 60px;
    border-radius: 10px;
    margin: 50px 0 0;
}
.free_temp_cards {
    background: #fff;
    text-align: center;
    border-radius: 5px;
    width: 19%;
    z-index: 2;
    transition: all 1200ms cubic-bezier(0.11, 0.16, 0.43, 0.86);
    height: 288px;
    position: relative;
}
.free_temp_cards a {
    padding: 64px 30px 61px;
    display: flex;
    height: 100%;
    flex-direction: column;
    z-index: 123;
    position: relative;
}
.free_temp_cards:before {
    content: '';
    background: #B4FFBF;
    width: 100%;
    top: 0;
    position: absolute;
    left: 0;
    height: 125px;
}
.zwc_contain {
    display: flex;
    gap: 15px;
    margin: 50px auto;
    max-width: 1680px;
}
.free_temp_cards h6 {
    font-family: var(--zf-primary-semibold);
    margin: 35px 0 0;
    font-size: 18px;
    color: #000;
    line-height: 23px;
}
.zwc_free_templates h2 {
    font-size: 36px;
    margin: 0 auto;
    color: #000;
    text-align: center;
    max-width: 510px;
}
.free_temp_cards.msa-cards span:after{
    background-size: 709px auto;
    background-position: -125px -79px;
    position: relative;
    left: -1px;
}
.free_temp_cards.psa-cards span:after{
    background-size: 640px auto;
    background-position: -54px -67px;
}
.free_temp_cards.com-agreement span:after{
    background-size: 630px auto;
    background-position: -321px -66.2px;
}
.free_temp_cards.resell-agreement span:after{
    background-size: 704px auto;
    background-position: -272px -76px;
    width: 37px;
    height: 37px;
}
.free_temp_cards.invester span:after {
    background-size: 720px auto;
    background-position: -219px -78px;
}
.free_temp_cards.subscription span:after {
    background-size: 704px auto;
    background-position: -241px -75px;
    width: 37px;
    height: 37px;
}
.free_temp_cards.data-sharing span:after {
    background-size: 730px auto;
    background-position: -313.5px -81px;
}
.free_temp_cards.emp-stock span:after {
    background-size: 660px auto;
    background-position: -366px -71px;
}
.free_temp_cards.soft-license span:after {
    background-size: 637px auto;
    background-position: 7px -67px;
}
.free_temp_cards.saas span:after {
    background-size: 647px auto;
    background-position: -84px -69px;
}
.free_temp_cards.sev-aggrmnt span:after {
    background-size: 660px auto;
    background-position: -141px -72px;
}
.free_temp_cards.catering-service span:after {
    background-size: 657px auto;
    background-position: -170px -70px;
}

.zwc_access_btn {
    text-align: center;
}
.zwc_access_btn a {
    color: #03a9f5;
    font-family: var(--zf-primary-semibold);
    border: 1px solid #03a9f5;
    padding: 8px 20px;
    display: block;
    width: fit-content;
    margin: auto;
    border-radius: 5px;
    font-size: 16px;
    position: relative;
    z-index: 2;
    transition: .3s ease;
}
.zwc_access_btn a:hover {
    color: #fff;
    background: #03a9f5;
}
.slick-track{
    display: flex;
    gap: 20px;
}
.free_temp_cards svg {
    z-index: 12;
    position: absolute;
    left: 0;
    right: 0;
    top: -4px;
    margin: 0 auto;
}
.free_temp_cards.msa-cards:before{
    background: #C6EBFF;
}
.free_temp_cards.psa-cards:before{
    background: #FDE5F8;
}
.free_temp_cards.com-agreement:before{
    background: #FFE5B4;
}
.free_temp_cards.resell-agreement:before{
    background: #FFD9D9;
}
.free_temp_cards.invester:before {
    background: #B4FFEE;
}
.free_temp_cards.subscription:before {
    background: #EDC6FF;
}
.free_temp_cards.data-sharing:before {
    background: #FFDABA;
}
.free_temp_cards.emp-stock:before {
    background: #CBD5FD;
}
.free_temp_cards.soft-license:before {
    background: #E8FFB4;
}
.free_temp_cards.saas:before {
    background: #FEE5B4;
}
.free_temp_cards.sev-aggrmnt:before {
    background: #E6E0FF;
}
.free_temp_cards.catering-service:before {
    background: #CADBFA;
}
.des-faq ul {
    padding-left: 18px;
    line-height: 35px;
    padding-top: 7px;
}
.des-faq ul li:before {
    content: '';
    position: absolute;
    left: -16px;
    background: #000;
    width: 7px;
    height: 7px;
    border-radius: 100%;
    top: 15px;
}
.des-faq ul li {
    position: relative;
}


@media (min-width: 991px) {
    .benefits-inner-sec .left-sec .img-wrap {
        opacity: 0;
        -webkit-transform: translateY(-20px);
        -ms-transform: translateY(-20px);
            transform: translateY(-20px);
        -webkit-transition: 0.8s ease 0.2s;
        -o-transition: 0.8s ease 0.2s;
        transition: 0.8s ease 0.2s;
    }
    .benefits-inner-sec .right-sec li {
        -webkit-transform: translateY(20px);
        -ms-transform: translateY(20px);
            transform: translateY(20px);
        -webkit-transition: 0.5s ease 0.4s;
        -o-transition: 0.5s ease 0.4s;
        transition: 0.5s ease 0.4s;
    }
    .benefits-inner-sec .lets-ani .left-sec .img-wrap {
        opacity: 1;
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
            transform: translateY(0);
    }
    .benefits-inner-sec .lets-ani .right-sec li:nth-child(1) {
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
            transform: translateY(0);
        -webkit-transition: 0.8s ease 0.1s;
        -o-transition: 0.8s ease 0.1s;
        transition: 0.8s ease 0.1s;
    }
    .benefits-inner-sec .lets-ani .right-sec li:nth-child(2) {
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
            transform: translateY(0);
        -webkit-transition: 0.8s ease 0.2s;
        -o-transition: 0.8s ease 0.2s;
        transition: 0.8s ease 0.2s;
    }
    .benefits-inner-sec .lets-ani .right-sec li:nth-child(3) {
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
            transform: translateY(0);
        -webkit-transition: 0.8s ease 0.3s;
        -o-transition: 0.8s ease 0.3s;
        transition: 0.8s ease 0.3s;
    }
    .benefits-inner-sec .lets-ani .right-sec li:nth-child(4) {
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
            transform: translateY(0);
        -webkit-transition: 0.8s ease 0.4s;
        -o-transition: 0.8s ease 0.4s;
        transition: 0.8s ease 0.4s;
    }
    .benefits-inner-sec .lets-ani .right-sec li:nth-child(5) {
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
            transform: translateY(0);
        -webkit-transition: 0.8s ease 0.5s;
        -o-transition: 0.8s ease 0.5s;
        transition: 0.8s ease 0.5s;
    }
    .benefits-inner-sec .lets-ani .right-sec li:nth-child(6) {
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
            transform: translateY(0);
        -webkit-transition: 0.8s ease 0.6s;
        -o-transition: 0.8s ease 0.6s;
        transition: 0.8s ease 0.6s;
    }
    .benefits-inner-sec .lets-ani .right-sec li:nth-child(7) {
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
            transform: translateY(0);
        -webkit-transition: 0.8s ease 0.7s;
        -o-transition: 0.8s ease 0.7s;
        transition: 0.8s ease 0.7s;
    }
    .benefits-inner-sec .lets-ani .right-sec li:nth-child(8) {
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
            transform: translateY(0);
        -webkit-transition: 0.8s ease 0.8s;
        -o-transition: 0.8s ease 0.8s;
        transition: 0.8s ease 0.8s;
    }
    .benefits-inner-sec .lets-ani .right-sec li:nth-child(9) {
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
            transform: translateY(0);
        -webkit-transition: 0.8s ease 0.9s;
        -o-transition: 0.8s ease 0.9s;
        transition: 0.8s ease 0.9s;
    }
    .benefits-inner-sec .lets-ani .right-sec li:nth-child(10) {
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
            transform: translateY(0);
        -webkit-transition: 0.8s ease 1s;
        -o-transition: 0.8s ease 1s;
        transition: 0.8s ease 1s;
    }
}
.aspect-sec .aspect-inner-sec{
    background-color: #1F3267;
    color: #fff;
    border-radius: 20px;
}
.aspect-inner-sec {
    padding: 130px 0;
}
.aspect-inner-sec .heading-sec {
    text-align: center;
}
.aspect-inner-sec .heading-sec h2 {
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
    color: #FFD5A6;
}
.aspect-inner-sec .heading-sec p {
    max-width: 760px;
    margin-left: auto;
    margin-right: auto;
}
.templatization-sec-inner {
    padding: 150px 0;
}
.templatization-sec-inner .heading-sec {
    text-align: center;
}
.templatization-sec-inner .heading-sec h2 {
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
}
.templatization-sec-inner .heading-sec p {
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}
.templatization-sec-inner .flex-sec {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-top: 120px;
}
.templatization-sec-inner .flex-sec.row-one .left-sec,
.templatization-sec-inner .flex-sec.row-three .left-sec {
    width: 45%;
}
.templatization-sec-inner .flex-sec.row-one .right-sec,
.templatization-sec-inner .flex-sec.row-three .right-sec {
    width: 55%;
}
.templatization-sec-inner .flex-sec.row-one .right-sec img,
.templatization-sec-inner .flex-sec.row-three .right-sec img {
    max-width: 90%;
    margin: 0 auto;
    display: block;
}
.templatization-sec-inner .flex-sec.row-two .left-sec {
    width: 55%;
}
.templatization-sec-inner .flex-sec.row-two .left-sec img {
    max-width: 95%;
    display: block;
}
.templatization-sec-inner .flex-sec.row-two .right-sec {
    width: 45%;
}
.templatization-sec-inner .flex-sec .left-sec .content-sec {
    width: 100%;
    max-width: 470px;
}
.templatization-sec-inner .flex-sec .right-sec .content-sec {
    width: 100%;
    max-width: 475px;
    margin-left: auto;
}
@media (min-width: 991px) {
    .templatization-sec-inner .right-sec img {
        opacity: 0;
        -webkit-transform: scale(0.97);
        -ms-transform: scale(0.97);
            transform: scale(0.97);
        -webkit-transition: 0.8s ease 0.1s;
        -o-transition: 0.8s ease 0.1s;
        transition: 0.8s ease 0.1s;
    }
    .templatization-sec-inner .right-sec .content-sec h3 {
        -webkit-transform: translateY(20px);
        -ms-transform: translateY(20px);
            transform: translateY(20px);
        -webkit-transition: 0.8s ease 0.1s;
        -o-transition: 0.8s ease 0.1s;
        transition: 0.8s ease 0.1s;
    }
    .templatization-sec-inner .right-sec .content-sec p {
        -webkit-transform: translateY(20px);
        -ms-transform: translateY(20px);
            transform: translateY(20px);
        -webkit-transition: 0.8s ease 0.2s;
        -o-transition: 0.8s ease 0.2s;
        transition: 0.8s ease 0.2s;
    }
    .templatization-sec-inner .left-sec img {
        opacity: 0;
        -webkit-transform: scale(0.97);
        -ms-transform: scale(0.97);
            transform: scale(0.97);
        -webkit-transition: 0.8s ease 0.1s;
        -o-transition: 0.8s ease 0.1s;
        transition: 0.8s ease 0.1s;
    }
    .templatization-sec-inner .left-sec .content-sec h3 {
        -webkit-transform: translateY(20px);
        -ms-transform: translateY(20px);
            transform: translateY(20px);
        -webkit-transition: 0.8s ease 0.1s;
        -o-transition: 0.8s ease 0.1s;
        transition: 0.8s ease 0.1s;
    }
    .templatization-sec-inner .left-sec .content-sec p {
        -webkit-transform: translateY(20px);
        -ms-transform: translateY(20px);
            transform: translateY(20px);
        -webkit-transition: 0.8s ease 0.2s;
        -o-transition: 0.8s ease 0.2s;
        transition: 0.8s ease 0.2s;
    }
    .templatization-sec-inner .lets-ani .right-sec img {
        opacity: 1;
        -webkit-transform: scale(1);
        -ms-transform: scale(1);
            transform: scale(1);
    }
    .templatization-sec-inner .lets-ani .right-sec .content-sec h3 {
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
            transform: translateY(0);
    }
    .templatization-sec-inner .lets-ani .right-sec .content-sec p {
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
            transform: translateY(0);
    }
    .templatization-sec-inner .lets-ani .left-sec img {
        opacity: 1;
        -webkit-transform: scale(1);
        -ms-transform: scale(1);
            transform: scale(1);
    }
    .templatization-sec-inner .lets-ani .left-sec .content-sec h3 {
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
            transform: translateY(0);
    }
    .templatization-sec-inner .lets-ani .left-sec .content-sec p {
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
            transform: translateY(0);
    }
}
.faq-inner-sec {
    padding-bottom: 120px;
}
.faq-inner-sec .heading-sec {
    text-align: center;
    margin-bottom: 60px;
}
.faq-inner-sec .faq-list {
    width: 100%;
    max-width: 900px;
    margin: 0 auto;
}
.faq-inner-sec .faq-list .faq-single-list {
    position: relative;
    padding: 40px 100px 40px 60px;
    border-bottom: 1px solid #d8d8d8;
    cursor: pointer;
}
.faq-inner-sec .faq-list .faq-single-list .title-faq {
    font-family: var(--primaryfont-bold);
    font-family: var(--primaryfont-bold);
    font-size: 21px;
}
.faq-inner-sec .faq-list .faq-single-list .des-faq {
    padding-top: 15px;
}
.faq-inner-sec .faq-list .faq-single-list p {
    margin: 0;
}
.faq-inner-sec .faq-list .faq-single-list:first-child {
    border-top: 1px solid #d8d8d8;
}
.faq-inner-sec .faq-list .faq-single-list:after {
    position: absolute;
    content: "";
    width: 15px;
    height: 2px;
    top: 52px;
    right: 50px;
    background-color: gray;
    -webkit-transform: translate(36%, -50%);
    -ms-transform: translate(36%, -50%);
        transform: translate(36%, -50%);
}
.faq-inner-sec .faq-list .faq-single-list:before {
    position: absolute;
    content: "";
    width: 2px;
    height: 15px;
    top: 52px;
    right: 50px;
    background-color: gray;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
    -webkit-transform-origin: center center;
    -ms-transform-origin: center center;
        transform-origin: center center;
    -webkit-transition: 0.3s ease;
    -o-transition: 0.3s ease;
    transition: 0.3s ease;
}
.faq-inner-sec .faq-list .faq-single-list.active .title-faq {
    color: #1976d2;
}
.faq-inner-sec .faq-list .faq-single-list.active .des-faq {
    display: block;
}
.faq-inner-sec .faq-list .faq-single-list.active:after {
    background-color: #1976d2;
}
.faq-inner-sec .faq-list .faq-single-list.active:before {
    -webkit-transform: translate(-50%, -50%) rotate(90deg);
    -ms-transform: translate(-50%, -50%) rotate(90deg);
        transform: translate(-50%, -50%) rotate(90deg);
    background-color: #1976d2;
}
.footer-sec {
    background-color: #fef3cf;
}
.footer-inner-sec {
    padding: 100px 0;
    text-align: center;
}
.footer-inner-sec h2 {
    width: 100%;
    max-width: 800px;
    margin: 0 auto 25px;
}

@media (min-width: 1199px) {

.cards-flex {
    position: relative;
    overflow: hidden;
}

.cards:before {
    background: -webkit-gradient(linear,left top, left bottom,color-stop(20%, rgb(255 249 229)),to(rgba(255,255,255,0)));
    background: -o-linear-gradient(top,rgb(255 249 229) 20%,rgba(255,255,255,0) 100%);
    background: linear-gradient(to bottom,rgb(255 249 229) 20%,rgba(255,255,255,0) 100%);
    content: '';
    position: absolute;
    left: 0;
    height: 50px;
    width: 100%;
    right: 0;
    z-index: 1;
    top: -10px;
}

.cards:after {
    background: -webkit-gradient(linear,left top, left bottom,color-stop(20%, rgb(255 249 229 / 0%)),to(rgb(255 249 229)));
    background: -o-linear-gradient(top,rgb(255 249 229 / 0%) 20%,rgb(255 249 229) 100%);
    background: linear-gradient(to bottom,rgb(255 249 229 / 0%) 20%,rgb(255 249 229) 100%);
    content: '';
    position: absolute;
    left: 0;
    height: 50px;
    width: 100%;
    right: 0;
    z-index: 1;
    bottom: 0;
}
    .left-anim-list {
        -webkit-animation: scrollUp 25s cubic-bezier(0.44, 0.02, 0, 1) infinite;
                animation: scrollUp 25s cubic-bezier(0.44, 0.02, 0, 1) infinite;
    }

    .right-anim-list {
        -webkit-animation: scrollUp 25s cubic-bezier(0.44, 0.02, 0, 1) infinite 0.3s;
                animation: scrollUp 25s cubic-bezier(0.44, 0.02, 0, 1) infinite 0.3s;
    }

    @-webkit-keyframes scrollUp {
        0% {
            -webkit-transform: translateY(-300px);
                    transform: translateY(-300px);
        }
        8% {
            -webkit-transform: translateY(-730px);
                    transform: translateY(-730px);
        }
        16% {
            -webkit-transform: translateY(-730px);
                    transform: translateY(-730px);
        }
        24% {
            -webkit-transform: translateY(-1160px);
                    transform: translateY(-1160px);
        }
        32% {
            -webkit-transform: translateY(-1160px);
                    transform: translateY(-1160px);
        }
        40% {
            -webkit-transform: translateY(-1532px);
                    transform: translateY(-1532px);
        }
        48% {
            -webkit-transform: translateY(-1532px);
                    transform: translateY(-1532px);
        }
        56% {
            -webkit-transform: translateY(-1963px);
                    transform: translateY(-1963px);
        }
        64% {
            -webkit-transform: translateY(-1963px);
                    transform: translateY(-1963px);
        }
        72% {
            -webkit-transform: translateY(-2316px);
                    transform: translateY(-2316px);
        }
        80% {
            -webkit-transform: translateY(-2316px);
                    transform: translateY(-2316px);
        }
        96% {
            -webkit-transform: translateY(-2880px);
                    transform: translateY(-2880px);
        }
        100% {
            -webkit-transform: translateY(-2880px);
                    transform: translateY(-2880px);
        }
    }

    @keyframes scrollUp {
        0% {
            -webkit-transform: translateY(-300px);
                    transform: translateY(-300px);
        }
        8% {
            -webkit-transform: translateY(-730px);
                    transform: translateY(-730px);
        }
        16% {
            -webkit-transform: translateY(-730px);
                    transform: translateY(-730px);
        }
        24% {
            -webkit-transform: translateY(-1160px);
                    transform: translateY(-1160px);
        }
        32% {
            -webkit-transform: translateY(-1160px);
                    transform: translateY(-1160px);
        }
        40% {
            -webkit-transform: translateY(-1532px);
                    transform: translateY(-1532px);
        }
        48% {
            -webkit-transform: translateY(-1532px);
                    transform: translateY(-1532px);
        }
        56% {
            -webkit-transform: translateY(-1963px);
                    transform: translateY(-1963px);
        }
        64% {
            -webkit-transform: translateY(-1963px);
                    transform: translateY(-1963px);
        }
        72% {
            -webkit-transform: translateY(-2316px);
                    transform: translateY(-2316px);
        }
        80% {
            -webkit-transform: translateY(-2316px);
                    transform: translateY(-2316px);
        }
        96% {
            -webkit-transform: translateY(-2880px);
                    transform: translateY(-2880px);
        }
        100% {
            -webkit-transform: translateY(-2880px);
                    transform: translateY(-2880px);
        }
    }
}


@media (max-width: 1280px) {
    .banner-inner-sec .flex-sec .left-bar-sec .content-sec p {
        max-width: 500px;
    }
}
@media (max-width: 1199px) {
    .banner-sec .cards .cards-flex .anim li {
        width: 100%;
        max-width: 200px;
        height: 230px;
        background: url(//www.zohowebstatic.com/sites/zweb/images/contracts/features/templates-list.png) no-repeat;
        background-size: 810px auto;
        background-position: 0 0;
        border-radius: 8px;
        margin-bottom: 30px;
    }
    .banner-sec .cards .cards-flex .left-anim-list li:nth-child(1) {
        background-position: 0 0;
    }
    .banner-sec .cards .cards-flex .left-anim-list li:nth-child(2) {
        background-position: -408px 1px;
    }
    .banner-sec .cards .cards-flex .left-anim-list li:nth-child(3) {
        background-position: -204px 1px;
    }
    .banner-sec .cards .cards-flex .right-anim-list li:nth-child(1) {
        background-position: 0 -230px;
    }
    .banner-sec .cards .cards-flex .right-anim-list li:nth-child(2) {
        background-position: -407px -230px;
    }
    .banner-sec .cards .cards-flex .right-anim-list li:nth-child(3) {
        background-position: -204px -230px;
    }
.banner-sec .cards {
    right: -2%;
}
}
@media (max-width: 1080px) {
    h2 {
        font-size: 42px;
    }
    .template-inner-sec .flex-sec .single-sec .single-inner-sec h3 {
        font-size: 38px;
    }
    .banner-sec {
        padding: 80px 0 100px;
    }
    .benefits-inner-sec {
        padding: 120px 0;
    }
    .aspect-inner-sec {
        padding: 100px 0;
    }
    .templatization-sec-inner {
        padding: 120px 0;
    }
    .faq-inner-sec {
        padding-bottom: 120px;
    }
    .templatization-sec-inner .flex-sec {
        margin-top: 90px;
    }
    .banner-sec .cards {
        display: none;
    }
    .banner-inner-sec .flex-sec{
        flex-direction: column;
    }
    .img-wrap video{
        margin: 40px auto 0;
        width: 90%;
    }
    .banner-inner-sec .flex-sec .left-bar-sec,
    .banner-inner-sec .flex-sec .right-bar-sec {
        text-align: center;
        max-width: 100%;
    }
    .banner-inner-sec .flex-sec .left-bar-sec .content-sec h1 {
        max-width: 600px;
        margin-left: auto;
        margin-right: auto;
    }
    .banner-inner-sec .flex-sec .left-bar-sec .content-sec p {
        margin-left: auto;
        margin-right: auto;
    }
    .templatization-sec-inner .flex-sec.row-one .left-sec,
    .templatization-sec-inner .flex-sec.row-three .left-sec {
        width: 100%;
    }
    .templatization-sec-inner .flex-sec.row-one .right-sec,
    .templatization-sec-inner .flex-sec.row-three .right-sec {
        width: 100%;
    }
    .templatization-sec-inner .flex-sec.row-two .left-sec,
    .templatization-sec-inner .flex-sec.row-four .left-sec {
        width: 100%;
    }
    .templatization-sec-inner .flex-sec.row-two .right-sec,
    .templatization-sec-inner .flex-sec.row-four .right-sec {
        width: 100%;
    }
    .template-inner-sec .flex-sec .single-sec {
        max-width: 500px;
    }
    .template-inner-sec .flex-sec .single-sec .single-inner-sec {
        max-width: 100%;
    }
    .template-inner-sec .flex-sec .single-sec:before {
        left: 50%;
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
            transform: translateX(-50%);
    }
    .templatization-sec-inner .flex-sec {
        -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;
    }
    .templatization-sec-inner .flex-sec .left-sec .content-sec {
        text-align: center;
        margin-bottom: 50px;
    }
    .templatization-sec-inner .flex-sec .right-sec .content-sec {
        text-align: center;
    }
    .templatization-sec-inner .flex-sec.row-four.full-row .right-sec .content-sec{        
        padding: 50px 50px 35px;
    }
    .faq-inner-sec .heading-sec {
        margin-bottom: 40px;
    }
    .templatization-sec-inner .flex-sec.row-two .left-sec {
        -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
        order: 1;
        margin-top: 50px;
    }
    .templatization-sec-inner .heading-sec p {
        max-width: 600px;
        margin-bottom: 0;
    }
    .aspect-inner-sec .heading-sec p {
        max-width: 750px;
    }
    .templatization-sec-inner .flex-sec.row-one .right-sec img,
    .templatization-sec-inner .flex-sec.row-three .right-sec img,
    .templatization-sec-inner .flex-sec.row-two .left-sec img,
    .templatization-sec-inner .flex-sec.row-four .left-sec img {
        max-width: 700px;
        width: 100%;
        margin: 0 auto;
    }
    .templatization-sec-inner .flex-sec .left-sec .content-sec,
    .templatization-sec-inner .flex-sec .right-sec .content-sec,
    .templatization-sec-inner .flex-sec .left-sec .content-sec,
    .templatization-sec-inner .flex-sec .right-sec .content-sec {
        margin-left: auto;
        margin-right: auto;
    }
    .contracts-cta-left {
        justify-content: center;
    }   
}
@media (max-width: 991px) {
    h1 {
        font-size: 46px;
    }
    h2 {
        font-size: 38px;
    }
    .template-inner-sec .flex-sec .single-sec .single-inner-sec h3 {
        font-size: 35px;
    }
    .benefits-inner-sec .heading-sec {
        max-width: 560px;
        margin: 0 auto;
        text-align: center;
    }
    .benefits-inner-sec .flex-sec {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }
    .benefits-inner-sec .flex-sec .left-sec,
    .benefits-inner-sec .flex-sec .right-sec {
        width: 100%;
        max-width: 100%;
    }
    .benefits-inner-sec .flex-sec .left-sec ul li {
        width: fit-content;
        margin-left: auto;
        margin-right: auto;
    }
    .benefits-inner-sec .flex-sec .left-sec ul {
        margin-bottom: 50px;
    }
    .benefits-inner-sec .flex-sec .right-sec {
        max-width: 475px;
        margin: 0 auto;
    }
    .benefits-inner-sec .flex-sec .left-sec .img-wrap {
        max-width: 460px;
        padding: 30px 30px;
        margin: 0 auto 50px;
    }
    .aspect-inner-sec .heading-sec h2 {
        max-width: 530px;
    }
    .aspect-inner-sec .heading-sec p {
        width: 100%;
        max-width: 560px;
    }
    .templatization-sec-inner .heading-sec h2 {
        max-width: 500px;
        margin-bottom: 30px;
    }
    .templatization-sec-inner .flex-sec {
        margin-top: 70px;
    }
    .templatization-sec-inner .flex-sec.row-one .right-sec img,
    .templatization-sec-inner .flex-sec.row-three .right-sec img,
    .templatization-sec-inner .flex-sec.row-two .left-sec img,
    .templatization-sec-inner .flex-sec.row-four .left-sec img {
        max-width: 600px;
    }
    .template-inner-sec .flex-sec .row-half{
        flex-direction: column;
    }
    .template-inner-sec .flex-sec .row-half .single-sec {        
        width: 100%;
        max-width: 100%;
        margin-bottom: 50px
    }
    .template-inner-sec .flex-sec .row-half .single-sec .single-inner-sec{
        width: 100%;
        max-width: 800px;
    }
    .template-inner-sec .flex-sec .row-full .single-sec{
        margin-top: 0;
    }
    .zwc_free_templates h2 {
        font-size: 32px;
        max-width: 520px;
    }
}
@media (max-width: 767px) {
    h1 {
        font-size: 42px;
    }
    h2 {
        font-size: 36px;
    }
    h3 {
        font-size: 28px;
    }
    .banner-sec {
        padding: 100px 0;
    }
    .benefits-inner-sec {
        padding: 100px 0;
    }
    .benefits-inner-sec .flex-sec {
        margin-top: 60px;
    }
    .aspect-inner-sec {
        padding: 100px 25px;
    }
    .templatization-sec-inner {
        padding: 100px 0;
    }
    .faq-inner-sec {
        padding-bottom: 100px;
    }
    .templatization-sec-inner .flex-sec {
        margin-top: 90px;
    }
    .benefits-inner-sec .flex-sec .right-sec li {
        font-size: 18px;
        margin-bottom: 10px;
        position: relative;
        padding-left: 40px;
    }
    .free_temp_cards h6 {
        font-size: 15px;
    }
    .free_temp_cards a {
        padding: 79px 20px 50px;
    }
    .free_temp_cards {
        width: 200px!important;
    }
    .zwc_free_templates h2 {
        font-size: 24px;
        max-width: 330px;
    }
    .zwc_free_templates {
        padding: 50px 0px;
    }
    .zwc_contain {
        margin: 40px 0;
    }
    .slick-track {
        gap: 15px;
    }
    .free_temp_cards svg {
        width: 100%;
        height: 120px;
    }
    .free_temp_cards span {
        width: 50px;
        height: 50px;
    }
    .free_temp_cards h6 {
        margin: 20px 0 0;
    }
    .free_temp_cards {
        height: 250px;
    }
    .free_temp_cards span:after {
        transform: scale(0.8);
    }
    .free_temp_cards:before {
        height: 110px;
    }
    .des-faq ul {
        line-height: 25px;
    }
    .des-faq ul li {
        margin-bottom: 10px;
    }
    .des-faq ul li:last-child {
        margin-bottom: 0px;
    }
    .des-faq ul li:before {
        top: 10px;
    }
    a.cont-request-demo-cta {
        width: 277px;
        padding: 12px 20px;
        font-size: 16px;
    }
    .cont-request-demo-cta {
       
    }
}
@media (max-width: 610px) {
    h1 {
        font-size: 33px;
    }
    h2 {
        font-size: 26px;
    }
    h3 {
        font-size: 23px;
    }
    p {
        line-height: 1.6;
    }
    .template-inner-sec .flex-sec .single-sec .single-inner-sec h3 {
        font-size: 24px;
    }
    .faq-inner-sec .faq-list .faq-single-list .title-faq {
        font-size: 19px;
    }
    .banner-sec {
        padding: 40px 0 70px;
    }
    .benefits-inner-sec {
        padding: 70px 0;
    }
    .benefits-inner-sec .flex-sec {
        margin-top: 60px;
    }
    .aspect-inner-sec {
        padding: 70px 25px;
    }
    .templatization-sec-inner {
        padding: 70px 0;
    }
    .faq-inner-sec {
        padding-bottom: 70px;
    }
    .footer-inner-sec {
        padding: 70px 0;
    }
    .templatization-sec-inner .flex-sec {
        margin-top: 50px;
    }
    .templatization-sec-inner .flex-sec.row-two .left-sec {
        margin-top: 30px;
    }
    .templatization-sec-inner .flex-sec.row-four.full-row .right-sec .content-sec{        
        padding: 50px 30px 30px;
    }
    .templatization-sec-inner .flex-sec .left-sec .content-sec {
        margin-bottom: 30px;
    }
    .faq-inner-sec .faq-list .faq-single-list {
        position: relative;
        padding: 20px 70px 20px 20px;
        border-bottom: 1px solid #d8d8d8;
        cursor: pointer;
    }
    .faq-inner-sec .faq-list .faq-single-list:before,
    .faq-inner-sec .faq-list .faq-single-list:after {
        right: 30px;
    }
    .faq-inner-sec .heading-sec {
        margin-bottom: 40px;
    }
    .benefits-inner-sec .flex-sec .left-sec ul li{
        display: inline-block;
    }
}