.features-banner-wrap h1 span{display:block}
/*Arabic starts*/

    .i18n-ar .features-banner-content h4,
    .i18n-ar .features-banner-content h1,
    .i18n-ar .features-banner-content h5,
    .i18n-ar .features-banner-content p {
        text-align: center;
    }

    .i18n-ar .feature-l {
        width: 47%;
        float: right;
    }

    .i18n-ar .feature-r {
        width: 47%;
        float: left;
    }

    .i18n-ar .zbase-table li.zp-header span.zp-title {
        padding: 30px 50px 0 10px;
        text-align: right;
    }

    .i18n-ar .zbase-table li span.icon-heading {
        text-align: right;
    }

    .i18n-ar .bottom-cta-wrap .content-wrap.animated {
        text-align: center;
    }
    /*Arabic ends*/

    .content-wrap {
        max-width: 1100px;
    }

    *,
    *:before,
    *:after {
        box-sizing: border-box;
    }

    .features-banner-wrap .content-wrap {
        /*max-width: 100%;
        width: 100%;
        display: flex;
        height: auto;
        align-items: center;
        background: #36e7a3;
        margin-top: 0;*/
    }

    .features-banner-wrap .content-wrap{
    	max-width: 1040px;
    }
    .features-banner-wrap{
    	background: #36e7a3;
    	padding: 100px 0;
    }

    @media only screen and (min-width: 1440px) {
        /*.features-banner-wrap .content-wrap {
            height: 82vh;
        }*/
    }

    .features-banner-wrap {

        text-align: center;
    }

    .features-banner-content {
        padding: 0;
        width: 100%;
    }

    .features-banner-content>* {
        width: 100%;
    }

    .features-banner-wrap h1,
    .features-banner-wrap h5,
    .features-banner-wrap p {
        color: #000;
    }

    .features-banner-wrap h4 {
        color: #000;
        text-transform: uppercase;
        font-family: proxima_nova_rgbold;
        letter-spacing: 2px;
        margin-bottom: 10px;
    }

    .features-banner-wrap h1 {
        font-family: "Roboto Slab";
        max-width: 850px;
        margin: 0px auto 40px;
        font-size: 70px;
        font-weight: 300;
        line-height: 1.2;
    }

    .features-banner-wrap h1 span {
        color: #000;
        font-weight: 700;
    }

    .features-banner-wrap p {
        font-size: 20px;
        margin-bottom: 30px;
    }

    .features-banner-wrap p.below-cta {
        font-size: 16px;
        margin-top: 20px;
        margin-bottom: 0
    }

    .features-banner-content a.act-btn {
        width: auto;
        margin: 50px auto 0;
    }

    .features-banner-wrap h5 {
        font-size: 22px;
        margin-bottom: 10px;
        font-family: proxima_nova_rgregular;
    }

    .feature-l {
        width: 47%;
        float: left;
    }

    .feature-r {
        width: 47%;
        float: right;
    }

    .feature-list-wrap {
        width: 100%;
        display: table;
        max-width: 770px;
        margin: 0 auto;
        padding: 100px 0;
    }

    .feature-item {
        width: 100%;
        display: inline-block;
        background: #fff;
        box-shadow: 0 6px 20px 0px #f5f5f5;
        margin-top: 50px;
        padding: 30px 30px 60px 30px;
        opacity: 0;
        transform: translateY(70px);
        transition: all 0.5s ease-in-out;
    }

    .masonry-animate.feature-item {
        transform: translateY(0px);
        opacity: 1;
    }

    .feature-l h1 {
        font-family: "Roboto Slab";
        font-weight: 700;
        font-size: 55px;
        max-width: 66%;
    }

    .feature-item h4 {
        color: #15c381;
        text-align: center;
        font-size: 28px;
    }

    .feature-item p {
        text-align: center;
        font-size: 18px;
    }

    .f-image img {
        max-width: 60%;
        margin: 0 auto 30px;
        display: block;
    }

    .feature-item a {
        text-align: center;
        margin: 0 auto;
        display: table;
        position: relative;
        font-size: 14px;
        text-transform: uppercase;
    }

    .feature-item a:before,
    .feature-item a:after {
        content: "";
        position: absolute;
        background-color: #03a9f5;
        content: '';
        display: block;
        height: 1px;
        position: absolute;
        top: 12px;
        right: -12px;
        transition: all 0.2s;
        width: 6px;
    }

    .feature-item a:before {
        transform: rotate(40deg);
        transform-origin: top right;
        right: -12px;
        top: 10px;
    }

    .feature-item a:after {
        transform: rotate(-40deg);
    }
    /* zbase table */

    .box-section {
        background: #fafafa;
        padding: 100px 0;
    }

    .box-section h1 {
        text-align: center;
        font-family: "Roboto Slab";
        font-weight: bold;
        font-size: 55px;
    }

    .zbase-table {
        padding: 60px 0;
        margin-bottom: 80px;
        max-width: 900px;
        margin: 0 auto;
    }

    .zbase-table ul {
        /*    border: 1px solid #e6e6e6;*/
    }

    .zbase-table ul li {
        display: flex;
        list-style: outside none none;
        margin: 0;
        padding: 0;
        min-height: 54px;
        width: 100%;
        flex-wrap: wrap;
        background: none;
    }


    .zbase-table li:first-child span {
        font-size: 22px;
    }

    .zbase-table ul li>span {

        box-sizing: border-box;
        color: #000;

        float: none;
        font-size: 16px;
        list-style: outside none none;
        margin: 0;
        padding: 15px 2%;
        position: relative;
        text-align: center;
        vertical-align: middle;
        width: 33.333%;
        z-index: 2;
    }

    .zbase-table ul li>span:before {
        position: absolute;
        width: 69%;
        height: 1px;
        content: "";
        background: #f1f1f1;
        left: 0;
        right: 0;
        margin: auto;
        bottom: 0;
        z-index: 9999;
    }

    .zbase-table ul li span:nth-child(3):after {
        position: absolute;
        top: 0;
        bottom: 0;
        content: '';
        background: #fff;
        width: auto;
        left: 18px;
        right: 18px;
        border-left: 1px solid #f1f1f1;
        border-right: 1px solid #f1f1f1;
    }

    .zbase-table ul li:first-child>span:before {
        display: none;
    }

    .zbase-table ul li>span.icon-heading {
        font-size: 18px;
        padding: 10px 50px;
    }



    .zbase-table ul li span:nth-child(3) {

        padding: 0px 2%;
    }

    .zbase-table li span.icon-heading {
        text-align: left;
    }

    .zbase-table li span:nth-child(2) {

        background: none repeat scroll 0 0 #fff;
        display: inline-block;
        padding: 30px;
        position: relative;
        border-left: 0px solid #f1f1f1;
        border-right: 0px solid #f1f1f1;
        position: relative;
        z-index: 99;
        background: #36e7a3;
    }

    .zbase-table li span:nth-child(2) span {
        color: #fed500;
    }

    .zbase-table li span:nth-child(3) {
        background: none
    }

    .zbase-table li span:nth-child(3) span {

        z-index: 999;
    }


    .zbase-table li span:nth-child(2)::before {
        position: absolute;
        width: 80%;
        height: 1px;
        content: "";
        background: #28d995;
        left: 0;
        right: 0;
        margin: auto;
        bottom: 0;
    }


    .zbase-table li:last-child span:nth-child(4):after {
        top: auto;
        bottom: -30px;

        box-shadow: 0px 26px 73px 0px rgba(0, 0, 0, 0.32);
        -webkit-box-shadow: 0px 26px 73px 0px rgba(0, 0, 0, 0.32);
    }

    .zbase-table ul li.last-child span {
        padding-bottom: 30px;
    }




    .zbase-table ul li.last-child span.icon-heading:before {
        display: none;
    }

    .zbase-table ul li.last-child span:nth-child(3) {
        padding-bottom: 0;
    }

    .zbase-table ul li.last-child span:nth-child(3):before {
        width: 88%;
    }

    .zbase-table li span.company-logo.logo1:before {
        content: '';
        background-image: url(/sites/default/files/workplace/wp-sprites.png);
        background-repeat: no-repeat;
        background-size: 760px auto;
        width: 226px;
        height: 60px;
        display: block;
        top: 30px;
        margin: 0 auto;
        background-position: -361px;
        background-color: transparent;
    }

    .zbase-table li span.company-logo.logo2 span {
        position: absolute;
        left: 6%;
        right: 6%;
        width: auto;
        top: 0px;
        border-top: 1px solid #f1f1f1;
    }

    .zbase-table li:first-child span:nth-child(3) {
        padding: 60px 10px;
    }

    .zbase-table li:first-child span:nth-child(2) {
        padding: 43px 0;
    }

    .zbase-table li span.company-logo.logo2 span:before {
        content: '';
        background-image: url(/sites/default/files/workplace/wp-sprites.png);
        background-repeat: no-repeat;
        background-size: 760px auto;
        width: 116px;
        height: 60px;
        display: block;
        background-position: -235px;
        margin: 20px auto;
        background-color: transparent;
    }

    .bottom-cta-wrap {
        background: #000;
    }

    .bottom-cta-wrap .content-wrap h2 {
        color: #fff;
        font-family: Roboto Slab;
        font-weight: 600;
        font-size: 55px;
        text-align: center;
        margin-bottom: 20px;
        max-width: 810px;
    }

    .bottom-cta-wrap .content-wrap h2 span {
        color: #36e7a3;
    }


    .bottom-cta-wrap .content-wrap {
        padding: 100px 0;
    }

    .zcircle-tick {
        height: 22px;
        width: 22px;
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        margin: auto;
    }

    .zcircle-tick:after,
    .zcircle-tick:before {
        background: #156d4c none repeat scroll 0 0;
        content: "";
        height: 3px;
        left: 4px;
        position: absolute;
        top: 13px;
        transform: rotate(45deg);
        width: 7px;
    }

    .zcircle-tick:before {
        left: 6px;
        top: 10px;
        transform: rotate(-50deg);
        width: 15px;
    }

    .zbase-table li span:nth-child(3) span.zcircle-tick:after,
    .zbase-table li span:nth-child(3) span.zcircle-tick:before {
        background: #00933c none repeat scroll 0 0;
        height: 3px;
        left: 9px;
        position: absolute;
        top: 12px;
        transform: rotate(45deg);
        width: 7px;
    }

    .zbase-table li span:nth-child(3) span.zcircle-tick:before {
        left: 11px;
        top: 9px;
        transform: rotate(-52deg);
        width: 15px;
    }

    .zcircle-tick {
        height: 22px;
        width: 22px;
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        margin: auto;
    }

    .zcircle-cross {
        height: 22px;
        width: 22px;
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        margin: auto;
    }

    .zcircle-cross:after,
    .zcircle-cross:before {
        background: #ff3231 none repeat scroll 0 0;
        content: "";
        height: 3px;
        left: 49%;
        position: absolute;
        top: 12px;
        transform: rotate(45deg);
        width: 15px;
    }


    .zcircle-cross:before {
        transform: rotate(-52deg);
        width: 15px;
    }

    .footer_left {
        padding: 0 50px;
        width: 100%;
        text-align: left;
    }

    .footer-right {
        width: 50%;
    }

    .footer-cta-wrap {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
    }

    .bottom-cta-wrap .content-wrap {
        max-width: 1000px;
    }

    .bottom-cta-wrap .button {
        display: none;
    }

    a.download-pdf {
        text-align: center;
        display: block;
        padding: 0 30px;
        font-size: 20px;
    }

    .bot-banner-wrap .button {
        margin-bottom: 100px;
        display: none;
    }



    .umain .bottom-cta-wrap .button {
        display: inline-block;
    }

    .umain .footer_left {
        width: 100%;
        margin-bottom: 20px;
        text-align: center;
    }

    .bottom-cta-wrap .content-wrap {
        padding: 100px 0;
    }
    /*signup form styles end*/

    .zp-header.fixed {
        position: fixed;
        max-width: 900px;
        top: 52px;
        margin: 0 auto;
        z-index: 100;
    }

    .zp-header.fixed span:first-child {
        background: #fff;
        box-shadow: 0px 1px 4px 0px #0000000a;
    }

    .zbase-table li.zp-header.fixed span:nth-child(2),
    .zbase-table li.zp-header.fixed span.company-logo.logo2 span {
        box-shadow: 0px 1px 4px 0px #0000000a;
    }

    .zbase-table li.zp-header span.zp-title {
        padding: 30px 10px 0 50px;
        font-size: 24px;
        text-align: left;
        font-weight: bold;
        background: #fafafa;
    }

    .zbase-table li.zp-header.fixed span.company-logo.logo2 span {
        height: 100%;
    }

    .zbase-table li.zp-header.fixed span:nth-child(3) {
        padding: 45px 10px;
    }

    .zbase-table li.zp-header.fixed span:nth-child(2) {
        padding: 35px 0;
    }

    .zbase-table li.zp-header.fixed span.company-logo.logo1:before {
        top: 20px;
    }

    /*new changes*/
    .header-banner {
	    display: table;
	    width: 100%;
	}

	.header-banner > div {
	    display: table-cell;
	    width: 50%;
	    vertical-align: middle;
	}


	.features-banner-content.left {
	    text-align: left;
	    padding-right: 50px;
	}

	.features-banner-wrap h4 {
		font: 22px/1.4 proxima_novasemibold;
		letter-spacing: 0;
		margin-bottom: 30px;
	}

	.features-banner-wrap h1 {
	    font-size: 64px;
	    margin: 0px auto 40px;
	}

	.features-banner-content a.act-btn {
	    margin: 25px auto 0;
	}

	.features-banner-wrap p.below-cta {
	    margin-bottom: 20px;
	}
	.features-banner-wrap .save-up-to{
		font-size: 24px;
	    font-family: "Roboto Slab";
	    font-weight: 300;
	    max-width: 380px;
	    letter-spacing: 0;
	    padding-top: 90px;
	    text-transform: inherit;
	    margin-bottom: 0;
	}
	.save-up-to span {
	    font-weight: 600;
	}

    /*calculate*/
    .calculate-section {
	    background: #ffffff;
	    padding: 50px 60px 40px 60px;
	    vertical-align: top;
    -webkit-box-shadow: 0px 5px 20px 3px rgba(153, 153, 153, 0.5);
    -moz-box-shadow: 0px 5px 20px 3px rgba(153, 153, 153, 0.5);
    box-shadow: 0px 5px 20px 3px rgba(153, 153, 153, 0.5)
	}
    .calculate>div {
            display: block;
    float: none;
    }

    .count {
        float: left;
    }

    .calc-btn {
        float: right;
    }

    .calculate {
        float: left;
    width: 100%;
    display: inline-block;
    margin-bottom: 30px;
    text-align: center;
    margin-bottom: 200px;
    }

    .count label {
        font-size: 18px;
    display: inline-block;
    margin-right: 10px;
    position: relative;
    top: -3px;
    font-weight: 600;
    }

    .count input[type="number"] {
        width: 90px;
        border: 1px solid #dadada;
        height: 35px;
        text-align: center;
        font-size: 20px;
        font-weight: 700;
        padding: 1px 10px;
        box-sizing: border-box;
    }

    .count input::-webkit-outer-spin-button,
    .count input::-webkit-inner-spin-button {
        -webkit-appearance: none;
        margin: 0;
    }

    .count input[type=number] {
        -moz-appearance: textfield;
    }

    .calc-btn {
        background: transparent;
        border: 1px solid #000;
        font-size: 16px;
        height: 28px;
        padding: 2px 15px;
        cursor: pointer;
    }

    .calculate .toggle-button {
        float: right;
        /*margin-right: 30px;*/
display:none;
    }

    .toggle-button label span {
        position: absolute;
    }

    .toggle-button span {
        font-weight: 600;
        font-size: 16px;
    }

    .toggle-button label {
        display: inline-block;
        width: 40px;
        height: 22px;
        border: 1px solid #dfdfdf;
        -webkit-border-radius: 10px;
        -moz-border-radius: 10px;
        border-radius: 15px;
        position: relative;
        top: 6px;
        margin: 0 5px;
        background: #dfdfdf;
        cursor: pointer;
    }

    .toggle-button label::before {
        content: '';
        width: 18px;
        height: 18px;
        -webkit-border-radius: 10px;
        -moz-border-radius: 10px;
        border-radius: 10px;
        background-color: #1877d1;
        position: absolute;
        left: 3px;
        transition: all 0.1s linear;
        top: 1px;
    }

    .toggle-button input[type=checkbox] {
        position: absolute;
        top: -99999px;
        opacity: 0;
    }

    .toggle-button input[type=checkbox]:checked+label::before {
        left: calc(100% - 20px);
    }

    .progress-bar {
        width: 100%;
        display: table;
    }

    .bar-wrap {
        height: 280px;
        position: relative;
    }

    .bar {
        transition: height 0.5s ease;
        background: #737373;
        height: 10%;
        position: absolute;
        bottom: 0;
        width: 60px;
        left: 0;
        right: 0;
        margin: auto;
    }

    .zoho-bar {
        background: #14c380;
    }

    .bar-wrap {
        height: 280px;
        position: relative;
        margin-bottom: 20px;
    }

    .progress-bar .progress {
        display: table-cell;
        vertical-align: bottom;
        width: 50%;
    }

    .price {
        position: absolute;
        left: auto;
        right: auto;
        top: -40px;
        z-index: 11;
        font-weight: 600;
        font-size: 30px;
        line-height: normal;
        -ms-transform: translateX(-50%);
        transform: translateX(-50%);
        font-family: "Roboto Slab";
        line-height: 1;
    }

    .logos {
        height: 30px;
    }

    .progress.left .logos {
        max-width: 170px;
        margin: 0 auto;
        box-sizing: border-box;
    }

    .progress.left .logos img {
        padding-top: 3px;
        max-width: 160px;
    }

    .progress.right .price {
        font-size: 40px;
        top: -55px;
    }

    .progress.right .logos img {
        max-height: 25px;
        padding-top: 3px;
    }

    .calculate-section .price-effective {
        display: block;
        text-align: left;
        font-size: 16px;
        margin-top: 50px;
        margin-bottom: 0;
        padding-left: 15px;
        position: relative;
    }

    .calculate-section .price-effective:before {
        content: '';
        position: absolute;
        width: 20px;
        height: 20px;
        background: #e3736f;
        left: -15px;
        top: 1px;
    }

    .google-bar:before {
        content: '';
        position: absolute;
        height: 20%;
        background: #e3736f;
        top: 0;
        z-index: 1;
        width: 100%;
        left: 0;
        transition: height 0.5s ease;
    }

    .range-button {
        cursor: pointer;
    }

    .disabled {
        color: #b0b0b0;
    }

    .price-range.active:before {
        left: 18px;
    }

    .price i {
        font-style: inherit;
    }

    .column-wrap .column.left .logos {
        position: relative;
        font-size: 26px;
        color: #000;
        font-weight: 600;
        line-height: normal;
        margin-bottom: 50px;
        font-family: proxima_novasemibold;
    }

    .column-wrap .column.left .zoho-logo {
        width: 90px;
        height: 31px;
        background: url(https://www.zohowebstatic.com/sites/default/files/zoho-logo-zh-2x.png) no-repeat 0 0/auto 30px;
        display: inline-block;
        position: relative;
        top: 4px;
    }

    .two-column .two-column-content:nth-child(3),
    .two-column .two-column-content:nth-child(4) {
        margin-bottom: 100px;
    }

    /*calculate end*/

    @media only screen and (max-width: 1441px) {
        .features-banner-wrap h1 {

            max-width: 710px;

            font-size: 60px;
        }
        .features-banner-wrap h5 {
            font-size: 22px;
        }
    }

    @media only screen and (max-width: 1439px) {
        .features-banner-content {
            padding: 100px;
        }
    }

    @media only screen and (max-width: 990px) {
        .feature-list-wrap {
            width: 90%;
        }
        .feature-l h1 {
            font-size: 40px;
        }


        .zbase-table {
            min-width: 750px;
        }
        .features-banner-wrap .content-wrap {
            height: auto;
        }
    }

    @media only screen and (max-width: 991px) {
    	.features-banner-content.left {
		    text-align: center;
		    padding: 0px;
		}
		.header-banner > div {
		    display: block;
		    width: 100%;
		}
		.features-banner-wrap .save-up-to {
		    margin: 0 auto;
		    padding-top: 20px;
		}
		.features-banner-content{
			padding: 0;
		}
		.calculate-section {
		    box-sizing: border-box;
		    max-width: 500px;
		    margin: 0 auto;
		    margin-top: 60px;
		}
    }

    @media only screen and (max-width: 767px) {
        .feature-l,
        .feature-r {
            width: 100%;
        }
        .feature-item {
            opacity: 1;
        }
        .features-banner-content {
            padding: 70px 30px;
        }
        .maincontainer {
            overflow: scroll;
        }
        .bottom-cta-wrap .content-wrap h2 {
            font-size: 30px;
        }
        .features-banner-wrap h1 {
            font-size: 42px;
            font-weight: 300;
            line-height: 49px;
        }
        .features-banner-wrap h5 {
            font-size: 25px;
            margin-bottom: 0px;
            line-height: 1.3;
        }
        .box-section h1 {
            font-size: 30px;
        }
        .footer-cta-wrap {

            max-width: 400px;
            margin: 0 auto;
        }
        .zbase-table {
            min-width: 350px;
        }
        .zbase-table ul li>span.icon-heading {
            padding: 10px;
        }
    }

    @media only screen and (max-width: 480px) {
        .footer_left,
        .footer-right {
            width: 100%;
        }
        .footer_left {
            margin-bottom: 50px;
        }
        .zbase-table li.zp-header span.zp-title,
        .zbase-table ul li>span.icon-heading {
            width: 40%;
        }
        .zbase-table li span:nth-child(2) {
            width: 26%;
        }
        .zbase-table li span:nth-child(3) {
            width: 34%;
        }
        .zbase-table li span.company-logo.logo1:before {
            background-size: 430px auto;
            width: 47px;
            background-position: 2px;
        }
        .zbase-table li span.company-logo.logo2 span:before {
            width: 66px;
            BACKGROUND-SIZE: 410px auto;
            background-position: -124px;
        }
        .zbase-table ul li>span.icon-heading {
            font-size: 16px
        }
        .zcircle-tick {
            width: 25px;
        }
        .zcircle-cross:after,
        .zcircle-cross:before {
            left: 37%;
        }
        /*bar*/
        .header-banner .para {
            font-size: 24px;
        }
        .grid-wrap .column-wrap .column:last-child {
            width: 50%;
        }
    }


    .signup-box {
        background: #fff;
        padding: 20px;
        max-width: 400px;
    }

    .signup-box * {
        box-sizing: border-box
    }

    .signup-box form>div {
        position: relative
    }

    .signup-form {
        max-width: 365px;
        margin: 0 0 0 auto;
        min-height: 410px
    }

    .signup-heading {
        text-transform: uppercase;
        font-size: 16px;
        color: #000;
        font-weight: 600
    }

    .za-newsletter-container {
        margin-top: 10px;
        padding-left: 15px;
        position: relative
    }

    .signup-box input,
    form .za-country-container .globalcountrycode-signup {
        color: #000;
        padding: 14px 12px;
        border: none;
        display: block;
        width: 100%;
        margin: 15px 0 0;
        font-size: 14px;
        background: #fff;
        appearance: none;
        -webkit-appearance: none;
        -moz-appearance: none;
        position: relative;
        z-index: 1;
        transition: .5s ease;
        border-radius: 0;
        border: 1px solid #efefef;
    }

    form .za-country-container .globalcountrycode-signup {
        background: 0 0 !important
    }

    form .za-country-container {
        position: relative;
        background: #fff
    }

    form .za-country-container.za-country-container-arrow::after {
        width: 0;
        height: 0;
        border-left: 8px solid transparent;
        border-right: 8px solid transparent;
        border-top: 8px solid #666;
        position: absolute;
        right: 12px;
        top: 20px;
        content: "";
        display: block
    }

    .signup-box input[type=password]:focus,
    .signup-box input[type=text]:focus,
    form .za-country-container .globalcountrycode-signup:focus {
        border-color: #03a9f5
    }

    .za-tos-container .field-msg {
        margin-top: 12px
    }

    .za-captcha-container .za-captcha {
        margin-top: 5px
    }

    .za-refresh-captcha {
        height: 30px;
        width: 30px;
        display: inline-block;
        background: url(/sites/default/files/captcha-reload.png) no-repeat #fff;
        margin-left: 5px;
        cursor: pointer
    }

    .field-error .field-msg {
        display: block
    }

    .sign_agree.field-error {
        margin-bottom: 25px
    }

    .phone-field #country_code,
    .phone-field .downarrow {
        position: absolute;
        top: 13px;
        left: 12px;
        pointer-events: none;
        font-size: 12px
    }

    .phone-field .downarrow {
        top: 20px;
        left: 55px;
        width: 0;
        height: 0;
        border-top: 6px solid #000;
        border-right: 6px solid transparent;
        border-left: 6px solid transparent
    }

    .phone-field .za_country_code {
        width: 70px;
        position: absolute;
        top: 0;
        left: 0;
        opacity: 0;
        height: 50px;
        z-index: 9999;
        cursor: pointer
    }

    .phone-field input.phoneno-field {
        padding-left: 75px;
        margin-bottom: 10px
    }

    .signup-box .error,
    .za-email-suggestion .za-domain-error {
        color: red;
        font-size: 12px;
        line-height: 1.5
    }

    .za-email-container a {
        color: #000;
        text-decoration: underline;
        margin-left: 5px
    }

    .signup-box form>.field-msg {
        position: relative;
        bottom: auto;
        left: auto;
        margin-bottom: 10px
    }

    .signup-box .za-captcha-container+p {
        margin: 0
    }

    .signup-box .sign_agree {
        font-size: 12px;
        display: inline-block;
        line-height: 1.4;
        color: #333
    }

    .signup-box .sign_agree a {
        color: #333;
        text-decoration: underline
    }

    .sgnbtn input[type=submit] {
        font-size: 16px;
        line-height: 45px;
        padding: 0 60px;
        background: #f0483e;
        text-align: center;
        text-transform: uppercase;
        border: 0;
        color: #fff;
        width: 100%;
        cursor: pointer;
        font-weight: 600;
        appearance: none;
        -webkit-appearance: none;
        -moz-appearance: none
    }

    .signup-box .password-strength {
        overflow: hidden;
        position: absolute;
        left: 0;
        bottom: -7px
    }

    .password-strength div {
        background: #fe0000;
        height: 5px;
        width: 0
    }

    .get-signup-plan {
        margin: 10px 0
    }

    .get-signup-plan input[type=radio] {
        margin: 0 5px 0 2px;
        border: none;
        position: relative;
        vertical-align: middle;
        width: 16px;
        background: 0 0;
        padding: 0;
        display: inline-block;
        height: 16px;
        line-height: 16px
    }

    .get-signup-plan input[type=radio]:before {
        content: '';
        position: absolute;
        width: 16px;
        height: 16px;
        background: #fff;
        border: 1px solid #666;
        left: -2px;
        top: -2px;
        border-radius: 100%;
        pointer-events: none
    }

    .get-signup-plan input[type=radio]:after {
        content: '';
        position: absolute;
        width: 6px;
        height: 6px;
        background: #fff;
        left: 3px;
        top: 3px;
        border-radius: 100%;
        pointer-events: none
    }

    .get-signup-plan input[type=radio].zactive:after,
    .get-signup-plan input[type=radio]:checked:after {
        background: #666
    }

    .get-signup-plan label {
        margin: 0 20px 0 0;
        font-size: 14px;
        position: relative;
        top: -1px;
        cursor: pointer
    }

    .personal-email {
        display: none;
    }

    .business-email+form+.socl-signup {
        display: none
    }
    /*******Mobile number Select with Country Code******/

    .za-country_code-container,
    .za-remobile-container {
        position: relative;
        margin: 15px 0 25px;
    }

    .ccodelabelimg {
        display: none;
    }

    .za-country_code-container select,
    .za-remobile-container select {
        opacity: 0;
        width: 80px;
        height: 45px;
        border: none;
        border-radius: 0;
        -webkit-appearance: none;
        -moz-appearance: none;
        padding: 10px;
        line-height: 25px;
        background: #fff;
        text-indent: -99999px;
        cursor: pointer
    }

    #countryCodeDiv,
    #countryconfirmCodeDiv {
        background-color: #fff;
        width: 80px;
        position: absolute;
        left: 0;
        top: 0;
        box-sizing: border-box;
        line-height: 25px;
        padding: 10px 0 10px 10px;
        font-size: 14px;
        color: #666;
        pointer-events: none
    }

    #countryCodeDiv:before,
    #countryconfirmCodeDiv:before {
        position: absolute;
        content: '';
        left: 60px;
        top: 18px;
        width: 0;
        height: 0;
        border-left: 6px solid transparent;
        border-right: 6px solid transparent;
        border-top: 8px solid #efefef
    }

    .za-country_code-container input,
    .za-remobile-container input {
        position: absolute;
        left: 80px;
        top: 0;
        margin-top: 0;
        width: 280px;
    }

    .personal-email {
        display: none;
    }

    .business-email p {
        font-size: 14px
    }

    .za-username-container {
        position: relative
    }

    .za-username-container input {
        padding-right: 100px
    }

    label#defdomdiv {
        position: absolute;
        top: 0;
        right: 10px;
        z-index: 1;
        padding: 10px 0;
        line-height: 25px;
        font-size: 14px;
        color: #666
    }

    .two-col-input {
        overflow: hidden
    }

    .two-col-input .sgfrm {
        display: inline-block;
        width: 49%;
        float: left
    }

    .two-col-input .sgfrm:first-child {
        margin-right: 2%
    }

    .two-col-input .sgfrm .field-msg {
        bottom: 5px
    }
    /*******Mobile number Select with Country Code******/

    @media only screen and (max-width:991px) {
        .signup-form {
            margin: 60px auto 0;
            padding: 30px;
            max-width: 500px;
            background: rgba(255, 235, 235, .57);
            border-radius: 5px
        }
        .bottom-cta-wrap .content-wrap h2 {
            font-size: 40px;
        }
        .footer_left {
            width: 45%;
            padding: 0 30px
        }
        .signup-box {
            width: 350px;
        }
        .za-country_code-container input,
        .za-remobile-container input {
            width: 230px;
        }
        .signup-box {
            float: right;
        }
    }


    @media only screen and (max-width:768px) {
        .zbase-table li.zp-header span.zp-title {
            padding-left: 10px;
        }
        .signup-box {
            display: table;
            margin: 0 auto;
        }
        .footer-right {
            width: 100%;
        }
        .footer_left {
            padding: 0 30px;
            width: 100%;
            text-align: center;
            margin-bottom: 40px;
        }
    }

    @media only screen and (max-width:767px) {
    	/*bar*/
        .header-banner .para {
            font-size: 26px;
        }

        .column-wrap .column.left h4 {
            font-size: 20px;
            padding-top: 25px;
        }

        .header-banner .column-wrap .column.right {
            padding: 35px 20px;
        }

        .calculate>div {
            display: block;
            text-align: center;
            float: none;
        }

        .calculate .toggle-button {
            float: none;
            margin-right: 0;
            margin-top: 20px;
        }

        .bar {
            width: 40px;
        }

        .progress.left .logos img {
            max-width: 110px;
        }

        .progress.right .logos img {
            max-height: 15px;
        }

        .progress.right .price {
            font-size: 30px;
            top: -45px;
        }

        span.price {
            font-size: 22px;
            top: -35px;
        }

        .header-banner p {
            padding-left: 35px;
            font-size: 16px;
        }

        .price-effective:before {
            left: 0px;
        }
        .price-effective {
            margin-top: 25px;
        }

        .header-banner .para {
            padding: 0;
            margin-bottom: 20px;
        }
        .workplace {
            margin: 0;
        }
        .grid-wrap .column-wrap .column:last-child {
            width: 100%;
        }
        .column-wrap .column.left .logos {
            margin-bottom: 25px;
            font-size: 22px;
        }
        .header-banner > div{
        	padding: 0;
        }
        .features-banner-content.right{
        	padding: 0;
        }
        .calculate-section{
        	padding: 35px 20px
        }

        .calculate-section .price-effective {
		    padding-left: 35px;
		    font-size: 16px;
		}
		.calculate-section .price-effective:before {
		    left: 0px;
		}
		.calculate-section .price-effective {
		    margin-top: 25px;
		}
		.features-banner-wrap {
		    background: #36e7a3;
		    padding: 50px 0;
		}
		.features-banner-wrap h1{
			font-size: 38px;
		}
		.act-btn {
		    padding: 10px 10px;
		}
    }

    @media only screen and (max-width:375px) {
        .za-country_code-container input,
        .za-remobile-container input {
            width: 200px;
        }
        .signup-box {
            width: 320px;
        }
    }