@charset "ISO-8859-1";
@font-face {
    font-family: 'league';
    src: url('../fonts/leaguegothic-regular-webfont.eot');
    src: url('../fonts/leaguegothic-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/leaguegothic-regular-webfont.woff') format('woff'),
         url('../fonts/leaguegothic-regular-webfont.ttf') format('truetype'),
         url('../fonts/leaguegothic-regular-webfont.svg') format('svg');
    font-weight: normal;
    font-style: normal;
	font-size: 100%;

}
@font-face {
    font-family: 'lisa';
    src: url('../fonts/lisa-webfont.eot');
    src: url('../fonts/lisa-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/lisa-webfont.woff') format('woff'),
         url('../fonts/lisa-webfont.svg') format('svg');
    font-weight: normal;
    font-style: normal;
	font-size:: 100%;
}
/* font Lisa is a free font of fontfabric.com */
/* einde fonts */
@font-face {
    font-family: 'lemonbird';
    src: url('../fonts/lemonbird-regular-webfont.woff2') format('woff2'),
         url('../fonts/lemonbird-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
body {
	background: #000;
}
body, html {
	height: 100%;
}
/* achtergronden */
.crossfade > figure {
  animation: imageAnimation 30s linear infinite 0s;
  backface-visibility: hidden;
  height: 100%;
  background-size: cover;
  background-position: center center;
  color: transparent;
  left: 0px;
  opacity: 0;
  position: fixed;
  top: 0px;
  width: 100%;
  z-index: -1;
}
.crossfade > figure:nth-child(1) {
  background-image: url('../img/001.jpg');
}
.crossfade > figure:nth-child(2) {
  animation-delay: 6s;
  background-image: url('../img/002.jpg');
}
.crossfade > figure:nth-child(3) {
  animation-delay: 12s;
  background-image: url('../img/003.jpg');
}
.crossfade > figure:nth-child(4) {
  animation-delay: 18s;
  background-image: url('../img/004.jpg');
}
.crossfade > figure:nth-child(5) {
  animation-delay: 24s;
  background-image: url('../img/005.jpg');
}
@keyframes imageAnimation {
  0% {
    animation-timing-function: ease-in;
    opacity: 0;
  }
  8% {
    animation-timing-function: ease-out;
    opacity: 1;
  }
  17% {
    opacity: 1
  }
  25% {
    opacity: 0
  }
  100% {
    opacity: 0
  }
}

* {
  padding: 0;
  margin: 0
}
img {
	border: none;
	outline: none;
}
div#header {
	width: 100%;
	height: 20em;
	float: left;
	z-index: 1;
}
div#logo {
	width: 37.5em;
	max-width: 30em;
	height: 17em;
	padding: 3em;
	float: left;
}
.container {
	width: 43.75em;
	padding: 0;
	margin: 0;
	float: right;
	z-index: 2;
}
/* menu */
.menu {
	width: 18.75em;
	height: 6.25em;
	padding-top: 5em;
	padding-right: 3.125em;	
	float: right;
}
.menu li {
    list-style: none;
	width: 100%;
    margin: 0;
    padding: 0;
    } 
.menu li a, .menu li a:visited {
	display: block;
	text-decoration: none;
	text-indent: -9999px;
	height: 6.25em;
	}
.dkf a {
	background: url(../img/navup.png) no-repeat;
	}
.dkf a:hover {
	background: url(../img/navdwn.png) no-repeat;
	}
.content {
	width: 43.75em;
	height: 100%;
	padding: 0 3em;
	text-align: left;
	float: right;
}
.footer {
	width: 43.75em;
	height: 100%;
	padding: 3em;
	text-align: right;
	float: right;
}
.footer a {
	font-size: 30px;
}
.bg {
	background: #990000;
	opacity: 0.8;
	padding: 3em;
}
.bg h1, .bg h2 {
	font: 2.2em 'lemonbird', sans-serif;
	color: #fff;
	text-transform: uppercase;
	padding-bottom: 0.625em;
}
.bg p {
	font: 0.965em/1.1em 'lisa', sans-serif;
	color: #fff;
	padding-bottom: 0.625em;
}
.content span.mini {
	font: 0.8em/1em 'lisa', sans-serif;
	color: #eceae6;
}
div#wrapper {
	width: 60em;
	margin: 0 auto;
}

/* scroll jquery */
.scrollup {
	background: transparent url(../img/top.png) no-repeat scroll 0 0;
	bottom: 0px;
	display: none;
	height: 2.5em;
	width: 2.5em;
	position: fixed;
	right: 0.3125em;
	bottom: 0.3125em;
	text-indent: -9999px;
}
/* Style all font awesome icons */
.fa {
	  padding: 20px;
	  margin-left: 20px;
	  width: 30px;
	  text-align: center;
	  text-decoration: none;
}	  
/* Add a hover effect if you want */

.fa:hover {
  color: #ffab00;
}

/* Set a specific color for each brand */

/* Facebook */
.fa-facebook {
 background: rgba(255, 255, 255, 0.5);
  color: #990000;
}

/* Instagram */
.fa-instagram {
  background: rgba(255, 255, 255, 0.5);
  color: #990000;
}