.tm-box-icon-equal-height {
	.wpb_wrapper {
		height: 100%;
		display: flex;
		align-items: stretch;
	}
	.tm-box-icon-wrap {
		display: flex;
		width: 100%;
	}
	.tm-box-icon {
		display: flex;
		align-items: center;
	}
}

.tm-box-icon-wrap {
	&.style-4 {
		@extend %transit;
		&:hover {
			transform: translateY(-15px) !important;
		}
	}
}

.tm-box-icon {
	margin-bottom: 60px;
	position: relative;
	.icon {
		line-height: 1;
	}
	.overlay {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
	}
	.content-wrap {
		position: relative;
	}
	&.style-1, &.style-3 {
		.icon {
			font-size: 50px;
			margin-bottom: 20px;
		}
		.image {
			margin-bottom: 43px;
		}
		.heading {
			line-height: 1.2;
			font-size: 20px;
			margin-bottom: 12px;
		}
		.text {
			font-size: 16px;
		}
	}
	&.style-3 {
		.icon {
			display: inline-block;
			width: 100px;
			height: 100px;
			text-align: center;
			border-radius: 50%;
			color: #ffffff;
			i {
				line-height: 100px;
			}
		}
	}
	&.style-2 {
		display: table;
		width: 100%;
		margin-bottom: 40px;
		.icon {
			display: table-cell;
			vertical-align: middle;
			i {
				height: 40px;
				width: 40px;
				font-size: 50px;
				text-align: center;
				line-height: 36px;
			}
		}
		.content {
			width: 100%;
			padding-left: 35px;
			display: table-cell;
			vertical-align: middle;
		}
		.heading {
			font-size: 20px;
			margin-bottom: 10px;
		}
		.text {
			font-size: 16px;
		}
	}
}

@include media-breakpoint-up(lg) {
	.tm-box-icon {
		&.style-1 {
			.icon {
				margin-bottom: 23px;
			}
		}
	}
}

@include media-breakpoint-down(sm) {
	.tm-box-icon-equal-height {
		.wpb_wrapper {
			display: block;
		}
		.tm-box-icon {
			display: block;
		}
	}
}

.tm-box-icon__btn.tm-box-icon__btn {
	margin-top: 32px;
	text-transform: none;
	font-size: 18px;
	font-weight: normal;
	letter-spacing: 0;
}