/* =tools */

.block-tools__title {
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--wp--preset--font-size--x-large);
	line-height: var(--wp--custom--line-height--medium);
	text-transform: uppercase;
	font-weight: 500;
	margin-bottom: 16px;
}

.block-tools .block-tools__items {
	display: grid;
}

.block-tools .block-tools__item {
	background: #FFFFFF;
	box-shadow: 2px 2px 12px rgba(0, 0, 0, 0.2);
}

.block-tools__item--image-container {
		padding: 18px 16px 20px;
}
.block-tools__item--image-container img {
	margin: 0 auto;
}

.block-tools__item--content {
	font-family: var(--wp--preset--font-family--display);
	font-weight: 500;
	line-height: var(--wp--custom--line-height--tiny);
	font-size: 1.25rem;
	text-align: center;
	padding: 0px 8px 24px;
}

.block-tools__item--link {
	color: black;
	text-decoration: none;
}


@media only screen and (max-width: 700px) {
	.block-tools__title {
		font-size: 1.625;
	}

	.block-tools .block-tools__items {
		grid-auto-columns: calc(100% / 3.75);
		grid-auto-flow: column;
		grid-template-columns: none;
		overflow-x: auto;
		overflow-y: hidden;
		padding-bottom: 1rem;
		margin-left: calc(-1 * var(--wp--custom--layout--padding));
		margin-right: calc(-1 * var(--wp--custom--layout--padding));
		padding-left: var(--wp--custom--layout--padding);
		padding-right: var(--wp--custom--layout--padding);
		overscroll-behavior-x: contain;
		padding-bottom: 24px; /* push horizontal scrollbar away */
		grid-gap: 15px;
	}
	.block-tools .block-tools__items::before,
	.block-tools .block-tools__items::after {
		/* undo accent styling */
		display: none;
	}
}

@media only screen and (max-width: 610px) {
	.block-tools .block-tools__items {
		grid-auto-columns: calc(100% / 2.75);
	}
}

@media only screen and (max-width: 460px) {
	.block-tools .block-tools__items {
		grid-auto-columns: calc(100% / 1.75);
	}
}

@media only screen and (min-width: 701px) {

	.block-tools__title {
		font-size: 2.125rem;
	}


	.block-tools .block-tools__items {
		grid-template-columns: repeat( 4, minmax( 0, 1fr ) );
		grid-gap: 19px;
	}

}
