/* 
	Copyright 2022: Vy Technology, LLC

	PRIMARY COLOR: 		#2E3527   - #2.22222   - Cast Iron
	SECONDARY COLOR: 	#2E3527   - #4.15849   - Chives
	TERTIARY COLOR:		#707070   - #F.2E8D1   - Garlic
	HIGLIGHT COLOR:		#DEE2E3   - #D.EE3DE   - Mineral Green
	LIGHT GRAY:			#F5F5F5   - #F.5F5F5   - Blanc Gris
	DARK GRAY: 			#E5E5E5   - #E.5E5E5   - Dark Grey

	Z-INDEXES
	popup: 6000
	header: 5000
	cart: 3000
	filters: 2500
	customize-title: 2400
	shop: 2000
	odd elements < 1000
*/

/******* FONTS *******/
@font-face{
	font-family:"Cambon Demi";
	src:url("/_home/Fonts/Cambon/Cambon-Demi.woff2") format("woff2"),url("/_home/Fonts/Cambon/Cambon-Demi.woff") format("woff");
}

@font-face{
	font-family:"Spezia Narrow Medium";
	src:url("/_home/Fonts/Spezia/Spezia_Web_NarrowMedium/SpeziaNarrowWeb-Medium.woff2") format("woff2"),url("/_home/Fonts/Spezia/Spezia_Web_NarrowMedium/SpeziaNarrowWeb-Medium.woff") format("woff");
}

@font-face{
	font-family:"Dom Diagonal W03 Rg";
	src:url("/_home/Fonts/Dom/1296156/c934d040-1755-48c8-b852-fe0ff62c29c6.woff2") format("woff2"),url("/_home/Fonts/Dom/1296156/6b649757-347c-4b04-bb85-06489dbe2e29.woff") format("woff");
}


/******* BODY *******/
body {
	font-family: "Cambon Demi", "Times New Roman", "Georgia", serif;
	font-weight: normal;
	margin: 0;
	font-size: 11pt;
	line-height: 18pt;
	color: #FFFFFF;
	height: 100%;
		-webkit-text-size-adjust: 100%;
	box-sizing: border-box;
	min-height: 100vh;
}


/******* SITE LAYOUT *******/

header, section, aside, footer {
	margin: 0;
	color: #2E3527;
}

main {
	background: inherit;
	background-color: #FFFFFF; /* This may create issues, if you take this out, you have issues on wide screen contact page */
}

header {
	background: inherit;
	color: #FFFFFF;
	width: 100%;
	position: sticky;
  	top: 0;
	z-index: 5001;
}

/* This is only to be used for flex-containers when it needs to be used for mobile too, usually used in conjunction with .mobile-break - the main .flex-container is in screen.css */
.flex-container-mobile {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	align-content: flex-start;
}

	/* I don't know why, but this has to be in both this and screens.css to work correctly - if you change this, change screens.css */
	.flex-backwards {
		flex-direction: row-reverse;
	}

	.flex-column {
		flex-direction: column;
	}

	/* I don't know why, but this has to be in both this and screens.css to work correctly - if you change this, change screens.css */
	.flex-items-stretch {
		align-items: stretch;
	}

	/* I don't know why, but this has to be in both this and screens.css to work correctly - if you change this, change screens.css */
	.flex-items-center {
		align-items: center;
	}

	/* I don't know why, but this has to be in both this and screens.css to work correctly - if you change this, change screens.css */
	.flex-items-baseline {
		align-items: baseline;
	}

	.flex-items-bottom {
		align-items: flex-end;
	}

	.flex-items-space-between {
		justify-content: space-between;
	}

	.flex-items-center-horizontal {
		justify-content: center;	
	}
	
	.flex-items-space-between-vertical {
		align-content: space-between;
	}

section.content {
	flex: 1;
}

	section.full-screen-wrapper {
		align-self: stretch; 
		min-height: 100%;
		padding: 0;
		margin: 0;
	}

	section.non-fullscreen, div.non-fullscreen {
		max-width: 1440px;
		margin-left: auto;
		margin-right: auto;
	}

	div.page-background { background-color: #E5E5E5; }

div.full-screen {
	width: 100%;
}

	div.full-screen div.max-1440 {
		max-width: 1440px;
		margin-left: auto;
		margin-right: auto;
	}

		div.full-screen div.max-1440 section {
			padding: 10px;
		}

		div.full-screen div.max-1440 section.full-screen-fill-image {
			padding: 0;
		}

footer {
	/*position: fixed;
	bottom: 0;*/
	background: inherit;
	color: #FFFFFF;
	width: 100%;
}

.break {
	flex-basis: 100%;
	height: 0;
	padding: 0;
	margin: 0;
}

	.mobile-break {
		flex-basis: 100%;
		height: 0;
		padding: 0;
		margin: 0;
		margin-bottom: 20px;
	}
	
.wrapper {
	margin: auto;
	/*min-height: 100%;
	height: 100%;
	max-width: 60rem;*/	/* 60rem = 960px usually - https://pixelsconverter.com/px-to-rem */
}

.maker-full-page {
	margin-top: -50px;
}

/******* SITE THEME *******/

.dom { font-family: "Dom Diagonal W03 Rg", Helvetica, Arial, sans-serif; }

.brabo { font-family: "Cambon Demi", "Times New Roman", "Georgia", serif; }

	.brabo-bold { font-family: "Cambon Demi", "Times New Roman", "Georgia", serif; font-weight: 700; }

	.brabo-light { font-family: "Cambon Demi", "Times New Roman", "Georgia", serif; font-weight: 300; }

.proxima-nova {	font-family: "Spezia Narrow Medium", Helvetica, Arial, sans-serif; }

	.proxima-nova-bold { font-family: "Spezia Narrow Medium", Helvetica, Arial, sans-serif; font-weight: 700; }

	.proxima-nova-semi-bold { font-family: "Spezia Narrow Medium", Helvetica, Arial, sans-serif;  font-weight: 600;}
	
	.proxima-nova-light { font-family: "Spezia Narrow Medium", Helvetica, Arial, sans-serif; font-weight: 300; }

.dom-diagonal { font-family:"Dom Diagonal W03 Rg"; }

a, .a, ins {
	color: #2E3527;
	border-style: solid;
	text-decoration: none;
	/*font-weight: bold;*/	/* We do this because this looks really bad being "double bolded" in Safari*/
}

	a:hover { color: #2E3527; }

	a.traditional {
		color: #2E3527;
		text-decoration: underline;
	}

		a.traditional:hover {
			color: #2E3527;
		}

	a.reverse {
		color: #2E3527;
	}

		a.reverse:hover {
			color: #2E3527;
		}
	
	a.cast-iron {
		color: #2E3527;
	}

	a.white { color: #FFFFFF; }

		a.white:hover { color: #FFFFFF; }

.b { color: #2E3527; }

rect.hamburger { fill: #2E3527; }

h1, .h1, h2, .h2, h3, .h3 {
	font-family: "Cambon Demi", "Times New Roman", "Georgia", serif;
	font-weight: 700;
	line-height: normal;
	color: #2E3527;
}

	h1 a, .h1 a, h2 a, .h2 a, h3 a, .h3 a {
		font-weight: normal;
		border: 0;
		text-decoration: none;
	}

	h1, .h1 {
		font-size: 28pt;
	}

	h2, .h2 {
		font-size: 36pt;
	}

	h3, .h3 {
		font-size: 15pt;
	}

ol, ul {
	padding-left: 40px;
}

	ol { list-style: decimal; }

	ul { list-style: disc; }

		li { margin-bottom: 10px; }

th { text-align: left; }

button, a.button, span.button-coming-soon {
	font-family: 'Spezia Narrow Medium', Helvetica, Arial, sans-serif;;
	font-size: 16px;
	line-height: 22px;
	text-transform: uppercase;
	background-color: #2E3527;
	color: #FFFFFF;
	border-radius: 4px;
	padding: 1em 3em;
	border: 0;
	-webkit-appearance: none;
		-moz-appearance: none;
		appearance: none;
	text-decoration: none;
	cursor: pointer;
}

	a.small-button {
		padding: .5em 3em;
	}

	a.button-mobile-padding {
		padding-left: 0;
		padding-right: 0;
	}

	a.button-mobile-small {
		font-size: 14px;
	}

	button.inverted {
		border: 2px solid #2E3527;
		background-color: #FFFFFF;
	}

		button.inverted:hover {
			border-color: #2E3527;
		}

	a.button-white, a.button-white-with-border {
		font-family: 'Spezia Narrow Medium', Helvetica, Arial, sans-serif;
		font-weight: 700;
		border: 2px solid #FFFFFF;
		background-color: #FFFFFF;
		color: #2E3527;
		padding: 1em 3em;
	}

		a.button-white-with-border {
			border-radius: 4px;
			border: 2px solid #2E3527;
		}

	a.button-white-transparent {
		font-family: 'Spezia Narrow Medium', Helvetica, Arial, sans-serif;
		font-weight: 600;
		border: 2px solid #FFFFFF;
		background-color: transparent;
		color: #FFFFFF;
		padding: 1em 3em;
	}

		a.button-white-transparent:hover {
			background-color: #FFFFFF;
			color: #2E3527;
		}

	a.button-green-transparent, a.button-green-transparent-small-rounded, a.button-green-transparent-extra-small-rounded {
		font-family: 'Spezia Narrow Medium', Helvetica, Arial, sans-serif;
		font-weight: 600;
		border: 2px solid #2E3527;
		background-color: transparent;
		color: #2E3527;
		padding: 1em 3em;
	}

		a.button-green-transparent-small-rounded {
			padding: .5em 3em;
			border-radius: 4px;
		}

		a.button-green-transparent-extra-small-rounded {
			padding: .5em 1em;
			border-radius: 4px;
		}

	a.button-garlic {
		font-family: "Cambon Demi", "Times New Roman", "Georgia", serif;
		font-weight: 700;
		border: 2px solid #707070;
		background-color: #707070;
		color: #2E3527;
	}

		a.button-garlic:hover {
			border: 2px solid #2E3527;
			background-color: #2E3527;
			color: #707070;
		}

	a.button-gray {
		background-color: #F5F5F5;
		color: #2E3527;
	}

	a.button-disabled {
		background-color: #525252;
		cursor: default;
	}

	a.button-50 {
		width: 50%;
	}

	a.button-rounded {
		border-radius: 4px;
	}

input, textarea, select {
	color: #2E3527;
	font-family: 'Spezia Narrow Medium', Helvetica, Arial, sans-serif;
	font-size: 16pt;
	border: 2px solid #2E3527;
	padding: 3px 5px;
	margin: 0;
	margin-bottom: 20px;
	box-sizing: border-box;
	width: 100%;
	border-radius: 4px;
}

	input:disabled, textarea:disabled, select:disabled {
		color: #2E3527;
		background-color: #FFFFFF;
		opacity: 0.7;
	}

		input[type=number]::-webkit-inner-spin-button, 
		input[type=number]::-webkit-outer-spin-button { 
			-webkit-appearance: none; 
		}
		
		input[type=number] {
			-moz-appearance: textfield;
		}

	textarea {
		height: 130px;
		max-width: 940px;
	}

	select {
		padding: 2px 4px;
	}

		select.select-popup {
			padding: 10px 4px;
			border: 2px solid #E5E5E5;
		}

		.select2-results__options {
			color: #2E3527;
		}

		li.select2-selection__choice {
			margin: 0;
			font-size: 16px;
		}

	input[type="file"] {
		font-size: 12pt;
	}

	input[type="checkbox"] {
		width: 20px;
		margin: 3px 5px 3px 20px;
	}

	input[type="radio"] {
		width: inherit;
		margin: inherit;
		margin-right: 20px;
		transform: scale(2);
		accent-color: #2E3527;
	}

	input.calendar {
		background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2220%22%20height%3D%2222%22%20viewBox%3D%220%200%2020%2022%22%3E%3Cpath%20id%3D%22Path_29038%22%20data-name%3D%22Path%2029038%22%20d%3D%22M12%2C19a1%2C1%2C0%2C1%2C0-1-1A1%2C1%2C0%2C0%2C0%2C12%2C19Zm5%2C0a1%2C1%2C0%2C1%2C0-1-1A1%2C1%2C0%2C0%2C0%2C17%2C19Zm0-4a1%2C1%2C0%2C1%2C0-1-1A1%2C1%2C0%2C0%2C0%2C17%2C15Zm-5%2C0a1%2C1%2C0%2C1%2C0-1-1A1%2C1%2C0%2C0%2C0%2C12%2C15ZM19%2C3H18V2a1%2C1%2C0%2C1%2C0-2%2C0V3H8V2A1%2C1%2C0%2C1%2C0%2C6%2C2V3H5A3%2C3%2C0%2C0%2C0%2C2%2C6V20a3%2C3%2C0%2C0%2C0%2C3%2C3H19a3%2C3%2C0%2C0%2C0%2C3-3V6A3%2C3%2C0%2C0%2C0%2C19%2C3Zm1%2C17a1%2C1%2C0%2C0%2C1-1%2C1H5a1%2C1%2C0%2C0%2C1-1-1V11H20ZM20%2C9H4V6A1%2C1%2C0%2C0%2C1%2C5%2C5H6V6A1%2C1%2C0%2C0%2C0%2C8%2C6V5h8V6a1%2C1%2C0%2C0%2C0%2C2%2C0V5h1a1%2C1%2C0%2C0%2C1%2C1%2C1ZM7%2C15a1%2C1%2C0%2C1%2C0-1-1A1%2C1%2C0%2C0%2C0%2C7%2C15Zm0%2C4a1%2C1%2C0%2C1%2C0-1-1A1%2C1%2C0%2C0%2C0%2C7%2C19Z%22%20transform%3D%22translate%28-2%20-1%29%22%2F%3E%3C%2Fsvg%3E");
		background-size: .8em;
		background-position: calc(100% - 1.3em) center;
		background-repeat: no-repeat;
	}

	input.dollar-sign {
		background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20version%3D%221.1%22%20id%3D%22Capa_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20x%3D%220px%22%20y%3D%220px%22%09%20viewBox%3D%220%200%20235.517%20235.517%22%20style%3D%22enable-background%3Anew%200%200%20235.517%20235.517%3B%22%20xml%3Aspace%3D%22preserve%22%3E%3Cg%3E%09%3Cpath%20style%3D%22fill%3A%23010002%3B%22%20d%3D%22M118.1%2C235.517c7.898%2C0%2C14.31-6.032%2C14.31-13.483c0-7.441%2C0-13.473%2C0-13.473%09%09c39.069-3.579%2C64.932-24.215%2C64.932-57.785v-0.549c0-34.119-22.012-49.8-65.758-59.977V58.334c6.298%2C1.539%2C12.82%2C3.72%2C19.194%2C6.549%09%09c10.258%2C4.547%2C22.724%2C1.697%2C28.952-8.485c6.233-10.176%2C2.866-24.47-8.681-29.654c-11.498-5.156-24.117-8.708-38.095-10.236V8.251%09%09c0-4.552-6.402-8.251-14.305-8.251c-7.903%2C0-14.31%2C3.514-14.31%2C7.832c0%2C4.335%2C0%2C7.843%2C0%2C7.843%09%09c-42.104%2C3.03-65.764%2C25.591-65.764%2C58.057v0.555c0%2C34.114%2C22.561%2C49.256%2C66.862%2C59.427v33.021%09%09c-10.628-1.713-21.033-5.243-31.623-10.65c-11.281-5.755-25.101-3.72-31.938%2C6.385c-6.842%2C10.1-4.079%2C24.449%2C7.294%2C30.029%09%09c16.709%2C8.208%2C35.593%2C13.57%2C54.614%2C15.518v13.755C103.79%2C229.36%2C110.197%2C235.517%2C118.1%2C235.517z%20M131.301%2C138.12%09%09c14.316%2C4.123%2C18.438%2C8.257%2C18.438%2C15.681v0.555c0%2C7.979-5.776%2C12.651-18.438%2C14.033V138.12z%20M86.999%2C70.153v-0.549%09%09c0-7.152%2C5.232-12.657%2C18.71-13.755v29.719C90.856%2C81.439%2C86.999%2C77.305%2C86.999%2C70.153z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
		background-size: .8em;
		background-position: .5em center;
		background-repeat: no-repeat;
	}

	input#Submit, input#Submit2, input#Submit-Mobile {
		font-family: 'Spezia Narrow Medium', Helvetica, Arial, sans-serif;
		font-weight: 600;
		border: 2px solid #2E3527;
		padding: 5px 10px;
		background-color: #FFFFFF;
		width: 100%;
	}

		input.inverted, input#Submit.inverted, input#Submit2.inverted, input#Submit-Mobile.inverted {
			color: #FFFFFF;
			background-color: #2E3527;
		}

			input.inverted:hover, input#Submit.inverted:hover, input#Submit2.inverted:hover {
				background-color: #2E3527;
			}

	select.minimal-select {
		font-family: "Spezia Narrow Medium", Helvetica, Arial, sans-serif;
		font-size: 11pt;
		color: #2E3527;
		border: 0;
		padding: 0;
		margin: 0;
		font-weight: normal;
		background: inherit;
	}

	.custom-select {
		position: relative;	/* The container must be positioned relative */
		font-family: 'Spezia Narrow Medium', Helvetica, Arial, sans-serif;
	}

		.custom-select select, .custom-select div#CustomSelectOnClick, .custom-select .custom-select-on-click {
			display: none;
		}

		.select-selected {
			text-align: center;
			margin-top: 10px;
			border-radius: 4px;
			background-color: #2E3527;
			font-size: 16px;
			font-style: normal;
			font-weight: 700;
			line-height: normal;
			background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2218%22%20height%3D%2213%22%20viewBox%3D%220%200%2018%2013%22%20fill%3D%22none%22%3E%3Cpath%20d%3D%22M9%2012.3954L0%202.53424L1.6125%200.767456L9%208.90288L16.3875%200.808544L18%202.57533L9%2012.3954Z%22%20fill%3D%22%23F9F9F7%22%2F%3E%3C%2Fsvg%3E");
			background-repeat: no-repeat;
			background-position: right 20px center;
		}

			#ShopMain .vendor-item-order-date .select-selected { 
				margin-top: 0; 
				background-position: right 10px center;
				font-size: 14px;
				font-weight: 500;
			}

			#ShopMain .shop-item-action .select-selected {
				font-size: 14px;
				margin-top: -23px;
				/*margin-bottom: 19px;*/ /*We remove this for PLP, may cause problems for PDP*/
				padding: 5px 30px 5px 10px;
				background-position: right 5px center;
			}

		/* Style the arrow inside the select element: */
		.select-selected:after {
			position: absolute;
			content: "";
			top: 14px;
			right: 10px;
			width: 0;
			height: 0;
			/*border: 6px solid transparent;
			border-color: #fff transparent transparent transparent;*/
		}

		/* Point the arrow upwards when the select box is open (active): */
		.select-selected.select-arrow-active:after {
			/*border-color: transparent transparent #fff transparent;
			top: 7px;*/
		}

		/* style the items (options), including the selected item: */
		.select-items div, .select-selected {
			text-align: center;
			color: #FFFFFF;
			padding: 8px 16px;
			cursor: pointer;
		}

			#ShopMain .vendor-item-order-date .select-selected {
				padding: 7px 40px 6px 20px;
			}

			.select-items div { 
				color: #2E3527;
				font-size: 16px;
				font-style: normal;
				font-weight: 700;
				line-height: normal;
				background-color: #FFFFFF;
				border-bottom: 1px solid #B1B7BD;
			}

				#ShopMain .shop-item-action .select-items div {
					font-size: 14px;
					padding: 5px 0;
				}

				#ShopMain .vendor-item-order-date .select-items div {
					padding: 7px 0 6px 0;
					font-size: 14px;
					font-weight: 500;
				}

				.select-items div:before { 
					border-bottom: 1px solid #B1B7BD;
					width: 75%;
				}

				.select-items div:last-child { 
					border-bottom-left-radius: 4px;
					border-bottom-right-radius: 4px;
					border-bottom: none;
				}

		/* Style items (options): */
		.select-items {
			position: absolute;
			top: 105%;
			left: 0;
			right: 0;
			z-index: 99;
			border: 2px solid #2E3527;
			border-radius: 4px;
		}

			#ShopMain .item-order-date-selection .select-items { z-index: 2001; }

		/* Hide the items when the select box is closed: */
		.select-hide {
			display: none;
		}

		.select-items div:hover, .same-as-selected {
			background-color: #F2F2F2;
		}

svg.quantity-toggle-desktop-plus rect, svg.quantity-toggle-desktop-pair-plus rect, svg.quantity-toggle-desktop-pair-minus rect, svg.quantity-toggle-mobile-pair rect, svg.quantity-toggle-mobile-pair-plus rect, svg.quantity-toggle-mobile-pair-minus rect {
	fill: #2E3527;
}

	svg.quantity-toggle-desktop-plus rect:hover, svg.quantity-toggle-desktop-pair-plus rect:hover, svg.quantity-toggle-desktop-pair-minus rect:hover, svg.quantity-toggle-mobile-pair rect:hover, svg.quantity-toggle-mobile-pair-plus rect:hover, svg.quantity-toggle-mobile-pair-minus rect:hover {
		opacity: .75;
	}

div.div-button-container {
	z-index: 5000;
	display: flex;
	align-items: stretch;
	justify-content: space-between;
	gap: 5px;
	padding: 0 5px;
	max-height: 37px;
	width: calc(100% - 10px);
	position: absolute;	/* Make sure parent div is relative */
	z-index: 2001;
	bottom: 15px;
}

	div.plus-div-button, div.minus-div-button, div.full-div-button, div.transparent-div-button {
		flex-grow: 1;
		background-color: rgb(46, 53, 39, .90);
		border-radius: 5px;
		width: 100px;
		height: 37px;
		text-align: center;
		vertical-align: middle;
		color: #FFFFFF;
		font-family: "Spezia Narrow Medium", Helvetica, Arial, sans-serif;
		font-size: 12px;
		cursor: pointer;
	}

		div.plus-div-button:hover, div.minus-div-button:hover, div.full-div-button:hover {
			background-color: #2E3527;
		}

		div.div-button-max {
			background-color: rgba(97, 97, 97, 0.9);
			cursor: not-allowed;
		}

			div.div-button-max:hover {
				background-color: rgba(97, 97, 97, 0.9);
			}

		div.plus-div-button {
			border-top-left-radius: 0;
			border-bottom-left-radius: 0;
		}

		div.minus-div-button {
			border-top-right-radius: 0;
			border-bottom-right-radius: 0;
		}

		div.transparent-div-button {
			background-color: transparent;
		}

		div.div-button-text-container { 
			display: flex;
			justify-content: center;
			align-items: center;
			gap: 5px;
			height: 100%;
			text-transform: uppercase;
		}
	
			div.button-plus, div.button-minus {
				font-size: 22px;
				margin-top: -1px;
			}

				div.button-minus {
					display: inline-block;
					-webkit-transform:scale(1.75,1);
						-moz-transform:scale(1.75,1);
						-ms-transform:scale(1.75,1);
						-o-transform:scale(1.75,1);
						transform:scale(1.75,1);
				}

.left { text-align: left; }

.center { text-align: center; }

.right { text-align: right; }

.black { color: #2E3527; }

.white { color: #FFFFFF; }

.cast-iron { color: #2E3527; }

.chives { color: #2E3527; }

	.chives a { color: #2E3527; }

.garlic { color: #707070; }

.mineral-green { color: #DEE2E3; }

.light-gray { color: #F5F5F5; }

.dark-gray { color: #E5E5E5; }

.red { color: #A03123; }

.bold { font-weight: bold; }

.underline { text-decoration: underline;}

.uppercase { text-transform: uppercase; }

.no-uppercase { text-transform: none; }

.h-spacer { margin-bottom: 40px; }

.small { font-size: .5rem; }

.standard-padding, .standard-padding-mobile-no-padding { padding: 10px; }

.standard-padding-mobile-no-padding { 
	margin-left: -30px; 
	margin-right: -10px;
	padding-right: 0;
}

.tight-padding { padding: 5px; }

	.tight-padding-no-side { padding: 5px 0; }

.bottom-padding-5 { padding-bottom: 5px; }

.bottom-padding-10 { padding-bottom: 10px; }

.bottom-padding-20 { padding-bottom: 20px; }

.bottom-padding-40 { padding-bottom: 40px; }

.bottom-spacer { padding-bottom: 100px; }

.top-padding-5 { padding-top: 5px; }

.top-padding-10 { padding-top: 10px; }

.top-padding-20 { padding-top: 20px; }

.top-padding-40 { padding-top: 40px; }

.bottom-margin-10 { margin-bottom: 10px; }

.bottom-margin-20 { margin-bottom: 20px; }

.bottom-margin-40 { margin-bottom: 40px; }

.top-margin-10 { margin-top: 10px; }

.top-margin-20 { margin-top: 20px; }

.top-margin-40 { margin-top: 40px; }

.size11, .size12, .size12, .size14, .size16, .size18, .size20, .size24, .size28, .size36, .size48 { line-height: normal; }

	.size11 { font-size: 12px; }

	.size12 { font-size: 14px; }

	.size14 { font-size: 15px; }

	.size16 { font-size: 16px; }
	
	.size18 { font-size: 18px; }

	.size20 { font-size: 20px; }

	.size24 { font-size: 21px; }

	.size28 { font-size: 22px; }

	.size36 { font-size: 24px; }

	.size48 { font-size: 28px; }

.icon-text {
	fill: #2E3527;
	font-size: 14px;
	font-family: 'Spezia Narrow Medium', Helvetica, Arial, sans-serif;
	font-weight: 600;
}
			
.valign-middle { 
	height: 100%;
	vertical-align: middle; 
}

.inline-maker { 
	white-space: nowrap; 
	margin: 10px;
}

.hide-all { display: none; }

.show-mobile { display: inherit; }
	
.hide-mobile { display: none; }

.inline-mobile-hide { display: none; }

.inline-mobile-block { display: block; }

.mobile-center { text-align: center; }

.mobile-overflow-cutoff { overflow-x: hidden; }

.inline-form { display: inline-block; }

.height-full { height: 100%; }

.transparent { background-color: transparent; }

.background-transparent { background-color: inherit !important; }

.background-shaded { background-color: #707070 !important; }

.background-white, tr.background-white td { 
	background-color: #FFFFFF; 
	color: #2E3527;
}

.background-black, tr.background-black td {
	background-color: #2E3527;
	color: #FFFFFF; 
}

.background-primary, tr.background-primary td {
	background-color: #2E3527;
	color: #FFFFFF; 
}

.background-secondary, tr.background-secondary td {
	background-color: #2E3527;
	color: #FFFFFF; 
}

.background-image-bottom-right {
	background-position: bottom right;
}

.background-image-top-center {
	background-position: top center;
}

.sub-container {
	display: flex; 
	height: 100%;
}

.center-middle {
	justify-content: center; 
	align-items: center; 
}

	.center-middle-div {
		position: absolute;
		left: 50%;
		top: 50%;
		-webkit-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
	}

	.absolute-center-div {
		position: absolute;
		left: 50%;
		-webkit-transform: translateX(-50%);
		transform: translateX(-50%);
	}

.even {
	background-color: #FFFFFF;
}

.odd {
	background-color: #707070;
}

svg.down-arrow { margin-top: 20px; }

svg.icon-reorder:hover, .shop-item-frequency-rotate:hover svg {
	-webkit-animation-name: spin;
		-webkit-animation-duration: 500ms;
		-webkit-animation-iteration-count: 1;
		-webkit-animation-timing-function: linear;
		-moz-animation-name: spin;
		-moz-animation-duration: 500ms;
		-moz-animation-iteration-count: 1;
		-moz-animation-timing-function: linear;
		-ms-animation-name: spin;
		-ms-animation-duration: 500ms;
		-ms-animation-iteration-count: 1;
		-ms-animation-timing-function: linear;
		animation-name: spin;
		animation-duration: 500ms;
		animation-iteration-count: 1;
		animation-timing-function: linear;
}

	@-ms-keyframes spin {
		from { -ms-transform: rotate(0deg); }
		to { -ms-transform: rotate(360deg); }
	}
	@-moz-keyframes spin {
		from { -moz-transform: rotate(0deg); }
		to { -moz-transform: rotate(360deg); }
	}
	@-webkit-keyframes spin {
		from { -webkit-transform: rotate(0deg); }
		to { -webkit-transform: rotate(360deg); }
	}
	@keyframes spin {
		from { transform:rotate(0deg); }
		to { transform:rotate(360deg); }
	}

.round-white {
	border-radius: 4px;
	background-color: #FFFFFF;
	vertical-align: middle;
	padding: 0 7px 0 10px;
}

	.round-white section{
		color: #2E3527;
	}

.right-side-cta, .reactivate-cart {
	background-color: #DEE2E3;
	border-radius: 4px;
	padding: 20px;
}

	.reactivate-cart {
		text-align: center;
		padding-bottom: 40px;
	}

.warning, .warning-no-margin {
	border: 2px solid #2E3527;
	background-color: #DEE2E3;
	text-align: center;
	font-weight: bold;
	margin: 20px 0;
	border-radius: 4px;
	padding: 5px;
}

	.warning a { color: #FFFFFF; }

		.warning a:hover { color: #2E3527; }

	.warning-no-margin { margin: -20px 0 0 0; }

tr.hover:hover { background-color: #DEE2E3; }

.font-inherit { font-family: inherit; }

br.clear { clear: all; }

.page-break {
	page-break-after: always;
}

::selection {
	background: #DEE2E3; /* WebKit/Blink Browsers */
  }
::-moz-selection {
	background: #DEE2E3; /* Gecko Browsers */
}


/******* SITE SECTION SPECIFIC *******/
header {
	margin: 0;
	padding: 0;
	background-color: #2F3528;
	color: #FFFFFF;
	font-family: "Spezia Narrow Medium", Helvetica, Arial, sans-serif;
	font-weight: 500;
}

	header div#HeaderBody {
		display: none; 
		align-items: center; 
		height: 100%; 
		justify-content: space-between;
		max-width: 1440px;
		margin: 0 auto;
	}

		header a, header a:visited { 
			color: #FFFFFF; 
			font-weight: 400;
			text-decoration: none;
		}

			header a:hover { 
				text-decoration: underline;
				color: #FFFFFF;
			}

		header a.header-button, header button.header-button, footer a.footer-button {
			text-transform: uppercase;
			margin: 0 10px;
			font-size: 14px;
		}

			header button.no-uppercase {
				text-transform: none;
				font-size: 100%;
			}

			header button.header-button-text {
				background-color: #2F3528;
				color: #FFFFFF;
				font-family: "Spezia Narrow Medium", Helvetica, Arial, sans-serif;
				font-weight: 500;
			}

			header div#MobileLinks a.header-button-text-mobile {
				color: #FFFFFF;
				font-size: 20px;
				line-height: 20px;
				font-family: "Spezia Narrow Medium", Helvetica, Arial, sans-serif;
				text-transform: uppercase;
				font-weight: normal;
			}

		header a.header-login-button, footer a.footer-login-button {
			margin: 0px 20px; 
			padding-top: .5em; 
			padding-bottom: .5em; 
			color: #2F3528;
			font-size: 14px;
		}

		header svg.icon, footer svg.icon {
			margin: 0;
			vertical-align: middle;
		}
		
			header svg.icon path, header svg.icon circle, footer svg.icon path, footer svg.icon circle {
				fill: #FFFFFF;
			}

			header svg.black-icon path, header svg.black-icon circle, footer svg.black-icon path, footer svg.black-icon circle {
				fill: #2F3528;
			}

		header img.cal-icon {
			height: 11px;
			margin-right: 10px;
		}

		header div#HeaderBody div#SearchNavigation {
			/*display: none;*/  /* We handle this via JavaScript now */
		}

			#SearchNavigation input#TopSearch, #SearchNavigationMobile input#TopSearchMobile {
				max-width: 300px;
				border: 2px solid #F5F5F5;
				border-radius: 4px 0 0 4px;
				border-right: 0;
				height: 36px;
				padding: 0 5px 2px 20px;	/* IF YOUR REMOVE OR CHANGE THIS, YOU ARE GOING TO HAVE ISSUES */
				font-size: 14px;			/* IF YOUR REMOVE OR CHANGE THIS, YOU ARE GOING TO HAVE ISSUES */
				text-transform: uppercase;
				margin: 0;
			}

				#SearchNavigationMobile input#TopSearchMobile {
					width: calc(100vw - 100px);
					margin-left: 15px;
					margin-bottom: 10px;
				}

			#SearchNavigation button#TopSearchSubmit, #SearchNavigationMobile button#TopSearchMobileSubmit {
				width: 40px;
				border: 2px solid #F5F5F5;
				border-radius: 0 5px 5px 0;
				border-left: 0;
				
				height: 36px;
				background-color: #F5F5F5;
				text-align: right;
				padding: 0;
			}

				#SearchNavigationMobile button#TopSearchMobileSubmit {
					margin-right: 10px;
				}

					#SearchNavigationMobile button#TopSearchMobileSubmit svg path {
						fill: #000000;
					}

				#SearchNavigation button#TopSearchSubmit svg, #SearchNavigationMobile button#TopSearchMobileSubmit svg {
					margin: 0 12px 0 8px;
					width: 15px;
				}

			#SearchNavigation #HeaderSearchContainer {
				flex-wrap: nowrap;
			}
	
				#SearchNavigation #HeaderSearchContainer #SearchInput { flex: 1; }
	
				#SearchNavigation #HeaderSearchContainer #SearchButton { max-width: 40px; }
	
				#SearchNavigation #SearchClose { 
					max-width: 40px; 
					margin-right: 40px;
				}

					#SearchNavigation #SearchClose div { 
						height: 100%;
						margin-top: 5px;
					}

						#SearchNavigation #SearchClose svg {
							height: 24px;
						}

		header #CartContainer, header #MobileCartContainer {
			position: relative;
			margin-left: 20px;
		}

			header #MobileCartContainer { 
				width: 23px; 
				margin-left: 0;
			}

			header #CartContainer #HeaderCartID {
				display: none;
			}
		
			header #CartContainer #CartNumber, header #MobileCartContainer #MobileCartNumber {
				/*display: none;*/
				color: #2F3528;
				font-size: 12px;
				line-height: normal;
				width: 100%;
				height: calc(100% - 10px);
				position:absolute;	/* Make sure parent div is relative */
				top:5px; 
				left:0px;
				z-index: 2000;

				/* Vertical / Horizontal Center */
				display: flex; 
				justify-content: center; 
				align-content: center; 
				flex-direction: column;
				text-align: center;
			}

				header #MobileCartContainer #MobileCartNumber {
					top: 6px;
				}

			header #CartContainer svg, header #MobileCartContainer img {
				height: 23px; /*Match Search SVG*/
			}	

	header div#Mobile-NavItems {
		display: flex; 
		align-items: center;
		justify-content: space-between;
		padding: 8px;
	}

		div#HamburgerClose, div#AccountClose {
			display: none;
			color: #FFFFFF;
			/*font-size: 2em;
			padding: 8px 3px;*/
			padding-top: 8px;
			font-weight: normal;
		}
		
		div#Mobile-NavLogo { 
			text-align: center;
		}
		
			div#Mobile-NavLogo svg { width: 100%; }

	header div#MobileLinks, header div#MobileAccountLinks, header div#AccountLinks, header div#ShopLinks, header div#AboutLinks, header div#ResourceLinks, 
		header div#MobileShopAll, header div#MobileProduceBaskets, header div#MobileShopBounty, header div#MobileShopGiftCards, header div#MobileAbout, header div#MobilePartners, header div#MobileTeam, header div#MobileValues, header div#MobileShareTheHarvest, header div#MobileFAQ, header div#MobileRecipes, header div#MobileStorageTips,header div#MobileBlog,
		header div.shop-menu-dropdown
	{
		display: none;
		background-color: #2F3528;
		margin: 0 -20px 0 0;
		padding-left: 20px;
		text-align: left;
		line-height: 2.6em;
	}

		header div#AccountLinks { text-align: right; }

		header div#MobileShopAll, header div#MobileProduceBaskets, header div#MobileShopBounty, header div#MobileShopGiftCards { display: block; }

		header div#AccountLinks, header div#ShopLinks, header div#AboutLinks, header div#ResourceLinks, header div.shop-menu-dropdown { 
			background-color: transparent;
			display: block; 
			margin: 0;
			padding: 0;
		}

		header div#MobileLinks a.header-button, header div#MobileAccountLinks a.header-button, header div#AccountLinks a.header-button, header div#ShopLinks a.header-button, header div#AboutLinks a.header-button, header div#ResourceLinks a.header-button, header div.shop-menu-dropdown a.header-button {
			color: #3B442E;
			font-size: 20px;
			line-height: 20px;
			font-family: "Spezia Narrow Medium", Helvetica, Arial, sans-serif;
			font-weight: 600;
			text-transform: none;
			font-weight: normal;
		}

			header div#AccountLinks a.header-button, header div#ShopLinks a.header-button, header div#AboutLinks a.header-button, header div#ResourceLinks a.header-button, header div.shop-menu-dropdown a.header-button	{ 
				padding: 2px 10px; 
				margin: 0;
				font-size: 14px;
				line-height: 28px;
				text-transform: none;
				background-color: #FFFFFF;
			}

				header div#AccountLinks a.header-button:hover, header div#ShopLinks a.header-button:hover, header div#AboutLinks a.header-button:hover, header div#ResourceLinks a.header-button:hover, header div.shop-menu-dropdown a.header-button:hover	{ 
					background-color: #F2F2F2;
				}

			header div#MobileLinks a.chives, header div#MobileAccountLinks a.chives, header div#AccountLinks a.chives, header div#ShopLinks a.chives, header div#AboutLinks a.chives, header div#ResourceLinks a.chives, header div.shop-menu-dropdown a.chives { color: #2E3527; }

		header div#MobileLinks svg {
			height: 14px;
		}
	
	/* The container <div> - needed to position the dropdown content */
	header .dropdown, .order-selector-wrapper .dropdown {
		position: relative;
		display: inline-block;
		margin: 0;
		padding: 0;
	}

		/* Style The Dropdown Button */
		header .dropbtn, .order-selector-dropdown .dropbtn {
			background-color: #2F3528;
			padding: 0;
			font-size: 12px;
			border: none;
			cursor: pointer;
		}

		header a.dropbtn, .order-selector-dropdown a.dropbtn { 
			text-decoration: none;
		}

		/* Dropdown Content (Hidden by Default) */
		header .dropdown-content {
			display: none;
			position: absolute;
			width: 160px;
			left: 10px;
		}

			header .dropdown-content-right {
				right: 10px;
				left: auto;
			}

			header .dropdown-content-wide {
				width: 260px;
			}

			header .dropdown-content-text {
				white-space: nowrap;
			}

		header .dropdown-content .links-background {
			background-color: #FFFFFF;
			padding-top: 10px;
			padding-bottom: 10px;
			border-radius: 4px;
			box-shadow: 0px 3px 6px #00000029;
			border: 1px solid #2E3527;
		}

		header .dropdown-content .sub-link {
			margin: 0 10px;
			border-bottom: #B1B7BD 1px solid;
			z-index: 5004;
			position: relative;
		}
		
		/* Links inside the dropdown */
		header .dropdown-content a, header .dropdown-content .a {
			padding: 0;
			text-decoration: none;
			display: block;
		}

		/* Show the dropdown menu on hover */
		header .dropdown:hover .dropdown-content {
			display: block;
			z-index: 5002;
		}

	header #ItemCategoryNavigation {
		display: none; 
		font-family: "Spezia Narrow Medium", Helvetica, Arial, sans-serif;
		padding: 5px 0;
		background-color: #FFFFFF;
		text-align: center;
		font-size: 16px;
	}

		header #ItemCategoryNavigation div.category-dropdown, header #ItemCategoryNavigation button {
			margin: 7px 14px;
			background-color: inherit;
			color: inherit;
		}

			header #ItemCategoryNavigation div.category-dropdown { margin: 0; }
	
		header #ItemCategoryNavigation a {
			color: #2E3527;
			font-weight: 300;
		}

			header #ItemCategoryNavigation a:hover {
				color: #335E7D;
				text-decoration: underline;
			}

			header #ItemCategoryNavigation div.sub-link a:hover {
				color: #2E3527;
				text-decoration: none;
			}
	
	header #OrderMinimumBanner {
		font-family: "Spezia Narrow Medium", Helvetica, Arial, sans-serif;
		font-weight: 400;
		padding: 5px 0;
		background-color: #BED9F1;
		color: #2E3527;
		text-align: center;
		font-size: 14px;
	}

	header #DevEnvironmentBanner {
		font-family: "Spezia Narrow Medium", Helvetica, Arial, sans-serif;
		font-weight: 600;
		padding: 10px 0;
		background-color: #A03123;
		color: #FFFFFF;
		text-align: center;
	}

footer {
	margin: 0;
	padding: 20px 0;
	background-color: #2E3527;
	font-family: "Spezia Narrow Medium", Helvetica, Arial, sans-serif;	/* NOTE: This shouldn't be Italic, waiting on that font to show up */
}

	footer div#FooterWrapper {
		display: block;
		max-width: 1024px;
		margin-left: auto;
		margin-right: auto;
		justify-content: space-between; 
	}

		footer div#FooterWrapper section {
			color: #FFFFFF;
			text-align: center;
		}

			footer div#FooterWrapper section div {
				margin: 15px 0;
			}

				footer div#FooterWrapper section div a {
					color: #FFFFFF;
				}

				footer div#FooterWrapper section div.follow-us {
					padding-top: 20px;
				}

				footer div#FooterWrapper section div.flex-container-mobile {
					max-width: 200px;
					margin: 5px auto 0 auto;
				}

					footer div#FooterWrapper section div.flex-container-mobile .mobile-footer-icons svg.icon {
						margin: 0;
					}

/* IF you add to this, be sure to change the screen.css as well */
#PageBody, #PageBodyContinued, #PageBodyContinued2 {
	background-color: #FFFFFF;
}

#NotificationBody {
	font-family: "Cambon Demi", "Times New Roman", "Georgia", serif;
	font-weight: 300;
	size: 16px;
	background-color: #2E3527;
	color: #FFFFFF;
	text-align: center;
	padding: 5px;
	position: relative;
}

#MobileReferFriend {
	font-family: "Cambon Demi", "Times New Roman", "Georgia", serif;
	font-weight: 300;
	text-align: center;
	background-color: #FFFFFF;
	color: #2E3527;
	padding: 7px 0 5px 0;
	margin-top: 3px;
}

	#MobileReferFriend a {
		font-family: "Cambon Demi", "Times New Roman", "Georgia", serif;
		font-weight: 700;
		color: #2E3527;
		text-decoration: underline;
	}


/******* ELEMENT SPECIFIC *******/
.after-signup-message {
	color: #2E3527;
	max-width: 620px;
	margin: 0 auto 50px auto;
	padding-bottom: 25px;
}

.front-page-container {
	padding: 50px 10px;
}

	.front-page-item {
		margin: 50px 10px;
	}

		.hero-non-section, .quiz-non-section, .signup-non-section {
			background-color: #F5F5F5;
			padding: 25px 0;
			padding: 0;
		}

			.hero-non-section { margin-top: -75px; }

			.hero-container {
				margin: 0;
				position: relative;
				padding-bottom: 188.27%; /* Mobile aspect ratio 750x1412 */
			}

				.hero-background-mobile, .hero-background-desktop, .hero-background-mobile-hide, .hero-background-desktop-hide, .quiz-content-desktop, .signup-content-desktop {
					position: absolute;
					top: 0;
					left: 0;
					width: 100%;
					height: 100%;
					display: block;
					background-size: cover;
				}

					.hero-background-desktop, .hero-background-desktop-hide, .hero-background-mobile-hide, .quiz-content-desktop, .quiz-content-desktop-scroll, .signup-content-desktop, .signup-content-desktop-scroll {
						display: none;
					}

					.hero-overlay {
						text-align: center;
						position: absolute;
						width: 100%;
						bottom: 40px;
						margin-left: auto;
						margin-right: auto;
						z-index: 100;
					}

					.hero-button-outer {
						height: 65px;
					}
					
						.hero-button { 
							padding-top: 20px; 
						}

				#SlideCurrent, #SlideMax, #SlidePrefix { 
					display: none;
				}

			.hero-sub-section, .hero-sub-section-width-only {
				max-width: 960px;
				margin: 40px auto 20px auto;
				padding: 0 20px 0 20px;
			}

				.hero-sub-section {
					color: #2E3527;
				}

		.show-swiper-mobile, .show-swiper-desktop-tablet { display: none; }
		
			.swiper { margin: 0; }

				.swiper-slide div.swiper-image { padding-bottom: 188.27%; /* Mobile aspect ratio 750x1412 */ }

				.swiper-slide .slide-center {
					position: absolute;
					top: 50%;
					padding: 0 50px;
					transform: translateY(-50%);
						-ms-transform: translateY(-50%);
						-moz-transform: translateY(-50%);
						-webkit-transform: translateY(-50%);
						-o-transform: translateY(-50%);
					color: #FFFFFF;
				}

				.swiper-button-next, .swiper-button-prev { color: #FFFFFF; }
				
				#HeroFarmMobile .swiper-button-next, #HeroFarmMobile .swiper-button-prev {
					top: 187px;
				}
		
		.how-it-works-section {
			font-family: "Cambon Demi", "Times New Roman", "Georgia", serif;
			font-size: 18px;
			padding-top: 50px;
		}

			.how-it-works-step-section, .signup-timeline-section {
				margin: 40px auto 0 auto;
				max-width: 650px;
			}

				.signup-timeline-section {
					margin-top: 0;
				}

				.how-it-works-number-wrapper {
					position: relative;
				}

					.how-it-works-number-wrapper  hr.connection-line, .how-it-works-number-wrapper  hr.connection-line-left, .how-it-works-number-wrapper  hr.connection-line-right {
						display: none;
						border: solid #2E3527 2px;
						position: absolute;
						top: calc(50% - 15px);
						width: 100%;
						z-index: 10;
					}

						.how-it-works-number-wrapper  hr.connection-line-left {
							width: 50%;
							right: 0;
						} 
						
						.how-it-works-number-wrapper  hr.connection-line-right {
							width: 50%;
							left: 0;
						}
			
			.how-it-works-tagline, .weekly-produce-baskets-tagline {
				max-width: 650px; 
				margin: 0 auto 40px auto;
				color: #2E3527;
			}

			.how-it-works-number-container {
				position: relative;
				z-index: 200;
			}

				.how-it-works-circle-outer {
					stroke: #2E3527;
				}

					.how-it-works-circle-outer-inverted { stroke: #FFFFFF; }

				.how-it-works-circle-middle {
					fill: #FFFFFF;
				}

					.how-it-works-circle-middle-inverted { fill: #2E3527; }

				.how-it-works-circle-inner {
					fill: #2E3527;
					stroke: none;
				}

					.how-it-works-circle-inner-inverted { fill: #FFFFFF; }
				
				.how-it-works-number {
					font-family: "Spezia Narrow Medium", Arial, Helvetica, sans-serif;
					font-weight: 700;
					font-size: 40px;
					fill: #FFFFFF;
					stroke: #FFFFFF;
				}

					.how-it-works-number-inverted {
						fill: #2E3527;
						stroke: #2E3527;
					}
		
			.how-it-works-title {
				font-family: "Cambon Demi", "Times New Roman", "Georgia", serif;
				font-weight: 700;
				font-size: 20px;
				margin: 20px 10px 0px 10px;
				color: #2E3527;
			}

			.how-it-works-step {
				margin: 10px 10px;
				color: #2E3527;
			}

			.how-it-works-button {
				margin-top: 40px;
			}

		.weekly-produce-baskets-section {
			background-color: #E5E5E5;
		}

		.front-page-review-section {
			max-width: 500px;
			background-color: #FFFFFF;
			margin: 0 auto 40px auto;
			padding: 40px;
		}

			.front-page-review-byline {
				font-family: "Cambon Demi", "Times New Roman", "Georgia", serif;
				font-weight: 300;
				font-size: 25px;
				margin-bottom: 20px;
			}

			.front-page-review-line {
				width: 50px;
				color: #707070;
				margin: 0 auto 20px auto;
			}

			.front-page-review-stars {
				margin-bottom: 20px;
			}

	.featured-farm-section {
		margin: 0 -10px 0 -10px;
		padding: 0;
	}

		.featured-farm-image-container-desktop {
			position: relative;
		}

			.featured-farm-vendor-overlay-desktop {
				position: absolute;
				right: 0px;
				top: 50%;
				transform: translateY(-50%);
				background-color: #2E3527;
				color: #FFFFFF;
				text-align: left;
				width: 700px;
				min-height: 450px;
			}

				.featured-farm-vendor-overlay-desktop-item {
					padding: 20px;
				}

				.harvest-week-title {
					font-family: "Dom Diagonal W03 Rg", "Comic Sans MS", "Comic Sans", cursive;
					font-size: 18px;
					text-transform: uppercase;
					margin-bottom: 20px;
				}

				.vendor-name {
					font-size: 40px;
				}
	
				.vendor-description { 
					margin-top: 20px;
					font-size: 18px;
				}

				.vendor-categories {
					margin: 20px 0 0 0;
					max-height: 130px;
					overflow-x: hidden;
					overflow-y: hidden;
				}

					div.category-button {
						float: left;
						height: 40px;
						margin-top: 5px;
					}

					a.featured-category-button {
						padding: .75em 1em;
						font-size: 12px;
						margin: 5px 10px 5px 0px;
					}
				
				.vendor-button {
					margin-top: 30px;
				}

		.featured-farm-vendor-overlay-mobile {
			background-color: #2E3527;
			color: #FFFFFF;
			padding: 10px;
			margin-top: -10px;
		}

			img.featured-farm-mobile {
				margin-top: -50px;
				object-fit: cover;
				width: 100%;
				/*height: 399px; We don't define this here like we do the hero, but if we have issues, maybe do this later - it just crops weird*/
			}

			.harvest-week-title-mobile {
				font-family: "Dom Diagonal W03 Rg", "Comic Sans MS", "Comic Sans", cursive;
				font-size: 18px;
				text-transform: uppercase;
				margin-bottom: 20px;
				text-align: center;
			}

			.vendor-name-mobile {
				font-size: 30px;
				text-align: center;
			}

			.vendor-description-mobile { 
				margin-top: 20px;
				margin-bottom: 20px;
				font-size: 18px;
				text-align: center;
			}

			.vendor-categories-mobile {
				margin: 10px 0 0 0;
				max-height: 170px;
				overflow-y: hidden;
			}
			
			.vendor-button-mobile {
				text-align: center;
				margin: 40px 0 80px 0;
			}

	.front-page-beyond-produce-section {
		
	}

		.front-page-beyond-product-tagline {
			margin: 20px;
		}

		.front-page-beyond-produce, .mobile-quiz-grid {
			background-color: #FFFFFF;
			margin: 0 10px;
			padding: 0;
			width: calc(50% - 20px);
			max-width: 323px;
		}

			.mobile-quiz-grid { 
				width: calc(50% - 5px);
				margin: 0; 
			}

		.beyond-produce-title, .beyond-produce-body {
			margin: 0;
		}

			.beyond-produce-title {
				margin-top: -10px;
				padding-top: 20px;
			}

			.beyond-produce-body {
				padding: 20px;
			}

	.front-page-video {
		background-color: #E5E5E5;
		width: 100%; 
		padding: 0; 
		margin: 0;
	}

	#FrontMessage {
		margin-bottom: -20px;
	}
	
		.front-page-bottom-message {
			background-color: #E5E5E5;
			padding-bottom: 0;
			margin-bottom: 0;
		}

			.front-page-bottom-message-section { 
				text-align: center; 
				max-width: 650px;
				margin-left: auto; 
				margin-right: auto;
			}

#PopUpOuter {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(34,34,34,.6);
	z-index: 6001;
}

	#PopUpInner {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		color: #2E3527; 
		background-color: #FFFFFF;
		border-radius: 4px;
		z-index: 6002;
		text-align: center;
		padding: 15px;
		max-height: calc(100% - 80px);
		overflow: hidden;
	}

		#PopUpClose { text-align: right; }

		#PopUpBody {
			margin-left: auto;
			margin-right: auto;
			z-index: 6003;
			
			/* 
				We make this match the height above in #PopUpInner only using vh instead of % 
				Also, we handle most of this in popup.js so if we are running into scroll issues, start there before changing this
			*/
			max-height: calc(100vh - 80px);
			overflow-y: auto;
		}

		#PopUpSpacer {
			height: 60px;
		}

		#PopUpForm, #PopUpForm2 {
			padding: 5px 20px;
		}

			#PopUpForm tr td.popup-form-cell-66 { width: 66%; }
			
			#PopUpForm tr td.popup-form-cell-33 { width: 33%; }

		.popup-body-no-scroll, .popup-body-no-scroll2 { overflow: hidden; }

		.popup-header, .popup-subheader {
			font-family: "Cambon Demi", "Times New Roman", "Georgia", serif;
			font-weight: 700;
			font-size: 40px;
			margin: 20px 0;
			line-height: 1.15em;
		}

			.popup-subheader { font-size: 30px; }

		.popup-input, .popup-input-left, .popup-input-right, .popup-select {
			font-family: 'Spezia Narrow Medium', Helvetica, Arial, sans-serif;
			color: #2E3527;
			border: 2px solid #E5E5E5;
			border-radius: 4px;
			margin: 5px 0;
			padding: 10px;
		}

			.popup-input-left {
				border-radius: 0;
				border-top-left-radius: 5px;
				border-bottom-left-radius: 5px;
			}

			.popup-input-right {
				border-radius: 0;
				border-top-right-radius: 5px;
				border-bottom-right-radius: 5px;
			}

			.popup-input-multi-line-left {
				margin-right: 10px;
			}

			.popup-input-multi-line-right { 
				margin-left: 10px; 
				width: calc(100% - 10px);
			}

			.popup-input-zipcode {
				margin-left: 10px; 
				width: calc(100% - 10px);
			}

			.popup-select {
				padding-left: 20px;
				background: #FFFFFF url("/_home/Images/Icons/dropdown-icon.svg") no-repeat;
				background-position: right 20px top 50%;
				-moz-appearance: none;
					-webkit-appearance: none;
					appearance: none;
			}

			textarea.popup-input {
				border: 2px solid #E5E5E5;
				height: 75px;
			}

			table#Table50 { 
				width: 100%; 
			}

				table#Table50 td {
					width: 50%;
				}

					table#Table50 td.right a.button {
						margin-right: 10px;
					}

					table#Table50 td.left a.button {
						margin-left: 10px;
					}

			table#YesNoToggle { 
				width: 100%; 
			}

				table#YesNoToggle td.yes-no-toggle-50 {
					width: 50%;
				}

				table#YesNoToggle input[type="radio"], div#DonateButtons input[type="radio"] {
					display: none;
				}
				
				table#YesNoToggle label.popup-toggle-label, div#DonateButtons label.popup-toggle-label {
					font-family: "Spezia Narrow Medium", Arial, Helvetica, sans-serif;
					font-weight: 600;
					font-size: 16px;
					color: #2E3527;
					border: 2px solid #E5E5E5;
					border-radius: 4px;
					margin: 5px 0;
						margin-left: 10px;
					padding: 10px;
					display: inline-block;
					/*width: 100%;*/
					width: 85%; 
					text-align: center; 
				}

					table#YesNoToggle label.popup-toggle-label-left {
						width: 85%; 
						text-align: center; 
						margin-left: 0;
						margin-right: 10px;
					}
					
					table#YesNoToggle label.popup-toggle-label-right {
						width: 85%; 
						text-align: center; 
						margin-left: 10px;
						margin-right: 0;
					}

					table#YesNoToggle label.popup-toggle-label-full {
						width: calc(100% - 20px); 
					}
				
				table#YesNoToggle input[type="radio"]:checked + label, div#DonateButtons input[type="radio"]:checked + label {
					background-color: #2E3527;
					cursor: default;
					color: #FFFFFF;
					border-color: #2E3527;
				}

				div#DonateButtons label.mobile-donate-toggle {
					margin-left: 0; 
					width: 93%;
				}

			table#DriverTipToggle, table#DriverTipToggle2, table#DonationToggle {
				width: 100%;
			}

				table#DriverTipToggle input[type="radio"], table#DriverTipToggle2 input[type="radio"], table#DonationToggle input[type="radio"]  {
					display: none;
				}
			
				/* We include the div#DonateButtons at the end to make sure it gets the right settings since we have two groups of toggles on the donate page */
				table#DriverTipToggle .popup-toggle-label, table#DriverTipToggle2 .popup-toggle-label, div#DonateButtons table#DonationToggle .popup-toggle-label {
						font-family: "Spezia Narrow Medium", Arial, Helvetica, sans-serif;
						font-weight: 600;
						font-size: 16px;
						color: #2E3527;
						border: 2px solid #E5E5E5;
						border-radius: 4px;
						margin: 5px 0;
						padding: 5px 2px;
						display: inline-block;
						/*width: 100%;*/
						width: 85%; 
						text-align: center; 
					}
				
						/* We include the div#DonateButtons at the end to make sure it gets the right settings since we have two groups of toggles on the donate page */
						table#DriverTipToggle input[type="radio"]:checked + label, table#DriverTipToggle2 input[type="radio"]:checked + label, div#DonateButtons table#DonationToggle input[type="radio"]:checked + label {
							background-color: #2E3527;
							padding: 6px 3px;	/* Plus 1 of border above to simulate border */
							cursor: default;
							color: #FFFFFF;
							border-color: 0;
						}

				.driver-tip-image {
					max-height: 200px;
				}

				table#DriverTipToggle #OtherToggleTD, table#DriverTipToggle2 #OtherToggleTD, table#DonationToggle #OtherToggleTD {
					width: 91px;
				}
				
					table#DriverTipToggle #OtherAmountDiv, table#DriverTipToggle2 #OtherAmountDiv, table#DonationToggle #OtherAmountDiv {
						padding: 0;
					}
					
						table#DriverTipToggle #OtherAmountDiv input, table#DriverTipToggle2 #OtherAmountDiv input, table#DonationToggle #OtherAmountDiv input {
							width: 86px;
							padding: 6px 3px;	/* Plus 1 of border above to simulate border */
						}

			table#FrequencyToggle {
				width: 100%;
			}

				table#FrequencyToggle td {
					padding: 1px 10px;
				}

				table#FrequencyToggle input[type="radio"] {
					display: none;
				}
			
				table#FrequencyToggle .popup-toggle-label {
						font-family: "Spezia Narrow Medium", Arial, Helvetica, sans-serif;
						font-weight: 600;
						font-size: 16px;
						color: #2E3527;
						border: 2px solid #E5E5E5;
						border-radius: 4px;
						margin: 5px 0;
						padding: 5px 2px;
						display: inline-block;
						width: 100%;
						text-align: center; 
					}
				
						table#FrequencyToggle input[type="radio"]:checked + label {
							background-color: #2E3527;
							padding: 6px 3px;	/* Plus 1 of border above to simulate border */
							cursor: default;
							color: #FFFFFF;
							border: 0;
						}

			#FrequencyPopUp {
				margin-top: -20px;
			}

				#FrequencyPopUp .shop-item {
					background-color: #FFFFFF;
					padding: 10px;
					margin-top: 20px;
					
					/* This is here so we can put .item-bottom on the bottom */
					display:flex; 
					flex-direction:column; 
					flex:1;
				}
				
					#FrequencyPopUp .shop-item-recurring {
						/*background-color: #707070;*/
					}
				
					#FrequencyPopUp .recurring-quantity {
						color: #FFFFFF;
						font-size: 126px;
						line-height: normal;
						background-color: rgba(0,0,0,.5);
						width: 100%;
						height: calc(100% - 10px);
						position:absolute;	/* Make sure parent div is relative */
						top:0px; 
						left:0px;
						z-index: 2000;
				
						/* Vertical / Horizontal Center */
						display: flex; 
						justify-content: center; 
						align-content: center; 
						flex-direction: column;
						text-align: center;
					}
				
					#FrequencyPopUp .quantity-toggle {
						position:absolute;	/* Make sure parent div is relative */
						bottom: 15px; 
						right: 15px;
						z-index: 2001;
					}
				
						/* - We believe this is now solved differently - if this created a bug somewhere, make sure whatever you do to solve the bug doesn't break mobile
						#FrequencyPopUp .quantity-toggle svg.quantity-toggle-desktop-pair-plus, #FrequencyPopUp .quantity-toggle svg.quantity-toggle-desktop-pair-minus {
							width: 250px;
						}*/
				
					#FrequencyPopUp .shop-item-photo {
						position: relative;
						padding-bottom: .75%; /* Aspect ratio 300x225 */
						margin: -10px -10px 0 -10px; /* Make this match the padding above */
					}
				
						#FrequencyPopUp .shop-item-photo img {
							object-fit: cover;
							width: 100%;
						}
				
					#FrequencyPopUp .shop-item-name {
						padding: 10px 0;
					}
				
						#FrequencyPopUp .shop-item-name-addon {
							margin-top: 10px;
							vertical-align: top;
							overflow: hidden;
							text-overflow: ellipsis;
						}
				
					#FrequencyPopUp .shop-item-description {
						margin-top: 10px;
						white-space: nowrap;
						vertical-align: top;
						overflow: hidden;
						text-overflow: ellipsis;
						color: rgba(13.3,13.3,13.3,.7);
					}
				
					#FrequencyPopUp .shop-item-bottom {
						margin-top: auto; /* This in conjunciton with .shop-item being set to flex above should work */
					}
				
						#FrequencyPopUp .shop-item-bottom .shop-item-price {
							margin: 20px 0;
						}
				
						#FrequencyPopUp .shop-item-bottom .shop-item-button {
							text-align: center;
						}
				
							#FrequencyPopUp .shop-item-bottom .shop-item-button a.item-button {
								font-family: "Spezia Narrow Medium", Arial, Helvetica, sans-serif;
								font-weight: 600;
								font-size: 16px;
								text-transform: uppercase;
								background-color: #2E3527;
								color: #FFFFFF;
								display: block;
								border-radius: 4px;
								padding: 5px 0;
								border: 0;
								-webkit-appearance: none;
									-moz-appearance: none;
									appearance: none;
								text-decoration: none;
							}
				
					#FrequencyPopUp .shop-price-markout, #FrequencyPopUp .shop-price-markout-empty {
						text-align: right;
						font-family: "Spezia Narrow Medium", Arial, Helvetica, sans-serif;
						font-weight: 700;
						font-size: 12px;
						color: rgba(13.3,13.3,13.3,.7);
						text-decoration: line-through;
					}

						#FrequencyPopUp .shop-price-markout-empty { text-decoration: none; }
				
					#FrequencyPopUp .shop-price-sale {
						text-align: right;
						font-family: "Spezia Narrow Medium", Arial, Helvetica, sans-serif;
						font-weight: 700;
						font-size: 16px;
						color: rgba(13.3,13.3,13.3,1);
					}
				
						#FrequencyPopUp .shop-price-sale svg {
							height: 10px;
							margin-right: 2px;
						}

			#BundlePopup {

			}

				#BundlePopup div.bundle-item-container {
					margin-bottom: 20px;
				}

					#BundlePopup div.bundle-item-image { max-width: 125px; }

					#BundlePopup div.bundle-item-description { 
						max-width: calc(100% - 145px);	/*Note: max-width: 175px does some weird things in true mobile, this seems to work better.  We reset this for tablet/desktop in screens.css*/
						padding-left: 20px;
					}

		.popup-button, .popup-button:disabled {
			font-family: "Spezia Narrow Medium", Arial, Helvetica, sans-serif;
			font-weight: 600;
			font-size: 16px;
			line-height: 22px;
			text-transform: uppercase;
			background-color: #2E3527;
			color: #FFFFFF;
			border-radius: 4px;
			padding: 1em 3em;
			border: 0;
			margin: 5px 0;
			-webkit-appearance: none;
		}

			a.popup-button {
				border: 0;
				-webkit-appearance: none;
					-moz-appearance: none;
					appearance: none;
				text-decoration: none;
			}

				a.popup-button:hover {
					color: #FFFFFF;
				}

				a.popup-button-small-padding {
					padding: .75em 0;
					display: block;
				}

			.popup-button-gray {
				font-family: "Spezia Narrow Medium", Arial, Helvetica, sans-serif;
				font-weight: 600;
				text-transform: uppercase;
				background-color: #E5E5E5;
				width: 100%;
				text-align: center;
			}

			.cart-input, .cart-input-left, .cart-input-right, .cart-select {
				font-family: 'Spezia Narrow Medium', Helvetica, Arial, sans-serif;
				color: #2E3527;
				border: 2px solid #E5E5E5;
				font-size: 14px;
				border-radius: 4px;
				margin: 5px 0;
				padding: 10px;
			}
	
				.cart-input-left {
					border-radius: 0;
					border-top-left-radius: 5px;
					border-bottom-left-radius: 5px;
					border-color: #707070;
				}
	
				.cart-input-right {
					border-radius: 0;
					border-top-right-radius: 5px;
					border-bottom-right-radius: 5px;
					border-color: #2E3527;
				}

				.cart-button-green-left {
					font-family: 'Spezia Narrow Medium', Helvetica, Arial, sans-serif;;
					text-transform: uppercase;
					background-color: #2E3527;
					font-size: 14px;
					color: #FFFFFF;
					width: 100%;
					text-align: center;
					-webkit-appearance: none;
						-moz-appearance: none;
				}	

		.popup-warning {
			font-family: 'Spezia Narrow Medium', Helvetica, Arial, sans-serif;
			text-transform: uppercase;
			color: #EB5757;
			text-align: center;
		}

			.popup-warning-gray {
				color: #2E3527;
			}

		.popup-input-warning {
			border-color: #EB5757;
		}

		#CoopAddress {
			margin: -10px 0 10px 0;
		}
		
		#CoopMap {
			height: 200px;
			border: 1px solid #E5E5E5;
		}

		.mobile-popup-input-credit-card, .signup-selection #Card { width: 155px; }

		.mobile-popup-input-credit-date, .signup-selection #ExpirationMo, .signup-selection #ExpirationYr { width: 60px; }

		.mobile-popup-input-credit-cvc, .signup-selection #CVC { width: 75px; }

		.mobile-popup-input-apt {
			width: 270px; 
			margin-right: 10px;
		}

			.signup-selection .mobile-popup-input-apt { margin-right: 0; }

		.mobile-popup-input-zip { width: 125px; }

.quiz-non-section, .signup-non-section {
	text-align: center;
}

	.quiz-container, .signup-container {
		background-color: #FFFFFF;
		color: #2E3527;
		text-align: center;
	}

		.quiz-spacer-mobile, signup-spacer-mobile {
			display: block;
			background-color: #F5F5F5;
			padding: 30px 0 0 0;
			line-height: 0;
		}
		
		.quiz-content-desktop, .quiz-content-desktop-scroll, .signup-content-desktop, .signup-content-desktop-scroll {
			padding: 50px 0;
		}

			.signup-content-desktop, .signup-content-desktop-scroll { padding-top: 0; }

			.quiz-content-mobile, .signup-content-mobile { padding: 30px; }

			.signup-timeline {
				display: flex;
			}

			.quiz-timeline svg, .signup-timeline svg {
				max-width: 100%;
			}

			.quiz-name, .signup-name {
				padding: 15px 0;
			}

			.quiz-question, .signup-question {
				padding: 15px 0;
				text-transform: uppercase;
			}

			.quiz-selection, .signup-selection {
				margin-bottom: 15px;
			}

				.signup-selection input[type='text'], .signup-selection input[type='password'], .signup-selection input[type='number'], .signup-selection select, .signup-selection textarea { 
					border: 3px solid #72757E;
				}

					.signup-selection select {
						padding-left: 10px;
					}

					.signup-selection textarea {
						height: 120px;
					}

					.signup-selection .signup-dropdown-question { 
						margin-left: auto;
						margin-right: auto;	
						margin-top: 5px;
						margin-bottom: -5px;
					}	

				.quiz-selection input[type="radio"], .quiz-selection input[type="checkbox"], .signup-selection input[type="radio"], .signup-selection input[type="checkbox"], .dashboard-checkboxes input[type="checkbox"], #Filters input[type="checkbox"] {
					display: none;
				}

				.signup-selection input[type="checkbox"]#InstructionsCheckbox, .signup-selection input[type="checkbox"]#InstructionsCheckbox-Mobile, .signup-selection input[type="checkbox"]#BillingAddressCheckbox, .signup-selection input[type="checkbox"]#BillingAddressCheckbox-Mobile, .signup-selection input[type="checkbox"]#PromoCheckbox, .signup-selection input[type="checkbox"]#PromoCheckbox-Mobile {
						display: inline-block;
						width: 25px;
						margin: 3px 5px 3px 0;
					}
				
					.quiz-selection label.popup-toggle-label, .quiz-selection label.popup-toggle-label-mobile, .quiz-selection label.popup-toggle-label-mobile-fruit-veg, .quiz-selection label.popup-toggle-label-mobile-groceries {
						border-radius: 4px;
						display: inline-block;
						padding: 2px;
						height: 120px;
					}

						.quiz-selection label.popup-toggle-label svg { 
							width: 120px;
							height: 120px;
						}

							.quiz-selection label.popup-toggle-label-mobile {
								height: 67px;
								width: 150px; 
							}
						
							.quiz-selection label.popup-toggle-label-mobile svg {
								width: 100%;
								height: 67px;
							}

							.quiz-selection label.popup-toggle-label-mobile-fruit-veg {
								height: 85px;
								width: 147px;
							}

							.quiz-selection label.popup-toggle-label-mobile-fruit-veg svg {
								width: 100%;
								height: 85px;
							}

							.quiz-selection label.popup-toggle-label-mobile-groceries {
								height: 106px;
								width: 145px;
							}

							.quiz-selection label.popup-toggle-label-mobile-groceries svg {
								width: 100%;
								height: 106px;
							}

							.quiz-selection-multi-line label.popup-toggle-label, .quiz-selection-multi-line label.popup-toggle-label svg, .signup-selection-multi-line label.popup-toggle-label, .signup-selection-multi-line label.popup-toggle-label svg { height: 87px; }
					
					.quiz-selection input[type="radio"]:checked + label, .quiz-selection input[type="checkbox"]:checked + label, .signup-selection input[type="radio"]:checked + label, .signup-selection input[type="checkbox"]:checked + label {
						background-color: #2E3527;
						cursor: default;
					}

				.quiz-slider {
					width: 100%;
					margin-bottom: 0;
					-webkit-appearance: none;
						appearance: none;
					height: 15px;
					background: #DEE2E3;
					outline: none;
					/*opacity: 0.7;
					-webkit-transition: .2s;
						transition: opacity .2s;*/
					border: 0;
					border-radius: 0;
				}

					/*.quiz-slider:hover {
						opacity: 1;
					}*/

					.quiz-slider::-webkit-slider-thumb {
						-webkit-appearance: none;
						border-radius: 50%;
						background: url('/_home/Images/Icons/slider.svg') center/contain no-repeat content-box,#2E3527;
						z-index: 1;
						position: relative;
						width: 35px;	
						height: 35px;
						padding: 5px; /* Offset the background image from the edges */
					}

					.quiz-slider::-moz-range-thumb {
						width: 35px;
						height: 35px;
						background: url('/_home/Images/Icons/slider.svg') center/contain no-repeat content-box,#2E3527;
						cursor: pointer;
					}
				
				.quiz-selection table, .signup-selection table {
					width: 100%; 
					margin: 20px auto;
				}

				.signup-subtitle { margin-bottom: 20px; }

			.quiz-button, .signup-button {
				padding: 15px 0 0 0;
			}

				.quiz-button input#Submit, .quiz-button input#Submit-Mobile, .signup-button input#Submit, .signup-button input#Submit-Mobile { 
					width: 45%; 
					color: #FFFFFF;
					background-color: #2E3527;
					text-transform: uppercase;
					margin-bottom: 15px;
				}

					.quiz-button input#Submit-Mobile, .signup-button input#Submit-Mobile { 
						width: 100%; 
						font-size: 1em;
					}

			.quiz-skip a, .signup-skip a { text-decoration: underline; }

			.quiz-item-description, .signup-item-description { margin-top: 0; }
			
			.quiz-image img, .signup-image img { max-width: 100%; }

			.quiz-basket-items, .signup-basket-items {
				max-width: 740px; 
				margin: 5px auto 10px auto;
				line-height: 1.4em;
			}

				.quiz-basket-items span.item-name, .signup-basket-items span.item-name {
					white-space: nowrap;
				}

			.quiz-basket-count, .signup-basket-count { margin-bottom: 50px; }

		a.signup-wide-button {
			font-size: 14px;
			display: block;
			border-radius: 3px;
		}

		.signup-button {
			cursor: pointer;
			background-color: #2E3527;
			color: #FFFFFF;
			padding: 10px 50px;
			max-width: 300px;
			margin: 50px auto 0 auto;
			border: 2px solid #2E3527;
		}

			.signup-button:hover {
				background-color: #FFFFFF;
				color: #2E3527;
			}

#Shop {
	background-color: #FFFFFF;
	margin-top: -20px;
	margin-bottom: 100px;
}

	#Shop.pdp-shop { padding: 0px 20px; }

	#ShopWrapper #Breadcrumbs, #ShopWrapper #BreadcrumbsMobile { 
		text-align: left;
	}

		#ShopWrapper #Breadcrumbs a, #ShopWrapper #BreadcrumbsMobile a {
			font-family: "Spezia Narrow Medium", Arial, Helvetica, sans-serif;
			font-weight: 600;
			font-size: 12px;
			text-transform: uppercase;
		}

	#ShopWrapper #ShopContainer {
		margin-top: 20px;
		padding: 0 10px 10px 10px;
	}

	#ShopLeft {
		max-width: 150px;
		margin-right: 40px;
		/*position: sticky; 
		top: 172px;*/ /* Make Sure this matches the header height */
	}

		#ShopLeft hr {
			width: 100px;
			margin-left: 0;
			border: 1px solid #2E3527;
		}

		#ShopLeft #ShopCategories ul, #ShopLeft #ShopFilters ul, #ShopLeft #ShopFilters ul {
			margin-top: 20px;
			padding-left: 10px;
			padding-right: 10px;
			text-align: left;
			list-style: none;
			line-height: 16px;
		}

			#ShopLeft #ShopFilters ul { 
				padding-left: 0;
			}

			#ShopLeft #ShopCategories ul li, #ShopLeft #ShopFilters ul li {
				margin: 2px 0;
			}

				#ShopLeft #ShopCategories ul li a, #ShopLeft #ShopFilters ul li a {
					font-weight: 200;
				}

				#ShopLeft #ShopCategories ul li, #ShopLeft {
					margin: 2px 0;
				}

				#ShopFilters ul li input[type='checkbox'] {
					margin-left: 0;
				}

		#ShopLeft #ShopCategoryFilter {
			margin-top: 20px;
		}

	#Filters {
		text-align: center;
		margin-top: -40px;
		padding: 5px 0 0 0;
		position: sticky;
		top: 56px;
		z-index: 2400;
		background-color: #FFFFFF;
		max-width: 0;	/* This seems odd, but we set this via JS on load and on resize and if we don't do this here it has a weird jump load thing */
		margin-right: auto;
		margin-left: auto;
		height: 64px; /* 44px height of checkbox + 20px height "padding"*/
		white-space: nowrap;
		overflow-x: auto;
	}

		#Filters .filters-title {
			color: #2E3527;
			display: inline-block;
			margin-right: 20px;
			padding-left: 10px;
	}

	#CustomizeTitle {
		position: sticky;
		top: 110px;
		margin-top: -34px; /* This needs to match the delivery notifcation height */
		padding-top: 10px;	
		padding-bottom: 20px;
		margin-bottom: 20px;
		background-color: #FFFFFF;
		z-index: 2500;
	}
	
		#CustomizeProgressBar {
			font-size: 11px;
		}

	#ShopMain {
		text-align: left;
	}

		#ShopMain #ShopSearchBar {
			margin-top: 20px;
			margin-bottom: -60px; /* Difference between .category-title top and #ShopSearchBar top */
		}

		#ShopMain .category-title {
			/*margin-top: 80px;*/ /* Only use this if you are using the Top Search Bar */
			/*margin-top: 20px;*/
			padding-left: 10px;
		}

		#ShopMain .child-category-title {
			padding-left:10px;
		}

		.shop-flex-container, .basket-flex-container {
			justify-content: space-between;
		}	

		#ShopMain .shop-item, .vendor-items, #ManageSubscriptions .shop-item, #PastOrders .shop-item, #ShopMain .shop-item-transparent {
			background-color: #FFFFFF;
			padding: 10px;
			margin-top: 20px;
			box-shadow: 0px 0px 10px #0000001A;

			max-width: 40%;
			min-width: 40%;
			
			/* This is here so we can put .item-bottom on the bottom */
			display:flex; 
			flex-direction:column; 
			flex:1;
		}

			#ShopMain .popup-shop-item {
				max-width: 48%;
				padding: 0;
				margin-bottom: 5px;
			}

			#ShopMain .shop-item-transparent {
				background-color: transparent;
				height: 0;
				margin-top: 0;
				margin-bottom: 0;
				padding-top: 0;
				padding-bottom: 0;
			}
		
			#ShopMain .shop-item-recurring, #ManageSubscriptions .shop-item-recurring {
				background-color: #BED9F1;
			}

			#ShopMain .recurring-quantity, #ShopMain .recurring-quantity-with-max, #ManageSubscriptions .recurring-quantity, #ManageSubscriptions .recurring-quantity-with-max, #PastOrders .recurring-quantity, #PastOrders .recurring-quantity-with-max {
				color: #FFFFFF;
				font-size: 72px;
				line-height: normal;
				background-color: rgba(0,0,0,.5);
				width: 100%;
				height: calc(100% - 10px);
				position:absolute;	/* Make sure parent div is relative */
				top:0px; 
				left:0px;
				z-index: 2000;

				/* Vertical / Horizontal Center */
				display: flex; 
				justify-content: center; 
				align-content: center; 
				flex-direction: column;
				text-align: center;
			}

				#ShopMain .recurring-quantity-with-max {
					padding-top: 20px;
					height: calc(100% - 29px);
				}

				#ManageSubscriptions .recurring-quantity, #ManageSubscriptions .recurring-quantity-with-max {
					height: calc(100% - 7px);	/* You may want this for all, but for now just do this */
				}

				#ShopMain .recurring-quantity-with-max, #ManageSubscriptions .recurring-quantity-with-max, #PastOrders .recurring-quantity-with-max {
					justify-content: flex-start;
				}

				.mobile-current-quantity { margin-top: -5px; }

				.mobile-max-quantity { margin-top: -10px; }

				#ManageSubscriptions .recurring-date-display {
					margin-top: -15px;
				}

				#ManageSubscriptions .subscription-quantity { 
					margin-top: -15px;
				}

			#ShopMain .quantity-toggle, #ManageSubscriptions .quantity-toggle {
				position:absolute;	/* Make sure parent div is relative */
				bottom: 10px; 
				right: 10px;
				z-index: 2001;

				/* Vertical / Horizontal Center */
				/*display: flex;*/
				/*justify-content: center; 
				align-content: center; 
				flex-direction: column;
				text-align: center;*/
			}

				#ManageSubscriptions .quantity-toggle {
					bottom:0;
				}

				#ShopMain .quantity-toggle svg.quantity-toggle-desktop-plus, #ManageSubscriptions .quantity-toggle svg.quantity-toggle-desktop-plus {
					width: 75px;
				}

				#ShopMain .quantity-toggle svg.quantity-toggle-desktop-pair-plus, #ShopMain .quantity-toggle svg.quantity-toggle-desktop-pair-minus, #ManageSubscriptions .quantity-toggle svg.quantity-toggle-desktop-pair-plus, #ManageSubscriptions .quantity-toggle svg.quantity-toggle-desktop-pair-minus {
					width: 96px;
				}

				.quantity-toggle-hide { display: none; }
					div.quantity-toggle-hide-flex { display: none; }
				.quantity-toggle-display { display: block; }
					div.quantity-toggle-display-flex { display: flex; }

			#ManageSubscriptions .remove-subscription {
				position: absolute;
				top: 10px;
				right: 10px;
				z-index: 2002;
				text-align: right;
			}

			#ShopMain #AddOnHeroContainer {
				height: 350px;
				width: 100%;
			}

				#ShopMain #AddOnHeroContainer #HeroShopAll, #HeroShopAllMobile {
					height: 100%;
					padding: 0;
					margin: 0;
				}

					#ShopMain #AddOnHeroContainer .swiper, #ShopMain #HeroNoSupport, #ShopMain #HeroNoSupportMobile {
						width: 100%; 
						height: 100%;
						background-color: #2E3527;
						border-radius: 10px;
					}
					
						#ShopMain #AddOnHeroContainer .swiper img, #ShopMain #HeroNoSupport img, #ShopMain #HeroNoSupportMobile img {
							min-width: 100%;
							min-height: 100%;
							object-fit: cover;
						}
			
				#ShopMain #AddOnHero {
					display: flex; 
					justify-content: center; 
					align-items: center; 
					text-align: center;
					padding: 0 40px;
					height: 400px; 
					background-size: cover;
					background-position: bottom left;
					border-radius: 4px;
				}

			#ShopMain #HeroNoSupport, #ShopMain #HeroNoSupportMobile { height: 400px; }
			
			#ShopMain .shop-item-photo, .vendor-items .shop-item-photo, #ManageSubscriptions .shop-item-photo, #PastOrders .shop-item-photo {
				position: relative;
				padding-bottom: .75%; /* Aspect ratio 300x225 */
				margin: -10px -10px 0 -10px; /* Make this match the padding above */
			}

				#ShopMain .shop-vendor-item .shop-item-photo {
					padding-bottom: .66%; /* Aspect ratio 350x233 */
					/*margin-top: 20px;*/
				}

				#PastOrders .shop-item-photo {
					margin: 0;
				}

				#ShopMain .shop-item-photo img, .vendor-items .shop-item-photo img, #ManageSubscriptions .shop-item-photo img, #PastOrders .shop-item-photo img {
					object-fit: cover;
					width: 100%;
					max-height: 240px;
				}

					#ShopMain .shop-vendor-item .shop-item-photo img {
						max-height: 233px; /* Aspect ratio 350x233 */
					}

					#ShopMain .out-of-stock img, #ShopMain .out-of-stock img {
						filter: grayscale(1);
					}
				
				#ShopMain .shop-item-photo .lazy-plp {
					min-height: 115px;
				}

			#ShopMain .shop-item-name, .vendor-items .shop-item-name, #ManageSubscriptions .shop-item-name {
				padding: 10px 0;
			}

				#ShopMain .shop-item-name-addon, .vendor-items .shop-item-name-addon, #ManageSubscriptions .shop-item-name-addon {
					height: 45px;
					vertical-align: top;
					overflow: hidden;
					text-overflow: ellipsis;
				}

					#ShopMain .flex-column .shop-item-name-addon {
						height: unset;	/* We handle this via flexbox now */
						flex: 1;
					}

				#ShopMain .shop-item-bundle-content {
					margin-top: 10px;
				}

			#ShopMain .shop-item-tags {
				height: 16px;
				margin-top: 5px;
				color: #3E5D7A;
			}

			#ShopMain .shop-item-teaser {
				margin-top: 10px;
				height: 92px;
			}

			#ShopMain .variant-wrapper, #FrequencyPopUp .variant-wrapper {
				margin-top: 10px;
			}

			#ShopMain .variant-selection, #FrequencyPopUp .variant-selection {
				margin-bottom: 10px;
				font-size: 12px;
			}

				#ShopMain .variant-selection select, #FrequencyPopUp .variant-selection select {
					margin-bottom: 0;
					font-size: 12pt;
				}

			#ShopMain .vendor-item-wrapper {
				/*margin: 0 -10px;*/
				margin: 0;
			}

			#ShopMain .shop-item-description, #ManageSubscriptions .shop-item-description {
				height: 24px;
				white-space: nowrap;
    			vertical-align: top;
				overflow: hidden;
				text-overflow: ellipsis;
				color: rgba(13.3,13.3,13.3,.7);
			}

				#ShopMain .popup-shop-item-description {
					padding: 5px;
				}

				#ShopMain .shop-item-description a, #ManageSubscriptions .shop-item-description a {
					color: #707070;
				}

			#ShopMain .shop-item-price, #ManageSubscriptions .shop-item-price {
				color: #2E3527;
				margin-top: 10px;
			}

			#ShopMain .shop-item-bottom, #ManageSubscriptions .shop-item-bottom {
				margin-top: auto; /* This in conjunciton with .shop-item being set to flex above should work */
			}

				#ShopMain .shop-item-bottom .shop-item-uom {
					font-family: "Spezia Narrow Medium", Arial, Helvetica, sans-serif;
					color: #72757E;
					font-size: 14px;
				}

				#ShopMain .shop-item-bottom .shop-item-button, #ManageSubscriptions .shop-item-bottom .shop-item-button {
					text-align: center;
				}

					#ShopMain .shop-item-bottom .shop-item-button a.item-button, #ManageSubscriptions a.item-button {
						font-family: "Spezia Narrow Medium", Arial, Helvetica, sans-serif;
						font-weight: 600;
						font-size: 16px;
						text-transform: uppercase;
						background-color: #2E3527;
						color: #FFFFFF;
						display: block;
						border-radius: 4px;
						padding: 5px 0;
						border: 0;
						-webkit-appearance: none;
							-moz-appearance: none;
							appearance: none;
						text-decoration: none;
					}

						#ManageSubscriptions a.item-button {
							height: 12px;
						}
			
			#ShopMain .shop-price-markout, #ManageSubscriptions .shop-price-markout, #ShopMain .shop-price-markout-empty, #ManageSubscriptions .shop-price-markout-empty {
				text-align: right;
				font-family: "Spezia Narrow Medium", Arial, Helvetica, sans-serif;
				font-weight: 700;
				/*font-size: 20px;*/
				color: #72757E;
				text-decoration: line-through;
			}

				#ShopMain .shop-price-markout-empty, #ManageSubscriptions .shop-price-markout-empty {
					text-decoration: none;
				}

			#ShopMain .shop-price-sale, #ManageSubscriptions .shop-price-for-sale {
				text-align: right;
				font-family: "Spezia Narrow Medium", Arial, Helvetica, sans-serif;
				font-weight: 700;
				/*font-size: 20px;*/
				color: #EB5C4A;
			}

				#ShopMain .shop-price-sale svg, #ManageSubscriptions .shop-price-sale svg {
					height: 10px;
					margin-right: 2px;
				}

			#ShopMain .shop-item-frequency, #ManageSubscriptions .shop-item-frequency {
				text-align: center;
				border-top: 1px solid #EFEFEF;
				margin: 10px -10px 0 -10px;
				padding-top: 10px;
			}

				#ShopMain .shop-item-frequency svg, #ShopMain img.plp-frequency-spinner, #ManageSubscriptions .shop-item-frequency svg {
					width: 12px;
					margin-right: 5px;
				}

				#ShopMain .shop-item-frequency-empty {
					background-color: #FFFFFF;
					border-top-color: #FFFFFF;
					height: 37px;
					margin-bottom: -20px;
				}

			#ShopMain .flex-column {
				height: 100%;
			}

				#ShopMain .flex-column .shop-item-container { 
					width: 100%;
				}

			#ShopMain .replace-button {
				font-family: var(--font-secondary-bold-semi);
				text-transform: uppercase;
				background-color: var(--color-primary);
				font-size: 14px;
				color: var(--color-white);
				width: 100%;
				text-align: center;
				-webkit-appearance: none;
					-moz-appearance: none;
				margin-top: 10px;
				margin-bottom: 0;
				cursor: pointer;
			}

				#ShopMain .replace-button:hover {
					color: var(--color-primary);
					background-color: var(--color-white);
				}

				#ShopMain .replace-button-transparent, #ShopMain .replace-button-transparent:hover {
					background-color: transparent;
					color: transparent;
					border-color: transparent;
					cursor: default;
				}

		#ShopMain #ItemHeader {

		}

			#ShopMain #ItemHeader section.item-image-wrapper {
				max-width: 438px;
			}

				#ShopMain #ItemHeader section.item-image-wrapper section.item-image, #ShopMain #ItemHeader section.item-image-wrapper div.item-images {
					position: relative;
				}

					#ShopMain #ItemHeader section.item-image-wrapper section.item-image span.item-unavailable-overlay {
						position: absolute;
						top: 50%;
						left: 50%;
						transform: translate(-50%, -50%);
						font-family: 'Dom Diagonal W03 Rg';
						font-size: 36px;
						color: #FFFFFF;
					}

					#ShopMain #ItemHeader section.item-image-wrapper section.item-image img.item-unavailable {
						filter: brightness(0.5);
					}


					#ShopMain #ItemHeader section.item-image-wrapper div.item-images {
						gap: 5px;
					}

						#ShopMain #ItemHeader section.item-image-wrapper div.item-images section.small-item-image {
							flex: 0 0 24%;
						}

							#ShopMain #ItemHeader section.item-image-wrapper div.item-images section.small-item-image div {
								position: relative;
								padding-bottom: 56.25%;
							}

								#ShopMain #ItemHeader section.item-image-wrapper div.item-images section.small-item-image div img {
									position: absolute;
									top: 0;
									left: 0;
									width: 100%;
									height: 100%;
									object-fit: cover;
									border: 2px solid #FFFFFF;
								}

								#ShopMain #ItemHeader section.item-image-wrapper div.item-images section.small-item-image div img.small-image-selected {
									border: 2px solid #D7EBB4;
								}

			#ShopMain #ItemHeader div.item-description {
				margin-left: 40px;
			}

			#ShopMain div.item-name {
				margin-bottom: 10px;
			}

			#ShopMain div.item-vendor-name, #ShopMain div.item-price {
				margin-bottom: 5px;
			}

			#ShopMain .item-description-description {
				margin-top: 20px;
				border-top: 1px solid #707070;
				padding-top: 20px;
			}

			#ShopMain .item-badges {
				color: #2E3527;
				font-family: 'Spezia Narrow Medium';
				font-size: 20px;
				font-style: normal;
				font-weight: 500;
				line-height: normal;
				text-transform: capitalize;
			}

			#ShopMain div.custom-select {
				margin: 20px 0;	/* This should match item-order-date-selector below */
			}

				#ShopMain .vendor-item-order-date div.custom-select {
					margin: 0;
				}
			
			#ShopMain select.item-order-date-selector {
				height: 50px;
				border-radius: 4px;
				background: #2E3527;
				padding: 5px;
				text-align: center;
				margin: 20px 0;	/* This should match custom-select above */
				color: #F9F9F7;
				font-family: "Spezia Narrow Medium", ;
				font-size: 16px;
				font-style: normal;
				font-weight: 700;
				line-height: normal;
				-webkit-appearance: none;
				background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2218%22%20height%3D%2213%22%20viewBox%3D%220%200%2018%2013%22%20fill%3D%22none%22%3E%3Cpath%20d%3D%22M9%2012.3954L0%202.53424L1.6125%200.767456L9%208.90288L16.3875%200.808544L18%202.57533L9%2012.3954Z%22%20fill%3D%22%23F9F9F7%22%2F%3E%3C%2Fsvg%3E");
				background-size: .8em;
				background-position: calc(100% - 1.3em) center;
				background-repeat: no-repeat;
			}

				#ShopMain .vendor-item-order-date select.item-order-date-selector { margin: 0; }

				#ShopMain select.item-order-date-selector option {
					background: #2E3527;
					color: #F9F9F7;
				}

			#ShopMain .item-selection table {
				margin-top: 20px;
			}

				#ShopMain .vendor-item-frequency table { margin-top: 0; }

				#ShopMain .item-selection td.item-quantity {
					width: 40px;
					vertical-align: top;
					text-align: center;
				}
					
					#ShopMain .item-selection td.item-quantity div {
						background-color: #FFFFFF;
						height: 30px;
						vertical-align: middle;
						padding-top: 13px;
						min-width: 30px;
					}
					
				#ShopMain .item-selection td.item-frequency {
					vertical-align: top;
					padding: 10px 0 0 20px;
				}

					#ShopMain .item-selection td.item-frequency-no-left-padding {
						padding-left: 0;
					}

					#ShopMain .vendor-item-frequency {
						padding: 5px 0 0 0;
						max-width: 123px;
					}
					
					a.frequency-button, #ShopMain .item-selection td.item-frequency .frequency-button, #ShopMain #MobileItemDetails .frequency-button {
						padding: 10px 30px;
						background-color: #FFFFFF;
						color: #2E3527;
						border: 2px solid #2E3527;
					}
					
						a.frequency-button svg, #ShopMain .item-selection td.item-frequency .frequency-button svg, #ShopMain #MobileItemDetails .frequency-button svg {
							height: 12px;
						}

						#ShopMain .vendor-item-frequency .frequency-button {
							padding: 5px 10px;
							text-transform: none;
							font-size: 14px;
							font-weight: 500;
						}

						#ShopMain .shop-item-action .shop-frequency {
							min-width: 100px;
						}

							#ShopMain .shop-item-action a.frequency-button {
								padding: 5px 10px 5px 5px;
								font-size: 14px;
							}

			#ShopMain .shop-item-action {
				margin: 10px 0 0 0;
				flex: 1;
				gap: 17px;
			}
			
			#ShopMain .item-vendor-about, #ShopMain .item-faq-container, #ShopMain .item-vendor-title {
				margin-top: 40px;
			}

		#PopupShop .shop-item {
			background-color: #FFFFFF;
			margin-top: 20px;
			box-shadow: 0px 0px 10px #0000001A;
		}

		#ShopMain .basket-contents {
			margin-top: 20px;
			gap: 5px 10px;
		}

			#ShopMain .basket-contents button {
				padding: .5em 6em;
				margin-bottom: 10px;
				text-transform: capitalize;
			}

		#ShopMain .recent-hide, header .recent-hide, #ShopLeft .recent-hide { display: none; }

	#ShopRight {
		/*max-width: 275px;*/
		max-width: 365px;
		margin-left: 40px;
		/*position: sticky; 
		top: 80px;*/ /* Make Sure this matches the header height */
	}

		.sticky__inner{
			position: relative;
			transform: translate(0, 0);
			transform: translate3d(0, 0, 0);
			will-change: position, transform;
		}

		#ShopRight #YourOrders {
			/*width: 245px;*/	/* 30 less than #ShopRight max-width - corresponds to 15px padding */
			width: 335px;		/* 30 less than #ShopRight max-width - corresponds to 15px padding */
			padding: 10px 15px;
			background-color: #2E3527;
			color: #FFFFFF;
			text-align: left;
			border-radius: 4px 4px 0 0;
		}

		#ShopRight #UpcomingOrders {
			/*width: 235px;*/	/* 40 less than #ShopRight max-width - corresponds to 20px padding */
			width: 325px;		/* 40 less than #ShopRight max-width - corresponds to 20px padding */
			background-color: #FFFFFF;
			text-align: left;
			padding: 20px 20px 0 20px;	/* These need to match #.mineral-green-background Below */
		}

			#ShoppingCartCollapse .upcoming-order, #ShopRight #UpcomingOrders .upcoming-order, #MobileShoppingCart #MobileShoppingCartBody .upcoming-order {
				padding-bottom: 20px; 	/* This needs to match #Upcoming Orders Above */
			}

				#ShoppingCartCollapse .upcoming-order-skipped, #ShopRight #UpcomingOrders .upcoming-order-skipped, #MobileShoppingCart #MobileShoppingCartBody .upcoming-order-skipped {
					color: rgba(13.3,13.3,13.3,.3);
				}

					#ShoppingCartCollapse .upcoming-order-skipped .basket-icon svg, #ShopRight #UpcomingOrders .upcoming-order-skipped .basket-icon svg, #MobileShoppingCart #MobileShoppingCartBody .upcoming-order-skipped .basket-icon svg {
						opacity: 33%;
					}

				#ShoppingCartCollapse .mineral-green-background, #ShopRight #UpcomingOrders .mineral-green-background, #ShopRight #UpcomingOrders .order-totals, #MobileShoppingCart #MobileShoppingCartBody .mineral-green-background, #MobileShoppingCart #MobileShoppingCartBody .orders-totals {
					background-color: #DEE2E3;
					margin: -10px -20px 10px -20px;	/* These need to match #Upcoming Orders Above */
					padding: 10px 20px 10px 20px;	/* These need to match #Upcoming Orders Above */
				}

					#ShoppingCartCollapse .order-totals, #ShopRight #UpcomingOrders .order-totals, #MobileShoppingCart #MobileShoppingCartBody .order-totals {
						margin-top: 40px;
						background-color: #FFFFFF;
					}

						#ShoppingCartCollapse table.order-donate-skip-restore-table, #ShopRight #UpcomingOrders table.order-donate-skip-restore-table, #MobileShoppingCart #MobileShoppingCartBody table.order-donate-skip-restore-table {
							width: 100%;
							margin-top: 20px;
						}

							#ShoppingCartCollapse table.order-donate-skip-restore-table a, #ShopRight #UpcomingOrders table.order-donate-skip-restore-table a, #MobileShoppingCart #MobileShoppingCartBody table.order-donate-skip-restore-table a {
								font-family: 'Spezia Narrow Medium', Helvetica, Arial, sans-serif;
								font-size: 14px;
								text-transform: uppercase;
								background-color: transparent;
								color: #2E3527;
								border: #2E3527 3px solid;
								border-radius: 10px;
								padding: .25em 1.5em;
								-webkit-appearance: none;
									-moz-appearance: none;
									appearance: none;
								text-decoration: none;
								display: block;
								text-align: center;
							}

							#ShoppingCartCollapse table.order-donate-skip-restore-table a.normal-link {
								display: inline;
								border: 0;
								text-decoration: underline;
								padding: 0;
								text-transform: none;
							}

					#ShoppingCartCollapse .delivery-progress, #ShopRight #UpcomingOrders .delivery-progress {
						margin: 40px -20px 0 -20px;
						padding: 10px 20px;
						background-color: #DEE2E3;
						text-align: center;
					}

				#ShoppingCartCollapse .basket-icon, #ShopRight #UpcomingOrders .basket-icon, #MobileShoppingCart #MobileShoppingCartBody .basket-icon {
					padding: 0 10px 0 0;
				}

					#ShoppingCartCollapse .basket-icon svg, #ShopRight #UpcomingOrders .basket-icon svg, #MobileShoppingCart #MobileShoppingCartBody .basket-icon svg {
						width: 22px;
					}

				#ShoppingCartCollapse .delivery-date, #ShopRight #UpcomingOrders .delivery-date, #MobileShoppingCart #MobileShoppingCartBody .delivery-date {
					max-width: 200px;
				}

				#ShoppingCartCollapse .delivery-actions, #ShopRight #UpcomingOrders .delivery-actions, #MobileShoppingCart #MobileShoppingCartBody .delivery-actions {
					flex-grow: 1;
				}

					#ShoppingCartCollapse .delivery-actions svg, #ShopRight #UpcomingOrders .delivery-actions svg, #MobileShoppingCart #MobileShoppingCartBody .delivery-actions svg {
						width: 22px;
					}

					#ShoppingCartCollapse table.basket-table, #ShopRight #UpcomingOrders table.basket-table, #MobileShoppingCart #MobileShoppingCartBody table.basket-table {
						margin-bottom: 20px;
						width: 100%;
					}

					#ShoppingCartCollapse table.basket-table td span.reorder-icon svg, #ShoppingCartCollapse span.reorder-icon svg, #ShopRight #UpcomingOrders table.basket-table td span.reorder-icon svg, #ShopRight #UpcomingOrders span.reorder-icon svg, #MobileShoppingCart #MobileShoppingCartBody table.basket-table td span.reorder-icon svg, #MobileShoppingCart #MobileShoppingCartBody span.reorder-icon svg {
							width: 10px;
						}

						#ShoppingCartCollapse table.basket-items, #ShopRight #UpcomingOrders table.basket-items, #MobileShoppingCart #MobileShoppingCartBody table.basket-items {
							width: 100%;
						}

						#ShoppingCartCollapse div.customize-basket, #ShopRight #UpcomingOrders td.customize-basket, #MobileShoppingCart #MobileShoppingCartBody td.customize-basket {
							padding-top: 10px;
							padding-bottom: 10px;
						}
							
							#ShoppingCartCollapse div.customize-basket a.button, #ShopRight #UpcomingOrders td.customize-basket a.button, #MobileShoppingCart #MobileShoppingCartBody td.customize-basket a.button, #ShoppingCartCollapse div.customize-basket span.button-coming-soon {
								/*background-color: #FFFFFF;
								border: #2E3527 2px solid;
								color: #2E3527;*/
								background-color: #2E3527;
								border: #2E3527 2px solid;
								color: #FFFFFF;
								/*padding: 1px 5px;
								margin: 0;*/
								padding: 3px 5px;
								margin: 0 100px;
								display: block;
								text-align: center;
								font-family: "Spezia Narrow Medium", Arial, Helvetica, sans-serif;
								font-weight: 600;
								font-size: 14px;
							}

								#ShoppingCartCollapse div.customize-basket span.button-coming-soon {
									background-color: #525252;
									margin: 0 50px;
									cursor: default;
								}

							#ShoppingCartCollapse .basket-title {
								padding-right: 10px;
							}

					#ShoppingCartCollapse .add-on-header, #ShopRight #UpcomingOrders .add-on-header, #MobileShoppingCart #MobileShoppingCartBody .add-on-header {
						/*padding-top: 20px;*/
						margin-bottom: 10px;
					}

					#ShoppingCartCollapse .add-on-table, #ShopRight #UpcomingOrders .add-on-table, #MobileShoppingCart #MobileShoppingCartBody .add-on-table {
						width: 100%;
						margin-bottom: 20px;
					}

					#ShoppingCartCollapse .no-add-on-cart, #ShopRight #UpcomingOrders .no-add-on-cart, #MobileShoppingCart #MobileShoppingCartBody .no-add-on-cart {
						margin: 20px -20px 0 -20px;
						padding: 20px;
						text-align: center;
						background-color: #E5E5E5;
					}

					#ShoppingCartCollapse .item-name, #ShopRight #UpcomingOrders .item-name, #MobileShoppingCart #MobileShoppingCartBody .item-name {
						padding-left: 10px;
					}

					#ShoppingCartCollapse .item-remove, #ShopRight #UpcomingOrders .item-remove, #MobileShoppingCart #MobileShoppingCartBody .item-remove {
						padding-left: 5px;
					}

						#ShoppingCartCollapse .item-remove svg, #ShopRight #UpcomingOrders .item-remove svg, #MobileShoppingCart #MobileShoppingCartBody .item-remove svg {
							width: 7px;
						}

					#ShoppingCartCollapse table.order-total-table, #ShopRight #UpcomingOrders table.order-total-table, #MobileShoppingCart #MobileShoppingCartBody table.order-total-table {
						width: 100%;
					}

						#ShoppingCartCollapse table.order-total-table td, #ShopRight #UpcomingOrders table.order-total-table td, #MobileShoppingCart #MobileShoppingCartBody table.order-total-table td, #Dashboard table.order-total-table td {
							font-family: "Spezia Narrow Medium", Arial, Helvetica, sans-serif;
							font-weight: 500;
							font-size: 14px;
						}

							#ShoppingCartCollapse table.order-total-table td span.bounty-leaf svg, #ShopRight #UpcomingOrders table.order-total-table td span.bounty-leaf svg, #MobileShoppingCart #MobileShoppingCartBody table.order-total-table td span.bounty-leaf svg, #Dashboard table.order-total-table td span.bounty-leaf svg {
								width: 10px;
							}

							#ShoppingCartCollapse table.order-total-table td.proxima-nova-bold, #ShopRight #UpcomingOrders table.order-total-table td.proxima-nova-bold, #MobileShoppingCart #MobileShoppingCartBody table.order-total-table td.proxima-nova-bold, #Dashboard table.order-total-table td.proxima-nova-bold {
								font-family: "Spezia Narrow Medium", Arial, Helvetica, sans-serif;
								font-weight: 700;
							}

							#ShoppingCartCollapse table.order-total-table hr, #ShopRight #UpcomingOrders table.order-total-table hr, #MobileShoppingCart #MobileShoppingCartBody table-order-total-table hr, #Dashboard table.order-total-table hr {
								border-top: 1px solid #2E3527;
							}

					#ShoppingCartCollapse .order-spacer, #ShopRight #UpcomingOrders .order-spacer, #MobileShoppingCart #MobileShoppingCartBody .order-spacer {
						background-color: #FFFFFF;
						height: 20px;
					}

					#ShoppingCartCollapse table.order-total-table a, #ShopRight #UpcomingOrders table.order-total-table a, #MobileShoppingCart #MobileShoppingCartBody table-order-total-table a {
						text-decoration: underline;
						color: #2E3527;
					}

						#ShoppingCartCollapse table.order-total-table a:hover, #ShopRight #UpcomingOrders table.order-total-table a:hover {
							color: #2E3527;
						}

					#ShoppingCartCollapse div.order-total-sustainable, div.order-total-sustainable {
						display: flex;
						gap: 5px;
						align-items: center;
					}

						#ShoppingCartCollapse div.order-total-sustainable img.question-icon, div.order-total-sustainable img.question-icon {
							height: 14px;
						}

						#ShoppingCartCollapse div.order-total-sustainable div.question-icon, div.order-total-sustainable div.question-icon {
							line-height: 14px;
							height: 14px;
							position: relative;
  							display: inline-block;
						}

							#ShoppingCartCollapse div.order-total-sustainable div.question-icon .question-tooltip, div.order-total-sustainable div.question-icon .question-tooltip {
								visibility: hidden;
								width: 290px;
								background-color: #FFFFFF;
								text-align: center;
								position: absolute;
								z-index: 1;
								bottom: 28px;	/* 2px + height of question icon above */
								left: 50%;
								margin-left: -145px /* Use half of the width above, to center the tooltip */
							}

								#ShoppingCartCollapse div.order-total-sustainable div.question-icon:hover .question-tooltip, div.order-total-sustainable div.question-icon:hover .question-tooltip {
									visibility: visible;
								}

								#ShoppingCartCollapse div.order-total-sustainable div.question-icon .question-tooltip .question-tooltip-text, div.order-total-sustainable div.question-icon .question-tooltip .question-tooltip-text {
									border: 1px solid #2E3527;
									padding: 5px 5px 10px 5px;
									color: #2E3527;
								}

								#ShoppingCartCollapse div.order-total-sustainable div.question-icon .question-tooltip .question-tooltip-pointer, div.order-total-sustainable div.question-icon .question-tooltip .question-tooltip-pointer {
									margin: 0;
									padding: 0;
									position: absolute;
									bottom: -12px;
									left: 50%;
									transform: translateX(-50%);
								}
						

				#ShoppingCartCollapse .basket-progress, #ShopRight #UpcomingOrders .basket-progress, #MobileShoppingCart #MobileShoppingCartBody .basket-progress {
					background-color: #E5E5E5;
					color: #2E3527;
					margin: 0px -20px 20px -20px;
					padding: 10px 30px;
				}

					#ShoppingCartCollapse .basket-progress .progress-bar, #ShopRight #UpcomingOrders .basket-progress .progress-bar, #MobileShoppingCart #MobileShoppingCartBody .basket-progress .progress-bar, #CustomizeProgressBar .basket-progress .progress-bar {
						background-color: #FFFFFF;
						border-radius: 4px;
						height: 20px;
					}

						#CustomizeProgressBar .basket-progress .progress-bar {
							border: 2px solid #2E3527;
							border-radius: 5px;
						}

						#ShoppingCartCollapse .basket-progress .progress-bar-progress, #ShopRight #UpcomingOrders .basket-progress .progress-bar-progress, #MobileShoppingCart #MobileShoppingCartBody .basket-progress .progress-bar-progress, #CustomizeProgressBar .basket-progress .progress-bar-progress {
							background-color: #2E3527;
							border-top-left-radius: 5px;
							border-bottom-left-radius: 5px;
							height: 20px;
						}

							#CustomizeProgressBar .basket-progress .progress-bar-progress {
								border-top-left-radius: 0;
								border-bottom-left-radius: 0;
							}

							#ShoppingCartCollapse .basket-progress .progress-bar-progress-full, #ShopRight #UpcomingOrders .basket-progress .progress-bar-progress-full, #MobileShoppingCart #MobileShoppingCartBody .basket-progress .progress-bar-progress-full, #CustomizeProgressBar .basket-progress .progress-bar-progress-full {
								border-top-right-radius: 5px;
								border-bottom-right-radius: 5px;
							}

								#CustomizeProgressBar .basket-progress .progress-bar-progress-full {
									border-top-right-radius: 0;
									border-bottom-right-radius: 0;
								}

	#ShopLeftMargin, #ShopRightMargin {
		/*max-width: 90px;*/
		max-width: 10px;
	}

	#ShoppingCartCollapse {
		position: fixed;
		z-index: 3001;
		height: 0;		/* This is set via JavaScript */
		bottom: 0;
		right: 0;
		
		color: #2E3527;
		width: 400px;
		padding: 10px;
		background-color: #FFFFFF;
		overflow-y: auto;
		overflow-x: hidden;
	}

		#ShoppingCartCollapse .cart-collapse-menu {
			background-color: #F4F4F4;
			box-shadow: 0px 3px 6px #00000029;
			opacity: 1;
			margin: -10px -10px 0 -10px;
		}

			#ShoppingCartCollapse .cart-collapse-menu-item {
				background: #F4F4F4 0% 0% no-repeat padding-box;
				padding: 10px;
				cursor: pointer;
			}

			#ShoppingCartCollapse .cart-collapse-selected-item {
				background: #FFFFFF 0% 0% no-repeat padding-box;
				border-radius: 5px 5px 0px 0px;
			}

				#ShoppingCartCollapse .cart-collapse-menu-item:hover, #ShoppingCartCollapse .cart-collapse-selected-item:hover, #ShoppingCartCollapse .cart-collapse-selected-item {
					text-decoration: underline;
				}

			#ShoppingCartCollapse #ShoppingCartCollapseSelectedOrder {
				flex-grow: 1;
			}
	
		#ShoppingCartCollapse .cart-collapse-order-list {
			padding: 10px;
			border-bottom: 1px solid #707070;
			margin-left: -10px;
			margin-right: -10px;
		}

			#ShoppingCartCollapse .cart-collapse-order-list .cart-collapse-order-list-radio {
				width: 25px;
				padding-top: 3px;
				padding-right: 10px;
			}

				#ShoppingCartCollapse .cart-collapse-order-list .cart-collapse-order-list-radio input[type="radio"] {
					transform: scale(1.25);
				}

			#ShoppingCartCollapse .cart-collapse-order-list .cart-collapse-order-list-details {
				flex-grow: 1;
			}

				#ShoppingCartCollapse .cart-collapse-order-list .cart-collapse-order-list-item-count {
					width: 100px;
				}

			#ShoppingCartCollapse .cart-collapse-order-list .cart-collapse-order-list-actions {
				padding-left: 20px;
			}

				#ShoppingCartCollapse .cart-collapse-order-list .cart-collapse-order-list-actions .cart-collapse-order-list-actions-shop input.button {
					font-size: 14px;
					background-color: #2E3527;
					color: #FFFFFF;
					text-transform: uppercase;
					margin-bottom: 10px;
					padding: 0.25em 2.25em;
				}
		
		#ShoppingCartCollapse .cart-collapse-delivery {
			padding-top: 10px;
			margin-bottom: 40px;
		}

		#ShoppingCartCollapse #ShoppingCartCollapseOrders {
			display: none;
		}

		#CollapseUnder {
			display: none;
			position: fixed;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			background-color: rgba(34,34,34,.6);
			z-index: 3000;
		}

		#ShoppingCartCollapse #DeliveryDayFind {
			margin: 20px 50px;
		}

			#ShoppingCartCollapse #DeliveryDayFind #PopUpForm {
				padding: 0;
			}

			#ShoppingCartCollapse #DeliveryDayFind .delivery-title, #ShoppingCartCollapse #DeliveryDayFind .delivery-text {
				font-family: "Spezia Narrow Medium", Helvetica, Arial, sans-serif;
				color: #2E3527;
				font-size: 16px;
				margin: 10px 0;
			}

				#ShoppingCartCollapse #DeliveryDayFind .delivery-title {
					font-size: 20px;
					margin: 20px 0;
				}

				#ShoppingCartCollapse #DeliveryDayFind .delivery-text a {
					color: #6B86C3;
					text-decoration: underline;
				}

			#ShoppingCartCollapse #DeliveryDayFind .popup-button {
				padding: .5em 3em;
			}

			#ShoppingCartCollapse #DeliveryDayFind .popup-input {
				padding: 5px 10px;
				font-size: 16px;
			}

	#ShoppingCartCollapse .presignup-basket-banner {
		background-color: #FAC90541;
		padding: 10px;
		text-transform: uppercase;
		text-align: center;
		color: #222222;
		margin: 10px -10px 20px -10px;
		font-size: 12px;
	}

		#ShoppingCartCollapse .presignup-basket-banner-green {
			background-color: #BBDDC1;
		}

	#ShoppingCartCollapse #PreSignupFooter {
		position: fixed;
		bottom: 0;
		text-align: center;
		margin-left: -10px;
		margin-right: -10px;
		padding: 0 20px;
		background-color: #FFFFFF;
		width: 380px;	/* This needs to match #ShoppingCartCollapse + Margins From Above */
		box-shadow: inset 0px 1px 6px #00000029;
	}

	.order-simple-button, .order-complex-button {
		flex-grow: 1;
	}

	.order-selector-wrapper {
		color: #F9F9F7;
		font-family: "Spezia Narrow Medium", Helvetica, Arial, sans-serif;
		font-size: 14px;
		font-style: normal;
		font-weight: 700;
		line-height: normal;
		text-align: center;
		
		margin: -3px 0 0 0;
		padding: 5px;
		height: 20px;
		border-radius: 4px;
		-webkit-appearance: none;

		background-color: #2E3527;
		
		display: flex;
		flex-wrap: nowrap;	/* Possibly change this */
		align-items: center;
		align-content: space-between;
	}

		.order-selector-wrapper.out-of-stock {
			background-color: #72757E;
		}

		.order-selector-wrapper .order-selector-button {
			padding-right: 2px;
			cursor: pointer;
			margin-left: auto;
			margin-right: auto;
		}

			.out-of-stock .order-selector-button { cursor: default; }

		.order-selector-wrapper .order-selector-dropdown {
			margin: 1px 0 1px 5px;
			border-left: 1px solid #FFFFFF;
			padding-left: 5px;
			width: 23px;	/* 30 - padding (5px) - border (1px) - margin (1px + 1px) */
			height: 20px;

			background-image: url(data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2218%22%20height%3D%2213%22%20viewBox%3D%220%200%2018%2013%22%20fill%3D%22none%22%3E%3Cpath%20d%3D%22M9%2012.3954L0%202.53424L1.6125%200.767456L9%208.90288L16.3875%200.808544L18%202.57533L9%2012.3954Z%22%20fill%3D%22%23F9F9F7%22%2F%3E%3C%2Fsvg%3E);
			background-position: center;
			background-repeat: no-repeat;

		}

			.order-selector-dropdown .dropdown-content {
				width: 150px;
				top: 27px;
				right: -5px;
				left: auto;	
			}

				.order-selector-dropdown-closed .dropdown-content {
					display: none;
					position: absolute;
				}

				.order-selector-dropdown-open .dropdown-content {
					display: block;
					position: absolute;
					z-index: 5002;
				}

				.order-selector-dropdown .order-selector-bridge {
					background-color: transparent;
					height: 10px;
					margin-top: -10px;
				}

				.order-selector-dropdown .dropdown-content .order-selector-menu {
					border: 2px solid #2E3527;
					border-radius: 4px;
					background-color: #FFFFFF;
					color: #2E3527;
					cursor: pointer;
				}

				.order-selector-dropdown .dropdown-content .order-selector-date {
					padding: 5px 10px;
					border-bottom: #B1B7BD 1px solid;
					z-index: 5004;
					position: relative;
				}

					.order-selector-dropdown .dropdown-content .order-selector-date:hover {
						background-color: #2E3527;
						color: #FFFFFF;
					}

						.order-selector-dropdown .dropdown-content .order-selector-date.out-of-stock:hover { background-color: #72757E; }

					.order-selector-dropdown .dropdown-content .order-selector-date:last-child, .order-selector-dropdown .dropdown-content .order-selector-date.out-of-stock { border-bottom: none; }

#Dashboard {
	
}

	#Dashboard #DashboardPageTitle {
		font-family: "Cambon Demi", "Times New Roman", "Georgia", serif;
		font-weight: 700;
		font-size: 36px;
		padding: 40px 10px 20px 10px;
		color: #2E3527;
	}

	#Dashboard #DashboardNavigation {
		max-width: 250px;
		text-align: left;
		margin-right: 20px;
	}

		#DashboardNavigation .dashboard-navi {
			background-color: #FFFFFF;
			padding: 10px 20px;
			margin: 0 0 10px 0;
			vertical-align: middle;
			align-items: center;
		}

			#DashboardNavigation a .dashboard-navi {	
				height: 30px;
			}

			#DashboardNavigation .dashboard-navi-selected {
				background-color: #F2F1EE;
			}

			#DashboardNavigation .dashboard-navi .dashboard-navi-svg {
				max-width: 30px;
				min-width: 30px;
				margin-right: 20px;
			}

				#DashboardNavigation .dashboard-navi .dashboard-navi-svg svg {
					height: 26px;
				}

			#DashboardNavigation .dashboard-navi .dashboard-navi-text {
				color: #2E3527;
			}

	#Dashboard #DashboardMain  { }

		#DashboardMain .dashboard-content {
			background-color: #F2F1EE;
			text-align: left;
			color: #2E3527;
			font-size: 16px;
			padding: 20px 10px;
			margin-bottom: 40px;
		}

			#DashboardMain .dashboard-content .dashboard-content-header {
				font-family: "Cambon Demi", "Times New Roman", "Georgia", serif;
				font-weight: 700;
				font-size: 24px;
				margin-bottom: 20px;
				color: #2E3527;
			}

			#DashboardMain .dashboard-content .dashboard-content-subheader {
				font-family: "Spezia Narrow Medium", Arial, Helvetica, sans-serif;
				font-weight: 700;
				font-size: 16px;
				text-transform: uppercase;
				margin: 30px 0 10px 0;
				padding-bottom: 10px;
				border-bottom: 1px solid #707070;
				color: #2E3527;
			}

			#DashboardMain form div.flex-container {
				justify-content: space-between;
			}
			
			#DashboardMain form input, #DashboardMain form select {
				font-family: "Spezia Narrow Medium", Helvetica, Arial, sans-serif;
				font-size: 16px;
				padding: 10px;
				border: 3px solid #E5E5E5;
				border-radius: 5px;
			}

				#DashboardMain form input.select2-search__field {
					padding: initial;
					border: initial;
					border-radius: initial;	
				}

				#DashboardMain form section {
					margin-right: 20px;
				}

					#DashboardMain form section.dashboard-small {
						max-width: 100px;
					}

				#DashboardMain .dashboard-checkboxes input[type="checkbox"] + label, #Filters input[type="checkbox"] + label {
					font-family: "Spezia Narrow Medium", Arial, Helvetica, sans-serif;
					font-weight: 600;
					font-size: 16px;
					padding: 10px 20px;
					margin: 0 10px 10px 0;
					border-radius: 4px;
					background-color: #DEE2E3;
					color: #2E3527;
					white-space: nowrap;
					display: inline-block;
				}

					#DashboardMain .dashboard-checkboxes input[type="checkbox"]:checked + label, #Filters input[type="checkbox"]:checked + label {
						background-color: #2E3527;
						color: #FFFFFF;
						cursor: default;
					}

					#Filters input[type="checkbox"] + label {
						margin-bottom: 0;
					}

				#DashboardMain form input#Submit, #DashboardMain form a.dashboard-button {
					font-family: "Spezia Narrow Medium", Arial, Helvetica, sans-serif;
					font-weight: 600;
					font-size: 14px;
					text-transform: uppercase;
					background-color: #2E3527;
					color: #FFFFFF;
					border-color: #2E3527;
					padding: 15px 40px;
					-webkit-appearance: none;
				}

			#DashboardMain form div.dashboard-form-title {
				font-family: "Spezia Narrow Medium", Helvetica, Arial, sans-serif;
				font-size: 14px;
				text-transform: uppercase;
			}

			#DashboardMain form a {
				font-family: "Spezia Narrow Medium", Helvetica, Arial, sans-serif;
				font-size: 14px;
				text-transform: uppercase;
				text-decoration: underline;
				color: #2E3527;
			}

				#DashboardMain form a:hover {
					color: #2E3527;
				}

				#DashboardMain form .dashboard-button-div {
					margin-top: 40px;
				}

					#DashboardMain form a.dashboard-button {
						padding: 1em 3em;
						border: 0;
						-webkit-appearance: none;
							-moz-appearance: none;
							appearance: none;
						text-decoration: none;
					}

						#DashboardMain form a.dashboard-button:hover {
							color: #FFFFFF;
						}

		#DashboardMain .calendar, #DashboardMain .calendar-manage {
			background-color: #F5F5F5;
			margin: 0;
		}

			#DashboardMain .calendar {
				padding: 30px;
				min-width: 400px;
			}

			#DashboardMain .calendar-manage {
				border-left: 1px solid #707070;
				min-width: 212px;
			}

				#DashboardMain .hold-manage, #DashboardMain .hold-manage-title {
					padding: 15px 30px;
					border-top: 1px solid #707070;
				}

					#DashboardMain .hold-manage-title {
						border: 0;
					}

				#DashboardMain .hold-calendar-navi {
					max-width: 30px;
				}

				#DashboardMain .calendar-day-heading {
					text-align: center;
					font-family: "Spezia Narrow Medium", Arial, Helvetica, sans-serif;
					font-weight: 700;
					font-size: 16px;
				}

				#DashboardMain .calendar-square {
					text-align: center;
					font-family: "Spezia Narrow Medium", Arial, Helvetica, sans-serif;
					font-weight: 600;
					font-size: 16px;
				}

					#DashboardMain .calendar-square div { 
						background-color: #FFFFFF;
						padding-top: 3px;
						height: 55px;
						margin: 3px;
					}

					#DashboardMain .calendar-not-current { color: rgba(13.3,13.3,13.3,.3); }

					#DashboardMain .calendar-today div { background-color: #DEE2E3; }

					#DashboardMain .calendar-blocked div { background-color: #E5E5E5; }

					#DashboardMain div.calendar-select { background-color: #707070; }

					#DashboardMain .calendar-square div svg { width: 20px; }

				#DashboardMain #CalendarBody {
					padding: 40px 0;
				}

		#DashboardMain div.bundle-item-contents {
			margin-top: -10px;
			margin-bottom: 10px;
		}

		#Dashboard #PastOrders section.past-orders {
			margin: 10px 0;
		}

			#Dashboard #PastOrders section.past-order-button {
				max-width: 450px;
			}

				#Dashboard #PastOrders section.past-order-button a, #Dashboard form input.manage-order-button {
					font-family: "Spezia Narrow Medium", Arial, Helvetica, sans-serif;
					font-weight: 600;
					font-size: 16px;
					text-transform: uppercase;
					background-color: #FFFFFF;
					color: #2E3527;
					border: #E5E5E5 2px solid;
					border-radius: 10px;
					padding: .5em 1.5em;
					-webkit-appearance: none;
						-moz-appearance: none;
						appearance: none;
					text-decoration: none;
					display: block;
					text-align: center;
				}

					#Dashboard #PastOrders section.inverted-button a, #Dashboard section.inverted-button form input.manage-order-button {
						background-color: #2E3527;
						color: #FFFFFF;
						border: #2E3527 2px solid;
					}

					#Dashboard #PastOrders section.past-order-button a.manage-order-button, #Dashboard form input.manage-order-button {
						display: inline-block;
						padding: .25em .5em;
						width: 125px;
					}

					#Dashboard form input.manage-order-button {
						width: 145px;
						margin-bottom: 5px;
					}

			#Dashboard #PastOrders section.past-order-toggle {
				max-width: 35px;	/* This should match section.manage-orders-remove below */
				padding-top: 20px;
			}

				#Dashboard #PastOrders section.past-order-toggle div.down-arrow {
					margin-top: -8px;
				}

				#Dashboard #PastOrders section.past-order-toggle div.up-arrow {
					margin-top: -2px;
				}
					
				#Dashboard #PastOrders section.past-order-toggle svg {
					width: 25px;
				}

			#Dashboard #PastOrders div.manage-orders-subtitle {
				padding-bottom: 20px;
				border-bottom: 1px solid #EFEFEF;
				margin-bottom: 20px;
			}

			#Dashboard #PastOrders span.reorder-icon svg { 
				height: 15px;
			}

			#Dashboard #PastOrders section.manage-orders-price {
				max-width: 100px;
				padding-right: 10px;
				text-align: right;
			}

			#Dashboard #PastOrders section.manage-orders-remove {
				max-width: 35px; 	/* This should match section.past-order-toggle above */
				text-align: right;
				padding-right: 10px;
			}

				#Dashboard #PastOrders section.manage-orders-remove svg {
					width: 10px; 	/* This should match section.past-order-toggle above */
				}

			#Dashboard #PastOrders section.manage-orders-swap {
				background-color: #F5F5F5;
				padding: 10px;
				min-width: 200px;
				max-width: calc(33% - 40px);
				margin: 10px;
			}

				#Dashboard #PastOrders section.manage-orders-swap img {
					width: 130px;
				}

			#Dashboard #PastOrders div.addon-container {
				padding-bottom: 20px;
				border-bottom: 1px solid #EFEFEF;
				margin-bottom: 20px;
			}

				#Dashboard #PastOrders div.addon-container .addon-photo {
					max-width: 220px;
				}

					#Dashboard #PastOrders div.addon-container .addon-photo img {
						width: 200px;
					}

				#Dashboard #PastOrders div.addon-container section.manage-orders-quantity {
					max-width: 100px;
				}

					#Dashboard #PastOrders section.manage-orders-quantity .item-selection table {
						margin-top: -8px;
					}
		
						#Dashboard #PastOrders section.manage-orders-quantity .item-selection td.item-quantity {
							padding: 0 10px;
							vertical-align: top;
							text-align: center;
						}

							#Dashboard #PastOrders section.manage-orders-quantity .item-selection td svg {
								width: 40px;
							}
							
							#Dashboard #PastOrders section.manage-orders-quantity .item-selection td.item-quantity div {
								background-color: #F2F1EE;
								height: 30px;
								vertical-align: middle;
								padding-top: 13px;;
							}

			#Dashboard table.order-total-table {
				margin: 0 20px 40px auto;
				max-width: 315px;	/* Have this equal .manage-orders-quantity + .manage-orders-price + .manage-orders-remove */
			}

				#Dashboard table.order-total-table td.right {
					width: 100px;
				}

			#Dashboard #PastOrders section.past-paid-amount {
				max-width: 100px;
			}

			#Dashboard #PastOrders #PastOrderPagination {
				border-top: 1px solid #707070;
				padding-top: 40px;
			}

				#Dashboard #PastOrders #PastOrderPagination section {
					margin-bottom: 10px;
				}
			
				#Dashboard #PastOrders #PastOrderPagination .pagination-box {
					font-family: "Spezia Narrow Medium", Arial, Helvetica, sans-serif;
					font-weight: 700;
					font-size: 20px;
					color: #2E3527;
					width: 45px;
					height: 45px;
					text-align: center;
					vertical-align: middle;
					border: #E5E5E5 2px solid;
					border-radius: 4px;
					margin-right: 10px;
				}

					#Dashboard #PastOrders #PastOrderPagination .pagination-box-item {
						margin-top: 10px;
					}

					#Dashboard #PastOrders #PastOrderPagination .current-page {
						background-color: #E5E5E5;
					}

			#Dashboard #PastOrders .no-addons-dashboard {
				background-color: #F5F5F5;
				padding: 80px 40px;
				margin-bottom: 40px;
			}

			#Dashboard #PastOrders span.mobile-customize-qty {
				margin: 0;
				position: absolute;
				top: 50%;
				left: 50%;
				-ms-transform: translate(-50%, -50%);
				transform: translate(-50%, -50%);
			}
			
			#Dashboard #PastOrders #Receipt {
				border: 1px solid #2E3527;
			}

	#Dashboard #ManageSubscriptions {
		background-color: #F5F5F5;
		padding-top: 0;
	}
	
	#Dashboard #QualityGuaranteed {
		background-color: rgba(255,255,255,.57);
	}		

#Team {
	background-color: #FFFFFF;
	margin-top: -20px;
	margin-bottom: 100px;
	margin: 0 25px;
	justify-content: space-between;
}

	.team-container {
		background-color: #FFFFFF;
		padding: 10px;
		margin-top: 20px;

		max-width: 43%;
		min-width: 43%;
	}

		.team-photo {
			padding-bottom: .75%; /* Aspect ratio 300x225 */
			margin: -10px -10px 0 -10px; /* Make this match the padding above */
		}

			.team-photo img {
				object-fit: cover;
				width: 100%;
			}

		.team-name {
			padding: 10px 0;
		}

		.team-title {
			margin: 10px 0;
		}

#Vendor {
	background-color: #FFFFFF;
	margin-top: -20px;
	margin-bottom: 100px;
	margin: 0 25px;
	justify-content: space-between;
}

	.vendor-container, .other-vendor-container {
		background-color: #FFFFFF;
		padding: 10px;
		margin-top: 20px;
	}

		.vendor-photo {
			padding-bottom: .75%; /* Aspect ratio 300x225 */
			margin: -10px -10px 0 -10px; /* Make this match the padding above */
		}

			.vendor-photo img {
				object-fit: cover;
				width: 100%;
			}

		.vendor-name-small {
			padding: 10px 0;
		}

		.vendor-title {
			margin: 10px 0;
		}

	#VendorBody {
		margin-top: 20px;
		padding: 10px;
		color: #2E3527;
	}

		#VendorBody img { 
			max-width: 100%;
			display: block;
			margin: 0 auto;
		}

	#VendorItems, #OtherVendors {
		padding: 0 10px;
		color: #2E3527;
		max-width: 960px;
		margin: 80px auto 0 auto;
	}

		.other-vendor-button {
			margin-top: 60px;
		}

			.other-vendor-button a.button {
				max-width: 100%;
				display: block;
			}

#AboutHero, #OurValuesHero, #OurValuesHeroMobile {
	padding-bottom: 68.53%; /* Aspect ratio 375x257*/
}

	#AboutHeroDesktop { 
		background-position: 0 -475px;
	}

	#OurValuesHeroDesktop {
		background-position: center center;
	}

		.about-overlay {
			position: absolute;
			top: 50%;
			left: 50%;
			transform: translate(-50%, -50%);
			width: 100%;
			padding-top: 80px;
			text-align: center;
		}

			#OurValuesHeroDesktop .about-overlay, #OurValuesHeroMobile .about-overlay {
				top: 75%;
				transform: translate(-50% -25%);
			}

	.about-body {
		justify-content: center;
		align-items: center;
	}

		.about-center {
			max-width: 960px; 
			margin: 50px auto;
		}	

		.about-left, .about-right {
			max-width: 480px;
			margin: 50px 0;
		}

			.about-text { 
				padding: 0 30px; 
			}

		.about-gray-container {
			background-color: #F5F5F5;	/* In mobile, this is just the same as the background */
		}

		.about-bottom { margin-bottom: 100px; }

		.values-full-page-headline {
			margin-top: 50px;
		}

	.faq-container { 
		max-width: 960px;
		/*margin: 0 auto;*/
		margin: 0;
		background-color: #FFFFFF;
		text-align: left;
	}

		.faq-question {
			padding: 20px 20px 20px 0;
			border-top: 1px solid #DEE2E3;
		}

			.faq-question .faq-up-down { max-width: 40px; }

			.faq-question svg { width: 20px; }

				.faq-question svg path { fill: rgba(13.3,13.3,13.3,.5); }

		.faq-heading {
			font-family: 'Spezia Narrow Medium', Helvetica, Arial, sans-serif;;
			color: #2E3527;
			font-size: 24px;
			font-style: normal;
			font-weight: 500;
			line-height: normal;
			text-transform: capitalize;
		}
		
		.faq-answer {
			font-family: 'Spezia Narrow Medium', Helvetica, Arial, sans-serif;;
			color: #2E3527;
			font-size: 16px;
			font-style: normal;
			font-weight: 350;
			line-height: normal;
			padding: 0 60px 20px 0; /* Make "right padding" match .faq-up-down + .faq-question-svg */
			display: none;
		}

			.faq-answer-show-initial { display: block; }

			.faq-answer .menu-header {
				background-color: #E5E5E5;
			}

				.faq-answer .menu-header .menu-button {
					padding: 10px;
					margin: 0 3px 0 3px;
					border-top: 3px solid #E5E5E5;
					cursor: pointer;
				}

					.faq-answer .menu-header .menu-button-selected {
						background-color: #FFFFFF;
						border-color: #2E3527;
					}

				.faq-answer .menu-body {
					border: 1px solid #E5E5E5;
					border-top: 0;
					padding: 10px;
				}

	#FAQPageContainer .faq-section, #FAQCartContainer .faq-section {
		padding-top: 20px;
		padding-bottom: 20px;
	}

		#FAQPageContainer .faq-section h1, #FAQCartContainer .faq-section h1 { 
			font-family: "Spezia Narrow Medium", Helvetica, Arial, sans-serif; 
			font-weight: normal;
		}

			#FAQCartContainer .faq-section h1 {
				font-size: 20pt;
			}

			#FAQCartContainer .faq-heading {
				font-size: 20px;
			}

	#FAQPageContainer .faq-section, #FAQCartContainer .faq-section {
		font-family: "Spezia Narrow Medium", Helvetica, Arial, sans-serif;
	}
	
	#FAQPageContainer p, #FAQCartContainer p {
		margin-bottom: 10px;
	}

#PrivacyPolicy {
	text-align: left;
	margin: 20px;
}

	#PrivacyPolicy iframe {
		width: 100%;
		height: 900px;
		border: #2E3527 solid 2px;
		border-radius: 4px;
	}

	#PrivacyPolicy ul {
		margin-top: 20px;
		margin-bottom: 0;
	}

	#PrivacyPolicy a {
		text-decoration: underline;
	}

	#PrivacyHero {
		padding-bottom: 68.53%; /* Aspect ratio 375x257*/
	}

		#PrivacyHeroDesktop { 
			background-position: 0 -475px;
		}

			.privacy-overlay {
				position: absolute;
				top: 50%;
				left: 50%;
				transform: translate(-50%, -50%);
				width: 100%;
				padding-top: 80px;
				text-align: center;
			}

#ContactHeroMobile {
	background-position-x: -350px;
}

	.contact-overlay {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		width: 100%;
		padding-top: 80px;
		text-align: center;
	}

	.down-overlay {
		position: absolute;
		bottom: 80px;
		text-align: center;
		width: 100%;
	}

	.contact-div {
		border-radius: 4px;
		background-color: #FFFFFF;
		padding: 30px 15px;
		margin: 10px; 
	}

		.contact-div .contact-heading {
			margin-bottom: 20px;
		}

		.contact-div .contact-button {
			margin-top: 40px;
		}

#ReferralHeroDesktop {
	background-color: rgba(0,0,0,.5);
}

	.referral-overlay {
		position: absolute;
		top: 25%;
		left: 50%;
		transform: translate(-50%, -50%);
		width: 100%;
		padding-top: 80px;
		text-align: center;
	}

	#ReferralMobileDescription {
		padding: 80px 10px 0 10px;
	}

	#ReferralSteps {
		margin-bottom: 80px;
	}

		.referral-works-step-section {
			margin: 40px auto 0 auto;
			max-width: 650px;
		}

			.referral-works-number-wrapper {
				position: relative;
				height: 71px;
				margin-bottom: 20px;
			}

				.referral-works-number-wrapper  hr.connection-line, .referral-works-number-wrapper  hr.connection-line-left, .referral-works-number-wrapper  hr.connection-line-right {
					display: none;
					border: solid #2E3527 2px;
					position: absolute;
					top: calc(50% - 18px);
					width: 100%;
					z-index: 10;
				}

					.referral-works-number-wrapper  hr.connection-line-left {
						width: 50%;
						right: 0;
					} 
					
					.referral-works-number-wrapper  hr.connection-line-right {
						width: 50%;
						left: 0;
					}
			
			.referral-works-number-container {
				position: relative;
				z-index: 200;
			}

				.referral-works-circle-outer {
					stroke: #2E3527;
				}

				.referral-works-circle-middle {
					fill: #FFFFFF;
				}

				.referral-works-circle-inner {
					fill: #2E3527;
					stroke: none;
				}
				
				.referral-works-number {
					font-family: "Spezia Narrow Medium", Arial, Helvetica, sans-serif;
					font-weight: 700;
					font-size: 40px;
					fill: #FFFFFF;
					stroke: #FFFFFF;
				}

	#ReferralCopy {
		margin: 20px 0;
	}
	
	#BountySignUp {
		position: absolute;
		left: 0;
		right: 0;
		margin-left: auto;
  		margin-right: auto;
		bottom: 125px;
	}

		#BountySubPage {
			margin-top: -20px; 
			padding-bottom: 40px;
		}

			#BountySubPageChild {
				max-width: 960px; 
				margin-left: auto; 
				margin-right: auto; 
				padding-left: 20px; 
				padding-right: 20px;
			}

	#GiftCardBody, #CancelResponseBody {
		padding: 40px 0;
		max-width: 560px;
		margin-left: auto;
		margin-right: auto;
	}

		#CancelResponseBody {
			max-width: 880px;
		}

		#GiftCardBody textarea {
			border-color: #E5E5E5;
			margin: 0;
		}

		#GiftCardBody #AddressCheckResponse {
			padding-bottom: 20px;
			color: #2E3527;
		}

#OurValues {
	background-color: #FFFFFF;
}

@media print {
	
}