* {margin: 0; padding: 0;}

a {text-decoration: none; color: #323232;}



.fixed {
	position: fixed;
	top: 0;
	height: 70px;
	z-index: 4;
	font-size: 16px;	
}

body {
	color: #323232;
	font-family:'Play', sans-serif;
	font-size: 16px;
	font-weight:400;
	text-align: center;}


@font-face {
    font-family:'Play', sans-serif;
	font-weight:400;
}

.logo {
	
	height: 130px;
	padding-top:20px;
	line-height:20px;
	width:270px;
	background: #fff;
	position: fixed ;
	left: 50%;
	transform: translateX(-50%);
	border-radius: 0px 0px 140px 140px;
	z-index: 3;

}

nav {
	position: absolute;
	bottom: 0;
	width: 100%;
	height: 70px;
	background: #fff;
	z-index: 4;
		
}



nav li {

	display: inline-block;
	padding: 28px 5px;

}

nav li a {
	color: #323232;
	text-transform: uppercase;
	box-sizing: content-box;
	padding: 8px;
	text-transform: uppercase;
	background-size: cover;
	border-radius: 3px;
	border-spacing: 50px 50px;
	border-left-color: #fff;
	border-left-style: solid;
	border-left-width: 1px;
	border-top-color: #fff;
	border-top-style: solid;
	border-top-width: 1px;
	border-bottom-color: #fff;
	border-bottom-style: solid;
	border-bottom-width: 1px;
	border-right-color: #fff;
	border-right-style: solid;
	border-right-width: 1px;
	
}

nav li a:hover{
	color: #323232;
	box-sizing: content-box;
	padding: 8px;
	text-transform: uppercase;
	background-size: cover;
	border-radius: 3px;
	border-spacing: 50px 50px;
	border-left-color: #C9C9C9;
	border-left-style: solid;
	border-left-width: 1px;
	border-top-color: #C9C9C9;
	border-top-style: solid;
	border-top-width: 1px;
	border-bottom-color: #C9C9C9;
	border-bottom-style: solid;
	border-bottom-width: 1px;
	border-right-color: #C9C9C9;
	border-right-style: solid;
	border-right-width: 1px;
}




section {
  height: auto;
  min-height: 100vh;
}


#screen1 {
	z-index: -1;
        background: url(background.jpg);
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
}

#screen2 {
	background: #fafafa;
	z-index: 2;
}

.story {
	
	width:1000px; 
	vertical-align:top;
	position: relative; 
	top:130px;
        margin: auto;
}

.slides {
	display: inline-block;
	vertical-align: top;
	text-align: right;
	width: 250px;
	height: 280px;
	background-color: white;
	border-radius: 3px;
	padding-top: 15px;
	padding-bottom: 20px;
	padding-left: 15px;
	padding-right: 15px;
	border: 1px solid #fafafa;
	box-shadow: 6px 6px 12px #aaaaaa;
	margin-top: 45px;
}

.story_text {
	color: #6f6f6f;
        display:inline-block;
	vertical-align:top;
	text-align: left; 
	width:390px;
        padding:15px;

}


.filmpolski {
	width:1000px; 
	vertical-align:top;
	position: relative;
	margin:auto;
	padding-top:115px;
}

.filmpolski_text {
	display:inline-block;
	vertical-align:top;
	text-align: right; 
	width:400px;
	position:relative;
	top:40px;
	color:#6f6f6f;
	font-style:bold;
}

.filmpolski_link {
	
	display:inline-block;
	vertical-align:top;
	text-align: left; 
	width:400px;
	position:relative;
	color:#6f6f6f;
	
}

.filmpolski_image {
	
	background: #fff; 
	border-radius: 3px 3px 3px 3px; 
	width:200px;
	border-right-color: #fff; 
	border-right-style: solid; 
	border-right-width: 25px; 
	border-bottom-color: #fff; 
	border-bottom-style: solid; 
	border-bottom-width: 5px;
	margin-top:10px;
	margin-bottom:10px;

}

#screen3 {
	background: #ededed;
	z-index: 2;
}

.camera_image {
	position:relative;
	height:465px;
	width:100%;

}

.camera_image::after {
	
	content:'';
    background:url('camera.jpg') no-repeat #fff center;
    height:465px;
	width:100%;
    position:absolute;
	left:0; 
	top:0;
    opacity:0.1;
	
}

.camera_text
{
	position:relative;
	color: #323232;
	text-transform: uppercase;
	opacity:0.9;
	font-size: 20px;
	z-index: 1;
	font-style:bold;
	padding-top:150px;
	
}

div.gallery {

	position:relative;
    border: 0px solid #ccc;
	display: inline-table ;
    width: 330px;
	bottom: 170px;

}


div.gallery img {
	
    width: 70%;
    height: auto;
	opacity:0.6;
	-webkit-border-radius: 100%;
    border-radius: 100%; 
}

div.gallery img:hover {
	
    width: 70%;
    height: auto;
	opacity:1;
	-webkit-border-radius: 100%;
    border-radius: 100%; 
}

div.desc {
	
    padding: 15px;
text-align: center;
}


#screen4
{
	background: #fafafa;
	z-index: 2;
}



.lens_image {
	position:relative;
	height:100vh;
	width:100%;
    

}

.lens_image::after {
	
	content:'';
    background:url('lens.png') no-repeat #fff center;
    height:100vh;
	width:100%;
    position:absolute;
	left:0; 
	top:0;
    opacity:0.05;	
}

.lens_text
{
position: relative;
z-index:2;
opacity:0.9;
height:200px;
top: 50vh;
}

	
#screen5 {
background: #fafafa;
position: relative;
bottom: 0;
z-index: 2;
height: auto;

}

.map {
width:100%;	
height:50vh;
max-height:450px;
border:0; 
opacity: 0.6;}


.contactbox {
position: relative; 
bottom:200px; 
width:600px;  
margin: auto;
display: flex;  
}

.contact_text {
position: relative;  
width:300px;  
background-color:#fff; 
padding-top: 20px; 
}
		
.contact_form { 
position: relative;  
width:300px; 
background-color:#fff; 
padding-bottom:20px;
}


input[type=submit] {
    padding:15px 15px; 
    background:#cc2121;
	color: #fff;
    border:0 none;
    cursor:pointer;
    -webkit-border-radius: 5px;
    border-radius: 5px; 
}

#footer
{
background-color: #0A0A0A;
position: absolute;
padding-top:20px;
color:#3B3B3B;
height:120px;
width:100%;
z-index: 2
}

/* Preloader */
 
#preloader {
    position:fixed;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background: rgb(255,255,255);
    z-index:999;
}
 
#status {
    width:128px;
    height:128px;
    position:absolute;
    left:50%; 
    top:50%; 
    background-image:url(preloader.gif);
    background-repeat:no-repeat;
	background-size:contain;	
    background-position:center;
    margin:-64px 0 0 -64px;
}

@media screen and (min-width: 1000px) {
   .mobile_menu {
     display: none;
   }
}

@media screen and (max-width: 1000px) 
{
	.mobile_menu {
 
       display: block;
	   padding-top:10px;


   }
/* MOBILE MENU START */


#menuToggle {
  display: flex;
  flex-direction: column;
  position: relative;
  z-index: 1;
  width:40px;
  left: 50%;
  transform: translateX(-50%);
  -webkit-user-select: none;
  user-select: none;
}

#menuToggle input
{
  display: flex;
  width: 40px;
  height: 32px;
  position: absolute;
  cursor: pointer;
  opacity: 0;
  z-index: 1;
}

#menuToggle span
{
  display: flex;
  width: 29px;
  height: 2px;
  margin-bottom: 5px;
  left: 50%;
  transform: translateX(-50%);
  position: relative;
  background: #cc2121;
  border-radius: 3px;
  z-index: 1;
  transform-origin: 5px 0px;
  transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
              background 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
              opacity 0.55s ease;
}

#menuToggle span:first-child
{
  transform-origin: 0% 0%;
}

#menuToggle span:nth-last-child(2)
{
  transform-origin: 0% 100%;
}

#menuToggle input:checked ~ span
{
  opacity: 1;
  transform: rotate(45deg) translate(-8px, 12px);
  background: #36383F;
}
#menuToggle input:checked ~ span:nth-last-child(3)
{
  opacity: 0;
  transform: rotate(0deg) scale(0.2, 0.2);
}

#menuToggle input:checked ~ span:nth-last-child(2)
{
  transform: rotate(-45deg) translate(-13px, -6px);

}

#menu
{
	width: 50vw;
	max-width: 200px;
	box-sizing: content-box;
	box-shadow: 0 0 10px #85888C;
	margin-top: -30px;
	margin-left: -5px;
	color: #323232;
	background-color: #fafafa;
	-webkit-font-smoothing: antialiased;
	transform-origin: 0% 0%;
	transform: translate(0%, -1000%);
	transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0);
	padding: 8px;
	text-transform: uppercase;
	border-radius: 3px;
	border-spacing: 50px 50px;
	border-left-color: #fff;
	border-left-style: solid;
	border-left-width: 1px;
	border-top-color: #fff;
	border-top-style: solid;
	border-top-width: 1px;
	border-bottom-color: #fff;
	border-bottom-style: solid;
	border-bottom-width: 1px;
	border-right-color: #fff;
	border-right-style: solid;
	border-right-width: 1px;
}

#menu li
{
  padding-left: 10px;
  padding-top: 10px;
  padding-bottom: 10px;
  padding-right: 10px;

  transition-delay: 2s;
  list-style-type:none;
  text-align:right;
  
}


#menuToggle input:checked ~ ul
{
  transform: none;
}

/* MOBILE MENU END */

		body {
			color: #323232;
			font-family:'Play', sans-serif;
			font-size: 16px;
			font-weight:400;
			text-align: center;}

		nav {
			 display: none;	
		}

		nav li {

			display: none;
		}

		nav li a {
			display: none;
			
		}


		#screen1 {
		z-index: -1;
		background: url(background_opt.jpg);
		background-position: center;
		background-repeat: no-repeat;
		background-size: cover;

		}

		#screen2 {
			background: #fafafa;
			z-index: 2;
		}

		.story {
			
			width:100%; 
			vertical-align:top;
			position: relative; 
			margin:auto;
			top:130px;
		}

		.slides {
			display:inline-block;
			vertical-align:top;
			text-align: right; 
			width:90%;
			max-width: 250px;
			height:280px; 
			background-color:white; 
			border-radius: 3px; 
			padding-top:15px;
			padding-bottom:20px;
			padding-left:15px;	
			padding-right:15px;
			

			
		}

		.story_text {
			display:inline-block;
			vertical-align:top;
			text-align: left; 
			width:90%; 
			max-width: 390px;
			padding:15px;
	                


		}

		.filmpolski {
			width:100vw; 
			vertical-align:top;
			position: relative;
			margin:auto;
			margin-top:50px;
		}

		.filmpolski_text {
			vertical-align:top;
			text-align: center; 
			width:100vw;
			position:relative;
			top:0px;
			color:#6f6f6f;
		}

		.filmpolski_link {
			
			display:inline-block;
			vertical-align:top;
			text-align: center; 
			width:100%;
			position:relative;
			color:#6f6f6f;

			
		}

		.filmpolski_image {
			
			background: #fff; 
			border-radius: 3px 3px 3px 3px; 
			width:200px; 	
			border-right-color: #fff; 
			border-right-style: solid; 
			border-right-width: 25px; 
			border-bottom-color: #fff; 
			border-bottom-style: solid; 
			border-bottom-width: 5px;
			
		}

		#screen3 {
			background: #ededed;
			z-index: 2;
		}

		.camera_image {
			position:relative;
			height:465px;
			width:100%;

		}

		.camera_image::after {
			
			content:'';
			background:url('camera.jpg') no-repeat #fff center;
			height:465px;
			width:100%;
			position:absolute;
			left:0; 
			top:0;
			opacity:0.1;
			
		}

		.camera_text
		{
			position:relative;
			color: #323232;
			text-transform: uppercase;
			opacity:0.9;
			font-size: 20px;
			z-index: 1;
			font-style:bold;
			padding-top:150px;
			
		}

		div.gallery {

			position:relative;
			border: 0px solid #ccc;
			display: inline-table ;
			width: 330px;
			bottom: 170px;

		}


		div.gallery img {
			
			width: 70%;
			height: auto;
			opacity:0.6;
			-webkit-border-radius: 100%;
			border-radius: 100%; 
		}

		div.gallery img:hover {
			
			width: 70%;
			height: auto;
			opacity:1;
			-webkit-border-radius: 100%;
			border-radius: 100%; 
		}

		div.desc {
			
			padding: 15px;
		text-align: center;
		}


		#screen4
		{
			background: #fafafa;
			z-index: 2;
		}



		.lens_image {
			position:relative;
			height:100vh;
			width:100%;
			

		}

		.lens_image::after {
			
			content:'';
			background:url('lens.png') no-repeat #fff center;
			height:100vh;
			max-width:100vw;
			position:absolute;
			left:0; 
			top:0;
			opacity:0.05;	
		}

		.lens_text
		{
		position: relative;
		z-index:2;
		opacity:0.9;
		height:200px;
		top: 50vh;
		}

			
		#screen5 {
		background: #fafafa;
		position: relative;
		bottom: 0;
		z-index: 2;
		height: auto;
		}

		.contactbox {
		position: relative; 
		bottom:20vh; 
		width:70%;
		max-width:600px;  		
		margin: auto;
		display: flex;  
		}

		.contact_text {
		position: relative;  
		width:100%;  
		background-color:#fff; 
		padding: 20px; 
		}
		
		.contact_form { 
		display:none;
		}

		input[type=submit] {
			display:none;
		}

		#footer
		{
		background-color: #0A0A0A;
		position: absolute;
		padding-top:20px;
		color:#3B3B3B;
		height: auto;
		min-height: 120px;
		width:100%;
		z-index: 2
		}

		/* Preloader */
		 
		#preloader {
			position:fixed;
			top:0;
			left:0;
			right:0;
			bottom:0;
			background: rgb(255,255,255);
			z-index:999;
		}
		 
		#status {
			width:128px;
			height:128px;
			position:absolute;
			left:50%; 
			top:50%; 
			background-image:url(preloader.gif);
			background-repeat:no-repeat;
			background-size:contain;	
			background-position:center;
			margin:-64px 0 0 -64px;
		}


		}