 
@-webkit-keyframes icons {
	0% {
		stroke-dasharray: 1000;
		stroke: #f4645a;
		fill: rgba(244, 100, 90, 0);
	}
	90% {
		stroke: #f4645a;
		fill: rgba(244, 100, 90, 0);
	}
	100% {
		stroke-dasharray: 490;
		stroke: rgba(244, 100, 90, 0);
		fill: #f4645a;
	}
}
@keyframes icons {
	0% {
		stroke-dasharray: 1000;
		stroke: #f4645a;
		fill: rgba(244, 100, 90, 0);
	}
	90% {
		stroke: #f4645a;
		fill: rgba(244, 100, 90, 0);
	}
	100% {
		stroke-dasharray: 490;
		stroke: rgba(244, 100, 90, 0);
		fill: #f4645a;
	}
}
@-webkit-keyframes iconsCircle {
	from {
		stroke-dasharray: 1000;
	}
	to {
		stroke-dasharray: 1160;
	}
}
@keyframes iconsCircle {
	from {
		stroke-dasharray: 1000;
	}
	to {
		stroke-dasharray: 1160;
	}
}
@-webkit-keyframes lineDashed {
	from {
		stroke-dasharray: 1000;
	}
	to {
		stroke-dasharray: 1100;
	}
}
@keyframes lineDashed {
	from {
		stroke-dasharray: 1000;
	}
	to {
		stroke-dasharray: 1100;
	}
}
@-webkit-keyframes lineCircle {
	from {
		stroke-dasharray: 1000;
	}
	to {
		stroke-dasharray: 1030;
	}
}
@keyframes lineCircle {
	from {
		stroke-dasharray: 1000;
	}
	to {
		stroke-dasharray: 1030;
	}
}
.icons-anim {
	-webkit-animation-name: icons;
					animation-name: icons;
	-webkit-animation-fill-mode: forwards;
					animation-fill-mode: forwards;
	-webkit-animation-timing-function: linear;
					animation-timing-function: linear;
}

.icons-circle-anim {
	-webkit-animation-name: iconsCircle;
					animation-name: iconsCircle;
	-webkit-animation-fill-mode: forwards;
					animation-fill-mode: forwards;
	-webkit-animation-timing-function: linear;
					animation-timing-function: linear;
}

.line-anim {
	-webkit-animation-name: lineDashed;
					animation-name: lineDashed;
	-webkit-animation-fill-mode: forwards;
					animation-fill-mode: forwards;
	-webkit-animation-timing-function: linear;
					animation-timing-function: linear;
}

.line-circle-anim {
	-webkit-animation-name: lineCircle;
					animation-name: lineCircle;
	-webkit-animation-fill-mode: forwards;
					animation-fill-mode: forwards;
	-webkit-animation-timing-function: linear;
					animation-timing-function: linear;
}

/*
* General Elements
*/

svg path.line {
	fill: none;
	stroke: #0178bd;
	stroke-dasharray: 1000;
	stroke-dashoffset: 1000;
}
svg path.icon, svg path.plus {
	stroke-dasharray: 1000;
	stroke-dashoffset: 1000;
}
svg circle.circle {
	fill: none;
	stroke: #0178bd;
	stroke-dasharray: 1000;
	stroke-dashoffset: 1000;
}
svg circle.icons-circle {
	fill: none;
	stroke: #f4645a;
	stroke-dasharray: 1000;
	stroke-dashoffset: 1000;
}
 
 
 

/*
* How it Works
*/
.custom-wrap-icons .custom-box-icon {
	position: relative;
	float: left;
	text-align: center;
	margin-left: 75px;
}
.custom-wrap-icons .custom-box-icon:nth-child(1) {
	margin-left: 0;
}
@media (max-width: 575px) {
	.custom-wrap-icons .custom-box-icon {
		width: 100%;    width: 33% !important;
		margin-left: auto !important;
		margin-right: auto !important;
		margin-bottom: 40px;
	}
	.custom-wrap-icons .custom-box-icon:nth-child(3) {
		margin-bottom: 0;
	}
}
.custom-wrap-icons .custom-box-icon span {
	display: block;
	color: #2e353e;
	font-weight: 600;
	/*margin-top: 20px;*/
}
.custom-wrap-icons .custom-box-icon .wrap-dashed-lines svg.dashed-line {
	position: absolute;
	top: 50%;
	-webkit-transform: translateY(-50%);
					transform: translateY(-50%);
}
@media (max-width: 475px) {
	.custom-wrap-icons .custom-box-icon .wrap-dashed-lines svg.dashed-line {
		display: none;
	}
}
.custom-wrap-icons .custom-box-icon .wrap-dashed-lines svg.dashed-line._left {
	left: -70px;
	top: 15%;
}
.custom-wrap-icons .custom-box-icon .wrap-dashed-lines svg.dashed-line._right {
	right: -70px;
	top: 50%;
}
.custom-wrap-icons:nth-child(1) {
	margin-left: 0;
}
 