/*************************************************************************************************************** Dear Dev Pros, Only add non-renderable SASS in this file (no CSS selectors), otherwise any CSS will be rendered into any file that includes this one (spoiler alert: most files include this file) */
.cat-filter { display: inline-block; margin-right: 5px; margin-bottom: 5px; padding: 12px 30px; background-color: #f5f5f5; color: #003087; }

.cat-filter.active { background-color: #003087; color: #f5f5f5; }

.cat-filter.active:focus, .cat-filter.active:visited { color: #f5f5f5; }

.cat-filter:focus, .cat-filter:visited { color: #003087; }

a.cat-filter:hover { background-color: #003087; color: #f5f5f5; text-decoration: none; }

.brochure-link { padding: 12px 0; background-color: #f0f5fd; color: #003087; text-align: center; }

a.brochure-link:hover { background-color: #003087; color: #f0f5fd; text-decoration: none; }

.product-heading { max-width: 100%; }

.product-list { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 1rem; }

@media (max-width: 576px) { .product-list { gap: 4rem; } }

.product-list .product-item { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; }

@media (min-width: 576px) { .product-list .product-item { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; } }

.product-list .product-brochure { gap: 20px; }

@media (max-width: 576px) { .product-list .product-brochure { width: 100%; } }

.product-list .product-brochure .brochure-link-dark { width: calc(100% - 10px); padding: 12px; background-color: #003087; border: 2px solid #003087; color: #f0f5fd; text-align: center; }

.product-list .product-brochure a.brochure-link-dark:hover { background-color: #f5f5f5; color: #003087; border: 2px solid #003087; text-decoration: none; }
/*# sourceMappingURL=productsdisplay.css.map */