@charset "UTF-8";

/* General Styles
----------------------------------------------------------------------------------------------------*/

* {
  box-sizing: border-box;
}

html{box-sizing:border-box}*,*:before,*:after{box-sizing:inherit}

body {
	background: #000000 url(images/general/BGSwash.jpg) top left no-repeat;;
	color: #ffffff;
	font-family:"Questrial", Helvetica, Arial, sans-serif;
	font-size: 12px;
	margin: 0;
	padding: 0;
}

body, p, div, span, td, th, ul, ol, li, dl, dt, dd, h1, h2, h3, h4, h5, h6, h7 { 
	font-family: "Questrial", Helvetica, Arial, sans-serif;
}

h1, h2, h3, h4, h5, h6, h7, th {
	font-weight: normal;
	font-style: normal;
}

b { font-weight: bold; }
i { font-style: italic; }
u { text-decoration: underline; }
.left { text-align: left; }
.center { text-align: center; }
.right { text-align: right; }

a:link { color: #ffffff; text-decoration: none; }
a:visited { color: #ffffff; text-decoration: none; }
a:hover { color: #ffffff; text-decoration: underline; }
a:active { color: #ffffff; text-decoration: underline; }

a img {
	border: none;
}

sup, sub {
	font-size: .45em;
}


/* Main Content Areas
----------------------------------------------------------------------------------------------------*/
.content{
	display: -webkit-flex;
	display: flex;
	clear: both;
}

.mainContent {
	display: -webkit-inline-flex;
    display: inline-flex;
	-webkit-flex-wrap: wrap;
    flex-wrap: wrap;
	width: 80%;
}

.categoryContent{
	display: block;
	width: 100%;
	clear: both;
}


/* Global Navigation and Main Menu Nav
----------------------------------------------------------------------------------------------------*/
.mainNav {
	display: block;
	width: 100%;
	clear: both;
}

.mainLogo {
	background: transparent url("images/main/mainBanner.png") no-repeat right top;
	width: 100%;
}

.mainLogo img {
	max-width: 100%;
}

.globalnav {
	display: -webkit-flex;
	display: flex;
	width: 100%;
	-webkit-flex-wrap: nowrap;
	flex-wrap: nowrap;
	white-space: nowrap;
	background: #760d0d;
	align-items: center;
	clear: both;
}

.siteLinks, .mainSiteLinks {
	display: inline-block;
	width: 75%;
	white-space: nowrap;
	font-size: 16px;
	text-align: left;
	padding: 12px 16px 12px 10px;
}

.extraLinks {
	display: block;
	clear: both;
	width: 100%;
	text-align: right;
	font-size: 14px;
	white-space: nowrap;
	padding: 8px 0 10px 20px;
}

.compactMenuButton {
	display: inline-block;
	white-space: nowrap;
	text-align: right;
	vertical-align: middle;
	font-size: 14px;
	padding: 9px 16px 9px 10px;
}

ul.generalnav {
	display: inline-block;
	margin: 0;
	padding: 0 12px 0 0;
	white-space: nowrap;
	vertical-align: middle;
}

ul.generalnav li, .compactMenuButton {
	display: inline-block;
	letter-spacing: .05em;
	vertical-align: middle;
	text-transform: uppercase;
}

ul.generalnav li {
	font-size: 16px;
	list-style: none;
	margin: 0 16px 0 0;
	padding: 0;
}

ul.generalnav li.mailingListLink {
	text-transform: none;
}

.contactInfo, .mainContactInfo {
	display: inline-block;
	width: 25%;
	font-size: 12px;
	letter-spacing: .05em;
	vertical-align: middle;
	text-align: right;
	text-transform: uppercase;
	padding: 12px 24px 9px 12px;
}

.contactInfo a, .mainContactInfo a {
	background: transparent url("images/general/navIconEmail.png") no-repeat left 4px;
	padding: 10px 4px 10px 30px;
}

a.shopLink {
	/*background: transparent url("images/general/navIconShop.png") no-repeat left center;
	padding: 10px 0 10px 34px;*/
}

a.homeLink {
	background: transparent url("images/general/navIconHome.png") no-repeat left center;
	padding: 10px 0 10px 36px;
}

a.compactMenuLink {
	background: transparent url("images/general/navIconMenu.png") no-repeat right 3px;
	margin: 0 10px 0 0;
	padding: 9px 30px 10px 0;
}

a.menuLink {
	background: transparent url("images/general/navIconDropdown.png") no-repeat 0 4px;
	margin: 0 10px 0 0;
	padding: 10px 0 10px 30px;
}

/*a.navDropdown {
	background: transparent url("images/general/navIconDropdown.png") no-repeat left center;
	padding: 1px 0 1px 30px;
}*/

ul.generalnav li a:link, .contactInfo a:link, .compactMenuButton a:link { color: #ffffff; text-decoration: none; }
ul.generalnav li a:visited, .contactInfo a:visited, .compactMenuButton a:visited { color: #ffffff; text-decoration: none; }
ul.generalnav li a:hover, .contactInfo a:hover, .compactMenuButton a:hover { color: #f9d075; text-decoration: none; }
ul.generalnav li a:active, .contactInfo a:active, .compactMenuButton a:active { color: #e01616; text-decoration: none; }


/* Compact Menu Navigation
----------------------------------------------------------------------------------------------------*/
.compactMenu {
	width: 100%;
	display: visible;
}

.compactMenuHidden {
	display: none;
}

.compactMenu ul {
	width: 100%;
	margin: 0;
	padding: 0;
}

.compactMenu ul li {
	list-style: none;
	display: block;
	width: 100%;
	margin: 0;
	padding: 10px 16px;
}

ul.sectionLinks li, .sectionLinks ul li {
	background-color: #ffffff;
	border-bottom: 1px solid #cdc2c2;
	color: #000000;
	font-size: 16px;
}

ul.extraCompactLinks li, ul.externalCompactLinks li {
	background-color: #cdc2c2;
	border-bottom: 1px solid #ffffff;
	color: #000000;
	font-size: 16px;
}

.compactMenu li.compactMenuSubhead {
	background-color: #564747;
	color: #ffffff;
	padding: 6px 16px 4px;
}

.compactMenu li.compactMenuSubhead h2 {
	font-size: 12px;
	text-transform: uppercase;
	margin: 0;
	padding: 0;
}

.compactMenu ul li:hover {
	background-color: #ae1414;
}

.compactMenu ul li a:link, .compactMenu ul li a:visited {
	color: #000000;
}

.compactMenu ul li a:hover, .compactMenu ul li a:active {
	color: #ffffff;
	text-decoration: none;
}


/* Navigation customization for varied screen sizes
----------------------------------------------------------------------------------------------------*/
@media only screen and (max-width: 1240px) {
	/*for medium screens*/
	
}

@media only screen and (max-width: 800px) {
	/*for smaller screens*/
	.mainLogo {
		background: #000000;
	}

	.siteLinks {
		width: 35%;
	}
	
	.mainSiteLinks {
		display: none;
	}
	
	.compactMenuButton {
		width: 65%;
	}
	
	.mainContactInfo {
		width: 35%;
		text-align: left;
	}
	
	ul.generalnav li {
		margin: 0 12px 0 0;
	}
	
	.optionalLink, .optionalLinkText {
		display: none;
	}
	
	ul li.optionalLinkListing {
		margin: 0;
		padding: 0;
	}
	
	ul.generalnav li a:hover, .compactMenuButton a:hover { color: #ffffff; text-decoration: none; }
	ul.generalnav li a:active, .compactMenuButton a:active { color: #ffffff; text-decoration: none; }
}

@media only screen and (min-width: 800px) {
	/*for larger screens*/
	.QGicon, .compactMenuButton {
		display: none;
	}
	
	.extraCompactLinks, .compactMenu li.compactMenuSubhead {
		display: none;
	}
	
	.contactInfo {
		order: 2;
	}
}

@media only screen and (max-width: 700px) {
	/*for very small screens*/
	.extraLinks {
		display: none;
	}
}



/* Footer and copyright
----------------------------------------------------------------------------------------------------*/

#footer {
	text-align: center;
	margin: 10px 0 20px 20px;
	padding: 16px 0;
	clear: both;
}

#footer ul {
	display: inline-block;
	margin: 0 0 30px 0;
	padding: 0;
}

#footer ul li {
	list-style: none;
	display: inline-block;
	font-size: 12px;
	margin: 0 10px 0 0;
	padding: 0 0 12px;
	text-transform: uppercase;
}

#footer ul li a {
	padding: 0 0 0 16px;
}

.socialMediaIcon {
	width: 30px;
	height: 30px;
}

.copyright {
	color: #cdc2c2;
	font-size: 12px;
	clear: both;
}

#footer ul li a:link { color: #ffffff; text-decoration: none; }
#footer ul li a:visited { color: #ffffff; text-decoration: none; }
#footer ul li a:hover { color: #f9d075; text-decoration: none; }
#footer ul li a:active { color: #e01616; text-decoration: none; }


/* Extra content area on main menu
----------------------------------------------------------------------------------------------------*/
.extraContent {
	background: #000000;
	color: #ffffff;
	border-right: 1px solid #796969;
	width: 20%;
}

.compactExtraContent {
	width: 100%;
	clear: both;
	background: #000000;
	color: #ffffff;
	border-top: 2px solid #760d0d;
	padding: 12px 0;
}

.compactExtraPromos {
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: nowrap;
	flex-wrap: nowrap;
	white-space: nowrap;
	width: 100%;
	clear: both;
}

.promoBox {
	margin: 0 0 20px;
	width: 100%;
}

.compactPromoBox {
	display: inline-block;
	width: 50%;
	padding: 10px;
}

.compactExtrasFollow {
	display: block;
	width: 100%;
	clear: both;
	text-align: center;
	padding: 20px 12px;
}

.extraContentMailingList {
	padding: 8px;
}

.extraContentPatreon {
	padding: 10px 0 20px;
}

ul.extraContentLinks {
	display: block;
	width: 100%;
	margin: 20px 0;
	padding: 0;
	text-align: center;
}

ul.extraContentLinks li {
	list-style: none;
	display: inline-block;
	font-size: 14px;
	margin: 0;
	padding: 8px;
	text-transform: uppercase;
}


@media only screen and (max-width: 900px) {
	/*for smaller screens*/
	.extraContent {
		display: none;
	}
	
	.mainContent {
		display: -webkit-flex;
		display: flex;
		width: 100%;
	}
}

@media only screen and (min-width: 900px) {
	/*for larger screens*/
	.compactExtraContent {
		display: none;
	}
}


/* Main Menu Sections and Category Menu Sections
----------------------------------------------------------------------------------------------------*/
.mainSections {
	display: -webkit-inline-flex;
    display: inline-flex;
	padding: 0 0 24px;
}

.categorySections {
	display: -webkit-flex;
    display: flex;
	padding: 0 0 24px;
	clear: both;
}

.categoryTitle {
	display: block;
	width: 100%;
	border-bottom: 1px solid #796969;
	padding: 12px 24px 10px;
	margin: 0 0 12px;
	clear: both;
}

.categoryTitle h1 {
	font-size: 26px;
	padding: 0;
	margin: 0;
}

.mainSections, .categorySections {
	width: 100%;
	-webkit-flex-wrap: wrap;
    flex-wrap: wrap;
	-webkit-justify-content: center;
    justify-content: center;
}

.mainSection, .categorySection {
	display: inline-block;
	padding: 0 12px 24px;
	justify-content: center;
}

.mainSectionContent, .categorySectionContent {
	position: relative;
	width: 100%;
}

.mainSectionContent img, .categorySectionContent img {
	width: 100%;
	height: auto;
}

.mainSectionContent h1, .categorySectionContent h1 {
	width: 100%;
	background: #ae1414;
	font-size: 22px;
	margin: 0;
	padding: 10px 14px;
	text-transform: uppercase;
}

.mainSectionContent h2, .categorySectionContent h2 {
	width: 100%;
	background: #261919;
	border-left: 1px solid #ae1414;
	border-right: 1px solid #ae1414;
	border-bottom: 1px solid #ae1414;
	font-size: 14px;
	margin: 0;
	padding: 10px 14px;
}

.mainSectionContent h2.transparentCaption, .categorySectionContent h2.transparentCaption {
	position: absolute;
	top: 10%;
	left: 0;
	width: 100%;
	background-color: rgba(0, 0, 0, 0.7);
	opacity: 60%;
	font-size: 18px;
	margin: 0;
	padding: 10px 18px;
	z-index: 1;
}

.categorySectionContent h1 {
	background: #ae1414 url("images/general/navGoCategory.png") no-repeat right center;
}

@media only screen and (max-width: 800px) {
	/*for smaller screens*/
	.mainSection, .categorySection {
		padding: 16px 12px;
		justify-content: center;
		width: 100%;
		height: auto;
	}
	
	.mainSection h1, .categorySection h1 {
		font-size: 20px;
		padding: 8px 14px;
	}
	
	.categoryTitle {
		margin: 0;
	}
}

@media only screen and (min-width: 800px) and (max-width: 1200px) {
	/*for medium screens*/
	.mainSection, .categorySection {
		width: 50%;
		height: auto;
	}
	
	.mainSection h1, .categorySection h1 {
		font-size: 18px;
		padding: 10px 14px;
	}
}

@media only screen and (min-width: 1200px) {
	/*for larger screens*/
	.mainSection, .categorySection {
		width: 33%;
		height: auto;
	}
	
	.mainSection h1, .categorySection h1 {
		font-size: 16px;
		padding: 10px 14px;
	}
}

.mainSection a:link, .mainSection a:visited, .mainSection a:hover, .mainSection a:active { text-decoration: none; }
.categorySection a:link, .categorySection a:visited, .categorySection a:hover, .categorySection a:active { text-decoration: none; }

.mainSection a h1:link, .categorySection a h1:link { color: #ffffff }
.mainSection a h1:visited, .categorySection a h1:visited { color: #ffffff }
.mainSection a h1:hover, .categorySection a h1:hover { color: #f9d075 }
.mainSection a h1:active, .categorySection a h1:active { color: #e01616 }



/* Portfolio Collections
----------------------------------------------------------------------------------------------------*/

/* Defaults are optimized for small screens */

.collectionContent {
	display: block;
	clear: both;
	width: 100%;
	border-bottom: 2px solid #3e3030;
}

.showcase, .showcaseFull {
	width: 100%;
}

.image-area {
	width: 100%;
	text-align: center;
}

/* Featured image or images */
.featured_image {
	display: inline-block;
	padding: 10px 20px;
	text-align: center;
	width: auto;
}

.featured_image img {
	width: 100%;
	height: auto;
}


/* Group of related images */
/* imagegroups are flex columns */
.imagegroup {
	float: left;
	width: 100%;
	padding: 0 0 24px;
}

.imagegroup_image {
	padding: 0 12px 24px;
	justify-content: center;
}

.imagegroup_image img {
	width: 100%;
	height: auto;
}

/* Captions */
.collection_caption, .imagegroup_caption {
	background: #e3e2e2;
	color: #000000;
}

.collection_caption {
	border-top: 2px solid #3e3030;
	font-size: 15px;
	line-height: 1.5em;
	padding: 12px 24px;
	text-align: left;
}

.imagegroup_caption {
	border-bottom: 2px solid #3e3030;
	margin: 0 0 20px 0;
	font-size: 15px;
	padding: 14px 24px;
	text-align: left;
}

.collection_caption p, .imagegroup_caption p {
	line-height: 1.5em;
	padding: 0;
	margin: 0;
}

.collection_caption h2 {
	color: #540707;
	font-size: 18px;
	padding: 0;
	margin: 0 0 .25em 0;
}

.imagegroup_caption h2 {
	color: #540707;
	font-size: 20px;
	padding: 0;
	margin: 0 0 .25em 0;
}

.exampleLink {
	text-decoration: none;
}

.exampleLink:link, .exampleLink:visited {
	color: #e01616;
}

/* Collection nav and header */
.collectionHead, .collectionHeadSublevel {
	display: block;
	width: 100%;
	border-bottom: 1px solid #796969;
	text-align: center;
	padding: 12px 24px 10px;
	clear: both;
}

.collectionHead {
	margin: 0 0 16px;
}

.collectionHeadSublevel {
	background: transparent url("images/general/navDoubleBack.png") no-repeat left 10px;
	margin: 0;
}

.collectionHead h1, .collectionHeadSublevel h1 {
	font-size: 16px;
	text-transform: uppercase;
	padding: 0;
	margin: 0;
}

.collection_nav {
	display: -webkit-flex;
	display: flex;
	width: 100%;
	-webkit-flex-wrap: nowrap;
	flex-wrap: nowrap;
	white-space: nowrap;
	-webkit-justify-content: center;
	justify-content: center;
	align-items: center;
	background: #540707;
	padding: 6px 12px;
	margin: 0 0 12px;
	text-transform: uppercase;
	clear: both;
}

.navTitle {
	display: inline-block;
	width: 80%;
	flex: 10 0 80%;
	text-align: center;
}

.navTitle h1 {
	display: inline;
	font-size: 14px;
	margin: 0;
	padding: 0;
	vertical-align: middle;
}

.navPrevious, .navNext {
	display: inline-block;
	width: 10%;
	flex: 0 0 10%;
	vertical-align: middle;
	padding: 1px 0 0;
}

.navPrevious {
	text-align: left;
}

.navNext {
	text-align: right;
}

.navPrevious img, .navNext img {
	vertical-align: middle;
}

.thumbMenuLink {
	display: inline-block;
	padding: 0 12px 0 0;
	vertical-align: middle;
}

.collection_nav a:link, .collection_nav a:visited { color: #ffffff; text-decoration: none; }
.collection_nav a:hover { color: #f9d075; text-decoration: none; }
.collection_nav a:active { color: #e01616; text-decoration: none; }

.thumbnails {
	background: #261919;
	padding: 10px;
	width: 100%;
}

.thumbnails p {
	font-size: 14px;
	line-height: 1.5em;
	margin: 0 12px 12px;
	padding: 0;
}

.thumbnails ul {
	margin: 0;
	padding: 0;
	width: 100%;
	text-align: center;
}

.thumbnails ul li {
	display: inline-block;
	list-style: none;
	margin: 0;
	padding: 4px;
	width: 108px;
	height: 108px;
}


.thumbnails ul li img {
	border: 1px solid #000000;
}

.thumbnails ul li img:hover {
	border: 1px solid #ffffff;
}

@media only screen and (min-width: 768px) {
  /* For medium screens */
  
  .featured_image img {
		width: auto;
		max-height: 100%;
	}
}

@media only screen and (min-width: 800px) {
	/* for larger screens */
	
	.collectionContent {
		display: -webkit-flex;
		display: flex;
		-webkit-flex-direction: row-reverse;
		flex-direction: row-reverse;
	}

	.showcase {
		display: inline-block;
		border-left: 2px solid #3e3030;
		width: 75%;
	}
	
	.imagegroup_caption p {
		max-width: 75%;
	}
	
	.featured_image img {
		max-width: 100%;
		height: auto;
	}
	
	.thumbMenuLink {
		display: none;
	}
	
	.thumbnails {
		display: -webkit-flex;
		display: flex;
		-webkit-flex-wrap: wrap;
		flex-wrap: wrap;
		-webkit-justify-content: center;
		justify-content: center;
		padding: 24px 10px 10px 0;
		width: 25%;
	}
}

@media only screen and (min-width: 1000px) and (max-width: 1200px) {
	/*for medium-large screens*/
	
	.imagegroup {
		width: 100%;
		height: auto;
	}
}

@media only screen and (min-width: 1200px) {
	/*for largest screens*/
	
	.imagegroup {
		width: 50%;
		height: auto;
	}
}


/* Mailing List Form
----------------------------------------------------------------------------------------------------*/
.mailingListForm {
	background:#ffffff;
	color: #000000;
	padding: 16px 20px;
	clear: both;
}


/* About Page
----------------------------------------------------------------------------------------------------*/

.aboutContent {
	width: 100%;
	background: #ffffff;
	color: #000000;
}

.aboutArtist {
	width: 100%;
	padding: 20px 28px 20px 28px;
}

.aboutArtist h1 {
	font-size: 30px;
	margin: 14px 0 16px;
	padding: 0;
}

.aboutArtist p {
	font-size: 16px;
	line-height: 130%;
	max-width: 900px;
}

.aboutExtra {
	width: 100%;
	background: #e3e1e1;
	padding: 20px 28px 20px 28px;
}

.aboutExtra h2 {
	font-size: 22px;
	margin: 12px 0 14px;
	padding: 0;
}

.aboutExtra p {
	font-size: 14px;
	line-height: 130%;
	max-width: 900px;
}

.aboutMailingList {
	background: #540707;
}

.aboutContent a:link { color: #ae1414; text-decoration: none; }
.aboutContent a:visited { color: #ae1414; text-decoration: none; }
.aboutContent a:hover { color: #f9d075; text-decoration: none; }
.aboutContent a:active { color: #e01616; text-decoration: none; }