/**
 * All of the CSS for your public-facing functionality should be
 * included in this file.
 */

.featured-products {
	/* border:  2px dashed blue; */
	display:  flex;
	flex-flow: row wrap;
	margin-bottom:  1em;

}

.featured-products .product-card-container {
	/* border:  2px dashed red; */
	/* min-width:  25%; */
	min-width:  16em;
	padding:  0.5em;
 	flex-grow: 1;
    flex-basis: 0;
}

.product-card {
	margin-bottom:  1em;
	min-width:  8em;
	/* width:  8em; */
	/* background-color:  green; */
	text-align: center;
}

.product-card .icon {
	display:  block;
	position:  relative;
	font-size:  40pt;
	width:  2em;
	height:  2em;
	/* background-color:  pink; */
	margin-left:  auto;
	margin-right:  auto;
	border-radius:  50%;
}

.product-card .icon i {
	color:  white;
	position:  absolute;
	left:  50%;
	top:  50%;
	transform: translate(-50%, -50%);
}

.product-card .label {
	margin-top:  1em;
	/* margin-left:  auto; */
	/* margin-right:  auto; */
}

.product-card .label a {
	white-space: normal;
	transition: 0.3s;
	/* font-weight: bold; */
}


.call-to-action {
	text-align: center;
}

.call-to-action a.btn {
	/* display:  block; */
	/* margin-left:  auto; */
	/* margin-right:  auto; */
	text-transform: none;
}