@charset "UTF-8";

/* general */

body {
	font-family: Helvetica, sans-serif;
	font-size: 14px;
	color: #000;
	background-color: #808080;
	-ms-overflow-style: none;
	scrollbar-width: none;
}
body::-webkit-scrollbar {
	display: none;
}

/* content */

#background {
	width: 100vw;
	height: 50vh;
	position: fixed;
	margin-top: 0px;
	margin-left: 0px;
	display: block;
	z-index: -1;
}
.header {
	width: calc((100vw - 25px) / 4);
	height: auto;
	position: fixed;
	margin-top: 10px;
	padding: 0 5px 0 5px;
	z-index: 2;
}
.header.first {
	margin-left: 0px;
	display: block;
}
.header.second {
	margin-left: calc(((100vw - 25px) / 4) + 5px);
	display: block;
}
.header.third {
	margin-left: calc((((100vw - 25px) / 4) * 2) + 10px);
	display: block;
}
.header.fourth {
	margin-left: calc((((100vw - 25px) / 4) * 3) + 15px);
	display: block;
}
#container {
	width: 100vw;
	height: auto;
	position: absolute;
	margin-top: 50vh;
	padding-bottom: calc(50vh - 5px);
	display: block;
}
#container.margin {
	padding-bottom: calc(50vh - 5px);
}
.text {
	width: calc((100vw - 25px) / 4);
	position: relative;
	margin-bottom: 5px;
	margin-left: 5px;
	float: left;
}
.text.last {
	margin-bottom: 5px;
}
.column {
	position: relative;
	margin-bottom: 5px;
	margin-left: 5px;
	float: left;
}
.column.margin {
	margin-bottom: 50vh;
}
.column.margin-mobile {
	margin-bottom: 0vh;
}
.column.desktop {
	display: block;
}
.column img {
	width: 100%;
	height: 100%;
	position: absolute;
	object-fit: cover;
	padding: 0px;
	display: block;
	z-index: 0;
}
.column.four.single {
	width: calc((100vw - 25px) / 4);
}
.column.four.info {
	width: calc((100vw - 25px) / 4);
	float: left;
}
.column.four.single-grid {
	width: calc((100vw - 25px) / 4);
}
.column.four.double {
	width: calc(((100vw - 25px) / 2) + 5px);
}
.column.four.photography {
	height: calc(((100vw - 25px) / 4) / 2 * 3);
}
.column.four.photography-grid {
	height: calc(((100vw - 25px) / 4) / 2 * 3);
}
.column.four.video {
	height: calc(((100vw - 25px) / 4) / 16 * 9);
}
.column.six.single {
	width: calc((100vw - 35px) / 6);
}
.column.six.double {
	width: calc(((100vw - 35px) / 3) + 5px);
}
.column.six.double-grid {
	width: calc(((100vw - 35px) / 3) + 5px);
}
.column.six.photography {
	height: calc(((100vw - 35px) / 6) / 2 * 3);
}
.column.six.video {
	height: calc(((100vw - 35px) / 3) / 16 * 9);
}
.column-text {
	width: auto;
	height: 16px;
	position: absolute;
	padding: 0 5px 0 5px;
	margin: 0 -5px 0 -5px;
	z-index: 1;
}
.text-unit {
	width: auto;
	height: auto;
	display: table;
	padding: 0 0 0 5px;
	margin: 0 0 0 -5px;
}
.text-unit.float {
	float: left;
	margin-right: 20px;
}
.text-unit.desktop {
	float: left;
	margin-right: 20px;
}
.policy {
	width: auto;
	height: auto;
	position: fixed;
	bottom: 0;
	left: 3px;
}

/* projects */

.project {
	width: calc(((100vw - 25px) / 4) * 2 + 5px);
	height: auto;
	position: relative;
	margin-bottom: 5px;
	margin-left: 5px;
	float: left;
}
.project.content {
	height: auto;
	position: relative;
	margin-bottom: 5px;
	margin-left: 0px;
}
.project.content.single {
	width: 100%;
}
.project.content.double.left {
	width: calc((100% - 5px) / 2);
	float: left;
	margin-right: 5px;
}
.project.content.double.right {
	width: calc((100% - 5px) / 2);
	float: left;
}
.project.content.last {
	margin-bottom: 0px;
}
.project img {
	width: 100%;
	height: auto;
	display: block;
	cursor: nesw-resize;
}
.project video {
	width: 100%;
	height: auto;
	display: block;
}

/* menu mobile */

#menu-mobile-icon {
	width: calc((100vw - 10px) / 2);
	height: auto;
	position: fixed;
	margin-top: 10px;
	right: 0;
	padding: 0 5px 0 5px;
	text-align: right;
	z-index: 1;
	display: none;
	cursor: ne-resize;
}
#menu-mobile {
	height: 100vh;
	width: 0vw;
	position: fixed;
	top: 0;
	left: 0;
	transition: 0.5s;
	overflow: hidden;
	background-color: #808080;
	z-index: 2;
}
#menu-mobile-nav {
	width: calc(100vw - 20px);
	height: calc(100dvh - 19px);
	position: absolute;
	top: 10px;
	right: 10px;
	text-align: right;
}
.menu-mobile-text-unit {
	width: auto;
	height: auto;
	position: absolute;
	right: 0;
	cursor: ne-resize;
}
.menu-mobile-text-unit.second {
	top: 20%;
	transform: translateY(-50%);
}
.menu-mobile-text-unit.third {
	top: 40%;
	transform: translateY(-50%);
}
.menu-mobile-text-unit.fourth {
	top: 60%;
	transform: translateY(-50%);
}
.menu-mobile-text-unit.fifth {
	top: 80%;
	transform: translateY(-50%);
}
.menu-mobile-text-unit.sixth {
	top: 100%;
	transform: translateY(-100%);
}

/* slideshow */

#slideshow {
	width: 0vw;
	height: 100vh;
	position: fixed;
	top: 0;
	left: 0;
	background-color: #808080;
	overflow: hidden;
	transition: 0.5s;
	z-index: 2;
}
#slideshow-nav {
	width: calc((100vw - 25px) / 4);
	height: auto;
	position: absolute;
	margin-top: 10px;
	margin-left: calc(((100vw - 25px) / 4) + 5px);
	bottom: auto;
	padding: 0 5px 0 5px;
	background-color: #808080;
	z-index: 3;
}
#prev, #next {
	width: auto;
	height: auto;
	position: relative;
	float: left;
	padding: 0 5px 0 5px;
	margin: 0 15px 0 -5px;
	color: #000;
}
#prev:hover {
	color: #000;
	background-color: #FFF;
	cursor: w-resize;
}
#next:hover {
	color: #000;
	background-color: #FFF;
	cursor: e-resize;
}
#slideshow-close {
	width: auto;
	height: auto;
	position: absolute;
	margin-top: 10px;
	margin-left: calc((((100vw - 25px) / 4) * 2) + 10px);
	right: auto;
	padding: 0 5px 0 5px;
	z-index: 3;
}
#slideshow-close:hover {
	color: #000;
	background-color: #FFF;
	cursor: ne-resize;
}
.slideshow-count {
	width: calc((100vw - 25px) / 4);
	height: auto;
	position: absolute;
	margin-top: 10px;
	margin-left: 10px;
	z-index: 3;
}
.slideshow-content {
	width: 100vw;
	height: 100vh;
	position: absolute;
	top: 0;
	left: 0;
}
.slideshow-content img {
	width: auto;
	max-width: calc(100vw - 20px);
	height: auto;
	max-height: calc(100vh - 46px);
	position: absolute;
	margin-top: 10px;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}
.slide {
  display: none;
}

/* classes */

.highlight {
	padding: 0 5px 0 5px;
	margin: 0 -5px 0 -5px;
	color: #000;
	background-color: #808080;
}
.highlight-reverse {
	color: #000;
	background-color: #FFF;
}
.last {
	margin-bottom: -5px;
}
.hide {
	display: none;
}

/* links */

a:link {
	padding: 0 5px 0 5px;
	margin: 0 0 0 -5px;
	color: #000;
	background-color: transparent;
	text-decoration: none;
}
a:visited {
	padding: 0 5px 0 5px;
	margin: 0 0 0 -5px;
	color: #000;
	background-color: transparent;
	text-decoration: none;
}
a:hover {
	padding: 0 5px 0 5px;
	margin: 0 0 0 -5px;
	color: #000;
	background-color: #808080;
	text-decoration: none;
	cursor: ne-resize;
}
a.image:link {
	padding: 0 0px 0 0px;
	margin: 0 0px 0 0px;
}
a.image:visited {
	padding: 0 0px 0 0px;
	margin: 0 0px 0 0px;
}
a.image:hover {
	padding: 0 0px 0 0px;
	margin: 0 0px 0 0px;
}
a.reverse:hover {
	padding: 0 5px 0 5px;
	margin: 0 -5px 0 -5px;
	color: #000;
	background-color: #FFF;
	text-decoration: none;
	cursor: ne-resize;
}
a.invisible:link {
	color: #000;
	background-color: transparent;
	text-decoration: none;
}
a.invisible:visited {
	color: #000;
	background-color: transparent;
	text-decoration: none;
}
a.invisible:hover {
	color: #FFF;
	background-color: transparent;
	text-decoration: none;
	cursor: ne-resize;
}
a.ssv:link {
	background-color: #425566;
	margin-left: 0px;
}
a.ssv:visited {
	background-color: #425566;
	margin-left: 0px;
}
a.ssv:hover {
	background-color: transparent;
	margin-left: 0px;
}
.menu-mobile-text-unit a:link {
	background-color: #808080;
}
.menu-mobile-text-unit a :visited {
	background-color: #808080;
}