/* CSS Document */
/* CSS Document */
a, button, h1, h2, h3, h4, h5, h6, input, li, p, select, span, textarea {
	text-rendering: optimizeLegibility;
	font-synthesis: none;
}

* {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	backface-visibility: hidden;
	box-sizing: border-box;
}

:root{
	--rewind-logo: 0,0,0;
	--kh-beige: 251,249,244; /*#FBF9F4*/
	--kh-gold: 164,133,92; /*#A4855C*/
	--kh-blue: 255,255,255; /*#13213B*/
	--kh-body: 81,93,115; /*#515D73*/
	--kh-gray: 244,240,231; /*#F4F0E7*/ 
	--kh-ecru: 243,238,227; /*#F3EEE3*/
	/*--kh-black: 22,40,74; #262626 #16284A*/
	--kh-black: 38,38,38; /*#262626 #16284A*/
	
	--shadow-lg: 0 24px 48px rgba(14, 27, 44, 0.12);
}

img, 
.navbar-brand svg, 
.custom-logo {
	display: block;
	height: auto;
	width: 100%;
	max-width: 100%;
}

.timeline-row img{
	width: auto;
}

a,
a:hover,
button, 
button:hover,
input[type="submit"], 
input[type="submit"]:hover{
	/*transition: 0.3s all ease;*/
	cursor: pointer;
	text-decoration: none;
}

a{
	cursor: pointer;
	text-decoration: none;
	color:rgba(var(--rewind-link), 1);
}

textarea,
button,
select,
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="date"]{
	-webkit-appearance: none;
	-webkit-border-radius: none;
}

body{
	font-family: "Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	font-optical-sizing: auto;
    font-style: normal;
	font-size: 1rem;
	line-height: 1.625rem;
	margin: 0 auto;
	/*max-width: 125rem;*/
	display: flex;
	flex-direction: column;
}

h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6{
	font-family: "Cormorant Garamond", serif;
	font-optical-sizing: auto;
	font-style: normal;
}

body{
	background:rgba(var(--kh-beige), 1);
}

a, a:hover{
	transition: 0.3s all ease;
}


/*HEADER*/

.main-header{
	background:rgba(var(--kh-ecru),1);
	color:rgba(var(--kh-body), 1);
	transition: all .3s;
}

.main-header a, .main-header a.navbar-brand, .main-header a.navbar-brand{
	color:rgba(var(--kh-black), 1);
}

.main-header .navbar-nav .nav-link:hover, .main-header a.navbar-brand:hover {
    color: rgba(var(--kh-black), 0.7);
}

.main-header .navbar-nav .nav-link.active, .main-header .navbar-nav .nav-link.show{
    color: rgba(var(--kh-gold), 1);
}

.main-header .sub-menu-toggle{
	display: none!important;
}



.admin-bar .main-header{
	top: 32px;
}

.main-header.hide-it {
  position: fixed;
  top: -100px;
  transition: all .3s;
}

.dropdown-open .main-header.hide-it {
  position: fixed;
  top: 0;
}

.admin-bar.dropdown-open .main-header.hide-it {
	top: 32px;
}

.main-header .navbar-brand{
	text-transform: uppercase;
}

.main-header span.h2{
	margin-bottom: -7px;
}

.main-header span.underline{
	font-size:10px;
	color:rgba(var(--kh-gold), 1);
	font-weight:600;
	letter-spacing: 2px;
}

.main-header .square-button{
	padding: 0.5rem 1rem;
    background: rgba(var(--kh-black), 0);
    border: 1px solid rgba(var(--kh-black), 1);
    color: rgba(var(--kh-black), 1);
    font-weight: 600;
	border-radius: 3px;
}

a.square-button{
	padding: 0.5rem 1rem;
    background: rgba(var(--kh-black), 0);
    border: 1px solid rgba(var(--kh-black), 1);
    color: rgba(var(--kh-black), 1);
    font-weight: 600;
	border-radius: 3px;
}

a.square-button:hover{
    background: rgba(var(--kh-gold), 1);
    border: 1px solid rgba(var(--kh-gold), 1);
    color: rgba(var(--kh-gray), 1);
}

.dropdown-menu{
	background: rgba(var(--kh-body), 1);
	border-radius: 3px;
}

.dropdown-item:focus, .dropdown-item:hover {
    color: rgba(var(--kh-gray), 1);
    background-color: rgba(var(--kh-blue), 1);
	border:0;
}

.navbar-toggler {
    line-height: 1;
    color: rgba(var(--kh-black), 1);
    background-color: transparent;
    border: var(--bs-border-width) solid rgba(var(--kh-black), 1);
    border-radius: 3px;
}

/*FOOTER*/

.site-footer{
	background:rgba(var(--kh-ecru), 1);
	color:rgba(var(--kh-black), 1);
}

.site-footer h6{
	font-family: "Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	color:rgba(var(--kh-black), 1);
	text-transform: uppercase;
	font-weight:500;
	font-size:11px;
	letter-spacing: 2px;
}

.site-footer-logo{
	text-transform: uppercase;
	color:rgba(var(--kh-black), 1);
}

.site-footer-logo span.h2{
	margin-bottom: -7px;
}

.site-footer-logo span.underline{
	font-size:10px;
	color:rgba(var(--kh-gold), 1);
	font-weight:600;
	letter-spacing: 2px;
}

.site-footer .site-name p{
	color:rgba(var(--kh-black), 1);
	font-size:0.872rem;
}

.footer-navigation-wrapper {
    padding-left: 0;
}

.footer-navigation-wrapper li {
    display: block;
    margin-bottom: 0.5rem;
	font-size:0.872rem;
}

/*HERO HOMEPAGE*/

.overlay-container{
	position: absolute;
	top:0;
	left:0;
	right:0;
	bottom:0;
}



.homepage-work-image {
    aspect-ratio: 8 / 17;
    -o-object-fit: cover;
    object-fit: cover;
    height: auto !important;
    max-width: 100% !important;
	transition: transform .2s linear;
}

.home-loop-item img, .square-image{
	aspect-ratio: 4/4;
	    object-fit: cover;
    height: auto !important;
    max-width: 100% !important;
    transition: transform .2s linear;
    display: block;
}

.hero-content{
	width: 100%;
    max-width: 446px;
    height: auto;
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1;
	background:rgba(var(--kh-ecru), 0.7);
	padding:2rem;
}

.hero-content .headline{
	font-size:10px;
	color:rgba(var(--kh-gold), 1);
	font-weight:600;
	text-transform: uppercase;
	    letter-spacing: 2px;
}

.hero-content h1{
	color:rgba(var(--kh-black), 1);
	font-size:2.5rem;
	line-height: 1;
}

.hero-content p{
	color:rgba(var(--kh-black), 1);
}

/*HOME Content*/

.home-content{
	width:100%;
	max-width:780px;
	margin:0 auto;
	text-align: center;
}

.home-content .classic{
	font-family: "Cormorant Garamond", serif;
	font-style: italic;
	font-size:1.5rem;
	margin-bottom:2rem;
	position:relative;
}

.home-content .classic::before{
	content: '';
	width:40px;
	height:1px;
	background: rgba(var(--kh-gold), 1);
	position:absolute;
	top:-40px;
	left:50%;
	transform: translateX(-50%);
}


/*Home stays*/

.home-stays span.underline, .home-location span.underline, .home-voorzieningen span.underline, .home-cta span.underline{
	font-size:10px;
	color:rgba(var(--kh-gold), 1);
	font-weight:600;
	text-transform: uppercase;
	    letter-spacing: 2px;
}

.home-stays h2, .home-location h2, .home-voorzieningen h2,.home-cta h2{
	font-size:3rem;
	color:#16284A;
}

.loop-stays-content{
	padding:2rem 2rem 2.5rem;
	background:#fff;
	border: 1px solid #f1ebdd;
	border-top:none;
	display: flex;
    flex-direction: column;
    height: 100%;
	color:#5A6678;
}

.loop-stays-content h3{
	color:#16284A;
}

.verblijven-content p{
	margin:0;
	padding:0;
}


.specs ul{
	display: block;
	margin:0 0 1.2rem;
	padding: 0;
	text-transform: uppercase;
	font-size: 0.875rem;
	font-weight: 500;
}

.specs ul li{
	display: inline-block;
	position: relative;
	padding-right:1.5rem;
}

.specs ul li::before{
	content: '';
	position: absolute;
	width:5px;
	height: 5px;
	border-radius:50%;
	background: rgba(var(--kh-gold), 1);
	top:50%;
	transform: translateY(-50%);
	left:-15px;
}

.specs ul li:first-child::before{
	display: none;
}

.loop-stays-content .price span{
	font-family: "Cormorant Garamond", serif;
	font-size:2rem;
	color:#16284A;
	font-weight: 500;
}

.home-loop-footer{
	display: flex;
	justify-content: space-between;
    align-items: baseline;
}

.home-loop-footer .button-book{
	text-transform: uppercase;
	font-weight: 500;
	color: rgba(var(--kh-gold), 1);
	border-bottom:2px solid rgba(var(--kh-gold), 1);
	letter-spacing: 2px;
}


.home-location{
	background:rgba(var(--kh-ecru), 1);
	padding:2rem;
}

.home-loop-item{
	transition: all .25s ease;
}

.home-loop-item:hover{
	transform: translateY(-4px);
    box-shadow: var(--shadow-lg);
}

.home-location h2{
	line-height: 1;
}


.home-location .loc-number{
	display: block;
	font-size:3rem;
	color:rgba(var(--kh-gold), 1);
	font-family: "Cormorant Garamond", serif;
	line-height: 1;
}


/*Buttons*/

.btn{
	border-radius: 3px;
	padding:1rem 1.5rem;
	font-weight: 600;
}

.primary-button{
	background:rgba(var(--kh-gold), 1)!important;
	border:1px solid rgba(var(--kh-gold), 1)!important;
	color:rgba(var(--kh-gray), 1)!important;
}

.secondary-button{
	background:rgba(var(--kh-black), 0)!important;
	border:1px solid rgba(var(--kh-black), 1)!important;
	color: rgba(var(--kh-black), 1)!important;
}

.block-spacing {
    padding-bottom: 3rem;
    padding-top: 3.5rem;
}

.bv-ssb-booking-form, .bv-ssb-booking-form--summary .bv-ssb-booking-shell {
    max-width: none!important;
}

.bv-ssb-property-preview, .bv-ssb-booking-step, .bv-ssb-summary-card,.bv-ssb-message {
    border-radius: 0!important;
}

.usp-border{
	border-top:1px solid rgba(var(--kh-gold), 1);
	border-left:1px solid rgba(var(--kh-gold), 1);
}

.usp-item{
	border-bottom:1px solid rgba(var(--kh-gold), 1);
	border-right:1px solid rgba(var(--kh-gold), 1);
	
	padding:2rem;
}

.usp-item:nth-child(3n),
.usp-item:last-child {
    
}

.inner-usp{
	position: relative;
}


.inner-usp::before{
	position: absolute;
	content: '';
	width:8px;
	height:8px;
	background:rgba(var(--kh-gold), 1);
	transform: rotate(45deg);
	left:2px;
}

.inner-usp h3{
	color:#16284A;
	padding-top:1rem;
}

.inner-usp span{
	font-size:10px;
	color:#8A93A4;
	font-weight:600;
	text-transform: uppercase;
	letter-spacing: 2px;
}

.home-review{
	background:rgba(var(--kh-blue), 1);
	color:rgba(var(--kh-black), 1);
}

.home-review blockquote{
	position: relative;
	padding-top: 2rem;
}

.home-review blockquote::before{
	position: absolute;
	content:'”';
	color:rgba(var(--kh-gold), 1);
	font-size:8rem;
	font-family: "Cormorant Garamond", serif;
	transform: translateX(-50%);
	left:50%;
}

.home-review blockquote .h2{
	/*padding-top:2rem;*/
}

.home-review blockquote span{
	font-size:10px;
	color:rgba(var(--kh-gold), 1);
	font-weight:600;
	text-transform: uppercase;
	letter-spacing: 2px;
	top:0;
}

.home-review blockquote span.is-filled, .home-review blockquote span.is-empty{
	font-size:1rem;
	padding-top:1rem;
}

.home-cta .white-block{
	padding:2rem 2rem 2.5rem;
	background:#fff;
	border: 1px solid #f1ebdd;
}

.table-holder .underline{
	font-size:10px;
	color: rgba(var(--kh-gold), 1);
	font-weight:600;
	text-transform: uppercase;
	letter-spacing: 2px;
	padding-right:2rem;
}

.table-holder td{
	padding-bottom:0.5rem;
}

#practical table {
  /*border: 1px solid #ccc;*/
  border-collapse: collapse;
  margin: 0;
  padding: 0;
 /* width: 100%;*/
  table-layout: fixed;
}

/*#practical table caption {
  font-size: 1.5em;
  margin: .5em 0 .75em;
}*/

#practical table tr {
  /*background-color: #f8f8f8;
  border: 1px solid #ddd;*/
  padding: .35em;
}

#practical table th,
#practical table td {
  padding: 0rem 1.5rem 0.5rem 0;
  /*text-align: center;*/
}

#practical table th {
  /*font-size: .85em;
  letter-spacing: .1em;
  text-transform: uppercase;*/
}

@media screen and (max-width: 600px) {
  #practical table {
    border: 0;
  }

/*  #practical table caption {
    font-size: 1.3em;
  }*/
  
 /* #practical table thead {
    border: none;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
  }*/
  
  #practical table tr {

    display: block;

  }
  
  #practical table td {

    display: block;
    
  }
  
  #practical table td::before {
    /*
    * aria-label has no advantage, it won't be read inside a table
    content: attr(aria-label);
    */
    content: attr(data-label);
    float: left;
    font-weight: bold;
    text-transform: uppercase;
  }
  
  #practical table td:last-child {
    border-bottom: 0;
  }
}













/*PDP*/

.gap-1 {
    gap: 0.25rem;
}
.grid-rows-2 {
    grid-template-rows: repeat(2, minmax(0, 1fr));
}
.grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.row-span-2 {
    grid-row: span 2 / span 2;
}
.col-span-2 {
    grid-column: span 2 / span 2;
}

.object-media-foto img {
    aspect-ratio: 1280 / 853;
    object-fit: cover;
    object-position: center;
}

@media (min-width: 1200px) {
    .xl\:grid-cols-4 {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}
@media (min-width: 1020px) {
    .lg\:grid {
        display: grid;
    }
}
@media (min-width: 1020px) {
    .lg\:static {
        position: static;
    }
}

.gallery-button {
    position: absolute;
    bottom: 1rem;
    left: 1rem;
    color: #fff;
    pointer-events: none;
    align-items: center;
    z-index: 8;
}

.listing-item-loop .block-image:after, .object-media-foto:after {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 2;
    background: rgba(0, 0, 0, 0);
    top: 0;
    left: 0;
    pointer-events: none;
}

.faciliteiten{
	margin-top:1.5rem;
	border-top:1px solid rgba(var(--kh-gray), 1);
	border-bottom:1px solid rgba(var(--kh-gray), 1);
	padding:1.5rem 0;
}

.border-bot{
	border-bottom:1px solid rgba(var(--kh-gray), 1);
	padding-bottom: 1.5rem;
}

.subtitle-detail{
	color: rgba(var(--kh-gold), 1);
}

.timeline{
	width:100%;
}

.timeline-row{
	position:relative;
	padding-left:2.5rem;
	padding-bottom:2.5rem;
}

.timeline-row::before{
	position: absolute;
	left:0;
	top:8px;
	content: '';
	width:20px;
	height: 20px;
	border-radius:50%;
	background: rgba(var(--kh-gold), 1);
	z-index:2;
}

.timeline-row::after{
	position: absolute;
	left:10px;
	top:16px;
	content: '';
	width:1px;
	/*height: calc(100% + 20px);*/
	height:100%;
	background: rgba(var(--kh-body), 0.6);
}

.timeline-row a{
	color:rgba(var(--kh-gold), 1);
}

.timeline-row a:hover{
	color:rgba(var(--kh-gold), 1);
	text-decoration: underline;
}

.timeline-row .videoWrapper {
  position: relative;
  padding-bottom: 56.25%; /* 16:9 */
  height: 0;
}
.timeline-row .videoWrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.block-spacing {
        padding-bottom: 3rem;
        padding-top: 3rem;
    }

h1.entry-title, h1.page-title{
	font-size:3rem;
}

.archive-description a{
	font-weight: 600;
}

.archive-description a:hover{
	font-weight: 600;
	text-decoration: underline;
}

.bv-ssb-booking-main .bv-ssb-property-preview .bv-ssb-eyebrow{
	display: none;
}

@media (min-width: 576px) {
    .block-spacing {
        padding-bottom: 6rem;
        padding-top: 6rem;
    }
}

@media (min-width: 992px) {
	.hero-content h1{
		font-size:4rem;
	}
	
    .navbar-expand-lg .navbar-nav .nav-link {
        padding-right: 1rem;
        padding-left: 1rem;
    }
	
	.homepage-work-image, .hero .homepage-work-image{
		aspect-ratio: 16 / 8;
	}
	
	.hero-content{
		max-width: 574px;

	}

	
	.timeline{
		width:80%;
	}
}