@charset "utf-8";

/* ------------------------- */
/* 1. Fonts
/* ------------------------- */

/* ------------------------- */
/* 1.1. Akkurat
/* ------------------------- */

/*
@font-face {
    font-family: 'Akkurat';
    src: url('../fonts/akkurat/akkurat.eot');
    src: url('../fonts/akkurat/akkurat.eot') format('embedded-opentype'),
         url('../fonts/akkurat/akkurat.woff') format('woff'),
         url('../fonts/akkurat/akkurat.ttf') format('truetype'),
         url('../fonts/akkurat/akkurat.svg#AkkuratRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Akkurat Light';
    src: url('../fonts/akkurat/akkurat-light.eot');
    src: url('../fonts/akkurat/akkurat-light.eot') format('embedded-opentype'),
         url('../fonts/akkurat/akkurat-light.woff') format('woff'),
         url('../fonts/akkurat/akkurat-light.ttf') format('truetype'),
         url('../fonts/akkurat/akkurat-light.svg#AkkuratLightLight') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Akkurat Mono';
    src: url('../fonts/akkurat/akkurat-mono.eot');
    src: url('../fonts/akkurat/akkurat-mono.eot') format('embedded-opentype'),
         url('../fonts/akkurat/akkurat-mono.woff') format('woff'),
         url('../fonts/akkurat/akkurat-mono.ttf') format('truetype'),
         url('../fonts/akkurat/akkurat-mono.svg#AkkuratMonoMono') format('svg');
    font-weight: normal;
    font-style: normal;
}
*/

@font-face {
	font-family:'Apercu Mono';
	src:url('../fonts/apercu/Apercu-Mono.eot');
	src:url('../fonts/apercu/Apercu-Mono.eot?#iefix') format('embedded-opentype'),
		url('../fonts/apercu/Apercu-Mono.woff') format('woff'),
		url('../fonts/apercu/Apercu-Mono.ttf') format('truetype');
	font-weight:normal;
	font-style:normal;
}

@font-face {
	font-family:'Apercu Light';
	src:url('../fonts/apercu/Apercu-Light.eot');
	src:url('../fonts/apercu/Apercu-Light.eot?#iefix') format('embedded-opentype'),
		url('../fonts/apercu/Apercu-Light.woff') format('woff'),
		url('../fonts/apercu/Apercu-Light.ttf') format('truetype');
	font-weight:300;
	font-style:normal;
}

@font-face {
	font-family:'Apercu';
	src:url('../fonts/apercu/Apercu.eot');
	src:url('../fonts/apercu/Apercu.eot?#iefix') format('embedded-opentype'),
		url('../fonts/apercu/Apercu.woff') format('woff'),
		url('../fonts/apercu/Apercu.ttf') format('truetype');
	font-weight:normal;
	font-style:normal;
}

/* ------------------------- */
/* 2. General
/* ------------------------- */

#elapsed-time {
	position:fixed;
	bottom:10px;
	right:10px;
	font-size:10px;
	font-weight:bold;
}

* {
	-moz-box-sizing:border-box;
		 box-sizing:border-box;
}

body {
	font-family:'Apercu', monospace;
	font-size:26px;
	text-align:center;
	color:#fff;
	background-color:#001420;
}

img {
	vertical-align:text-bottom;
}

p {
	margin:0;
}

h1, h2, h3, h4, h5 {
	margin:0;
	font-weight:normal;
}

ul,
ol {
	margin:0;
	padding:0;
	list-style:none;
}

a, a:hover, a:active, a:focus {
	outline:0;
}

.col {
  	float:left;
  	min-height:1px;
}

.col-right {
	float:right;
}

.col-1 { width:8.3333%; }
.col-2 { width:16.6666%; }
.col-3 { width:25%; }
.col-4 { width:33.3333%; }
.col-5 { width:41.6666%; }
.col-6 { width:50%; }
.col-7 { width:58.3333%; }
.col-8 { width:66.6666%; }
.col-9 { width:75%; }
.col-10 { width:83.3333%; }
.col-11 { width:91.6666%; }
.col-12 { width:100%; }

.col-1-5 { width:20%; }
.col-2-5 { width:40%; }
.col-3-5 { width:60%; }
.col-4-5 { width:80%; }
.col-5-5 { width:100%; }

.hide { display:none; }
.show { display:block; }

@media all and (max-width: 1279px) {
	.col-xl-1 { width:8.3333%; }
	.col-xl-2 { width:16.6666%; }
	.col-xl-3 { width:25%; }
	.col-xl-4 { width:33.3333%; }
	.col-xl-5 { width:41.6666%; }
	.col-xl-6 { width:50%; }
	.col-xl-7 { width:58.3333%; }
	.col-xl-8 { width:66.6666%; }
	.col-xl-9 { width:75%; }
	.col-xl-10 { width:83.3333%; }
	.col-xl-11 { width:91.6666%; }
	.col-xl-12 { width:100%; }

	.col-xl-1-5 { width:20%; }
	.col-xl-2-5 { width:40%; }
	.col-xl-3-5 { width:60%; }
	.col-xl-4-5 { width:80%; }
	.col-xl-5-5 { width:100%; }

	.hide-xl { display:none; }
	.show-xl { display:block; }
}

@media all and (max-width: 1023px) {
	.col-lg-1 { width:8.3333%; }
	.col-lg-2 { width:16.6666%; }
	.col-lg-3 { width:25%; }
	.col-lg-4 { width:33.3333%; }
	.col-lg-5 { width:41.6666%; }
	.col-lg-6 { width:50%; }
	.col-lg-7 { width:58.3333%; }
	.col-lg-8 { width:66.6666%; }
	.col-lg-9 { width:75%; }
	.col-lg-10 { width:83.3333%; }
	.col-lg-11 { width:91.6666%; }
	.col-lg-12 { width:100%; }

	.col-lg-1-5 { width:20%; }
	.col-lg-2-5 { width:40%; }
	.col-lg-3-5 { width:60%; }
	.col-lg-4-5 { width:80%; }
	.col-lg-5-5 { width:100%; }

	.hide-lg { display:none; }
	.show-lg { display:block; }
}

@media all and (max-width: 749px) {
	.col-md-1 { width:8.3333%; }
	.col-md-2 { width:16.6666%; }
	.col-md-3 { width:25%; }
	.col-md-4 { width:33.3333%; }
	.col-md-5 { width:41.6666%; }
	.col-md-6 { width:50%; }
	.col-md-7 { width:58.3333%; }
	.col-md-8 { width:66.6666%; }
	.col-md-9 { width:75%; }
	.col-md-10 { width:83.3333%; }
	.col-md-11 { width:91.6666%; }
	.col-md-12 { width:100%; }

	.col-md-1-5 { width:20%; }
	.col-md-2-5 { width:40%; }
	.col-md-3-5 { width:60%; }
	.col-md-4-5 { width:80%; }
	.col-md-5-5 { width:100%; }

	.hide-md { display:none; }
	.show-md { display:block; }
}

@media all and (max-width: 567px) {
	.col-sm-1 { width:8.3333%; }
	.col-sm-2 { width:16.6666%; }
	.col-sm-3 { width:25%; }
	.col-sm-4 { width:33.3333%; }
	.col-sm-5 { width:41.6666%; }
	.col-sm-6 { width:50%; }
	.col-sm-7 { width:58.3333%; }
	.col-sm-8 { width:66.6666%; }
	.col-sm-9 { width:75%; }
	.col-sm-10 { width:83.3333%; }
	.col-sm-11 { width:91.6666%; }
	.col-sm-12 { width:100%; }

	.col-sm-1-5 { width:20%; }
	.col-sm-2-5 { width:40%; }
	.col-sm-3-5 { width:60%; }
	.col-sm-4-5 { width:80%; }
	.col-sm-5-5 { width:100%; }

	.hide-sm { display:none; }
	.show-sm { display:block; }
}

@media all and (max-width: 479px) {
	.col-xs-1 { width:8.3333%; }
	.col-xs-2 { width:16.6666%; }
	.col-xs-3 { width:25%; }
	.col-xs-4 { width:33.3333%; }
	.col-xs-5 { width:41.6666%; }
	.col-xs-6 { width:50%; }
	.col-xs-7 { width:58.3333%; }
	.col-xs-8 { width:66.6666%; }
	.col-xs-9 { width:75%; }
	.col-xs-10 { width:83.3333%; }
	.col-xs-11 { width:91.6666%; }
	.col-xs-12 { width:100%; }

	.col-xs-1-5 { width:20%; }
	.col-xs-2-5 { width:40%; }
	.col-xs-3-5 { width:60%; }
	.col-xs-4-5 { width:80%; }
	.col-xs-5-5 { width:100%; }

	.hide-xs { display:none; }
	.show-xs { display:block; }
}

.clearfix::after {
	content:"";
	display:table;
	clear:both;
}

.default-padding {
	padding:0 155px;
}

.table {
	display:table;
	width:100%;
	height:100%;
}

.table-cell {
	display:table-cell;
	vertical-align:middle;
}

.html-content {}

.html-content a {
	color:inherit;
	text-decoration:none;
	border-bottom:1px solid;
	transition:border-bottom 0.3s ease;
}

.html-content a:hover {
	border-bottom-color:transparent;
}

.html-content strong,
.html-content b {}


/* ------------------------- */
/* 3. Header
/* ------------------------- */

#header .header-content {
	position:fixed;
	top:25px;
	left:0;
	right:0;
	padding:0 50px;
	text-align:center;
	font-size:26px;
	font-family:'Apercu Mono', monospace;
	color:#fff;
	z-index:51;
}

#header .logo {
	text-align:left;
}

#header .logo h1 {
	font-size:26px;
}

#header .logo p {
	font-family:'Apercu Light', monospace;
	font-size:16px;
}

#header a {
	color:#fff;
	text-decoration:none;
	border-bottom:1px transparent solid;
	transition:border-bottom 0.3s ease;
}

#header a:hover {
	border-bottom-color:#fff;
}

#header .menu li {
	display:inline-block;
}

#header .menu li + li {
	margin:0 0 0 25px;
}

#header img {
	position:fixed;
	top:0;
	left:50%;
	margin:0 0 0 -960px;
	width:1920px;
	height:450px;
	z-index:-1;
}

/* ------------------------- */
/* 4. Content
/* ------------------------- */

#wrapper {
	position:absolute;
	top:450px;
	left:0;
	width:100%;
	z-index:50;
}

main h1 {
	font-size:26px;
}

main h1 span {
	font-family:'Apercu Mono', monospace;
}

main h1 a {
	color:#fff;
}

main h1 a:hover {
	text-decoration:none;
}

#photos {
	background-color:#3C3C4B;
}

#films {
	background-color:#001420;
}

#films > h1,
#photos > h1 {
	padding:25px;
}

.hook-isotope {
	transition:height 0.8s cubic-bezier(0.165, 0.840, 0.440, 1.000);
}

.responsive {
	width:100%;
}

.list-item {
	background-color:#000;
}

.films-list .list-item.default,
.films-list .list-item.column,
.films-list .list-sizer {
	width:25%;
}

.films-list .list-item.row,
.films-list .list-item.double {
	width:50%;
}

.photos-list .list-item.default,
.photos-list .list-item.column,
.photos-list .list-sizer {
	width:16.666%;
}

.photos-list .list-item.row,
.photos-list .list-item.double {
	width:33.333%;
}

.item-wrapper {
	display:block;
	position:relative;
	height:0;
	color:#fff;
	opacity:.2;
	transition:opacity 0.3s ease;
}

.item-wrapper:hover {
	opacity:1;
}

.list-item .item-content {
	position:absolute;
	top:0;
	left:0;
	bottom:0;
	right:0;
}

.list-item .content-image,
.list-item .content-caption {
	position:absolute;
	top:0;
	right:0;
	bottom:0;
	left:0;
	background-position:center;
	background-size:cover;
}

.list-item .content-image {
	background-position:center;
	background-size:cover;
	z-index:10;
}


.list-item .content-caption {
	padding:25px;
	font-family:'Apercu Light', monospace;
	font-size:26px;
    letter-spacing:1px;
    line-height:28px;
	z-index:11;
	opacity:0;
	transition:opacity 0.3s ease;
}

.list-item .item-wrapper:hover .content-caption {
	opacity:1;
}

.films-list .list-item {
}

.films-list .list-item.default .item-wrapper,
.films-list .list-item.double .item-wrapper {
	padding-bottom:56.25%;
}

.films-list .list-item.row .item-wrapper {
	padding-bottom:28.125%;
}

.films-list .list-item.column .item-wrapper {
	padding-bottom:112.5%;
}

.photos-list .list-item.default .item-wrapper,
.photos-list .list-item.double .item-wrapper {
	padding-bottom:75%;
}

.photos-list .list-item.row .item-wrapper {
	padding-bottom:37.5%;
}

.photos-list .list-item.column .item-wrapper {
	padding-bottom:150%;
}

.mobile .item-wrapper {
	opacity:1;
	transition:none;
}

.mobile .list-item .content-image {
	opacity:.7;
}

.mobile .list-item .content-caption {
	opacity:1;
	transition:none;
}

#about {
	padding:50px 0 60px;
	font-size:16px;
	line-height:22px;
	background-color:#001420;
}

#about .html-content {
	margin:20px auto 0;
	padding:0 25px;
	width:100%;
	max-width:500px;
	text-align:justify;
}

.fr-window {
	font-family:'Apercu Light', monospace;
}

.fr-overlay-background,
.fr-overlay-ui-fullclick .fr-overlay-background {
	background:#001420;
}

.fr-content-background,
.fr-stroke {
	display:none;
}

.fr-info {
	top:auto !important;
	left:0 !important;
	right:0 !important;
	bottom:0 !important;
	width:100% !important;
}

.fr-info-background,
.fr-ui-outside .fr-info-background {
	background-color:transparent;
}

.fr-info-padder {
	padding:25px;
	font-size:20px;
	text-align:center;
}

/* ------------------------- */
/* 5. Footer
/* ------------------------- */

#footer {
	position:relative;
	overflow:hidden;
	padding:37px 25px;
	font-family:'Apercu', monospace;
	font-size:10px;
	text-transform:uppercase;
	letter-spacing:1px;
	background-color:#3C3C4B;
}

#footer a {
	color:#fff;
}

#footer a:hover {
	text-decoration:none;
}

#footer #contacts {
	position:absolute;
	top:0;
	left:50%;
	padding:37px 0;
	margin:0 0 0 -200px;
	width:400px;
}

#footer #contacts ul li {
	display:inline-block;
}

#footer #contacts ul li + li {
	margin:0 0 0 20px;
}

#footer #copyright {
	float:left;
}

#footer #social {
	float:right;
}

#footer #social ul li {
	display:inline-block;
}

#footer #social ul li + li {
	margin:0 0 0 20px;
}

/* ------------------------- */
/* 6. Make responsive 
/* ------------------------- */

@media all and (min-width: 1921px) {
	#header img {
		width:100%;
		margin:0 0 0 -50%;
	}
}

@media all and (max-width: 1279px) {
	.films-list .list-item.default,
	.films-list .list-item.column,
	.films-list .list-sizer {
		width:33.333%;
	}

	.films-list .list-item.row,
	.films-list .list-item.double {
		width:66.666%;
	}

	.photos-list .list-item.default,
	.photos-list .list-item.column,
	.photos-list .list-sizer {
		width:20%;
	}

	.photos-list .list-item.row,
	.photos-list .list-item.double {
		width:40%;
	}
}

@media all and (max-width: 1023px) {
	#header .header-content {
		z-index:49;
	}

	.films-list .list-item.default,
	.films-list .list-item.column,
	.films-list .list-sizer {
		width:50%;
	}

	.films-list .list-item.row,
	.films-list .list-item.double {
		width:100%;
	}

	.photos-list .list-item.default,
	.photos-list .list-item.column,
	.photos-list .list-sizer {
		width:25%;
	}

	.photos-list .list-item.row,
	.photos-list .list-item.double {
		width:50%;
	}

	#about article + article {
		margin:50px 0 0;
	}

	#footer #contacts {
		position:static;
		width:100%;
		padding:0;
		margin:0 auto;
	}
	
	#footer #copyright,
	#footer #social {
		float:none;
		width:100%;
		padding:0;
		margin:20px auto 0;
	}
}

@media all and (max-width: 767px) {
	#header .header-content {
		padding:0 25px;
	}

	#header .logo,
	#header .menu {
		float:none;
		text-align:center;
	}

	#header .menu {
		margin:50px 0 0;
	}

	#header .menu li,
	#header .menu li + li {
		margin:0 12px;
	}

	.photos-list .list-item.default,
	.photos-list .list-item.column,
	.photos-list .list-sizer {
		width:50%;
	}

	.photos-list .list-item.row,
	.photos-list .list-item.double {
		width:100%;
	}
}

@media all and (max-width: 567px) {
	#header {
		height:300px;
	}
	
	#header img {
		left:50%;
		margin:0 0 0 -50%;
		width:auto;
		height:300px;
	}
	
	#wrapper {
		top:300px;
	}

	.films-list .list-item.default,
	.films-list .list-item.column,
	.films-list .list-sizer,
	.photos-list .list-item.default,
	.photos-list .list-item.column,
	.photos-list .list-sizer {
		width:100%;
	}

	.films-list .list-item.default .item-wrapper,
	.films-list .list-item.double .item-wrapper,
	.films-list .list-item.row .item-wrapper,
	.films-list .list-item.column .item-wrapper,
	.photos-list .list-item.default .item-wrapper,
	.photos-list .list-item.double .item-wrapper,
	.photos-list .list-item.row .item-wrapper,
	.photos-list .list-item.column .item-wrapper {
		padding-bottom:56.25%;
	}
}