/*
Theme Name:StayGold
Theme URI:https://gearbrand.com
Author:Ryan Schossow
Author URI:https://gearbrand.com/
Description:Stay Gold Tattoo Theme.
Version:1.0
License:GNU General Public License v2 or later
License URI:http://www.gnu.org/licenses/gpl-2.0.html
Text Domain:quark
*/


@font-face {
    font-family:'tattoofive';
    src:url('fonts/tattoofive-serif-webfont.woff2') format('woff2'),
         url('fonts/tattoofive-serif-webfont.woff') format('woff');
    font-weight:normal;
    font-style:normal;

}
@font-face {
    font-family:'varelaregular';
    src:url('fonts/varela-regular-webfont.woff2') format('woff2'),
         url('fonts/varela-regular-webfont.woff') format('woff');
    font-weight:normal;
    font-style:normal;

}
:root {
	--htmlbg:#000000;
	--bodybg:#353535;
	--logobg:rgba(0, 0, 0, 0.8);
	--primary:#250000;
	--primarydk:#110000;
	--primarylt:#500000;
	--secondary:#534917;
	--cream:#fce38b;
	--gold:#f3c22d;
	--graylt:#cccccc;
	--graymd:#666666;
	--graydk:#222222;
	--blue:#0076a3;
	--bluelt:#007fdd;
	--orange:#f26522;
	--green:#284d01;
	--dkgreen:#182f01;
	--paynes:#40404f;
}



/* Text meant only for screen readers */
.assistive-text {
  border:0;
  clip:rect(1px, 1px, 1px, 1px);
  clip-path:inset(50%);
  height:1px;
  margin:-1px;
  overflow:hidden;
  padding:0;
  position:absolute !important;
  width:1px;
  word-wrap:normal !important;
}
.assistive-text:focus {
  background-color:var(--graylt);
  clip:auto !important;
  clip-path:none;
  color:var(--graydk);
  display:block;
  font-size:1em;
  height:auto;
  left:5px;
  line-height:normal;
  padding:15px 23px 14px;
  text-decoration:none;
  top:5px;
  width:auto;
  z-index:100000; /* Above WP toolbar. */
}
.screen-reader-text {
	clip:rect(1px, 1px, 1px, 1px);
	position:absolute !important;
	height:1px;
	width:1px;
	overflow:hidden;
}
.screen-reader-text:focus {
	background-color:#f1f1f1;
	border-radius:3px;
	box-shadow:0 0 2px 2px rgba(0, 0, 0, 0.6);
	clip:auto !important;
	color:var(--blue);
	display:block;
	font-size:14px;
	font-size:0.875em;
	font-weight:bold;
	height:auto;
	left:5px;
	line-height:normal;
	padding:15px 23px 14px;
	text-decoration:none;
	top:5px;
	width:auto;
	z-index:100000; /* Above WP toolbar. */
}




/* ==========================================================================
   Basic page styles
   ========================================================================== */
* { -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box; }

::-webkit-selection { background:var(--primary); color:var(--cream); text-shadow:none; }
::-moz-selection { background:var(--primary); color:var(--cream); text-shadow:none; }
::selection { background:var(--primary); color:var(--cream); text-shadow:none; }

.cf:before, .cf:after { content:""; display:table; }
.cf:after { clear:both; }
.cf { *zoom:1; }

html {
	background:var(--htmlbg);
}
body {
	background:var(--bodybg);
	color:var(--graydk);
	font-family:'varelaregular', sans-serif;
	font-size:120%; 
	line-height:1.4;
	padding:0; 
	margin:0;
}
canvas { 
	-ms-touch-action:double-tap-zoom; 
}
embed, iframe, object, video { 
	max-width:100%; 
}
img {
	border:0;
	max-width:100%;
	height:auto;
	vertical-align:top;
}
img.wp-smiley, .rsswidget img { 
	padding:0; 
	margin-bottom:0; 
	margin-top:0; 
	border:0; 
	border-radius:0; 
	box-shadow:none; 
}


/* Headings */
h1, h2, h3, h4, h5, h6 {
	font-family:'Georgia', 'Times New Roman', 'Times', serif;
	font-style:normal;
	font-weight:bold;
	color:var(--graydk);
	margin-top:0;
}
h1 {
	font-size:2.2em;
	line-height:1;
	margin-bottom:1em;
}
h2 {
	font-size:1.6em;
	line-height:1;
	margin-bottom:.5em;
}
h3 {
	font-size:1.5em;
	line-height:1;
	margin-bottom:.5em;
}
h4 {
	font-size:1.4em;
	line-height:1;
	margin-bottom:.5em;
}
h5 {
	font-size:1.3em;
	line-height:1;
	margin-bottom:.5em;
}
h6 {
	font-size:1.2em;
	line-height:1;
	margin-bottom:.5em;
}
hr {
	background-color:var(--graylt);
	height:1px;
	margin:1em 0;
	border:0;
}


/* Typography */
p, ol, ul, dl, address {
	font-size:1em;
	line-height:1.4;
	padding:0;
	margin:.5em 0 1em;
}
ol, ul, dl {
	font-size:1em;
	line-height:1.4;
	padding:0;
	margin:.5em 0 1em 1em;
}
p img {
	padding-bottom:1em;
}
ul ul, ul ol, ol ol, ol ul {
	margin-bottom:0;
}
dt {
	font-family:'varelaregular', sans-serif;
	font-style:normal;
	font-weight:bold;
}
figure {
	margin:1em 0;
}
b, strong {
	font-weight:bold;
}
em {
	font-style:italic;
}
a {
	color:var(--green);
	outline:none;
	text-decoration:underline;
}
a:visited {
	color:var(--graymd);
}
a:focus {
	outline:thin dotted;
	color:#aa5533;
}
a:hover, a:active {
	outline:0;
	color:var(--gold);
}
.alignleft {
	display:inline;
	float:left;
	margin:0 1em 1em 0;
}
.alignright {
	display:inline;
	float:right;
	margin:0 0 1em 1em;
}
.aligncenter {
	clear:both;
	display:block;
	margin:1em auto;
}
blockquote:before, blockquote:after, q:before, q:after {
	content:'';
}
blockquote {
	padding:0 0 0 1em;
	margin 0 0 1em 1em;
	border-left:5px solid var(--graydk);
}
blockquote.pull-right {
	padding:0 1em 0 0;
	margin:0 1em 1em 0;
	float:none;
	border-left:0 none;
	border-right:.3em solid var(--graydk);
}
blockquote p {
	font-family:'varelaregular', sans-serif;
	font-size:1.5em;
	font-weight:normal;
	font-style:italic;
	margin-bottom:0;
}
blockquote.pull-right p, blockquote.pull-right small {
	text-align:right;
}
blockquote cite:before {
	content:"\2014 ";
}
blockquote cite {
	display:block;
	color:var(--graymd);
	font-family:'varelaregular', sans-serif;
	font-size:.9em;
	line-height:1.2;
	font-weight:normal;
	font-style:normal;
}
table {
	border-collapse:collapse;
	border-spacing:0;
}
caption, th, td {
	font-weight:normal;
	text-align:left;
	vertical-align:top;
}
sub,sup {
	font-size:.75em;
	line-height:0;
	position:relative;
	vertical-align:baseline;
}
sup {
	top:-0.5em;
}
sub {
	bottom:-0.25em;
}
.wp-caption {
	max-width:100%;
	padding:.3em;
}
.wp-caption .wp-caption-text, .gallery-caption, .entry-caption {
	color var(--graymd);
	font-family:'varelaregular', sans-serif;
	font-size:.9em;
	line-height:1.4;
	font-style:italic;
	font-weight:normal;
	text-align:center;
}

/* Buttons */
.menu-toggle, button, input {
	font-family:'varelaregular', sans-serif;
	font-size:1em;
	line-height:1.2;
	font-style:normal;
	font-weight:normal;
	vertical-align:middle;
	margin:0;
}
.menu-toggle, button, input {
	*overflow:visible;
	line-height:normal;
}
.menu-toggle::-moz-focus-inner, button::-moz-focus-inner, input::-moz-focus-inner {
	padding:0;
	border:0;
}
button, input[type="button"], input[type="reset"], input[type="submit"] {
	cursor:pointer;
	-webkit-appearance:button;
}
input[type="button"] {
	width:auto;
}
.menu-toggle, .btn, input[type="submit"] {
	display:inline-block;
	background-color:#f1f1f1;
	color:var(--graydk);
	font-size:1em;
	line-height:1.2;
	text-align:center;
	text-shadow:0 1px 1px rgba(255, 255, 255, 0.75);
	vertical-align:middle;
	cursor:pointer;
	padding:.5em .8em;
	margin-bottom:0;
	border:1px solid var(--graylt);
	border-radius:.3em;
}
.menu-toggle, a.btn {
	color:var(--graydk);
	text-decoration:none;
}
.menu-toggle:hover, .btn:hover, .btn:active, .btn.active, .btn.disabled, .btn[disabled] {
	background-color:var(--graylt);
}
.menu-toggle:hover, .btn:hover, input[type="submit"]:hover {
	background-color:var(--graylt);
	color:var(--graydk);
	text-decoration:none;
}
.menu-toggle:focus, .btn:focus, input[type="submit"]:focus {
	outline:thin dotted var(--graydk);
	outline:5px auto -webkit-focus-ring-color;
	outline-offset:-2px;
}
.menu-toggle:active, .btn.active, .btn:active, input[type="submit"]:active {
	background-color var(--graylt);
	background-image none;
	outline:0;
	position:relative;
	top:1px;
}
.btn.disabled, .btn[disabled] {
	cursor:default;
	background-color:var(--graylt);
	background-image:none;
	opacity:0.65;
	filter:alpha(opacity=65);
	box-shadow:none;
}
.btn.disabled:active, .btn[disabled]:active {
	top:0;
}
button.btn, input[type="submit"].btn {
	padding-top:2px;
	padding-bottom:2px;
}
button.btn::-moz-focus-inner, input[type="submit"].btn::-moz-focus-inner {
	padding:0;
	border:0;
}
.btn-large, input[type="submit"].btn-large {
	font-size:1.25em;
	padding:10px 15px;
	border-radius:.3em;
}
.btn-small, input[type="submit"].btn-small {
	font-size:.8em;
	padding:5px 9px;
}

/* Form fields */
input[type="text"],
input[type="password"],
input[type="email"],
input[type="url"],
textarea {
	font-family:inherit;
	padding:8px;
	padding:0.5em;
	font-family:inherit;
	border:1px solid var(--graylt);
	border-radius:3px;
}
select {
	max-width:100%;
}





/* ==========================================================================
   WooCommerce
   ========================================================================== */
h1.page-title {
	color:var(--graydk);
	font-family:'Georgia', 'Times New Roman', 'Times', serif;
	font-style:normal;
	font-weight:normal;
	margin-top:0;
}
h1.page-title {
	font-size:3em;
	line-height:1.25;
}
.woocommerce .woocommerce-info:before, .woocommerce-page .woocommerce-info:before, .woocommerce .woocommerce-message:before, .woocommerce-page .woocommerce-message:before {
	color:var(--blue);
}
.woocommerce .woocommerce-info, .woocommerce-page .woocommerce-info, .woocommerce .woocommerce-message, .woocommerce-page .woocommerce-message {
	border-color:var(--blue);
}
.woocommerce #content div.product p.price,
.woocommerce #content div.product span.price,
.woocommerce div.product p.price,
.woocommerce div.product span.price,
.woocommerce-page #content div.product p.price,
.woocommerce-page #content div.product span.price,
.woocommerce-page div.product p.price,
.woocommerce-page div.product span.price,
.woocommerce ul.products li.product .price,
.woocommerce-page ul.products li.product .price,
.woocommerce ul.products li.product .price,
.woocommerce-page ul.products li.product .price {
	color:var(--green);
	font-weight:bold;
}
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #content input.button.alt,
.woocommerce #respond input#submit.alt,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce-page #content input.button.alt,
.woocommerce-page #respond input#submit.alt,
.woocommerce-page a.button.alt,
.woocommerce-page button.button.alt,
.woocommerce-page input.button.alt {
	background-color:var(--blue);
	color:#fff;
	padding:.5em .75em;
	border:1px solid var(--bluelt);
	border-color:var(--blue);
	text-shadow:none;
}
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #content input.button.alt:hover,
.woocommerce #respond input#submit.alt:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover,
.woocommerce-page #content input.button.alt:hover,
.woocommerce-page #respond input#submit.alt:hover,
.woocommerce-page a.button.alt:hover,
.woocommerce-page button.button.alt:hover,
.woocommerce-page input.button.alt:hover {
	background-color:var(--blue);
	color:#fff;
	border:1px solid var(--bluelt);
	border-color:var(--blue);
}
.woocommerce span.onsale, .woocommerce-page span.onsale {
	background-color:var(--bluelt);
	line-height:2.6;
	min-height:3em;
	min-width:3em;
}
.woocommerce #content nav.woocommerce-pagination ul li span.current,
.woocommerce nav.woocommerce-pagination ul li span.current,
.woocommerce-page #content nav.woocommerce-pagination ul li span.current,
.woocommerce-page nav.woocommerce-pagination ul li span.current {
	background-color:var(--graydk);
	color:#fff;
}
.woocommerce nav.woocommerce-pagination li a.page-numbers,
.woocommerce nav.woocommerce-pagination li span.page-numbers {
	line-height:1.25;
	text-decoration:none;
	padding:.3125em;
	border:1px solid var(--graydk);
}
.woocommerce nav.woocommerce-pagination ul.page-numbers li {
	margin:0 .1em;
	border:none;
}
.woocommerce nav.woocommerce-pagination ul.page-numbers {
	border:none;
}
.woocommerce nav.woocommerce-pagination li a.prev,
.woocommerce nav.woocommerce-pagination li a.next,
.woocommerce nav.woocommerce-pagination li span.dots {
	border:none;
}
.woocommerce nav.woocommerce-pagination li a:hover.page-numbers {
	background-color:var(--blue);
	color:#fff;
}
.woocommerce nav.woocommerce-pagination li a:hover.prev,
.woocommerce nav.woocommerce-pagination li a:hover.next {
	background-color:transparent;
	color:var(--blue);
}
.shipping-calculator-button {
	text-decoration:none;
}
.woocommerce div.product div.images ol.flex-control-thumbs {
	padding-top:1em;
}
.woocommerce div.product div.images ol.flex-control-thumbs li {
	width:32%;
	margin:0 2% 10px 0;
}
.woocommerce div.product div.images ol.flex-control-thumbs li:nth-child(3n+3) {
	margin-right:0;
}
.woocommerce .pswp__caption__center {
	text-align:center;
}
.woocommerce .quantity .qty,
.woocommerce #add_payment_method table.cart .input-text,
.woocommerce-cart .woocommerce table.cart .input-text,
.woocommerce-checkout .woocommerce table.cart .input-text,
.woocommerce-cart .woocommerce table.cart td.actions .input-text {
	line-height:1.6;
}
.woocommerce-checkout .woocommerce #billing_phone_field input {
	padding:.5em;
	border-style:solid;
	border-width:1px;
}
.woocommerce-cart .woocommerce table.cart #coupon_code {
	width:100px;
}

/* WooCommerce MINE */
.woocommerce-tabs {
	display:none;
}
ul.products {
	display:block;
	width:100%;
	text-align:center;
}
.woocommerce ul.products li.product, .woocommerce-page ul.products li.product {
	background:#fff;
	display:inline-block;
	width:calc(24% - 1em) !important;
	float:none !important;
	vertical-align:top;
	text-align:center;
	padding:.5em !important;
	margin:.5em !important;
	border:1px solid var(--primary);
	border-radius:.5em;
}
.woocommerce ul.products li.product a img, .woocommerce-page ul.products li.product a img {
	margin:0 !important;
}
.woocommerce ul.products li.product a.add_to_cart_button, .woocommerce-page ul.products li.product a.add_to_cart_button {
	display:block;
	background:var(--gold);
	color:var(--graydk);
	font-size:.8em;
	text-align:center;
	padding:.5em;
	margin:.5em 0 0 !important;
	border-radius:.5em;
}
.woocommerce ul.products li.product a:hover.add_to_cart_button, .woocommerce-page ul.products li.product a:hover.add_to_cart_button {
	background:var(--secondary);
	color:var(--cream);
}

.site-content .wrap {
	max-width:100% !important;padding:0 !important;
	margin:0 !important;
}
.woocommerce-breadcrumb, .product_meta, section.related {
	display:none;
}
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .woocommerce #content input.button.alt, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt, .woocommerce-page #content input.button.alt, .woocommerce-page #respond input#submit.alt, .woocommerce-page a.button.alt, .woocommerce-page button.button.alt, .woocommerce-page input.button.alt {
	background-color:var(--primary);
	color: var(--cream);
	text-shadow: none;
	padding:.5em .75em;
	border: 1px solid var(--primarydk);
	border-radius:.5em;
}
.woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce input.button:hover, .woocommerce #content input.button.alt:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover, .woocommerce-page #content input.button.alt:hover, .woocommerce-page #respond input#submit.alt:hover, .woocommerce-page a.button.alt:hover, .woocommerce-page button.button.alt:hover, .woocommerce-page input.button.alt:hover {
	background-color:var(--secondary);
	color: var(--gold);
	text-shadow: none;
	padding:.5em .75em;
	border: 1px solid var(--primarydk);
}
.woocommerce-account .woocommerce-MyAccount-navigation {
	width:30%;
	float:left;
	padding:0 !important;
	margin:0 !important;
}
.woocommerce-MyAccount-navigation ul {
	list-style:none;
	padding:0;
	margin:0;
}
.woocommerce-MyAccount-navigation ul li {
	margin:0;
}
li.woocommerce-MyAccount-navigation-link a {
	display:block;
	background:#000;
	color:#fff;
	font-family:sans-serif;
	font-weight:normal;
	text-align:center;
	text-decoration:none !important;
	outline:0 !important;
	box-shadow:none !important;
	padding:.25em 1em;
	margin:0 1em 1em 0;
	border:0;
	border-radius:.5em;
}
li.woocommerce-MyAccount-navigation-link a:hover {
	background:#222;
	color:gold;
}
li.woocommerce-MyAccount-navigation-link.is-active a {
	background:#444;
	color:gold;
	font-weight:bold;
}
li.woocommerce-MyAccount-navigation-link.woocommerce-MyAccount-navigation-link--downloads {
	display:none !important;
}

.woocommerce .woocommerce-info:before, .woocommerce-page .woocommerce-info:before, .woocommerce .woocommerce-message:before, .woocommerce-page .woocommerce-message:before {
	color:var(--primarylt);
}
.woocommerce .woocommerce-info, .woocommerce-page .woocommerce-info, .woocommerce .woocommerce-message, .woocommerce-page .woocommerce-message {
	border-color:var(--primarylt);
}
input#coupon_code {
	width:7.5em !important;
}
strong.size-guide-title {
	display:block;
	clear:both;
	width:100%;
}















/* ==========================================================================
   Site specific styles
   ========================================================================== */
div#site-logo {
	display:block;
	width:100%;
	background:var(--logobg);
	padding:.5em 25%;
}
#primary {
	background:rgba(255, 255, 255, 0.75);
	width:calc(70% - 1em);
	float:left;
	margin:1em 0 1em 1em;
	border:6px solid #000;
	border-radius:1em 1em 1em 1em;
	box-shadow: 3px 3px 8px #111;
}
#sidebar {
	color:var(--graylt);
	font-size:.9em;
	width:30%;
	float:left;
	padding:1em;
}

/* ==========================================================================
   Main Content
   ========================================================================== */
/* content background color*/
#page {
	background-image: url("img/cosmos-2.jpg");
  background-color: var(--bodybg);
  background-position: center;
  background-repeat: repeat;
  background-size: cover;
}
.site-header {
	clear:both;
	width:100%;
	color:#000;
	font-size:1em;
	padding:0;
	margin:0;
}
.site-content {
	clear:both;
	position:relative;
	width:100%;
	color:var(--graydk);
	line-height:1.4;
	padding:1em;
	margin:0;
}
.page-content, .entry-content, .entry-summary {
  margin:1.5em 0 0;
}
.tattooer-info {
	padding:1em 1em 2em;
	overflow:hidden;
}
#content.site-content {
	padding:0;
	margin:0;
}
.entry-meta {
	clear:both;
}
.comments-link {
	font-family:'varelaregular', sans-serif;
	font-size:.9em;
	font-weight:normal;
	font-style:italic;
	float:right;
}
.entry-header {
	margin-bottom:1em;
}
h1.entry-title, h1.woocommerce-products-header__title {
	display:block;
	float:none;
	width:100%;
	color:var(--secondary) !important;
	font-family:'tattoofive', serif !important;
	font-size:2.6em !important;
	line-height:100%;
	text-align:center;
	padding:0;
	margin:0;
	text-shadow:
		-1px -1px 0 var(--cream),
		1px -1px 0 var(--cream),
		-1px 1px 0 var(--cream),
		1px 1px 0 var(--cream),
		-2px -2px 0 var(--cream),
		2px -2px 0 var(--cream),
		-2px 2px 0 var(--cream),
		2px 2px 0 var(--cream);
}
h1.product_title.entry-title {
	font-size:2.6em !important;
	line-height:100%;
}
h2 {
	font-family:'tattoofive', serif;
	line-height:100%;
	padding:0;
	margin:1em 0 0;
}
.contact-block-title {
	color:var(--dkgreen);
	font-family:'tattoofive', serif;
	font-size:1.6em;
	line-height:1;
}

a.post-edit-link {
	display:inline-block;
	background:var(--graymd);
	color:var(--graydk);
	font-size:.8em;
	text-decoration:none;
	padding:.2em .5em;
	margin:.5em 0;
	border-radius:1em;
}
a:hover.post-edit-link {
	background:var(--graydk);
	color:var(--graylt);
}

.page-links {
	clear:both;
	line-height:1.75;
	color:var(--graydk);
}
.page-links .page-numbers {
	background-color:var(--graydk);
	color:#fff;
	padding:.12em .25em;
	border:1px solid var(--graydk);
}
.page-links a {
	text-decoration:none;
}
.page-links a .page-numbers {
	background-color:transparent;
	color:var(--graydk);
}
.page-links a:hover .page-numbers {
	background-color:var(--blue);
	color:#fff;
}
.more-link {
	text-decoration:none;
}

/* ==========================================================================
   Content Navigation
   ========================================================================== */
.site-content nav {
	clear:both;
	line-height:2;
	overflow:hidden;
}
#nav-above {
	padding:1.5em;
	display:none;
}
.paged #nav-above {
	display:block;
}
.nav-previous, .previous-image {
	width:50%;
	line-height:1.3;
	float:left;
}
.nav-previous a, .nav-next a {
	text-decoration:none;
}
.nav-next, .next-image {
	width:50%;
	line-height:1.3;
	text-align:right;
	float:right;
}
.nav-single + .comments-area, #comment-nav-above {
	margin:3em 3em 3em 0;
}
ul.page-numbers {
	line-height:2;
	text-align:center;
	padding:0;
	margin:0;
}
li a.page-numbers, li span.page-numbers {
	text-decoration:none;
	padding:.3125em;
	border:1px solid var(--graydk);
}
li a:visited.page-numbers {
	color:var(--graydk);
}
li a:hover.page-numbers {
	background-color:var(--blue);
	color:#fff;
}
li a:hover.prev, li a:hover.next {
	background-color:transparent;
	color:var(--blue);
}
.page-numbers li {
	display:inline;
}
li span.current {
	background-color:var(--graydk);
	color:#fff;
}
li a.prev, li a.next, li span.dots {
	border:none;
}






/* ==========================================================================
   Main Navigation
   ========================================================================== */
.main-navigation {
	display:block;
	background:var(--dkgreen);
	text-align:center;
	border:4px solid #000;
	border-left:0;
	border-right:0;
	box-shadow: 0 3px 8px #111;
}
.main-navigation ul {
	display:block;
	text-align:center;
	padding:0;
	margin:0;
}
.main-navigation ul li {
	display:inline-block;
	text-align:center;
}
.main-navigation a {
	display:block;
	text-align:center;
	background:var(--gold);
	color:var(--graydk);
	font-size:1em;
	text-decoration:none;
	padding:.1em .5em;
	margin:.5em;
	border:1px solid var(--cream);
	border-radius:1em;
}
.main-navigation a:hover {
	background:#000;
	color:var(--cream);
	border:1px solid #000;
}
.main-navigation .current_page_item a, .main-navigation .current_page_item a:hover, .main-navigation .current_page_parent a, .main-navigation .current_page_parent a:hover {
	background:#000;
	color:var(--paynes);
	border:1px solid #000;
}

/* ==========================================================================
   Gallery
   ========================================================================== */
h2.gallery-title {
	display:block;
	color:var(--cream);
	background:#000;
	font-family: 'Georgia', 'Times New Roman', 'Times', serif;
	text-align:center;
	padding:.2em .1em .1em;
	margin:0 -1em -.7em;
}
.post-2 h2.gallery-title {
	margin: 0 -.7em -.7em;
}
.gallery {
	display:block;
	background:var(--dkgreen);
	min-width:calc(100% + 2.1em);
	max-width:calc(100% + 2.1em);
	width:calc(100% + 2.1em);
	text-align:center;
	padding:1em;
	margin: 1em 0 -2.3em -1.05em;
	border-top:4px solid #000;
	border-radius:0 0 .8em .8em;
}
.post-2 .gallery {
	margin-bottom:-1.1em
}
.gallery-columns-1 .gallery-item, .gallery-columns-2 .gallery-item, .gallery-columns-3 .gallery-item, .gallery-columns-4 .gallery-item, .gallery-columns-5 .gallery-item, .gallery-columns-6 .gallery-item, .gallery-columns-7 .gallery-item, .gallery-columns-8 .gallery-item, .gallery-columns-9 .gallery-item {
  display:inline-block;
  text-align:center;
  background: url(img/tattooframe.svg);
  background-size: contain;
  background-repeat: no-repeat;
  margin:.5em !important;
}
.gallery-columns-1 .gallery-item {
  max-width:calc(100% - 1em) !important;
  max-height:calc(100% - 1em) !important;
  min-width:calc(100% - 1em) !important;
  min-height:calc(100% - 1em) !important;
  width:calc(100% - 1em) !important;
  height:calc(100% - 1em) !important;
}
.gallery-columns-2 .gallery-item {
  max-width:calc(50% - 1em) !important;
  max-height:calc(50% - 1em) !important;
  min-width:calc(50% - 1em) !important;
  min-height:calc(50% - 1em) !important;
  width:calc(50% - 1em) !important;
  height:calc(50% - 1em) !important;
}
.gallery-columns-3 .gallery-item {
  max-width:calc(33.333% - 1em) !important;
  max-height:calc(33.333% - 1em) !important;
  min-width:calc(33.333% - 1em) !important;
  min-height:calc(33.333% - 1em) !important;
  width:calc(33.333% - 1em) !important;
  height:calc(33.333% - 1em) !important;
}
.gallery-columns-4 .gallery-item {
  max-width:calc(25% - 1em) !important;
  max-height:calc(25% - 1em) !important;
  min-width:calc(25% - 1em) !important;
  min-height:calc(25% - 1em) !important;
  width:calc(25% - 1em) !important;
  height:calc(25% - 1em) !important;
}
.gallery-columns-5 .gallery-item {
  max-width:calc(20% - 1em) !important;
  max-height:calc(20% - 1em) !important;
  min-width:calc(20% - 1em) !important;
  min-height:calc(20% - 1em) !important;
  width:calc(20% - 1em) !important;
  height:calc(20% - 1em) !important;
}
.gallery-columns-6 .gallery-item {
  max-width:calc(16.666% - 1em) !important;
  max-height:calc(16.666% - 1em) !important;
  min-width:calc(16.666% - 1em) !important;
  min-height:calc(16.666% - 1em) !important;
  width:calc(16.666% - 1em) !important;
  height:calc(16.666% - 1em) !important;
}
.gallery-columns-7 .gallery-item {
  max-width:calc(14.285% - 1em) !important;
  max-height:calc(14.285% - 1em) !important;
  min-width:calc(14.285% - 1em) !important;
  min-height:calc(14.285% - 1em) !important;
  width:calc(14.285% - 1em) !important;
  height:calc(14.285% - 1em) !important;
}
.gallery-columns-8 .gallery-item {
  max-width:calc(12.5% - 1em) !important;
  max-height:calc(12.5 - 1em) !important;
  min-width:calc(12.5% - 1em) !important;
  min-height:calc(12.5% - 1em) !important;
  width:calc(12.5% - 1em) !important;
  height:calc(12.5% - 1em) !important;
}
.gallery-columns-9 .gallery-item {
  max-width:calc(11.111% - 1em) !important;
  max-height:calc(11.111% - 1em) !important;
  min-width:calc(11.111% - 1em) !important;
  min-height:calc(11.111% - 1em) !important;
  width:calc(11.111% - 1em) !important;
  height:calc(11.111% - 1em) !important;
}
.gallery-item img {
	padding:10%;
}
.gallery-item {
	box-shadow: 4px 4px 8px #000000;
}
.pp_expand, .pp_gallery {
	display:none !important;
}

/* ==========================================================================
   Sidebar Content
   ========================================================================== */
#tattooer-menu h1, #guest-artist h1, #shop-info h1 {
	background:#000;
	color:var(--cream);
	font-size:1.4em;
	text-align:center;
	padding-top:.2em;
	padding-left:.5em;
	padding-right:.5em;
	margin:1em 0 0;
	border-radius:.5em .5em 0 0;
	border:4px solid #000;
	border-bottom:4px solid var(--primarydk);
}
#tattooer-menu h1 {
	margin-top:0;
}
#tattooer-menu .contain, #guest-artist .contain, #shop-info .contain {
	background:rgba(255, 255, 255, 0.75);
	color:var(--graydk);
	text-align:center;
	padding:1em 1em .5em;
	border:4px solid #000;
	border-radius:0 0 1em 1em;
	box-shadow: -3px 3px 8px #111;
}
#tattooers {
	list-style:none;
	text-align:center;
	padding:0;
	margin:0;
}
#tattooers li {
	display:inline-block;
	float:left;
	width:50%;
	text-align:center;
	padding:0;
	margin:0;
}
#tattooers li a {
	display:inline-block;
	text-decoration:none;
	padding:.4em .5em .5em;
	margin:0;
	border-radius:.5em;
}
#tattooers li a img {
	border:.5em solid #000;
	border-radius:50%;
	margin-bottom:-.2em;
}
#tattooers li a span {
	display:block;
	background:#000;
	color:var(--gold);
	text-decoration:none;
	border-radius:.5em;
}
#tattooers li a:hover img {
	border:.5em solid var(--green);
	border-radius:50%;
	margin-bottom:-.2em;
}
#tattooers li a:hover span {
	display:block;
	background:var(--green);
	color:var(--gold);
	text-decoration:none;
	border-radius:.5em;
}
/** current tattooer */
#tattooers li a.current img, #tattooers li a:hover.current img {
	border-color:var(--graymd);
}#tattooers li a.current span, #tattooers li a:hover.current span {
	color:var(--graylt);
	background:var(--graymd);
}

#guest-artist .contain > h2:first-child, #shop-info .contain > h2:first-child {
	margin-top:.5em;
}
#guest-artist .contain h2 {
	display:block;
	color:var(--dkgreen) !important;
	font-size:1.2em;
	line-height:1;
	text-align:center;
	margin-bottom:0;
}
#guest-artist .contain a {
	display:block;
	background:var(--gold);
	color:var(--dkgray);
	text-decoration:none;
	padding:.1em .2em .5em;
	margin:.2em 0 .5em 0 !important;;
	border-radius:1em;
	border-top:6px solid #000;
	border-bottom:6px solid #000;
}
#guest-artist .contain a h2 {
	margin:.2em 0 0;
}
#guest-artist .contain a p {
	margin:0 0.2em 0;
}
#guest-artist .contain a:hover {
	background:var(--cream);
}
#guest-artist .contain a.current:hover, #guest-artist .contain a.current {
	background:var(--graymd);
}
#shop-info .contain h2 {
	display:block;
	color:var(--dkgreen) !important;
	font-size:1.4em;
	line-height:1;
	text-align:center;
	margin-bottom:.2em;
}
#shop-info .contain ul {
	list-style:none;
	padding:0;
	margin:0 0 1em;
	border-top:1px solid var(--graydk);
}
#shop-info .contain ul li {
	display:block;
	padding:0;
	margin:0;
	border-bottom:1px solid var(--graydk);
}
.side-hide-small {
	display:block;
}
.side-hide-big {
	display:none;
}

ul.tattooer-social, #shop-info .contain ul.tattooer-social {
	display:block;
	width:100%;
	list-style:none;
	text-align:left;
	padding:0;
	margin:0 0 1em !important;
	border:none;
}
#shop-info .contain ul.tattooer-social, #guest-artist .contain ul.tattooer-social {
	display:block;
	width:100%;
	list-style:none;
	text-align:center;
	padding:0;
	margin:0 0 1em !important;
	border:none;
}
.tattooer-social li, #shop-info .contain ul.tattooer-social li {
	display:inline;
	border:none;
}
.tattooer-social li a, #shop-info .contain ul.tattooer-social li a {
	display:inline-block;
	background:var(--gold);
	width:2em;
	margin:.25em !important;
	border-radius:.2em;
}
.tattooer-social li a:hover, #shop-info .contain ul.tattooer-social li a:hover {
	background:var(--graylt);
}

/* ==========================================================================
   Footer
   ========================================================================== */
#footercontainer {
	width:100%;
}
.site-footer {
	background:var(--logobg) !important;
	clear:both;
	text-align:center;
	border:6px solid #000;
	border-left:0;
	border-right:0;
}
.site-info {
	color:var(--graymd);
	font-size:.9em;
	width:100%;
	margin:0 0 1em;
}
.site-info a {
	color:#444;
	font-weight:bold !important;
	text-decoration:none;
	box-shadow:none;
}
.site-info a:hover {
	color:var(--graylt);
}

.small {
	display:none !important;
}





/* ==========================================================================
   Media Queries
   ========================================================================== */

/*  Breakpoints are set based on the design, not based on device sizes */

/** <= 1080 */
@media screen and (max-width:1080px) {
	.woocommerce-account .woocommerce-MyAccount-content {
		clear:both;
		display:block;
		float:none;
		width:100%;
	}
	.woocommerce-MyAccount-navigation ul {
		display:block;
		text-align:center;
		padding:0 !important;
		margin:0 0 1em 0 !important;
	}
	.woocommerce-MyAccount-navigation ul li {
		display:inline-block;
		margin:0 !important;
	}
	.woocommerce-MyAccount-navigation ul li a {
		margin:.25em !important;
	}
	.woocommerce-account .woocommerce-MyAccount-navigation {
		display:block;
		width:100% !important;
		float:none;
	}
}


@media only screen and (max-width:1100px) {
	.site-title a {
		font-size:3.25em;
	}
	.banner h1 {
		font-size:2.75em;
	}
	.banner h2 {
		font-size:1.5em;
	}
	.woocommerce ul.products li.product, .woocommerce-page ul.products li.product {
		width:calc(32% - 1em) !important;
	}
}


@media only screen and (max-width:750px) {
	#primary {
		width:calc(100% - 2em);
		float:none;
		margin:1em 1em 0;
		border:6px solid #000;
		border-radius:1em 1em 1em 1em;
		overflow:hidden;
	}
	#sidebar {
		color:var(--graylt);
		font-size:1em;
		width:100%;
		float:none;
		padding:1em;
		padding-top:0;
	}
	.site-sidebar section {
		width:98%;
		margin:1%;
		float:none;
	}
	#tattooer-menu h1 {
		margin-top:1em;
	}
	#tattooers li {
		width:25%;
	}
	.small {
		display:inline-block !important;
	}
}


/** <= 600 */
@media screen and (max-width:600px) {
	.woocommerce-MyAccount-navigation ul {
		padding:0 !important;
		margin:0 0 1em 0 !important;
	}
	.woocommerce-MyAccount-navigation ul li {
		display:inline-block;
		width:49%;
		margin:0 !important;
	}
	.woocommerce ul.products li.product, .woocommerce-page ul.products li.product {
		width:calc(49% - 1em) !important;
	}
	h1 {
	font-size:2em;
	line-height:1;
	}
	h2 {
	font-size:1.6em;
	line-height:1.4;
	}
	h3 {
	font-size:1.6em;
	line-height:1;
	}
	h4 {
	font-size:1.4em;
	line-height:1;
	}
	h5 {
	font-size:1.2em;
	line-height:1;
	}
	h6 {
	font-size:1em;
	line-height:1;
	}
	.contact-block-title {
		font-size:1.4em;
	}
	li.woocommerce-MyAccount-navigation-link a {
		margin:.25em !important;
	}
	.gallery-columns-4 .gallery-item, .gallery-columns-5 .gallery-item, .gallery-columns-6 .gallery-item, .gallery-columns-7 .gallery-item, .gallery-columns-8 .gallery-item, .gallery-columns-9 .gallery-item {
		max-width:calc(33.333% - 1em) !important;
		max-height:calc(33.333% - 1em) !important;
		min-width:calc(33.333% - 1em) !important;
		min-height:calc(33.333% - 1em) !important;
		width:calc(33.333% - 1em) !important;
		height:calc(33.333% - 1em) !important;
	}
}


/** <= 550 */
@media screen and (max-width:550px) {
	#tattooers li {
		width:50%;
	}
	.woocommerce ul.products li.product, .woocommerce-page ul.products li.product {
		background:#fff;
		display:inline-block;
		width:calc(100% - 1em) !important;
		float:none !important;
		vertical-align:top;
		text-align:center;
		padding:.5em !important;
		margin:.5em !important;
		border:1px solid var(--primary);
		border-radius:.5em;
	}
	.woocommerce-tabs {
		display:none;
	}
}


/** <= 450 */
@media screen and (max-width:450px) {
	div#site-logo {
		padding:.5em 10%;
	}
	h1.entry-title, h1.woocommerce-products-header__title, h1.product_title.entry-title {
		font-size:2em !important;
	}
	.woocommerce-MyAccount-navigation ul li {
		display:block;
		width:99%;
		margin:0 !important;
	}
	.contact-block-title {
		font-size:1.2em;
	}
	h2.gallery-title {
		font-size:1.35em;
		margin:0 -1em -.8em;
	}
	.post-2 h2.gallery-title {
		margin: 0 -.8em -.8em;
	}
	.gallery-columns-3 .gallery-item, .gallery-columns-4 .gallery-item, .gallery-columns-5 .gallery-item, .gallery-columns-6 .gallery-item, .gallery-columns-7 .gallery-item, .gallery-columns-8 .gallery-item, .gallery-columns-9 .gallery-item {
		max-width:calc(50% - 1em) !important;
  max-height:calc(50% - 1em) !important;
  min-width:calc(50% - 1em) !important;
  min-height:calc(50% - 1em) !important;
  width:calc(50% - 1em) !important;
  height:calc(50% - 1em) !important;
	}
}


/** <= 350 */
@media screen and (max-width:350px) {
	div#site-logo {
		padding:.5em 5%;
	}
	h1.entry-title, h1.woocommerce-products-header__title, h1.product_title.entry-title {
		font-size:2em !important;
	}
	.contact-block-title {
		font-size:1em;
	}
	h2.gallery-title {
		font-size:1.1em;
		margin:0 -1em -.9em;
	}
	.post-2 h2.gallery-title {
		margin: 0 -1em -.9em;
	}
	#guest-artist .contain h2, #shop-info .contain h2 {
		font-size:1.2em;
	}
	.woocommerce ul.products li.product, .woocommerce-page ul.products li.product {
		width:calc(100% - 1em) !important;
	}
}










/* ==========================================================================
   Non-semantic helper classes from HTML5 Boilerplate
   Please define your styles before this section.
   ========================================================================== */

/* For image replacement */
.ir { display:block; border:0; text-indent:-999em; overflow:hidden; background-color:transparent; background-repeat:no-repeat; text-align:left; direction:ltr; *line-height:0; }
.ir br { display:none; }

/* Hide from both screenreaders and browsers:h5bp.com/u */
.hidden { display:none !important; visibility:hidden; }

/* Hide only visually, but have it available for screenreaders:h5bp.com/v */
.visuallyhidden { border:0; clip:rect(0 0 0 0); height:1px; margin:-1px; overflow:hidden; padding:0; position:absolute; width:1px; }

/* Extends the .visuallyhidden class to allow the element to be focusable when navigated to via the keyboard:h5bp.com/p */
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip:auto; height:auto; margin:0; overflow:visible; position:static; width:auto; }

/* Hide visually and from screenreaders, but maintain layout */
.invisible { visibility:hidden; }


/* ==========================================================================
   Print styles from HTML5 Boilerplate
   Inlined to avoid required HTTP connection:h5bp.com/r
   ========================================================================== */

@media print {
  * { background:transparent !important; color:black !important; box-shadow:none !important; text-shadow:none !important; filter:none !important; -ms-filter:none !important; } /* Black prints faster:h5bp.com/s */
  a, a:visited { text-decoration:underline; }
  a[href]:after { content:" (" attr(href) ")"; }
  abbr[title]:after { content:" (" attr(title) ")"; }
  .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content:""; }  /* Don't show links for images, or javascript/internal links */
  pre, blockquote { border:1px solid var(--graymd); page-break-inside:avoid; }
  thead { display:table-header-group; } /* h5bp.com/t */
  tr, img { page-break-inside:avoid; }
  img { max-width:100% !important; }
  @page { margin:0.5cm; }
  p, h2, h3 { orphans:3; widows:3; }
  h2, h3 { page-break-after:avoid; }
}