section.stat-counter-section {
	margin-top: 0;
	margin-bottom: 0;
	padding: 100px 0;
	position: relative;
	background-size: cover;
	background-repeat: no-repeat;
	z-index: 1;

	&:before {
		content: "";
		background: rgba(0,0,0,0.5);
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		z-index: -1;
	}

	.section-title {
		color: #fff;
	}//.section-title

	.section-desc {
		color: #fff;
		text-align: center;
	}//.section-desc

	.section-grid {
		display: flex;
		flex: 1;
		flex-wrap: wrap;
		justify-content: center;
		align-items: flex-start;
	}//.section-grid

	.section-block {
		width: 23.33%;
		text-align: center;
		margin-right: 2%;
		margin-top: 30px;

		&:nth-child(4n) {
			margin-right: 0;
		}

		.section-block-inner {
			width: 220px;
			height: 220px;
			border: 2px solid #fff;
			border-radius: 5px;
			color: #fff;
			text-align: center;
			display: flex;
			flex: 1;
			flex-direction: column;
			justify-content: center;
			padding: 20px;
			margin: 0 auto;

			.counter-icon {
				font-size: 2.5em;
				line-height: 1;
				margin-bottom: 15px;
			}//.counter-icon

			.counter-num {
				font-size: 2.8125em;
				font-weight: 600;
				line-height: 1.3;
				margin-bottom: 15px;
			}//.counter-num

			.counter-title {
				font-size: 1em;
				text-transform: capitalize;
				position: relative;
				padding-top: 10px;

				&::before {
					content: "";
					width: 70px;
					height: 2px;
					background: $primary_color;
					position: absolute;
					top: 0;
					left: 0;
					right: 0;
					margin: 0 auto;
				}
			}//.counter-title
		}//.section-block-inner
	}//.section-block

	&.lay-two {

		.section-block-inner {
			border-color: rgba(0,0,0,0.05);	
			background: rgba(0,0,0,0.5);
		}//.section-block-inner
	}//&.layout-two

	&.lay-three {

		.section-block-inner {
			border-radius: 100%;
		}//.section-block-inner
	}//&.layout-three

	&.lay-four {

		.section-block-inner {
			border-radius: 5px;
			background: #fff;
			color: #000;
		}//.section-block-inner
	}//&.layout-four
}//section.stat-counter-section

@media screen and (max-width: 1024px) {
	section.stat-counter-section {
		.section-block {
		    width: 49%;

		    &:nth-child(2n) {
		    	margin-right: 0;
		    }
		}//.section-block
	}//section.stat-counter-section
}//max-width: 1024px

@media screen and (max-width: 767px) {
	section.stat-counter-section {
		.section-grid {
			flex-direction: column;
			align-items: center;
		}//.section-grid

		.section-block {
			width: 100%;
			margin-right: 0;
		}//.section-block
	}//section.stat-counter-section 
}//max-width: 767px