/* ==========================================================================
   Styling voor detailpagina Artiest
============================================================================= */
.single-project .x-section { margin-bottom: 0 !important; }

.project-detail .section__intro { text-align: left !important; }

/* LAYOUT */
.project-detail__gallery { width: 55% !important; }
.project-detail__content { width: 40% !important; }




/* GALLERY */
.project-detail__gallery ul {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	margin-left: -10px;
	margin-right: -10px;
}

.project-detail__gallery li {
	display: block;
	width: calc( 100%/4);
	padding: 0 10px;
	overflow: hidden;
	margin-bottom: 30px;
}

/* .project-detail__gallery li:first-of-type { width: 100% !important; } */


.project-detail__gallery a {
	position: relative;
	border-radius: 50%;
	overflow: hidden;
	display: block !important;
}

.project-detail__gallery a:before {
	content: '';
	display: block;
	padding-bottom: 100%;
}


.project-detail__gallery img {
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translateX( -50% ) translateY( -50% );
	-ms-transform: translateX( -50% ) translateY( -50% );
	transform: translateX( -50% ) translateY( -50% );
}

.project-detail__gallery img.portrait { width: 100% !important; height: auto !important; }
.project-detail__gallery img.landscape { height: 100% !important; width: auto !important; max-width: none !important; }








/* CONTENT */
.project-detail__content {  }
.project-detail__content h1 { margin-bottom: 35px; }
.project-detail__content p { margin-bottom: 15px; }
.project-detail__content p:last-child { margin-bottom: 0; }


/* CTA */

.project-detail__cta {
	padding: 40px;
	background-color: #01547e;
	text-align: center;
	margin-top: 50px;

}

.project-detail__cta h5,
.project-detail__cta h6 { color: #fff; }

.project-detail__cta h5 { font-size: 21px; margin-bottom: 15px !important; }
.project-detail__cta h6 { font-size: 16px; font-weight: normal; }

.project-detail__cta .x-btn { margin-top: 25px; }















@media screen and ( max-width: 1024px ) {}
@media screen and ( max-width: 768px ) {}
@media screen and ( max-width: 540px ) {
	.project-detail .x-container.flex {
		-webkit-box-orient: vertical;
		-webkit-box-direction: reverse;
		-ms-flex-direction: column-reverse;
		flex-direction: column-reverse;
	}

	.project-detail__gallery,
	.project-detail__content { width: 100% !important; }

	.project-detail__content { margin-bottom: 30px !important; }

	.project-detail__content h1 { margin-bottom: 15px; }

	.project-detail__cta { margin-top: 20px; padding: 20px; }

	.project-detail__cta h5 { font-size: 16px; }
	.project-detail__cta h6 { font-size: 14px; }

	.project-detail__cta .x-btn { margin-top: 15px; }
}