@charset "utf-8"; /* global */

.mh--page-container {
	max-width: 1800px;
}

/* general layout */

/* default */

.page-description {
	border-radius:5px;
	width:100%;
	color:#2C3D4F;
	font-size:13px;
	border: 1px solid #e2e9e9;
	padding: 0;
	margin:10px 0;
}

.page-collection.hide-collection-price-range .collection-single .collection-price {
	display:none;
}

.page-collection.has-banner .page-description {
	margin:0 0 20px;
}

@media (min-width: 520px) {
	.page-description:has(.page-image) {
		display: grid;
		grid-template-columns: 175px 1fr;
	}
}

.page-collection ul.breadcrumb,
.page-collection ol.breadcrumb {
	margin-top: 0;
	margin-bottom: 10px;
}

.page-collection .breadcrumb a {
	font-weight:normal;
	text-decoration: none;
	font-size:12px;
	color: #565959;
}

.page-collection .breadcrumb a:hover {
	text-decoration:underline;
}

.page-description a {
	font-weight: bold;
	color: #287FB8;
	text-decoration:underline;
}

.page-description a:hover {
	color: #344A5F;
}

.page-description li {
	font-weight:normal;
	text-decoration: none;
	font-size:12px;
}

.page-collection .breadcrumb>.active {
	color: #7a7a7a;
	padding: 0 4px;
}

.page-collection .breadcrumb {
	padding: 0 0 10px 0;
	margin-bottom:10px;
	background-color: transparent;
}

	.page-collection .breadcrumb li {
		display:none;
	}

	.page-collection .breadcrumb>li+li:before {
		content: "\2039";
		color: #a7a7a7;
		padding: 0 5px;
	}

	.page-collection .breadcrumb li:nth-last-child(2) {
		display:inline-block;
	}

	@media (min-width: 1000px) {
		.page-collection .breadcrumb li {
			display:inline-block;
		}

		.page-collection .breadcrumb>li+li:before {
			content: "/\00a0";
		}
	}

.page-title {
	display:block;
	text-transform: none;
}

.page-title h1 {
	font-family: 'Montserrat', sans-serif;
	font-size:18px;
	font-weight:bold;
	margin:0 0 9px;
	color:#2C3D4F;
	display:block;
}

.page-title h2 {
	font-family: 'Montserrat', sans-serif;
	font-weight: 600;
	font-size:16px;
	margin:0 0 10px;
	color:#2C3D4F;
	display:block;
}

.page-image {
	width:100%;
	max-width:185px;
	display:none;
}

@media (min-width: 520px) {
	.page-image {
		display: inline-block;
	}
}

@media (min-width: 768px) {
	.page-image {
		margin:0;
	}
}

.page-image img {
	max-width:100%;
	border-radius:5px;
}

.page-seo {
	display: block;
	background-color: #F7F9F9;
	border-left: 2px solid #2980b9;
	padding:10px 20px 20px;
	width:100%;
}

@media (min-width: 1200px) {
	.page-seo {
		padding: 15px 25px;
	}
}

.page-read-content {
	max-width: 960px;
}

.page-read-content a,
.secondary-content a {
	color: #287FB8;
	text-decoration:underline;
}

.page-read-content a:hover,
.secondary-content a:hover {
	color: #3498DB;
}

.page-seo h2 {
	font-size: 17px;
}

.page-seo h3 {
	font-size: 15px;
}

.page-seo h4 {
	font-size: 13px;
}

.page-seo h5 {
	font-size: 13px;
}

.page-read {
	/*max-height: 120px;*/
	position: relative;
	/*overflow: hidden;*/
}

.page-read-cta {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	text-align: left;
	margin: 0;
	padding: 70px 0 5px 0;
	font-family: 'Roboto', sans-serif;
	background-image: linear-gradient(to bottom, rgba(255,255,255,0), #f7f9f9);
}

a.cta,
.cta {
	display: inline-block;
	background-color: #2980B9;
	color: #fff;
	padding: 5px 16px;
	border-radius: 3px;
	text-decoration:none;
}

.page-banner-desktop img {
	width:100%;
	aspect-ratio: 6 / 1;
}

.page-collection .page-banner-mobile {
	display:none;
	aspect-ratio: 5 / 3;
}

@media screen and (max-width: 960px) {
	.page-collection  .page-banner-desktop.page-banner-has-mobile {
		display:none;
	}

	.page-collection .page-banner-mobile {
		display:block;
	}
}

	/* override max width */
	.container {
		max-width:1800px;
	}

	.collection-page {
		max-width:100%;
		font-family: 'Roboto', sans-serif;
		margin-bottom:30px;
		*zoom: 1;
	}

	.collection-page:before { /*clearfix for collection page */
		display: table;
		content: "";
		line-height: 0;
	}

	.collection-page:after { /*clearfix for collection page */
		display: table;
		content: "";
		line-height: 0;
		clear: both;
	}

	/* collection headers */

	.collection-page .collection-masthead {
		background-color: #36A9E1;
		color: #fff;
		padding:15px 40px;
		border-radius:3px;
		background-size:cover;
	}

	.collection-page .collection-masthead.collection-masthead-green {
		background: #27AF60;
	}

	/* for default_group.html */

	.page-collection .page-header,
	.default-group .page-header {
		margin:0;
	}

	.page-collection .page-header h1,
	.default-group h1 {
		font-family: 'Montserrat', sans-serif;
		font-weight: 600;
		color: #065798;
		text-transform: uppercase;
		font-size:22px;
		margin-top: 15px;
		margin-bottom: 5px;
	}

	/* masthead style 1 -- bg image and subnav */

	.collection-page .collection-masthead-hero .gradient {
		padding: 200px 60px 15px;
		background-image: -webkit-gradient(linear, center top, center bottom, color-stop(0, transparent), color-stop(60%, transparent), color-stop(100%, rgba(0, 0, 0, 0.95)) );
		background-image: -webkit-linear-gradient( top, transparent, transparent 60%, rgba(0, 0, 0, 0.95) 100% );
		background-image: -moz-linear-gradient( top, transparent, transparent 60%, rgba(0, 0, 0, 0.95) 100% );
		background-image: -ms-linear-gradient( top, transparent, transparent 60%, rgba(0, 0, 0, 0.95) 100% );
		background-image: -o-linear-gradient( top, transparent, transparent 60%, rgba(0, 0, 0, 0.95) 100% );
	}

	.collection-page .collection-masthead-hero h1 {
		font-family: 'Montserrat', sans-serif;
		font-weight: 600;
		font-size:30px;
	}

	.collection-page .collection-masthead-hero h1,
	.collection-page .collection-masthead-hero p {
		color:#fff;
		text-align:center;
	}

	.collection-page .collection-masthead-hero p {
		font-size: 15px;
	}

	.collection-page .collection-masthead-hero a {
		color:#fff;
		font-weight:bold;
		padding:3px 12px;
		border-radius:3px;
		border:2px solid #fff;
		margin-left:5px;
	}

	.collection-page .collection-masthead-hero .nav {
		display:block;
		margin-bottom:10px;
	}

	.collection-page .collection-masthead-hero .nav a {
		display:inline-block;
		margin:0;
		margin-bottom:-5px;
		background:#fff;
		color: #333;
		padding:10px 30px;
	}

	.collection-page .collection-masthead-hero .nav li.active a {
		border-bottom: 2px solid #E74D3C;
	}

	.collection-page .collection-masthead-hero .nav li a {
		border: #F7F9F9 2px solid;
	}

	.collection-page .collection-masthead-hero .nav li:hover {
		background:inherit;
	}

	.collection-page .products-container {
		margin-top:20px;
	}

	/*  subnav */

	.collection-page .subnav a:first-child {
		border-top-right-radius: 4px;
		border-top-left-radius: 4px;
	}

	.collection-page .subnav a {
		position: relative;
		color: #555;
		display: block;
		padding: 10px 15px;
		margin-bottom: -1px;
		background-color: #fff;
		border: 1px solid #F7F9F9;
	}

	.collection-page .subnav a:hover {
		background: #F7F9F9;
	}

	/* callout boxes */

	.collection-page .callout h3 {
		margin-top: 0;
	}

	.collection-page .callout {
			padding: 30px;
			border-radius: 3px;
			background:rgb(247, 249, 249);
		}

	.collection-page .callout-dark {
		background: #344A5F;
		color: #fff;
	}

	.collection-page .callout-green {
		background: #2ECC70;
		color: #fff;
	}

	.collection-page .callout-red {
		background: #E74D3C;
		color: #fff;
	}

	.collection-page .callout-orange {
		background: #F39C0F;
		color: #fff;
	}

	.collection-page .callout-blue {
		background: #3498DB;
		color: #fff;
	}

	.collection-page .callout-outline {
		background: transparent;
	}

	.collection-page .callout img {
		border-radius: 3px;
		max-width:100%;
		width:100%;
		margin:20px 0;
	}

	@media (min-width: 768px) {
		.collection-page .callout img {
			margin:10px 15px 10px 15px;
			width:auto;
		}
	}


	/* content page font layout */

	.collection-page h1,
	.collection-page .h1,
	.collection-page h2,
	.collection-page .h2,
	.collection-page h3,
	.collection-page .h3,
	.collection-page h4,
	.collection-page .h4,
	.collection-page h5,
	.collection-page .h5 {
		font-family:'Roboto';
	}

	.collection-page .collection-header h1,
	.collection-page .collection-masthead h1,
	.collection-page .title {
		font-size:22px;
		font-family: 'Montserrat', sans-serif;
		font-weight: 600;
		word-wrap: normal;
		margin-top: 10px;
		margin-bottom: 5px;
	}

	.bold {
		font-weight: bold;
	}

	.collection-title-default {
		text-transform: uppercase;
		color: #065798;
		margin-top:10px;
	}

	.table-striped>tbody>tr:nth-child(odd)>td,
	.table-striped>tbody>tr:nth-child(odd)>th {
			background: #F7F9F9;
	}

	.table>thead>tr>th,
	.table>tbody>tr>th,
	.table>tfoot>tr>th,
	.table>thead>tr>td,
	.table>tbody>tr>td,
	.table>tfoot>tr>td {
		border-color: #ECF0F1;
	}

	/* breadcrumbs */

	.collection-page .breadcrumb {
		font-size: 13px;
		background: #f7f9f9;
		margin-bottom:0;
	}

	.collection-page .collection-masthead .breadcrumb {
		background: transparent;
		padding: 8px 15px 8px 0;
	}

	.collection-page .collection-masthead .breadcrumb a {
		color: #ffffff;
	}

	.collection-page .collection-masthead .breadcrumb>li+li:before {
		color: #8acff1;
	}

	.collection-page .collection-masthead .breadcrumb>.active {
		color: #afe5ff;
	}

	.collection-page .collection-masthead.collection-masthead-green .breadcrumb>li+li:before {
		color: #ABEBC6;
	}

	.collection-page .collection-masthead.collection-masthead-green .breadcrumb>.active {
		color: #ABEBC6;
	}

	.collection-page .collection-masthead.collection-masthead-orange .breadcrumb>li+li:before {
		color: #FAD79F;
	}

	.collection-page .collection-masthead.collection-masthead-orange .breadcrumb>.active {
		color: #FAD79F;
	}

	.collection-page .collection-masthead.collection-masthead-red .breadcrumb>li+li:before {
		color: #F5B8B1;
	}

	.collection-page .collection-masthead.collection-masthead-red .breadcrumb>.active {
		color: #F5B8B1;
	}

	.collection-page .collection-masthead.collection-masthead-dark .breadcrumb>li+li:before {
		color: #AEB7BF;
	}

	.collection-page .collection-masthead.collection-masthead-dark .breadcrumb>.active {
		color: #AEB7BF;
	}

	/* responsive videos */

	.collection-page .video-container {
		position: relative;
		padding-bottom: 56.25%; /* 16:9 */
		padding-top: 25px;
		height: 0;
	}

	.collection-page .video-container iframe {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
	}

	/* filament pages */

		/* when resizing page, display only certain amount of products */
		@media (max-width: 568px) {
			.page-landing-filaments .product-single.product-loaded:not(:empty):not(:nth-child(-n+1)) {
				display:none !important;
			}
		}

		@media (max-width: 915px) {
			.page-landing-filaments .product-single.product-loaded:not(:empty):not(:nth-child(-n+2)) {
				display:none !important;
			}
		}

		@media (max-width: 1200px) {
			.page-landing-filaments .product-single.product-loaded:not(:empty):not(:nth-child(-n+3)) {
				display:none !important;
			}
		}

		@media (max-width: 1400px) {
			.page-landing-filaments .product-single.product-loaded:not(:empty):not(:nth-child(-n+4)) {
				display:none !important;
			}
		}

	.collection-page .filament-desc {
		max-width:100%;
		display:inline-block;
		vertical-align: middle;
	}

	@media (min-width: 915px) {
		.collection-page .filament-desc {
			max-width:40%;
		}
	}

	@media (min-width: 1200px) {
		.collection-page .filament-desc {
			max-width:50%;
			margin-right:30px;
		}
	}

	.collection-page .filament-desc h1 {
		margin-top:10px;
	}

	.collection-page .filament-composition,
	.collection-page .filament-properties {
		max-width:30%;
		vertical-align: middle;
		font-family:'Montserrat', sans-serif;
		display:none;
	}

	@media (min-width: 915px) {
		.collection-page .filament-composition,
		.collection-page .filament-properties {
			display:inline-block;
		}
	}

	@media (min-width: 1200px) {
		.collection-page .filament-composition,
		.collection-page .filament-properties {
			max-width:20%;
		}

		.collection-page .filament-properties {
			margin-left:50px;
		}
	}

	.collection-page .filament-composition {
		text-align: center;
		padding: 0 35px;
	}

	@media (min-width: 1200px) {
		.collection-page .filament-composition {
			border-left: 1px solid #6ec3ec;
			border-right: 1px solid #6ec3ec;
		}

		.collection-page .collection-masthead-green .filament-composition {
			border-left: 1px solid #ABEBC6;
			border-right: 1px solid #ABEBC6;
		}

		.collection-page .collection-masthead-orange .filament-composition {
			border-left: 1px solid #FAD79F;
			border-right: 1px solid #FAD79F;
		}

		.collection-page .collection-masthead-red .filament-composition {
			border-left: 1px solid #F5B8B1;
			border-right: 1px solid #F5B8B1;
		}

		.collection-page .collection-masthead-dark .filament-composition {
			border-left: 1px solid #AEB7BF;
			border-right: 1px solid #AEB7BF;
		}
	}

	.collection-page .filament-composition img {
		max-width:100%;
	}

	.collection-page .filament-composition h2 {
		margin:0;
		font-weight:bold;
	}

	.collection-page .filament-extruder {
		background: url('/static/icons/extruder-white.svg') no-repeat left 10px;
		background-size: 25px;
		padding: 10px 0 0 50px;
		margin-bottom:15px;
	}

	.collection-page .filament-bedtemp {
		background: url('/static/icons/bedtemp-white.svg') no-repeat left 8px;
		background-size: 30px;
		padding: 10px 0 0 50px;
		margin-bottom:5px;
	}

	.collection-page .filament-property {
		text-transform: uppercase;
		font-size: 12px;
		color: #fff;
		display: block;
	}

	.collection-page .filament-properties h4 {
		margin:0 0 3px 0;
	}

	.collection-page .filament-property {
		font-size: 13px;
	}

	.collection-page .filament-value {
		font-size: 20px;
		font-weight:bold;
	}

	.collection-page .collection-masthead {
		background-color: #36A9E1;
		color: #fff;
		padding:5px 40px 15px;
		border-radius:3px;
	}

	.collection-page .collection-masthead img {
		text-align:center;
		margin:auto;
		display:block;
		vertical-align: middle;
		max-width:100%;
	}

	 /* quick link list */

	.collection-page .definition-list a {
		background: transparent;
		color: #404040;
		display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6, BB7 */
		display: -ms-flexbox; /* TWEENER - IE 10 */
		display: -webkit-flex; /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
		display: flex; /* NEW, Spec - Firefox, Chrome, Opera */
		padding:10px;
		border-bottom: 1px solid #ECF0F1;
		border-radius:3px;
	}

	.collection-page .definition-list a:hover {
		background-color: #F7F9F9;
		text-decoration:none;
	}

	.collection-page .definition-list a:hover h3 {
		text-decoration:underline;
	}

	.collection-page .definition-image {
		text-align: center;
		padding: 10px 10px 0 0;
		max-width:20%;
		display: inline-block;
		vertical-align: top;
		margin-left:-10px;
	}

	@media (min-width: 768px) {
		.collection-page .definition-image {
			padding: 15px 10px;
			margin-left:0;
		}
	}

	.collection-page .definition-list img {
		display:inline-block;
		border-radius:5px;
		border: 3px solid #f7f9f9;
		margin: 0 10px 10px 0;
		width:50px;
		max-width:100%;
	}

	.collection-page .definition-text {
		display:inline-block;
		max-width:70%;
		font-size:13px;
	}

	.collection-page .definition-text h3 {
		font-weight:bold;
		color: #005195;
		margin-bottom:5px;
	}

	.collection-page .additional h2 {
		font-family: 'Montserrat', sans-serif;
		font-weight: 600;
		margin-top: 40px;
	}

	.collection-page .additional {
		border-radius:3px;
	}

	.featured-heading {
		text-align: center;
	}

	@media screen and (min-width: 768px) {
		.featured-heading {
			text-align: left;
		}
	}

	.featured h2.heading {
		letter-spacing: 0.06em;
		font-size:17px;
		text-transform: uppercase;
		font-family: 'Montserrat', sans-serif;
		font-weight: 600;
		display:block;
		text-align: center;
	}

	@media screen and (min-width: 768px) {
		.featured h2.heading {
			display:inline-block;
			text-align: left;
		}
	}

	.featured h2.heading span {
		font-weight: normal;
	}

	@media screen and (min-width: 770px) {
		.featured h2 {
			margin: 15px 0 30px 20px;
			text-align: left;
		}
	}

	.product-collections .featured {
		border-bottom: 0.5px solid #efefef;
	}

	.featured-cta {
		display: inline-block;
		padding: 5px 7px;
		border: 2px solid #2980b9;
		color: #fff;
		background: #2980b9;
		border-radius:5px;
		font-family: 'Montserrat', sans-serif;
		font-weight: 600;
	}

	@media screen and (min-width: 768px) {
		.featured-cta {
			float: right;
			margin-top:12px;
		}
	}

	.featured-cta:hover {
		text-decoration: underline;
		color: #fff;
	}

	.product-collections-header {
		font-size:15px;
		border-bottom: 0.5px solid #efefef;
		padding:10px 0;
	}

	@media screen and (min-width: 768px) {
		.product-collections-header {
			padding:20px 0;
		}
	}

	.product-collections-header h2 {
		font-size:17px;
		text-align: center;
	}

	@media screen and (min-width: 768px) {
		.product-collections-header h2 {
			display:inline-block;
			margin:0 10px 0 0;

		}
	}

	.product-collections-header h2 a {
		font-weight: bold;
		text-decoration:underline;
		margin:0 5px 0;
	}

	.product-collections-header .button-group {
		text-align: center;
		display:block;
		margin:auto;
	}

	@media screen and (min-width: 768px) {
		.product-collections-header .button-group {
			margin-right:15px;
			display:inline-block;
		}
	}

	.filament-button {
		margin:0 2px;
		padding: 4px 20px;
		font-size: 16px;
		color: #2980b9;
		text-decoration: none;
		display: inline-block;
		cursor: pointer;
		border-radius:5px;
		position: relative;
		background: #fff;
		border: 2px solid #2980B9;
		transition: all .1s ease-in-out;
		-moz-transition: all .1s ease-in-out;
		-webkit-transition: all .1s ease-in-out;
	}

	.filament-button:hover {
		background-color: #2980B9;
		color: #fff;
	}

	.filament-button.active {
		border-color: #2980b9;
		color: #fff;
		background-color: #2980b9;
		cursor: default;
		outline:none;
	}

	.filament-button.active::before,
	.filament-button.active::after {
		top: 100%;
		left: 50%;
		border: solid transparent;
		content: " ";
		height: 0;
		width: 0;
		position: absolute;
		pointer-events: none;
	}

	.filament-button.active:after {
		border-color: rgba(41, 128, 185, 0);
		border-top-color: #2980b9;
		border-width: 5px;
		margin-left: -5px;
	}

	.filament-button.active:before {
		border-color: rgba(41, 128, 185, 0);
		border-top-color: #2980b9;
		border-width: 8px;
		margin-left: -8px;
	}

	.landing-featured-brands a {
		text-decoration:underline;
		display:inline-block;
		margin:0 4px;
	}

	.landing-featured-brands a:hover {
		text-decoration:none;
	}

	.landing-featured-brands,
	.landing-filters {
		display:block;
		margin-bottom:10px;
		text-align: center;
	}

	@media (min-width: 768px) {
		.landing-featured-brands,
		.landing-filters {
			display:inline-block;
			text-align: left;
		}
	}

	.collection-sidebar .related-list img {
		max-width:100%;
		border-radius:5px;
	}

	.collection-page .video-list {
		text-align: center;
	}

	.collection-page .video-list a {
		display:inline-block;
		text-align: center;
		margin:10px auto;
	}

	.collection-page .video-list h4 {
		font-weight: bold;
		color: #005195;
		font-size:16px;
	}

	@media (min-width: 768px) {
		.collection-page .video-list h4 {
			font-size:18px;
		}
	}

	.collection-page .video-list img {
		max-width:100%;
		border-radius:5px;
	}

	.collection-page .video-list .video {
		cursor: pointer;
		margin:20px auto;
		display:block;
		border-bottom: 1px solid #ECF0F1;
		padding:0 10px;
	}

	.collection-page .collection-sidebar {
		margin:10px 0;
	}

	/* video modal popup - bootstrap */

	.collection-page .modal-content {
		-webkit-box-shadow: none;
		box-shadow: none;
		background:transparent;
		border:none;
		outline:none;
	}

	.collection-page .modal-content iframe {
		border:none;
		padding:0;
		margin:0;
	}

	.collection-page .close {
		font-size: 40px;
		color: #fff;
		text-shadow:none;
		opacity:0.8;
	}

	.collection-page .close:hover {
		color:#fff;
		opacity:0.95;
	}

/* custom pages */

	.page-enable {
		max-width: 1550px;
		margin: auto;
		margin-bottom:20px;
	}

	.page-enable .collection-masthead .breadcrumb>li+li:before {
		color: #78a9c5;
	}

	.page-enable .collection-masthead .breadcrumb>.active {
		color: #78a9c5;
	}

	.page-enable .callout {
		margin-top:10px;
	}

	.page-enable .callout .title {
		margin-top:0;
	}

	.page-enable .callout a {
		font-weight: bold;
		color: #2980B9;
	}

	.page-enable .collection-masthead-special {
		background-position: top center;
		background-color: #184159;
	}

	.page-enable .masthead-cta {
		display:inline-block;
		padding:8px 25px;
		background: #27AF60;
		border-radius:3px;
		color: #fff;
		margin:10px auto 20px;
		font-family: 'Montserrat', sans-serif;
		text-transform: uppercase;
	}

	.page-enable .masthead-cta:hover {
		text-decoration:none;
	}

	.page-enable .callout-enable {
		border-left:3px solid #184359;
	}

	@media (min-width: 915px) {
		.page-enable #enable-about {
			background: url('https://lh3.googleusercontent.com/Tv_kfN0sfM513zj23wP6MrUsTmG3VR8hc4D7YnTmoooXYAQHrWpHcMp6HSSCNtIwjI31IzPUNSpCusoItDGv3BejoA=s301-fh') #F7F9F9 no-repeat right bottom;
			padding-right:245px;
		}
	}

	.page-enable .collection-masthead h1 {
		font-size:30px;
	}

	@media (min-width: 768px) {
		.page-enable .collection-masthead h1 {
			font-size:42px;
		}

	}

	.page-enable .collection-masthead h2 {
		font-size: 16px;
		line-height: 1.5;
		margin-top:5px;
		margin-bottom:15px;
	}

	@media (min-width: 768px) {
		.page-enable .collection-masthead h2 {
			font-size: 24px;
			line-height: 1.3;
		}
	}

	.page-enable .collection-masthead {
		padding-left:15px;
		padding-right:15px;
	}

	@media (min-width: 768px) {
		.page-enable .collection-masthead {
			padding-left:15px;
			padding-right:15px;
		}
	}

/* grid */

	.article-meta,
	.child-content {
		display:block;
		padding:7px 20px;
	}

	.child-image,
	.article-image {
		display:none;
	}

	@supports (display: grid) {
		.article-meta,
		.child-content {
			padding:0;
		}

		.child-image,
		.article-image {
			display:block;
		}
	}

	.page-collection .embed-youtube {
		margin-bottom:0;
	}

	.box {
		border-radius: 5px;
		width: 100%;
		color: #2C3D4F;
		font-size: 13px;
		border: 1px solid #e2e9e9;
		padding: 0;
		margin: 15px 0 5px;
		display: block;
		background-color: #F7F9F9;
	}

	.box--body {
		padding:20px;
	}

	.box--body button {
		display: inline-block;
		background: #2980b9;
		color: #fff;
		border: 2px solid #2980b9;
		padding: 12px 45px;
		font-family: 'Montserrat', sans-serif;
		border-radius: 5px;
		transition: all 0.2s ease-out;
		width: 100%;
	}

	.box--title {  /* maybe do things here */
		padding: 8px 20px;
		font-weight: bold;
		font-family: 'Roboto', sans-serif;
		font-size: 14px;
	}

	/*.js-product-title,*/
	/*.js-collection-title{*/
	/*	border-bottom-right-radius: 0;*/
	/*	border-bottom-left-radius: 0;*/
	/*	border-bottom-width: 0;*/
	/*}*/

	.box--title h2,
	.box--title h4 {
		margin:3px 0;
	}

	.box--title h2 {
		font-size: 18px;
	}

	@media (min-width: 1300px) {
		.page-content {
			display:grid;
			grid-template-columns: 1fr 360px;
			grid-template-areas: "products side";
			grid-column-gap: 20px;
		}
	}

	.page-content.page-content-main-only {
		grid-template-areas: initial;
		grid-template-columns: 1fr;
	}

	.video {
		margin-top:15px;
		margin-bottom:15px;
	}

	.side {
		padding-bottom:20px;
	}

	.box--content a.article,
	.box--content a.child {
		display: grid;
		grid-template-columns: 50px 1fr;
		grid-column-gap: 20px;
		margin-top:20px;
		text-decoration:none;
	}

	.box--content a.article:hover .article-title,
	.box--content a.child:hover .child-title {
		text-decoration:underline;
		color: #2980B9;
	}

	.box--content .article-desc,
	.box--content .child-desc {
		text-wrap: pretty;
		font-size: 13px;
		color: #828282;
		line-height: 1.42857143;
	}

	.box--content .article-title,
	.box--content .child-title {
		font-size: 14px;
		max-width: 100%;
		margin-top: 0;
		font-family: 'Montserrat', sans-serif;
		margin: 0 0 4px 0;
		color: #333;
		letter-spacing: -0.03px;
		line-height: 1.3;
	}

	.box--content .article-title {
		font-weight: bold;
	}

	.box--content .child-desc {
		display: block;
		width: 100%;
	}

	.box--content .article-image img,
	.box--content .child-image img {
		width:100%;
		max-width:100%;
		border-radius:5px;
		aspect-ratio: 1 / 1;
	}

	.box--content .article-image .article-image-icon,
	.box--content .child-image .article-image-icon {
		aspect-ratio: 1 / 1;  /* icons are square */
	}

	.box--content .article-image .article-image-default,
	.box--content .child-image .article-image-default {
		opacity:0.5;
		padding:10px;
		background-color: #AED6F1;
	}

	.box--content .child-image img {
		max-width:50px;
	}

	.page-read-description {
		color: #96989a;
	}

	.page-banner img {
		width:100%;
		height:100%;
	}

	.box--content a {
		color: #287FB8;
		text-decoration: underline;
	}

	.technical .box--content {
		margin-top:15px;
	}

	.box .status:empty,
	.box .status-error:empty,
	.box .status-warning:empty,
	.box .status-success:empty  {
		display: none; /* hides error message in form if empty */
	}

	.box .status {
		width: 100%;
		display: block;
		padding: 10px 20px;
		margin-bottom: 15px;
	}

	.box .status-error {
		border-top: 2px solid #BF3A2B;
		border-bottom: 2px solid #BF3A2B;
		background-color: #E74D3C;
		color: #fff;
	}

	.box .status-error a {
		color: #BF3A2B;
	}

	.box .status-warning {
		border-top:2px solid #E77E21;
		border-bottom:2px solid #E77E21;
		background-color: #F39C0F;
		color: #fff;
	}

	.box .status-warning a {
		color: #E77E21;
	}

	.box .status-success {
		border-top:2px solid #27AF60;
		border-bottom:2px solid #27AF60;
		background-color: #2ECC70;
		color: #fff;
	}

	.box .status-success a {
		color: #27AF60;
	}

	.child-content {
		display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6, BB7 */
		display: -ms-flexbox; /* TWEENER - IE 10 */
		display: -webkit-flex; /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
		display: flex; /* NEW, Spec - Firefox, Chrome, Opera */
		align-items: center;
		flex-wrap: wrap;
		align-content: center;
	}

	.secondary {
		display: block;
		background-color: #F7F9F9;
		padding: 30px;
		width:100%;
	}

	@media (min-width: 1200px) {
		.secondary {
			margin:20px 0;
		}
	}

	.secondary h2 {
		font-family:'Montserrat', sans-serif;
		font-size:16px;
		margin:0 0 10px;
		color:#4e5052;
		display:block;
	}

	.secondary-content {
		max-width: 960px;
		font-size: 12px;
		color: #727379;
	}

	/* collection landing pages */
	.page-collection.page-collection-landing .page-description {
		margin-bottom:0;
	}

	.page-collection.page-collection-landing.has-banner .page-description {
		margin-top:0;
	}

	.page-collection.page-collection-landing .box--content .child-desc {
		display:block;
		width:100%;
	}

	.page-collection.page-collection-landing .child-content {
		flex-wrap: wrap;
	}

	/* this logic only shows the first few collections on a collection page that is defined as a landing page */
	@media (min-width: 915px) and (max-width:1200px) {
		.page-collection.page-collection-truncate-subcollections .products-container .collection-single:nth-child(n+4) {
			display:none;
		}
	}

	@media (min-width: 1200px) {
		.page-collection.page-collection-truncate-subcollections .products-container .collection-single:nth-child(n+5) {
			display:none;
		}
	}

	.page-wrap {
		position: relative;
	}

	.collection-sidenav {
		position: sticky;
		max-height: calc(100vh - 30px);
		overflow-y: auto;
		top: 30px;
		bottom: 0;
	}

	.collection-checkbox{
		float: right; /* cached sidebars predating collection-filter-row keep their box on the right */
		accent-color: #006BC0;
	}

	.collection-checkbox:hover{
		cursor: pointer;
	}

	/* Filter rows (checkbox-first markup): hover and checked state paint the whole label
	   so the box and its collection name read as one control. */
	.sidebar ul label.collection-filter-row {
		grid-template-columns: 20px 1fr;
		grid-column-gap: 6px;
		align-items: center;
		padding: 2px 4px;
		border-radius: 3px;
		cursor: pointer;
	}

	.sidebar ul label.collection-filter-row .collection-checkbox {
		float: none;
		margin: 0;
	}

	.sidebar ul label.collection-filter-row:hover {
		background-color: #EAF4FB;
	}

	.sidebar ul label.collection-filter-row:hover .collection-checkbox {
		box-shadow: 0 0 0 2px #AED6F1;
		border-radius: 2px;
	}

	/* class kept in sync by syncFilterRowSelectedClass() in public-collections.js */
	.sidebar ul label.collection-filter-row-checked {
		background-color: #E3F0FA;
	}

	.sidebar ul label.collection-filter-row-checked:hover {
		background-color: #D9EBF8;
	}

	.collect-filter-clear-link{
		font-size: 10px;
		color: #065798;
		margin-left: 5px;
	}

	.collection-truncate{
		flex: 1;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}

	.collection-tag{
		border-radius: 5px;
		font-size: 10px;
		margin-left: 5px;
		border: 1px solid #AED6F1;
		display: inline-block;
		padding: 1px 3px 1px 3px;
		cursor: pointer;
	}

	.collection-tag:hover{
		border-color: #287FB8;
	}

	.collection-tag:hover .collection-tag-clear{
		color: #287FB8;
		font-weight: bold;
	}

	.collection-tag-clear{
		float: right;
		font-size: 10px;
		padding-left: 3px;
		color: #3498DB;
		font-weight: normal;
	}

	.collection-tag-clear:hover {
		font-weight: bold;
		color: #287FB8;
	}

	.collection-tag-list {
		display: inline-block;
		vertical-align: top;
	}

	.collection-sticky {
		position: sticky;
		top: 30px;
		z-index: 100;
	}

.dedicated-article .article-title {
	font-family: 'Montserrat', sans-serif;
	color: #333;
	font-weight: bold;
	text-decoration: underline;
	padding:15px;
	display:block;
}

.dedicated-article .article-title:hover {
	color: #2a6496;
}

.dedicated-article .dedicated-article-image {
	margin-top:10px;
	display:block;
}

.dedicated-article .dedicated-article-image img {
	width:100%;
	border-radius:3px;
	aspect-ratio: 45 / 19;
}

.collection-empty {
	/*border: 1px dashed #AF6D18;*/
	display: block;
	padding: 5px 20px;
	margin-top: 0;
	margin-bottom: 10px;
	border-radius: 5px;
	background: #FDF5E8;
	color: #AF6D18;
	font-size:12px;
}

/* Product Collection sort-by control - lives in the products title bar (.js-product-title),
   right-aligned opposite the filter results */
.collection-sort-controls {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-left: auto;
}

/* On Sale / Clearance toggles - sit in the same right slot, just left of the sort control. They take
   the auto margin when shown; the sort control keeps its own for cached HTML without the toggles and
   for pages where the whole group is hidden (nothing on the page carries either flag). Hidden state is
   a class, not inline display, so the sibling rule can key off it - an inline display:none would still
   match the sibling selector and steal the sort control's right alignment. public-collections.js
   reveals by removing the classes. */
.collection-flag-filters {
	display: flex;
	align-items: center;
	gap: 16px;
	margin-left: auto;
}

.collection-flag-filters-hidden,
.collection-flag-filter-hidden {
	display: none;
}

.collection-flag-filters:not(.collection-flag-filters-hidden) + .collection-sort-controls {
	margin-left: 16px;
}

.collection-flag-filter {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin: 0;
	color: #2C3D4F;
	font-size: 14px;
	font-weight: bold;
	cursor: pointer;
	white-space: nowrap;
}

.collection-flag-checkbox {
	margin: 0;
	cursor: pointer;
}

/* Cards a toggle filtered out. !important because the sidebar collection filter and the widget
   loaders show()/hide() cards inline, and the two filters have to compose rather than clobber */
.products-container .product-single.collection-flag-hidden {
	display: none !important;
}

/* The catalog table under the grid: the collection's SKUs with no product card, in the IsCatalog
   page's table (its rules come from public-brand-catalog.css, linked only when the table renders).
   Rows filter and hide like cards. The section ships with an inline display:none while the feature
   is dark (rendered, styled and wired, not shown; reveal on a live page with
   document.getElementById('jsCollectionCatalog').style.display = ''), so the JS states are classes:
   -empty when a toggle hides every row, -filtered while the sidebar collection filter shows other
   collections' items. !important so they win over that inline style either way. */
.collection-catalog {
	margin-top: 30px;
	padding: 0 15px;
}

.collection-catalog .catalog-item.collection-flag-hidden,
.collection-catalog.collection-catalog-empty,
.collection-catalog.collection-catalog-filtered {
	display: none !important;
}

.collection-sort-controls label {
	margin: 0;
	color: #2C3D4F;
	font-size: 14px;
	font-weight: bold;
}

.collection-sort-dropdown {
	padding: 5px 10px;
	min-width: 175px;
	color: #2C3D4F;
	background: #FFF;
	border: 1px solid #e2e9e9;
	border-radius: 5px;
	box-shadow: 1px 1px 0px 0px #e6e6e6;
	font-family: 'Montserrat', sans-serif;
	font-size: 14px;
}

@media screen and (max-width: 767px) {
	/* Stack the title bar: filter summary on top, sort control on its own row -
	   one shared row squeezes the filter text and chips into wrapping */
	.js-product-title {
		flex-wrap: wrap;
		row-gap: 8px;
	}

	.collection-flag-filters,
	.collection-sort-controls {
		flex: 1 1 100%;
	}

	.collection-flag-filters:not(.collection-flag-filters-hidden) + .collection-sort-controls {
		margin-left: auto;
	}

	.collection-sort-controls {
		justify-content: space-between;
	}

	.collection-sort-dropdown {
		min-width: 0;
		flex: 1 1 auto;
	}
}

/* Product Collection sidebar mobile filtering */
.sidebar-button {
	display: none;
}

.sidebar-close-button {
	display: none;
}

@media screen and (max-width: 767px) { /* hide sidebar on revised handler when shrunk */
	.sidebar-button {
		display: block;
		padding: 5px 10px;
		margin: 5px 0;
		color: #2C3D4F;
		background: #FFF;
		border: 1px solid #e2e9e9;
		border-radius: 5px;
		font-family: 'Montserrat', sans-serif;
		font-size: 14px;
		font-weight: bold;
		letter-spacing: 0.5px;
		line-height: 1.5em;
		text-transform: uppercase;
	}

	.sidebar-button:hover {
		background: #F7F9F9;
	}

	.sidebar-button svg {
		width: 16px;
		height: 16px;
		position: relative;
		top: 3px;
	}

	.sidebar {
		display: none;
		position: fixed !important;
		top: 68px !important;
		bottom: 0;
		overflow-y: scroll;
		z-index: 9999;
		height: 100%;
		width: calc(100% - 30px);
		margin: 0 !important;
		background-color: #fff;
		border: 1px solid #e2e9e9;
		padding: 10px 0 10px 10px;
		border-radius: 5px;
		padding-bottom: 50px;
	}

	.sidebar-close-button {
		position: absolute;
		top: 7px;
		right: 7px;
		width: 32px;
		height: 32px;
		/*background: #e5e5e5;*/
		border: none;
		border-radius: 5px;
		cursor: pointer;
		display:inline-block;
	}
	.sidebar-cta-header {
		display: inline-block;
		width: calc(100% - 50px);
	}
}