/*
 * Benefits Section
 */

.benefits-section {
	z-index: 1;
}

.benefits-section .inner-section {
	position: relative;
	z-index: 2;
	display: block;
	width: 100%;
	height: auto;
	background-image: -webkit-linear-gradient(to bottom, rgba(256,256,256,0) 0%, var(--light) 20%, var(--light) 80%, rgba(256,256,256,0) 100%), url('../../../media/texture-grid.png');
	background-image: -moz-linear-gradient(to bottom, rgba(256,256,256,0) 0%, var(--light) 20%, var(--light) 80%, rgba(256,256,256,0) 100%), url('../../../media/texture-grid.png');
	background-image: linear-gradient(to bottom, rgba(256,256,256,0) 0%, var(--light) 20%, var(--light) 80%, rgba(256,256,256,0) 100%), url('../../../media/texture-grid.png');
}

.benefits-section .point {
	margin-top: 30px;
}

.benefits-section .point .description {
	position: relative;
	margin-top: 10px;
}

.benefits-section .point .description span {
	position: relative;
}

.benefits-section .point .description span:before {
	content: '';
	position: absolute;
	z-index: 1;
	top: 2px;
	left: -20px;
	width: 12px;
	height: 12px;
	background-size: contain;
	background-position: top right;
	background-repeat: no-repeat;
	background-image: url('../../../media/bullet-dot.svg');
}

@media( min-width: 640px )  {
	.benefits-section .point .description span:before {
		top: 3px;
		left: -32px;
		width: 12px;
		height: 12px;
	}
}

@media( min-width: 1040px ) {
	.benefits-section .point {
		margin-top: 70px;
	}
	.benefits-section .point .description {
		margin-top: 0;
	}
	.benefits-section .point .description span:before {
		top: 2px;
		left: -32px;
		width: 16px;
		height: 16px;
	}
}
	
@media( min-width: 1380px ) {
	.benefits-section .point .description span:before {
		top: 5px;
		left: -32px;
		width: 16px;
		height: 16px;
	}
}
