// Layout 1
.cms-howitwork-layout-1{
	.step-number{
		width: 68px;
		height: 68px;
		line-height: 68px;
		text-align: center;
		background-color: #f0f1f4;
		color: $secondary-color;
		@include border-radius(50%);
		&:before{
			content: '';
			display: block;
			height: 2px;
			width: 600px;
			background-color: #e9e9f0;
			position: absolute;
			top: 35px;
			left: 108px;
		}
		&:after{
			@include font-cmsi('\e91f', 10px);
			color: $primary-color;
			position: absolute;
			left: 192px;
			width: 38px;
			background-color: $white;
			line-height: 1;
			top: 31px;
		}
	}
	.cms-hiw-desc{
		min-height: 69px;
	}
	.cms-hiw-item-inner{
		// Hover
		&:hover{
			@include transform(translateY(-20px));
			.step-number{
				background-color: $white;
				@include box-shadow('0 0 0 3px #{$accent-color} inset, 0 0 0 7px #{$grey-color}');
			}
		}
	}
}
// Layout 2
.cms-howitwork-layout-2{
	.cms-heading{
		border-bottom: 1px solid var(--color-light-grey);
	}
	.cms-hiw-desc{
		min-height: 100px;
	}
}