body { font-family: 'Open Sans', sans-serif; font-weight: 400; font-size: 16px; color: #222; line-height: 1.7; }
hr { border-top: 1px solid #111;  }
address { width: 242px; float: right; display: none; margin-right: 14px; margin-bottom: 0; color: #aaa; }
a:hover { text-decoration: none; }

.top-container { padding-bottom: 100px; }

.navbar-default .navbar-toggle { border: none; }
.navbar-default .navbar-toggle:focus, .navbar-default .navbar-toggle:hover { background: none; }
.menu-reserveer { display: none; }
.adres { display: none; }
.open { display: none; }

.logo { box-shadow: 0px 15px 10px -15px #555; }
.logo { position: fixed; left: calc(50% - 100px); top: 0; display: block; width: 200px; height: 140px; background-image: url("../img/logo.jpg"); background-repeat: no-repeat; background-position: bottom 20px center; background-size: 180px auto; background-color: #100A0C; z-index: 2222;	}

.reserveer { display: block; cursor: pointer; padding-top: 2px; color: white; position: absolute; left: calc(50% - 85px); top: 344px; text-align: center; display: block; width: 170px; height: 30px; background-color: red; z-index: 2;	}
#navbar { padding-top: 0px; }
.navbar-default { border: 0; box-shadow: 0px 1px 20px #555; }
.navbar-default .navbar-nav>li>a { color: #100A0C;  font-size: 14px; }
.nav>li>a { padding: 15px 25px; }
.sliding-link { cursor: pointer; }
.top-nav { height: 40px; text-align: right; font-size: 10px; margin-top: 16px; }
.top-nav a { float: right; display: block; margin: 0 4px; }
.top-photo { width: 100%; padding:0; height: 340px; background-image: url("../img/front-small.jpg"); background-repeat: no-repeat; background-position: bottom center; background-size: auto 360px; margin-top: 100px; }
.drinks-photo { width: 100%; padding:0; height: 260px; background-image: url("../img/drinks-small.jpg"); background-repeat: no-repeat; background-position: bottom center; background-size: auto 360px; }
.bites-top-photo { width: 100%; padding:0; height: 260px; background-image: url("../img/bites-small.jpg"); background-repeat: no-repeat; background-position: bottom center; background-size: auto 260px; margin-top: 100px; }
.breakfast-top-photo { width: 100%; padding:0; height: 260px; background-image: url("../img/breakfast-small.jpg"); background-repeat: no-repeat; background-position: bottom center; background-size: auto 260px; margin-top: 100px; }
.cocktails-top-photo { width: 100%; padding:0; height: 260px; background-image: url("../img/cocktails-small.jpg"); background-repeat: no-repeat; background-position: bottom center; background-size: auto 260px; margin-top: 100px; }
.dinner-top-photo { width: 100%; padding:0; height: 260px; background-image: url("../img/dinner2-small.jpg"); background-repeat: no-repeat; background-position: bottom center; background-size: auto 260px; margin-top: 100px; }
.bottom-photos { width: 100%; padding: 0; }
.bottom-photo { padding:0 30px 20px; 30px; }
.bottom-photos img { width: 100%; }
.text-block { margin-left: auto; margin-right: auto; max-width: 600px; text-align: center; padding-top: 20px; padding-bottom: 40px; }
.text-block h1 { font-weight: 800; font-size: 26px; }
.text-block h2 { font-weight: 700; padding: 20px 0; font-size: 26px; }
.text-block hr { border-top: 1px solid #ccc; margin-top: 50px; }
.fotoblok { width: 100%; padding: 0; margin-top: 40px; }
.fotoblok img { width: 100%; height: auto; }
.bottom-photo img { width: 100%; height: auto; }
.fotoblok p { padding: 0; margin: 0; }

.bg { background-color: #eee; padding-bottom: 100px; }
.onderfoto { position: relative; float: left; display: block; padding: 10px 40px 30px 40px;; background-color: #fff; text-align: center; width: 100%; min-height: 200px; overflow: hidden; }
.onderfoto h2 {font-weight: 700;}

.footer { background-color: #100A0C; height: 260px; }
.footerblock { text-align: center; margin-top: 30px; color: #aaa; font-size: 12px; }
.footerblock img { margin: 30px 0 50px; }
.telefoon { color: white; }

.fa-inverse { color: #111; }
.fa-lg { font-size: 2.4em; }
.icons { padding: 30px 0 20px; background-color: #eee; width: 100%; }
.icons a { color: #111; }

#return-to-top { z-index: 99999; position: fixed; bottom: 20px; right: 20px; background: rgb(0, 0, 0);  background: rgba(0, 0, 0, 0.7); width: 50px; height: 50px; display: block; text-decoration: none;  -webkit-border-radius: 35px; -moz-border-radius: 35px; border-radius: 35px; display: none; -webkit-transition: all 0.3s linear; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; }
#return-to-top i { color: #fff; margin: 0; position: relative; left: 16px; top: -13px; font-size: 19px; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; }
#return-to-top:hover { background: rgba(0, 0, 0, 0.9); }
#return-to-top i { margin: 0; position: relative; left: 16px; top: 11px; font-size: 20px; }
#return-to-top:hover i { color: #fff; }

.responsive { width: 100%; }
.responsive tr { border-bottom: 1px solid #bbb; }
.responsive td { text-align: left; padding-top: 12px; font-weight: 800; }
sup { font-weight: 400; color: #666; }

.submit { width: 170px; height: 32px; background-color: red; border: none; border-radius: 0px; }
.reserve-button { display: block; margin-left: auto; margin-right: auto;cursor: pointer; padding-top: 2px; color: white; text-align: center;width: 200px; height: 30px; background-color: red; }



@media screen and (min-width: 768px) and (max-width: 990px) {
	address { display: block; width: 170px; }
	.onderfoto { padding: 8px 8px; height: 320px;}
	.onderfoto h2 { font-size: 26px; margin-top: 10px;}
	.text-block h1 { font-size: 30px; }
	.text-block h2 { font-size: 30px; }
	.top-photo { height: 380px; background-image: url("../img/front.jpg"); background-size: auto 430px; margin-top: 118px; }
	.drinks-photo { height: 300px; background-image: url("../img/drinks.jpg"); background-size: auto 300px; }
	.bites-top-photo { height: 282px; background-image: url("../img/front.jpg"); background-size: auto 282px; margin-top: 118px; }
	.breakfast-top-photo { height: 282px; background-image: url("../img/breakfast.jpg"); background-size: auto 282px; margin-top: 118px; }
	.dinner-top-photo { height: 282px; background-image: url("../img/dinner2.jpg"); background-size: auto 282px; margin-top: 118px; }
	.cocktails-top-photo { height: 282px; background-image: url("../img/cocktails.jpg"); background-size: auto 282px; margin-top: 118px; }
	.bottom-photo { padding:0 0 20px; 0; }
	.top-nav { padding-right: 0px; }
	.logo { position: fixed; left: calc(50% - 110px); top: 0; display: block; width: 220px; height: 140px; background-image: url("../img/logo.jpg"); background-repeat: no-repeat; background-position: bottom 20px center; background-size: 200px auto; background-color: #100A0C; z-index: 2222;	}
	.reserveer { display: block; cursor: pointer; padding-top: 2px; color: white; position: fixed; left: calc(50% + 180px); top: 118px; text-align: center; display: block; width: 170px; height: 30px; background-color: red; z-index: 2222;	}
	.container .jumbotron {	padding-right: 0px;	padding-left: 0px; }
	.jumbotron { padding-top: 120px; padding-bottom: 48px; background-color: #fff;	}
	.navbar-default .navbar-nav>li>a { font-size: 13px; }
	.nav>li>a { padding: 15px 5px; }
	.navbar-nav { font-weight: 700; height: 62px; }
	.navbar-nav li:nth-child(4) { margin-left: 264px; }
	.navbar-nav { float: left; margin: 0; }
	.jumbotron img { width: 100%; }
}


@media screen and (min-width: 990px) {
	address { display: block; width: 400px;	}
	.onderfoto { padding: 10px 40px; height: 340px; }
	.onderfoto h2 { font-size: 30px; margin-top: 20px;}
	.text-block h1 { font-size: 32px; }
	.text-block h2 { font-size: 32px; }
	.top-photo { height: 430px; background-image: url("../img/front.jpg"); background-size: auto 430px; margin-top: 118px; }
	.drinks-photo { height: 340px; background-image: url("../img/drinks.jpg"); background-size: auto 340px; }
	.bites-top-photo { height: 282px; background-image: url("../img/bites.jpg"); background-size: auto 282px; margin-top: 118px; }
	.breakfast-top-photo { height: 282px; background-image: url("../img/breakfast.jpg"); background-size: auto 282px; margin-top: 118px; }
	.dinner-top-photo { height: 282px; background-image: url("../img/dinner2.jpg"); background-size: auto 282px; margin-top: 118px; }
	.cocktails-top-photo { height: 282px; background-image: url("../img/cocktails.jpg"); background-size: auto 282px; margin-top: 118px; }
	.bottom-photo { padding:0 0 20px; 0; }
	.top-nav { padding-right: 0px; }
	.logo { position: fixed; left: calc(50% - 132px); top: 0; display: block; width: 264px; height: 160px; background-image: url("../img/logo.jpg"); background-repeat: no-repeat; background-position: bottom 40px center; background-size: 200px auto; background-color: #100A0C; z-index: 2222;	}
	.reserveer { display: block; cursor: pointer; padding-top: 2px; color: white; position: fixed; left: calc(50% + 280px); top: 118px; text-align: center; display: block; width: 170px; height: 32px; background-color: red; z-index: 2222;	}
	.container .jumbotron {	padding-right: 0px;	padding-left: 0px; }
	.jumbotron { padding-top: 120px; padding-bottom: 48px; background-color: #fff; }
	.nav>li>a { padding: 15px 15px; }
	.navbar-nav { font-weight: 700; height: 62px; }
	.navbar-nav li:nth-child(4) { margin-left: 332px; }
	.navbar-nav { float: left; margin: 0; }
	.jumbotron img { width: 100%; }
}


@media screen and (min-width: 1200px) {
	address { width: 400px;	}
	.onderfoto { padding: 10px 40px; height: 310px; }
	.top-photo { height: 430px; background-image: url("../img/front.jpg"); background-size: auto 430px; margin-top: 118px; }
	.drinks-photo { height: 390px; background-image: url("../img/drinks.jpg"); background-size: auto 390px; }
	.bottom-photo { padding:0px; }
	.top-nav { padding-right: 60px;	}
	.logo { position: fixed; left: calc(50% - 132px); top: 0; display: block; width: 264px; height: 160px; background-image: url("../img/logo.jpg"); background-repeat: no-repeat; background-position: bottom 40px center; 
	background-size: 200px auto; background-color: #100A0C; z-index: 2222;	}
	.container .jumbotron {	padding-right: 0px;	padding-left: 0px; }
	.jumbotron { padding-top: 120px; padding-bottom: 48px; background-color: #fff; }
	.nav>li>a { padding: 15px 25px; }
	.navbar-nav { font-weight: 700; height: 62px; }
	.navbar-nav li:nth-child(4) { margin-left: 322px; }
	.navbar-nav { float: left; margin: 0 50px; }
	.jumbotron img { width: 100%; }
}


@media screen and (max-width: 767px) {
	#navbar { padding-top: 40px; /*padding-left: 76px;*/ max-height: 448px; padding-left: calc(50% - 96px);}
	.navbar-default .navbar-nav>li>a { font-size: 16px; line-height: 5px; }
	.navbar-header { margin-top: 56px; }
	.top-nav { position: absolute; height: 40px; text-align: left; font-size: 10px; top: 56px; width: 72px; padding-left: 0px; }
	.menu-reserveer { display: block; cursor: pointer; padding-top: 2px; color: white; text-align: center; display: block; width: 200px; height: 30px; background-color: red; z-index: 2;margin-left: 11px;margin-top: 10px;}
	.menu-reserveer a { color: #fff; text-decoration: none; }
	.adres { display: block; margin-left: 10px; padding: 10px 0; border-top: 1px solid #aaaaaa; border-bottom: 1px solid #bbbbbb; font-size: 12px; }
	.open { display: block; padding: 10px 0 10px 10px; }
	.responsive th, .responsive td { padding: 10px; text-align: center; }
	.responsive td { border: 0px; border: 0px; padding: 10px 15px; }
	.responsive td { display: block; }
	.bottom-photo { padding: 0;  }
	.text-block { padding-bottom: 10px; }
	.grey { background-color: #f4f4f4; padding: 0; }
	.onderfoto {padding-top: 22px; padding-bottom: 40px; }
	.reserve-button { margin-top: 40px; }
	.reserveer { width: 200px; left: calc(50% - 100px); }
	.submit { width: 200px; }
}

@media screen and (max-width: 620px) {
	.top-container { width: 100%; padding: 0; padding-bottom: 30px; }
	.top-container .col-sm-4 { width: 100%; padding: 0; }
}