@charset "UTF-8";
/* CSS Document */

/*reset - based on meyers reset sheet*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {margin: 0;padding: 0;border: 0;outline: 0;font-weight: inherit;font-style: inherit;font-size: 100%;font-family: inherit;vertical-align: baseline;}
ol, ul {list-style: none;}strong{font-weight:bold;}em{font-style:italic;}

body:before {/* thanks to Maleika (Kohoutec)*/
/*height:100%;
float:left;
width:0;
margin-top:-32767px;/* thank you Erik J - negate effect of float*/
}

* {margin:0; padding:0;}
html, body{height:100%;}
html{overflow-y:scroll;}/* Keeps scroll bar area active to stop the pages from shifting left to right */
.push{height:50px; bottom:0;}

/* COMMON ITEMS */

html body{margin:0px!important; padding:0px; }

#wrapper{width:100%; max-width:1245px; min-height:100%; margin:0px auto; padding:15px auto -55px; }
#page{min-height:450px; padding:0px 0px 55px 0px;}

#footer{width:915px; height:25px; clear:both; margin:-55px auto 0px auto; position:relative; }
#footer p{font-family:Arial, Helvetica, sans-serif; font-size:11px; color:#FFFFFF; text-align:right; text-transform:uppercase; margin:0px; padding:10px 0px 0px 0px; border-top:solid 1px #a63333;}

/* COMMON TYPOGRAPHY */

/*.nav{padding-bottom:10px;text-align:center;clear:both; font-family:Arial, Helvetica, sans-serif; font-size:11px;} */

h2 {font-family:Arial, Helvetica, sans-serif; font-size:18px; color:#FFFFFF; margin:0px; padding:0px; font-style:normal; font-weight:normal;}

h4 {font-family:Arial, Helvetica, sans-serif; font-size:18px; color:#FFFFFF; margin:0px; padding:0px; font-style:normal; font-weight:normal; display:block; padding:10px; background-color:#7b6e66; border-top:1px solid #64564e; margin-bottom:10px; width:inherit;}

p {font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#FFFFFF; margin-bottom:10px;}
a {font-family:Arial, Helvetica, sans-serif; color:#FFFFFF; text-decoration:underline;}
a:visted {color:#FFFFFF; text-decoration:underline;}
a:hover {color:#f0eb63; text-decoration:underline;}

p.breadCrumb {font-family:Arial, Helvetica, sans-serif; font-size:14px; color:#FFFFFF;}
p.breadCrumb a {font-family:Arial, Helvetica, sans-serif; color:#FFFFFF; text-decoration:underline;}


#topSpacer{height:15px; display:block; width:100%; position:relative; margin:0;}

/*HOMEPAGE LAYOUT */


/* Navigation */
#mainNavigation{height:25px; margin:24px 27px 0px 0px; position:relative; z-index:10;/*width:450px;*/width:66.66%;}
#mainNavigation {margin-right:0;}/* new style  */


#mainNavigation ul{list-style:none; padding:0px; margin:0px;}
#mainNavigation ul li{float:left; padding:0px 24px 0px 24px; display:block;}
#mainNavigation ul li:nth-child(3) {}
#mainNavigation ul li:last-child {padding-right:0;}

#mainNavigation ul li a{font-family:gill-sans-nova, sans-serif, Arial, Helvetica, sans-serif; font-size:17px; line-height:21px; text-transform:uppercase; text-decoration:none; outline:none; color:#a08f81;}
#mainNavigation ul li a:hover{border-bottom:2px solid #a63333;}

#mainNavigation a.youAreHere{}

#mainNavigation ul {display:flex; justify-content:flex-end}/* new style  */
#mainNavigation ul li {float:none;}/* new style  */

#mobile-nav {display:none;}
#nav-trigger {display:none;}

/* END Navigation */

#logoContainer{width:33.33%;}
#logoContainer p{font-family:Arial, Helvetica, sans-serif; font-size:14px; color:#b5aca5; text-transform:uppercase; display:block; margin-top:-10px;}

#mainImageArea{width:950px; height:634px; background:url(../../../images-main/homepage-main-image.jpg) top center; padding:0; margin-bottom:30px;}
#mainImageArea p{display:block; font-family:Arial, Helvetica, sans-serif; font-size:14px; color:#FFFFFF; text-transform:uppercase; margin:0px;}
#mainImageArea span{font-family:Arial, Helvetica, sans-serif; font-size:14px; color:#d1c9bf;}
#mainImageArea {width:1200px;}/*  new style  */


#nameList{width:228px; height:100%; margin-left:35px; background-image:url(../../../images-main/name-list-bg.png); background-repeat:repeat;}
#nameList ul{list-style:none; width:100%; float:left; display:block; padding:15px 0px 0px 0px;}
#namelist ul li{}
#nameList ul li a{font-family:Arial, Helvetica, sans-serif; font-size:11px; color:#d1c9bf; text-transform:uppercase; display:block; padding:0px 0px 3.35% 20px; text-decoration:none; line-height:11px}
#nameList ul li a:hover{color:#f0eb63;}

#topContentContainer{padding-bottom:40px; padding-top:40px; display:flex}


/* ARTIST PAGE */

#artistList{margin-left:35px; margin-top:20px; margin-bottom:30px;}

#artistList ul{list-style:none; display:block;}

#artistList ul li{float:left; display:inline;padding:10px;}
#artistList ul li a {display:block}
#artistList ul li a.artistName{font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#e9e0d5; text-transform:uppercase; text-decoration:none;}
#artistList ul li a.artistName:hover{color:#f0eb63;}

#artistList ul li a span {border:none!important;}
#artistList ul li a.artistName {background-color:transparent; color:#a63333;}

#artistList ul li a img {width:150px; height:90px}


.artistName{display:block; padding:3px; text-align:center;}

.largeHeader{font-size:32px; line-height:38px; font-family:gill-sans-nova, sans-serif; color:#a08f81; display:block; padding-bottom:10px; border-bottom:1px solid #a63333; font-weight:normal; letter-spacing:normal;}


/* GALLERY PAGE */

#artistNameHeader{border-bottom:1px solid #a63333; margin:7px 35px 7px 35px; padding-bottom:25px;}
#artistNameHeader p{text-align:left; display:block; font-family:gill-sans-nova, sans-serif; font-size:18px; color:#a08f81; font-style:normal; font-weight:normal; margin:0px; padding-bottom:10px;}

#artistNameHeader p a{color:#a08f81; text-decoration:none; font-family:gill-sans-nova, sans-serif; }
#artistNameHeader #artistNameHeaderLinks a {color:#a08f81!important}

#artistNameHeader a:hover{color:#a08f81; text-decoration:none;}
#artistNameHeader a:visited{color:#a08f81; text-decoration:none;}

#artistNameHeaderLinks{float:right; width:600px;}
#artistNameHeaderLinks ul{list-style:none; display:block; margin:0; padding:0;}
#artistNameHeaderLinks li{float:right; display:block; margin:0px 3px 0px 3px; padding:0; font-family:Arial, Helvetica, sans-serif; font-size:14px; color:#FFFFFF; width:auto;}
#artistNameHeaderLinks li.divider{color:#FFFFFF; margin:0px; padding:0px;}

#artistSubPageLinks{padding-top:7px; padding-right:3px;}
#artistSubPageLinks p{display:block; text-decoration:none; text-align:right;}
#artistSubPageLinks a{font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#FFFFFF; margin:0px; padding:0px; text-decoration:none;}


#main_image_wrapper{margin:25px 0px 0px 0px; overflow:auto;}
#main_image{margin:0px; padding-bottom:35px; width:100%; overflow:hidden; float:left; background-color:transparent;}
#main_image img{margin-bottom:1px;}

.galleria-container {background-color: transparent!important;}
.galleria-image-nav div {}
.galleria-image-nav div{background-image:url(https://www.mercurygallery.com/wp-content/uploads/2022/08/classic-map.png)!important;opacity:1; transition:opacity .3s;}
.galleria-image-nav div:hover {opacity:.5!important;}

.galleria-info-text .galleria-info-description {color:#000;}

.galleria-counter{opacity:1!important; color:#000;}

#artistGalleryThumbs{display:block; width:75px; /*background-color:#877c73;*/}

#nextPrevContainer{text-align:center; width:750px; margin:0px 0px 10px 0px;}

#nextPrevContainer p a{font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#FFFFFF; text-transform:uppercase;}
#nextPrevContainer p a:link{font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#FFFFFF; text-transform:uppercase;}
#nextPrevContainer p a:visited{font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#FFFFFF; text-transform:uppercase;}
#nextPrevContainer p a:hover{font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#f0eb63; text-transform:uppercase;}

#nextPrevContainer p {font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#FFFFFF; text-transform:uppercase;}

#scroller{width:90px; height:500px; float:left; margin-left:20px;}


/*  #scroller{float:right; width:95px; height:500px;} */

/* INFORMATION PAGE */

#contactInfoContainer{float:left; width:400px;margin-left:35px;}
#directionsContainer{float:right; width:570px; margin-right:27px;}

/* ABOUT PAGE */

#aboutInfoContainer{margin:0 auto; width:800px; min-height:500px;}
#imageContainer{float:left; padding-left:35px;}

#aboutInfoContainer {width:85%;}
#aboutInfoContainer img {width:100%; height:auto;}

/* BIO PAGE */

#bioContainer{width:700px; margin:20px auto;}

/* Current Show */

#contentContainer{padding-left:35px; padding-right:35px;}
.show-banner {height:auto;}

	/* Online Show Section */
	
	p#onlineShow{
		font-size:16px;
		font-weight:normal;
	}

/*  NEW STYLES for WIDER DESKTOP XP  */
#mainImageArea, #footer {width:1200px;}
#mainNavigation {margin-right:0; }
#mainNavigation ul li a {}
#logoContainer {}
#footer {/*box-sizing:border-box;*/}
#footer p {color:#a08f81;}
p {font-size:15px; line-height:20px; margin-bottom:0;}
h2 {font-size:20px; line-height:25px;}

#artistList {margin-left:2%; margin-right:2%;}
#artistList ul {/*display:flex; flex-wrap:wrap;}*/
#artistList ul li {padding:10px 0; margin:0 1.8%;}
#artistList ul li a {display:block}

#gallerytitle {margin-left:0; margin-right:0;  width:100%; box-sizing:border-box;}

#contentContainer {padding-left:4%; padding-right:4%;}

#mainImageArea {height:709px; background-repeat:no-repeat; background-size:cover;}


/* "New" Page */

#newWork{width:680px; margin:0 auto;}

#newWork ul{list-style:none; padding:0px; margin:0px; width:100%}
#newWork ul li{float:left; display:block; margin:0px 15px 15px 0px; padding:0px; text-align:center;}

#newWork ul li p{font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#FFFFFF; text-align:center; display:block; padding:10px 0px 0xp 0px; margin:0px;}

/* For Videos */

.textobject {display:block; width:50%; margin:20px 25%; text-align:center;}


/*    ====    =====================    ====    */
/*    ====    RESPONSIVE STARS HERE    ====    */
/*    ====    =====================    ====    */


/* TABLETS  */
@media only screen and (min-device-width : 768px) and (max-device-width : 1180px)  {

	#topSpacer {display:none; height:0;}

	html, body, #wrapper, #page, #footer {width:100%; max-width:none; box-sizing:border-box;}

	#topContentContainer {display:flex; justify-content:space-between;}

	#mainNavigation, #logoContainer {float:none;}
	#logoContainer {padding:0;}
	#mainNavigation {margin-right:0;}
	#mainNavigation ul {display:flex; justify-content: flex-end;}
	#mainNavigation ul li {padding:0;}
	#mainNavigation ul li a {padding:0 15px;}

	#page {padding-left:4%; padding-right:4%;}
	#page #main_image {float:none;}

	#page #mainImageArea {width:100%;}

	/* Artists */
	#gallerytitle {margin:50px auto 10px;}

	#artistList {margin:20px auto 30px;}
	#artistList ul li {margin:0 2.8%;}



	/* albums */
	#artistNameHeader, #artistNameHeaderLinks {width:100%;}
	#artistNameHeader {margin:7px 0;}

	/* About */
	#aboutInfoContainer p, #contentContainer p, #directionsContainer p a {font-size:14px; line-height:17px; margin-bottom:0;}

	/* Contact */
	#contentContainer.contact-content {padding-left:0;}


	#footer {padding:10px 4%; margin-top:0; position:static; height:auto;}
	#footer p {text-align:left; display:block; height:auto; float:none; position:staic; color:#a08f81; }

}

/*  TABLET —— PORTRAIT  */
@media only screen and (min-device-width : 768px) and (max-device-width : 1180px) and (orientation:portrait){

	/*  show off canvas navigation  */
	#nav-trigger{display:block; position:absolute; top:55px; right:50px; background-image:url(../../../images-main/ui-hamburger.png); color:transparent; width:30px; height:30px; background-repeat: no-repeat; background-position:center;}

	#mobile-nav {display:block; top:0; right:-70%; position:fixed; background-color:rgba(0,0,0,.8); height:100%; padding-left:25px; padding-right:45px; z-index:10; padding-top:30px; transition:right .5s;}
	#mobile-nav.open {right:0;}

	#mobile-nav #close {font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; color:#fff; text-align: right; font-size:19px; }

	#mobile-nav ul {position:relative; top:50px;}
	#mobile-nav ul li {padding-bottom:10px;}
	#mobile-nav ul li a{text-decoration:none; font-size:14px; text-transform:uppercase;}

	/*  hide main nav in portrait*/
	#mainNavigation {display:none;}

	#mainNavigation {margin-left:45px;}

	#gallerytitle {display:flex; width:auto;} 
	#gallerytitle .largeHeader { width:100%; float:none; display:block;}

	#page #artistList {width:100%;}
	#page #artistList ul {display:flex; flex-wrap:wrap;}
	#page #artistList ul li {float:none; padding:0 0 10px 0; margin:0 5.5% 0 0;}
	#page #artistList ul li:nth-child(4n+4) {margin:0 0 0 0;}
	#page #artistList ul li img {object-fit:cover;}

	#mainImageArea {width:100%;}
	#contentContainer .show-banner {width:100%;}

	#aboutInfoContainer {width:100%;}
	#aboutInfoContainer img {width:100%;}

	#directionsContainer {float:none; padding-bottom:30px;}
	#contentContainer {padding-left: 0; padding-right:0;}

}

/*  PHONES  */
@media only screen and (min-device-width : 320px) and (max-device-width : 896px) {

	#topContentContainer {position:relative; padding-top:10px;}

	#nav-trigger{display:block; position:absolute; top:20px; right:0; background-image:url(../../../images-main/ui-hamburger.png); color:transparent; width:30px; height:30px; background-repeat: no-repeat; background-position:center;}

	#mobile-nav {display:block; top:0; right:-70%; position:fixed; background-color:rgba(0,0,0,.8); height:100%; padding-left:25px; padding-right:45px; z-index:10; padding-top:30px; transition:right .5s;}
	#mobile-nav.open {right:0;}

	#mobile-nav #close {font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; color:#fff; text-align: right; font-size:19px; }

	#mobile-nav ul {position:relative; top:50px;}
	#mobile-nav ul li {padding-bottom:10px;}
	#mobile-nav ul li a{text-decoration:none; font-size:14px; text-transform:uppercase;}

	#logoContainer {width:80%;}
	#logoContainer img {width:100%;}

	/* Homepage */
	#mainImageArea {width:100%; background-size:100% auto; background-repeat:no-repeat; height:auto;}
	#nameList {width:100%; margin:0; padding-top:230px; background-image:none; height:auto;}
	#nameList ul {background-image:url(http://themercurygallery.com/images-main/name-list-bg.png); column-count:2; padding:20px 10px; box-sizing:border-box;}
	#nameList ul li {padding:0; margin-bottom:10px;}
	#nameList ul li a{padding:0 0 0 0; font-size:13px; line-height:13px;}

	#mainImageArea #opening-announcement {height:auto; width:100%;}

	/* Artists page */
	#topSpacer {display:none; height:0;}

	#wrapper, #page, #gallerytitle, #footer, #mainNavigation {width:100%; }
	.largeHeader{width:100%;}

	#page {padding-left:4%; padding-right:4%; box-sizing: border-box;}

	#mainNavigation {display:none;}
	#mainNavigation {float:none; position:static; margin:0; padding-top:30px;}
	#mainNavigation ul {display:flex; justify-content: space-between; }
	#mainNavigation ul li {padding:0;}

	#logoContainer{padding:0;}

	#gallerytitle, #artistList {margin-left:0;}

	#artistList ul {display:flex; flex-wrap:wrap; justify-content:space-between;}
	#artistList ul li {float:none; width:44%;}
	#artistList ul li:nth-child(odd) {padding-left:0;}
	#artistList ul li:nth-child(even) {padding-right:0;}
	#artistList ul li img {width:100%; object-fit:cover;}

	#artistNameHeader {margin:7px 0;}

	/* album pages */
	#main_image {padding-bottom:45px;}
	#main_image .galleria-container {width:100% !important;}

	.galleria-carousel .galleria-thumbnails-list {margin-left: 0; margin-right: 0}

	#main_image .galleria-container .galleria-image .galleria-image {width:100%!important;}

	.galleria-image-nav {top:250px!important; box-sizing:border-box; height:100px;}
	.galleria-image-nav-left {left:5%!important; left:0 !important;}
	.galleria-image-nav-right {right:5%!important; right:0!important;}

	.galleria-info-text {padding:0 10px; box-sizing:border-box;}
	.galleria-info-description {border:none; margin-top:25px;}

	.galleria-container {display:flex; flex-direction:column;}
	.galleria-thumbnails-container {position: static; padding-bottom:30px;}
	.galleria-stage {position: static; height:500px; width:100%; order:1;}
	.galleria-stage .galleria-images {}
	.galleria-stage .galleria-image img {width:80%;}
	.galleria-info {position: relative; order:2; top:40px!important;}

	.galleria-stage .galleria-images .galleria-image {}
	

	/* Current Show */
	#contentContainer .show-banner {width:100%; height:auto;}

	/* About */
	h2 {font-size:23px; line-height:28px;}
	#aboutInfoContainer {width:100%;}
	#aboutInfoContainer img{width:100%; height:auto;}
	#aboutInfoContainer p, #contentContainer p, #directionsContainer p a {font-size:16px; line-height:21px; margin-bottom:0;}
	#contentContainer p {padding-bottom:10px;}


	/* Contact */
	#directionsContainer {float:none; width:100%; padding-bottom:30px;}
	#directionsContainer iframe {width:100%;}
	#directionsContainer #aboutInfoContainer p:contains(' ') {display:none;}
	#contentContainer {float:none; width:100%; padding:0;}

	/* footer */
	#footer {box-sizing:border-box; height:auto; margin-top:0; padding: 0 4% }
	#footer p {text-align: left; padding-bottom:50px; padding-top:30px; border-top:none;}
	#footer p .address, #footer p .phone, #footer p .dir {display:block; font-size:14px; line-height:17px; padding-bottom:2px;}
	#footer p .pipe {display:none;}

}