@import url('https://fonts.googleapis.com/css?family=Raleway|Lato:300,400,700,900|Playfair+Display:400,700&display=swap'); /* Lato standaard tekst, Playfair prix de rome, Kristi geschreven*/



/*

font-family: 'Playfair Display', serif;

font-family: 'Kristi', cursive;

font-family: 'Lato', sans-serif;



bruin : #BD9E70

blauw : #867369

lichter-blauw : #5c6472

zwart : #0e1111

groen : #2a9d05 



Groen: #575852



wit grijs achtergrond : #f1f1f1

*/





/* RESET */

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, code, del, dfn, em, img, q, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {

	border: 0 none;

	font-family: inherit;

	font-size: 100%;

	font-style: inherit;

	font-weight: inherit;

	margin: 0;

	padding: 0;

	vertical-align: baseline;

}



html {

	overflow-y: scroll;

}



/* BASIS */



html, body {

	color: #0e1111;

	font-family: 'AkkuratStd', cursive;

	font-size: 13px;

	letter-spacing:0.025em;

	font-weight:400;

	-webkit-text-size-adjust:100%;

	-webkit-font-smoothing: subpixel-antialiased;;

	overflow-x:hidden;

}



.wrapper {

	width:100%;

	margin: 0px auto !important;

	position: relative;

	padding: 0px;

			box-sizing:border-box;

	   -moz-box-sizing:border-box;

	-webkit-box-sizing:border-box;

}



img {

	display:block;

	max-width:inherit;

	width:100%;

}

img.center {

    margin-left: auto;

    margin-right: auto;

}



a {

	cursor:pointer;

	color:inherit;

	text-decoration:underline;

}





a[href^="tel:"] {

    text-decoration:none;

}



em {font-style:italic;}



ul,ol {margin:0 0 15px 0;}

li {list-style:none;line-height:24px;}

/*li:before {content:'\f0da';font-family:'Font Awesome\ 5 Pro';margin-right:10px;color:#662483;}*/

ul li ul, ol li ol {margin-bottom:0;margin-left:15px;}

ul li ul li:before, ol li ol li:before {content:'\f105';color:#009FE3;}



p {line-height:24px;margin-bottom:15px;}



strong {font-weight:900;}



h1{font-family: 'Playfair Display', serif;color:#867369;font-size:36px;word-wrap: break-word;margin-bottom:10px;line-height:46px;}

h1 span {font-family: 'Playfair Display', serif;color:#fff;font-size:75px;font-weight:700;display:block;margin-left:15px;}

h1 span img {max-width:65%;}

h2{font-family: 'Playfair Display', serif;font-size:30px;word-wrap: break-word;margin-bottom:20px;font-weight:400;color:#867369;}/*color:#867369;*/

h3{font-family: 'Playfair Display', serif;font-size:35px;word-wrap: break-word;margin-bottom:0px;font-family: 'Playfair Display', serif;color:#cfa670;}

h4{font-family: 'Playfair Display', serif;font-size:20px;word-wrap: break-word;margin-bottom:11px;color:#867369;font-weight:400;}

h5{font-family: 'Playfair Display', serif;word-wrap: break-word;margin-bottom:5px;font-weight:700;}

h6{font-family: 'Playfair Display', serif;word-wrap: break-word;margin-bottom:5px;font-style:italic;}



h2 span {font-size:13px;}



/* CLASSES */

.extrapadding {padding-top:35px;padding-bottom:35px;}

.floating-content {position:relative;padding:20px 25px;left:-24%;top:15px;width:113%;}

.floating-content-gerechten {position:relative;padding:20px 25px;left:-52%;top:15px;width:140%;}

.floating-content-gerechten.left {position:relative;padding:20px 25px;left:0;top:15px;width:140%;z-index:100;}

.buttons {position:absolute;bottom:-20px;right:25px;}

.filler {padding:10px;}



.group.section.extramargintop {margin-top:40px;}



.clear {clear:both;}



.hidden {display:none;}



.btn {

	color:#fff;

	background-color:#000;

	padding:6px 16px;

	text-decoration:none;

	display:inline-block;

	line-height:20px;

	margin-bottom:4px;

    margin-right:10px;

}

.btn:last-child{margin-right:0;}

.btn:after {content:'\f0da';font-family:"Font Awesome\ 5 Pro";margin-left:10px;font-weight:900;}

.btn:before {display:none;}

.btn.left:before {content:'\f104';font-family:"Font Awesome\ 5 Pro";margin-right:10px;display:inline-block;}

.btn.left:after {display:none;}

.btn.upload:after, .btn.upload:before {content:'\f093';}

.btn.download:after, .btn.download:before {content:'\f019';}

.btn.phone:after, .btn.phone:before {content:'\f095';}

.btn.envelop:after, .btn.envelop:before {content:'\f0e0';}

.btn.down:after, .btn.down:before {content:'\f0d7';}

.btn.up:after, .btn.up:before {content:'\f0d8';}

.btn.noicon:after, .btn.noicon:before {display:none;}



.btn.dark {background-color:#867369;color:#fff;}

.btn.light {background-color:#FFF7F2;color:#000;}

.btn.bruin {background-color:#575852;}



.btn.big {font-size:28px;text-transform:uppercase;font-weight:400;padding:15px 20px;margin-bottom:15px;}



.right {text-align:right;}

.center {text-align:center;}

.justify {text-align:justify;}



/* KLEUREN */

.bg-wit {background-color:#ffffff;}

.bg-grijs {background-color:#f1f1f1;}

.bg-blauw {color:#fff;background-color:#000;}

.bg-bruin {color:#fff;background-color:#bba79c;}



.fa-envira {color:#2a9d05;}



/* COLUMNS */

/*  SECTIONS  */

.section {

	clear: both;

	padding: 0px;

	margin: 0px;

}



/*  COLUMN SETUP  */

.col {

	display: block;

	float:left;

	margin:0;

	padding:10px;

			box-sizing:border-box;

	   -moz-box-sizing:border-box;

	-webkit-box-sizing:border-box;

	width:100%;

	position:relative;

}

.col .col {padding:0;}

.col.nopaddingbottom {padding-bottom:0;}

.col.nopaddingtop {padding-top:0;}



/*  GROUPING  */

.group:before,

.group:after { content:""; display:table; }

.group:after { clear:both;}

.group { zoom:1; /* For IE 6/7 */ }



/* TOP */

#top {

    position:fixed;

    top:0;

    left:0;

    width:100%;

    color:#fff;

    margin-bottom:15px;

    font-size: 12px;

    transition: all 0.5s ease;

    -webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;

    z-index:999;

}



#top.scrolldown {

    -webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.41);

    -moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.41);

    box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.41);

}



#top .top-contact {background-color:rgba(88,61,45,0.85);transition: all 0.5s ease;

    -webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.41);

    -moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.41);

    box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.41);

    color:#ffffff;

    }

#top .top-nav { background-color:rgba(255,255,255,0.85);opacity:1;transition: all 0.5s ease;}

#top .top-nav.visible {opacity:1;background-color:rgba(255,255,255,1);}

#top .top-contact.visible {background-color:rgba(88,61,45,1);-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;} 

#top .top-nav ul.nav {margin:5px 0;color:#0e1111;font-size:14px;}



#top .top-contact .col {padding:5px 8px;}



#top .top-contact .col.right ul {float:right;margin-bottom:0;}

#top .top-contact .col.right ul li:first-child {margin-right:30px;}

#top .top-contact .col.right ul li:nth-child(2) {margin-right:15px;}

/*#top .top-contact .col.right ul li:first-child a:before {content:'';height:1px;width:100%;background-color:#fff;display:block;position:absolute;top:2px;left:0;}

#top .top-contact .col.right ul li:first-child a:after {content:'';height:1px;width:100%;background-color:#fff;display:block;position:absolute;bottom:2px;left:0;}

*/

#top .top-contact ul li {float:left;margin-left:15px;position: relative;}

#top .top-contact .col.right ul li {float:left;margin-left:5px;position: relative;}

#top .top-contact ul li a {text-decoration:none;}

#top .top-contact ul li .fas {margin-right:5px;}

#top .top-contact ul li:first-child, #top .col.right ul li:first-child {margin-left:0;}

#top .top-contact ul li:before {display:none;}



#top .fad.fa-circle {color:#76c06c;margin-right:5px;}

#top .fad.fa-circle.red {color:#e20315;}
#top .fad.fa-circle.orange {color:#c45208;}



/* HEADER */

#header {/*height:100vh;*//*padding-top:45px;*/position:relative;}



#header ul.nav {color:#ffffff;}



#header #page-title.home {margin-top:25%;}

#header #header_logo {position:absolute;top:60%;left:50%;width:35%;transform:translate(-50%,-50%)}



#header .wrapper {position:absolute;top:45px;left:50%;transform:translate(-50%,0)}

#header #background-image {height:70vh;width:100vw;position:relative;/*position:absolute;top:0;left:0;*/z-index:-1;}

#header.home #background-image {height:100vh;}

#header #background-image:before {content:'';width:100%;height:100%;position:absolute;top:0;left:0;background-color:rgba(0,0,0,0.25);}

#header #background-image img {position:relative;width:100%;height:100%;object-fit:cover;object-position:center center;}



/* NAVIGATION */

 div.nav-container {

    width: 100%;

    text-align: center;

}

ul.nav {

    line-height: 1.4;

    padding-left: 0;

    margin:20px 0px;

}

.nav li {

    display: inline;

    text-align: center;

    font-size:16px;

}

    

ul.nav {font-family: 'Playfair Display', serif;font-size:16px;}

ul.nav li {/*float:left;*/list-style:none;margin-left:20px;position:relative; white-space: nowrap;}

ul.nav li:first-child {margin-left:0;}

ul.nav li:before {display:none;}



ul.nav li a {text-decoration:none;}



ul.nav li ul.subnav {display:none;position:absolute;top:0;left:0;padding-top:24px;z-index:999;}

ul.nav li ul.subnav li {margin-left:0;background-color:#171717;color:#fff;float:none;padding:4px 12px;}



/* MOBILE-NAV*/

/*#mobile-nav-container {

	-webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.35);

	   -moz-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.35);

			box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.35);

}

#mobile-nav-container #mobile-nav-btn {float:right;font-size:30px;margin-right:20px;}

#mobile-nav-container span {float:left;padding:10px;}*/



/* MAIN */

#main {}



/* HOME */

.quote {font-size:20px;}

.quote-functie {text-transform:uppercase;color:#867369;font-weight:700;}

.quote-handtekening {max-width:280px;}



/* PAGINA'S */

#reserveren p a {text-decoration: none;font-weight:700;}

.team-image {margin-bottom:1.6%;}



/* A LA CARTE */

.floating-content-gerechten ul li {color:#867369;text-transform:uppercase;font-weight:400;margin-bottom:20px;}

.floating-content-gerechten ul li span.subtitle {color:#0e1111;text-transform:none;font-weight:300;display:block;border-top:1px dashed #0e1111;margin-top:6px;padding-top:4px;/*font-size:11px;*/}

.floating-content-gerechten ul li span.prijs {color:#575852;float:right;}

.floating-content-gerechten ul li span.prijs span {text-transform: none;

font-weight: lighter;

float: left;

margin-right: 10px;}

.floating-content-gerechten ul li:before {display:none;}



ul.talen {position:absolute;top:25px;right:25px;}

ul.talen img {width:20px;height:20px;cursor:pointer;}

ul.talen li {float:left;margin-left:10px;}

ul.talen li:first-child {margin-left:0;}

ul.talen li.active {opacity:0.3;}



.gerechten {display:none;}

#gerechten-nl {display:block;}

.titles {display:none;}

.title-nl {display:inline-block;}

p.title-nl {display:block;}



/* FOOTER */

/*#footer {color:#393E42;}*/

#footer.extrapadding {padding-top:25px;padding-bottom:5px;}



#footer ul.contact li:first-child {font-family: 'Playfair Display', serif;color:#fff;font-size:30px;font-weight:700;margin-bottom:4px;}

#footer ul.contact li:nth-child(1) img {max-height:39px;width:auto;}

#footer ul.openingstijden li:first-child, #footer ul.informatie li:first-child {font-family: 'Playfair Display', serif;font-size:20px;font-weight:400;margin-top:5px;margin-bottom:10px;}

#footer ul.informatie li a {text-decoration:underline;}

#footer ul.informatie li:first-child {display:block;}
#footer ul.informatie li {display:inline-block;margin-right:10px;font-size:20px;}



#footer ul li {position:relative;line-height:28px;}

#footer ul li:before {display:none;}

#footer ul li a {text-decoration:none;}



/*#footer ul li .fas {color:#393E42;}*/

#footer ul:not(.informatie) li .fas, #footer ul:not(.informatie) li .fab {position:absolute;top:8px;left:-20px;}



#footer ul.contact li:nth-child(2) .fas {left:-15px;}



#footer .social i {font-size:26px;margin-left:10px;}

#footer .social a:first-child i {margin-left:0px;}



/* COPYRIGHT */

#copyright.extrapadding {padding:0px;}

#copyright ul li {float:left;}

#copyright ul li:before {display:none;}



/* FORMS */

fieldset {margin-bottom:25px;}

input, textarea, .datepicker a {border:none;padding:11px 15px;width:100%;display:inline-block;color:#808996;box-sizing:border-box;-moz-box-sizing:border-box;webkit-box-sizing:border-box;font-family:'Lato', sans-serif;font-size:13px;font-weight:400;font-style:italic;margin-bottom:15px;background-color:#f1f1f1;}

input.margin-bottom {margin-bottom:30px;}



.datepicker {position:relative;}

.datepicker input {width:80%;}

.datepicker a {width:20%;float:right;}

.datepicker a i {color:#171717;}



input[type=radio], input[type=checkbox] {

    display: none;

}

input[type="text"]:disabled {

    background: #f0f0f0;

} 

.radio-container .radio-items {display:inline-block;margin-bottom:5px;}

span.radiobox, span.checkbox {float:left;margin-right:10px;line-height:18px;margin-bottom:5.5px;position:relative;}

span.radiobox:before, span.checkbox:before {

    content: "";

    display: inline-block;

 

    width: 18px;

    height: 18px;

 

    margin-right: 10px;

	float:left;

	background-color: #F1F1F1;

	cursor:pointer;

}



textarea {resize:none;height:120px;}



span.radiobox:before {

    border-radius: 50%;

}



span.checkbox:before {

    border-radius: 4px;

}



input[type=radio]:checked + span.radiobox:before {

    content: "\2022";

    color: #1fa2e0;

    font-size: 50px;

    text-align: center;

    line-height: 15px;

}

input[type=checkbox]:checked + span.checkbox:before {

    content: "\f00c";

	font-family:'Font Awesome\ 5 Pro';

    color: #1fa2e0;

    font-size: 15px;

    text-align: center;

    line-height: 17px;

}



.inputfile {

    width: 0.1px;

    height: 0.1px;

    opacity: 0;

    overflow: hidden;

    position: absolute;

    z-index: -1;

}

.inputfile, label.file {

    cursor: pointer;

}



/* SELECT BOX */

/*the container must be positioned relative:*/

.select-style {

  position: relative;

  font-family: 'Lato', sans-serif;

	font-size: 13px;

}

.select-style select {

  display: none; /*hide original SELECT element:*/

}

.select-selected {

  background-color: #f1f1f1;

}

/*style the arrow inside the select element:*/

.select-selected:after {

  position: absolute;

  content:'\f078';

  font-family:'Font Awesome\ 5 Pro';

  top: 11px;

  right: 23px;

  width: 0;

  height: 0;

}

/*point the arrow upwards when the select box is open (active):*/

.select-selected.select-arrow-active:after {

  content:'\f077';

}

/*style the items (options), including the selected item:*/

.select-items div,.select-selected {

  color:#60605e;

  padding: 11px 15px;

  cursor: pointer;

  user-select: none;

}

.select-items div {

border: 1px solid transparent;

  border-color: transparent transparent rgba(0, 0, 0, 0.1) transparent;

  white-space: nowrap;

}

/*style items (options):*/

.select-items {

  position: absolute;

  background-color: #f1f1f1;

  top: 100%;

  left: 0;

  right: 0;

  z-index: 99;

}

/*hide the items when the select box is closed:*/

.select-hide {

  display: none;

}

.select-items div:hover, .same-as-selected {

  background-color: rgba(0, 0, 0, 0.1);

}



span.required {color:#e61d33;}



/* LABELS */

label.error {color:#AD1416;padding-top:2px;display:block;margin-top: -7px;margin-bottom: 8px;}

label.error:before {content:'\f0d8';font-family:'Font Awesome\ 5 Pro';margin-right:5px;font-weight:900;}



/* MESSAGING */

.message, #message {

	display:none;

}

.negative, .positive, .attention {

  margin: 4px 0;

  font-size: 1em;

  padding: 8px 10px 8px 10px;

  

  color: #C24848;  

  background: #FFD6D6 .5em .4em no-repeat;

  border: 1px solid #FFC2C2;

} 

.positive {

  color: #3F9153;  

  background: #D7F7DF .5em .4em no-repeat;

  border: 1px solid #A3F7B8

} 

.attention {

  color: #CF9E00;  

  background: #FAF2D7 .5em .4em no-repeat;

  border: 1px solid #FAE8AF;

}



/* MAP */

#map {height:300px;}



/* VIDEO */

video {

  width: 100%    !important;

  height: auto   !important;

  margin: 15px auto 50px auto;

  display: block;

}



/*UC PAGE*/

.wrapper.uc {

	text-align:center;

	width:inherit;

}

.uc-logo {

	margin-top:50px;

	width:260px;

}

/* EMAIL */

.mailme, .mailme2 {display:none;}

.email:not(input) {cursor:pointer;}

#main .email:not(input) {text-decoration: underline;}

.email::after{ content:"@" attr(data-host); }



/* COOKIE MELDING*/

#cookiemelding {width:100%;text-align:center;position:fixed;bottom:0;z-index:999;}

#cookiemelding p {background-color:rgba(0,0,0,0.75);display:inline-block;padding:12px 25px;margin:0;color:#fff;font-weight:400;}

#cookiemelding p a.btn {margin:0;padding:7px 14px;text-decoration: none;margin-left:25px;}

#cookiemelding p a {text-decoration:underline;color:#fff;}



/* FIXED MESSAGE*/

#fixedmessage {width:80%;text-align:center;position:fixed;top:0;left:10%;z-index:999;}

#fixedmessage p {background-color:rgba(0,0,0,0.75);display:inline-block;padding:12px 25px;margin:0;color:#fff;position:relative;}

#fixedmessage p a.btn {margin:0;padding:7px 14px;text-decoration: none;margin-left:25px;}

#fixedmessage p a {text-decoration:underline;color:#fff;}



#fixedmessage.positive, #fixedmessage.negative, #fixedmessage.attention {background:none;border:none;}



#fixedmessage p::after {

	content:'\f00d';

	font-family:'Font Awesome\ 5 Pro';

	position:absolute;

	top:10px;right:20px;

	cursor:pointer;

}



#fixedmessage.negative p, #fixedmessage.positive p, #fixedmessage.attention p {

  margin: 4px;

  font-size: 12px;

  padding: 8px 16px;

  

  color: #C24848;

  background: #FFD6D6 .5em .4em no-repeat;

  border: 1px solid #FFC2C2;

} 

#fixedmessage.positive p {

  color: #3F9153;

  background: #D7F7DF .5em .4em no-repeat;

  border: 1px solid #A3F7B8

} 

#fixedmessage.attention p {

  color: #CF9E00;

   background: #FAF2D7 .5em .4em no-repeat;

  border: 1px solid #FAE8AF;

}



#fixedmessage p a.btn {

	padding: 4px 10px;

	margin: 5px 0 0 0;

	

	background-color:#B19469;

}



#fixedmessage.positive p a.btn {

	background-color:#3F9153;

}



#fixedmessage.attention p a.btn {

	background-color:#CF9E00;

}



/* FINWIZE COPY */

.finwize-p {position:relative;}

.finwize-p a span {padding-left:14px;}

.finwize-icon {width:12px;display:inline-block;position:absolute;top:4px;}



/* SCROLL ICON */

.icon-scroll,

.icon-scroll:before {

  position: absolute;

  left: 50%;

}



.icon-scroll {

  width: 28px; /*width: 14px;*/

  height: 50px; /*height: 22px;*/

  margin-left: -10px;

  bottom: 15%;

  box-shadow: inset 0 0 0 2.5px #fff;

  border-radius: 24px;

  }



.icon-scroll:before {

  content: '';

  width: 8px;

  height: 8px;

  background: #fff;

  margin-left: -4px;

  top: 8px;

  border-radius: 4px;

  animation-duration: 1.5s;

  animation-iteration-count: infinite;

  animation-name: scroll;

  }



@keyframes scroll {

  0% {

    opacity: 1;

    }

  100% {

    opacity: 0;

    transform: translateY(10px);

    }

}





/* DATE PICKER COLOR */

/*.datepicker-panel > ul > li:before {display:none;}



.datepicker-panel > ul > li:hover {

  background-color: rgb(173, 143, 112);

}



.datepicker-panel > ul > li.muted,

.datepicker-panel > ul > li.muted:hover {

  color: #999;

}



.datepicker-panel > ul > li.muted:hover {

color:#fff;

}



.datepicker-panel > ul > li.highlighted {

  background-color: rgb(124, 106, 85);

}



.datepicker-panel > ul > li.highlighted:hover {

  background-color: rgb(173, 143, 112);

}



.datepicker-panel > ul > li.picked,

.datepicker-panel > ul > li.picked:hover {

  color: #fff;

}



.datepicker-panel > ul > li.disabled,

.datepicker-panel > ul > li.disabled:hover {

  background-color: #fff;

  color: #ccc;

  cursor: default;

}



.datepicker-panel > ul > li.disabled.highlighted,

.datepicker-panel > ul > li.disabled:hover.highlighted {

  background-color: rgb(124, 106, 85);

}

.datepicker-top-left, .datepicker-top-right {

	border-top-color: #7c6a55;

}

.datepicker-top-left::before, .datepicker-top-right::before {

	border-bottom-color: #7c6a55;

}*/



#bib {/*position:fixed;bottom:1%;left:2%;width:100px;*/width:auto;max-height:16px;margin-top:3px}

.youtube-video {
    aspect-ratio: 16 / 9;
    position: relative;
    width: 100%;
}

.youtube-video iframe {
    border: 0;
    height: 100%;
    width: 100%;
}