body {
    text-rendering: auto;
    -webkit-font-smoothing: auto;
    font-size: 16px
}

section.zsection.zsection-banner {
    padding: 60px 0
}

.zthree-col-container {
    text-align: left
}

span.zicon.zicon-bigin {
    background-position: -440px -80px
}

span.zicon.zicon-payroll {
    background-position: var(--zp-payroll-bp)
}

span.zicon.zicon-booking {
    background-position: -320px -80px
}

span.zicon-lens {
    background-position: var(--zp-lens-bp)
}

span.zicon.zicon-contracts {
    background-position: -600px -80px
}

span.zicon.zicon-showtime {
    background-position: var(--zp-showtime-bp)
}

span.zicon-learn {
    background-position: var(--zp-learn-bp)
}

span.zicon-teaminbox {
    background-position: var(--zp-teaminbox-bp)
}

.zthree-col-inner a {
    color: inherit;
    display: block
}

.zthree-col-container:not(:last-child) {
    margin-bottom: 40px
}

.zthree-col-inner ul {
    margin-top: 10px
}

.common-links {
    margin-top: 0
}

.main {
    position: relative;
    text-align: center
}

p {
    margin: 0 auto
}

#fluid-banner {
    padding-top: 0;
    padding-bottom: 30px
}

.fluid-banner {
    position: relative;
    width: 100%;
    max-width: 990px;
    margin: 0 auto
}

.fluid-banner img {
    z-index: 1;
    margin-top: 0
}

.fluid-banner span {
    position: absolute;
    background: url("/sites/zweb/images/one/app-sprite.png") no-repeat 0 0;
    display: inline-block
}

.fluid-banner .cloudBig {
    background-position: 0 0;
    width: 50px;
    height: 30px;
    top: 3%;
    left: 5%;
    z-index: -1;
    opacity: 0;
    animation: cloudBigAnimate 20s 1s infinite linear;
    -webkit-animation: cloudBigAnimate 20s 1s infinite linear
}

.zicon38 {
    background-position: 2px -240px
}

.zicon37 {
    background-position: -385px -192px
}

.zicon-mobile {
    background-image: url('/sites/zweb/images/one/applications-sprite-2x.png');
    background-size: 960px auto
}

@keyframes cloudBigAnimate {
    0% {
        left: 5%;
        opacity: .2
    }

    15% {
        opacity: .5
    }

    95% {
        opacity: .5
    }

    100% {
        left: 35%;
        opacity: 0
    }
}

@-webkit-keyframes cloudBigAnimate {
    0% {
        left: 5%;
        opacity: 0
    }

    5% {
        opacity: .5
    }

    95% {
        opacity: .5
    }

    100% {
        left: 35%;
        opacity: 0
    }
}

.fluid-banner .aero {
    background-position: -50px 0;
    width: 70px;
    height: 30px;
    top: 29%;
    left: 5%;
    z-index: -1;
    opacity: 0;
    transform: rotate(-5deg);
    animation: aeroAnimate 12s 4s infinite linear;
    -webkit-animation: aeroAnimate 12s 4s infinite linear
}

@keyframes aeroAnimate {
    0% {
        top: 29%;
        left: 5%;
        opacity: .2
    }

    15% {
        opacity: 1
    }

    95% {
        opacity: 1
    }

    100% {
        top: 2%;
        left: 65%;
        opacity: 0
    }
}

@-webkit-keyframes aeroAnimate {
    0% {
        top: 29%;
        left: 5%;
        opacity: .2
    }

    15% {
        opacity: .5
    }

    95% {
        opacity: .5
    }

    100% {
        top: 2%;
        left: 65%;
        opacity: 0
    }
}

.fluid-banner .cloudSmall {
    background-position: -118px 0;
    width: 50px;
    height: 30px;
    top: -1%;
    left: 65%;
    z-index: -1;
    opacity: 0;
    animation: cloudSmallAnimate 25s 1s infinite linear;
    -webkit-animation: cloudSmallAnimate 25s 1s infinite linear
}

@keyframes cloudSmallAnimate {
    0% {
        left: 75%;
        opacity: .2
    }

    15% {
        opacity: .5
    }

    95% {
        opacity: .5
    }

    100% {
        left: 90%;
        opacity: 0
    }
}

@-webkit-keyframes cloudSmallAnimate {
    0% {
        left: 75%;
        opacity: .2
    }

    15% {
        opacity: .5
    }

    95% {
        opacity: .5
    }

    100% {
        left: 90%;
        opacity: 0
    }
}

.fluid-banner .wheel {
    background-position: 0 -138px;
    width: 156px;
    height: 145px;
    top: 16.2%;
    left: 80.6%;
    z-index: -1;
    opacity: 1;
    animation: wheelAnimate 25s 1s infinite linear;
    -webkit-animation: wheelAnimate 25s 1s infinite linear;
    transform-origin: 50% 50%;
    -webkit-transform-origin: 50% 50%
}

@keyframes wheelAnimate {
    0% {
        transform: rotate(0)
    }

    100% {
        transform: rotate(360deg)
    }
}

@-webkit-keyframes wheelAnimate {
    0% {
        transform: rotate(0)
    }

    100% {
        transform: rotate(360deg)
    }
}

.clock-needle-large {
    top: 35.2%;
    left: 75%;
    width: 31px;
    height: 1.5px;
    z-index: -1;
    transform: rotate(90deg);
    background: linear-gradient(to right,#fff 50%,#ccc 50%) !important;
    animation: clockLargeAnimate 45s 1s infinite linear;
    -webkit-animation: clockLargeAnimate 45s 1s infinite linear;
    transform-origin: 50% 50%;
    -webkit-transform-origin: 50% 50%
}

@keyframes clockLargeAnimate {
    0% {
        transform: rotate(90deg)
    }

    100% {
        transform: rotate(450deg)
    }
}

@-webkit-keyframes clockLargeAnimate {
    0% {
        transform: rotate(90deg)
    }

    100% {
        transform: rotate(450deg)
    }
}

.clock-needle-small {
    top: 35%;
    left: 76.7%;
    width: 13px;
    height: 2px;
    z-index: -1;
    background: #ccc !important
}

.fluid-banner .app-icon1 {
    background-position: 0 -30px;
    width: 60px;
    height: 50px;
    top: 21%;
    left: 37%;
    animation: appIcon .5s .5s ease both;
    -webkit-animation: appIcon .5s .5s ease both
}

.fluid-banner .app-icon2 {
    background-position: -50px -30px;
    width: 60px;
    height: 50px;
    top: 21%;
    left: 46%;
    animation: appIcon .5s .8s ease both;
    -webkit-animation: appIcon .5s .8s ease both
}

.fluid-banner .app-icon3 {
    background-position: -100px -30px;
    width: 60px;
    height: 50px;
    top: 21%;
    left: 55%;
    animation: appIcon .5s .6s ease both;
    -webkit-animation: appIcon .5s .6s ease both
}

.fluid-banner .app-icon4 {
    background-position: 0 -75px;
    width: 60px;
    height: 50px;
    top: 54%;
    left: 37%;
    animation: appIcon .5s .9s ease both;
    -webkit-animation: appIcon .5s .9s ease both
}

.fluid-banner .app-icon5 {
    background-position: -50px -75px;
    width: 60px;
    height: 50px;
    top: 54%;
    left: 46%;
    animation: appIcon .5s .7s ease both;
    -webkit-animation: appIcon .5s .7s ease both
}

.fluid-banner .app-icon6 {
    background-position: -100px -75px;
    width: 60px;
    height: 50px;
    top: 54%;
    left: 55%;
    animation: appIcon .5s 1s ease both;
    -webkit-animation: appIcon .5s 1s ease both
}

@keyframes appIcon {
    0% {
        transform: scale(0.5);
        opacity: 0
    }

    100% {
        transform: scale(1);
        opacity: 1
    }
}

@-webkit-keyframes appIcon {
    0% {
        transform: scale(0.5);
        opacity: 0
    }

    100% {
        transform: scale(1);
        opacity: 1
    }
}

@media only screen and (max-width: 991px) {
    #fluid-banner {
        display:none
    }
}

@media only screen and (max-width: 767px) {
    .zthree-col-inner {
        margin-bottom:25px
    }

    .main {
        overflow: hidden
    }
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),only screen and (min--moz-device-pixel-ratio:1.5),only screen and (min-resolution:240dpi) {
    .fluid-banner span {
        background:url("/sites/zweb/images/one/app-sprite-2x.png") no-repeat 0 0;
        background-size: 211px auto
    }
}

.i18n-ar h1,.i18n-ar .zsection-banner p,.i18n-ar .zsection-nav-menu {
    text-align: center
}

.i18n-ar .zthree-col-inner {
    margin: 2% 5% 1% 0
}

.i18n-ar .zthree-col-container h2 {
    margin-left: 0;
    margin-right: 30px
}

@media only screen and (max-width: 640px) {
    .i18n-ar h2 {
        text-align:right
    }

    .i18n-ar .zthree-col-inner {
        margin: 2% 0% 10% 6%
    }
}

.zsection.zsection-banner {
    text-align: left;
    background: #f9f9f9
}

.zsection-banner .zcontainer {
    max-width: 950px;
    text-align: left
}

.zsection-banner .zcontainer>p {
    margin-left: 0
}

.zsection-nav-menu ul li:before {
    content: none
}

.zsection {
    position: relative;
    z-index: 1
}

.zicon-commerce,.zicon-lens,.zicon-learn,.zicon-teaminbox,.zicon-dataprep {
    position: relative
}

.zicon-commerce:after,.zicon-lens:after,.zicon-learn:after,.zicon-teaminbox:after,.zicon-dataprep:after {
    content: "New";
    background: #fef07d;
    color: #c46b0c;
    font-size: 10px;
    top: 2px;
    right: -37px;
    position: absolute;
    padding: 1px 6px 1px
}

.zsection-nav-menu ul li.zselected:after {
    content: none
}

.zsection-nav-menu ul li {
    font-family: var(--zf-primary-semibold)
}

.zthree-col-container h2 {
    border-bottom: 0
}

.zthree-col-container {
    padding-left: 100px
}

.zsection-nav-menu ul li {
    float: none
}

.zsection-nav-menu ul li {
    display: block;
    text-align: left;
    line-height: 35px
}

.zsection-nav-menuFixed ul li {
    padding: 4px 0
}

.zsection-nav-menu ul {
    position: absolute;
    left: 8%;
    top: 70px;
    z-index: 2
}

.zsection-nav-menu.zsection-nav-menuFixed {
    background: transparent;
    height: 0;
    border: 0
}

.zthree-col-container h2 {
    margin-left: 30px
}

.zsection {
    background: #fff;
    transition: 3s ease
}

.zcontainer {
    max-width: 960px
}

.zthree-col-inner {
    width: 26%;
    box-sizing: border-box;
    margin: 2% 0 1% 5%;
    display: inline-block;
    vertical-align: top;
    float: none
}

.zsection-nav-menuFixed ul li {
    color: #000
}

.zthree-col-container {
    overflow: visible
}

.zthree-col-inner .z-explore-now {
    color: #0083d3;
    font-size: 14px
}

.watch-btn {
    font-size: 14px;
    color: #000;
    font-family: var(--zf-primary-semibold)
}

.footer-wrapper {
    margin-top: 0
}

.zsection-footer-nav-menu {
    display: none
}

.zicon {
    background: var(--product-icons) no-repeat;
    background-size: var(--zp-i-bs);
    width: var(--zp-i-w);
    height: var(--zp-i-h);
    display: inline-block
}

.zicon1 {
    background-position: var(--zp-crm-bp)
}

.zicon2 {
    background-position: var(--zp-bigin-bp)
}

.zicon4 {
    background-position: -179px -3px
}

.zicon35 {
    background-position: -690px -3px
}

.zicon6 {
    background-position: var(--zp-campaigns-bp)
}

.zicon7 {
    background-position: var(--zp-social-bp)
}

.zicon8 {
    background-position: var(--zp-survey-bp)
}

.zicon9 {
    background-position: var(--zp-forms-bp)
}

.zicon-sites {
    background-position: var(--zp-sites-bp)
}

.zicon38 {
    background-position: var(--zp-pagesense-bp);
}

.zicon5 {
    background-position: var(--zp-salesiq-bp)
}

.zicon39 {
    background-position: var(--zp-backstage-bp)
}

.zicon.zicon40 {
    background-position: var(--zp-marketinghub-bp)
}

.zicon10 {
    background-position: var(--zp-desk-bp)
}

.zicon11 {
    background-position: var(--zp-assist-bp)
}

.zicon12 {
    background-position: var(--zp-mail-bp)
}

.zicon13 {
    background-position: var(--zp-cliq-bp)
}

.zicon20 {
    background-position: var(--zp-projects-bp)
}

.zicon36 {
    background-position: var(--zp-sprints-bp)
}

.zicon14 {
    background-position: var(--zp-connect-bp)
}

.zicon18 {
    background-position: -5px -117px
}

.zicon21 {
    background-position: var(--zp-meeting-bp)
}

.zicon15 {
    background-position: var(--zp-writer-bp)
}

.zicon16 {
    background-position: var(--zp-sheet-bp)
}

.zicon17 {
    background-position: var(--zp-show-bp)
}

.zicon19 {
    background-position: -635px -61px
}

.zicon24 {
    background-position: var(--zp-sign-bp)
}

.zicon23 {
    background-position: var(--zp-notebook-bp)
}

.zicon22 {
    background-position: var(--zp-vault-bp)
}

.zicon25 {
    background-position: var(--zp-books-bp)
}

.zicon26 {
    background-position: var(--zp-invoice-bp)
}

.zicon28 {
    background-position: var(--zp-expense-bp)
}

.ziconcheckout {
    background-position: var(--zp-checkout-bp)
}

.zicon27 {
    background-position: var(--zp-subscriptions-bp)
}

.zicon29 {
    background-position: var(--zp-inventory-bp)
}

.zicon30 {
    background-position: var(--zp-people-bp)
}

.zicon31 {
    background-position: var(--zp-recruit-bp)
}

.zicon32 {
    background-position: var(--zp-creator-bp)
}

.zicon3 {
    background-position: var(--zp-analytics-bp)
}

.zicon37 {
    background-position: var(--zp-flow-bp)
}

.zthree-col-inner p {
    margin-bottom: 20px
}

.zicon-bugtracker {
    background-position: var(--zp-bugtracker-bp)
}

.zicon-workdrive {
    background-position: var(--zp-workdrive-bp)
}

.zicon-orchestly {
    background-position: var(--zp-orchestly-bp)
}

@media screen and (min-width: 1500px) {
    .zcontainer {
        max-width:1170px
    }

    .zthree-col-container {
        padding-left: 80px
    }
}

@media screen and (max-width: 1499px) {
    .zsection-banner .zcontainer {
        max-width:690px
    }
}

@media screen and (min-width: 1041px) and (max-width:1200px) {
    .zthree-col-container {
        padding-left:180px
    }
}

@media screen and (min-width: 1041px) {
    section#zlegal {
        min-height:500px
    }
}

@media screen and (max-width: 1040px) {
    .zthree-col-container {
        padding-left:0
    }

    .zsection {
        padding: 60px 0 0
    }
}

@media screen and (max-width: 992px) {
    .zthree-col-container {
        max-width:900px
    }

    .zthree-col-inner:nth-child(3n+1) {
        margin: 0
    }

    @media screen and (max-width: 480px) {
        .zsection {
            padding:40px 0 0
        }
    }

    .zthree-col-inner,.zthree-col-inner:nth-child(3n+1),.zthree-col-inner {
        width: auto;
        display: inline-block;
        float: none;
        vertical-align: top;
        margin: 0 0 40px
    }

    .zthree-col-container h2 {
        margin-left: 0;
        margin-bottom: 20px
    }

    .zsection.zsection-banner {
        padding: 60px 0
    }

    .zicon+h3,.zicon-mobile+h3 {
        margin: 0
    }

    .zicon {
        display: block;
        margin-bottom: 15px
    }
}

@media screen and (min-width: 641px) and (max-width:1040px) {
    .zthree-col-container h2 {
        margin-left:40px
    }
}

@media screen and (min-width: 641px) and (max-width:992px) {
    .zthree-col-inner,.zthree-col-inner:nth-child(3n+1),.zthree-col-inner {
        width:36%;
        margin: 0 40px 40px 40px
    }
}

@media screen and (max-width: 640px) {
    .zthree-col-inner,.zthree-col-inner:nth-child(3n+1) {
        margin:0 0 40px
    }

    .zicon+h3,.zicon-mobile+h3 {
        height: auto;
        vertical-align: middle
    }

    .zicon {
        vertical-align: middle
    }

    .zthree-col-inner {
        width: 100%;
        margin: 0;
        margin-bottom: 40px
    }
}

.i18n-ar .zthree-col-container {
    padding-left: 0;
    padding-right: 100px
}

.i18n-ar .zsection-nav-menu ul {
    left: unset;
    right: 8%
}

.i18n-ar .zsection-nav-menu ul li {
    text-align: right
}

.i18n-ar .zicon40:after {
    right: unset;
    left: -37px
}

.zbv-ie-11.i18n-ar .zicon40:after {
    right: auto
}

.zicon40:after {
    content: none
}

@media screen and (min-width: 1500px) {
    .i18n-ar .zthree-col-container {
        padding-left:0;
        padding-right: 80px
    }
}

.i18n-ar .zsection-banner .zcontainer h1,.i18n-ar .zsection-banner .zcontainer p,.i18n-ar .zsection-banner .zcontainer {
    text-align: right
}

.i18n-ar .zicon-bigin:after,.i18n-ar .zicon-booking:after {
    left: -37px;
    right: auto
}

.i18n-ar .zsection-banner .zcontainer>p {
    margin-right: 0
}

@media screen and (max-width: 1200px) and (min-width:1041px) {
    .i18n-ar .zthree-col-container {
        padding-left:0;
        padding-right: 180px
    }
}

@media screen and (max-width: 1040px) {
    .i18n-ar .zthree-col-container {
        padding-left:0;
        padding-right: 0
    }
}

@media screen and (max-width: 1040px) and (min-width:641px) {
    .i18n-ar .zthree-col-container h2 {
        margin-left:0;
        margin-right: 40px
    }
}

@media screen and (max-width: 992px) and (min-width:641px) {
    .i18n-ar .zthree-col-inner,.i18n-ar .zthree-col-inner:nth-child(3n+1),.i18n-ar .zthree-col-inner {
        margin:0 40px 40px 40px
    }
}

@media screen and (max-width: 640px) {
    .i18n-ar .zthree-col-inner,.zthree-col-inner:nth-child(3n+1) {
        margin:0 0 40px;
        display: block
    }

    .i18n-ar .zthree-col-container h2 {
        margin-right: 0
    }
}

.i18n-ru .zsection-nav-menu ul li {
    margin: 0 10px;
    max-width: 150px
}

.zicon.zicon-commerce {
    background-position: var(--zp-commerce-bp)
}

.zicon.zicon-dataprep {
    background-position: var(--zp-dataprep-bp)
}