/* Typekit load fix */
.wf-loading h1,
.wf-loading h2,
.wf-loading h3,
.wf-loading h4,
.wf-loading h5,
.wf-loading p,
.wf-loading li a,
.wf-loading li,
.wf-loading a,
.wf-loading input,
.wf-loading .btn {
	visibility: hidden
}

html {
	box-sizing: border-box;
}
*, *:before, *:after {
	box-sizing: inherit;
}

body {
	margin: 0;
	padding: 0;
	-webkit-font-smoothing: antialiased;
	font-family: 'futura-pt', sans-serif;
	font-weight: 400;
	font-size: 1rem;
	color: #323232;
	background: #ffffff;
	background: -moz-radial-gradient(center, ellipse cover,  #ffffff 0%, #e4eae6 100%);
	background: -webkit-radial-gradient(center, ellipse cover,  #ffffff 0%,#e4eae6 100%);
	background: radial-gradient(ellipse at center,  #ffffff 0%,#e4eae6 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e4eae6',GradientType=1 );
}

body,
html {
	height: 100%;
}

h1,
h2,
h3,
h4 {
	font-family: 'futura-pt', sans-serif;
	font-weight: 300;
	color: #27714e;
	margin: 0;
	padding: 0;
}

h2 {
	margin-bottom: 20px;
	font-weight: 100;
	font-size: 36px;
}
h3 {
	font-weight: 400;
	padding-bottom: 10px;
	text-align: center;
	color: #27714e;
}

hr {
	margin: 0px auto;
	margin-bottom: 20px;
	width: 80px;
	border: 1px solid #27714e;
}

a {
	transition: all .2s ease-out;
	color: #2a7354;
}
a:focus {
	color: #fff;
}
a:hover {
	color: inherit;
}

input {
	outline: 0;
}

p.intro {
	font-size: 1rem;
	font-weight: bold;
	text-align: center;
}

.row .row {
	margin: 0;
}


/* WRAPPER */
#wrapper {
	margin-left: 220px;
	overflow: hidden;
}

.front {
	position: relative;
}

.cb-slideshow,
.cb-slideshow:after {
	position: relative;
	width: 100%;
	height: 100%;
	height: 100vh;
	color: #fff;
}

.cb-slideshow li span {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0px;
    left: 0px;
    color: transparent;
    background-size: cover;
    background-position: 50% 50%;
    background-repeat: none;
    opacity: 0;
    z-index: 0;
	-webkit-backface-visibility: hidden;
    -webkit-animation: imageAnimation 36s linear infinite 0s;
    -moz-animation: imageAnimation 36s linear infinite 0s;
    -o-animation: imageAnimation 36s linear infinite 0s;
    -ms-animation: imageAnimation 36s linear infinite 0s;
    animation: imageAnimation 36s linear infinite 0s;
}
.cb-slideshow li div h3 {
    font-family: 'BebasNeueRegular', 'Arial Narrow', Arial, sans-serif;
    font-size: 240px;
    padding: 0;
    line-height: 200px;
	color: rgba(169,3,41, 0.8);
}
.cb-slideshow li:nth-child(1) span {
	background-image: url(../img/front.jpg);
}
.cb-slideshow li:nth-child(2) span {
    background-image: url(../img/front2.jpg);
    -webkit-animation-delay: 6s;
    -moz-animation-delay: 6s;
    -o-animation-delay: 6s;
    -ms-animation-delay: 6s;
    animation-delay: 6s;
}
.cb-slideshow li:nth-child(3) span {
    background-image: url(../img/front3.jpg);
    -webkit-animation-delay: 12s;
    -moz-animation-delay: 12s;
    -o-animation-delay: 12s;
    -ms-animation-delay: 12s;
    animation-delay: 12s;
}
.cb-slideshow li:nth-child(4) span {
    background-image: url(../img/front4.jpg);
    -webkit-animation-delay: 18s;
    -moz-animation-delay: 18s;
    -o-animation-delay: 18s;
    -ms-animation-delay: 18s;
    animation-delay: 18s;
}

.cb-slideshow li:nth-child(5) span {
    background-image: url(../img/front5.jpg);
    -webkit-animation-delay: 24s;
    -moz-animation-delay: 24s;
    -o-animation-delay: 24s;
    -ms-animation-delay: 24s;
    animation-delay: 24s;
}

.cb-slideshow li:nth-child(6) span {
    background-image: url(../img/front6.jpg);
    -webkit-animation-delay: 30s;
    -moz-animation-delay: 30s;
    -o-animation-delay: 30s;
    -ms-animation-delay: 30s;
    animation-delay: 30s;
}

.arch-home {
	color: #333;
}

#ress {
	padding: .2em;
	padding-left: 20px;
	margin-bottom: 0;
	font-size: 2rem;
	font-weight: 600;
}

/* Animatie */
@-webkit-keyframes imageAnimation {
	0% {
	    opacity: 0;
	    -webkit-animation-timing-function: ease-in;
	}
	8% {
	    opacity: 1;
	    -webkit-transform: scale(1.05);
	    -webkit-animation-timing-function: ease-out;
	}
	17% {
	    opacity: 1;
	    -webkit-transform: scale(1.1);
	}
	25% {
	    opacity: 0;
	    -webkit-transform: scale(1.1);
	}
	100% { opacity: 0 }
}
@-moz-keyframes imageAnimation {
	0% {
	    opacity: 0;
	    -moz-animation-timing-function: ease-in;
	}
	8% {
	    opacity: 1;
	    -moz-transform: scale(1.05);
	    -moz-animation-timing-function: ease-out;
	}
	17% {
	    opacity: 1;
	    -moz-transform: scale(1.1);
	}
	25% {
	    opacity: 0;
	    -moz-transform: scale(1.1);
	}
	100% { opacity: 0 }
}
@-o-keyframes imageAnimation {
	0% {
	    opacity: 0;
	    -o-animation-timing-function: ease-in;
	}
	8% {
	    opacity: 1;
	    -o-transform: scale(1.05);
	    -o-animation-timing-function: ease-out;
	}
	17% {
	    opacity: 1;
	    -o-transform: scale(1.1);
	}
	25% {
	    opacity: 0;
	    -o-transform: scale(1.1);
	}
	100% { opacity: 0 }
}
@-ms-keyframes imageAnimation {
	0% {
	    opacity: 0;
	    -ms-animation-timing-function: ease-in;
	}
	8% {
	    opacity: 1;
	    -ms-transform: scale(1.05);
	    -ms-animation-timing-function: ease-out;
	}
	17% {
	    opacity: 1;
	    -ms-transform: scale(1.1);
	}
	25% {
	    opacity: 0;
	    -ms-transform: scale(1.1);
	}
	100% { opacity: 0 }
}
@keyframes imageAnimation {
	0% {
	    opacity: 0;
	    animation-timing-function: ease-in;
	}
	8% {
	    opacity: 1;
	    transform: scale(1.05);
	    animation-timing-function: ease-out;
	}
	17% {
	    opacity: 1;
	    transform: scale(1.1);
	}
	25% {
	    opacity: 0;
	    transform: scale(1.1);
	}
	100% { opacity: 0; }
}

.welcome {
	height: 100vh;
	background: #ccc;
	background: #fff url('../img/frontpic.jpg') no-repeat center center / cover;
}
.welcome .btn.res {
	display: none;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	
	margin: 0; 
	padding: 4px 1rem;
	line-height: 30px;
	width: auto;
	height: auto;
	
	border-color: #211902;
}
.no-touch .welcome .btn.res:hover {
	border-color: #2A7354;
}



/*
.welcome .over {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background: rgba(0, 0, 0, 0.5);
	padding-top: 34px;
}
.welcome h2,
.welcome h5 {
	color: #fff;
	font-weight: 300;
	margin: 0;
	padding: 0;
}
.welcome h2 {
	margin-bottom: 20px;
}
.welcome h5 {
	margin-top: 20px;
}
.welcome .res	{
	position: absolute;
	left: 20px;
	bottom: 20px;
}
.welcome .menu	{
	position: absolute;
	right: 20px;
	bottom: 20px;
}
.welcome p {
	position: absolute;
	font-family: 'Aller';
	font-size: 14px;
	bottom: 20px;
	left: 20px;
	margin: 0;
	padding: 0;
	color: #fff;
}
.welcome .btn {
    display: none;
    margin: 30px auto 0;
    width: 150px;
    height: 46px;
    line-height: 44px;
    color: #fff;
    background: transparent;
    border: 2px solid #fff;
    text-transform: uppercase;
    text-align: center;
    font-weight: bold;
}
.welcome .btn:hover {
	background: #fff !important;
	color: #333 !important;
	border-color: #fff !important;
}
.welcome .op {
	opacity: 0.9;
}
*/


/* NAV */
.main-nav {
	position: fixed;
	top: 0;
	left: 0;
	width: 220px;
	height: 100%;
	background: #ffffff;
	background: -moz-radial-gradient(center, ellipse cover,  #ffffff 0%, #ecf5f1 100%);
	background: -webkit-radial-gradient(center, ellipse cover,  #ffffff 0%,#ecf5f1 100%);
	background: radial-gradient(ellipse at center,  #ffffff 0%,#ecf5f1 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ecf5f1',GradientType=1 );
	z-index: 100;
	border-right: 1px solid #ecf5f1;
}
/* OLD
.main-nav .logo {
	display: hidden;
	opacity: 0;
	margin: 30px auto 0;
	margin-bottom: 30px;
	width: 170px;
	height: 190px;
	background: url(../svg/logo.svg) no-repeat;
}
*/
.main-nav .logo {
	display: hidden;
	opacity: 0;
	margin: 40px auto;
	width: 180px;
	height: 57px;
	background: url('../svg/logo-2022-black.svg') no-repeat;
}

.main-nav ul {
	list-style: none;
	display: block;
	padding: 0;
	margin: 20px;
	text-align: center;
}
.main-nav ul.lang {
	display: block;
	opacity: 1;
}
.main-nav ul.lang li {
	display: inline;
}
.main-nav ul.lang li a {
	text-transform: lowercase;
	color: #888;
	font-family: 'futura-pt', sans-serif;
	font-weight: 400;
	font-size: 1rem;
	display: inline-block;
	line-height: 33px;
	height: 35px;
	width: 35px;
	padding: 0;
	border-radius: 50%;
}
.no-touch .main-nav ul.lang li a:hover,
.main-nav ul.lang li a.active {
	background-color: #c4cac7;
    color: #ffffff;
    font-weight: 600;
}

.main-nav ul.menu {
	margin: 20px auto 0;
	width: 160px;
}
.main-nav ul.menu li {
	opacity: 1;
}
.main-nav ul.menu li a {
	display: block;
	position: relative;
	color: #2a7354;
	border-bottom: 1px solid #e7f5ef;
	font-family: 'futura-pt', sans-serif;
	font-weight: 400;
	text-transform: uppercase;
	font-size: 1rem;
	text-align: center;
	letter-spacing: 1px;
	padding: 8px 0;
}
.no-touch .main-nav ul.menu li a:hover {
	background: #ecf5f1;
}
.main-nav ul.menu li:last-child a {
	border: 0;
}
.main-nav .book-now {
	display: none !important;
	opacity: 0;
	margin: 30px auto 0;
	width: 200px;
	height: 50px;
	line-height: 47px;
	color: #211902;
	background: #ffff;
	border: 2px solid #211902;
	text-transform: uppercase;
	text-align: center;
}
.no-touch .main-nav .book-now:hover {
	background: #211902;
	color: #fff;
}
.mailer {
	color: #999;
	text-decoration: underline;
}

/* bottom */
.main-nav .bottom {
	width: 100%;
	position: absolute;
	bottom: 0;
	
	padding: 5px;
	font-size: .9rem;
	
	text-align: center;
}
.main-nav .bottom .logo-VK {
	width: 20px;
}

/* mobile header */
div.mobile-header {
	display: none;
	position: fixed;
	top: 0;
	z-index: 1999;
	width: 100%;
	height: 65px;
	background-color: #fff;
	border-bottom: 1px solid #eee;
	text-align: center;
	padding-top: 6px;
}
div.mobile-header .btn {
	font-size: 0.75rem;
	line-height: 20px;
	padding: 2px 5px;
	margin: 0;
	display: inline-block;
	width: auto;
	height: auto;
	border-color: #211902;
}
.no-touch div.mobile-header .btn:hover {
	border-color: #2A7354;
}

/* mobile header V2 - zonder book now button */
div.mobile-header {padding-top: 22px;}
div.mobile-header .btn {display: none;}






/* Restaurant */
.restaurant {
	position: relative;
    background: #fff;
    background-size: cover;
}
.restaurant .btn {
	margin: 0px auto;
}
.restaurant .copy {
	position: relative;
	text-align: center;
	max-width: 300px;
	z-index: 1;
}
#circle {
    position: absolute;
    top: -50px;
    left: -38px;
    width: 400px;
    height: 400px;
    background: #d8eae2;
    opacity: 0.5;
    border-radius: 50%;
    z-index: 0;
}
.restaurant h3 {
	font-size: 1.7rem;
}
.restaurant h2 {
	margin-bottom: 20px;
    font-size: 18px;
    line-height: 1;
    font-weight: bold;
}
.restaurant img {
	margin-top: 70px;
}
.restaurant .bekijk {
	margin-top: -22px;
}


/* Architectuur */
.architectuur {
	background: url(../img/arch.jpg) no-repeat;
	background-size: cover;
	min-height: 550px;
}
.architectuur .copy {
	float: right;
	text-align: center;
	padding: 20px;
	opacity: 0.95;
	background: #fff;
	max-width: 400px;
}

/* Artistic room */
.room #uwevent {
    position: absolute;
    top: -150px;
    right: -95px;
    border-radius: 50%;
    background: #fff;
    max-width: 520px;
    height: 520px;
    padding: 40px;
    padding-top: 90px;
    margin: 0px auto;
    opacity: 0.9;
    z-index: 10;
}
#owl-artisticroom {
	margin-top: 70px;
}


/* Pers */
.pers {
	position: relative;
	background: #fff ;
	padding-top: 3rem;
	padding-bottom: 4rem;
}
.pers h3 {
	text-align: left;
	color: #fff;
	background: #282826;
	padding: 4px 14px;
	display: inline-block;
	margin-bottom: 1rem;
    text-transform: uppercase;
    font-size: 1.6rem;
}
.pers .columns {
	padding-right: 2rem;
	padding-right: 2rem;
}
.pers blockquote {
	font-family: Georgia, serif;
	font-size: 18px;
	font-style: italic;
	width: 100%;
	margin: 0.25em 0;
	padding: 0.25em 40px;
	line-height: 1.45;
	position: relative;
	color: #383838;
	border: 0;
}
.pers p {
	color: #777;
}
.pers blockquote:before {
	display: block;
	content: "\201C";
	font-size: 80px;
	position: absolute;
	left: -8px;
	top: -20px;
	color: #7a7a7a;
}
.pers cite {
	color: #777;
	font-size: 14px;
	display: block;
	margin-top: 5px;
	font-family: Georgia, serif;
	font-weight: bold;
}
.pers cite:before {
	content: "\2014 \2009";
}
.pers cite a {
	float: right;
	color: #999;
	text-decoration: none;
	font-family: 'Aller', sans-serif;
	font-weight: normal;
}
.pers cite a:hover {
	color: #111;
}
.pers .rinus {
	margin-bottom: 2rem;
}
.pers .press2 {
	margin-bottom: 2rem;
}
.pers article.padding {
	margin-bottom: 2rem;
}
.pers .rating {
	margin-top: 10px;
	margin-bottom: 10px;
}


.pad {
	padding-top: 80px;
	padding-bottom: 80px;
}




.arch-content img {
	display: block;
	margin: 20px auto;
	max-width: 60%;
}

#owl-vz,
#owl-fz,
#owl-res {
	margin: 0px auto;
	width: 100%;
	margin-top: 40px;
	text-align: center;
}
#owl-res {
	margin-bottom: 40px;
}
#owl-vz:hover,
#owl-fz:hover,
#owl-res:hover {
	cursor: grab;
	cursor: -webkit-grab;
}

/* CONTACT */
input[type="text"],
input[type="password"],
input[type="date"],
input[type="datetime"],
input[type="datetime-local"],
input[type="month"],
input[type="week"],
input[type="email"],
input[type="number"],
input[type="search"],
input[type="tel"],
input[type="time"],
input[type="url"],
input[type="color"],
textarea,
select {
    box-shadow: none !important;
    transition: none;
    border-radius: 3px;
    color: #555;
    margin: 0;
    margin-top: .5rem;
    border: 1px solid #ebebeb;
 	transition: all .3s ease-out;
 	outline: 0;
}

.contact {
	position: relative;
}
.contact .contact-form {
	position: relative;
    background: inherit;
    padding: 30px;
    opacity: 0.95;
    z-index: 0;
}
.contact-form {
	width: 50%;
}
.contact form {
	position: relative;
	padding: 30px;
	background: #fff;
	width: 600px;
	opacity: 0.95;
	z-index: 200;
    box-shadow: 0px 0px 37px -6px rgba(0,0,0,0.2);
    margin-top: -20px;

}
form .captcha,
form .cat-captcha {
	border: 1px solid #ebebeb;
    padding: 0.5rem;
    height: 2.4375rem;
    border-radius: 3px;
    color: #555;
    font-size: .9rem;
    margin-top: 8px;
    width: 60px;
}
form .invalid {
	border-color: red !important;
}
.contact #openingsuren {
	position: relative;
    max-width: 300px;
    background: #2a7354;
    z-index: 1000;
    padding: 20px;
    margin-top: 120px;
    margin-left: 40px;
    z-index: 200;
    display: none;
}
.contact #openingsuren h3,
.contact #openingsuren p {
	color: #fff;
}
.contact #openingsuren hr {
	border-color: #fff;
}
#contact h5 {
	color: #333 !important;
}

.covid {
	position: absolute;
	height: 95px;
	top: 50%;
	left: 50%;
	z-index: 100;
	transform: translate(-50%, -50%);
}
.covid span {
	display: block;
	padding: 0;
	margin: 0;
	color: #333;
	font-family:'futura-pt', sans-serif;
	font-size: 18px;
	font-weight: bold;
	background: rgba(255,255,255,0.9);
	text-align: center;
	padding: 10px 20px;
}


/* ATMOSPHERE */


#waves1 {
	position: absolute;
	top: -78px;
	right: 50px;
	height: 97px;
	width: 527px;
	background: url(../img/atmosphere/waves.png) no-repeat;
}
#waves2 {
    position: absolute;
    top: -101px;
    left: -170px;
    height: 81px;
    width: 351px;
    background: url(../img/atmosphere/waves2.png) no-repeat;
    z-index: 50;
}
#waves3 {
	position: absolute;
    bottom: 34px;
    left: 50px;
    height: 97px;
    width: 527px;
    background: url(../img/atmosphere/waves3.png) no-repeat;
    z-index: 50;
}
.z10 {
	z-index: 10;
}
.z11 {
	z-index: 11;
}
.z12 {
	z-index: 12;
}
button:hover, button:focus, .button:hover, .button:focus{outline-style: none;}



/* BUTTONS */
.btn {
	background: #2A7354;
    display: inline-block;
    text-decoration: none;
    color: #fff;
    padding: 6px 14px;
    padding-top: 8px;
    text-transform: uppercase;
    transition: all .2s ease-out;
    font-family: 'futura-pt',arial,helvetica;
    font-weight: 600;
    font-size: 0.9rem;
    text-align: center;
    border: 1px solid #2A7354;
    border-radius: 0;
}
.btn:focus,
.no-touch .btn:hover,
.no-touch .btn:hover:focus  {
	color: #2A7354;
	background: #fff;
}

.btn.res {
	display: block;
    background: #211902;
    width: 162px;
    margin: 20px auto;
    border: 1px solid #1f6748;
}
.no-touch .res:hover {
	background: #fff;
	color: #1f6748 !important;
}
.contact-btn {
	display: block;
	float: right;
	margin-right: -.9375rem;
	margin-top: 10px;
}

.bekijk {
	position: relative;
	margin-top: -20px;
	margin-right: 40px;
	z-index: 90;
}

.arrows {
	position: fixed;
	display: none;
	right: 0;
	bottom: 30%;
	background: #fff;
	z-index: 200;
}
.arrows a {
	display: block;
	width: 60px;
	height: 60px;
	text-align: center;
	line-height: 60px;
	transition: opacity .3s;
	opacity: 0.4;
}
.no-touch .arrows a:hover,
.arrows a.scrolling {
	opacity: 1;
}
.arrows a:first-child {
	border-bottom: 10px solid transparent;
}
.pay {
	padding: 20px;
}

/* OVERLAYS */
.overlay-book,
.overlay-contact {
	position: fixed;
	display: none;
	opacity: 0;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 11000;
	background: #e4eae6;
	overflow-y: scroll;

}
.overlay-book .modal,
.overlay-contact .modal {
	position: absolute;
	opacity: 0;
	display: none;
	top: 0;
	left: 0;
	width: 100%;
	background: #e4eae6;
	padding: 30px;
	z-index: 12000;
}
.overlay {
	position: fixed;
	display: none;
	opacity: 0;
	top: 0;
	left: 220px;
	width: 100%;
	height: 100%;
	padding: 0;
	z-index: 10000;
	margin: 0px auto;
	margin-right: 220px;
	color: #333;
	overflow: auto;
	-webkit-overflow-scrolling: touch;
	background: #ffffff;
	background: -moz-radial-gradient(center, ellipse cover,  #ffffff 0%, #e4eae6 100%);
	background: -webkit-radial-gradient(center, ellipse cover,  #ffffff 0%,#e4eae6 100%);
	background: radial-gradient(ellipse at center,  #ffffff 0%,#e4eae6 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e4eae6',GradientType=1 );
}
.close {
	position: fixed;
	right: 50px;
	top: 50px;
	opacity: 0.5;
	z-index: 1000;
}
.no-touch .close:hover {
	opacity: 1;
}
.close2 {
	position: absolute;
	right: 50px;
	top: 50px;
	opacity: 0.5;
}
.no-touch .close2:hover {
	opacity: 1;
}

/* overlay met green background */
.overlay.green {
	background: #27714e;
	color: #fff;
}
.overlay.green h3,
.overlay.green h4 {
	color: #fff;
}
.overlay.green hr {
	border-color: #fff;
}
.overlay.green .close {
	background: #fff;
	padding: .5rem;
	border-radius: 100%;
	
	top: 10px;
	right: 15px;
	margin: 0;
}


.menu-link {
	display: none !important;
}
.menu-content,
.arch-content,
.room-content,
.pers-content,
.restaurant-content,
.news-popup-content {
	display: none;
	margin: 0px auto;
	margin-right: 250px;
	overflow-y: auto;
	overflow-x: hidden;
	min-height: 100%;
	padding-bottom: 2rem;
}
.menu-content h3,
.arch-content h3,
.room-content h3,
.pers-content h3,
.restaurant-content h3,
.news-popup-content h3 {
	color: #27714e;
	text-transform: capitalize;
	margin-top: 50px;
	font-size: 2rem;

}
.menu-content h4,
.arch-content h4,
.room-content h4,
.pers-content h4,
.restaurant-content h4,
.news-popup-content h4 {
	color: #333;
	margin: 0px auto;
	max-width: 70%;
	margin-top: 30px;
}

.room-content ul {
	color: #333;
	margin: 0px auto;
	max-width: 70%;
	list-style: disc;
	margin-bottom: 30px;
	padding-left: 18px;
}
.menu-content p,
.arch-content p,
.room-content p,
.pers-content p,
.restaurant-content p,
.news-popup-content p  {
	margin: 0px auto;
	max-width: 70%;
	margin-bottom: 1rem;
}
.menu-content hr,
.arch-content hr,
.room-content hr,
.pers-content hr,
.restaurant-content hr,
.news-popup-content hr {
	border-color: #27714e;
}
#monday {
	position: absolute;
	opacity: 0;
	top: 0;
	left: 0;
	width: 200px;
	height: 200px;
}
h5 {
	color: #333;
	font-weight: bold;
}
.owl-carousel {
	margin-bottom: 20px;
}

.menu-content nav {
	margin: 0px auto;
	margin-top: 30px;
	margin-bottom: 30px;
}
.menu-content .menu-nav ul {
	margin: 0;
	padding: 0;
}
.menu-content .menu-nav li {
	display: inline;
}
.menu-content .menu-nav li a {
	border: 2px solid transparent;
	text-align: center;
	padding: 12px;
	color: #fff;
	text-transform: uppercase;
	margin-right: 20px;
}
.menu-content .menu-nav li a.active,
.no-touch .menu-content .menu-nav li a:hover {
	border-color: #fff;
}
.menu-content span {
	color: #7d7d7d;
	font-size: .8em;
	margin-left: 20px;
}
.address {
    color: #999;
    margin-top: 20px;
    margin-left: 45px;
    font-size: 13px;
}

/* to-start */
#to-start ul,
#funky ul,
#salades ul,
#pasta ul,
#vis ul,
#vlees ul,
#desserts ul {
	margin: 0;
	padding: 0;
}
#to-start li,
#funky li,
#salades li,
#pasta li,
#vis li,
#vlees li,
#desserts li {
	padding-top: 20px;
	padding-bottom: 20px;
	display: block;
	border-bottom: 1px solid #ddd;
	text-align: center;
	font-size: 16px;
}
#to-start li:last-child,
#funky li:last-child,
#salades li:last-child,
#pasta li:last-child,
#vis li:last-child,
#vlees li:last-child,
#desserts li:last-child {
	border: 0;
}



/* FOOTER */
.main-footer {
	float: right;
	text-align: center;
	width: 100%;
	bottom: 20px;
	background: #fff;
	z-index: 200;
	font-family: 'futura-pt';
	font-weight: 400;
}
.main-footer ul {
	padding: 0;
	margin: 0;
	list-style: none;
	padding: 10px 20px;
}
.main-footer li {
	display: inline;
	color: #999;
	font-size: 13px;
	text-transform: uppercase;
	margin-left: 20px;
}
.main-footer li a {
	color: #999;
	text-decoration: underline;
}
.main-footer li:first-child {
	margin-left: 0;
}
.main-footer .address-mobile p {
	margin: 0px auto;
	margin-top: 20px;
	margin-bottom: 20px;
	color: #999;
}
.main-footer a {
	color: #999;
	text-decoration: underline;
}

/* GOOGLE MAPS */
#map {
	width: 100%;
	height: 400px;
	margin-top: -100px;
}


/* HELPERS */
.max-width {
	max-width: 100%;
}
.rel {
	position: relative;
}
#resengo {
	width: 100%;
    height: 100%;
    min-height: 440px;
    background-image: url("../img/spinner.gif");
    background-repeat: no-repeat;
    background-position: 50% 50%;
    -webkit-overflow-scrolling: touch;
}

.no-padding {
	padding: 0;
}

.empty {
	background: #fff;
	min-height: 1000px;
}
.overscroll-lock {
	overflow: hidden !important;
	-webkit-overflow-scrolling: hidden !important;
}
.right {
	float: right;
}


.wizard,
.tabcontrol {
    display: block;
    width: 100%;
    overflow: hidden;
}
.wizard a,
.tabcontrol a {
    outline: 0;
}
.wizard ul,
.tabcontrol ul {
    list-style: none !important;
    padding: 0;
    margin: 0;
}
.wizard ul > li,
.tabcontrol ul > li {
    display: block;
    padding: 0;
}
.wizard > .steps .current-info,
.tabcontrol > .steps .current-info {
    position: absolute;
    left: -999em;
}
.wizard > .content > .title,
.tabcontrol > .content > .title {
    position: absolute;
    left: -999em;
}
.wizard > .steps {
    position: relative;
    display: block;
    width: 100%;
}
.wizard.vertical > .steps {
    display: inline;
    float: left;
    width: 30%;
}
.wizard > .steps .number {
    font-size: 16px;
}
.wizard > .steps > ul > li {
    width: 25%;
}
.wizard > .steps > ul > li,
.wizard > .actions > ul > li {
    float: left;
}
.wizard.vertical > .steps > ul > li {
    float: none;
    width: 100%;
}
.wizard > .steps a,
.no-touch .wizard > .steps a:hover,
.wizard > .steps a:active {
    display: block;
    width: auto;
    margin: 0 0.5em 0.5em;
    padding: 10px;
    text-decoration: none;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
}
.wizard > .steps .disabled a,
.no-touch .wizard > .steps .disabled a:hover,
.wizard > .steps .disabled a:active {
    background: #282826;
    color: #aaa;
    cursor: default;
    text-transform: uppercase;
}
.wizard > .steps .current a,
.no-touch .wizard > .steps .current a:hover,
.wizard > .steps .current a:active {
    background: #fff;
    color: #211902;
    cursor: default;
    text-transform: uppercase;
}
.wizard > .steps .done a,
.no-touch .wizard > .steps .done a:hover,
.wizard > .steps .done a:active {
    background: #fff;
    color: #211902;
    text-transform: uppercase;
}
.wizard > .steps .error a,
.no-touch .wizard > .steps .error a:hover,
.wizard > .steps .error a:active {
    background: #ff3111;
    color: #fff;
}
.wizard > .content {
    background: #282826;
    display: block;
    margin: 0.5em;
    overflow: hidden;
    position: relative;
    width: auto;

    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
}
.wizard.vertical > .content {
    display: inline;
    float: left;
    margin: 0 2.5% 0.5em 2.5%;
    width: 65%;
}
.wizard > .content > .body {
	position: relative;
    width: 50%;
    height: 95%;
    padding: 2.5%;
    margin: 0px auto;
}
.wizard > .content > .body ul {
    list-style: disc !important;
}
.wizard > .content > .body ul > li {
    display: list-item;
}
.wizard > .content > .body > iframe {
    border: 0 none;
    width: 100%;
    height: 100%;
}
.wizard > .content > .body input {
    display: inline-block;
    border: 1px solid #ccc;
    width: 100%;
    margin: 0;
    margin-bottom: 10px;
}
.wizard > .content > .body input[type="checkbox"] {
    display: inline-block;
}
.wizard > .content > .body input.error {
    background: rgb(251, 227, 228);
    border: 1px solid #fbc2c4;
    color: #8a1f11;
}
.wizard > .content > .body label {
    display: inline-block;
    color: #b4b4b3;
    font-weight: bold;
}
.wizard > .content > .body em {
	color: red;
}
.wizard > .content > .body label.error {
    color: #8a1f11;
    display: inline-block;
    margin-left: 1.5em;
}
.wizard > .actions {
    position: relative;
    display: block;
    text-align: center;
    width: 100%;
    margin-top: 30px;
}
.wizard.vertical > .actions {
    display: inline;
    float: right;
    margin: 0 2.5%;
    width: 95%;
}
.wizard > .actions > ul {
    display: inline-block;
    text-align: right;
}
.wizard > .actions > ul > li {
    margin: 0 0.5em;
}
.wizard.vertical > .actions > ul > li {
    margin: 0 0 0 1em;
}
.wizard > .actions a,
.no-touch .wizard > .actions a:hover,
.wizard > .actions a:active {
    background: #fff;
    color: #211902;
    display: block;
    padding: 0.5em 1em;
    text-decoration: none;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    text-transform: uppercase;
}
.wizard > .actions .disabled a,
.no-touch .wizard > .actions .disabled a:hover,
.wizard > .actions .disabled a:active {
    background: #282826;
    color: #aaa;
}
.tabcontrol > .steps {
    position: relative;
    display: block;
    width: 100%;
}
.tabcontrol > .steps > ul {
    position: relative;
    margin: 6px 0 0 0;
    top: 1px;
    z-index: 1;
}
.tabcontrol > .steps > ul > li {
    float: left;
    margin: 5px 2px 0 0;
    padding: 1px;
    -webkit-border-top-left-radius: 5px;
    -webkit-border-top-right-radius: 5px;
    -moz-border-radius-topleft: 5px;
    -moz-border-radius-topright: 5px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}
.no-touch .tabcontrol > .steps > ul > li:hover {
    background: #edecec;
    border: 1px solid #bbb;
    padding: 0;
}
.tabcontrol > .steps > ul > li.current {
    background: #fff;
    border: 1px solid #bbb;
    border-bottom: 0 none;
    padding: 0 0 1px 0;
    margin-top: 0;
}
.tabcontrol > .steps > ul > li > a {
    color: #5f5f5f;
    display: inline-block;
    border: 0 none;
    margin: 0;
    padding: 10px 30px;
    text-decoration: none;
}
.no-touch .tabcontrol > .steps > ul > li > a:hover {
    text-decoration: none;
}
.tabcontrol > .steps > ul > li.current > a {
    padding: 15px 30px 10px 30px;
}
.tabcontrol > .content {
    position: relative;
    display: inline-block;
    width: 100%;
    height: 35em;
    overflow: hidden;
    border-top: 1px solid #bbb;
    padding-top: 20px;
}
.tabcontrol > .content > .body {
    float: left;
    position: absolute;
    width: 95%;
    height: 95%;
    padding: 2.5%;
}
.tabcontrol > .content > .body ul {
    list-style: disc !important;
}
.tabcontrol > .content > .body ul > li {
    display: list-item;
}
fieldset {
	background: #282826;
}
#wrapper > div.contact-content > div > div {
	display: none;
}

input[type="text"],
input[type="password"],
input[type="date"],
input[type="datetime"],
input[type="datetime-local"],
input[type="month"],
input[type="week"],
input[type="email"],
input[type="number"],
input[type="search"],
input[type="tel"],
input[type="time"],
input[type="url"],
input[type="color"],
textarea {
	border-radius: 0;
}


/* */
/* MOBILE OVERLAY */
/* */
.mobilenav-overlay {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(42,115,84,0.9);
	z-index: 400;
	opacity: 0;
	overflow-y: scroll;
}
.mobilenav-overlay ul {
	margin: 80px auto;
	margin-bottom: 40px;
	text-align: center;
	padding: 0;
	list-style: none;
	list-style-type: none;
}
.mobilenav-overlay li {
	font-size: 1.4em;
	color: #fff;
	border-bottom: 1px solid #2a7354;
	text-transform: capitalize;
	font-weight: 600;
}
.mobilenav-overlay li:last-child {
	border: 0;
}
.mobilenav-overlay li a {
	display: block;
	color: #fff;
	padding: 10px;
	text-decoration: none;
}
.no-touch .mobilenav-overlay li a:hover {
	background: #2a7354;
	color: #fff;
}
.mobile {
    position: fixed;
    display: none;
    top: 20px; /* v1, zonder mobile-header erbij */
    top: 7px;
    right: 20px;
    z-index: 1000;
    background: rgba(240,240,240,0.9);
    width: 56px;
    height: 50px;
    padding: 0;
    border-radius: 5px;
    z-index: 2000;
}
a.close {
	margin-right: 4px;
}
.mobilenav-overlay .social {
	margin: 20px auto;
	list-style: none;
}
.mobilenav-overlay .social a {
	color: #fff;
	font-size: 2em;
	padding: 10px;
}
.no-touch .mobilenav-overlay .social a:hover {
	color: #fdc894;
}
.mobilenav-overlay .sublist li {
	margin: 0;
	padding: 0;
	border: 0;
}
.langswitch li a {
	text-transform: lowercase;
}
#nav-icon3 {
  width: 40px;
  height: 45px;
  position: relative;
  margin: 0;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .5s ease-in-out;
  -moz-transition: .5s ease-in-out;
  -o-transition: .5s ease-in-out;
  transition: .5s ease-in-out;
  cursor: pointer;
  margin-top: 9px;
  margin-left: 8px;
}
#nav-icon3 span {
  display: block;
  position: absolute;
  height: 5px;
  width: 100%;
  background: #2a7354;
  border-radius: 0px;

  left: 0;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .25s ease-in-out;
  -moz-transition: .25s ease-in-out;
  -o-transition: .25s ease-in-out;
  transition: .25s ease-in-out;
}
.no-touch #nav-icon3:hover {
	opacity: 1;
}
#nav-icon3 span:nth-child(1) {
  top: 0px;
}
#nav-icon3 span:nth-child(2),#nav-icon3 span:nth-child(3) {
  top: 14px;
}
#nav-icon3 span:nth-child(4) {
  top: 28px;
}
#nav-icon3.open span:nth-child(1) {
  top: 18px;
  width: 0%;
  left: 50%;
}
#nav-icon3.open span:nth-child(2) {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}
#nav-icon3.open span:nth-child(3) {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
}
#nav-icon3.open span:nth-child(4) {
  top: 18px;
  width: 0%;
  left: 50%;
}
.mobile-title {
	display: none;
}
.show-on-mobile {
	display: none;
}
.btn-paypal {
	display: hidden;
	opacity: 0;
}
.down-menu {
	margin: 0 auto;
}
.down-menu:hover {
	background: #fff !important;
}

#resengo-process-flow > #resengo-wrapper .empty {
       min-height: 0;
}

.mobilenav-overlay .langswitch {
	margin: 0 !important;
	padding: 0 !important;
}

.mobilenav-overlay .langswitch li,
.mobilenav-overlay .langswitch li a {
	display: inline !important;
	margin: 0 !important;
	border: 0 !important;
}



/* CATERING */
#catering {
	margin: 4rem auto;
	padding-left: 220px;
	max-width: 900px;
	display: none;
}
select {
	margin: 0;
}



/* MEDIA QUERIES */
@media only screen and (max-width: 1360px) {
	.room #uwevent {
		right: 0;
	}
}

@media only screen and (max-width: 1024px) {

	.overlay-book {
		position: absolute;
	}
	.overlay-book .modal, 
	.overlay-contact .modal,
	.news-popup-content .modal {
	    position: relative;
	    opacity: 0;
	    display: none;
	    margin: 0px auto;
	    top: 0 !important;
	    left: 0;
	    width: 100%;
	    height: auto;
	    background: #fff;
	    padding: 30px;
	    z-index: 100000;
	    -webkit-overflow-scrolling: touch !important;
	}
	.contact form {
    	left: 0;
    	top: 0;
    	width: 470px;
	}
	.contact #openingsuren {
		margin-left: 0;
	}
	.atmo10 {
    	left: 18%;
    	top: -19%;
	}
	.geschenkbon #geschenk {
    	top: 43%;
    	right: 12%;
    }
	.geschenk {
    	left: 196px;
    }
	.diner #book {
	    top: 48%;
	    left: 11%;
	}
	#waves1 {
		top: -161px;
	}
	.atmo3 {
		margin-top: -116px;
	}
	.architectuur #arch {
	    top: 35%;
	    left: 19%;
	}
	#waves3 {
	    bottom: 65px;
	    left: 213px;
	}
	.menu-content p,
	.arch-content p,
	.room-content p,
	.restaurant-content p,
	.news-popup-content p {
		max-width: 100%;
	}
	.menu-content h4,
	.arch-content h4,
	.room-content h4,
	.restaurant-content h4,
	.news-popup-content h4 {
		max-width: 100%;
	}
	.menu-content ul,
	.arch-content ul,
	.room-content ul,
	.restaurant-content ul,
	.news-popup-content ul {
		max-width: 100%;
	}
	.arrows {
		display: none;
	}
	.atmo5 {
		opacity: 1 !important;
	}
	.wizard > .steps a,
	.no-touch .wizard > .steps a:hover,
	.wizard > .steps a:active {
		font-size: 12px;
	}

	#circle {
		display: none;
	}
	.restaurant .copy {
		max-width: 100%;
	}
	.restaurant img {
	    margin-top: 60px;
	}
	.room #uwevent {
	    position: relative;
	    top: 0;
	    right: 0;
	    border-radius: 0;
	    background: transparent;
	    max-width: 100%;
	    height: auto;
	    padding: 40px;
	    margin: 0px auto;
	    opacity: 1;
	    z-index: 10;
	}

	.contact #openingsuren {
	    position: relative;
	    max-width: 100%;
	    background: #2a7354;
	    z-index: 1000;
	    padding: 20px;
		margin: 0;
	    z-index: 1000;
	}
	.contact form {
		width: 100%;
	}
	#map {
		margin-top: 0;
	}

	.main-footer .address-mobile p {
	    margin: 0px auto;
	    color: #999;
	    padding: 20px;
	}

}


@media only screen and (max-width: 970px) {

	.menu-content .menu-nav li a {
		display: block;
	}
}


@media only screen and (max-width: 768px) {

	.mobile {
		display: block;
	}
	.main-nav {
		display: none;
	}
	div.mobile-header {
		display: block;
	}
	.welcome .btn.res {
		display: inline-block;
	}
	.welcome .btn {
		display: block;
	}
	#wrapper {
		margin-left: 0;
	}
	.overlay {
		margin-right: 0;
		left: 0;
	}
	.geschenkbon img {
		margin: 0;
		margin-top: -120px;
	}
	.contact #openingsuren {
		min-width: 100%;
	}
	.menu-content,
	.arch-content,
	.room-content,
	.restaurant-content,
	.news-popup-content {
		margin-right: 0;
	}
	.atmo3 {
		display: none;
	}
	.bekijk {

	}
	.architectuur #arch {
		top: 22%;
	}
	.close {
		right: 25px;
		margin-top: -20px;
	}
	.mobile-title {
		display: block;
	}
	.atmo2 {
		display: none;
	}
	.diner #title {
		position: relative;
		top: 0;
		right: 0;
		margin: 0px auto;
		text-align: center;
    	margin-top: 20px;
    	padding: 20px;
	}
	#waves1 {
		display: none;
	}
	.mobile-title {
    	display: block;
    	max-width: 50%;
    	margin: 0px auto;
    	margin-top: 0;
    	margin-bottom: 20px;
	}
	#book p {
		text-align: center;
	}
	.btn.contact-btn {
		width: 100%;
		height: 50px;
	}
	#map {
		margin-top: 0;
		height: 300px;
	}
	.columns {
		padding-left: 2rem;
		padding-right: 2rem;
	}
	.op {
		margin-top: 3rem;
	}
	#catering {
		padding-left: 0;
	}
}

@media only screen and (max-width: 45em) {

	h3 {
		font-size: 30px;
	}
	.pad {
		padding-top: 2rem;
		padding-bottom: 2rem;
	}
	#owl-artisticroom {
		margin-top: 0;
	}
	.btn {
	    margin: 20px auto 0;
	    width: 200px;
	    height: 40px;
	}
	.architectuur .copy {
		float: none;
		margin: 0px auto;
	}
	.restaurant .copy {
		float: none;
		margin: 0px auto;
	}
	.geschenkbon .copy {
		opacity: 1;
		position: relative;
		z-index: 10;
		margin-top: 0;
	}
	.contact #openingsuren {
		margin-top: 20px;
	}
	.columns {
		padding-left: 10px;
		padding-right: 10px;
	}
	.welcome .btn {
		width: 130px;
	}
	.overlay-book .modal {
		padding: 0;
	}
	.close2 {
		top: 2em;
		right: 1em;
	}
	#owl-vz, #owl-fz, #owl-res {
		width: 100%;
	}
	.nopad {
		padding: 0 !important;
	}
	.geschenk-content .bon {
		max-width: 100%;
	}
}

@media only screen and (max-width: 40em) {
	#monday {
		width: 100px;
		height: 100px;
	}
}

@media only screen and (max-height: 414px) {

	iframe {
		min-height: 250px;
	}
}


@media only screen and (max-height: 480px) {

	iframe {
		min-height: 400px;
	}
}

@media only screen and (max-height: 320px) {

	iframe {
		min-height: 300px;
	}
}


@media only screen and (max-height: 375px) {

	iframe {
		min-height: 300px;
	}
	.modal h2 {
		margin: 0;
	}
}

@media only screen and (max-width: 414px) {
	#ress {
		padding: .2em;
		padding-left: 20px;
		margin-bottom: 0;
	}
	.close2 {
		top: 20px;
		right: 20px;
	}
}
@media only screen and (max-width: 320px) {
	div[dx-datepicker] { margin-left: -20px; margin-right: -20px;}

}


/* Height */
@media screen and (max-height: 600px)
{
	.main-nav .bottom {
		position: static;
	}
}