@media ( max-width: 1000px ) {


	/* Site Header ---------------------------- */

	.site-header .section-inner {
		padding: 25px 15%;
		width: 100%;
	}

	.site-header .header-titles {
		max-width: 100%;
	}

	.site-header .custom-logo-link img {
		margin-bottom: -10px;
		margin-top: -10px;
		max-height: 55px;
		object-fit: contain;
	}

	.site-header .site-title {
		font-size: 28px;
	}

	.site-header .site-description,
	.header-search,
	.header-account,
	.social-menu.header {
		display: none;
	}

	.header-cart {
		right: 5%;
	}


	/* Site Navigation ---------------------------- */

	.site-nav {
		display: none;
	}

	/* NAVIGATION TOGGLE */

	.nav-toggle {
		cursor: pointer;
		display: block;
		position: absolute;
			bottom: 0;
			left: 0;
			top: 0;
		width: calc( 10% + 24px );
		z-index: 1001;
	}

	.nav-toggle .bar {
		background-color: #111;
		display: block;
		height: 2px;
		position: absolute;
			left: calc( 50% - 12px );
			top: calc( 50% - 1px );
		transition: transform .15s ease-in, background-color .15s ease-in .7s, opacity 0s .15s, width 0s .15s, margin .15s ease-out .15s;
		width: 24px;
	}
	
	.nav-toggle .bar:nth-child(1) { margin-top: -7px; }
	.nav-toggle .bar:nth-child(2) { margin-top: -1px; width: 16px; }
	.nav-toggle .bar:nth-child(3) { margin-top: 5px; width: 20px; }
	
	.nav-toggle.active .bar {
		background: #fff;
		transition: margin .15s ease-in, opacity 0s .15s, width 0s .15s, background-color .2s ease-in, transform .15s ease-out .2s;
	}
	
	.nav-toggle.active .bar:nth-child(1) {
		margin-top: -1px;
			-webkit-transform: rotate( 45deg );
		transform:             rotate( 45deg );
	}
	
	.nav-toggle.active .bar:nth-child(2) {
		opacity: 0;
		width: 24px;
	}
	
	.nav-toggle.active .bar:nth-child(3) {
		margin-top: -1px;
			-webkit-transform: rotate( -45deg );
		transform:             rotate( -45deg );
		width: 24px;
	}

	/* CONTENT OVERLAY */

	.mobile-nav-content-overlay {
		display: block;
		opacity: 0;
		position: fixed;
			bottom: 0;
			left: -9999px;
			right: 9999px;
			top: 0;
		transition: opacity .2s ease-in .7s, left 0s .9s, right 0s .9s;
		z-index: 1000;
	}

	body.showing-mobile-menu .mobile-nav-content-overlay {
		left: 0;
		opacity: 1;
		right: 0;
		transition: opacity .15s ease-out;
	}

	/* BODY INNER */

	.body-inner {
		background: #111;
		transition: transform .3s ease-in .4s;
		width: 100%;
	}

	body.showing-mobile-menu .body-inner {
		transform: translateX( calc( 90% - 24px ) );
	}


	/* MOBILE MENU */

	.mobile-menu-wrapper {
		background: #fff;
		box-shadow: 0 0 30px rgba( 0, 0, 0, 0.15 );
		display: block;
		overflow: auto;
		position: fixed;
			bottom: 0;
			right: 9999px;
			top: 0;
		transition: transform .3s ease-in .4s, right 0s .7s;
		width: calc( 90% - 24px );
		z-index: 1002;
	}

	.mobile-menu-wrapper.visible {
		right: 100%;
		transform: translateX( 100% );
		transition: transform .3s ease-in .4s;
	}

	/* MOBILE SEARCH */

	.mobile-search {
		position: relative;
		z-index: 10;
	}

	.mobile-search label,
	.mobile-search .cancel-search {
		margin: 0;
		position: absolute;
			bottom: 1px;
			right: 0;
			top: 0;
		width: calc( 10vw + 21px );
	}

	.mobile-search label {
		background: url( ../svg/spyglass-black.svg ) no-repeat center 49%;
		background-size: auto 20px;
		cursor: text;
	}

	.mobile-search .cancel-search {
		background: #fff url( ../svg/cross-black.svg ) no-repeat center 49%;
		background-size: auto 16px;
		cursor: pointer;
		opacity: 0;
		right: 9999px;
		transition: opacity .15s linear, right 0s .15s;
	}

	.mobile-search.search-active .cancel-search {
		opacity: 1;
		right: 0;
		transition: opacity .15s linear;
		z-index: 1;
	}

	#mobile-search-field {
		border: none;
		border-bottom: 1px solid #e1e1e5;
		border-radius: 0;
		font-size: 16px;
		font-weight: 500;
		height: 86px;
		margin: 0;
		padding-left: 5vw;
		padding-right: calc( 10vw + 21px );
	}

	#mobile-search-field::-webkit-input-placeholder { color: inherit; }
	#mobile-search-field:-ms-input-placeholder { color: inherit; }
	#mobile-search-field::-moz-placeholder { color: inherit; }

	.mobile-search .compact-search-results {
		background: #fff;
		display: none;
		height: calc( 100vh - 100% );
		overflow: auto;
		padding-bottom: 60px;
		position: absolute;
			left: 0;
			right: 0;
			top: 100%;
	}

	.mobile-search .compact-search-results.active {
		display: block;
	}

	.mobile-search .no-results-message,
	.mobile-search .compact-search-results ul {
		padding-left: 5vw;
		padding-right: 5vw;
	}

	.mobile-search .compact-search-results .show-all {
		border-top: 1px solid #e1e1e5;
		position: fixed;
			bottom: 0;
			left: 0;
			right: 0;
	}

	/* MOBILE MENU */

	.mobile-menu,
	.mobile-menu ul {
		margin: 0;
	}

	.mobile-menu {
		background: #F5F5F7;
		padding: 10px 0;
	}

	.mobile-menu a {
		display: block;
		padding: 20px 5vw;
	}

	.mobile-menu > li > a,
	.mobile-menu > li > div > a {
		font-family: Newsreader, Georgia, serif;
		font-size: 22px;
	}

	.mobile-menu .current-menu-item > a,
	.mobile-menu .current-menu-item > div > a {
		text-decoration: underline;
	}

	.menu-toggle-wrapper {
		padding-right: 54px;
		position: relative;
	}

	.menu-toggle-wrapper .sub-nav-toggle {
		cursor: s-resize;
		position: absolute;
			bottom: 0;
			right: 0;
			top: 0;
		width: 54px;
	}

	.menu-toggle-wrapper .sub-nav-toggle:before {
		background: url( ../svg/chevron-down-black.svg ) no-repeat center;
		background-size: 12px auto;
		content: "";
		display: block;
		position: absolute;
			bottom: calc( 50% - 5px );
			left: calc( 50% - 6px );
		transition: transform .3s linear;
		height: 10px;
		width: 12px;
	}

	.menu-toggle-wrapper .sub-nav-toggle.active {
		cursor: n-resize;
	}

	.menu-toggle-wrapper .sub-nav-toggle.active:before {
		transform: rotate( 180deg );
	}

	.mobile-menu ul {
		background: rgba( 0, 0, 35, .04 );
		display: none;
		padding: 10px 0;
	}

	.mobile-menu ul a {
		font-size: 16px;
		font-weight: 500;
		padding: 18px 5vw;
	}

	.mobile-menu ul ul {
		margin: 8px 0;
	}

	.mobile-menu ul ul a { padding-left: 7.5vw;}
	.mobile-menu ul ul ul a { padding-left: 10vw;}
	.mobile-menu ul ul ul ul a { padding-left: 12.5vw;}
	.mobile-menu ul ul ul ul ul a { padding-left: 15vw;}
	.mobile-menu ul ul ul ul ul ul a { padding-left: 17.5vw;}

	/* MOBILE SOCIAL MENU */

	.mobile.social-menu {
		border-bottom: 1px solid #e1e1e5;
		border-top: 1px solid #e1e1e5;
		display: flex;
		padding: 0 calc( 5vw - 15px );
	}

	.mobile.social-menu a {
		display: block;
		padding: 20px 15px;
	}

	.mobile.social-menu a:before {
		font-size: 24px;
	}

	.mobile.social-menu a:hover {
		opacity: 0.5;
		text-decoration: none;
	}


}


@media ( max-width: 900px ) {

	/* Front Page ---------------------------- */

	.front-promo-banner {
		grid-template-columns: 1fr;
	}

	/* Front Page ---------------------------- */

	.front-page-content {
		padding: 70px 0;
	}

	.front-blog-grid {
		grid-template-columns: repeat( 2, minmax( 0, 1fr ) );
	}

	.blog-index-grid {
		grid-template-columns: repeat( 2, minmax( 0, 1fr ) );
	}

	.front-page-section + .front-page-section {
		margin-top: 70px;
	}

	.front-page-section__header h2,
	.front-promo-banner h2 {
		font-size: 34px;
	}

	.front-category-card__content,
	.front-blog-card__content,
	.front-promo-banner__content {
		padding: 24px;
	}

	.front-brand-slider__link {
		height: 88px;
		padding: 16px 22px;
		width: 160px;
	}

	.about-page-intro {
		gap: 30px;
		grid-template-columns: 1fr;
	}

	.about-page-layout {
		gap: 28px;
		grid-template-columns: 1fr;
	}

	.about-page-menu {
		position: static;
	}

	.about-page-content ul {
		grid-template-columns: 1fr;
	}

	.contact-page-layout {
		grid-template-columns: 1fr;
	}

	.about-page-intro__content h2 {
		font-size: 36px;
	}


	/* Page Content ---------------------------- */

	.page-content .alignnone {
		margin-left: 0;
		margin-right: 0;
		max-width: 100% !important;
	}

	.page-content .alignleft {
		margin-left: 0;
	}

	.page-content .alignright {
		margin-right: 0;
	}


}


@media ( max-width: 600px ) {

	/* Front Page ---------------------------- */

	.front-blog-grid {
		grid-template-columns: 1fr;
	}

	.blog-index-grid {
		grid-template-columns: 1fr;
	}

	.front-brand-slider__viewport {
		padding: 18px 0;
	}

	.front-brand-slider__track {
		gap: 12px;
	}

	.front-brand-slider__link {
		border-radius: 16px;
		height: 78px;
		padding: 14px 18px;
		width: 138px;
	}

	.front-brand-slider__link img {
		max-height: 42px;
	}

	.about-page-intro {
		margin-bottom: 40px;
	}

	.about-page-content {
		font-size: 17px;
	}

	.about-page-menu__nav {
		border-radius: 18px;
		padding: 14px;
	}

	.about-page-menu__link {
		padding: 14px 16px;
	}

	.about-page-content > p:first-of-type {
		margin-bottom: 28px;
	}

	.about-page-content h2 {
		margin-top: 42px;
	}

	.about-page-content blockquote {
		margin: 32px 0;
		padding-left: 18px;
	}

	.contact-page-layout {
		gap: 20px;
		margin-bottom: 40px;
	}

	.contact-page-layout__form,
	.contact-page-store {
		border-radius: 18px;
		padding: 24px;
	}

	.about-page-intro__content p {
		font-size: 17px;
	}

	.contact-page-store__body {
		font-size: 16px;
	}

}


