.btn { background: #007078; color: #fff; text-decoration: none; }  
.btn:hover { background: #222; color: #fff; text-decoration: none; }  

#menubar { display: block; position: fixed; top:0; left: 0; height: 100px; width: 100%; background: #fff; z-index: 1000; box-shadow: 0 0 5px #ccc; }
#menubar ul.menu { display: inline-block; list-style: none; padding: 0; margin: 0; }
#menubar ul.menu li { float: left; display: inline-block; padding: 38px 15px; }
#menubar ul.menu li a { display: block; color: #444; text-decoration: none; font-family: 'Open Sans'; font-weight: 700; }
#menubar ul.menu li a:hover { color: #007078;}
#menubar .menubut { width: 100%; text-align: right; display: none; font-size: 40px; padding-top: 15px; }
#menubar .brand { padding-top: 10px; }

@media (max-width: 1200px) {
  #menubar ul.menu li { float: left; display: inline-block; padding: 40px 10px; }
  #menubar ul.menu li a { display: block; color: #444; text-decoration: none; font-family: 'Open Sans'; font-size: 14px; font-weight: 700; }
  #menubar .brand { padding-top: 20px; }
}

@media (max-width: 992px) {
  #menubar { height: 70px;  }
  #menubar ul.menu { display: none; }
  #menubar .menubut { display: block; }
  #menubar .brand { padding-top: 2px; }
}
@media (max-width: 567px) {
  #menubar { height: 70px;  }
  #menubar ul.menu { display: none; }
  #menubar .menubut { display: block; }
  #menubar .brand { padding-top: 6px; }
}
#header { height: 700px; width: 100%; margin-top: 100px; position: relative;}
#header .headerimage { height: 700px; width: 100%; }
#header .buttons { position: absolute; bottom: -50px; left: 0; width: 100%; font-family: 'Open Sans', sans-serif; font-size: 15px; line-height: 32px;  }
#header .buttons .container { max-width: 900px; }
#header .buttons a { display: block; background: #007078; color: #fff; padding: 40px; border-radius: 8px; text-align: center; text-decoration: none; transition: .2s;}
#header .buttons a.but1 { background: #007078 url("/theme/img/icon-menu.png") left 20px top 20px no-repeat; background-size: 40%; font-family: 'Special Elite'; font-size: 20px;}
#header .buttons a.but1:hover { background: #444 url("/theme/img/icon-menu.png") left 10px top 10px no-repeat; background-size: 40%; transition: .2s;}
#header .buttons a.but2 { background: #007078 url("/theme/img/icon-buffet.png") left 20px top 20px no-repeat;  background-size: 40%; font-family: 'Special Elite'; font-size: 20px;}
#header .buttons a.but2:hover  { background: #444 url("/theme/img/icon-buffet.png") left 10px top 10px no-repeat;  background-size: 40%; transition: .2s;}
#header .buttons a.but3 { background: #007078 url("/theme/img/icon-contact.png") left 20px top 45px no-repeat; background-size: 40%; font-family: 'Special Elite'; font-size: 20px; }
#header .buttons a.but3:hover  { background: #444 url("/theme/img/icon-contact.png") left 10px top 25px no-repeat; background-size: 40%; transition: .2s; }

@media (max-width: 992px) {
  #header { height: 500px; margin-top: 70px; }
  #header .headerimage { height: 500px; width: 100%; }
  #header .buttons a.but { padding: 20px 0; margin-bottom: 10px; font-size: 20px; }
  #header .buttons a.but1 { background-position: left 10px top 10px; background-size: 20%; }  
  #header .buttons a.but2 { background-position: left 10px top 10px; background-size: 20%; }  
  #header .buttons a.but3 { background-position: left 10px top 20px; background-size: 20%; }  
}
@media (max-width: 576px) {
  #header { height: 460px; margin-top: 70px; }
  #header .headerimage { height: 300px; width: 100%; }
  #header .buttons a.but { padding: 20px 0; margin-bottom: 10px; font-size: 20px; }
  #header .buttons a.but1 { background-position: left 10px top 10px; background-size: 15%; }  
  #header .buttons a.but2 { background-position: left 10px top 10px; background-size: 15%; }  
  #header .buttons a.but3 { background-position: left 10px top 20px; background-size: 15%; }  
}

#balk { background: #007078; }

#intro { background: #f2f1e4; padding: 150px 0 100px 0; font-family: 'Open Sans', sans-serif; font-size: 15px; line-height: 32px; }
#intro h1 { display: inline-block; font-family: 'Special Elite'; font-size: 45px; line-height: 50px; border-bottom: 3px solid #c4c3af; margin-bottom: 25px;}
#intro img { border: 8px solid #fff; }
@media (max-width: 992px) {
  #intro { padding: 100px 20px; }
  #intro h1 { font-size: 40px; }
}

#openingstijden .row { padding: 0px; }
#openingstijden .tekst { padding: 80px 40px; font-family: 'Open Sans', sans-serif; font-size: 15px; line-height: 32px; }
#openingstijden .container-fluid { padding: 0; margin: 0; }
#openingstijden h2 { display: inline-block; font-family: 'Special Elite'; font-size: 35px; line-height: 40px; border-bottom: 3px solid #c4c3af; margin-bottom: 25px;}
@media (max-width: 992px) {
  #openingstijden .tekst { padding: 50px 30px; }
}

#content { background: #f2f1e4; padding: 70px 0 100px 0; font-family: 'Open Sans', sans-serif; font-size: 15px; line-height: 32px; }
#content h1 { display: inline-block; font-family: 'Special Elite'; font-size: 45px; line-height: 50px; border-bottom: 3px solid #c4c3af; margin-bottom: 25px;}
#content img { border: 8px solid #fff; }
@media (max-width: 992px) {
  #content { padding: 70px 20px; }
  #content h1 { font-size: 40px; }
}

#footer { background: #333; padding: 50px 0; color: #f2f1e4;}
#footer .container { position: relative; padding-bottom: 20px; }
#footer a { color: #f2f1e4; }
#footer address { padding-left: 15px; }
#footer .mm { position: absolute; bottom: 0px; right: 0px; color: #aaa; }

@media (max-width: 768px) {
  #footer { text-align: center; }
  #footer .container { padding-bottom: 60px; }
  #footer ul { margin: 0; padding: 0; }
  #footer ul li { margin: 0; padding: 0; }
  #footer ul li i { display: none; }
  #footer .mm { display: block; position: absolute; bottom: 0px; left: 0px; width: 100%; text-align: center; padding: 30px 10px 10px 10px; }
}

.arr1 { background: #cfcec2; padding: 50px; }
.arr1 h2 { display: inline-block; font-family: 'Special Elite'; font-size: 35px; line-height: 40px; border-bottom: 3px solid #c4c3af; margin-bottom: 25px;}

.arr2 { background: #f2f1e4; padding: 50px; }
.arr2 h2 { display: inline-block; font-family: 'Special Elite'; font-size: 35px; line-height: 40px; border-bottom: 3px solid #c4c3af; margin-bottom: 25px;}

	/* The Overlay */
	.overlay { height: 0; width: 100%; position: fixed; z-index: 9998; left: 0; top: 0; background-color: rgb(0,0,0); background-color: rgba(0,0,0, 0.9); overflow-x: hidden; transition: 0.4s; }
	.overlay-content { position: relative; top: 15%; width: 100%; text-align: center; margin-top: 30px; }
	.overlay ul { list-style: none; margin: 0; padding: 0;}
	.overlay a { padding: 8px; text-decoration: none; font-size: 30px; line-height: 50px; color: #818181; display: block; transition: 0.3s; font-weight: 600; text-transform: uppercase; letter-spacing: 2px; }
	.overlay a:hover, .overlay a:focus { color: #f1f1f1; }
	.overlay .closebtn { position: absolute; top: 20px; right: 45px; font-size: 60px; }

