.banner-section{height:800px;display:flex;display:-ms-flexbox;align-items:center;-ms-flex-align:center}.banner-section .rows{display:flex;display:-ms-flexbox;flex-wrap:wrap;-ms-flex-wrap:wrap;align-items:center;-ms-flex-align:center;justify-content:space-between;-ms-flex-pack:space-between}.banner-section .rows .banner-content{flex:0 0 50%;-ms-flex:0 0 50%;max-width:40%}.banner-integration{flex:0 0 50%;-ms-flex:0 0 50%;max-width:50%}.banner-integration ul{display:flex;transform:rotate(-20deg);-webkit-transform:rotate(-20deg);-ms-transform:rotate(-20deg);align-items:center;-ms-flex-align:center;position:relative;top:-70px}.banner-integration ul li:nth-child(3){position:relative;top:80px}.banner-integration ul li:nth-child(4){position:relative;top:160px}.banner-integration div.icon{width:140px;height:150px;background:#000;margin:10px 10px;border-radius:20px;position:relative}div.icon::before{background:var(--product-icons) no-repeat;background-size:var(--zp-i-bs);width:var(--zp-i-w);height:var(--zp-i-w);position:absolute;content:"";top:50%;left:50%;transform:translate(-50%,-50%);-webkit-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%)}.banner-integration ul li div.icon.zfedx::before{background-position:var(--zp-recruit-bp);transform:scale(1.6) translate(-30%,-30%)}.banner-integration .icon.zcrm{background:#d2e9f9}.banner-integration .icon.zfedx,.banner-integration .icon.zavalara,.banner-integration .icon.zbook,.banner-integration .icon.zg-analytics,.banner-integration .icon.zups,.banner-integration ul li div.icon.zpaypal{background:transparent}.banner-integration ul li div.icon.zcrm::before{background-position:var(--zp-crm-bp);transform:scale(1.8) translate(-25%,-25%)}.banner-integration ul li div.icon.zstripe::before{background:url(http://www.zohowebstatic.com/sites/zweb/images/othercompanylogos/quick-books-new.png) no-repeat;background-size:130px auto;width:130px;height:56px}.banner-integration ul li div.icon.zpaypal::before{background:url('//www.zohowebstatic.com/sites/zweb/images/othercompanylogos/xoxo-day.png') no-repeat;background-size:110px auto;background-position:0 0;width:110px;height:30px}.banner-integration ul li div.icon.zanalytics::before{background-position:var(--zp-analytics-bp);filter:brightness(10);transform:scale(1.5) translate(-33%,-43%)}.banner-integration ul li div.icon.zbook::before{background-position:var(--zp-books-bp);transform:scale(1.4) translate(-30%,-30%)}.banner-integration ul li div.icon.zmailchimp::before{background-position:var(--zp-sign-bp);transform:scale(1.6) translate(-33%,-33%)}.banner-integration ul li div.icon.zups::before{background:url(//www.zohowebstatic.com/sites/zweb/images/othercompanylogos/zapier.png) no-repeat;background-size:54px auto;width:54px;height:54px}.banner-integration ul li div.icon.zavalara::before{background:url(//www.zohowebstatic.com/sites/zweb/images/othercompanylogos/adobe-sign.png) no-repeat;background-size:64px auto;width:64px;height:64px}.banner-integration ul li div.icon.zg-analytics::before{background:url(//www.zohowebstatic.com/sites/zweb/images/othercompanylogos/docusign.png) no-repeat;background-size:80px auto;width:80px;height:31px}.banner-integration ul li div.icon.zanalytics{background:#fc031b}.banner-integration ul li div.icon.zcanadapost::before{background-position:var(--zp-expense-bp);transform:scale(1.6) translate(-30%,-30%)}.banner-integration ul li div.icon.zmailchimp{background:#fff8c9}.banner-integration ul li div.icon.zstripe{background:#fff}.banner-integration ul li div.icon.zbook{background:#e0f5ff}.banner-integration ul li div.icon.zcanadapost{background:#ffe6e8}.banner-integration ul li div{opacity:0;transition:all 1s ease-out;-webkit-transition:all 1s ease-out}.banner-integration ul li:nth-child(1) div:nth-child(1),.banner-integration ul li div:nth-child(1){transform:translate3d(0,-50px,0) scale(0.8);-webkit-transform:translate3d(0,-50px,0) scale(0.8);-ms-transform:translate3d(0,-50px,0) scale(0.8)}.banner-integration ul li:nth-child(1) div:nth-child(2),.banner-integration ul li div:nth-child(3){transform:translate3d(0,50px,0) scale(0.8);-webkit-transform:translate3d(0,50px,0) scale(0.8);-ms-transform:translate3d(0,50px,0) scale(0.8)}.banner-integration ul li div:nth-child(2){transform:scale(0.8);-webkit-transform:scale(0.8);-ms-transform:scale(0.8)}.middle-animated .banner-integration ul li:nth-child(1) div:nth-child(1),.middle-animated .banner-integration ul li:nth-child(1) div:nth-child(2),.middle-animated .banner-integration ul li div{opacity:1;transform:translate3d(0,0,0);-webkit-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0)}.banner-integration ul li:nth-child(1) div:nth-child(2){transition-delay:.2s;-webkit-transition-delay:.2s}.banner-integration ul li:nth-child(2) div:nth-child(1){transition-delay:.3s;-webkit-transition-delay:.3s}.banner-integration ul li:nth-child(2) div:nth-child(2){transition-delay:.4s;-webkit-transition-delay:.4s}.banner-integration ul li:nth-child(2) div:nth-child(3){transition-delay:.5s;-webkit-transition-delay:.5s}.banner-integration ul li:nth-child(3) div:nth-child(1){transition-delay:.6s;-webkit-transition-delay:.6s}.banner-integration ul li:nth-child(3) div:nth-child(2){transition-delay:.8s;-webkit-transition-delay:.8s}.banner-integration ul li:nth-child(3) div:nth-child(3){transition-delay:.9s;-webkit-transition-delay:.9s}.banner-integration ul li:nth-child(4) div:nth-child(1){transition-delay:1s;-webkit-transition-delay:1s}.banner-integration ul li:nth-child(4) div:nth-child(2){transition-delay:1.1s;-webkit-transition-delay:1.1s}.banner-integration ul li:nth-child(4) div:nth-child(3){transition-delay:1.2s;-webkit-transition-delay:1.2s}@media only screen and (max-width:1366px){.banner-section{height:auto;padding:3em 0}.banner-integration ul{transform:translate(-70px,0) scale(0.8) rotate(-20deg);-webkit-transform:translate(-70px,0) scale(0.8) rotate(-20deg);-ms-transform:translate(-70px,0) scale(0.8) rotate(-20deg);-o-transform:translate(-70px,0) scale(0.8) rotate(-20deg)}}@media only screen and (max-width:1199px){.banner-integration div.icon{width:120px;height:120px}}@media only screen and (max-width:1023px){.banner-integration{display:none}.banner-section .rows .banner-content{flex:0 0 100%;-ms-flex:0 0 100%;max-width:500px;margin:0 auto;text-align:center}}@media only screen and (max-width:767px){.banner-section{padding:4em 0}}