/* ======================================== FONTS 
/* oswald-300 - latin */
@font-face {
  font-family: 'Oswald';
  font-style: normal;
  font-weight: 300;
  src: url('../fonts/oswald-v31-latin-300.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/oswald-v31-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/oswald-v31-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/oswald-v31-latin-300.woff') format('woff'), /* Modern Browsers */
       url('../fonts/oswald-v31-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/oswald-v31-latin-300.svg#Oswald') format('svg'); /* Legacy iOS */
}

/* oswald-regular - latin */
@font-face {
  font-family: 'Oswald';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/oswald-v31-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/oswald-v31-latin-regular.eot?#iefix') format('embedded-opentype'), 	/* IE6-IE8 */
       url('../fonts/oswald-v31-latin-regular.woff2') format('woff2'), 						/* Very Modern Browsers */
       url('../fonts/oswald-v31-latin-regular.woff') format('woff'), 						/* Modern Browsers */
       url('../fonts/oswald-v31-latin-regular.ttf') format('truetype'), 					/* Safari, Android, iOS */
       url('../fonts/oswald-v31-latin-regular.svg#Oswald') format('svg'); 					/* Legacy iOS */
}




/*
    10px = 0.625rem
    12px = 0.75rem
    14px = 0.875rem
    16px = 1rem (base)
    18px = 1.125rem
    20px = 1.25rem
    24px = 1.5rem
    30px = 1.875rem
    32px = 2rem

*/



/* views */

#center.detail #exInfo,
#center.zoom #exInfo,
#center.grid #exInfo {
	display: none;
}




#center.overview #images #mainImageAnchor { width: 100%; }
#center.overview #images ul.thumbs,
#center.detail #images ul.thumbs,
#center.zoom #images ul.thumbs
{ 
/*	display: none; */
	visibility: hidden;
	height: 0;					/* required for existing lazy loading */
}

#center.detail #images #mainImageAnchor { 
	width: 50%;
	margin-left: 2rem;
	float: right;
}
#center.zoom #images { 
/*	width: 100%;*/
}
/*#center.grid #images #mainImage { width: 40%; }*/
#center.grid #images #mainImageAnchor { display: none; }


#images #mediaSummary {
	display: none;
}
#center.detail #images #mediaSummary {
	display: block;
	width: 45%;
	margin-top: 1rem;
}







/* ======================================== LINKS */
a {
	text-decoration: none;
	color: #000;
	cursor: pointer;
}

body.mce-content-body a,
.info a,
.content a {
	text-decoration: underline;
}

.info #pastExhibitions a {
	text-decoration: none;
}

blockquote {
	margin: 3rem;
	color: red;
}



/* ======================================== BASE */
* {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}

body,
html {
	font-size: 16px;
	line-height: 1.5rem;
	font-family: Oswald;
	font-weight: normal;
	color: #000;
}

html {
	scroll-behavior: smooth;
}

body {
	background-color: #fff;
//	background-color: #000;
}

#content-wrap, #center {
	background-color: white;
/*	overflow: auto; */
}

ul {
	list-style: none;
}


/* ========================================  HEADER -- sticky */
header {
	position: -webkit-sticky;
	position: sticky;
	top: 0;
	background: white;
	z-index: 30000;
}
ul.nav {
	top: 4.5rem;
}




/* ========================================  NAV */
nav ul {
	display: none;
	text-align: right;
	z-index: 9000;
	background: #fff;
	position: absolute;
	top: 52px;
	right: 0;
	width: 130px;
}
nav.shown ul {
	display: block;
}

nav ul li {
	padding-right: 10px;
}

nav ul a {
	margin-bottom: 1rem;
	display: inline-block;
}

nav {
/*	display: flex;*/
	flex-direction: row;
	text-transform: uppercase;
/*	padding: 1.5rem 2rem;*/
	padding: 1rem 1rem .5rem 1rem;
}

#modernism_logo {
	display: block;
	text-indent: -9999px;
	width: 276px;
	height: 20px;
	background: url(/images/ui/MODERNISM-logo.svg) no-repeat top left;
	background-size: 276px 20px;
	margin-top: 0rem;
	padding-bottom: 1.766rem;
}


#exInfo ul.nav a:hover,

nav a:hover,
nav a.on,
.exhibitions nav .exhibitions a,
.artists nav .artists a,
.fairs nav .fairs a,
.events nav .events a,
.press nav .press a,
.publications nav .publications a,
.about nav .about a  {
	color: #2a4261;
	border-color: #2a4261;
}

#exInfo ul.nav a ,

nav a {
	border-bottom: .1875rem solid transparent;
}

#menu {
	display: block;
	width: 40px;
	height: 40px;
	text-indent: -10000px;
	overflow: hidden;
	background-image: url("/images/ui/MODERNISM.svg");
	background-repeat: no-repeat;
	background-size: 240px 240px;
	background-position: -200px 0;
	position: absolute;
	top: 12px;
	right: 0;
	cursor: pointer;
}
nav.shown #menu {
	background-position: -200px -40px;
}


/* ======================================== ARTISTS thumbnails list/grid */
#center {
	font-weight: 300;
	margin: 0 auto;
}

ul.thumbs {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: left;
/*	list-style: none;*/
	margin: 0 auto;
}

.thumbs li {
	display: block;
	width: 50%;
	padding: 0 2rem 4rem 2rem;
}

.thumbs h3 {
	font-size: 1rem;
	font-weight: normal;
	margin-top: 1%;
}


h2 {
	font-weight: normal;
}


.current-exhibitions h2 {
	font-size: 1.675rem;
 line-height: 2.1rem;
/* 	margin-bottom: .25rem; */
}

.current-exhibitions li {
	margin-bottom: 2rem;
}


.current-exhibitions img {
	margin-top: .5rem;
}


.thumbs h4 {
	font-size: .875rem;
	font-weight: 300;
	line-height: 1.25rem;
/*	
	background-color: yellow;
*/
}


h2.current-exhibitions {
	margin: 3rem 2rem 1rem 0;
}

h2.past-exhibitions {
	margin: 3rem 2rem 0 2rem;
}

h3.archive-year {
	margin: .5rem 2rem 1rem 2rem;
}

h4.exhibitionTitle {
	text-transform: uppercase;
}

h4.exhibitionDates {
/*	font-size: .75rem;
*/

  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;

}

.current-exhibitions li {
	padding: 0 2rem;
}

.current-exhibitions h3,
.past-exhibitions .thumbs h3 {
	font-weight: 300;
	font-size: 1.25rem;
}

.current-exhibitions h4 {
	font-weight: 300;
}

.current-exhibitions img,
.past-exhibitions img {
	margin: 1rem 0 2rem 0;
}

img {
	width: 100%;
/*	height: auto;*/
	object-fit: cover;
}

/* ======================================== lazyload fade in image is loaded */
img.lazy-image {
	opacity: 0;
}
img.lazy-image.loaded {
	opacity: 1;
}

img.lazy-image.loaded {
    animation: fadein 1s;
    -moz-animation: fadein 1s; /* Firefox */
    -webkit-animation: fadein 1s; /* Safari and Chrome */
    -o-animation: fadein 1s; /* Opera */
}
@keyframes fadein {
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}


figcaption {
	text-align: right;
}





/* ========================================  HOME */

main {
	width: 100%;
	max-width: 1136px;
	margin: 0 auto 2rem auto;
}

/* ========== slides */

.slide {
  visibility: hidden;
  opacity: 0;
  height: 0;
  line-height: 0;
  margin: 0;
  padding: 0;
  overflow: hidden;
  position: relative;
  display: block;
}
.slide:first-of-type {
  visibility: visible;
  opacity: 1;
}

.slide.current::before {
	display: block;
	color: white;
	background: maroon;
	font-size: 1.25rem;
	line-height: 1.25rem;
	content: "Current Exhibition";
	white-space: nowrap;
	position: absolute;
	right: 0;
	top: -200px;
	padding: .175rem .5rem .25rem .5rem;
}

.slide.west::after {
	display: block;
	color: white;
	background: #2a4261;
	font-size: 1.25rem;
	line-height: 1.25rem;
	content: "@ MODERNISM West";
	white-space: nowrap;
	position: absolute;
	left: 0;
	right: unset;
	top: -200px;
	padding: .175rem .5rem .25rem .5rem;
}

.slide.show {
  height: auto;
  visibility: visible;
  opacity: 1;
  transition: opacity 1s linear;
}

.slide.hide {
  height: 0px;
  visibility: hidden;
  opacity: 0;
}

.slide #showTitle {
	position: absolute;
	bottom: 0;
	left: 1400px;
	min-width: 100%;
	margin: 0;
	padding: .5rem 1rem;
}
.slide:first-of-type #showTitle {
	display: none;
}
.slide.show #showTitle {
	left: 0;
	transition: left 2s;
	transition-delay: 1s;
}
.slide.current.show::before,
.slide.west.show::after {
	top: 0;
	transition: top .5s 3s;
}

.slide.noHref {
	cursor: default;
}




.slide #showTitle h2 {
	color: #fff;
}

.slide #showTitle h3 {
	color: #fff;
}

/* ============================================= */







/*img {
  visibility: hidden;
  opacity: 0;
}
*/
img.fadeIn {
  visibility: visible;
  opacity: 1;
  transition: opacity 1s linear;
}







/* ========================================	CONTENT */

.content {
	padding: 2rem;
}

.content h2,
.content h3,
.content h4 {
	margin: 1rem 0;
}

.content h4 {
	margin-bottom: 0;
}

.content p {
	margin: 0 0 1rem 0;
}






/* ========================================  EXHIBITIONS */


#main {
}

/*.exhibitions.individual ul#links {*/
.individual ul#links {
	display: none;
}

#showTitle {
	margin: 0 0 1rem 0;
}
.detail #showTitle/*,
.zoom #showTitle,
.grid #showTitle*/ {


/*	display: none;*/
}


#showTitle h2 {
	font-size: 1.875rem;
	font-weight: normal;	
	line-height: 2.5rem;
}

#showTitle h3, #showTitle h4 {
	color: #656263;
	font-size: 1.25rem;
	line-height: 1.75rem;
	font-weight: 300;
}

#showTitle h4 {
	font-size: 1rem;
}

#imageTitle {
	width: 100%;
	margin: .5rem 0 0 0;
}

.overview #imageTitle h2 {
	display: none;
}
.detail #imageTitle h2 {
	font-size: 1.875rem;
	line-height: 2.5rem;
	
	display: none;
}
/*.detail #imageTitle {
	margin: 5rem 0 0 0;
}
*/
.zoom #imageTitle h2,
.grid #imageTitle h2 {
	display: none;
}

/*.zoom #imageTitle,*/
.grid #imageTitle {
	display: none;
}

.detail #imageTitle {
	display: inline-block;
}



#imageTitle h3, #imageTitle h4,
#imageTitleAndNav p {
	color: #656263;
	font-size: 1.25rem;
	line-height: 1.75rem;
	font-weight: 300;
/*	float: left;*/
}


#imageTitle h4.date {
	display: none;
}

.detail #imageTitle h4.date {
	display: block;
	margin: .25rem 0 .25rem 0;
}

 #imageTitle h4,
 #imageTitleAndNav p {
	font-size: 1rem;
}

/*.exhibitions.individual #images {*/

#images {
	padding: 0 2rem 2rem 2rem;
	position: relative;
	overflow: hidden;
}

/* ================================================================================================================

	REFACTOR: remove nav menu below 

================================================================================================================ */		

.exhibitions.individual #images #showTitle ul {
	/*display: none;*/
}




#imageTitleAndNav {
	overflow: hidden;
}

#imageTitleAndNav h4 {
/*	float: left;*/
}

/*
#imageTitleAndNav p {
	float: right;
	text-align: right;
}
*/
#imageTitleAndNav p.imageDetails {
	margin-top: 0;
	line-height: 1.25rem;
	display: none;
}

.detail #imageTitleAndNav p.imageDetails {
	display: inline-block;
}


#imageTitleAndNav p.mediaSummary {
	background: lime;
}

.mediaSummary p {
	margin-top: 1rem;
}



#canvas {
}





/* ===================================================== STAGE begin */

		.image-wrapper {
			display: block;
			position: relative;
/*			background-color: mediumvioletred;*/
			width: 100%;
/*			max-height: 756px;*/
			max-width: 1136px;
			margin: 0 auto;
			margin-bottom: 10px;
		}
		
		.image-wrapper:before {
			content: "";
			display: block;
			padding-top: 66.6%;
		}
		
		.image-wrapper video,
		.image-wrapper img {
			width: auto;
			object-fit: auto;			

			max-width: 100%;
			max-height: 100%;
			display: block; /* remove extra space below image */
			  
			position: absolute;
			top: 50%;
			left: 50%;
			
			transform: translate(-50%, -50%);
			margin: 0 auto;		
		}
		.image-wrapper video {
			width: 100%;
		}
		
		.thumbs video {
			height: 204px;
			max-width: 100%;
			background-color: #f0f0f0;
		}



/* other views */

.detail .image-wrapper:before,
.zoom .image-wrapper:before {
	padding-top: 0;
}

.zoom .image-wrapper img {
	width: 100%;
}




/* ===================================================== STAGE end */





/*

#mainImageAnchor {
	height: 700px;
	overflow: hidden;
	display: flex;
	position: relative;
	cursor: pointer
}

.detail #mainImageAnchor,
.zoom #mainImageAnchor {
	height: auto;
}

#mainImage {
		height: 100%;

	object-fit: cover;
	overflow: hidden;
	display: none;
	
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%,-50%);	
}
*/
.detail #mainImage,
.zoom #mainImage {
	position: relative;
	left: 0;
	top: 0;
	transform: none;
}

.detail #mainImage {
	height: auto;
/*	width: auto;*/
}

#canvas img {
/*	border: 1px solid red;*/
}



.viewNav {
	position: absolute;
	top: .5rem;
	right: 2rem;
	font-size: 2rem;
	text-align: right;
	justify-content: flex-end;
	z-index: 1000;
	display: flex;
}

.viewNav div {
	cursor: pointer;
}

.viewNav div {
    display: block;
    width: 20px;
    height: 26px;
    margin-right: 4px;
    margin-bottom: 4px;
    text-indent: 10000px;
    background-image: url("/images/ui/MODERNISM.svg");
    background-repeat: no-repeat;
    background-size: 120px 120px;
    cursor: pointer;
    border-bottom: 2px solid white;
}
.viewNav div:hover,
.overview .viewNav div#view-select-overview,
.detail .viewNav div#view-select-detail,
.zoom .viewNav div#view-select-zoom,
.grid .viewNav div#view-select-grid {
/*    border-bottom: 2px solid #878888;*/
    border-bottom: 2px solid #d2d2d2;
}

.viewNav div#view-select-overview { background-position: 0 0; }
.viewNav div#view-select-detail { background-position: -20px 0; }
.viewNav div#view-select-zoom { background-position: -40px 0; }
.viewNav div#view-select-grid { background-position: -60px 0; }
.viewNav div#view-select-share { 
	background-position: -80px 0;
	margin-left: 12px;
}


/* share */

#share-link-holder {
	position: absolute;
	top: 24px;
	right: 0;
	width: 72px;
	background-image: none;
	background-color: white;
	overflow: hidden;
	transition-property: all;
	transition-duration: .25s;
	transition-timing-function: cubic-bezier(0, 1, 0.5, 1);
}

.viewNav div#view-select-share:hover {
	height: 32px;
}


.viewNav div#view-select-share #share-link-holder {
	max-height: 0;
}


.viewNav div#share-link-holder div {
	float: right;
	height: 20px;
	margin: 4px 2px 4px 2px;
	overflow: hidden;
	border-bottom: none;
	background-repeat: no-repeat;
	overflow: hidden;
}

.viewNav div div:hover div,
#share-link-holder {
	border-bottom: none;
}

.viewNav div div.e {	background-position: -80px -100px; }
.viewNav div div.t {	background-position: -80px -40px; }
.viewNav div div.f { background-position: -80px -60px; }





#slideNav {
	width: 100%;
	top: 50%;
	left: 0;
	z-index: 1000;
}

.grid #slidePrev,
.grid #slideNext {
	display: none;
}


#imageTitle {
	float: left;
}

#imageTitle,

#slideNav,
#slideNav a {
}

#slidePrev,
#slideNext,
#slideNav div {
	cursor: pointer;
	width: 32px;
	height: 100%;
	background-image: url(/images/ui/arrow-button.svg);
	background-repeat: no-repeat;
	background-position: 16px 10rem;
	background-size: 16px 45px;
	text-indent: -10000px;
}

#slidePrev {
	position: absolute;
	left: 0;
	transform: scaleX(-1);
}

#slideNext {
	position: absolute;
	right: 0;
}



#pressPanel {
}



#exInfo {
	padding: 1rem 2rem;
}

ul.nav {
	float: left;
	width: 20%;
	text-transform: uppercase;
	font-size: 1.5rem;
	line-height: 2.875rem;
	position: -webkit-sticky;
	position: sticky;
/*	top: 0;*/
	background: white;
	z-index: 20000;
}

#exInfo .nav a {
	color: #656263;
}


#exInfo .info {
	font-weight: 300;
	font-size: 1.125rem;
	line-height: 2rem;
	margin-left: 20%;
}

#exInfo .info > div {
	margin-bottom: 5rem;
}

#pressRelease {
}

#pressRelease p,
#pressPanel p {
	margin: 0 0 1rem 0
}

#exInfo .info #pressRelease p:first-of-type::first-line {
	font-size: 1.875rem;
	font-weight: normal;
}

#exInfo .info #pressPanel {
}

#pastExhibitions {
}


#pressPanel h2.press,
#pressPanel h3.press,
#pastExhibitions h2.past-exhibitions,
#pastExhibitions h3.archive-year {
	margin-left: 0;
}

#pastExhibitions .thumbs li {
	width: 100%;
	padding: 0 0 4rem 0;
}


#pastExhibitions .current-exhibitions li {
	padding: 0 0 4rem 0;
}





/* ======================================== DETAIL and ZOOM */


#mediaSummary {
	opacity: 0;
}

#imageTitle {
	opacity: 0;
	text-align: right;
}
#imageTitle h3 {
	text-transform: uppercase;
}

.detail #imageTitle {
	text-align: left;
}




.exhibitions.individual.large #imageTitle {
	padding:6rem 0 0 1.5rem;
}

.exhibitions.individual.large #imageTitle h2 {
	font-size: 1.875rem;
	line-height: 2.5rem;
}

.exhibitions.individual.large #imageTitle h3 {
	line-height: 2.25rem;
}

.exhibitions.individual.large #imageTitle p {
	clear: both;
	color: #656263;
}

.exhibitions.individual.large #details {
/*	background: yellow;*/
	display: flex;
}

.exhibitions.individual.large #details nav {
	display: flex;
	width: 2%;
	padding: 0;
	margin-top: 10rem;
}

.exhibitions.individual.large #details nav a {
	color: #656263;
	font-weight: bold;
	font-size: 2rem;
	height: 30px;
	width: 30px;
	padding: 0;
	text-align: center;
	text-decoration: none;
	border-bottom: none;
	cursor: pointer;
}

.information {
	background: seashell;
	width: 30%;
}

.exhibitions.individual.large #details .artwork {
	background: seagreen;
	width: 66%;
	max-height: 66%
	line-height: 0;
}


.exhibitions.individual.large #zoom {
	display: none;
}

.top-control {
	text-align: right;
}






/* ========================================  PRESS */

/* Featured Press section -- BEGIN */


#featured-pdfs a {
	text-decoration: none;
}

#featured-pdfs.loading {
	display: none;
}

#featured-pdfs canvas {
	box-shadow: 0 0 2px #CDCDCD;
}

.press .thumbs {
	margin: 2rem 0 0 0;
}

.press .thumbs li {
}

.press .thumbs p {
	background: pink;
}

.press .thumbs li div canvas {
	background: orange;
}


.press .thumbs canvas {
	display: block;
	margin: 0 0 1rem 0;
}

/* Featured Press section -- END */





/* accordion */
@charset "UTF-8";
/*body {
  color: #2c3e50;
  background: #ecf0f1;
  padding: 0 1em 1em;
}*/

/*h1 {
  margin: 0;
  line-height: 2;
  text-align: center;
}

h2 {
  margin: 0 0 0.5em;
  font-weight: normal;
}*/

.tabs input {
  position: absolute;
  opacity: 0;
  z-index: -1;
}

/*.row {
  display: flex;
}
.row .col {
  flex: 1;
}
.row .col:last-child {
  margin-left: 1em;
}*/

/* Accordion styles */
.tabs {
/*  border-radius: 8px;*/
  overflow: hidden;
  box-shadow: 0 4px 4px -2px rgba(0, 0, 0, 0.5);
}

.tab {
  width: 100%;
  color: white;
  overflow: hidden;
}
.tab-label {
  display: flex;
  justify-content: space-between;
  padding: .5rem 1rem;
  background: #163e7d;
  font-weight: normal;
  cursor: pointer;
  /* Icon */
}
.tab-label:hover {
  background: #002155;
}
.tab-label::after {
  content: ">";
  width: 1em;
  height: 1em;
  text-align: center;
  transition: all 0.35s;
}
.tab-content {
/* */
/*  max-height: 0; */
  height: 0;
/* */  
  
  padding: 0 1em;
  margin-bottom: .5rem;
  color: #2c3e50;
  background: white;
  transition: all 0.35s;
}
.tab-close {
  display: flex;
  justify-content: flex-end;
  padding: 1em;
  font-size: 0.75em;
  background: #2c3e50;
  cursor: pointer;
}
.tab-close:hover {
  background: #1a252f;
}

.tabs input:checked + .tab-label {
  background: #163e7d;
}
.tabs input:checked + .tab-label::after {
  transform: rotate(90deg);
}
.tabs input:checked ~ .tab-content {
/* */
/*    max-height: 100vh; */
  height: auto;
/* */  

  padding: 1em;
}

/* accordion end */

.tab-content p {
	margin-bottom: 1rem;
	padding: 1rem;
/*	background-color: #fdfdfd;*/
	background-color: #f6f6f6;
}







/* ========================================  ABOUT */

/* g map */
.about #center iframe {
	width: 60%;
	float: right;
	margin: 0 0 1rem 1rem;
}

/* temp stuff */


/* subnav - temp */
.about .content ul.subnav {
	width: 20%;
	float: right;
	margin: 0 2rem 2rem 2rem;
}

.about .content ul.subnav li a {
	display: block;
	padding: .5rem 1rem;	
	background: white;
	border: 1px solid black;
	color: black;
	text-align: right;
	cursor: pointer;
	text-decoration: none;
}
.about .content ul.subnav li.on a, .about .content ul.subnav li a:hover {
	background: black;
	color: white;
	cursor: pointer;
}
.about .content ul.subnav li.on a {
	cursor: default;
}

.about .content ul.subnav li a {
}
.about .content ul.subnav li.on a {
}




.covid {
/*	background: #c5e4fe;*/
	background: maroon;
	display: inline-block;
	padding: 3rem;
/*	border: 2px solid black;*/
	color: white;

margin-bottom: 2rem;
}

.content .covid ul a {
	color: white;
	text-decoration: none;
}

.covid a {
	color: white;
}

.covid p:last-of-type {
	margin-bottom: 0;
}

.covid h4 {
	font-size: 1.5rem;
	line-height: 2rem;
}
.covid p.bigger {
	font-size: 1.25rem;
}

p.to-book {
/*	font-size: 150%;
*/
}














/* ========================================  SOCIAL LINKS */


.social-links {
/*	background-color: darkseagreen;*/
	overflow: hidden;
/*	max-width: 1200px;
	margin: 0 auto;
	padding: 0 1rem;
*/
	padding-bottom: .5rem;
	margin-left: -.5rem;
}

.social-links ul {
	display: flex;
	height: 100%;
/*	float: right;*/
}

.social-links li {
	padding: .5rem;
	display: inline-block;
}


/* REFACTOR icons as non-png */

.social-links li a {
	display: block;
	height: 25px;
	width: 25px;
	background-repeat: no-repeat;
	background-size: 25px 25px;
	text-indent: 10000px;	
	overflow: hidden;
}

.social-links li a.instagram {
	height: 25px;
	width: 25px;
	background-size: 25px 25px;
	text-indent: -1000px;	
}

.social-links li a.instagram {
	background-image: url(../images/ui/social/instagram.png);
}


.social-links li a.facebook {
	background-image: url(../images/ui/social/facebook.png);
}

.social-links li a.email {
	background-image: url(../images/ui/social/email.png);
	width: 35px;	
	height: 25px;	
	background-size: 35px 25px;
}






/* ========================================  FOOTER */
footer {
	background-color: #000;
	font-size: 0.8rem;
	margin-top: 1rem;
}

footer, .footer-links ul a {
	color: #7b7979;
}

div.footer-container {
	padding: 1rem;	
/*	background: peachpuff;*/
}

footer h3, footer h4 {
	color: #fff;
	text-transform: uppercase;
}

h4.artist-link-heading {
/*	background: blanchedalmond;*/
	width: 100%;
}

footer .address {
	width: 13rem;
	padding-right: 20px;
	margin-bottom: 2rem;	
}


footer address {
	font-style: normal;
	line-height: 1.25rem;
	margin-bottom: 1rem;	
}

footer address p {
	margin: .675rem 0;
}

footer .address h3:last-of-type {
	margin-top: 2.25rem;
}

.footer-links > div {
	display: flex;
	flex-direction: row;	
	flex-wrap: wrap;
}

.footer-links > div > div {
	width: 10rem;
	padding-right: 0rem;	
}

.footer-links ul {
	margin-bottom: 1rem;
}

.footer-links li {
	margin-left: 1rem;
/*	background: magenta;*/
}


.footer-links li p {
	text-indent: -1em;
/*	background-color: rosybrown;*/
}

footer a {
	color: #fff;
}

.footer-links .artists {
/*	background: yellow;*/
/*	width: auto;*/
}



.footer-links .artists li {
	margin-left:: 0;
}




/*

.footer-links a span {
	display: inline-block;
	width: 50%;
}

.footer-links a span.first-name {
	text-align: right;
	padding-right: .25rem;
.footer-links a span.last-name {
	
}


}

*/

/* 
======================================== MEDIA QUERIES
*/

/* >= 576px "landscape mobile" */
@media only screen and (min-width: 576px) {

	nav ul li {
		padding-right: 10px;
	}

	.thumbs h3 {
		font-size: 1.125rem;
	}

#pastExhibitions .thumbs h3,
#pastExhibitions .thumbs h4 {
	font-weight: 300;
	font-size: 1.25rem;
	line-height: 2rem;
}	
#pastExhibitions .thumbs h4 {
	font-size: 1.125rem;
}	

	div.footer-container {
		display: flex;
	}
	

	.slide #showTitle {
		padding: 1rem 1.5rem;
	}

	.slide #showTitle h2 {
		font-size: 3rem;
		line-height: 4rem;
	}
	
	.slide #showTitle h3 {
		font-size: 1.5rem;
		line-height: 1.5rem;
	}
}

/* >= 768px "portrait tablets" */
@media only screen and (min-width: 768px) {

	.thumbs li {
		width: 33.33%;	
	}
	
	#menu {
		display: none;
	}
	
/*	nav {
		font-size: .875rem;
	}
*/	
	nav ul {
		top: 0;
		display: flex;
		margin-top: 1rem;
		position: relative;
	}
	
	nav li {
		display: block;
	}
	
	nav li a {
		display: block;
		padding-top: 0rem;
		padding-bottom: .25rem;
		margin-right: 0.93rem;
		margin-left: 0.93rem;
		white-space: nowrap;
	}
	
	nav li a:first-of-type {
		margin-left: 0;
	}
	

	.slide #showTitle {
		padding: 1.5rem 2rem;
	}

	.slide #showTitle h2 {
		font-size: 4rem;
		line-height: 5.5rem;
	}
	
	.slide #showTitle h3 {
		font-size: 2rem;
		line-height: 2rem;
	}
}

/* >= 992px "landscape tablets" */
@media only screen and (min-width:992px) { 
	.thumbs li {
		width: 25%;	
	}
	
	nav {
		font-size: 1rem;
		display: flex;
	}

	nav ul {
		padding-left: 1.5rem;
		margin-top: 0;
	}
	
	nav li a,
	nav li a:first-of-type {
		margin-left: 1rem;
		margin-right: 1rem;
	}


	.slide #showTitle {
		padding: 2rem 3rem;
	}

	.slide #showTitle h2 {
		font-size: 5rem;
		line-height: 6.5rem;
	}
	
	.slide #showTitle h3 {
		font-size: 3rem;
		line-height: 3rem;
	}
}

/* >= 1200px "laptops, desktops, TVs" */
@media only screen and (min-width: 1200px) { 
	nav {
		width: 1200px;
		margin: 0 auto;
	}

	#center {
/*		width: 1200px;*/
	}
	
	div.footer-container {
		width: 1200px;
		margin: 0 auto;
/*		padding: 2rem;*/
	}
	
}














/* mobile share rules */

@media(hover: none) and (pointer: coarse) {
    
	#showTitle {
		margin: 62px 0 1rem 0;
	}    

	
	.viewNav div {
	    width: 40px;
	    height: 52px;
	    background-size: 240px 240px;
	    border-bottom: 4px solid white;
	}
	
	.viewNav div#view-select-overview { background-position: 0 0; }
	.viewNav div#view-select-detail { background-position: -40px 0; }
	.viewNav div#view-select-zoom { background-position: -80px 0; }
	.viewNav div#view-select-grid { background-position: -120px 0; }
	.viewNav div#view-select-share { 
		background-position: -160px 0;
		margin-left: 12px;
	}
	
	#share-link-holder {
		top: 0;
		right: -170px;
		width: 144px;
	}
	
	.shownShareMenu #share-link-holder {
		right: 54px;
		width: 175px;
	}
	
	.viewNav div#view-select-share:hover {
		height: 40px;
	}
	
	.viewNav div#view-select-share #share-link-holder {
		max-height: 52px;
	}
	
	.viewNav div#share-link-holder div {
		height: 40px;
		margin: 0 2px 4px 2px;
	}
	
	.viewNav div div div,
	#share-link-holder {
		border-bottom: none;
	}
	
	.viewNav div div.e {	background-position: -160px -200px; }
	.viewNav div div.t {	background-position: -160px -80px; }
	.viewNav div div.f { background-position: -160px -120px; }
	
#exInfo .nav {
	display: none;
}
	
#exInfo .info {
	margin-left: 0;
}
	

}

@media(hover: hover) and (pointer: fine) {
	
	.viewNav div#view-select-share:hover #share-link-holder {
		max-height: 32px;
	}

}


	
	
/* DEV */
#dev-header {
	background-color: darkgray;
	text-align: center;
}

/* dark mode */
/* @media (prefers-color-scheme: dark) {
	header,
  #center {
    background-color: #3c3c3c;
    color: #FFFFFF;
  }
  
  a,
  .thumbs h3 {
    color: #blueeaeaea;
	font-weight: 300;
  }
  
} */