@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {

}

@media (max-width: 1480px) {
	body {
	background: linear-gradient(to right, rgba(255, 250, 230, 1) 0%, rgba(255, 237, 163, 1) 15%, rgba(255, 237, 163, 1) 85%, rgba(255, 250, 230, 1) 100%);
	}
}

@media (max-width: 1080px) {
	.new-customer-grid {
		grid-gap: 10px;
		grid-template-columns: 100%;
	}

	.user-order-form .address-block > div > * {
		width: 100%;
	}

	.contentSearch {
		position: relative;
		box-sizing: border-box;
		width: calc(100vw - 40px);
	}

	.slideout-menu .siteSearch {
		position: absolute;
		right: 40px;
		top: 15px;
		width: calc(100% - 80px);
	}

	.siteSearch form label {
		display: none;
	}
}

@media (max-width: 1024px) {
	body.menuOpen {
		overflow: hidden;
	}

	.stepContent {
		max-width: calc(100% - 40px);
	}

	.frontendLogin .authForm {
		width: calc(100% - 40px);
	}

	.mobileTopBar nav {
		display: block;
	}

	.header-container {
		display: none;
	}

	.hamburger {
		cursor: pointer;
		position: absolute;
		right: 20px;
		width: 30px;
	}

	.hamburger.colorless {
		color: #fff;
	}

	.slideout-menu {
		background-image: url('/images/app/wholism/bgNav.jpg');
		background-size: cover;
		display: block;
		height: calc(100vh - 104px);
		margin-top: 104px;
		overflow: hidden;
		padding: 0;
		position: absolute;
		top: 0;
		transform: translateX(100vw);
		width: 0;
		z-index: 10;
	}

	body.menuOpen .slideout-menu {
		max-width: 100%;
		overflow-y: scroll;
		padding: 0 20px;
		transform: translateX(0);
		width: 100%;
	}

	a.closeSub {
		display: inline;
		text-decoration: underline;
	}

	.slideout-menu .subOpener,
	.slideout-menu .closeSub:not(.noButton) {
		background-color: var(--text-color);
		cursor: pointer;
		padding: 3px 5px 5px 4px;
		position: absolute;
		right: 0;
		top: 11px;
	}

	.slideout-menu .closeSub:not(.noButton) {
		left: 20px;
		right: unset;
		top: 19px;
	}

	.slideout-menu .subOpener .iz-icon,
	.slideout-menu .closeSub:not(.noButton) .iz-icon {
		color: #fff;
	}

	.slideout-menu,
	.allContent {
		transition: transform .5s, width .5s;
	}

	body.menuOpen .allContent {
		position: fixed;
		top: 0;
		transform: translateX(-100vw);
	}

	nav > ul {
		display: block;
		transform: translateX(0);
		transition: transform .5s;
	}

	nav > ul[data-level="1"] {
		transform: translateX(-100vw);
	}

	nav > ul[data-level="2"] {
		transform: translateX(-200vw);
	}

	nav > ul[data-level="3"] {
		transform: translateX(-300vw);
	}

	nav ul {
		left: 0;
		position: absolute;
		top: 0;
		width: 100vw;
		z-index: 10;
	}

	nav.headerNav {
		margin-left: 40px;
		width: calc(100% - 80px);
	}

	nav.headerNav ul {
		left: unset;
		position: relative;
		top: unset;
	}

	nav.headerNav ul li {
		float: left;
		padding: 0 40px 0 0;
		list-style-type: none;
	}

	nav.headerNav ul li[data-id="102"] {
		display: none;
	}

	.slideout-menu .siteSearch {
		left: 40px;
		position: relative;
		right: unset;
	}

	nav > ul {
		top: 130px;
	}

	nav li {
		padding-left: 60px;
		padding-right: 60px;
	}

	nav ul ul {
		transform: translateX(100vw);
		transition: transform .5s;
		z-index: 20;
	}

	nav ul li > ul {
		display: block;
		visibility: hidden;
		transition: visibility .5s;
	}

	nav ul li.open > ul {
		visibility: visible;
	}

	nav ul li ul {
		width: 100%;
	}

	nav ul li ul li ul {
		margin-left: unset;
		margin-top: unset;
	}

	.subMenuTitle {
		padding: 25px 20px 20px 60px;
		position: relative;
	}

	li.open > ul {
		height: 100%;
	}

	nav ul li a {
		line-height: 130%;
		position: relative;
		padding: 14px 0;
		width: 100%;
	}

	.iz-breadcrumb {
		padding: 0 22px;
	}
}

@media (max-width: 1023px) {
	.mobileTopBar {
		display: block;
		height: 104px;
	}

	.mobileTopBar .mobileTopBarTop {
		background-image: url('/images/app/wholism/bgHeader.jpg');
		background-size: cover;
		height: 64px;
		padding-top: 17px;
		box-sizing: border-box;
	}

	.mobileTopBar .mobileTopBarTop img {
		margin-top: 7px;
	}

	.mobileTopBar .mobileTopBarBottom {
		height: 40px;
		box-sizing: border-box;
		background: url('/images/app/wholism/bgNav.jpg');
		background-size: cover;
	}

	.topBar {
		display: none;
	}

	.allContent {
		margin-top: 104px;
	}

	.blockContainer .blockitems,
	.blockitem .formblockitems {
		grid-template-columns: repeat(1, 1fr) !important;
	}

	.mediaLibrary {
		grid-template-columns: repeat(3, 1fr);
	}

	.articles.layout1 {
		grid-template-columns: repeat(2, 1fr);
	}

	.blockContainer.blockWidth-70 > div,
	.blockContainer.blockWidth-100 > div,
	.blockContainer.blockWidth-101 > div {
		max-width: 100%;
		width: 100%;
	}

	.blockContainer > div,
	.contentCenter .pageTitle {
		box-sizing: border-box;
		padding: 0 20px 20px;
	}

	.account-content .account-field {
		margin-bottom: 0;
	}

	.account-content .account-field label {
		width: 100%;
	}

	.account-content .account-field input {
		width: 100%;
	}

}

@media (max-width: 960px) {
	.cart .heading {
		display: none;
	}

	.cart .products .product > div.image {
		grid-column: 1 / 1;
	}

	.cart .product .title {
		grid-column: 2 / 1;
	}

	.cart .product .amount {
		grid-column: 2 / 2;
		grid-row: 1 / 2;
	}

	.cart .product .price {
		grid-column: 2/2;
		grid-row: 2/2;
	}

	.cart .product .priceTotal {
		grid-column: 2/2;
		grid-row: 2/2;
	}
}

@media (max-width: 768px) {

	.blockContainer > div {
		padding: 0 0 20px;
		width: 100% !important;
	}

	.innerContent > .contentCenter {
		padding: 20px 20px 0;
	}

	/* Force table to not be like tables anymore */
	/*table, thead, tbody, th, td, tr {*/
	/*	display: block;*/
	/*}*/
	/*table {*/
	/*	max-width: 100% !important;*/
	/*	width: 100% !important;*/
	/*}*/
	/*!* Hide table headers (but not display: none;, for accessibility) *!*/
	/*thead tr {*/
	/*	position: absolute;*/
	/*	top: -9999px;*/
	/*	left: -9999px;*/
	/*}*/
	/*tr {*/
	/*	border: 1px solid #ccc;*/
	/*}*/
	/*td {*/
	/*	!* Behave  like a "row" *!*/
	/*	border: none;*/
	/*	border-bottom: 1px solid #eee;*/
	/*	position: relative;*/
	/*	!*padding-left: 50%;*!*/
	/*}*/
	/*td:before {*/
	/*	!* Now like a table header *!*/
	/*	position: absolute;*/
	/*	!* Top/left values mimic padding *!*/
	/*	top: 6px;*/
	/*	left: 6px;*/
	/*	width: 45%;*/
	/*	padding-right: 10px;*/
	/*	white-space: nowrap;*/
	/*}*/

}

@media (max-width: 600px) {
	.mediaLibrary {
		grid-template-columns: repeat(2, 1fr);
	}

	.articles.layout1 {
		grid-template-columns: repeat(1, 1fr);
	}

	.blockitems {
		width: 100% !important;
	}
}

@media (max-width: 560px) {
	#popup_notice .buttons {
		float: left;
		margin-top: 15px;
	}

	#popup_notice .buttons .button {
		margin-top: 10px;
		width: 100%;
	}

	.customer-name-grid,
	.customer-address-grid,
	.customer-postal-city-phone-grid {
		grid-template-columns: 100%;
	}

	.new-customer-grid > div {
		order: 1
	}

	.new-customer-grid .authForm {
		order: 2;
	}
}

@media (max-width: 500px) {
	.slideout-menu .siteSearch {
		left: 0;
		width: 100%;
	}

	nav.headerNav {
		margin-left: 0;
		width: 100%;
	}

	nav li {
		padding-left: 20px;
		padding-right: 20px;
	}
}

@media (max-width: 420px) {
	.authForm .buttons > * {
		margin-top: 10px;
		text-align: center;
		width: 100%;
	}

	.authForm .buttons a {
		display: none;
	}
}

@media (max-width: 400px) {
	.mediaLibrary {
		grid-template-columns: repeat(1, 1fr);
	}
}