html {
    scroll-behavior: smooth;
}

.zwc-eucountries-show,
.ccode-eucountries .zwc-eucountries-hide {
    display: none
}

.ccode-eucountries .zwc-eucountries-show {
    display: inline-block
}

.zw-product-header .content-wrap {
    z-index: 1;
}

#block-panels-mini-product-menu {
    background: #fef3cf;
}

.contract-authoring *,
.contract-authoring *::after,
.contract-authoring *::before {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

img {
    max-width: 100%;
}

.png-shadow {
    -webkit-filter: drop-shadow(0 0 20px #00000080);
}

.act-btn.cta-btn {
    z-index: 0;
}

.line-learn-more {
    position: relative;
    font-family: var(--zf-primary-semibold);
    display: inline-block;
}

.line-learn-more::after {
    content: "";
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 2px;
    left: 0;
    background: #03a9f5;
}

h1 {
    font-size: 62px;
    line-height: 72px;
}

h2 {
    font-size: 40px;
    line-height: 52px;
}

/* !Section style start */
.banner-section {
    padding: 50px 0 150px;
    background-color: #FEF3CF;
}

.banner-sticky.active {
    position: -webkit-sticky;
    position: sticky;
    top: 120px;
}

.banner-sticky.active .animation-elements {
    overflow: hidden;
}

.banner-sticky.active .animation-elements .shapes {
    display: block;
}

.banner-sticky.active .frame-holder img,
.banner-sticky.active .left-avatar,
.banner-sticky.active .right-avatar {
    will-change: transform;
}

.banner-animation-wrap {
    position: relative;
}

.banner-animation-wrap .animation-elements .frame-holder {
    position: absolute;
    width: 81%;
    left: 7%;
    right: 7%;
    margin: 0 auto;
}

.banner-animation-wrap .animation-elements .style-title-holder {
    position: absolute;
    width: 18%;
    left: 0;
    top: 37%;
}

.banner-animation-wrap .animation-elements .style-title-holder img {
    -webkit-transform-origin: right center;
    transform-origin: right center;
}

.banner-animation-wrap .animation-elements .left-avatar {
    position: absolute;
    width: 70px;
    height: 70px;
    background: url(/sites/zweb/images/contracts/features/authoring-sprite.png) no-repeat;
    background-size: 700px auto;
    left: 10%;
    top: 31%;
}

.banner-animation-wrap .animation-elements .right-avatar {
    position: absolute;
    width: 70px;
    height: 70px;
    background: url(/sites/zweb/images/contracts/features/authoring-sprite.png) no-repeat;
    background-size: 700px auto;
    background-position: -75px 0;
    right: 10%;
    top: 18%;
}

.banner-animation-wrap .animation-elements .right-avatar::after {
    position: absolute;
    content: '';
    width: 174px;
    height: 29px;
    left: 70%;
    bottom: -40px;
    background: url(/sites/zweb/images/contracts/features/authoring-sprite.png) no-repeat;
    background-size: 750px auto;
    background-position: -160px -28px;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    -webkit-box-shadow: 4px 11px 34px #6161611c;
    box-shadow: 4px 11px 34px #6161611c;
}

.banner-animation-wrap .animation-elements .shapes {
    display: none;
}

.banner-animation-wrap .animation-elements .shapes span {
    background: url(/sites/zweb/images/contracts/features/authoring-sprite.png) no-repeat;
    background-size: 610px auto;
}

.banner-animation-wrap .animation-elements .shapes .top-shape {
    width: 50px;
    height: 50px;
    position: absolute;
    top: 0%;
    left: 22%;
    background-position: -372px -59px;
}

.banner-animation-wrap .animation-elements .shapes .left-shape {
    width: 50px;
    height: 50px;
    position: absolute;
    bottom: 23%;
    left: 13%;
    background-size: 650px auto;
    background-position: -565px -65px;
}

.banner-animation-wrap .animation-elements .shapes .right-shape {
    width: 50px;
    height: 50px;
    position: absolute;
    top: 30%;
    right: 13%;
    background-position: -480px -59px;
}

.banner-animation-wrap .animation-elements .shapes .bottom-shape {
    width: 50px;
    height: 50px;
    position: absolute;
    bottom: 0%;
    right: 28%;
    background-position: -428px -59px;
}

.banner-animation-wrap .content-sec {
    position: relative;
    padding: 130px 0;
    text-align: center;
}

.banner-animation-wrap .content-sec h1 {
    width: 100%;
    max-width: 680px;
    margin-left: auto;
    margin-right: auto;
}

.banner-animation-wrap .content-sec h1 span {
    color: #3F4ECE;
    position: relative;
    display: inline-block;
}

.banner-animation-wrap .content-sec h1 span::after {
    content: '';
    position: absolute;
    height: 70%;
    width: 2px;
    background-color: #3F4ECE;
    right: -7px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    opacity: 0;
}

.banner-animation-wrap .content-sec h1 span::before {
    content: 'James';
    position: absolute;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    font-family: var(--zf-primary-semibold);
    color: #fff;
    font-size: 13px;
    line-height: normal;
    right: -57px;
    top: 12px;
    padding: 2px 7px;
    border-radius: 5px;
    background-color: #3F4ECE;
    border-bottom-left-radius: 0;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    opacity: 0;
    -webkit-transition: .3s ease;
    transition: .3s ease;
}

.banner-animation-wrap .content-sec h1 span.active::after {
    -webkit-animation: blink .7s infinite;
    animation: blink .7s infinite;
}

.banner-animation-wrap .content-sec h1 span.active::before {
    opacity: 1;
}

.banner-animation-wrap .content-sec p {
    font-size: 18px;
    line-height: 30px;
    width: 100%;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
}

@-webkit-keyframes blink {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes blink {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

.templates-section {
    padding: 120px 0 140px;
}

.templates-inner-section .sec-title {
    text-align: center;
    width: 100%;
    max-width: 500px;
    margin: 0 auto;
}

.templates-inner-section .content-sec {
    text-align: center;
    width: 100%;
    max-width: 710px;
    margin: 0 auto;
}

.templates-section {
    overflow: hidden;
}

.templates-section .template-slider {
    margin-top: 60px;
}

.templates-section .template-slider h3 {
    font-size: 20px;
}

.templates-section .template-slider-wrap {
    width: 100%;
    max-width: 1680px;
    margin: 0 auto;
}

.templates-section [class^="icon-temp-"] {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    margin: 0 auto 15px;
    background-color: white;
    display: block;
    position: relative;
}

.templates-section [class^="icon-temp-"]::after {
    content: '';
    position: absolute;
    width: 40px;
    height: 40px;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    background: url(/sites/zweb/images/contracts/features/authoring-sprite.png) no-repeat;
    background-size: 900px auto;
}

.templates-section .single-template {
    width: 100%;
    text-align: center;
    padding: 60px 20px 70px;
    background: #adadad;
    margin: 0 12px;
    border-radius: 10px;
    position: relative;
    overflow: hidden;
}

.templates-section .single-template h3 {
    width: 100%;
    max-width: 190px;
    margin-left: auto;
    margin-right: auto;
}

.templates-section .single-template img {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    display: block;
}

.templates-section .temp-6 h3,
.templates-section .temp-10 h3 {
    width: 100%;
    max-width: 180px;
    margin-left: auto;
    margin-right: auto;
}

.templates-section .temp-1 {
    background-color: #ADB6A5;
}

.templates-section .temp-1 span::after {
    background-position: -1px -96px;
}

.templates-section .temp-2 {
    background-color: #A0B0C8;
}

.templates-section .temp-2 span::after {
    background-position: -43px -96px;
}

.templates-section .temp-3 {
    background-color: #7BA9A8;
}

.templates-section .temp-3 span::after {
    background-position: -84px -96px;
}

.templates-section .temp-4 {
    background-color: #9B9389;
}

.templates-section .temp-4 span::after {
    background-position: -125px -96px;
}

.templates-section .temp-5 {
    background-color: #ADB6A5;
}

.templates-section .temp-5 span::after {
    background-position: -163px -96px;
}

.templates-section .temp-6 {
    background-color: #A0B0C8;
}

.templates-section .temp-6 span::after {
    background-position: -199px -96px;
}

.templates-section .temp-7 {
    background-color: #7BA9A8;
}

.templates-section .temp-7 span::after {
    background-position: -239px -96px;
}

.templates-section .temp-8 {
    background-color: #9B9389;
}

.templates-section .temp-8 span::after {
    background-position: -277px -96px;
}

.templates-section .temp-9 {
    background-color: #ADB6A5;
}

.templates-section .temp-9 span::after {
    background-position: -314px -96px;
}

.templates-section .temp-10 {
    background-color: #A0B0C8;
}

.templates-section .temp-10 span::after {
    background-position: -352px -96px;
}

.templates-section .temp-11 {
    background-color: #7BA9A8;
}

.templates-section .temp-11 span::after {
    background-position: -388px -96px;
}

.templates-section .temp-12 {
    background-color: #9B9389;
}

.templates-section .temp-12 span::after {
    background-position: -422px -96px;
}

.templates-section .temp-13 {
    background-color: #ADB6A5;
}

.templates-section .temp-13 span::after {
    background-position: -461px -96px;
}

.templates-section .temp-14 {
    background-color: #A0B0C8;
}

.templates-section .temp-14 span::after {
    background-position: -501px -96px;
}

.content-creation-section {
    padding: 120px 0;
    background-color: #FBF0E8;
}

.content-creation-inner-section .flex-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.content-creation-inner-section .flex-wrap .flex-left,
.content-creation-inner-section .flex-wrap .flex-right {
    width: 100%;
    max-width: 50%;
}

.content-creation-inner-section .flex-wrap .content-sec{
    width: 100%;
    max-width: 480px;
}

.content-creation-inner-section .flex-wrap .img-wrap {
    width: 100%;
    max-width: 550px;
}

.content-creation-inner-section .flex-wrap .img-wrap img {
    -webkit-transform: translateX(50px);
    transform: translateX(50px);
    -webkit-transition: 1.5s ease;
    transition: 1.5s ease;
    opacity: 0;
}

.middle-animated .content-creation-inner-section .flex-wrap .img-wrap img {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
}

.content-authoring-section {
    padding: 120px 0;
}

.content-authoring-inner-section .flex-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.content-authoring-inner-section .flex-wrap .flex-left,
.content-authoring-inner-section .flex-wrap .flex-right {
    width: 100%;
    max-width: 50%;
}

.content-authoring-inner-section .flex-wrap .content-sec {
    width: 100%;
    max-width: 510px;
}

.content-authoring-inner-section .flex-wrap .img-wrap {
    width: 100%;
    max-width: 550px;
}

.content-authoring-inner-section .flex-wrap .img-wrap img {
    -webkit-transform: translateX(-50px);
    transform: translateX(-50px);
    -webkit-transition: 1.5s ease;
    transition: 1.5s ease;
    opacity: 0;
}

.middle-animated .content-authoring-inner-section .flex-wrap .img-wrap img {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
}

.native-doc-section {
    padding: 120px 0 0;
    background-color: #222328;
}

.native-doc-section .middle-animated .native-doc-inner-section .sec-title .edit-pen::after {
    width: 72%;
    -webkit-animation: line-moving 10s linear 1s infinite;
    animation: line-moving 10s linear 1s infinite;
}

.native-doc-inner-section .sec-title {
    color: #fff;
}

.native-doc-inner-section .sec-title .edit-pen {
    width: 155px;
    height: 40px;
    display: inline-block;
    margin-left: 10px;
    background: url(/sites/zweb/images/contracts/features/authoring-sprite.png) no-repeat;
    background-size: 600px auto;
    background-position: -276px -10px;
    position: relative;
}

.native-doc-inner-section .sec-title .edit-pen::after {
    position: absolute;
    content: '';
    left: 0;
    bottom: -1px;
    width: 0;
    height: 2px;
    background: -webkit-gradient(linear, left top, right top, color-stop(50%, #fafafa), color-stop(50%, transparent));
    background: linear-gradient(90deg, #fafafa 50%, transparent 50%);
    background-size: 8px 2px;
    -webkit-transition: 1s ease;
    transition: 1s ease;
}

.native-doc-inner-section .content-sec {
    color: #fff;
    width: 100%;
    max-width: 710px;
    margin-bottom: 70px;
}

.native-doc-inner-section .content-sec a {
    color: #fff;
    border-bottom: 1px solid;
}

.native-doc-inner-section .menu-items {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: relative;
    max-width: -webkit-fit-content;
    max-width: -moz-fit-content;
    max-width: fit-content;
}

.native-doc-inner-section .menu-items .menu-list {
    display: inline-block;
    font-family: var(--zf-primary-semibold);
    color: #fff;
    padding: 10px 10px;
    cursor: pointer;
}

.native-doc-inner-section .menu-items .menu-list:nth-child(1) {
    padding-left: 3px;
}

.native-doc-inner-section .menu-items .menu-list:nth-child(2) {
    padding-right: 5px;
}

.native-doc-inner-section .menu-items .bar {
    position: absolute;
    width: 88px;
    height: 2px;
    background-color: #F0C332;
    bottom: 0;
}

.native-doc-inner-section .menu-items::after {
    content: '';
    position: absolute;
    width: 100%;
    height: 2px;
    background-color: #fff;
    opacity: .1;
    bottom: 0;
}

.native-doc-inner-section .native-tab-content {
    margin-top: 50px;
    width: 100%;
    max-width: 1100px;
}

.native-doc-inner-section .native-tab-content .tab-content-items {
    position: relative;
}

.native-doc-inner-section .native-tab-content .tab-content-items img {
    display: block;
}

.native-doc-inner-section .native-tab-content .tab-content-items .abs-img {
    position: absolute;
    max-width: 26%;
    top: -3%;
    right: -4%;
    opacity: 0;
    -webkit-transition: .5s ease;
    transition: .5s ease;
}

.native-doc-inner-section .native-tab-content .tab-content-items.active .abs-img {
    opacity: 1;
    -webkit-transform: translateY(20px);
    transform: translateY(20px);
}

@-webkit-keyframes line-moving {
    0% {
        background-position: 0px 0px;
    }

    100% {
        background-position: 212px 0px;
    }
}

@keyframes line-moving {
    0% {
        background-position: 0px 0px;
    }

    100% {
        background-position: 212px 0px;
    }
}

.doc-asem-section {
    padding: 120px 0 0;
}

.doc-asem-section .flex-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.doc-asem-section .flex-wrap .flex-left,
.doc-asem-section .flex-wrap .flex-right {
    width: 100%;
    max-width: 50%;
}

.doc-asem-section .content-sec {
    width: 100%;
    max-width: 562px;
}

.doc-asem-section .video-wrap {
    width: 100%;
    max-width: 500px;
    margin: 0 auto;
}

.doc-asem-section .video-wrap video {
    width: 100%;
    max-width: 100%;
}

.sharing-collab-section {
    padding: 120px 0 0;
}

.sharing-collab-section .flex-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.sharing-collab-section .flex-wrap .flex-left,
.sharing-collab-section .flex-wrap .flex-right {
    width: 100%;
    max-width: 50%;
}

.sharing-collab-section .img-wrap {
    width: 100%;
    max-width: 550px;
}

.sharing-collab-section .img-wrap img {
    -webkit-transform: translateX(-50px);
    transform: translateX(-50px);
    -webkit-transition: 1.5s ease;
    transition: 1.5s ease;
    opacity: 0;
}

.sharing-collab-section .content-sec {
    width: 100%;
    max-width: 562px;
}

.sharing-collab-section .middle-animated .img-wrap img {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
}

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

.fill-section .flex-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.fill-section .flex-wrap .flex-left,
.fill-section .flex-wrap .flex-right {
    width: 100%;
    max-width: 50%;
}

.fill-section .img-wrap {
    width: 100%;
    max-width: 500px;
    position: relative;
}

.fill-section .img-wrap img {
    -webkit-transform: translateX(50px);
    transform: translateX(50px);
    -webkit-transition: 1.5s ease;
    transition: 1.5s ease;
    opacity: 0;
}

.fill-section .img-wrap::after {
    content: '';
    position: absolute;
    width: 70px;
    height: 70px;
    left: -7%;
    top: 40%;
    background: url(/sites/zweb/images/contracts/features/authoring-sprite.png) no-repeat;
    background-size: 700px auto;
    background-position: -498px 0;
    -webkit-transition: 1s ease .5s;
    transition: 1s ease .5s;
    opacity: 0;
}

.fill-section .content-sec {
    width: 100%;
    max-width: 488px;
}

.fill-section .middle-animated .img-wrap img {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
}

.fill-section .middle-animated .img-wrap::after {
    opacity: 1;
    -webkit-animation: float 4s ease-in-out infinite;
    animation: float 4s ease-in-out infinite;
}

@-webkit-keyframes float {
    0% {
        -webkit-transform: translatey(0px);
        transform: translatey(0px);
    }

    50% {
        -webkit-transform: translatey(-15px);
        transform: translatey(-15px);
    }

    100% {
        -webkit-transform: translatey(0px);
        transform: translatey(0px);
    }
}

@keyframes float {
    0% {
        -webkit-transform: translatey(0px);
        transform: translatey(0px);
    }

    50% {
        -webkit-transform: translatey(-15px);
        transform: translatey(-15px);
    }

    100% {
        -webkit-transform: translatey(0px);
        transform: translatey(0px);
    }
}

.revisions-section {
    padding: 150px 0 120px;
    background-color: #FBF0E8;
}

.revisions-section .flex-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.revisions-section .flex-wrap .flex-left,
.revisions-section .flex-wrap .flex-right {
    width: 100%;
    max-width: 50%;
}

.revisions-section .img-wrap {
    width: 100%;
    max-width: 500px;
    position: relative;
}

.revisions-section .img-wrap img {
    -webkit-transform: translateX(-50px);
    transform: translateX(-50px);
    -webkit-transition: 1.5s ease;
    transition: 1.5s ease;
    opacity: 0;
    z-index: 1;
}

.revisions-section .img-wrap::after {
    content: '';
    position: absolute;
    width: 70px;
    height: 65px;
    left: -10px;
    top: -27px;
    background: url(/sites/zweb/images/contracts/features/authoring-sprite.png) no-repeat;
    background-size: 600px auto;
    background-position: -530px 2px;
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transition: 1s ease .5s;
    transition: 1s ease .5s;
    opacity: 0;
    z-index: 2;
}

.revisions-section .img-wrap::before {
    content: '';
    position: absolute;
    width: 55px;
    height: 60px;
    right: 30%;
    bottom: -5%;
    background: url(/sites/zweb/images/contracts/features/authoring-sprite.png) no-repeat;
    background-size: 730px auto;
    background-position: -590px -4px;
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transition: 1s ease .5s;
    transition: 1s ease .5s;
    opacity: 0;
    z-index: 2;
}

.revisions-section .content-sec {
    width: 100%;
    max-width: 539px;
}

.revisions-section .middle-animated .img-wrap img {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
}

.revisions-section .middle-animated .img-wrap::after {
    opacity: 1;
    -webkit-animation: rotation 5s infinite forwards;
    animation: rotation 5s infinite forwards;
}

.revisions-section .middle-animated .img-wrap::before {
    opacity: 1;
    -webkit-animation: float 4s ease-in-out infinite;
    animation: float 4s ease-in-out infinite;
}

@-webkit-keyframes rotation {
    from {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    to {
        -webkit-transform: rotate(359deg);
        transform: rotate(359deg);
    }
}

@keyframes rotation {
    from {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    to {
        -webkit-transform: rotate(359deg);
        transform: rotate(359deg);
    }
}

.footer-section {
    padding: 120px 0;
    background-color: #222328;
}

.footer-section .content-sec {
    text-align: center;
}

.footer-section .content-sec h2 {
    width: 100%;
    max-width: 630px;
    color: #fff;
    margin: 0 auto 25px;
}

.content-creation-section,
.content-authoring-section,
.fill-section {
    overflow: hidden;
}

@media (max-width: 1536px) {
    h1 {
        font-size: 54px;
        line-height: 64px;
    }

    .banner-animation-wrap .content-sec h1 {
        max-width: 500px;
    }

    .banner-animation-wrap .content-sec {
        padding: 120px 0;
    }

    .banner-animation-wrap .animation-elements .style-title-holder {
        left: 2%;
    }

    .banner-animation-wrap .animation-elements .left-avatar {
        left: 12%;
    }

    .banner-animation-wrap .animation-elements .right-avatar {
        right: 12%;
    }
}

@media (max-width: 1280px) {
    .banner-section {
        padding: 70px 0 130px;
    }

    .banner-animation-wrap .content-sec {
        padding: 90px 0;
    }
}

@media (max-width: 1200px) {
    h1 {
        font-size: 48px;
        line-height: 58px;
    }

    h2 {
        font-size: 36px;
        line-height: 46px;
    }

    .banner-animation-wrap .content-sec h1 {
        max-width: 500px;
    }

    .banner-animation-wrap .animation-elements .frame-holder {
        top: 0;
        bottom: 0;
    }

    .banner-animation-wrap .animation-elements .frame-holder img {
        height: 100%;
    }

    .banner-animation-wrap .content-sec p {
        font-size: 17px;
        line-height: 1.6;
    }

    .native-doc-inner-section .native-tab-content {
        max-width: 900px;
    }

    .content-creation-inner-section .flex-wrap .img-wrap,
    .content-authoring-inner-section .flex-wrap .img-wrap {
        max-width: 400px;
        margin: 0 auto;
    }

    .doc-asem-section .video-wrap {
        max-width: 380px;
    }

    .sharing-collab-section .img-wrap {
        max-width: 400px;
    }

    .fill-section .img-wrap {
        max-width: 350px;
        margin: 0 auto;
    }

    .revisions-section .img-wrap {
        max-width: 400px;
    }

    /* spacing */
    .banner-section {
        padding: 70px 0 100px;
    }

    .templates-section,
    .content-creation-section,
    .fill-section,
    .revisions-section,
    .footer-section {
        padding: 120px 0;
    }

    .native-doc-section,
    .doc-asem-section,
    .sharing-collab-section {
        padding: 120px 0 0;
    }

    /* spacing end */
}

@media (max-width: 1080px) {

    .banner-animation-wrap .animation-elements .style-title-holder,
    .banner-animation-wrap .animation-elements .avatar-holder,
    .banner-animation-wrap .animation-elements .shapes-holder {
        display: none;
    }
}

@media (max-width: 991px) {
    .banner-animation-wrap .animation-elements .frame-holder {
        display: none;
    }

    .banner-animation-wrap .content-sec {
        padding: 0;
    }

    .templates-inner-section .content-sec {
        max-width: 650px;
    }

    .content-creation-inner-section .flex-wrap,
    .content-authoring-inner-section .flex-wrap {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .content-creation-inner-section .flex-wrap .flex-left,
    .content-creation-inner-section .flex-wrap .flex-right,
    .content-authoring-inner-section .flex-wrap .flex-left,
    .content-authoring-inner-section .flex-wrap .flex-right {
        max-width: 100%;
    }

    .content-creation-inner-section .flex-wrap .flex-left .content-sec,
    .content-authoring-inner-section .flex-wrap .flex-right .content-sec {
        text-align: center;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 50px;
    }

    .native-doc-inner-section .sec-title {
        text-align: center;
    }

    .native-doc-inner-section .content-sec {
        text-align: center;
        max-width: 660px;
        margin: 0 auto 50px;
    }

    .native-doc-inner-section .menu-items {
        margin-left: auto;
        margin-right: auto;
    }

    .native-doc-inner-section .native-tab-content {
        max-width: 650px;
        margin-left: auto;
        margin-right: auto;
    }

    .doc-asem-section .flex-wrap {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .doc-asem-section .flex-wrap .flex-left,
    .doc-asem-section .flex-wrap .flex-right {
        max-width: 100%;
    }

    .doc-asem-section .content-sec {
        text-align: center;
        margin: 0 auto 50px;
    }

    .sharing-collab-section .flex-wrap,
    .content-authoring-section .flex-wrap {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .sharing-collab-section .flex-wrap .flex-left,
    .content-authoring-section .flex-wrap .flex-left {
        -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
        order: 1;
    }

    .sharing-collab-section .flex-wrap .flex-left,
    .sharing-collab-section .flex-wrap .flex-right {
        max-width: 100%;
    }

    .sharing-collab-section .content-sec {
        text-align: center;
        margin: 0 auto 50px;
    }

    .sharing-collab-section .img-wrap {
        margin-left: auto;
        margin-right: auto;
    }

    .fill-section .flex-wrap {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .fill-section .flex-wrap .flex-left,
    .fill-section .flex-wrap .flex-right {
        max-width: 100%;
    }

    .fill-section .content-sec {
        text-align: center;
        margin: 0 auto 50px;
    }

    .revisions-section .flex-wrap {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .revisions-section .flex-wrap .flex-left,
    .revisions-section .flex-wrap .flex-right {
        max-width: 100%;
    }

    .revisions-section .flex-wrap .flex-left {
        -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
        order: 1;
    }

    .revisions-section .img-wrap {
        margin-left: auto;
        margin-right: auto;
    }

    .revisions-section .content-sec {
        text-align: center;
        margin: 0 auto 50px;
    }

    .revisions-section .middle-animated .img-wrap::after {
        -webkit-animation: none;
        animation: none;
        -webkit-transform: scale(0.8) translate(-7px, 0);
        transform: scale(0.8) translate(-7px, 0);
    }

    /* spacing */
    .banner-section {
        padding: 60px 0 80px;
    }

    .templates-section,
    .content-authoring-section,
    .fill-section,
    .revisions-section,
    .footer-section {
        padding: 90px 0;
    }

    .content-creation-section,
    .native-doc-section,
    .doc-asem-section,
    .sharing-collab-section {
        padding: 90px 0 0;
    }

    /* spacing end */
}

@media (max-width: 767px) {
    h1 {
        font-size: 42px;
        line-height: 52px;
    }

    h2 {
        font-size: 32px;
        line-height: 42px;
    }

    .banner-animation-wrap .content-sec h1 {
        max-width: 400px;
    }

    .templates-inner-section .sec-title {
        max-width: 370px;
    }

    .footer-section .content-sec {
        width: 100%;
        max-width: 470px;
        margin-left: auto;
        margin-right: auto;
    }
}

@media(max-width:640px) {
    h1 {
        font-size: 32px;
        line-height: 42px;
    }

    h2 {
        font-size: 28px;
        line-height: 38px;
    }

    .banner-animation-wrap .content-sec h1 {
        max-width: 300px;
    }

    .banner-animation-wrap .content-sec h1 span::before {
        font-size: 10px;
        right: -49px;
        top: 10px;
    }

    .revisions-section .img-wrap::after,
    .fill-section .img-wrap::after {
        content: unset;
    }

    .content-creation-inner-section .flex-wrap .flex-left .content-sec,
    .content-authoring-inner-section .flex-wrap .flex-right .content-sec,
    .native-doc-inner-section .content-sec,
    .doc-asem-section .content-sec,
    .sharing-collab-section .content-sec,
    .fill-section .content-sec,
    .revisions-section .content-sec {
        margin-bottom: 40px;
    }

    /* spacing */
    .banner-section {
        padding: 50px 0 60px;
    }

    .templates-section,
    .content-authoring-section,
    .fill-section,
    .revisions-section,
    .footer-section {
        padding: 60px 0;
    }

    .content-creation-section,
    .native-doc-section,
    .doc-asem-section,
    .sharing-collab-section {
        padding: 60px 0 0;
    }

    /* spacing end */
}

@media(max-width: 480px) {
    h1 {
        font-size: 24px;
        line-height: 31px;
    }

    h2 {
        font-size: 22px;
        line-height: 30px;
    }

    .banner-animation-wrap .content-sec h1 {
        max-width: 250px;
    }

    .banner-animation-wrap .content-sec h1 span::before {
        font-size: 10px;
        right: -49px;
        top: 6px;
    }

    .native-doc-inner-section .native-tab-content .tab-content-items .abs-img {
        top: -10%;
    }

    .native-doc-inner-section .native-tab-content {
        margin-top: 30px;
    }

    .native-doc-inner-section .sec-title .edit-pen {
        background-size: 400px auto;
        background-position: -183px -10px;
        width: 85px;
        height: 20px;
    }

    .native-doc-inner-section .sec-title .edit-pen::after {
        bottom: -5px;
    }

    .native-doc-section .middle-animated .native-doc-inner-section .sec-title .edit-pen::after {
        width: 90%;
    }

    .native-doc-inner-section .menu-items .menu-list {
        font-size: 15px;
    }

    .footer-section .content-sec h2 {
        margin-bottom: 10px;
    }

    .template-slider {
        max-width: 300px;
        margin: 60px auto 0;
    }

    /* spacing */
    .banner-section {
        padding: 35px 0 50px;
    }

    .templates-section,
    .content-authoring-section,
    .fill-section,
    .revisions-section,
    .footer-section {
        padding: 50px 0;
    }

    .content-creation-section,
    .native-doc-section,
    .doc-asem-section,
    .sharing-collab-section {
        padding: 50px 0 0;
    }

    /* spacing end */
}