.anchor-blocks{
	padding: 0px, 50px, 0px, ;
	max-width: 100%;
	background: #eeeeee;

	.fort{
		font-size: 32px;
	}

	h3{
		text-align: center;
		padding-top: 25px;
		font-size:24px;
		font-weight: bold;
	}

	.featureiconcontainer {
		width: 200px;
		margin-bottom: 25px;

		&:hover{
			background-color: white;
		}
	}

	.featureiconcontainercarousel {
		width: 200px;
		height: 160px;
		margin-bottom: 10px;
		padding-left: 0px;
		padding-right: 0px;
		margin-left: auto;
		margin-right: auto;
		background-color: white;
	}

	.wrapper{
		padding: calc(var(--vspace) * 6) calc(var(--vspace) * 3);
		display: flex;
		flex-wrap: wrap;

		justify-content: center;
		flex-grow: 1;

		h4{
			width: 100%;
			text-align: center;
			text-transform: uppercase;
			font-size: 14px;
			font-weight: bold;
		}

		a {
			width: 80%;
		}

		cursor: pointer;
		overflow: hidden;

		&:after{
			content: "";
			width: 10px; height: 10px;
			position: absolute;
			left: calc(50% + 5px);
			bottom: calc(var(--gutter) * 2);
			opacity: 0;
			transform: translateY(-50%);
			background-size: contain;
			background-repeat: no-repeat;
			transition: transform 0.1s ease-out, opacity 0.1s ease-out;
		}

		&:hover:after{ transform: translateY(0); opacity: 1 }

	}
	@media (min-width: 768px) {
		.grid{

			>div:first-child .wrapper{ border-left: 0; border-radius: 5px 0 0 5px }
			>div:nth-last-child(2) .wrapper{border-radius: 0 5px 5px 0 }

		}
		.gradient-border-block{
			height: calc(100% + 2px);
			background:linear-gradient( to bottom, white, var(--pd-light-gray));
			display: block;
			position: absolute;
			top: -1px;
			left: calc(50%);
			transform:translateX(-50%);
			z-index: -1;
			border-radius: 6px;
		}
	}


	@media (max-width: 767px) {
		.grid{
			border: 1px solid var(--pd-light-gray);
			overflow: hidden;
			border-radius: 5px;
			box-shadow: 0 3px 6px 0 rgba(0,0,0,0.05);

		}
	}
}