@font-face {
    font-family: 'gotham_book';
    src: url('../assets/fonts/gotham-book-webfont.eot');
    src: url('../assets/fonts/gotham-book-webfont.eot?#iefix') format('embedded-opentype'),
         url('../assets/fonts/gotham-book-webfont.woff') format('woff'),
         url('../assets/fonts/gotham-book-webfont.ttf') format('truetype'),
         url('../assets/fonts/gotham-book-webfont.svg#gotham_bookregular') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'gotham_bold';
    src: url('../assets/fonts/gotham-bold-webfont.eot');
    src: url('../assets/fonts/gotham-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../assets/fonts/gotham-bold-webfont.woff') format('woff'),
         url('../assets/fonts/gotham-bold-webfont.ttf') format('truetype'),
         url('../assets/fonts/gotham-bold-webfont.svg#gotham_boldregular') format('svg');
    font-weight: normal;
    font-style: normal;
}
:root {
	--main-text-color: #000;
	--home-item-padding: 40px;
}

body {
	width: 100vw;
	height: 100%;
	margin: 0px !important;
	font-family: 'gotham_book';
	letter-spacing:0.1em;
}
img {
	border: 0;
	outline : none;
}
a {
	outline : none;
}
b, strong {
	font-family: 'gotham_bold';
	font-weight: normal;
}
.header {
	position: fixed;
	z-index: 99999;
	top: 0px;
	left: 0px;
	width: 100%;
	background-color: #FFF;
	-moz-box-shadow:    0px 1px 1px 1px rgba(0,0,0,0.1);
	-webkit-box-shadow: 0px 1px 1px 1px rgba(0,0,0,0.1);
	box-shadow:         0px 1px 1px 1px rgba(0,0,0,0.1);
}
.header-logo {
	position: relative;
	width: 100%;
	padding-top: 40px;
	padding-bottom: 40px;
	font-family: 'gotham_bold';
	text-align: center;
	font-size: 32px;
	letter-spacing:0.1em;
}
.header-logo a, .header-logo a:active, .header-logo a:visited {
	color: var(--main-text-color);
	text-decoration: none;
}
.backButton {
	position: absolute;
	left: 40px;
	bottom: 40px;
	font-family: 'gotham_bold';
	font-weight: normal;
	text-transform: uppercase;
	font-size: 14px;
	letter-spacing:0.1em;
	z-index: 9999;
}
.backButton a {
	color: #000;
	text-decoration:none;
}
.header-menu {
	position: relative;
	width: 100%;
	text-align: center;
	font-family: 'gotham_book';
	font-weight: bold;
	text-transform: uppercase;
	font-size: 14px;
	letter-spacing:0.1em;
	padding-bottom: 40px;
}
.header-menu a {
	color: var(--main-text-color);
	padding-left: 20px;
	padding-right: 20px;
	text-decoration: none;
}
.home-container, .project-container  {
	position: relative;
	margin-top: 172px;
	width: 100%;
}
.home-item, .project-item {
	position: relative;
	width: 100%;
	height: calc(90vh - 172px);
	background-repeat: no-repeat;
	/*background-attachment: fixed;*/
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}
.project-item {
	height: calc(100vw * 0.5625) !important;
}
.project-image {
	width: 100%;
	height: auto;
	padding: 0;
	margin: 0;
}
.project-image-portrait {
	float: left;
	width: 33.33%;
	height: auto;
	padding: 0;
	margin: 0;
}
.home-item-text {
	position: absolute;
	z-index: 10;
	font-family: 'gotham_bold';
	font-size: 16px;
	line-height: 1.6em;
	text-transform: uppercase;
	color: #FFF;
	text-shadow: 0px 0px 2px rgba(0,0,0,0.35);
	width: 40%;
}
.home-item-text p {
	padding: 0;
	margin: 0;
}
.celebrity-portraits, .fashion-shoots {
	right: var(--home-item-padding) !important;
	bottom: var(--home-item-padding) !important;
	text-align: right !important;
	width: calc(100vw - 80px) !important;
}
.the-dream-for-wewantmore, .fashion-shoots, .les-inrockuptibles, .les-inrocks {
	left: var(--home-item-padding) !important;
	bottom: var(--home-item-padding) !important;
	text-align: left !important;
	width: 40% !important;
}
/*
.gutterdammerung p {
	color: #000 !important;
}
*/
.left-top {
	background-position: left top;
}
.left-center {
	background-position: left center;
}
.left-bottom {
	background-position: left bottom;
}
.right-top {
	background-position: right top;
}
.right-center {
	background-position: right center;
}
.right-bottom {
	background-position: right bottom;
}
.center-top {
	background-position: center top;
}
.center-center {
	background-position: center center;
}
.center-bottom {
	background-position: center bottom;
}

.left-top-text {
	right: var(--home-item-padding);
	bottom: var(--home-item-padding);
}
.left-center-text {
	right: var(--home-item-padding);
	bottom: var(--home-item-padding);
}
.left-bottom-text {
	right: var(--home-item-padding);
	top: var(--home-item-padding);
}
.right-top-text {
	left: var(--home-item-padding);
	bottom: var(--home-item-padding);
}
.right-center-text {
	left: var(--home-item-padding);
	bottom: var(--home-item-padding);
}
.right-bottom-text {
	left: var(--home-item-padding);
	top: var(--home-item-padding);
}
.center-top-text {
	left: var(--home-item-padding);
	bottom: var(--home-item-padding);
	width: calc(100% - 80px);
	text-align: center;
}
.center-center-text {
	left: var(--home-item-padding);
	bottom: var(--home-item-padding);
	width: calc(100% - 80px);
	text-align: center;
}
.center-bottom-text {
	left: var(--home-item-padding);
	top: var(--home-item-padding);
	width: calc(100% - 80px);
	text-align: center;
}
.project-detail {
	position:relative;
	left: 15vw;
	width: 70vw;
	font-family: 'gotham_book';
	font-size: 1.7vh;
	line-height: 1.6em;
	text-align: center;
	padding-top: var(--home-item-padding);
	padding-bottom: 40px;
}
.project-detail h1, h2 {
	font-family: 'gotham_bold';
	font-weight: normal;
	font-size: 2vh;
	text-transform: uppercase;
	text-align: center;
}
.project-detail a, .project-detail a:visited, .project-detail a:active, .project-detail a:hover {
	color: #000;
	text-decoration: none;
	padding-bottom: 2px;
	border-bottom: 1px solid #000;
}
.embed {
	position: relative;
	/*left: 5vw;*/
	width: 100vw;
	height:  calc(82vh - 172px);
	padding-bottom: 40px;
	
	display: flex;
	align-items: center;
	justify-content: center;
  
	/*height:  calc(100vh - 172px);*/
}
.embed-container {
  --video--width: 3000;
  --video--height: 1688;

  position: relative;
  overflow: hidden;
  
  /*padding-bottom: calc(var(--video--height) / var(--video--width) * 100%); /* 41.66666667% */
  width:  calc(var(--video--width) / var(--video--height) * 100%);
  height: 100%;
  /*
  padding-bottom: calc(var(--video--height) / var(--video--width) * 100%);
  max-width: 100%;
  */
  
}

.embed-container iframe,
.embed-container object,
.embed-container embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
@media (max-width: 960px) {
	.project-detail {
		left: 0vw !important;
		width: 100vw !important;
	}
	.project-detail p {
		padding-left: 5vw !important;
		padding-right: 5vw !important;
	}
	.bjorn {
		width: 100%;
		height: auto;
	}
	.home-item-text {
		left: var(--home-item-padding) !important;
		right: var(--home-item-padding) !important;
		width: calc(100vw - 80px);
		text-align: center !important;
	}
	.embed {
	    width: 100vw;
	    height: calc(100vw * 0.5625) !important;
	    /* height: calc(100vh - 172px); */
	}
	.project-image-portrait {
		width: 100% !important;
	}
}