/****************************************************************** GENERAL ***/
body {
	background-image: url(/static/yoga/img/background.svg);
	background-repeat: repeat;
	background-attachment: fixed;
	background-position: top center;
}

h1 {
	font-family: Tapir, Arial, Sans-serif;
	font-size: 42px;
}

h2 {
	font-family: Tapir, Arial, Sans-serif;
	font-size: 24px;
}

h3 {
	font-family: Tapir, Arial, Sans-serif;
	font-size: 18px;
}

h4 {
	font-size: 18px;
}

a {
	color: #f60;
	text-decoration: none;
}

a:hover,
a:active {
	text-decoration: underline;
}

/******************************************************************* LAYOUT ***/
div.content {
	padding: 12px;
}

div.content-wide-sub {
	padding: 12px;
}

div.flex-child {
	padding: 12px;
}

div.flex-child div.flex-parent {
	margin: -12px;
}

/******************************************************************* FOOTER ***/
div.footer-space {
	padding-bottom: 275px;
}

div.footer {
	height: 275px;
	background-color: #efefef;
	box-shadow: inset 0 8px 8px 4px #fff;
}

div.footer div.content {
	padding: 24px 12px;
	color: #000;
}

div.footer div.content a {
	color: #777;
}

div.footer div.content.copyright {
	margin-top: -48px;
	color: #777;
}

/******************************************************************** BOXES ***/
div.error {
}

div.warning {
}

div.confirmation {
}

div.admin {
}

/*************************************************************** DATA TABLE ***/
table.data tr {
	border-color: #aaa;
}

table.data tr.head {
	background-color: #ddd;
}

table.data tr {
	background-color: #f7f7f7;
}

/********************************************************************* FORM ***/
input,
select,
textarea {
	border-color: #f60;
	border-radius: 3px;
}

select {
	padding: 6.5px 0;
}

input.error,
textarea.error,
select.error {
	background-color: #fee !important;
}

input[type="submit"],
input[type="button"],
input[type="reset"],
a.button {
	background-color: #f60;
	color: #fff;
	box-shadow: 0 0 8px 0 #f60;
	border-radius: 3px;
	border-width: 0;
	font-size: 18px;
	min-width: 36px;
	min-height: 36px;
	line-height: 1.5em;
}

input[type="submit"]:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
a.button:hover {
	text-decoration: none;
}

input.cancel[type="submit"],
input.cancel[type="button"],
input.cancel[type="reset"],
a.button.cancel {
	background-color: #777;
}

input[type="submit"]:not(:disabled):hover,
input[type="button"]:not(:disabled):hover,
input[type="reset"]:not(:disabled):hover,
a.button:not(.disabled):hover {
	opacity: 0.5;
}

/******************************************************************* HEADER ***/
div.content.header {
	position: relative;
	padding: 12px;
	padding-bottom: 0;
	overflow: visible;
	display: flex;
	justify-content: space-between;
}

div.content.header div.left {
	display: flex;
	justify-content: space-between;
}

div.content.header div.logo {
	line-height: 0;
}

div.content.header a.logo {
	display: inline-block;
	max-width: 372.734px;
	max-height: 60px;
	width: 50vw;
	height: 8.049vw;
	background-image: url(../img/logo.svg);
	background-size: contain;
	background-position: center left;
	background-repeat: no-repeat;
}

div.content.header div.claim {
	font-family: Tapir, Arial, Sans-serif;
	font-size: 24px;
	line-height: 24px;
	font-weight: normal;
	color: #777;
	margin: 24px 0 0 24px;
}

div.content.header a {
	color: #000;
}

div.content.header a.menu-mobile {
	display: none;
}

div.header-menu {
	max-width: 984px;
	margin: 0 auto;
	box-sizing: border-box;
	padding: 12px 12px 0 12px;
}

div.header-menu div.menu {
	background-clip: border-box;
	overflow: hidden;
	display: flex;
	justify-content: left;
	background-color: #06f;
	box-shadow: inset 0 0 8px 4px #fff;
	font-family: Tapir, Arial, Sans-serif;
}

div.header-menu div.menu div.link {
	border-width: 0 1px 0 0;
	border-style: solid;
	border-color: #fff;
}

div.header-menu div.menu div.link a {
	display: block;
	line-height: 48px;
	font-size: 16px;
	padding: 0 16px;
	font-weight: 700;
	text-decoration: none;
	text-transform: uppercase;
	color: #fff;
}

div.header-menu div.menu div.link:hover,
div.header-menu div.menu div.link.active {
	background-color: rgba(255, 255, 255, 0.5);
}

div.header-menu div.menu div.link.active,
div.header-menu div.menu div.link.active:hover {
	background-color: rgba(255, 255, 255, 0.5);
}

div.header-submenu {
	max-width: 984px;
	margin: 0 auto;
	box-sizing: border-box;
	padding: 12px 12px 0 12px;
}

div.header-submenu div.submenu {
	background-clip: border-box;
	overflow: hidden;
	display: flex;
	justify-content: left;
	background-color: #06f;
	box-shadow: inset 0 0 8px 4px #fff;
	font-family: Tapir, Arial, Sans-serif;
}

div.header-submenu div.submenu div.shop {
	display: none;
}

div.header-submenu div.submenu div.link {
	border-width: 0 1px 0 0;
	border-style: solid;
	border-color: #fff;
}

div.header-submenu div.submenu div.link.no_hover,
div.header-submenu div.submenu div.link.disabled {
}

div.header-submenu div.submenu div.link:hover {
	background-color: rgba(255, 255, 255, 0.5);
}

div.header-submenu div.submenu div.link.active,
div.header-submenu div.submenu div.link.active:hover {
	background-color: rgba(255, 255, 255, 0.5);
}

div.header-submenu div.submenu div.link.disabled:hover {
	background-color: transparent;
}

div.header-submenu div.submenu div.link a,
div.header-submenu div.submenu div.link span {
	display: block;
	line-height: 36px;
	font-size: 16px;
	padding: 0 16px;
	font-weight: 700;
	text-decoration: none;
	text-transform: uppercase;
	color: #fff;
}

div.header-submenu div.submenu div.link.disabled span {
	color: #ccc;
}

@media (max-width: 959px) {
	div.header div.claim {
		display: none;
	}

/*
	div.content.header a.menu-mobile {
		display: inline;
	}

	div.header-menu div.menu {
		padding: 0;
		flex-direction: column;
	}

	div.header-menu.display-none-special {
		display: none;
	}

	div.header-menu div.menu div.link {
		border-width: 0 0 1px 0;
	}

	div.header-menu div.menu div.link:last-child {
		border-width: 0;
	}

	div.header-submenu div.submenu {
		padding: 0;
		flex-direction: column;
	}

	div.header-submenu.display-none-special {
		display: none;
	}

	div.header-submenu div.submenu div.link {
		border-width: 0 0 1px 0;
	}

	div.header-submenu div.submenu div.link:last-child {
		border-width: 0;
	}
*/
}

/****************************************************************** CONTENT ***/
html body div.flex-parent.special-line-top,
html body div.flex-parent.special-line-bottom,
html body div.flex-parent.special-bg {
	border-width: 0;
	margin-left: -50px;
	margin-right: -50px;
	padding-left: 50px;
	padding-right: 50px;
}

html body div.flex-parent.special-line-top {
	position: relative;
	overflow: hidden;
	margin-top: 50px;
	padding-top: 50px;
}

html body div.flex-parent.special-line-bottom {
	position: relative;
	overflow: hidden;
	margin-bottom: 50px;
	padding-bottom: 50px;
}

html body div.flex-parent.special-line-top::before {
	content: '';
	position: absolute;
	box-shadow: 0 1px 30px 0 #000;
	width: 100%;
	height: 10px;
	top: -10px;
	left: 0;
}

html body div.flex-parent.special-line-bottom::after {
	content: '';
	position: absolute;
	box-shadow: 0 1px 30px 0 #000;
	width: 100%;
	height: 10px;
	bottom: -10px;
	left: 0;
}

html body div.flex-parent.special-bg {
	background-color: #fff;
}

div.small-padding {
	padding: 20px !important;
}

div.container div.content:not(div.footer *) div.flex-parent:not(div.flex-child *) {
	margin: 0 -6px;
}

div.container div.content:not(div.footer *) div.flex-parent div.flex-child:not(div.flex-child *) {
	margin: 6px;
	padding: 50px;
	background-color: #def;
	box-shadow: inset 0 0 8px 4px #fff;
	background-clip: padding-box;
}

div.container div.content:not(div.footer *) div.flex-parent div.flex-child-2:not(div.flex-child *) {
	width: calc(50% - 12px);
}

div.container div.content:not(div.footer *) div.flex-parent div.flex-child-3:not(div.flex-child *) {
	width: calc(33.3333333% - 12px);
}

div.container div.content:not(div.footer *) div.flex-parent div.flex-child-3-2:not(div.flex-child *) {
	width: calc(66.6666666% - 12px);
}

div.container div.content:not(div.footer *) div.flex-parent div.flex-child-4:not(div.flex-child *) {
	width: calc(25% - 12px);
}

@media (max-width: 959px) {
	div.container div.content:not(div.footer *) div.flex-parent div.flex-child-4:not(div.flex-child *) {
		width: calc(50% - 12px);
	}
}

@media (max-width: 599px) {
	div.container div.content:not(div.footer *) div.flex-parent div.flex-child:not(div.flex-child *),
	div.container div.content:not(div.footer *) div.flex-parent div.flex-child-2:not(div.flex-child *),
	div.container div.content:not(div.footer *) div.flex-parent div.flex-child-3:not(div.flex-child *),
	div.container div.content:not(div.footer *) div.flex-parent div.flex-child-3-2:not(div.flex-child *),
	div.container div.content:not(div.footer *) div.flex-parent div.flex-child-4:not(div.flex-child *) {
		padding: 12px;
		width: 100%;
	}

	html body div.flex-parent.special-line-top,
	html body div.flex-parent.special-line-bottom,
	html body div.flex-parent.special-bg {
		margin-left: -12px;
		margin-right: -12px;
		padding-left: 12px;
		padding-right: 12px;
	}

	html body div.flex-parent.special-line-top {
		margin-top: 12px;
		padding-top: 12px;
	}

	html body div.flex-parent.special-line-bottom {
		margin-bottom: 12px;
		padding-bottom: 12px;
	}
}

div.content .box,
div.content .box-border {
}

div.content .box-border {
	box-shadow: 0 0 8px 0 #fff;
}

a.arrow {
	display: block;
	text-align: right;
	margin-right: 1.25em;
}

a.arrow::after {
	content: '\f061';
	font-family: FontAwesome;
	display: inline-block;
	margin-right: -1.25em;
	width: 1.25em;
}

div.content ul.arrow {
	border-width: 0 0 1px 0;
	border-style: solid;
	border-color: #aaa;
	list-style: none;
	padding: 0;
}

div.content ul.arrow li {
	font-size: 15px;
	border-width: 1px 0 0 0;
	border-style: solid;
	border-color: #aaa;
	padding: 0.5em 0 0.5em 1.25em;
}

div.content ul.arrow li::before {
	content: '\f061';
	font-family: FontAwesome;
	display: inline-block;
	margin-left: -1.25em;
	width: 1.25em;
	color: #f60;
}

div.content ul.arrow li.no-arrow::before {
	display: none;
}

div.buttons-row {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
}

div.buttons-row div.buttons-row-right {
	text-align: right;
}

p.price {
	font-family: Tapir, Arial, Sans-serif;
	font-size: 24px;
	font-weight: 700;
}

p.shipping {
	font-size: 15px;
	margin-top: -1em;
	color: #777;
}

@media (min-width: 960px) {
	.width-not-max-959 {
		display: none !important;
	}
}

@media (max-width: 959px) {
	.width-max-959 {
		display: none !important;
	}
}
