@charset "utf-8";
/* CSS Document for Feature Details Layout */


p {
	margin: 0 0 1em 0;
	padding: 0px !important;
	text-align: justify;
	letter-spacing: normal;
}

.features h1 {
	color: #000;
	font-size: 35px;
	font-weight: 500;
	padding-bottom: 20px;
}
.features h2 {
    background: #2f96e9;
    background: -moz-linear-gradient(-45deg, #2f96e9 0, #30cfc3 35%);
    background: -webkit-linear-gradient(-45deg, #2f96e9 0, #30cfc3 35%);
    background: linear-gradient(135deg, #2f96e9 0, #30cfc3 35%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    line-height: normal;
	font-size: 35px;
	font-weight: 700;
}
.features h5 {
	color: #fff;
    font-size: 35px;
    font-weight: 600;
    margin: 0px;
    padding: 0 0 25px;
}
.features h6 {
	color: #000;
	font-size: 35px;
	font-weight: 500;
	padding-bottom: 70px;
	margin: 0;
    letter-spacing: 0.3px;
    line-height: 1.4em;
	text-transform: none;
}

.text-left {text-align: left !important}
.text-right {text-align: right !important}
.text-justify {text-align: justify !important}

.d-block {display: block!important}
.d-inline {display: inline!important}
.d-inline-block {display: inline-block!important}
.d-none {display: none!important}

.m-0 {margin: 0px!important}
.mt-0 {margin-top: 0px!important} 		.mr-0 {margin-right: 0px!important} 	.mb-0 {margin-bottom: 0px!important} 	.ml-0 {margin-left: 0px!important}
.mt-5 {margin-top: 5px!important} 		.mr-5 {margin-right: 5px!important} 	.mb-5 {margin-bottom: 5px!important} 	.ml-5 {margin-left: 5px!important}
.mt-10 {margin-top: 10px!important} 	.mr-10 {margin-right: 10px!important} 	.mb-10 {margin-bottom: 10px!important} 	.ml-10 {margin-left: 10px!important}
.mt-15 {margin-top: 15px!important} 	.mr-15 {margin-right: 15px!important} 	.mb-15 {margin-bottom: 15px!important} 	.ml-15 {margin-left: 15px!important}
.mt-20 {margin-top: 20px!important} 	.mr-20 {margin-right: 20px!important} 	.mb-20 {margin-bottom: 20px!important} 	.ml-20 {margin-left: 20px!important}
.mt-25 {margin-top: 25px!important} 	.mr-25 {margin-right: 25px!important} 	.mb-25 {margin-bottom: 25px!important} 	.ml-25 {margin-left: 25px!important}
.mt-30 {margin-top: 30px!important} 	.mr-30 {margin-right: 30px!important} 	.mb-30 {margin-bottom: 30px!important} 	.ml-30 {margin-left: 30px!important}
.mt-35 {margin-top: 35px!important} 	.mr-35 {margin-right: 35px!important} 	.mb-35 {margin-bottom: 35px!important} 	.ml-35 {margin-left: 35px!important}
.mt-40 {margin-top: 40px!important} 	.mr-40 {margin-right: 40px!important} 	.mb-40 {margin-bottom: 40px!important} 	.ml-40 {margin-left: 40px!important}
.mt-45 {margin-top: 45px!important} 	.mr-45 {margin-right: 45px!important} 	.mb-45 {margin-bottom: 45px!important} 	.ml-45 {margin-left: 45px!important}
.mt-50 {margin-top: 50px!important} 	.mr-50 {margin-right: 50px!important} 	.mb-50 {margin-bottom: 50px!important} 	.ml-50 {margin-left: 50px!important}

.p-0 {padding: 0px!important}
.pt-0 {padding-top: 0px!important} 		.pr-0 {padding-right: 0px!important} 	.pb-0 {padding-bottom: 0px!important} 	.pl-0 {padding-left: 0px!important}
.pt-5 {padding-top: 5px!important} 		.pr-5 {padding-right: 5px!important} 	.pb-5 {padding-bottom: 5px!important} 	.pl-5 {padding-left: 5px!important}
.pt-10 {padding-top: 10px!important} 	.pr-10 {padding-right: 10px!important} 	.pb-10 {padding-bottom: 10px!important} .pl-10 {padding-left: 10px!important}
.pt-15 {padding-top: 15px!important} 	.pr-15 {padding-right: 15px!important} 	.pb-15 {padding-bottom: 15px!important} .pl-15 {padding-left: 15px!important}
.pt-20 {padding-top: 20px!important} 	.pr-20 {padding-right: 20px!important} 	.pb-20 {padding-bottom: 20px!important} .pl-20 {padding-left: 20px!important}
.pt-25 {padding-top: 25px!important} 	.pr-25 {padding-right: 25px!important} 	.pb-25 {padding-bottom: 25px!important} .pl-25 {padding-left: 25px!important}
.pt-30 {padding-top: 30px!important} 	.pr-30 {padding-right: 30px!important} 	.pb-30 {padding-bottom: 30px!important} .pl-30 {padding-left: 30px!important}
.pt-35 {padding-top: 35px!important} 	.pr-35 {padding-right: 35px!important} 	.pb-35 {padding-bottom: 35px!important} .pl-35 {padding-left: 35px!important}
.pt-40 {padding-top: 40px!important} 	.pr-40 {padding-right: 40px!important} 	.pb-40 {padding-bottom: 40px!important} .pl-40 {padding-left: 40px!important}
.pt-45 {padding-top: 45px!important} 	.pr-45 {padding-right: 45px!important} 	.pb-45 {padding-bottom: 45px!important} .pl-45 {padding-left: 45px!important}
.pt-50 {padding-top: 50px!important} 	.pr-50 {padding-right: 50px!important} 	.pb-50 {padding-bottom: 50px!important} .pl-50 {padding-left: 50px!important}

.desktop-version {display: block}
.mobile-version {display: none}

/*banner*/
.feature-header,
.feature-header_sales,
.feature-header_marketing,
.feature-header_service,
.feature-header_billing,
.feature-header_collaboration,
.feature-header_platform {
	background-repeat: repeat-y;
	color: #fff;
	text-align: center
}
.feature-header {
	background-color: #2f96e9;
	background: url(../images/feature_salea-banner_bg.png), -webkit-gradient(linear, left top, right top, from(#2f96e9), to(#30cfc3));
	background: url(../images/feature_salea-banner_bg.png), -webkit-linear-gradient(left, #2f96e9, #30cfc3);
	background: url(../images/feature_salea-banner_bg.png), -moz-linear-gradient(left, #2f96e9, #30cfc3);
	background: url(../images/feature_salea-banner_bg.png), -ms-linear-gradient(left, #2f96e9, #30cfc3);
	background: url(../images/feature_salea-banner_bg.png), -o-linear-gradient(left, #2f96e9, #30cfc3);
}
.feature-header.sales {
	background-color: #31cd56;
	background: url(../images/feature_salea-banner_bg.png), -webkit-gradient(linear, left top, right top, from(#33c7b7), to(#31cd56));
	background: url(../images/feature_salea-banner_bg.png), -webkit-linear-gradient(left, #31cd56, #33c7b7);
	background: url(../images/feature_salea-banner_bg.png), -moz-linear-gradient(left, #31cd56, #33c7b7);
	background: url(../images/feature_salea-banner_bg.png), -ms-linear-gradient(left, #31cd56, #33c7b7);
	background: url(../images/feature_salea-banner_bg.png), -o-linear-gradient(left, #31cd56, #33c7b7);
}
.feature-header.marketing {
	background-color: #059eae;
	background: url(../images/feature_salea-banner_bg.png), -webkit-gradient(linear, left top, right top, from(#48c792), to(#059eae));
	background: url(../images/feature_salea-banner_bg.png), -webkit-linear-gradient(left, #059eae, #48c792);
	background: url(../images/feature_salea-banner_bg.png), -moz-linear-gradient(left, #059eae, #48c792);
	background: url(../images/feature_salea-banner_bg.png), -ms-linear-gradient(left, #059eae, #48c792);
	background: url(../images/feature_salea-banner_bg.png), -o-linear-gradient(left, #059eae, #48c792);
}
.feature-header_service {
	background-color: #f08f31;
	background: url(../images/feature_salea-banner_bg.png), -webkit-gradient(linear, left top, right top, from(#f1d23c), to(#f08f31));
	background: url(../images/feature_salea-banner_bg.png), -webkit-linear-gradient(left, #f08f31, #f1d23c);
	background: url(../images/feature_salea-banner_bg.png), -moz-linear-gradient(left, #f08f31, #f1d23c);
	background: url(../images/feature_salea-banner_bg.png), -ms-linear-gradient(left, #f08f31, #f1d23c);
	background: url(../images/feature_salea-banner_bg.png), -o-linear-gradient(left, #f08f31, #f1d23c);
}
.feature-header.billing {
	background-color: #112e7a;
	background: url(../images/feature_salea-banner_bg.png), -webkit-gradient(linear, left top, right top, from(#3a90d9), to(#112e7a));
	background: url(../images/feature_salea-banner_bg.png), -webkit-linear-gradient(left, #112e7a, #3a90d9);
	background: url(../images/feature_salea-banner_bg.png), -moz-linear-gradient(left, #112e7a, #3a90d9);
	background: url(../images/feature_salea-banner_bg.png), -ms-linear-gradient(left, #112e7a, #3a90d9);
	background: url(../images/feature_salea-banner_bg.png), -o-linear-gradient(left, #112e7a, #3a90d9);
}
.feature-header.collaboration {
	background-color: #ec3a4a;
	background: url(../images/feature_salea-banner_bg.png), -webkit-gradient(linear, left top, right top, from(#fe835a), to(#ec3a4a));
	background: url(../images/feature_salea-banner_bg.png), -webkit-linear-gradient(left, #ec3a4a, #fe835a);
	background: url(../images/feature_salea-banner_bg.png), -moz-linear-gradient(left, #ec3a4a, #fe835a);
	background: url(../images/feature_salea-banner_bg.png), -ms-linear-gradient(left, #ec3a4a, #fe835a);
	background: url(../images/feature_salea-banner_bg.png), -o-linear-gradient(left, #ec3a4a, #fe835a);
}
.feature-header.platform {
	background-color: #7e2e87;
	background: url(../images/feature_salea-banner_bg.png), -webkit-gradient(linear, left top, right top, from(#c4348b), to(#7e2e87));
	background: url(../images/feature_salea-banner_bg.png), -webkit-linear-gradient(left, #7e2e87, #c4348b);
	background: url(../images/feature_salea-banner_bg.png), -moz-linear-gradient(left, #7e2e87, #c4348b);
	background: url(../images/feature_salea-banner_bg.png), -ms-linear-gradient(left, #7e2e87, #c4348b);
	background: url(../images/feature_salea-banner_bg.png), -o-linear-gradient(left, #7e2e87, #c4348b);
}
.feature-header-heading {
  font-size: 22px;
  margin-bottom: 12px;
  text-transform: uppercase
}
.feature-subheader {
  font-size: 35px
}
.banner .homeFreetrial li {
  color: #fff
}
.banner .homeFreetrial li::before {
  background-color: #fff
}


/*LIST*/
.feature_section ul.list {
  margin-left: 20px;
  margin-bottom: 15px
}
.feature_section ul.list li {
  color: #555;
  font-size: 17px;
  list-style: disc;
  line-height: 1.7em;
  letter-spacing: .3px;
  margin: 0 0 5px;
  padding: 0;
  text-align: justify;
}


/*bottom banner*/
.feature-bottom-gardient {
    background-color: #2f96e9;
    background-repeat: repeat-y;
    background: -webkit-gradient(linear, left top, right top, from(#30cfc3), to(#2f96e9));
    background: -webkit-linear-gradient(left, #2f96e9, #30cfc3);
    background: -moz-linear-gradient(left, #2f96e9, #30cfc3);
    background: -ms-linear-gradient(left, #2f96e9, #30cfc3);
    background: -o-linear-gradient(left, #2f96e9, #30cfc3);
}
.feature-bottom-gardient p {
	color: #fff;
}
.feature-bottom-gardient .cta-1,
.feature-bottom-gardient .cta-3 {
    border: 2px solid #fff;
    display: inline-block;
    font-size: 14px;
    float: none;
    text-transform: uppercase;
    padding: 15px;
    margin: 0 4px;
}
.feature-bottom-gardient .cta-1 {
	background-color: #fff;
    color: #117ecb;
}
.feature-bottom-gardient .cta-1:hover {
	background-color: #704FE6;
	border: 2px solid #704FE6;
	color: #fff;
}
.feature-bottom-gardient .cta-3 {
    color: #fff;
}
.feature-bottom-gardient .cta-3:hover {
	border: 2px solid #704FE6;
}


/* bottom menu - More Features To Explore */
.feature-bottom_nav p {
	text-align: left;
}
.feature-bottom_nav li {
	float: left;
	text-align: left;
	padding: 48px 15px;
	position: relative;
	width: 33.333%
}
.feature-bottom_nav li {
	border-right: 1px solid #e8e8e8
}
.feature-bottom_nav li:nth-child(3) {
	border-right: 0px
}
.feature-bottom_nav li:nth-child(6) {
	border-right: 0px
}
.feature-bottom_nav .nav1,
.feature-bottom_nav .nav2,
.feature-bottom_nav .nav3 {
	border-bottom: 1px solid #e8e8e8
}
.feature-bottom_nav li a {
	display: block
}
.feature-bottom_nav h3 {
	margin-bottom: 17px
}
.feature-bottom_nav .group-features {
	float: left;
	margin-left: 15px;
	padding-left: 7px;
	width: 200px;
}
.feature-bottom_nav .sale-circle,
.feature-bottom_nav .marketing-circle,
.feature-bottom_nav .service-circle,
.feature-bottom_nav .billing-circle,
.feature-bottom_nav .collaboration-circle,
.feature-bottom_nav .platform-circle {
	display: inline-block;
	float: left;
	height: 68px;
	text-align: center;
	width: 68px
}
.feature-bottom_nav .sale-circle {
	color: #37cf5b;
	font-size: 48px;
	line-height: 70px
}
.feature-bottom_nav .marketing-circle {
	color: #059eae;
	font-size: 45px;
	line-height: 68px
}
.feature-bottom_nav .service-circle {
	color: #f08f31;
	font-size: 39px;
	line-height: 70px
}
.feature-bottom_nav .billing-circle {
	color: #112e7a;
	font-size: 44px;
	line-height: 72px
}
.feature-bottom_nav .collaboration-circle {
	color: #ec3a4a;
	font-size: 38px;
	line-height: 68px
}
.feature-bottom_nav .platform-circle {
	color: #7e2d87;
	font-size: 42px;
	line-height: 70px
}
.feature-bottom_nav li:nth-child(1):hover:after,
.feature-bottom_nav li.sale-green:after,
.feature-bottom_nav li:nth-child(2):hover:after,
.feature-bottom_nav li.marketing-blue:after,
.feature-bottom_nav li:nth-child(3):hover:after,
.feature-bottom_nav li.service-yellow:after,
.feature-bottom_nav li:nth-child(4):hover:after,
.feature-bottom_nav li.billing-navyblue:after,
.feature-bottom_nav li:nth-child(5):hover:after,
.feature-bottom_nav li.collaboration-red:after,
.feature-bottom_nav li:nth-child(6):hover:after,
.feature-bottom_nav li.platform-purple:after {
	content: "";
	left: 0;
	height: 2px;
	position: absolute;
	width: 100%
}
.feature-bottom_nav li:nth-child(1):hover:after {
	background-color: #37cf5b;
	bottom: 0
}
.feature-bottom_nav li:nth-child(2):hover:after {
	background-color: #059eae;
	bottom: 0
}
.feature-bottom_nav li:nth-child(3):hover:after {
	background-color: #f08f31;
	bottom: 0
}
.feature-bottom_nav li:nth-child(4):hover:after {
	background-color: #112e7a;
	top: 0
}
.feature-bottom_nav li:nth-child(5):hover:after {
	background-color: #ec3a4a;
	top: 0
}
.feature-bottom_nav li:nth-child(6):hover:after {
	background-color: #7e2d87;
	top: 0
}


@media only screen
and (min-width : 320px)
and (max-width : 767px) {
	.desktop-version {display: none}
	.mobile-version {display: block}
	.mobile-img {margin: 25px 0}
	.feature-bottom-gardient .cta-1, .feature-bottom-gardient .cta-3 {margin: 0px; padding: 15px 8px;}
	.feature-bottom_nav .group-features {width: 100%}
	.feature-bottom_nav li {border: 0px; float: left!important; padding: 25px 15px; width: 100%;}
	.feature-bottom_nav li p {margin-bottom: 0em}
}

@media only screen
and (min-width : 768px)
and (max-width : 980px) {
	.desktop-version {display: none}
	.mobile-version {display: block}
	.mobile-img {margin: 25px 0}
}