/*-------------------- Font ---------------------*/

@font-face {
  font-family: 'Post Grotesk';
  src: url('https://mam.org/_asset/font/PostGrotesk-Light.eot'); /* IE9 Compat Modes */
  src: url('https://mam.org/_asset/font/PostGrotesk-Light.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('https://mam.org/_asset/font/PostGrotesk-Light.woff') format('woff'), /* Modern Browsers */
       url('https://mam.org/_asset/font/PostGrotesk-Light.ttf')  format('truetype'); /* Safari, Android, iOS */
  font-weight: 100;
}

@font-face {
  font-family: 'Post Grotesk';
  src: url('https://mam.org/_asset/font/PostGrotesk-Thin.eot'); /* IE9 Compat Modes */
  src: url('https://mam.org/_asset/font/PostGrotesk-Thin.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('https://mam.org/_asset/font/PostGrotesk-Thin.woff') format('woff'), /* Modern Browsers */
       url('https://mam.org/_asset/font/PostGrotesk-Thin.ttf')  format('truetype'); /* Safari, Android, iOS */
  font-weight: 200;
}

@font-face {
  font-family: 'Post Grotesk';
  src: url('https://mam.org/_asset/font/PostGrotesk-Book.eot'); /* IE9 Compat Modes */
  src: url('https://mam.org/_asset/font/PostGrotesk-Book.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('https://mam.org/_asset/font/PostGrotesk-Book.woff') format('woff'), /* Modern Browsers */
       url('https://mam.org/_asset/font/PostGrotesk-Book.ttf')  format('truetype'); /* Safari, Android, iOS */
  font-weight: 300;
}

@font-face {
  font-family: 'Post Grotesk';
  src: url('https://mam.org/_asset/font/PostGrotesk-Medium.eot'); /* IE9 Compat Modes */
  src: url('https://mam.org/_asset/font/PostGrotesk-Medium.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('https://mam.org/_asset/font/PostGrotesk-Medium.woff') format('woff'), /* Modern Browsers */
       url('https://mam.org/_asset/font/PostGrotesk-Medium.ttf')  format('truetype'); /* Safari, Android, iOS */
  font-weight: 400;
}

@font-face {
  font-family: 'Post Grotesk';
  src: url('https://mam.org/_asset/font/PostGrotesk-Bold.eot'); /* IE9 Compat Modes */
  src: url('https://mam.org/_asset/font/PostGrotesk-Bold.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('https://mam.org/_asset/font/PostGrotesk-Bold.woff') format('woff'), /* Modern Browsers */
       url('https://mam.org/_asset/font/PostGrotesk-Bold.ttf')  format('truetype'); /* Safari, Android, iOS */
  font-weight: 600;
}

@font-face {
  font-family: 'Post Grotesk';
  src: url('https://mam.org/_asset/font/PostGrotesk-Black.eot'); /* IE9 Compat Modes */
  src: url('https://mam.org/_asset/font/PostGrotesk-Black.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('https://mam.org/_asset/font/PostGrotesk-Black.woff') format('woff'), /* Modern Browsers */
       url('https://mam.org/_asset/font/PostGrotesk-Black.ttf')  format('truetype'); /* Safari, Android, iOS */
  font-weight: 800;
}

@font-face {
  font-family: 'Post Grotesk-Italic';
  src: url('https://mam.org/_asset/font/PostGrotesk-LightItalic.eot'); /* IE9 Compat Modes */
  src: url('https://mam.org/_asset/font/PostGrotesk-LightItalic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('https://mam.org/_asset/font/PostGrotesk-LightItalic.woff') format('woff'), /* Modern Browsers */
       url('https://mam.org/_asset/font/PostGrotesk-LightItalic.ttf')  format('truetype'); /* Safari, Android, iOS */
  font-weight: 100;
}

@font-face {
  font-family: 'Post Grotesk-Italic';
  src: url('https://mam.org/_asset/font/PostGrotesk-ThinItalic.eot'); /* IE9 Compat Modes */
  src: url('https://mam.org/_asset/font/PostGrotesk-ThinItalic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('https://mam.org/_asset/font/PostGrotesk-ThinItalic.woff') format('woff'), /* Modern Browsers */
       url('https://mam.org/_asset/font/PostGrotesk-ThinItalic.ttf')  format('truetype'); /* Safari, Android, iOS */
  font-weight: 200;
}

@font-face {
  font-family: 'Post Grotesk-Italic';
  src: url('https://mam.org/_asset/font/PostGrotesk-BookItalic.eot'); /* IE9 Compat Modes */
  src: url('https://mam.org/_asset/font/PostGrotesk-BookItalic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('https://mam.org/_asset/font/PostGrotesk-BookItalic.woff') format('woff'), /* Modern Browsers */
       url('https://mam.org/_asset/font/PostGrotesk-BookItalic.ttf')  format('truetype'); /* Safari, Android, iOS */
  font-weight: 300;
}

@font-face {
  font-family: 'Post Grotesk-Italic';
  src: url('https://mam.org/_asset/font/PostGrotesk-MediumItalic.eot'); /* IE9 Compat Modes */
  src: url('https://mam.org/_asset/font/PostGrotesk-MediumItalic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('https://mam.org/_asset/font/PostGrotesk-MediumItalic.woff') format('woff'), /* Modern Browsers */
       url('https://mam.org/_asset/font/PostGrotesk-MediumItalic.ttf')  format('truetype'); /* Safari, Android, iOS */
  font-weight: 400;
}

@font-face {
  font-family: 'Post Grotesk-Italic';
  src: url('https://mam.org/_asset/font/PostGrotesk-BoldItalic.eot'); /* IE9 Compat Modes */
  src: url('https://mam.org/_asset/font/PostGrotesk-BoldItalic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('https://mam.org/_asset/font/PostGrotesk-BoldItalic.woff') format('woff'), /* Modern Browsers */
       url('https://mam.org/_asset/font/PostGrotesk-BoldItalic.ttf')  format('truetype'); /* Safari, Android, iOS */
  font-weight: 600;
}

@font-face {
  font-family: 'Post Grotesk-Italic';
  src: url('https://mam.org/_asset/font/PostGrotesk-BlackItalic.eot'); /* IE9 Compat Modes */
  src: url('https://mam.org/_asset/font/PostGrotesk-BlackItalic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('https://mam.org/_asset/font/PostGrotesk-BlackItalic.woff') format('woff'), /* Modern Browsers */
       url('https://mam.org/_asset/font/PostGrotesk-BlackItalic.ttf')  format('truetype'); /* Safari, Android, iOS */
  font-weight: 800;
}



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

body {
	background-image: none;
	font-family: "Post Grotesk", "Open Sans", Verdana, "sans-serif";
	font-size: 16pt;
	color: #111;
	font-weight: 300;
}

* {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	padding: 0;
	margin: 0;
}

html {
	scroll-behavior: smooth;
}

h1 {
	font-size: 3em;
	text-align: center;
	letter-spacing: -1px;
	padding: 0;
	margin: 0;
	line-height: 1.25;
}

h1 a {
	color: inherit;
	text-decoration: none;
}

h1 a:hover {
	opacity: .9;
	color: inherit;
}

h2 {
	font-size: 1.5em;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: -1px;
	padding: 0;
	margin: 0;
	line-height: 1.25;
	opacity: 1;
}

h2.exhibition-dates {
	text-transform: none;
	text-align: center;
	font-size: 1.75em;
	font-weight: 600;
	margin-bottom: 3rem;
	letter-spacing: 0;
}

h3 {
	font-size: 1.25em;
	font-weight: 700;
	letter-spacing: 0px;
	padding: 0 0 1rem 0;
	margin: 0;
	line-height: 1.25;
}

h4 {
    font-size: 1.3em;
    font-weight: 700;
	margin: 0;
	padding: 2rem 0 .5rem 0;
	line-height: 1.25;
}

a {
	transition: ease-in-out all .3s;
}

a.white-link {
    color: #fff;
}

a.white-link:hover {
    color: #bfbfbf;
}

img {
	max-width: 100%;
	border: none;
	outline: none;
}

.body-wrapper {
	width: 100%;
	margin: 0 auto;
}

p {
	padding: 1rem 0;
}

.less-padding {
	padding: .75rem 0;
}

.float-left {
	float: left;
}

.float-right {
	float: right;
}

.clear {
	clear: both;
}

.spacer {
	height: 1.5rem;
	clear: both;
}

.spacer-noclr {
	height: 1.5rem;
}

.clear {
	clear: both;
}

.three-quarter {
    width: 75%;
    margin: 2rem auto 1rem auto;
}

.zoom img:hover {
	cursor: zoom-in;
}

.top-margin {
	margin-top: 1em;
}

.centered {
	text-align: center;
}



/*------------------ Header ---------------------*/

#home header {
	background: #111;
}

header .logo-wrapper #mam-logo,
header .logo-wrapper #back-logo {
	width: 85%;
	max-width: 2000px;
	margin: 0 auto;
	box-sizing: border-box;
	padding: .5rem 0;
}

header .logo-wrapper #mam-logo img {
	width: 10%;
	height: auto;
}

header .logo-wrapper #back-logo img {
	width: 15%;
	height: auto;
}

header .logo-wrapper #header-logo {
	box-sizing: border-box;
	margin: 0 auto;
	width: 85%;
	text-align: center;
}

header .logo-wrapper img {
	border: none;
	outline: none;
}




/*------------------ Content --------------------*/

#main-content {
	background: #111;
	color: #fff;
	width: 100%;
}

#main-content .content-wrapper {
	padding: 3rem 0;
}

.hideme {
    opacity: 0;
}

.content-wrapper {
	line-height: 1.5;
	width: 75%;
	margin: 0 auto;
	padding: 2em 0;
}

.content-wrapper p:first-child {
	padding-top: 0;
}

.content-wrapper p:last-child {
	padding-bottom: 0;
}

.content-wrapper + .object-columns {
    margin-top: 2rem;
}

.coming-soon {
	padding-top: .24rem;
    font-size: .75em;
    display: block;
    background: #111;
    width: 50%;
    color: #fff;
    text-align: center;
    margin: 2rem auto 1rem auto;
    letter-spacing: 0;
    text-transform: uppercase;
}

.image-caption {
	font-size: .8em;
}



/*------------------ Chapters -------------------*/

#chapter-one, #chapter-two,
#chapter-three {
	padding: 2rem 0;
}

#chapter-one {
	background: #bfbfbf;
	color: #000;
}

.content-inner .content-wrapper {
	padding: 0;
}

#chapter-two {
	background: #111;
	color: #fff;
}

.content-inner {
	margin: 0 auto;
	max-width: 2000px;
}



/*--------------- Internal Pages ----------------*/

.gray-template {
	background: #bfbfbf;
	color: #000;
}

.gray-template a {
	color: #000;
	text-decoration: underline;
}

.gray-template a:hover {
	color: #333;
}

.black-template {
	background: #000;
	color: #fff;
}

.black-template a {
	color: #fff;
	text-decoration: underline;
}

.black-template a:hover {
	color: #bfbfbf;
}

.white-template a {
	color: #000;

}

.header-img {
	width: 100%;
	max-width: 2000px;
	margin: 0 auto;
	padding-bottom: 2.5rem;
}

.header-img img {
	width: 100%;
	height: auto;
}

p.artist-dates {
    padding-top: 0;
    font-weight: 400;
}

.art-desc {
	padding: 5rem 0;
	clear: both;
}

.art-desc-first {
	padding-top: 10rem;
}

.floated-img {
	padding-top: 0;
	padding-bottom: 1rem;
	width: 45%;
}

.floated-img a:nth-child(2) img {
	padding-top: 1rem;
}

.floated-img.floated-img-sm {
	width: 25%;
}

.floated-img.float-left {
	padding-right: 1rem;
}

.floated-img.float-right {
	padding-left: 1rem;
}

.half-img {
	width: 50%;
	padding: 1rem 0;
	float: left;
	box-sizing: border-box;
}

.half-img.first {
	padding-right: .5rem;
}

.half-img.second {
	padding-left: .5rem;
}

.video-embed {
	padding: 2rem 0 0 0;
}



/*------------------ Footer ---------------------*/

#footer {
	padding: 2rem 0;
}

#footer p {
    line-height: 1.25;
}

#home #footer {
	background: #bfbfbf;
	color: #000;
}

#footer.black {
	background: #000;
	color: #fff;
}

#footer.black a {
	color: #fff;
}

#footer.black a:hover {
	color: #bfbfbf;
}

#footer.white {
	background: #fff;
	color: #000;
}

#footer.white a {
	color: #000;
}

#footer.white a:hover {
	color: #333;
}

#footer.gray {
	background: #bfbfbf;
	color: #000;
}

#footer.gray a {
	color: #000;
}

#footer.gray a:hover {
	color: #333;
}

#footer .content-wrapper {
	display: flex;
}

#footer .columns {
	width: 50%;
	box-sizing: border-box;
}

#footer .columns:first-child {
	padding: 0 .75rem 0 0;
	justify-content: left;
}

#footer .columns:last-child {
	padding: 0 0 0 .75rem;
	justify-content: right;
	text-align: right;
}

#footer-logo {
	width: 155px;
	text-align: right;
	height: auto;
}

#footer .social img {
	padding: 0;
	margin: 0;
	width: 35px;
	height: auto;
}

#footer .social img {
	opacity: 1;
	transition: ease-in-out all .3s;
}

#footer .social img:hover {
	cursor: pointer;
	opacity: .8;
}

#footer p a {
	text-decoration: underline;
}



/*------------------ Objects --------------------*/

.object-columns {
	width: 85%;
	margin: 0 auto;
	padding: 2rem 0;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
}

#chapter-page .object-columns {
	max-width: 2000px;
}

.object-columns .objects {
	width: 33.3%;
	box-sizing: border-box;
	justify-content: center;
}

.object-columns .objects img {
	opacity: 1;
	transition: ease-in-out all .3s;
}

.object-columns .objects img:hover {
	opacity: .8;
}

.object-columns .objects:nth-child(1),
.object-columns .objects:nth-child(4) {
	padding: 0 1rem 0 0;
}

.object-columns .objects:nth-child(2),
.object-columns .objects:nth-child(5) {
	width: 33.4%;
	padding: 0 .5rem;

}

.object-columns .objects:nth-child(3),
.object-columns .objects:nth-child(6) {
	padding: 0 0 0 1rem;
}

.object-columns .objects:nth-child(4),
.object-columns .objects:nth-child(5),
.object-columns .objects:nth-child(6) {
	padding-top: 1rem;
}



/*------------------ Buttons --------------------*/

.content-button {
	line-height: 1.5;
	width: 75%;
	margin: 0 auto;
	padding: 2rem 0;
	font-size: 1em;
}

.content-button .btn {
	padding: .25rem .5rem;
	text-decoration: none;
	font-weight: 700;
	font-size: 1.1em;
	text-transform: uppercase;
	transition: ease-in-out all .3s;
}

.content-button .black-btn.btn {
	background: #000;
	color: #fff;
}

.content-button .black-btn.btn:hover {
	background: #fff;
	color: #000;
}

.content-button .white-btn.btn {
	background: #fff;
	color: #000;
}

.content-button .white-btn.btn:hover {
	background: #757575;
	color: #fff;
}

.content-button .gray-btn.btn {
	background: #bfbfbf;
	color: #000;
}

.content-button .gray-btn.btn:hover {
	background: #000;
	color: #fff;
}

.content-button.reserve {
	width: 100%;
}



/*---------------------- List styles ----------------------*/

ul {
	margin: 0;
	padding: 0;
}

ul li {
	margin: 0;
	padding: 0;
	line-height: 1.25;
}

.clean {
    list-style-type: none;
	margin-top: 1rem;
}

ul li a {
	text-decoration: none;
}

.gray li a {
    color: #000;
}

.gray li a:hover {
	color: #333;
}



/*------------------ Back to top button -------------------*/

#scroll-to-top {
	width: 100%;
	max-width: 2000px;
	margin: 0 auto;
	position: relative;
}

#top-scroll {
	display: none;
	position: fixed;
    bottom: 5%;
    right: 5%;
    padding: 5px 10px;
	z-index: 99;
	outline: none;
	transition: ease-in-out all .3s;
	opacity: .65;
	text-align: center;
    width: 25px;
	cursor: pointer;
}

#top-scroll:hover {
	opacity: 1;
}

#top-scroll img {
	width: 100%;
	height: auto;
	padding-top: 3px;
}

.gray-template #top-scroll {
	background: #000;
}

#home #top-scroll,
.black-template #top-scroll {
	background: #fff;
}

.white-template #top-scroll {
	background: #bfbfbf;
}



/*--------------- Responsive Styling/Mobile----------------*/



.small-compill {
	max-width: 50%;
	margin: 100px auto 30px;
}

@media only screen and (min-width: 2000px) {

	#top-scroll {
		width: 35px;
	}

}

@media only screen and (max-width: 1200px) {

	header .logo-wrapper #mam-logo img {
		width: 20%;
	}

	header .logo-wrapper #mam-logo {
		padding: 1rem 0;
	}

	header .logo-wrapper #back-logo img {
		width: 30%;
	}


}

@media only screen and (max-width: 1150px) {
	.small-compill {
		max-width: initial;
		margin: initial;
	}
	h1 {
		font-size: 2em;
	}

	h2 {
		font-size: 1.5em;
	}

}

@media only screen and (max-width: 768px) {

	body {
		font-size: 14pt;
	}

	h1 {
		padding-left: 1rem;
		padding-right: 1rem;
		font-size: 1.75em;
		margin: 0 0 1rem 0;
	}

	h2 {
		font-size: 1.25em;
	}

	h2.exhibition-dates {
		font-size: 1.2em;
		padding: 0 1em;
	}

	.floated-img.float-left {
		padding-right: 0;
	}

	.floated-img.float-right {
		padding-left: 0;
	}

	.floated-img.float-left,
	.floated-img.float-right {
		padding-top: 1rem;
		padding-bottom: 1rem;
		width: 100%;
	}

	.art-desc {
		padding: 3rem 0;
	}

	.three-quarter {
		width: 100%;
	}

}

@media only screen and (max-width: 600px) {

	.hideme {
		opacity: 1;
	}

	.content-wrapper {
		width: 85%;
	}

	.object-columns {
		width: 90%;
		padding: 0;
	}

	#chapter-page .object-columns {
		padding: 2rem 0;
	}

	.object-columns .objects {
		width: 100%;
	}

	.object-columns .objects:nth-child(2),
	.object-columns .objects:nth-child(5) {
		width: 100%;
	}

	.object-columns .objects:nth-child(1),
	.object-columns .objects:nth-child(2),
	.object-columns .objects:nth-child(3),
	.object-columns .objects:nth-child(4),
	.object-columns .objects:nth-child(5) {
		padding: 0 0 1rem 0;
	}

	.object-columns .objects:nth-child(6) {
		padding: 0;
	}

	.content-button {
		width: 85%;
		text-align: center;
	}

	.half-img.first {
		padding-right: 0;
		padding-bottom: 1rem;
	}

	.half-img.second {
		padding-left: 0;
		padding-top: 0;
	}

	.half-img {
		width: 100%;
		float: none;
	}

	.coming-soon {
		padding-bottom: .24rem;
		width: 100%;
	}

	#footer-logo {
		padding-top: 1rem;
	}

	#footer .content-wrapper {
		display: block;
	}

	#footer .columns {
		width: 100%;
	}

	#footer .columns:first-child {
		padding: 0 0 1rem 0;
		text-align: center;
	}

	#footer .columns:last-child {
		padding: 0 0 0 0;
		text-align: center;
	}

	#footer-logo {
		width: 175px;
		text-align: center;
	}

	#footer .social img {
		width: 42px;
	}

}