.box-style-one{
	&__single{
		position: relative;
		margin-bottom: 30px;
	}
	&__link-overlay{
		width: 100%;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
		z-index: 2;
	}
	&__content-inner{
		display: flex;
		align-items: center;
	}
	&__icon-inner{
		flex: 0 0 70px;
		margin-right: 15px;
	}

	&__icon{
		border-radius: 50%;
		width: 70px;
		height: 70px;
		font-size: 52px;
		background: $theme-color-2;
		color: $white;
		display: flex;
		align-items: center;
		justify-content: center;
	}
	&__title{
		font-size: 20px;
		font-weight: 700;
		line-height: 25px;
		margin: 0;
	}
	&__desc{
		margin-top: 15px;
		font-size: 16px;
		line-height: 30px;
		font-weight: 500;
	}
	&__single{
		&:hover, &.active{
			.box-style-one__icon-inner{
				svg, i{ 
					animation: beat 1.5s ease 0s infinite;
				}
			}
		}
	}
}

// Style 02 ------------
.box-style-two{
	&__single{
		position: relative;
	}
	&__wrap{
		display: inline-block;
		text-align: center;
		background: #FDF8F4;
		border-radius: 30px;
		padding: 30px 25px;
		border: 1px solid $border-color;
	}
	&__icon{
		i{
			font-size: 62px;
			color: $theme-color-2;
		}
		svg{
			width: 62px;
			fill: $theme-color-2;
		}
	}
	&__title{
		font-size: 16px;
		margin: 30px auto 0;
		max-width: 128px;
	}
	&__desc{
		margin-top: 20px;
	}
	&__single{
		&:hover{
		}
	}
}

.box-style-three{
	&__single{

	}
	&__wrap{
		display: flex;
		align-items: center;
	}
	&__icon{
		width: 80px;
		flex: 0 0 80px;
		height: 80px;
		margin-right: 20px;
		border-radius: 50%;
		display: flex;
		justify-content: center;
		align-items: center;
		background: #FDF8F4;
		font-size: 45px;
		color: $link-color;
		transition: all 0.35s;
		svg{
			width: 45px;
			fill: $link-color;
		}
	}
	&__title{
		font-size: 20px;
		line-height: 30px;
		margin: 0;
	}
	&__desc{
		margin-top: 10px;
	}
	&__single:hover{
		.box-style-three__icon{
			background: $theme-color;
			color: $white;
		}
	}
}