/* FEATURES =============================================================== */
#features {
	background-color: #f8f8f9;
	padding: 120px 0 225px 0;
	position: relative;
	/* margin-top: 242px; */
}
#features .texture{
    height: 225px;
	background: url("texture_go_bottom_center.svg") no-repeat center bottom;
    width: 100%;
    bottom: 0;
    left: 0;
    right: 0;
    position: absolute;
    z-index: 0;
}
#features h2{
    margin: 0 auto 50px auto;
    color: #4f4da7;
    font-weight: 200;
    font-size: 46px;
    text-align: center;
}

#features ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin-bottom: 50px;
}


#features ul li{
	width: 32%;
	box-sizing: border-box;
	font-weight: 300;
	background-color: #f8f8f9;
	margin-bottom: 20px;
	padding: 0 35px 40px 35px;
}



#features ul li h3{
	font-weight: 300;
	font-size: 22px;
	line-height: 28px;
	margin: 0 0 10px 0;
	color: #02CEFF;
	color: #6A67CE;
}


#features ul li p{
	font-size: 16px;
	line-height: 22px;
	color: #49505b;
	/* color: #898E95; */
	font-weight: 200;
}

#features ul li p strong{
	font-weight: 300;
	text-transform: uppercase;
}



#features ul li span{
    margin-left: -5px;
}
#features ul li span.noGap{
    height: 66px !important;
    display: inline-block;
    position: relative;
}




#features ul li span i{
    font-size: 70px;
    color: #02CEFF;
}


#features .demoAccess {
    text-align: center;
    margin-bottom: 50px;
}



#features .demoAccess a{
    font-weight: 300;
    font-size: 20px;
    display: inline-block;
    color: #FFFFFF;
    background-color: #37C597;
    padding: 15px 25px;
    border-radius: 6px;
    margin-bottom: 80px;
    margin: 0 auto;
    display: inline-block;
}


#features .demoAccess:hover a{
    background-color: #299b76;
}


@media screen and (max-width: 1100px) {
	#features .pageWidth {
		padding: 0 20px;
	}
}

@media screen and (max-width: 860px) {
	#features .pageWidth {
		padding: 0 20px;
	}

	#features ul li{
		width: 48%;
		box-sizing: border-box;
		font-weight: 300;
	}

	#features ul li span{
		width: 120px;
		margin-bottom: 10px;
	}

	#features {
		padding: 160px 0 195px 0;
	}
}



@media screen and (max-width: 600px) {
	#features {
		padding: 160px 0 155px 0;
	}
	#features ul {
		flex-direction: column;
	}


	#features ul li{
		width: 100%;
	}

}


@media screen and (max-width: 450px) {
	#features {
		padding: 160px 0 120px 0;
	}
}

@media screen and (max-width: 400px) {
	#features ul li h3{
		font-size: 19px;
		line-height: 24px;
		/* font-weight: 400; */
	}
	#features ul li h4{
		font-size: 15px;
	}

	
	#features ul li p{
		font-size: 15px;
		line-height: 20px;
	}
}