/*

	Theme Name: Narrative Projects
	Theme URI: http://narrativeprojects.com
	Author: DADA Digital Experience Lab
	Author URI: http://dadalab.co.uk
	Version: 1.0.0

	NARRATIVE PROJECTS STYLE.CSS DOCUMENT
	V 1.0

*/


/* IMPORT TYPEKIT */
@import 'https://use.typekit.net/ofk3dot.css';

body 		{ background-color: #fff; font-family: futura-pt, sans-serif; font-style: normal; font-weight: 300;}
#frame 		{ width: 100%; height: 100%; }
#grid 		{ width: 1240px; margin: 0 auto; }


/*
COMPOSITION: NAVIGATION */

#navigation {
	position: fixed;
	width: 650px;
	height: 100%;
	right: 0;
	top: 0px;
	background-color: #ffffff;
	z-index: 200;
	transform: translateX(700px);
	transition: transform 0.5s ease, box-shadow 0.5s ease;
}

	#navigation ul.navigation-list {
		width: 100%;
		height: auto;
		margin-top: 200px;
		text-align: right;
	}

		#navigation ul.navigation-list li {
			width: 100%;
			height: auto;
		}

			#navigation ul.navigation-list li a.navList {
				width: 100%;
				height: auto;
				padding-top: 8px;
				padding-bottom: 8px;
				padding-right: 80px;
				display: block;
				transition: padding 0.3s ease, color 0.3s ease;
			}

			#navigation ul.navigation-list li a.navList:hover {
				padding-right: 90px;
				display: block;
			}

	#navigation.on {
		transform: translateX(0px);
		-moz-box-shadow: -50px 0px 100px rgba(0, 0, 0, 0.1);
		-webkit-box-shadow: -50px 0px 100px rgba(0, 0, 0, 0.1);
		box-shadow: -50px 0px 100px rgba(0, 0, 0, 0.1);
	}

	#navigation .nav-close {
		position: absolute;
		top: 55px;
		right: 80px;
		padding: 10px;
		display: block;
		width: 30px;
		height: 30px;
	}

		#navigation .nav-close img {
			width: 30px;
			height: auto;
		}

.overlay {
	width: 100%;
	height: 100%;
	position: fixed;
	background: rgba(0, 0, 0, 0.5);
	z-index: 195;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.5s ease, visibility 0.2s 0.5s ease;
}

	.overlay.on {
		opacity: 1;
		visibility: visible;
		transition: opacity 0.5s 0.1s ease, visibility 0s 0s ease;
	}

.disable-scroll {
	overflow: hidden;
	height: 100%;
}





/*
COMPOSITION: PAGE INTRO */

section.page-intro {
	width: 100%;
	height: auto;
	padding: 100px 0 100px 0;
	text-align: center;
}

section.page-intro .v2 {
	display: block;
	padding-top: 20px;
}

	section.page-intro span.dates {
		padding-bottom: 60px;
		display: block;
		font-size: 18px;
		font-weight: 400;
		color: #000;
	}

		section.page-intro h1.page-title {
			display: block;
			width: 70%;
			margin: auto;
			font-size: 68px;
			font-weight: 400;
			color: #000;
			line-height: 74px;
		}

	section.page-intro .more-intro {
		display: block;
		padding-top: 40px;
	}

	section.page-intro .more-intro-exhibition {
		display: block;
		padding-top: 20px;
	}

		section.page-intro .more-intro .subtitle,
		section.page-intro .more-intro-exhibition .subtitle {
			width: 50%;
			margin: auto;
			display: block;
			line-height: 28px;
			font-size: 20px;
			font-weight: 400;
			color: #000;
			padding-bottom: 40px;
		}

		section.page-intro .more-intro .location-data {
			margin-right: 20px;
			font-size: 18px;
			font-weight: 400;
			color: #000;
		}

		section.page-intro .more-intro .dates {
			font-size: 18px;
			font-weight: 400;
			color: #000;
			padding-bottom: 40px;
		}





/*
COMPOSITION: BREADCRUMB */

section.breadcrumb {
	margin: auto;
	width: 200px;
	top: -80px;
	height: auto;
	text-align: center;
	z-index: 120;
}

	section.breadcrumb a.breadcrumb {
	}



/*
COMPOSITION: PAGE SINGLE IMAGE */

section.page-single-image {
	width: 100%;
	height: auto;
	text-align: center;
	margin-top: 0;
}

	section.page-single-image img {
		margin: auto;
		max-width: 1030px;
	}





/*
COMPOSITION: PAGE DESCRIPTION */

section.page-description {
	display: inline-block;
	width: 100%;
	height: auto;
	padding: 80px 0 80px 0;
	text-align: left;
}

	section.page-description .audio-section {
		width: 820px;
		margin: auto;
		height: auto;
		padding: 20px 0 60px 0;
	}

		section.page-description .audio-section audio {
			width: 100%;
			height: auto;
		}

	section.page-description p.full-description {
		width: 820px;
		margin: auto;
		height: auto;
		font-size: 20px;
		font-weight: 400;
		color: #000;
		line-height: 30px;
	}

	section.page-description p.short-detail {
		width: 820px;
		margin: auto;
		height: auto;
		line-height: 18px;
	}
	




/*
COMPOSITION: DONWLOADABLE ITEMS */

section.page-description .line-seperator {
	left: 212px;
	width: 50px;
	height: 1px;
	margin: 50px 0 50px 0;
	background-color: #D8D8D8;
}

section.page-description ul.downloadable-items {
	width: 820px;
	height: auto;
	margin: auto;
}

	section.page-description ul.downloadable-items li {
		width: 100%;
		font-size: 18px;
		font-weight: 400;
		color: #666666;
	}





/*
COMPOSITION: PAGE GALLERY */

section.page-gallery {
	width: 100%;
	padding: 80px 0;
	text-align: center;
	background-color: #f2f2f2;
}

/*
COMPOSITION: PAGE GALLERY */

section.page-gallery-alone-image {
	width: 100%;
	background-color: tomato;
	display: none;
}




/*
COMPOSITION: PAGE LIST # ONE COLUMN */

section.listing-one-column {
	width: 100%;
	height: auto;
	margin-bottom: 80px;
}

	section.listing-one-column .listing-title {
		width: 100%;
		height: auto;
		padding-bottom: 90px;
		text-align: center;
	}

		section.listing-one-column .listing-title span.title {
			font-size: 34px;
			font-weight: 400;
			color: #000;
		}


	section.listing-one-column .list-item {
		width: 100%;
		margin-bottom: 40px;
		border-bottom: 1px solid #D8D8D8;
	}

	section.listing-one-column .list-item:last-child {
		margin-bottom: 0px;
		border-bottom: 0px;
	}

		section.listing-one-column .list-item .section-left {
			display: inline-block;
			overflow: hidden;
			vertical-align: top;
			width: 604px;
			height: 405px;
			transition: opacity, 0.3s ease;
		}

		section.listing-one-column .list-item .section-left:hover {
			opacity: 0.9;
		}

			section.listing-one-column .list-item .section-left img {
				width: 100%;
				height: auto;
			}

		section.listing-one-column .list-item .section-right {
			display: inline-block;
			overflow: hidden;
			padding-left: 20px;
			vertical-align: top;
			margin-left: 28px;
			width: 586px;
			height: 405px;
		}

			section.listing-one-column .list-item .section-right .fexh-dates {
				margin-top: 40px;
				width: 100%;
				font-size: 18px;
				font-weight: 400;
				color: #8C8C8C;
			}

			section.listing-one-column .list-item .section-right .fexh-title {
				margin-top: 50px;
				width: 60%;
			}

			section.listing-one-column .list-item .section-right .fexh-subtitle {
				margin-top: 10px;
				width: 100%;
				font-size: 20px;
				font-weight: 400;
				color: #000;
			}

	section.listing-one-column .listing-error {
		width: 100%;
		padding-bottom: 40px;
		text-align: center;
		font-size: 24px;
		color: #C7C7C7;
	}




/*
COMPOSITION: PAGE LIST # TWO COLUMNS */

section.listing-two-columns {
	width: 100%;
	height: auto;
}

	section.listing-two-columns .listing-title {
		width: 100%;
		height: auto;
		padding-bottom: 40px;
		text-align: center;
	}

		section.listing-two-columns .listing-title span.title {
			font-size: 34px;
			font-weight: 400;
			color: #000;
		}

section.listing-two-columns .items {
	width: 100%;
	height: auto;
	padding-top: 20px;
}

	section.listing-two-columns .items .item {
		display: inline-block;
		overflow: hidden;
		vertical-align: top;
		width: 601px;
		height: auto;
		margin: 0 32px 80px 0;
		opacity: 1;
		transition: opacity 0.3s ease;
	}

	section.listing-two-columns .items .item:hover {
		opacity: 0.75;
	}

	section.listing-two-columns .items .item:nth-child(2n+0) {
		margin: 0 0 0 0;
	}

		section.listing-two-columns .items .item a.image {
			width: 100%;
			height: auto;
		}

		section.listing-two-columns .items .item a.image img {
			width: 100%;
			height: auto;
		}

		section.listing-two-columns .items .item img {
			width: 100%;
			height: auto;
		}

	section.listing-two-columns .items .item .title {
		margin-top: 30px;
		width: 75%;
		display: block;
		font-size: 28px;
		font-weight: 500;
		color: #000;
	}

		section.listing-two-columns .items .item .subtitle {
			width: 80%;
			margin-top: 5px;
			font-size: 18px;
			font-weight: 400;
			color: #000;
		}

		section.listing-two-columns .items .item .location {
			width: 100%;
			margin-top: 15px;
			font-size: 16px;
			font-weight: 400;
			color: #000;
		}

		section.listing-two-columns .items .item .dates {
			width: 100%;
			margin-top: 30px;
			font-size: 16px;
			font-weight: 400;
			color: #8C8C8C;
		}

	section.listing-two-columns .listing-error {
		width: 100%;
		padding-bottom: 40px;
		text-align: center;
		font-size: 24px;
		color: #C7C7C7;
	}





/*
COMPOSITION: PAGE FULLWIDHT SEPERATOR */

div.fw-seperator {
	width: 1240px;
	height: 1px;
	margin: 50px auto 70px auto;
	background-color: #E5E5E5;
}





/*
COMPOSITION: PAGE LIST # THREE COLUMNS */

section.listing-three-columns {
	width: 100%;
	height: auto;
	padding-top: 70px;
}

	section.listing-three-columns .items {
		width: 100%;
		height: auto;
	}

		section.listing-three-columns .items .item {
			display: inline-block;
			overflow: hidden;
			vertical-align: top;
			width: 387px;
			height: auto;
			margin: 0 32px 80px 0;
			opacity: 1;
			transition: opacity 0.3s ease;
		}

		section.listing-three-columns .items .item:hover {
			opacity: 0.75;
		}

		section.listing-three-columns .items .item:nth-child(3n+0) {
			margin: 0 0 80px 0;
		}

			section.listing-three-columns .items .item a.image {
				width: 100%;
				height: auto;
			}

				section.listing-three-columns .items .item a.image img {
					width: 100%;
					height: auto;
					border: 1px solid #f2f2f2;
				}

			section.listing-three-columns .items .item .title {
				margin-top: 30px;
				width: 85%;
				line-height: 32px;
			}

				section.listing-three-columns .items .item .dates {
					width: 100%;
					margin-top: 20px;
					font-size: 16px;
					font-weight: 400;
					color: #8C8C8C;
				}





/*
COMPOSITION: ARTIST LIST */

section.artist-list {
	width: 100%;
	height: auto;
	padding-bottom: 70px;
	margin-top: 50px;
	text-align: center;
}

	section.artist-list a.artist {
		display: inline-block;
		width: 100%;
		height: auto;
		margin-top: 15px;
	}

		section.artist-list a.artist:hover .thick-line {
			top: 72px;
			transition-delay: 0.15s;
		}

		section.artist-list a.artist:hover .name {
			text-shadow: 0px 0px 1px rgb(0, 0, 0);
			letter-spacing: 1px;
		}

		section.artist-list a.artist .name {
			width: 100%;
			height: auto;
			z-index: 1;
			transition: letter-spacing 0.25s ease-in-out, text-shadow 0.25s ease-in-out;
			transition-delay: 0.15s;
			letter-spacing: normal;
		}

			section.artist-list a.artist .thick-line {
				position: absolute;
				top: 48px;
				width: 100%;
				height: 25px;
				background-color: #fff;
				z-index: 2;
				transition: top 0.3s ease-in-out;
				transition-delay: 0.15s;
			}





/*
COMPOSITION: ABOUT US */

section.about-us-details {
	width: 100%;
	height: auto;
	padding: 0 0 80px 0;
	text-align: left;
}

	section.about-us-details p.description {
		width: 820px;
		margin: auto;
		height: auto;
		font-size: 20px;
		font-weight: 400;
		color: #000;
		line-height: 30px;
	}

	section.about-us-details .mini-gallery {
		width: 100%;
		height: auto;
		margin-top: 100px;
	}

		section.about-us-details .mini-gallery .item {
			display: inline-block;
			overflow: hidden;
			vertical-align: top;
			width: 600px;
			height: auto;
			margin: 0 32px 32px 0;
		}

		section.about-us-details .mini-gallery .item:nth-child(2n+0) {
			margin: 0 0 32px 0;
		}

			section.about-us-details .mini-gallery .item img {
				width: 100%;
				height: auto;
			}





/*
COMPOSITION: CONTACT US */

section.contact-us-details {
	width: 100%;
	height: auto;
	padding: 0 0 80px 0;
	text-align: left;
}

	section.contact-us-details .address-block {
		width: 100%;
		height: auto;
		text-align: center;
	}

		section.contact-us-details .address-block h2.title {
			width: 700px;
			margin: auto;
			height: auto;
			font-size: 24px;
			font-weight: 400;
			color: #000;
		}

		section.contact-us-details .address-block p.address {
			width: 700px;
			margin: 40px auto;
			height: auto;
			line-height: 30px;
			font-size: 24px;
			font-weight: 500;
			color: #000;
		}

	section.contact-us-details .details-block {
		width: 100%;
		height: auto;
		text-align: center;
	}

		section.contact-us-details .details-block span.phone {
			display: inline-block;
			width: 700px;
			margin: auto;
			height: auto;
		}

		section.contact-us-details .details-block span.email {
			display: inline-block;
			width: 700px;
			margin: 0 auto 0 auto;
			height: auto;
		}

		section.contact-us-details .details-block span.hours {
			display: inline-block;
			width: 700px;
			margin: 25px auto 0 auto;
			height: auto;
			line-height: 24px;
			font-size: 16px;
			font-weight: 400;
			color: #999999;
		}

		section.contact-us-details .details-block ul.social-links {
			width: 700px;
			height: auto;
			margin: 60px auto 0 auto;
		}

			section.contact-us-details .details-block ul.social-links li {
				display: inline-block;
				vertical-align: middle;
				width: auto;
				height: auto;
				margin-right: 50px;
				opacity: 1;
				transition: opacity 0.3s ease;
			}

			section.contact-us-details .details-block ul.social-links li:last-child {
				margin-right: 0;
			}

			section.contact-us-details .details-block ul.social-links li:hover {
				opacity: 0.5;
				;
			}

				section.contact-us-details .details-block ul.social-links li a.facebook img {
					width: 9px;
					height: auto;
				}

				section.contact-us-details .details-block ul.social-links li a.twitter img {
					width: 20px;
					height: auto;
				}

				section.contact-us-details .details-block ul.social-links li a.instagram img {
					width: 20px;
					height: auto;
				}

		section.contact-us-details .subscriber-block {
			width: 100%;
			height: auto;
		}

			section.contact-us-details .subscriber-block h2.title {
				width: 700px;
				margin: auto;
				height: auto;
				text-align: center;
				font-size: 24px;
				font-weight: 400;
				color: #000;
			}

			section.contact-us-details .subscriber-block .form-section {
				vertical-align: top;
				width: 820px;
				margin: auto;
				height: auto;
				margin-top: 60px;
			}

				section.contact-us-details .subscriber-block .form-section .element-01 {
					display: inline-block;
					float: left;
					width: 285px;
					height: 55px;
				}

					section.contact-us-details .subscriber-block .form-section .element-01 input[type=text] {
						width: 100%;
						height: 55px;
						background: #fff;
						border-top: 0;
						border-left: 0;
						border-right: 0;
						border-bottom: 2px solid #E5E5E5;
						font-family: futura-pt, sans-serif;
						font-style: normal;
						font-size: 16px;
						font-weight: 400;
						color: #737373;
					}

				section.contact-us-details .subscriber-block .form-section .element-02 {
					display: inline-block;
					float: left;
					width: 285px;
					height: 55px;
					margin-left: 30px;
				}

					section.contact-us-details .subscriber-block .form-section .element-02 input[type=email] {
						width: 100%;
						height: 55px;
						background: #fff;
						border-top: 0;
						border-left: 0;
						border-right: 0;
						border-bottom: 2px solid #E5E5E5;
						font-family: futura-pt, sans-serif;
						font-style: normal;
						font-size: 16px;
						font-weight: 400;
						color: #737373;
					}

				section.contact-us-details .subscriber-block .form-section .element-03 {
					display: inline-block;
					width: 180px;
					height: 55px;
					margin-left: 30px;
				}

					section.contact-us-details .subscriber-block .form-section .element-03 input[type=submit] {
						width: 100%;
						height: 55px;
						border-top: 0;
						border-left: 0;
						border-right: 0;
						border-bottom: 0;
						cursor: pointer;
						font-family: futura-pt, sans-serif;
						font-style: normal;
						font-size: 18px;
						font-weight: 400;
						color: #737373;
						background-color: #F2F2F2;
					}

		section.contact-us-details .map-block {
			width: 100%;
			margin-top: 120px;
			height: 650px;
			background-color: #f2f2f2;
		}

		section.contact-us-details .seperator-v1 {
			width: 700px;
			height: 1px;
			margin: 50px auto;
			background-color: #D8D8D8;
		}

		section.contact-us-details .seperator-v2 {
			width: 1028px;
			height: 1px;
			margin: 50px auto;
			background-color: #D8D8D8;
		}





/*
COMPOSITION: SHOWCASE WELCOME */

section.showcase-welcome {
	width: 100%;
	text-align: center;
	background-color: #000000;
	background-size: cover;
	background-position: center center;
}

	section.showcase-welcome .showcase-overlay {
		position: absolute;
		width: 100%;
		height: 100%;
		background-color: #000;
		opacity: 0.25;
		transition: opacity, 0.3s ease;
	}

	section.showcase-welcome:hover .showcase-overlay {
		opacity: 0.35;
	}


	section.showcase-welcome .future-exhibition-date {
		width: 70%;
		height: auto;
		display: inline-block;
		margin-top: 80px;
		font-size: 18px;
		font-weight: 400;
		color: #ffffff;
	}

	section.showcase-welcome .future-exhibition-details {
		width: 70%;
		height: auto;
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
	}

		section.showcase-welcome .future-exhibition-details .future-exhibition-subtitle {
			width: 100%;
			height: auto;
			margin-top: 20px;
			font-size: 24px;
			font-weight: 300;
			color: #ffffff;
		}





/*
COMPOSITION: EXHIBITION SHOWCASE */

section.showcase-current-exhibition {
	width: 100%;
	text-align: center;
	background-color: #000000;
	background-size: cover;
	background-position: center center;
	margin-bottom: 100px;
}

	section.showcase-current-exhibition .current-exhibition-date {
		width: 70%;
		height: auto;
		display: inline-block;
		margin-top: 80px;
		font-size: 18px;
		font-weight: 400;
		color: #ffffff;
	}

	section.showcase-current-exhibition .current-exhibition-details {
		width: 70%;
		height: auto;
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
	}

		section.showcase-current-exhibition .current-exhibition-details .current-exhibition-title {
			width: 100%;
			height: auto;
			font-size: 82px;
			font-weight: 400;
			color: #ffffff;
		}

	a.current-exhibition-link {
		font-size: 82px;
		font-weight: 400;
		color: #ffffff;
		text-decoration: none;
	}

	a.current-exhibition-link:hover {
		color: #f8f8f8;
		text-decoration: none;
	}

		section.showcase-current-exhibition .current-exhibition-details .current-exhibition-subtitle {
			width: 100%;
			height: auto;
			margin-top: 20px;
			font-size: 24px;
			font-weight: 300;
			color: #ffffff;
		}

	.showcase-error {
		width: 100%;
		padding-bottom: 80px;
		margin-bottom: 80px;
		border-bottom: 1px solid #E5E5E5;
		text-align: center;
		font-size: 24px;
		color: #C7C7C7;
	}


	
/*

  RESPONSOVE MEDIA QUERIES START
  RESPONSOVE MEDIA QUERIES START
  RESPONSOVE MEDIA QUERIES START
  RESPONSOVE MEDIA QUERIES START
  RESPONSOVE MEDIA QUERIES START
  RESPONSOVE MEDIA QUERIES START

*/



@media all and (max-width: 767px) {


	section.page-gallery-alone-image {
		width: 100%;
		background-color: tomato;
		display: block;
		margin-top: -40px;
	}
		section.page-gallery-alone-image img {
			width: 100%;
			height: auto;
		}


	#grid {
		width: 100%;
	}

	#navigation {
		width: 315px;
	}

		#navigation ul.navigation-list {
			margin-top: 120px;
		}

		#navigation .nav-close {
			top: 30px;
			right: 40px;
		}

	section.page-intro {
		padding: 50px 0 50px 0;
	}

		section.page-intro span.dates {
			padding-bottom: 50px;
			font-size: 16px;
			font-weight: 300;
			color: #000;
		}

		section.page-intro h1.page-title {
			width: 85%;
			font-size: 34px;
			font-weight: 400;
			color: #000;
			line-height: 38px;
		}

		section.page-intro .more-intro {
			padding-top: 40px;
		}

		section.page-intro .more-intro-exhibition {
			display: block;
			padding-top: 10px;
		}
	
			section.page-intro .more-intro .subtitle,
			section.page-intro .more-intro-exhibition .subtitle {
				width: 80%;
				margin: auto;
				margin-top: 20px;
				display: block;
				line-height: 20px;
				font-size: 16px;
				font-weight: 400;
				color: #000;
			}
	

			section.page-intro .more-intro .subtitle {
				width: 85%;
				font-size: 16px;
				font-weight: 400;
				color: #000;
				line-height: 20px;
			}

			section.page-intro .more-intro .location-data {
				margin-right: 0;
				font-size: 14px;
				font-weight: 400;
				color: #000;
				display: block;
			}

			section.page-intro .more-intro .date {
				margin-top: 10px;
				font-size: 14px;
				font-weight: 400;
				color: #000;
				display: block;
			}


	section.breadcrumb {
		top: 0px;
		padding-top: 35px;
		font-size: 18px;
		color: #B2B2B2;
		display: none;
	}

	section.page-single-image {
		width: 100%;
		margin: 40px 0 0 0;
		height: auto;
		text-align: center;
	}
	
		section.page-single-image img {
			margin: auto;
			max-width: 100%;
		}


	section.page-description {
		width: 100%;
		padding: 45px 0 75px 0;
		text-align: left;
	}

		section.page-description .audio-section {
			width: 90%;
			padding: 20px 0 20px 0;
		}

		section.page-description p.full-description {
			width: 90%;
			font-size: 16px;
			font-weight: 400;
			color: #000;
			line-height: 25px;
		}

		section.page-description p.short-detail {
			width: 90%;
			font-size: 14px;
			font-weight: 400;
			color: #666666;
			line-height: 20px;
		}


		section.page-description .line-seperator {
			left: 5%;
			margin: 40px 0 40px 0;
		}

		section.page-description ul.downloadable-items {
			width: 90%;
		}

			section.page-description ul.downloadable-items li {
				width: 100%;
				margin-top: 12px;
				font-size: 16px;
				font-weight: 400;
				color: #666666;
			}


	section.page-gallery {
		width: 100%;
		height: auto;
		text-align: center;
		background-color: #f2f2f2;
		display: none;
	}

	section.listing-two-columns {
		width: 100%;
		height: auto;
	}

		section.listing-two-columns .listing-title {
			width: 100%;
			height: auto;
			padding-bottom: 40px;
			text-align: center;
		}

			section.listing-two-columns .listing-title span.title {
				font-size: 20px;
				font-weight: 400;
				color: #000;
			}

		section.listing-two-columns .items .item {
			width: 100%;
			margin: 0 0 50px 0;
		}

		section.listing-two-columns .items .item:nth-child(2n+0) {
			margin: 0 0 50px 0;
		}

			section.listing-two-columns .items .item a.image {
				width: 100%;
				height: auto;
			}

				section.listing-two-columns .items .item a.image img {
					width: 100%;
					height: auto;
				}

			section.listing-two-columns .items .item .title {
				margin-top: 15px;
				width: 90%;
				left: 5%;
			}

			section.listing-two-columns .items .item .subtitle {
				width: 90%;
				left: 5%;
				margin-top: 15px;
				font-size: 15px;
				font-weight: 400;
				color: #000;
			}

/*
COMPOSITION: PAGE LIST # ONE COLUMN */

section.listing-one-column {
	margin-bottom: 60px;
}

	section.listing-one-column .listing-title {
		width: 100%;
		height: auto;
		padding-bottom: 40px;
		text-align: center;
	}

		section.listing-one-column .listing-title span.title {
			font-size: 20px;
			font-weight: 400;
			color: #000;
		}

	section.listing-one-column .list-item {
		width: 100%;
		margin-bottom: 40px;
		border-bottom: 0px;
	}

	section.listing-one-column .list-item:last-child {
		margin-bottom: 0px;
		border-bottom: 0px;
	}

		section.listing-one-column .list-item .section-left {
			display: block;
			width: 100%;
			height: auto;
		}

			section.listing-one-column .list-item .section-left img {
				width: 100%;
				height: auto;
			}

		section.listing-one-column .list-item .section-right {
			display: block;
			overflow: hidden;
			vertical-align: top;
			margin-left: 5%;
			padding-left: 0;
			width: 90%;
			height: auto;
		}

			section.listing-one-column .list-item .section-right .fexh-dates {
				margin-top: 15px;
				width: 100%;
				font-size: 14px;
				font-weight: 400;
				color: #8C8C8C;
			}

			section.listing-one-column .list-item .section-right .fexh-title {
				margin-top: 5px;
				width: 100%;
				line-height: 24px;
				font-size: 22px;
				font-weight: 500;
				color: #000;
			}

			section.listing-one-column .list-item .section-right .fexh-subtitle {
				margin-top: 20px;
				width: 100%;
				font-size: 14px;
				font-weight: 400;
				color: #000;
			}

		section.listing-one-column .listing-error {
			width: 100%;
			padding-bottom: 20px;
			text-align: center;
			font-size: 18px;
			color: #C7C7C7;
		}

		.showcase-error {
			width: 100%;
			padding-bottom: 40px;
			margin-bottom: 40px;
			border-bottom: 1px solid #E5E5E5;
			text-align: center;
			font-size: 18px;
			color: #C7C7C7;
		}




	section.listing-two-columns .items .item .location {
		width: 90%;
		left: 5%;
		margin-top: 15px;
		font-size: 13px;
		font-weight: 400;
		color: #000;
	}

	section.listing-two-columns .items .item .dates {
		width: 90%;
		left: 5%;
		margin-top: 2px;
		font-size: 13px;
		font-weight: 400;
		color: #8C8C8C;
	}

	section.listing-two-columns .listing-error {
		width: 100%;
		padding-bottom: 20px;
		text-align: center;
		font-size: 18px;
		color: #C7C7C7;
	}



	div.fw-seperator {
		width: 90%;
		height: 1px;
		margin: 20px auto 50px auto;
		background-color: #E5E5E5;
	}

	section.listing-three-columns {
		width: 100%;
		height: auto;
		padding-top: 0px;
	}

	section.listing-three-columns .items {
		width: 100%;
		height: auto;
	}

	section.listing-three-columns .items .item {
		width: 100%;
		height: auto;
		margin: 0 0 50px 0;
	}

	section.listing-three-columns .items .item:hover {
		opacity: 0.75;
	}

	section.listing-three-columns .items .item:nth-child(3n+0) {
		margin: 0 0 50px 0;
	}

	section.listing-three-columns .items .item a.image {
		width: 100%;
		height: auto;
	}

	section.listing-three-columns .items .item a.image img {
		width: 100%;
		height: auto;
	}

	section.listing-three-columns .items .item .title {
		margin-top: 20px;
		left: 5%;
		width: 90%;
		line-height: 28px;
	}

	section.listing-three-columns .items .item .dates {
		left: 5%;
		width: 90%;
		margin-top: 20px;
		font-size: 14px;
	}

	section.artist-list {
		margin-top: 30px;
	}

	section.artist-list a.artist {
		width: 90%;
		margin-top: 20px;
	}

	section.artist-list a.artist:hover .name {
		text-shadow: 0px 0px 0px rgb(0, 0, 0);
		letter-spacing: 0px;
	}

	section.artist-list a.artist .name {
		width: 100%;
		height: auto;
	}

	section.artist-list a.artist .thick-line {
		display: none;
	}


	section.about-us-details {
		width: 100%;
		height: auto;
		padding: 0 0 80px 0;
		text-align: left;
	}

	section.about-us-details p.description {
		width: 90%;
		margin: auto;
		font-size: 16px;
		line-height: 25px;
	}

	section.about-us-details .mini-gallery {
		width: 100%;
		margin-top: 50px;
	}

	section.about-us-details .mini-gallery .item {
		width: 100%;
		margin: 0 0 2px 0;
	}

	section.about-us-details .mini-gallery .item:nth-child(2n+0) {
		margin: 0 0 2px 0;
	}

	section.contact-us-details .address-block h2.title {
		width: 90%;
		font-size: 15px;
		color: #8C8C8C;
	}

	section.contact-us-details .address-block p.address {
		width: 90%;
		margin: 20px auto;
		line-height: 26px;
		font-size: 22px;
	}

	section.contact-us-details .details-block {
		width: 100%;
	}

	section.contact-us-details .details-block span.phone {
		display: block;
		width: 90%;
	}

	section.contact-us-details .details-block span.email {
		display: block;
		width: 90%;
	}

	section.contact-us-details .details-block span.hours {
		display: block;
		width: 90%;
		line-height: 20px;
		font-size: 14px;
	}

	section.contact-us-details .details-block ul.social-links {
		width: 90%;
		height: auto;
		margin: 40px auto 0 auto;
	}

	section.contact-us-details .details-block ul.social-links li {
		display: inline-block;
		vertical-align: middle;
		width: auto;
		height: auto;
		margin-right: 50px;
		opacity: 1;
		transition: opacity 0.3s ease;
	}
	
	section.contact-us-details .details-block ul.social-links li:last-child {
		margin-right: 0;
	}

	section.contact-us-details .details-block ul.social-links li:hover {
		opacity: 0.5;
	}

	section.contact-us-details .details-block ul.social-links li a.facebook img {
		width: 9px;
		height: auto;
	}

	section.contact-us-details .details-block ul.social-links li a.twitter img {
		width: 20px;
		height: auto;
	}

	section.contact-us-details .details-block ul.social-links li a.instagram img {
		width: 20px;
		height: auto;
	}

	section.contact-us-details .subscriber-block {
		width: 100%;
		height: auto;
	}

	section.contact-us-details .subscriber-block h2.title {
		width: 90%;
		font-size: 22px;
	}

	section.contact-us-details .subscriber-block .form-section {
		vertical-align: top;
		width: 80%;
		margin: auto;
		height: auto;
		margin-top: 30px;
	}

	section.contact-us-details .subscriber-block .form-section .element-01 {
		display: inline-block;
		float: left;
		width: 100%;
		height: 55px;
	}

	section.contact-us-details .subscriber-block .form-section .element-01 input[type=text] {
		width: 100%;
	}

	section.contact-us-details .subscriber-block .form-section .element-02 {
		display: inline-block;
		float: none;
		width: 100%;
		height: 55px;
		margin-left: 0px;
		margin-top: 20px;
		background-color: tomato;
	}

	section.contact-us-details .subscriber-block .form-section .element-02 input[type=text] {
		width: 100%;
	}

	section.contact-us-details .subscriber-block .form-section .element-03 {
		display: block;
		width: 100%;
		height: 55px;
		margin-left: 0px;
		margin-top: 32px;
	}

	section.contact-us-details .subscriber-block .form-section .element-03 input[type=submit] {
		width: 100%;
	}

	section.contact-us-details .map-block {
		width: 100%;
		margin-top: 60px;
		height: 360px;
		background-color: #f2f2f2;
	}

	section.contact-us-details .seperator-v1 {
		width: 90%;
		height: 1px;
		margin: 35px auto;
		background-color: #D8D8D8;
	}

	section.contact-us-details .seperator-v2 {
		width: 90%;
		height: 1px;
		margin: 35px auto;
		background-color: #D8D8D8;
	}

	section.showcase-welcome .future-exhibition-date {
		width: 85%;
		margin-top: 60px;
		font-size: 16px;
	}

	section.showcase-welcome .future-exhibition-details {
		width: 85%;
	}

	section.showcase-welcome .future-exhibition-details .future-exhibition-title {
		line-height: 42px;
		font-size: 42px;
	}

	a.future-exhibition-link {
		font-size: 42px;
		font-weight: 400;
		color: #ffffff;
		text-decoration: none;
	}

	a.future-exhibition-link:hover {
		color: #f8f8f8;
		text-decoration: none;
	}

	section.showcase-welcome .future-exhibition-details .future-exhibition-subtitle {
		margin-top: 20px;
		font-size: 16px;
	}

	section.showcase-current-exhibition .current-exhibition-date {
		width: 85%;
		margin-top: 60px;
		font-size: 16px;
	}

	section.showcase-current-exhibition .current-exhibition-details {
		width: 85%;
	}

	a.current-exhibition-link {
		font-size: 42px;
		font-weight: 400;
		color: #ffffff;
		text-decoration: none;
	}

	a.current-exhibition-link:hover {
		color: #f8f8f8;
		text-decoration: none;
	}

	section.showcase-current-exhibition .current-exhibition-details .current-exhibition-title {
		line-height: 42px;
		font-size: 42px;
	}

	section.showcase-current-exhibition .current-exhibition-details .current-exhibition-subtitle {
		margin-top: 20px;
		font-size: 16px;
	}

}

@media all and (min-width: 768px) and (max-width: 1199px) {


	#grid {
		width: 700px;
	}

	section.page-intro {
		width: 100%;
		height: auto;
		padding: 80px 0 60px 0;
		text-align: center;
	}
	
	section.page-intro span.dates {
		padding-bottom: 70px;
		display: block;
		font-size: 18px;
		font-weight: 400;
		color: #000;
	}

	section.page-intro h1.page-title {
		display: block;
		width: 100%;
		margin: auto;
		font-size: 58px;
		font-weight: 400;
		color: #000;
		line-height: 60px;
	}
	
	section.page-intro .more-intro {
		display: block;
		padding-top: 35px;
	}

	section.page-intro .more-intro .subtitle {
		display: block;
		font-size: 20px;
		font-weight: 400;
		color: #000;
	}

	section.page-intro .more-intro .location-data {
		margin-right: 20px;
		font-size: 16px;
		font-weight: 400;
		color: #000;
	}

	section.page-intro .more-intro .date {
		font-size: 16px;
		font-weight: 400;
		color: #000;
	}

	section.breadcrumb {
		top: 0px;
		padding-top: 40px;
		font-size: 18px;
		color: #B2B2B2;
	}

	section.page-single-image {
		width: 100%;
		margin: auto;
		height: auto;
		text-align: center;
	}

	section.page-single-image img {
		margin: auto;
		max-width: 700px;
	}

	section.page-description {
		width: 100%;
		padding: 65px 0 75px 0;
	}

	section.page-description .audio-section {
		width: 620px;
		padding: 20px 0 40px 0;
	}

	section.page-description p.full-description {
		width: 620px;
		font-size: 20px;
		font-weight: 400;
		color: #000;
		line-height: 30px;
	}

	section.page-description p.short-detail {
		width: 620px;
		padding-top: 80px;
		font-size: 14px;
		font-weight: 400;
		color: #666666;
		line-height: 18px;
	}

	section.page-description .line-seperator {
		left: 40px;
		margin: 50px 0 50px 0;
	}

	section.page-description ul.downloadable-items {
		width: 620px;
	}

	section.page-description ul.downloadable-items li {
		width: 100%;
		margin-top: 12px;
		font-size: 18px;
		font-weight: 400;
		color: #666666;
	}

	section.page-gallery {
		width: 100%;
		height: auto;
		text-align: center;
		background-color: #f2f2f2;
	}


	/*
	COMPOSITION: PAGE LIST # ONE COLUMN */


		section.listing-one-column .list-item .section-left {
			width: 340px;
			height: 228px;
		}

		section.listing-one-column .list-item .section-right {
			margin-left: 10px;
			width: 340px;
			height: 228px;
		}

			section.listing-one-column .list-item .section-right .fexh-dates {
				margin-top: 20px;
				font-size: 14px;
			}

			section.listing-one-column .list-item .section-right .fexh-title {
				margin-top: 30px;
				width: 60%;
				line-height: 32px;
				font-size: 28px;
			}

			section.listing-one-column .list-item .section-right .fexh-subtitle {
				margin-top: 15px;
				font-size: 16px;
			}


	section.listing-two-columns .listing-title {
		width: 100%;
		height: auto;
		padding-bottom: 50px;
		text-align: center;
	}

	section.listing-two-columns .listing-title span.title {
		font-size: 28px;
		font-weight: 400;
		color: #000;
	}

	section.listing-two-columns .items {
		width: 100%;
		height: auto;
	}

	section.listing-two-columns .items .item {
		width: 85%;
		margin: 0 20px 60px 0;
	}

	section.listing-two-columns .items .item .title {
		margin-top: 15px;
	}
	
	section.listing-two-columns .items .item .subtitle {
		width: 100%;
		margin-top: 10px;
		font-size: 14px;
		font-weight: 400;
		color: #000;
	}

	section.listing-two-columns .items .item .location {
		width: 100%;
		margin-top: 15px;
		font-size: 13px;
		font-weight: 400;
		color: #000;
	}

	section.listing-two-columns .items .item .dates {
		width: 100%;
		margin-top: 4px;
		font-size: 13px;
		font-weight: 400;
		color: #8C8C8C;
	}

	div.fw-seperator {
		width: 700px;
		height: 1px;
		margin: 50px auto 70px auto;
		background-color: #E5E5E5;
	}

	section.listing-three-columns .items .item {
		width: 337px;
		margin: 0 20px 80px 0;
	}

	section.listing-three-columns .items .item:nth-child(3n+0) {
		margin: 0 20px 80px 0;
	}

	section.listing-three-columns .items .item:nth-child(2n+0) {
		margin: 0 0 80px 0;
	}

	section.artist-list a.artist {
		display: inline-block;
		width: 100%;
		height: auto;
		margin-top: 20px;
	}

	section.artist-list a.artist:hover .thick-line {
		top: 72px;
		transition-delay: 0.15s;
	}

	section.artist-list a.artist:hover .name {
		text-shadow: 0px 0px 0px rgb(0, 0, 0);
		letter-spacing: 0px;
	}

	section.artist-list a.artist .name {
		width: 100%;
		height: auto;
		font-size: 48px;
		transition: letter-spacing 0.25s ease-in-out, text-shadow 0.25s ease-in-out;
		transition-delay: 0.15s;
	}

	section.artist-list a.artist .thick-line {
		display: none;
	}
	
	section.about-us-details p.description {
		width: 620px;
	}

	section.about-us-details .mini-gallery .item {
		width: 100%;
		margin: 0 0 32px 0;
	}
	
	section.about-us-details .mini-gallery .item:nth-child(2n+0) {
		margin: 0 0 32px 0;
	}
	
	section.about-us-details .mini-gallery .item img {
		width: 100%;
		height: auto;
	}

	section.contact-us-details .subscriber-block .form-section {
		width: 700px;
	}

	section.contact-us-details .subscriber-block .form-section .element-01 {
		width: 225px;
	}

	section.contact-us-details .subscriber-block .form-section .element-02 {
		width: 225px;
	}

	section.contact-us-details .subscriber-block .form-section .element-03 {
		display: inline-block;
		width: 190px;
		height: 55px;
		margin-left: 30px;
	}

	section.contact-us-details .map-block {
		width: 100%;
		margin-top: 120px;
		height: 650px;
		background-color: #f2f2f2;
	}

	section.contact-us-details .seperator-v2 {
		width: 700px;
	}
	
	section.showcase-welcome .future-exhibition-date {
		margin-top: 60px;
		font-size: 16px;
	}
	
	section.showcase-welcome .future-exhibition-details .future-exhibition-title {
		font-size: 62px;
	}

	a.future-exhibition-link {
		font-size: 62px;
		font-weight: 400;
		color: #ffffff;
		text-decoration: none;
	}

	a.future-exhibition-link:hover {
		color: #f8f8f8;
		text-decoration: none;
	}

	section.showcase-welcome .future-exhibition-details .future-exhibition-subtitle {
		margin-top: 10px;
		font-size: 20px;
	}

	section.showcase-current-exhibition .current-exhibition-date {
		margin-top: 60px;
		font-size: 16px;
	}

	section.showcase-current-exhibition .current-exhibition-details .current-exhibition-title {
		font-size: 62px;
	}

	a.current-exhibition-link {
		font-size: 62px;
		font-weight: 400;
		color: #ffffff;
		text-decoration: none;
	}

	a.current-exhibition-link:hover {
		color: #f8f8f8;
		text-decoration: none;
	}

	section.showcase-current-exhibition .current-exhibition-details .current-exhibition-subtitle {
		margin-top: 10px;
		font-size: 20px;
	}


}

@media all and (min-width: 1200px) and (max-width: 1399px) {

	section.showcase-welcome .future-exhibition-date {
		margin-top: 50px;
		font-size: 16px;
	}

	section.showcase-welcome .future-exhibition-details .future-exhibition-title {
		font-size: 72px;
	}

	section.showcase-welcome .future-exhibition-details .future-exhibition-subtitle {
		margin-top: 10px;
		font-size: 22px;
	}

	section.breadcrumb a.breadcrumb {
		width: 300px;
		left: 50%;
		margin-left: -265px;
		display: block;
	}

}