/*
Theme Name: Nattercan
Author: Nattercan.com
Author URI: http://nattercan.com
Text Domain: nattercan
*/

/*@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,300,600,700,800);*/

@font-face {
	font-family: 'haboronormregular';
	src: url('fonts/haboronormregular-webfont.woff2') format('woff2'), url('fonts/haboronormregular-webfont.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'haboronormregularitalic';
	src: url('fonts/haboronormregularitalic-webfont.woff2') format('woff2'), url('fonts/haboronormregularitalic-webfont.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'haboronormdemi';
	src: url('fonts/haboronormdemi-webfont.woff2') format('woff2'), url('fonts/haboronormdemi-webfont.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'haboronormdemiitalic';
	src: url('fonts/haboronormdemiitalic-webfont.woff2') format('woff2'), url('fonts/haboronormdemiitalic-webfont.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}
@font-face {
    font-family: 'haboronormlightitalic';
    src: url('fonts/haboronormlightitalic-webfont.woff2') format('woff2'), url('fonts/haboronormlightitalic-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'haboronormlight';
    src: url('fonts/haboronormlight-webfont.woff2') format('woff2'), url('fonts/haboronormlight-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

button, input[type='submit'], a, a * { transition: color 0.25s ease-in-out, background-color 0.25s ease-in-out; }
a {
	color: inherit;
	text-decoration: none;
}
a:hover {
	color: #5ec9e7;
	text-decoration: none;
}

html {
	position: relative;
	min-height: 100%;
	margin-top: 0 !important;
}
body {
	color: black;
	font-family: "haboronormregular", serif;
	font-size: 16px;
	line-height: 21px;
}
.haboronorm-upper {
	font-family: "haboronormregular", serif;
	font-size: 17px;
	letter-spacing: 6px;
	text-transform: uppercase;
}
h1 {
	font-family: "haboronormregular", serif;
	font-size: 20px;
	font-weight: normal;
	line-height: 25px;
	letter-spacing: 1px;
	text-transform: none;
}
h2 {
	font-family: "haboronormregular", serif;
	font-size: 20px;
	font-weight: normal;
	line-height: 30px;
	letter-spacing: 6px;
	text-transform: uppercase;
}
h2,h3,h4,h5 { margin-top: 0; }
h6 { /* used on the product pages for the variation specs, i.e. smaller text */
	color: #000;
	font-size: 13px;
	line-height: 19px;
	font-weight: normal;
	margin-top: 0;
	margin-bottom: 20px;
}
p {
	margin: 0 0 12px;
}
strong {
	font-family: 'haboronormdemi', serif;
	font-weight: normal;
}
small {
	font-family: 'haboronormlightitalic', serif;
	font-size: 12px;
}
em { font-family: 'haboronormlightitalic', serif; }
.clear { clear: both; }
.mobile-only { display: none; }

.breadcrumbs {
	font-size: 14px;
	margin-bottom: 20px;
}
.breadcrumbs a:hover { color: black; }

.page-title {
	margin-top: 0;
	line-height: 24px;
}

.pipe {
	display: inline-block;
	margin-right: 10px;
	margin-left: 8px;
}
.pipe::before {
	border-left: 1px solid #000;
	height: 100%;
	content: " ";
}

#content {
	font-family: "haboronormlight", serif;
	font-size: 15px;
}
#content.full {
	grid-column-start: 1;
	grid-column-end: 3;
}

.embed-container { /* used to ensure embedded videos fill the full width */
	position: relative;
	padding-bottom: 61.66666667%;
	overflow: hidden;
	max-width: 100%;
	height: auto !important;
}
.embed-container iframe,
.embed-container object,
.embed-container embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100% !important;
	height: 100% !important;
}

/* landing */
body.page-template-landing {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	margin: 0;
	margin-top: 0;
	display: block;
}
.page-template-landing .right {
	position: fixed;
	top: 0;
	right: 0;
	z-index: 1;
	width: calc(100% - 600px);
	height: 100%;
	padding: 0;
	overflow: hidden;
	pointer-events: none;
}
.page-template-landing .right #video {
	display: block;
	position: absolute;
	top: 50%;
	left: 50%;
	width: 100vw;
	min-width: 177.77vh;
	height: 56.25vw;
	min-height: 115vh;
	box-sizing: border-box;
	transform: translate(-50%,-50%);
}
.page-template-landing .left {
	background-color: white;
	position: fixed;
	left: 0;
	top: 0;
	z-index: 100;
	width: 600px;
	bottom: 0;
	text-align: center;
	color: black;
	font-size: 17px;
	line-height: 22px;
	display: flex;
	flex-direction: column;
	justify-content: center;
}
.page-template-landing .left .logo img {
	width: 90%;
	height: auto;
}
.page-template-landing .left .logo {
	margin-bottom: 10%;
}
.page-template-landing .left .links {
	margin-bottom: 5%;
	font-size: 15px;
	letter-spacing: 5px;
}
.page-template-landing .left .social a img {
	height: 20px;
}
.page-template-landing .left .social a {
	margin-left: 3px;
	margin-right: 3px;
}

/* default template / masonry */
body {
	margin: 0;
	padding-top: 0;
	display: grid;
	grid-gap: 40px;
	grid-template-columns: 1fr 250px 960px 5px 1fr;
	grid-template-rows: 100px 100%;
	grid-template-areas: ". nav logo .      ."
	                     ". nav body scroll .";
}

body > header {
	grid-area: nav;
	position: relative;
}
body > header div.fixed {
	position: fixed;
	padding-top: 50px;
	width: 250px;
	margin-top: 10px;
}
body > .logo { grid-area: logo; }
body > .logo .logofixed {
	padding-top: 50px;
	padding-bottom: 40px;
	height: 50px;
	display: flex;
	flex-direction: row;
	align-items: flex-start;
	justify-content: space-between;
	position: fixed;
	width: 960px;
	background-color: white;
	z-index: 10000;
}
body > .logo img {
	width: 512px;
	height: auto;
	max-width: 100%;
}
body .cart-count-icon.count-0 { display: none; } /* hide if there's nothing in the cart */
body .cart-count-icon {
	background-image: url('/wp-content/themes/nattercan/cart.svg');
	background-position: 50%;
	background-repeat: no-repeat;
	background-size: 100%;
	display: block;
}
body .cart-count-icon .count {
	color: white;
	display: block;
	width: 32px;
	text-align: center;
	line-height: 25px;
	padding-top: 8px;
	font-size: 14px;
}
body > section {
	grid-area: body;
}
body > header {
	padding-left: 10px;
}
body > header .nav_widget {
	margin-bottom: 58px;
}
body > header .nav_widget img {
	height: 18px;
	margin-left: 3px;
	margin-right: 3px;
}

/* navigation dots */
#navigation-dots-wrapper {
	grid-area: scroll;
}
#navigation-dots {
	position: fixed;
	top: 300px;
	display: block;
}
#navigation-dots .position {
	width: 6px;
	height: 6px;
	display: block;
	background-image: url('/wp-content/themes/nattercan/navigation-dot.svg');
	cursor: pointer;
	padding: 5px;
	margin-left: -5px;
	background-repeat: no-repeat;
	background-position: 50%;
}
#navigation-dots .position.current {
	background-image: url('/wp-content/themes/nattercan/navigation-dot-current.svg');
}

/* menu */
header nav {
	display: block;
	width: 100%;
	text-transform: uppercase;
	height: initial;
	background-color: white;
	border: none;
}
header nav ul {
	list-style: none;
	padding-left: 0;
	margin-top: 0;
	margin-bottom: 0;
	text-transform: uppercase;
}
header nav ul li {
	margin-bottom: 20px;
}
header nav ul.sub-menu {
	font-family: "haboronormlight", serif;
	font-size: 15px;
	line-height: 24px;
	text-transform: none;
	letter-spacing: 0;
}
header nav ul.sub-menu { display: none; }
header nav .current_page_parent ul.sub-menu, header nav .current-menu-ancestor ul.sub-menu, header nav .current-menu-item ul.sub-menu { display: block; }

nav.navbar li.current_page_parent>a,
nav.navbar li.current-page-ancestor>a,
nav.navbar li.current-menu-ancestor>a,
nav.navbar li.current-menu-item>a,
body > header nav.navbar ul.sub-menu li.current-menu-item>a:hover,
nav.navbar li>a:focus, nav.navbar li>a:hover {
	background-color: initial;
	color: #5ec9e7;
}
body > header nav.navbar ul.sub-menu li.current-menu-item>a { color: black; }
body > header nav.navbar ul.sub-menu li.current-menu-item { background-image: url('/wp-content/themes/nattercan/bullet.svg'); }
body > header nav.navbar ul.sub-menu li:hover { background-image: url('/wp-content/themes/nattercan/bullet-aqua.svg'); }
nav.navbar li>a {
	padding-top: 0;
	padding-bottom: 0;
}
nav.navbar #mobile-toggle { display: none; }
nav.navbar #navbar { display: block; }
nav.navbar #mobile-menu { display: none; }

/* main page body */
section.page-body {
}
body > header nav ul.sub-menu li {
	background-image: url('/wp-content/themes/nattercan/bullet.svg');
	background-position: 0 center;
	background-size: 3px;
	background-repeat: no-repeat;
	padding-left: 10px;
	margin-top: 7px;
	margin-bottom: 0;
}

.page-template-default article.page {
	display: grid;
	grid-gap: 40px;
	grid-template-columns: 23fr 27fr;
	grid-template-rows: auto;
	grid-template-areas: "copy    hero"
	                     "masonry masonry";
}
.page-template-default article.page.nohero {
	grid-template-areas: "copy    copy"
	                     "masonry masonry";
}
.page-template-default article.page.nohero h2 { margin-bottom: 0; }
.page-template-default article.page #heroimage { grid-area: hero; }
.page-template-default article.page #content { grid-area: copy; }
.page-template-default article.page #masonry { grid-area: masonry; }
.page-template-default article.page #heroimage {
	width: 100%;
	/* height: auto; I think this breaks old versions of safari. */
}

#masonry {
	display: grid;
	grid-template-columns: 1fr 1fr;
	grid-template-rows: auto;
	grid-gap: 40px;
}
#masonry .full {
	grid-column-start: 1;
	grid-column-end: 3;
}
#masonry * {
	width: 100%;
	height: auto;
}

.overlay-link {
	background-size: cover;
	background-repeat: no-repeat;
	display: block;
}
.overlay .title {
	font-family: "haboronormregular", serif;
	font-size: 20px;
	line-height: 24px;
	letter-spacing: 6px;
	text-transform: uppercase;
}
.overlay .subtitle {
	font-family: "haboronormregular", serif;
	font-size: 15px;
	text-transform: none;
	letter-spacing: 0;
	font-style: italic;
	margin-bottom: 10px;
}
a.overlay-link > .overlay {
	transition: opacity 0.35s ease-in-out;
	opacity: 0;
	display: flex;
	color: black;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	width: 90%;
	height: 100%;
	padding-left: 5%;
	padding-right: 5%;
	background-color: rgba(255, 255, 255, 0.75);
	text-align: center;
}
a.overlay-link:hover > .overlay {
	opacity: 1;
}

/* footer */
footer {
	font-family: 'haboronormlight', serif;
	font-size: 12px;
	margin-top: 40px;
	margin-bottom: 40px;
}
footer .copy span {
	margin-left: 10px;
	font-family: 'haboronormlightitalic', serif;
}
footer .mobile-only {
	margin-top: 20px;
	text-align: center;
}
footer .mobile-only a.haboronorm-upper {
	font-size: 14px;
	letter-spacing: 5px;
}
footer .mobile-only > div > div > * {
	display: block;
	margin-bottom: 10px;
}
footer .mobile-only .social img {
	height: 18px;
	margin-left: 3px;
	margin-right: 3px;
}

/* custom forms */
.wpcf7-form textarea,
.wpcf7-form input[type='email'],
.wpcf7-form input[type='submit'],
.wpcf7-form input[type='text'] {
	font-family: "haboronormregular", serif;
	font-size: 14px;
	width: 100%;
	margin-bottom: 15px;
	padding: 5px 10px;
	box-sizing: border-box;
	border: 1px solid black;
}
.wpcf7-form textarea {
	margin-bottom: 10px; /* for some reason textarea has a gap at the bottom so we don't need suc ha big margin*/
}
.wpcf7-form input[type='submit'] {
	margin-top: 0 !important;
}
::placeholder {
	color: #b9b9b8;
	letter-spacing: 1px;
}
.wpcf7-form p { margin-bottom: 0; }
div.wpcf7-validation-errors,
div.wpcf7-mail-sent-ok {
	border: none;
	color: #5ec9e7;
	margin-left: 0;
	padding-left: 0;
	margin-top: 0;
}

/* Home */
.page-template-home .mobile-hero,
.page-template-home .hero {
	width: 100%;
	height: auto;
}
.page-template-home .mobile-hero { display: none; }

/* project list page */
#project-masonry {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
	grid-template-rows: auto;
	grid-gap: 40px;
}
#project-masonry .aspect-wrapper-3 {
	width: 100%;
	padding-bottom: 66%;
	position: relative;
	grid-column-end: span 3;
}
#project-masonry .aspect-wrapper-2 {
	width: 100%;
	padding-bottom: 100%;
	position: relative;
	grid-column-end: span 2;
}
#project-masonry .aspect-wrapper-2 > *, #project-masonry .aspect-wrapper-3 > * {
	position: absolute;
	width: 100%;
	height: 100%;
}

/* media list page */
#media-masonry {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	grid-template-rows: auto;
	grid-gap: 40px;
}
#media-masonry .aspect-wrapper {
	width: 100%;
	padding-bottom: 129.01%;
	position: relative;
}
#media-masonry .aspect-wrapper > *{
	position: absolute;
	width: 100%;
	height: 100%;
}

#media-masonry .overlay .title { letter-spacing: 3px; }

/* media / magazine view */
.magazine-wrapper {
	position: relative;
}
#magazine {
	width: 100%;
	overflow: hidden;
	white-space: nowrap;
}
#magazine img {
	height: auto;
	width: 100%;
}
/*#magazine img:first-child { margin-left: 50px; }
#magazine img:last-child { margin-right: 50px; }*/
.magazine-wrapper.count-0 .scroller, .magazine-wrapper.count-1 .scroller { display: none; }
.magazine-wrapper .scroller:hover {
	background-color: rgba(247, 248, 248, 0.95);
}
.magazine-wrapper .scroller {
	transition: background-color 0.25s ease-in-out;
	background-color: rgba(247, 248, 248, 0.6);
	position: absolute;
	top: 0;
	bottom: 0;
	width: 50px;
	cursor: pointer;
	background-repeat: no-repeat;
	background-position: 50%;
	background-size: 60%;
	margin-bottom: 5px;
}
.magazine-wrapper #left.scroller {
	background-image: url(/wp-content/themes/nattercan/left_arrow.svg);
	left: 0;
}

.magazine-wrapper #right.scroller {
	background-image: url(/wp-content/themes/nattercan/right_arrow.svg);
	right: 0;
}


/* about */
#post-36 > section#content {
	display: grid;
	grid-gap: 40px;
	grid-template-columns: 45fr 55fr;
	grid-template-rows: auto;
	grid-template-areas: "left right";
}
#post-36 .left {
	grid-area: left;
}
#post-36 .right {
	grid-area: right;
}
#post-36 .right img {
	width: 100%;
	height: auto;
}
/* contact */
#post-100 {
	display: block;
	width: 100%;
}
#post-100 > section#content {
	display: grid;
	grid-gap: 40px;
	grid-template-columns: 45fr 55fr;
	grid-template-rows: auto;
	grid-template-areas: "left right";
}
#post-100 .left {
	grid-area: left;
}
#post-100 .right {
	grid-area: right;
}
#post-100 .left img {
	width: 100%;
	height: auto;
}

/* Q&A */
#post-370 { display: block; }

/* product gift-voucher */
#product-197 .variations_form input[type='email'],
#product-197 .variations_form textarea,
#product-197 .variations_form input[type='text'] {
	display: block;
	float: none;
	max-width: 100%;
	min-width: 75%;
	margin-right: 1em;
}

/* woocommerce shop */
.post-type-archive-product .breadcrumbs { display: none; }

#menu-item-18 .sub-menu { display: none; } /* hide the shop submenu */
.woocommerce #menu-item-18 .sub-menu { display: block; } /* unless we're on a woocommerce page */
.woocommerce-page article.page {
	grid-template-areas: "copy copy";
}
.woocommerce-page.single-product #content { /* rearrange the page so messages are on the bottom */
	display: grid;
	grid-template-areas: "breadcrumbs" "shop" "messages";
}
.woocommerce-page.single-product #content .breadcrumbs { grid-area: breadcrumbs; }
.woocommerce-page.single-product #content .product { grid-area: shop; }
.woocommerce-page.single-product #content .woocommerce-message {  grid-area: messages; margin-top: 40px; margin-bottom: 0; }
.woocommerce ul.products {
	display: grid;
	grid-gap: 40px;
	grid-template-columns: 1fr 1fr 1fr;
	grid-template-rows: auto;
}
.woocommerce ul.products li.product {
	margin-right: 0;
	margin-bottom: 0;
	float: none;
	width: 100%;
}
.woocommerce .products h2 {
	text-align: center;
	text-transform: none;
	padding-top: 12px !important;
	padding-bottom: 8px !important;
}
.woocommerce ul.products li.product a img { transition: opacity 0.35s ease-in-out; }
.woocommerce ul.products li.product a:hover { color: black; }
.woocommerce ul.products li.product a:hover img { opacity: 0.25; }
.woocommerce .products ul::after, .woocommerce .products ul::before, .woocommerce ul.products::after, .woocommerce ul.products::before {
	display: none;
}
.woocommerce ul.products li.product a img {
	margin-bottom: 0;
	box-sizing: border-box;
}
.woocommerce ul.products li.product .woocommerce-loop-category__title, .woocommerce ul.products li.product .woocommerce-loop-product__title, .woocommerce ul.products li.product h3 {
	font-size: 17px;
	line-height: 22px;
	letter-spacing: 0;
}
.woocommerce ul.products li.product .ajax_add_to_cart,
.woocommerce ul.products li.product .add_to_cart_button {
	display: none;
}
.woocommerce ul.products li.product .price {
	text-align: center;
	color: black;
	font-size: inherit;
	margin-bottom: 0;
}
.woocommerce ul.products li.product a .soldout {
	position: absolute;
	bottom: 100px;
	left: 50%;
	transform: translate(-50%,0);
	font-family: 'haboronormdemi', serif;
	font-weight: normal;
	background: #000;
	text-transform: uppercase;
	color: #fff;
	padding: 3px 10px;
}
.woocommerce span.onsale { background-color: black; }
.woocommerce div.product p.price ins, .woocommerce div.product span.price ins { text-decoration: none; }

.woocommerce div.product .product_title { letter-spacing: 0; }
.woocommerce div.product div.images .woocommerce-product-gallery__wrapper { margin: 0; }
.woocommerce div.product div.images img { border: 1px solid #ddd; box-sizing: border-box; }
.woocommerce div.product .posted_in {
	display: none;
}
.woocommerce div.product p.price, .woocommerce div.product span.price {
	color: black;
}
.woocommerce select {
	background-color: white;
	border-radius: 0;
	border: 1px solid black;
	padding: 10px;
}
.woocommerce div.product form.cart .variations td.label {
	padding-right: 0;
	font-weight: normal;
	display: block;
}
.woocommerce div.product form.cart .variations td { line-height: inherit; }
.woocommerce div.product div.quantity span,
.woocommerce div.product form.cart .variations label {
	font-size: 13px;
	font-weight: normal;
	line-height: 22px;
	text-transform: none;
	letter-spacing: 0;
}
.woocommerce .variations .value { display: block; }
.woocommerce div.product div.quantity span {
	margin-top: 20px;
	display: block;
}
.woocommerce div.product form.cart div.quantity { float: none; }
.woocommerce div.product div.quantity input.qty {
	margin-top: 0;
	padding: 10px 0;
	width: 50px;
	text-align: left;
	padding-left: 10px;
	border: 1px solid black;
}
.woocommerce-store-notice { display: none !important; }
.woocommerce .woocommerce-store-notice { background-color: #3f5687; }
.woocommerce.single-product .woocommerce-store-notice { display: block !important; }

.woocommerce div.product .stock, .woocommerce div.product .woocommerce-variation-availability .stock { color: #5ec9e7; }
.woocommerce div.product form.cart, .woocommerce div.product div.images, .woocommerce div.product div.summary { margin-bottom: 0; }
.woocommerce-error::before, .woocommerce-message::before { color: #3f5687; }
.woocommerce-info::before { display: none; }
.woocommerce-error, .woocommerce-info, .woocommerce-message { border-top: none; background-color: #e3e2e2; margin-top: 20px; }

.wpcf7-form input[type='submit']:hover, 
.grey-button:hover,
#mc_embed_signup .button:hover,
.woocommerce input[type='submit']:hover,
.woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover,
.woocommerce div.product form.cart .button:hover {
	background-color: #3f5687;
	color: white;
}

.wpcf7-form input[type='submit'],
#mc_embed_signup .button,
.grey-button,
.woocommerce input[type='submit'],
.woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt,
#add_payment_method .wc-proceed-to-checkout a.checkout-button, .woocommerce-cart .wc-proceed-to-checkout a.checkout-button, .woocommerce-checkout .wc-proceed-to-checkout a.checkout-button,
.woocommerce div.product form.cart .button {
	display: block;
	line-height: 17px;
	box-sizing: border-box;
	text-align: center;
	padding: .618em 1em;
	font-family: "haboronormregular", serif;
	font-size: 17px;
	letter-spacing: 3px;
	font-weight: normal;
	text-transform: uppercase;
	margin-top: 20px;
	float: none;
	color: black;
	background-color: #e3e2e2;
	border: none;
	border-radius: 0;
	cursor: pointer;
}
.woocommerce div.product form.cart .button { width: 75%; }
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button { width: 100%; }
.woocommerce .actions input[type='submit'] {
	display: inline-block;
	font-size: 14px;
	padding-top: 8px;
	padding-bottom: 6px;
	padding-left: 15px;
	padding-right: 15px;
}
.woocommerce .woocommerce-message a.button { background-color: white; font-weight: normal; }
.woocommerce .woocommerce-message a.button:hover { background-color: #3f5687; color: white; }
.woocommerce-cart table.cart td.actions .coupon .input-text {
	font-size: 14px;
	padding: 5px 10px;
	margin-right: 20px;
}
.woocommerce a.remove { color: #3f5687 !important; }
.woocommerce a.remove:hover { background-color: #5ec9e7 }
.woocommerce .related.products { clear: both; }
.woocommerce .woocommerce-products-header { display: none; }
.woocommerce .woocommerce-ordering { display: none; }
.woocommerce .reset_variations { display: none !important; }
.woocommerce .woocommerce-product-gallery__wrapper {
	display: grid;
	grid-gap: 10px;
	grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
	grid-template-rows: auto;
}
.woocommerce .woocommerce-product-gallery__wrapper div:first-child {
	grid-column-start: 1;
	grid-column-end: 7;
}
.woocommerce div.product div.images .woocommerce-product-gallery__image:nth-child(n+2) {
	width: 100%;
}
.woocommerce table .product-price,
.woocommerce table .product-subtotal,
.woocommerce table .product-total,
.woocommerce table .order-total td,
.woocommerce table .cart-subtotal td {
	text-align: right;
}
.woocommerce .cart_totals h2 { text-align: center; }
.woocommerce table.shop_table_responsive tr:nth-child(2n),
.woocommerce-page table.shop_table_responsive tr:nth-child(2n) { background-color: #00000006; }
#add_payment_method #payment, .woocommerce-cart #payment, .woocommerce-checkout #payment { background-color: #00000006; }
#add_payment_method #payment div.payment_box, .woocommerce-cart #payment div.payment_box, .woocommerce-checkout #payment div.payment_box { background-color: #e2e2e2; color: black; }
#add_payment_method #payment div.payment_box::before, .woocommerce-cart #payment div.payment_box::before, .woocommerce-checkout #payment div.payment_box::before {
	border: 1em solid #e2e2e2;
	border-right-color: #0000;
	border-left-color: #0000;
	border-top-color: #0000;
}
.woocommerce form .form-row .required { text-decoration: none; color: black; }
.woocommerce .checkout_coupon .form-row { float: none; }
.woocommerce form.checkout_coupon .form-row::after, .woocommerce form.checkout_coupon .form-row::before { display: none; }
.woocommerce .giftcard input.input-text { width: 120px !important; margin-right: 30px; }

/* mailchimp / newsletter signup */
.page-id-23 #mc_embed_signup form {
	padding: 0;
	padding-top: 30px;
	max-width: 300px;
}
.page-id-23 #mc_embed_signup form input[type='email'] {
	font-family: "haboronormregular", serif;
	font-size: 14px;
	width: 100%;
	margin-bottom: 15px;
	padding: 5px 10px;
	box-sizing: border-box;
	border: 1px solid #000;
}
.page-id-23 #mc_embed_signup div.mce_inline_error {
	background-color: initial;
	color: #3f5687;
	padding-left: 0;
	padding-top: 0;
}

/* responsive */
@media (max-width: 1320px) {
	body { grid-template-columns: 20px 150px 1fr 5px 20px; }
	body > .logo .logofixed { width: calc(100vw - 20px - 150px - 5px - 20px - 40px*4); }
	body > header div.fixed { width: 150px; }
}

@media (min-width: 1050px) { #mobile-menu { display: none !important } }
@media (max-width: 1050px) {
	/* mobile menu, but still show grids etc.  */

	/* layout */
	body {
		margin-top: 0;
		margin: 0;
		display: flex;
		flex-direction: column;
		padding-left: 5%;
		padding-right: 5%;
	}
	body > header { padding-left: 0; }
	body > .logo .logofixed { position: relative; width: 100%; padding-top: 20px; padding-bottom: 20px; height: initial; justify-content: center; }
	#navigation-dots-wrapper { display: none; }

	/* mobile menu */
	nav.navbar #mobile-toggle { display: block; }
	nav.navbar #navbar { display: none; }
	nav.navbar #mobile-menu { display: block; }
	nav.navbar #mobile-toggle:hover { color: black; }
	nav.navbar #mobile-toggle {
		font-size: 13px;
		border-bottom: 1px solid black;
		padding-bottom: 10px;
	}
	nav.navbar #mobile-menu {
		margin-top: 20px;
		border-bottom: 1px solid black;
	}
	body > header nav ul.sub-menu li a { margin-right: 6px; }
	body > header nav ul.sub-menu li { margin-top: 5px; }

	/* header */
	body > header div.fixed { position: relative; width: 100%; text-align: center; padding-top: 10px; }
	header .nav_widget { display: none; }

	body > header nav.navbar ul.sub-menu li.current-menu-item,
	body > header nav ul.sub-menu li,
	body > header nav.navbar ul.sub-menu li:hover {
		background-image: none;
		padding-left: 0;
	}

	.cart-count-icon { 
		position: absolute;
		top: 0;
		right: 0;
	}
	body a.logo { text-align: center; }
	body > .logo img { width: 90%; vertical-align: middle; }

	/* landing */
	body.page-template-landing {
		padding-left: 0;
		padding-right: 0;
		display: flex;
		flex-direction: column;
		align-items: center;
		position: relative;
	}
	.page-template-landing .left {
		position: relative;
		width: 100%;
		display: block;
	}
	.page-template-landing .left .logo {
		margin-bottom: 30px;
		margin-top: 30px;
	}
	.page-template-landing .left .links { margin-bottom: 15px; margin-top: 15px; }
	.page-template-landing .left .links .pipe { display: none; }
	.page-template-landing .left .links a { display: block; }
	.page-template-landing .left .links a:first-child { font-size: 17px; }
	.page-template-landing .left .links a:last-child {
		font-size: 14px;
		letter-spacing: 5px;
		margin-top: 30px;
	}
	.page-template-landing .left .social { margin-bottom: 30px; }
	.page-template-landing .right {
		position: relative;
		width: 100vw;
		z-index: 1;
		overflow: hidden;
		display: block;
		height: 100vw;
	}
	.page-template-landing .right #video {
		display: block;
		position: relative;
		width: 177.77vw;
		min-width: 177.77vw;
		height: 100vw;
		min-height: 100vw;
		transform: translate(-50%,0);
		top: 0;
	}

	.breadcrumbs {
		display: none;
		font-size: 17px;
		letter-spacing: 6px;
		text-transform: uppercase;
		text-align: center;
		color: #5ec9e7;
	}

	a.overlay-link.visible > .overlay { opacity: 1; }

	.nomobile { display: none !important;}
	.mobile-only { display: initial; }

	.page-title { text-align: center; margin-top: 5px; }

	.woocommerce div.product div.images { margin-bottom: 20px; }
	.woocommerce div.product form.cart .button { width: 100%; }

	body .mobile-cart .cart-count-icon .count {
		width: 23px;
		padding-top: 6px;
		font-size: 10px;
		line-height: 32px;
	}

	/* mobile footer */
	footer { margin-top: 0; }
	footer .mobile-only { display: block; }
	footer .copy { text-align: center; font-size: 11px; }

	/* mailchimp / newsletter signup */
	.page-id-23 #mc_embed_signup form {
		margin-left: auto;
		margin-right: auto;
		text-align: center;
	}
	.page-id-23 #mc_embed_signup input {
		margin-left: auto;
		margin-right: auto;

}
@media (max-width: 750px) {
	/* mobile menu, but full width */

	#project-masonry { grid-gap: 20px; }
	#project-masonry .aspect-wrapper-2, #project-masonry .aspect-wrapper-3 { grid-column-end: span 5; }

	/* home */
	.page-template-home .hero { display: none; }
	.page-template-home .mobile-hero { display: block; }

	/* page body / default template */
	.page-template-default article.page {
		grid-gap: 20px;
		grid-template-columns: 1fr;
		grid-template-rows: auto;
		grid-template-areas: "hero" "copy" "masonry";
	}

	#masonry,
	#project-masonry,
	#media-masonry,
	.woocommerce ul.products,
	#post-100 > section#content {
		display: flex !important;
		flex-direction: column;
	}
	#masonry > *,
	#project-masonry > *,
	#media-masonry > *,
	.woocommerce ul.products > *,
	#post-100 > section#content > * {
		margin-bottom: 20px !important;
	}
	#masonry > *:last-child,
	#media-masonry > *:last-child ,
	.woocommerce ul.products > *:last-child,
	#post-100 > section#content > *:last-child {
		margin-bottom: 0 !important;
	}
	#post-100 > section#content { text-align: center; }
	.page-id-100 footer .mobile-only { margin-top: 0; }

	.magazine-wrapper .scroller { width: 15px; }

	/* product page -- disable grid, it doesn't work on IOS... */
	.woocommerce .woocommerce-product-gallery__wrapper { display: block; }
	.woocommerce .woocommerce-product-gallery__wrapper div:first-child { margin-bottom: 4px; padding-left: 2px; padding-right: 2px; }
	.woocommerce div.product div.images .woocommerce-product-gallery__image:nth-child(n+2) {
		width: calc(25% - 4px);
		margin-left: 2px;
		margin-right: 2px;
	}

}

@media screen and (max-width: 782px) { html #wpadminbar { top: -45px; } }

@media (max-width: 450px) {
	nav.navbar #mobile-toggle { font-size: 11px; }
	nav.navbar #mobile-menu { font-size: 14px; }
	header nav ul li { margin-bottom: 14px; }
	header nav ul.sub-menu { font-size: 12px; line-height: 20px; }
}