/***steps hIde***/
.quick-connect-links-wrap {
    display: none;
}

.zp-home-chat-wrap .mob-content {
    text-align: center;
    max-width: 700px;
    margin: 0 auto;
}

.zp-home-chat-wrap a.btn-more {
    border-bottom: 1px solid #06a9f5;
    padding-bottom: 8px;
    display: inline-block;
}
.zp-home-chat-wrap .mob-content img {
    margin: 60px auto 0;
    max-width: 600px;
    display: block;
}

.m-apps-poster-wrap img {
    max-width: 580px;
}

/*Other lang starts*/
.other-lang .bottom-cta-wrap .content-wrap a.cta-btn {
    display: inline-block;
}
/*Other lang ends*/
.zp-home-banner-wrap:after {
    background: #ffae99;
    background: -moz-linear-gradient(top, #ffae99 0%, #ffd5ab 35%, #ffe8bf 59%, #ffffff 91%);
    background: -webkit-linear-gradient(top, #ffae99 0%, #ffd5ab 35%, #ffe8bf 59%, #ffffff 91%);
    background: linear-gradient(to bottom, #ffae99 0%, #ffd5ab 35%, #ffe8bf 59%, #ffffff 91%);
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#ffae99', endColorstr='#ffffff', GradientType=0);
}

.g2-wrap .g2-logo span,
.g2-sec-testimonial:before {
    background: url(/sites/default/files/salesiq-new-home-sprite-2x.png) no-repeat left top;
    background-size: auto 100px;
}

.g2-sec-testimonial:before {
    background-size: auto 70px
}

.g2-wrap .content-wrap {
    display: table;
    width: auto;
}

.g2-wrap .content-wrap>div {
    display: table-cell;
    vertical-align: middle;
    padding: 0 20px
}

.g2-wrap .content-wrap>div:last-child>div {
    position: relative
}

.g2-wrap .content-wrap>div:last-child>div:before {
    content: '';
    position: absolute;
    left: -20px;
    top: 8%;
    width: 1px;
    height: 80%;
    background: #ccc
}

.g2-wrap .content-wrap>div:last-child h4 {
    color: #2e74ce;
    margin-bottom: 8px
}

.g2-wrap .g2-logo span {
    display: inline-block;
    width: 280px;
    height: 130px;
    background-position: -364px 0;
    background-size: auto 140px;
}
.g2-sec-testimonial {
    position: relative;
    padding: 0 0 0 70px;
    overflow: hidden;
}

.g2-sec-testimonial h5 {
    margin: 10px 0 0
}

.g2-sec-testimonial p {
    font-size: 13px
}

.g2-sec-testimonial:before {
    content: '';
    position: absolute;
    width: 60px;
    height: 60px;
    left: 0px;
    top: 50%;
    margin-top: -35px;
    border-radius: 100%;
    background-position: -330px 0
}

@media only screen and (max-width: 767px) {
    .zp-home-chat-wrap .mob-content img {
        max-width: 400px;
        width: 100%;
    }
    .g2-wrap .content-wrap {
        display: block;
        width: 90%;
        max-width: 400px
    }
    .g2-wrap .content-wrap>div {
        display: block;
        padding: 0;
        text-align: center
    }
    .g2-sec-testimonial {
        text-align: left;
        max-width: 260px;
        margin: 0 auto
    }
    .g2-sec-testimonial p {
        line-height: 1.4;
        padding: 5px 0 0
    }
    .g2-wrap .content-wrap>div:last-child>div:before {
        display: none
    }
}

.features-box>div span {
    background: url(/sites/default/files/salesiq-home-icons-sprite-2x.png) no-repeat 0 0;
    background-size: auto 50px
}


/*---------------------- SalesIQ Animated Banner Starts ----------------------*/

.promo-sec-wrap .content-wrap .slide-wrap {
    overflow: visible
}

.customerPho span,
.flag,
.integration-visual-wrap ul li.zp-main div:after {
    background: url(/sites/default/files/salesiq-new-home-sprite-2x.png) no-repeat left top;
    background-size: auto 100px;
}

#salesiq-banner-img {
    display: none;
}

.circle-animate {
    position: relative;
    height: 620px;
    width: 600px;
    margin: 30px auto 0;
}

.banner-content .circle-animate p {
    color: #333
}

.circle {
    position: absolute;
}

#circle1 {
    height: 600px;
    width: 600px;
    border-radius: 100%;
    border: 1px solid #f3b791;
    background: rgba(255, 255, 255, 0.2);
}

#circle2 {
    border: 1px solid #f3b791;
    border-radius: 100%;
    height: 460px;
    left: 67px;
    top: 67px;
    width: 460px;
}

#circle3 {
    border: 1px solid #f3b791;
    border-radius: 100%;
    height: 320px;
    left: 135px;
    top: 135px;
    width: 320px;
}

#circle4 {
    border: 1px solid #f3b791;
    border-radius: 100%;
    height: 200px;
    left: 195px;
    top: 195px;
    width: 200px;
}

.data {
    position: absolute;
    height: 20px;
    width: 30px;
    display: none;
    z-index: 5;
}

#data0 {
    left: 290px;
    top: 140px;
}

#data1 {
    left: 425px;
    top: 170px;
}

#data2 {
    left: 585px;
    top: 265px;
    display: block;
}

#data3 {
    left: 365px;
    top: 295px;
}

#data5 {
    left: 495px;
    top: 330px;
}

#data6 {
    left: 290px;
    top: 398px;
    display: block;
}

#data7 {
    left: 440px;
    top: 500px;
}

#data8 {
    left: 80px;
    top: 355px;
}

#data9 {
    left: 165px;
    top: 415px;
}

#data10 {
    left: 195px;
    top: 290px;
}

#data11 {
    left: 130px;
    top: 185px;
}

#data12 {
    left: 110px;
    top: 85px;
    display: block;
}

#data13 {
    left: 290px;
    top: 10px;
    display: block;
}

.icon {
    position: absolute;
    top: -39px;
    left: -10px;
    height: 25px;
    width: 50px;
    border: 1px solid #ededed;
    border-radius: 3px;
    background-color: #FFFFFF;
    z-index: 5;
}

.bubble {
    position: absolute;
    width: 195px;
    z-index: 10;
    padding: 5px;
    text-align: center;
    background: none repeat scroll 0 0 #555454;
    font-size: 11px;
    color: white;
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    opacity: 0;
    transition: .7s ease;
    -webkit-transition: .7s ease;
}

.bubble.fadeintooltip {
    transition: .7s ease;
    -webkit-transition: .7s ease;
}

.bubble:after {
    bottom: -5px;
    content: "";
    height: 10px;
    left: 180px;
    position: absolute;
    transform: rotate(135deg);
    -moz-transform: rotate(135deg);
    -webkit-transform: rotate(135deg);
    -ms-transform: rotate(135deg);
    -o-transform: rotate(135deg);
    width: 10px;
    border: 1px solid #555454;
    background: #555454;
    border-bottom: none;
    border-left: none;
}

#bubble1 {
    left: 35px;
    top: -40px;
}

#bubble2 {
    left: 45px;
    top: 25px;
}

#bubble3 {
    left: 34px;
    top: 103px;
}

#bubble4 {
    left: 65px;
    top: 155px;
}

.blink {
    position: absolute;
    height: 60px;
    width: 60px;
    border: solid 1px #ea785d;
    border-radius: 30px;
    display: none;
    transition: transform 1s ease;
    transform: scale(0, 0);
    -moz-border-radius: 30px;
    -ms-border-radius: 30px;
    -webkit-border-radius: 30px;
    -o-border-radius: 30px;
}

#blink0 {
    left: 275px;
    top: 167px;
}

#blink1 {
    left: 404px;
    top: 197px;
}

#blink2 {
    left: 470px;
    top: 60px;
}

#blink3 {
    left: 350px;
    top: 315px;
}

#blink4 {
    left: 390px;
    top: 436px;
}

#blink5 {
    left: 504px;
    top: 352px;
}

#blink6 {
    left: 274px;
    top: 422px;
}

#blink7 {
    left: 570px;
    top: 285px;
}

#blink8 {
    left: 70px;
    top: 385px;
}

#blink9 {
    left: 150px;
    top: 438px;
}

#blink10 {
    left: 180px;
    top: 313px;
}

#blink11 {
    left: 115px;
    top: 212px;
}

#blink12 {
    left: 95px;
    top: 110px;
}

#blink13 {
    left: 273px;
    top: 35px;
}

.holecontainer p {
    padding: 2px 5px;
    margin: 0 10px;
    font-size: 11px;
    line-height: 18px;
}

.holecontainer {
    background: none repeat scroll 0 0 #fff;
    border: 1px solid #ededed;
    text-align: center;
    width: 80px;
    position: relative;
    left: -27px;
    top: -8px;
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
}

.times {
    border-top: 1px solid #ededed;
}

.holecontainer:after {
    bottom: -6px;
    content: "";
    height: 10px;
    left: 36px;
    position: absolute;
    transform: rotate(135deg);
    -moz-transform: rotate(135deg);
    -webkit-transform: rotate(135deg);
    -ms-transform: rotate(135deg);
    -o-transform: rotate(135deg);
    width: 10px;
    border-right: 1px solid #ededed;
    border-top: 1px solid #ededed;
    background: #fff;
    border-bottom: none;
    border-left: none;
}

.customerPho {
    margin: 0 auto;
    position: relative;
    top: 50px;
    width: 100px;
}

.customerPho span {
    background-position: -100px 0px;
    height: 100px;
    width: 100px;
    overflow: hidden;
    display: inline-block;
    text-indent: -999em;
    border-radius: 100%;
}


/* Flags */

.flag {
    width: 30px;
    height: 20px;
    display: inline-block;
    border-radius: 2px;
}

#flag0 {
    background-position: -200px -60px;
}

#flag1,
#flag11,
#flag13 {
    background-position: -200px -40px;
}

#flag2 {
    background-position: -230px -20px;
}

#flag3,
#flag7 {
    background-position: -230px -80px;
}

#flag5 {
    background-position: -200px -20px;
}

#flag6 {
    background-position: -230px -0px;
}

#flag8 {
    background-position: -230px -40px;
}

#flag9 {
    background-position: -200px 0px;
}

#flag10 {
    background-position: -230px -60px;
}

#flag12 {
    background-position: -200px -80px;
}


/*---------------------- SalesIQ Animated Banner Ends ----------------------*/

.integration-visual-wrap ul li:first-child div:after {
    background-position: -700px 0
}

.integration-visual-wrap ul li:nth-child(2) div:after {
    background-position: -50px 0px
}

.integration-visual-wrap ul li:nth-child(3) div:after {
    background-position: -750px 0
}

.integration-visual-wrap ul li:nth-child(4) div:after {
    background-position: -800px 0
}

.integration-visual-wrap ul li:nth-child(6) div:after {
    background-position: -850px 0
}

.integration-visual-wrap ul li:nth-child(7) div:after {
    background-position: -100px 0
}

.integration-visual-wrap ul li:nth-child(8) div:after {
    background-position: -900px 0
}

.integration-visual-wrap ul li:nth-child(9) div:after {
    background-position: -950px 0
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .integration-visual-wrap ul li:first-child div:after {
        background-position: -560px 0
    }
    .integration-visual-wrap ul li:nth-child(2) div:after {
        background-position: -40px 0px
    }
    .integration-visual-wrap ul li:nth-child(3) div:after {
        background-position: -600px 0
    }
    .integration-visual-wrap ul li:nth-child(4) div:after {
        background-position: -640px 0px
    }
    .integration-visual-wrap ul li:nth-child(6) div:after {
        background-position: -680px 0
    }
    .integration-visual-wrap ul li:nth-child(7) div:after {
        background-position: -80px 0
    }
    .integration-visual-wrap ul li:nth-child(8) div:after {
        background-position: -720px 0
    }
    .integration-visual-wrap ul li:nth-child(9) div:after {
        background-position: -760px 0
    }
    .integration-visual-wrap ul li.zp-main div:after {
        background-size: auto 70px;
    }
}
@media only screen and (max-width:1023px) {
.zp-home-chat-wrap .mob-content img, .zp-mobile-apps-wrap .m-apps-poster-wrap img {
    max-width: 450px;
    width: 100%;
}
}
@media only screen and (max-width:767px) {
    .integration-visual-wrap ul li:first-child div:after {
        background-position: -420px 0
    }
    .integration-visual-wrap ul li:nth-child(2) div:after {
        background-position: -30px 0px
    }
    .integration-visual-wrap ul li:nth-child(3) div:after {
        background-position: -450px 0
    }
    .integration-visual-wrap ul li:nth-child(4) div:after {
        background-position: -480px 0px
    }
    .integration-visual-wrap ul li:nth-child(6) div:after {
        background-position: -510px 0
    }
    .integration-visual-wrap ul li:nth-child(7) div:after {
        background-position: -60px 0
    }
    .integration-visual-wrap ul li:nth-child(8) div:after {
        background-position: -540px 0
    }
    .integration-visual-wrap ul li:nth-child(9) div:after {
        background-position: -570px 0
    }
    .integration-visual-wrap ul li.zp-main div:after {
        background-size: auto 50px;
    }
.zp-home-chat-wrap .mob-content img, .zp-mobile-apps-wrap .m-apps-poster-wrap img {
    max-width: 400px;
}
}


/*----------Business section-----------*/

.zp-home-business-wrap {
    text-align: center
}

.business-list {
    margin: 60px auto 20px
}

.business-list li {
    display: inline-block;
    padding: 0 25px;
    font-size: 15px;
    margin-bottom: 20px;
}

.business-list li a {
    color: #000;
    padding-bottom: 2px;
    border-bottom: 1px solid transparent;
    font-family: var(--zf-primary-semibold);
    transition: all .5s ease;
    position: relative;
    display: block;
}

.business-list a:before {
    content: '';
    position: absolute;
    left: -50%;
    top: -20px;
    right: -50%;
    margin: auto;
    width: 80px;
    height: 80px;
    background: #f7f7f7;
    border-radius: 100%;
    filter: url;
}

.business-list a:hover:before {
    background: #fff7f9;
}

.business-list span {
    background: url(/sites/default/files/salesiq-home-icons-sprite-2x.png) no-repeat 0 0/auto 40px;
    display: block;
    width: 40px;
    height: 40px;
    margin: 0 auto 30px;
    position: relative;
}

.business-list li:hover a {
    border-bottom: 1px solid #d6003d;
    color: #d6003d;
}

.business-list .b-icon1 {
    background-position: -240px 0;
}

.business-list .b-icon2 {
    background-position: -280px 0;
}

.business-list .b-icon3 {
    background-position: -320px 0;
}

.business-list .b-icon4 {
    background-position: -360px 0;
}

.business-list .b-icon5 {
    background-position: -400px 0;
}

.business-list .b-icon6 {
    background-position: -440px 0;
}

.business-list .b-icon7 {
    background-position: -480px 0;
}

.business-list .b-icon8 {
    background-position: -520px 0;
}

@media only screen and (max-width:1130px) {
    .business-list {
        max-width: 680px;
    }
    .business-list li {
        margin-bottom: 0;
        margin-top: 50px;
        padding: 0 30px;
    }
}

@media only screen and (max-width:767px) {
    .m-apps-poster-wrap img {
        max-width: 100%;
    }
    .business-list {
        max-width: 450px;
    }
    .business-list li {
        width: 50%
    }
}

@media only screen and (max-width:480px) {
    .business-list {
        max-width: 240px;
    }
    .business-list li {
        width: 100%
    }
}

.salesiq-desktop {
    margin: 40px 0 20px;
}

.salesiq-desktop h6 {
    font-family: var(--zf-primary-semibold), Arial, Helvetica, sans-serif;
    margin: 0 0 25px;
}

.salesiq-desktop>a {
    position: relative;
    display: inline-block;
    margin: 0 10px;
    min-width: 50px;
    padding: 50px 0 0;
    text-align: center;
    font-size: 13px;
    color: #000;
}

.salesiq-desktop a:before {
    content: '';
    position: absolute;
    width: 40px;
    height: 40px;
    top: 0;
    left: 0;
    right: 0;
    margin: auto;
    background: url(/sites/default/files/salesiq-home-icons-sprite-2x.png) no-repeat 0 0/auto 40px;
}

.salesiq-desktop .windows:before {
    background-position: -560px 0;
}

.salesiq-desktop .mac:before {
    background-position: -635px 0;
}

.salesiq-desktop .ubuntu:before {
    background-position: -600px 0;
}
.salesiq-desktop .sdk:before {
    background-position: -680px 0;
}

.other-lang .salesiq-desktop, .other-lang .g2-wrap{display:none;}
.lang-ar .holecontainer{
    left: unset;
    right: -24px;
}
.lang-ar .holecontainer p{
    text-align: center;
}