.project {
	width: 100%;
	overflow: hidden;
}

.project .intro {
	position: relative;
	width: 100%;
	padding-bottom: 48%;
}

.project .intro.vimeo {
	padding-bottom: 0;
}

.project .intro .pictureContainer,
.project .intro picture,
.project .intro .videoContainer {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	padding-bottom: 0 !important;
}

.vimeoEmbed .vimeoCover {
	z-index: 2;
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	transition-property: opacity;
}

.vimeoEmbed.started .vimeoCover {
	opacity: 0;
	pointer-events: none;
}

.vimeoEmbed .plyr__video-embed,
.vimeoEmbed .plyr.plyr--video {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.vimeoEmbed .plyr.plyr--video.plyr--fullscreen-fallback,
.playing-fullscreen .vimeoEmbed .plyr.plyr--video.plyr--fullscreen {
	position: fixed;
}

.vimeoEmbed .plyr.plyr--video.plyr--fullscreen-fallback .plyr__video-embed {
	position: relative;
	top: 50%;
	transform: -webkit-translateY(-50%);
	transform: translateY(-50%);
}

.playing-fullscreen .vimeoEmbed .plyr.plyr--video .plyr__video-embed {
	position: relative;
}

.vimeoEmbed .plyr.plyr--video iframe {
	pointer-events: none;
}

.intro.vimeo {
	cursor: none;
}

.plyr--video.plyr--hide-controls .plyr__controls {
	z-index: 2;
}

.project .header {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	margin-bottom: 80px;
}

.project .header .column {
	width: 25%;
	padding-right: var(--main-padding-space);
}

.project .header .column .row {
	clear: both;
	float: left;
	width: 100%;
	display: flex;
	flex-wrap: wrap;
}

.project .header .column .row span {	
	float: left;
}

.project .header .column .row > * {
	width: calc(100% - var(--label-width));
}

.project .header .column .row ul {
	list-style: none;
}

.project .header .column .row ul li {
	width: 100%;
	display: inline-block;
	margin-bottom: -4px;
}

.project .header .column .row ul li:after {
	content: ",";
}

.project .header .column .row ul li:last-child:after{
	content: "";
}

.project .header .column .row span.label {
	width: var(--label-width);
}

.project .header .column .row a:hover {
	color: var(--fourth-color);
}

.project .header .column .row div {
	display: inline-block;
}

.project .module {
	position: relative;
	display: block;
	z-index: 1;
	margin-bottom: var(--main-padding-space);
}

.project .module.columns {
	display: grid;
	-webkit-grid-gap: var(--main-padding-space);
	grid-gap: var(--main-padding-space);
	-webkit-grid-template-columns: repeat(2, 1fr);
	grid-template-columns: repeat(2, 1fr);
	overflow: visible;
}

.project .module.columns.c3,
.project .module.columns.c3466,
.project .module.columns.c6634 {
	-webkit-grid-template-columns: repeat(3, 1fr);
	grid-template-columns: repeat(3, 1fr);
}

.project .module.columns .columnm {
	-webkit-grid-column: span 1;
	grid-column: span 1;
}

.project .module.columns.c6634 .column:first-child,
.project .module.columns.c3466 .column:last-child {
	-webkit-grid-column: span 2;
	grid-column: span 2;
}

.project .module.columns .column.text {
	display: flex;
	flex-wrap: wrap;
}

.project .module.columns .text .left {
	width: var(--label-width);
	padding-right: var(--main-padding-space);
}

.project .module.columns .text .right {
	width: -webkit-calc(100% - var(--label-width));
	width: calc(100% - var(--label-width));
}


.project .module.columns .text h2 {
	color: var(--third-color);
}

.project .module.columns .text h2 span:before {
	content: "[";
}

.project .module.columns .text h2 span:after {
	content: "]";
}


.project .module.columns .text h2 .typeWriteContainer,
.project .module.columns .text h2 .typewriterContent {
	display: inline-block;
}

.project .module.columns .text h2 .typewriterInside {
	left: 8px;
	top: 1px;
	display: inline-block;
}

.project .module.columns .text p:last-child {
	margin-bottom: 0;
}

.project .module.columns .image,
.project .module.columns .mp4 {
	cursor: crosshair;
}

.project .module.columns .image picture,
.project .module.columns .image img.uncompressed {
	width: 100%;
	height: 100%;
	display: block;
}

.project .module.columns .image span,
.project .module.columns .mp4 span,
.project .module.carousel .swiper-slide span {
	margin-top: var(--main-padding-space);
	display: block;
}

.project .module.space > div {
	display: block;
	width: 100%;
}

.project .module.space .mobile {
	display: none;
}

.project .module.carousel {
	display: block;
	width: 100%;
	position: relative;
	left: var(--main-padding-space);
	padding-right: calc(var(--main-padding-space) * 2);
}

.swiper {
	overflow: visible;
}

.project .module.carousel .swiper-slide {
	width: auto !important;
}

.project .module.carousel .pictureContainer,
.project .module.carousel picture,
.project .module.carousel img.uncompressed,
.project .module.carousel picture img,
.project .module.carousel .videoContainer,
.project .module.carousel .videoContainer video {
	height: 32vw;
	width: auto;
	display: block;
	position: relative;
	padding-bottom: 0 !important;
}

.project .module.carousel .swiper-slide span  {
	max-width: 32vw;
}

.project .module.pagination {
	margin-top: 100px;
	display: flex;
	flex-wrap: wrap;
}

.project .module.pagination > a {
	width: 50%;
	float: left;
}

.project .module.pagination > a:hover {
	background: var(--sixth-color);
	color: var(--secondary-color);
}

.project .module.pagination .pictureContainer,
.project .module.pagination .videoContainer {
	margin-bottom: var(--main-padding-space);
	padding-bottom: 64% !important;
}

.project .module.pagination .nextLabel {
	display: block;
	width: 100%;
	float: left;
	color: var(--third-color);
}

.project .module.pagination a:hover .nextLabel {
	color: var(--fifth-color);
}

.project .module.pagination .typeWriteContainer {
	display: block;
}

.project .module.pagination .info {
	display: block;
	margin-top: var(--main-padding-space);
	float: left;
	width: 100%;
}

.project .module.pagination .info h2 {
	width: 50%;
	float: left;
	padding-right: var(--main-padding-space);
}

.project .module.pagination .info .fields {
	float: left;
	width: 50%;
}

.project .module.pagination .label {
	width: var(--label-width);
	padding-right: var(--main-padding-space);
	float: left;
}

.project .module.pagination .value {
	float: left;
	width: -webkit-calc(100% - var(--label-width));
	width: calc(100% - var(--label-width));
}

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

	.projectListThumbnails{
		display: none;
	}
	/*.projectList.listLayout,
	.projectList.listLayout[data-scroll-section]{
		visibility: visible;
		display: block;
	}*/

	.project .module.space > div {
		display: none;
	}

	.project .module.space .mobile {
		display: block;
	}

	.project .intro {
		padding-bottom: 64vh;
	}

	.project .header .column {
		width: 100% !important;
	}

	.project h1 {
		color: var(--fourth-color);
	}

	.project .header .column:first-child {
		margin-bottom: 32px;
	}

	.project .header .column {
		padding-right: 0;
	}

	.project .header .row {
		margin-bottom: 7px;
	}

	.project .module {
		margin-bottom: 40px;
	}

	.project .module.columns {
		display: block;
	}

	.project .module.columns .column {
		margin-bottom: var(--main-padding-space);
	}

	.project .module.columns .column:last-child {
		margin-bottom: 0;
	}

	.project .module.columns .image,
	.project .module.columns .mp4 {
		cursor: default;
	}

	.project .module.columns .text .left {
		width: 100%;
		padding-right: 0;
		margin-bottom: var(--main-padding-space)
	}

	.project .module.columns .text .right {
		width: 100%;
	}

	.project .module.carousel .pictureContainer,
	.project .module.carousel picture,
	.project .module.carousel img.uncompressed,
	.project .module.carousel picture img,
	.project .module.carousel .videoContainer,
	.project .module.carousel .videoContainer video {
		height: 50vw;
	}

	.project .module.carousel .swiper-slide span  {
		max-width: 50vw;
	}

	.project .module.carousel {
		overflow: hidden;
	}
}

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

	.project .module.carousel .pictureContainer,
	.project .module.carousel picture,
	.project .module.carousel picture img,
	.project .module.carousel .videoContainer,
	.project .module.carousel .videoContainer video {
		height: 80vw;
	}

	.project .module.carousel .swiper-slide span  {
		max-width: 80vw;
	}

	.project .pagination .previous {
		display: none;
	}

	.project .module.pagination > a.next {
		width: 100%;
	}
}