@charset "UTF-8";
/* CSS Document */

body{
	width: 100%;
	margin: 0;
	border: 0;
	padding: 0;
	position: static;
	background-image: url(images/BG1.png);
	BACKGROUND-SIZE: COVER;
	margin-right: 200px;
}


P7{
	font-size: 200%;
	color: white;
	  line-height: 3;
	font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Verdana, "sans-serif";

}

p8{
	font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Verdana, "sans-serif";
	font-size: 80%;
	width: 100px;
	text-align: center;
	color: white;
	 line-height: 1.6;

}

#zwartvlak{
	position: relative;
	z-index: 3;
	width: 100%;
	height: 300px;
	top: 1000px;
	background-color: black;
	padding-top: 20px;
}

#vlak2{
	width: 200px;
position: relative;
	left: 50%;
	margin-left: -100px;
}

#logo img{
	width:80%;
	height: auto;
	float: right;

}

#logo{
  margin-right: auto;
	padding: 10px 4px 4px 10px
}

#logobg{
  position: fixed;
	 width: 100%;	
	  max-width: 100%;
	height: auto;

}

/* Style the video: 100% width and height to cover the entire window */

#videocontainer{
	position: fixed;
    top: -50%;
    width: 100%;
    height: 400%;
}

video {
    top: 0;
    bottom: 0;
	left: 50%;
    min-height: 50%;
    min-width: 50%;
	margin-left: -200px;
}


#l2{
		position: fixed;
	z-index: 4;
		padding: 7% 0% 0% 0%;
		width: 60px;
	backround-color: green;
}



#l2 img {
	position: relative;
		text-align: center;
		padding: 40% 40% 40% 40%;
		max-width: 60%;
	height: auto;
	background-color: yllow;
}
#l2 img{ 
		-webkit-transition: all 0.2s ease;
     -moz-transition: all 0.2s ease;
       -o-transition: all 0.2s ease;
      -ms-transition: all 0.2s ease;
          transition: all 0.2s ease;
	
		}
	
#l2 img:hover {
  -webkit-transform: rotate(-10deg);
     -moz-transform: rotate(-10deg);
       -o-transform: rotate(-10deg);
      -ms-transform: rotate(-10deg);
          transform: rotate(-10deg);
}

html {
  scroll-behavior: smooth;
}

#outnow{
	text-align: center;
	position: fixed;
	top: 40%;
	cursor: pointer;
	color: white;
	left: 50%;
	margin-left: -300px;

}

#outnow img{
		max-width:600px;
	height: auto;
}

@media screen and (max-width: 700px) {
    #outnow img{
     max-width:200px;
    }
}

@media screen and (max-width: 700px) {
    #outnow{
     max-width:300px;
	margin-left: -100px;

    }
}

@media screen and (max-width: 700px) {
    video {
        display: none;
    }
}

@media screen and (max-height: 500px) {
    p1 {
		top:30%;
    }
}

p2{
	text-align: center;
	position: fixed;
	font-size: 350%;
	font-family: 'Times Italic 03';
	top: 50%;
	cursor: pointer;
	color: white;
	left: 50%;
	margin-left: -100px;
}

@media screen and (max-width: 700px) {
	p2 {
		font-size: 120%;
		margin-left: -30px;
		top: 40%;
	}
	}