/*
Theme Name: Beste reistijd
Theme URI: https://www.bestereistijd.nl
Author: Web&Media
Author URI: https://www.webenmedia.nl
Version: 24.286
*/

.author-title {
	display: grid;
	grid-template-columns: 64px auto;
	gap: 20px;
	align-items: start;
	margin: 80px 0 0 0;
}
	.author-avatar img {
		border-radius: 999px;
		background: #fff;
	}
	.author-title h1 {
		margin: 7px 0 0 0;
	}
.single .author-title,
.author-title.small {
	display: grid;
	grid-template-columns: 42px auto;
	gap: 15px;
	margin: 25px 0;
	background: #f2f2f2;
	border-radius: 10px;
	padding: 20px;
	max-width: 870px;
}
.author-info {
	font-size: 15px;
	line-height: 20px;
}
.author-info .author-name {
	font-weight: 700;
	text-decoration: none;
}
.author-info .author-name:hover {
	text-decoration: underline;
}
.author-title.small .author-description {
	margin: 3px 0 0 0;
	font-size: 14px;
}
.author-title.large .author-description {
	margin: 13px 0 0 0;
}

.author-posts h3 {
	border-top: 1px solid #d3d3d4;
	margin: 40px 0 0 0;
	padding: 40px 0 0 0;
}

.author-container {
	max-width: 870px;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 10px;
    font-size: 15px;
    margin: 25px 0;
    padding: 10px 0;
    border-top: 1px solid #d3d3d4;
    border-bottom: 1px solid #d3d3d4;
}
    .author-container .author-avatar img {
        border-radius: 999px;
    }
    .author-container .author-content a {
        text-decoration: none;
    }
    .author-container .author-content .separator {
        display: inline-block;
        margin: 0 5px;
    }
    .author-container .author-content a:hover {
        text-decoration: underline;
    }
    .author-social-links {
    	margin: 15px 0 0 0;
    	display: flex;
    	flex-direction: row;
    	gap: 10px;
    	flex-wrap: wrap;
    }
    	.author-social-links a {
    		display: grid;
    		width: 30px;
    		height: 30px;
    		grid-template-columns: 1fr;
    		align-items: center;
    		justify-items: center;
    		border: 1px solid #d3d3d4;
    		border-radius: 999px;
    	}
    	.author-social-links a:hover {
    		border: 1px solid #212427;
    	}

html, body {
	margin: 0;
	padding: 0;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;
	font-optical-sizing: auto;
	font-weight: 400;
	font-style: normal;
	-webkit-font-smoothing: antialiased;
	font-size: 17px;
	color: #212427;
	background: #fff;
	height: 100%;
}

* {
	position: relative;
	margin: 0;
	padding: 0;
	border: 0;
	box-sizing: border-box;
	outline: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	vertical-align: top;
	border-spacing: 0;
	border-collapse: collapse;
	list-style: none;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;
	font-optical-sizing: auto;
	font-style: normal;
	-webkit-font-smoothing: antialiased;
	background: transparent;
}

input {
	font-size: 15px;
	font-weight: 500;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;
	-webkit-font-smoothing: antialiased;
}
input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0px 1000px white inset;
}

a {
	color: #0055e6;
	text-decoration: none;
}

h1, h2, .h2, h3 {
	font-weight: 800;
}
h1 {
	font-size: 28px;
	margin: 80px 0 0 0;
}
.page-title {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 10px;
	margin: 80px 0 0 0;
}
	.page-title .flag {
		border-radius: 999px;
		background: #f2f2f2;
	}
	.page-title h1 {
		margin: 0;
	}
h2, .h2 {
	font-size: 24px;
	margin: 80px 0 0 0;
}
.page-content h2 {
	margin: 40px 0 0 0;
}
h3, .h3 {
	font-size: 20px;
	font-weight: 700;
	margin: 60px 0 0 0;
}
.page-content h3, .content h3 {
	margin: 40px 0 0 0;
}

p {
	margin: 20px 0 0 0;
	line-height: 28px;
}
p.subtitle {
	margin: 10px 0 0 0;
}
p.subtitle.small {
	font-size: 15px;
}
.page-content ul {
	margin: 20px 0 0 0;
}
.page-content ul li {
	margin: 15px 0 0 20px;
	line-height: 24px;
	list-style-type: disc;
}

.updates {
	margin: 80px 0 0 0;
	border-top: 1px solid #d3d3d4;
}
	.updates h3 {
		margin: 40px 0 0 0;
	}
	.updates li {
		margin: 20px 0 0 0;
	}
	.updates p {
		margin: 6px 0 0 0;
		font-size: 15px;
		line-height: 24px;
	}

.disclaimer {
	margin: 80px 0;
	font-size: 15px;
	line-height: 24px;
}
	.disclaimer .h3 {
		margin: 40px 0 0 0;
	}
	.disclaimer p {
		margin: 10px 0 0 0;
		line-height: 24px;
	}

.wrap {
	max-width: 1080px;
	margin: 0 auto;
}

.scrollable {
	overflow-x: auto;
	white-space: nowrap;
	border-radius: 10px;
}

.scroll-table {
	overflow-x: auto;
}

header {
	padding: 10px 20px;
	background: #005eff;
}

.header-grid {
	display: grid;
	grid-template-columns: min-content auto 260px;
	gap: 20px;
	align-items: center;
	white-space: nowrap;
}

.logo {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 6px;
	font-size: 19px;
	font-weight: 800;
	color: #fff;
}

nav.menu ul {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 20px;
	justify-content: center;
}
	nav.menu ul li a,
	nav.menu ul li .item {
		font-size: 16px;
		font-weight: 700;
		line-height: 20px;
		color: #fff;
		cursor: pointer;
	}
	nav.menu ul li a:hover,
	nav.menu ul li .item:hover {
		text-decoration: underline;
	}

	form.search input {
		width: 100%;
		height: 50px;
		background: #fff;
		border-radius: 999px;
		padding: 0 44px 0 20px;
	}
	form.search button {
		position: absolute;
		top: 0;
		right: 0;
		display: flex;
		align-items: center;
		justify-content: center;
		width: 50px;
		height: 50px;
	}

.search-results-container {
	display: none;
	position: absolute;
	z-index: 100;
	top: 55px;
	left: 0;
	width: 100%;
	background: #fff;
	border-radius: 10px;
	padding: 0 20px;
	box-shadow:
		0.3px 0.3px 1.1px rgba(0, 0, 0, 0.011),
		0.7px 0.7px 2.7px rgba(0, 0, 0, 0.016),
		1.3px 1.3px 5px rgba(0, 0, 0, 0.02),
		2.2px 2.2px 8.9px rgba(0, 0, 0, 0.024),
		4.2px 4.2px 16.7px rgba(0, 0, 0, 0.029),
		10px 10px 40px rgba(0, 0, 0, 0.04);
}
#searchResultsHome {
	top: 70px;
}
	.search-results-container a,
	.search-results-container .item {
		padding: 15px 0;
		font-size: 16px;
		border-top: 1px solid #d3d3d4;
	}
	.search-results-container a {
		display: grid;
		grid-template-columns: auto 24px;
		grid-template-rows: auto 1fr;
		column-gap: 20px;
		align-items: center;
		grid-template-areas:
			"title flag"
			"subtitle flag";
	}
		.search-results-container a .title {
			grid-area: title;
		    overflow: hidden;
		    white-space: nowrap;
		    text-overflow: ellipsis;
		}
		.search-results-container a .subtitle {
			grid-area: subtitle;
			display: block;
		    overflow: hidden;
		    white-space: nowrap;
		    text-overflow: ellipsis;
		}
		.search-results-container a .flag {
			grid-area: flag;
			align-self: center;
		}
	.search-results-container a.first,
	.search-results-container .item {
		border: 0;
	}
	.search-results-container .item {
		color: #212427;
	}
		.search-results-container a:hover .title {
			text-decoration: underline;
		}
		.search-results-container a .title {
			font-weight: 700;
		}
		.search-results-container a .subtitle {
			margin: 6px 0 0 0;
			display: flex;
			flex-direction: row;
			align-items: center;
			gap: 6px;
			font-size: 14px;
			color: #909293;
		}
		.search-results-container a.view-all {
			font-size: 15px;
			text-align: center;
			text-decoration: underline;
		}
		.search-results-container a.view-all:hover {
			text-decoration: none;
		}

.nav-destinations-container {
	display: none;
	background: #e6efff;
	padding: 40px 20px;
	border-bottom: 2px solid #fff;
}
#destinations.visible {
	display: block;
}
	.nav-destinations-grid {
		display: grid;
		grid-template-columns: repeat(5, auto);
		gap: 20px;
	}
		.nav-destinations-grid a {
			color: #212427;
		}
		.nav-destinations-grid a:hover {
			text-decoration: underline;
		}
		.nav-destinations-grid .title {
			font-size: 20px;
			font-weight: 700;
			line-height: 24px;
		}
		.nav-destinations-grid .title.last {
			margin: 46px 0 0 0;
		}
		.nav-destinations-grid ul {
			margin: 20px 0 0 0;
		}
			.nav-destinations-grid ul li {
				margin: 10px 0 0 0;
				font-size: 15px;
				white-space: nowrap;
			}
				.nav-destinations-grid ul li a {
					display: block;
					overflow: hidden;
					white-space: nowrap;
					text-overflow: ellipsis;
					line-height: 20px;
				}
			.nav-destinations-grid ul li.last {
				margin: 20px 0 0 0;
			}
				.nav-destinations-grid ul li.last a {
					text-decoration: underline;
				}
				.nav-destinations-grid ul li.last a:hover {
					text-decoration: none;
				}

.loading-container {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 8px;
}
.loader {
    width: 20px;
    height: 20px;
    border: 3px solid #0055e6;
    border-bottom-color: transparent;
    border-radius: 50%;
    display: inline-block;
    box-sizing: border-box;
    animation: rotation 1s linear infinite;
}
@keyframes rotation {
	0% {
	    transform: rotate(0deg);
	}
	100% {
	    transform: rotate(360deg);
	}
}

.language-icon {
	width: 34px;
	height: 34px;
	cursor: pointer;
}
#language.visible {
	display: block;
}
.language-switcher {
	display: none;
	position: absolute;
	z-index: 10;
	top: 47px;
	right: 0;
	padding: 20px;
	background: #fff;
	border-radius: 10px;
	box-shadow:
	0.3px 0.3px 1.1px rgba(0, 0, 0, 0.011),
	0.7px 0.7px 2.7px rgba(0, 0, 0, 0.016),
	1.3px 1.3px 5px rgba(0, 0, 0, 0.02),
	2.2px 2.2px 8.9px rgba(0, 0, 0, 0.024),
	4.2px 4.2px 16.7px rgba(0, 0, 0, 0.029),
	10px 10px 40px rgba(0, 0, 0, 0.04);
}
	.language-switcher ul {
		display: flex;
		flex-direction: column;
		display: grid;
		grid-template-columns: 1fr 1fr;
		row-gap: 20px;
		column-gap: 40px;
		font-size: 15px;
	}
		.language-switcher ul li a {
			display: block;
			padding: 0 10px 0 0;
		}
		.language-switcher ul li a:hover {
			text-decoration: underline;
		}

header .icons {
	justify-self: end;
	display: none;
	flex-direction: row;
	align-items: center;
	gap: 15px;
}
	header .icons .menu-icon {
		width: 28px;
		text-align: center;
	}

figure.home-header {
	padding-top: 25%;
	min-height: 360px;
}
	figure.home-header img.background {
		display: block;
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		object-fit: cover;
	}
	figure.home-header .home-header-content {
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		color: #fff;
		padding: 40px 20px;
		background: linear-gradient(to right,  rgba(0,0,0,0.2) 0%,rgba(0,0,0,0) 100%);
	}
		figure.home-header .home-header-content .wrap {
			display: grid;
			grid-template-columns: 1fr;
			align-items: center;
			height: 95%;
		}
			figure.home-header .home-header-content .home-header-title {
				margin: 0;
				font-size: 40px;
				font-weight: 800;
				padding: 0 20px 0 0;
			}
			figure.home-header .home-header-content p.home-header-subtitle {
				margin: 10px 0 0 0;
				font-size: 20px;
				font-weight: 500;
				max-width: 340px;
			}

.search-home {
	width: 100%;
	max-width: 400px;
	margin: 30px 0 0 0;
}
	.search-home input {
		width: 100%;
		background: #fff;
		font-size: 17px;
		padding: 0 55px 0 30px;
		height: 60px;
		border-radius: 999px;
	}
	.search-home button {
		position: absolute;
		top: 0;
		right: 0;
		width: 60px;
		height: 60px;
		display: grid;
		grid-template-columns: 1fr;
		align-items: center;
		justify-items: center;
	}

	.search-results-home {
		background: #fff;
		border-radius: 10px;
		padding: ;
	}

.container {
	padding: 0 20px;
}
.container-footer {
	margin: 80px 0 20px 0;
}
.container-page {
	margin: 0 0 80px 0;
}
	.container a {
		text-decoration: underline;
	}
	.container a:hover {
		text-decoration: none;
	}
	.container h1,
	.container h2,
	.container .h2,
	.container h3,
	.container .h3,
	.container p,
	.container-page ul,
	.container-page figure {
		max-width: 870px;
	}
	.page-content h2 {
		margin: 40px 0 0 0;
	}
	.page-content h3 {
		margin: 40px 0 0 0;
	}
	.page-content ul {
		margin: 20px 0 0 0;
	}
		.page-content ul li {
			margin: 10px 0 0 20px;
			line-height: 28px;
			list-style-type: disc;
		}

.image-grid {
	display: grid;
	grid-template-columns: 3fr 2fr;
	gap: 60px;
	align-items: start;
}

.single figure,
figure.featured-image,
.container-page figure {
	margin: 30px 0;
	border-radius: 10px;
	overflow: hidden;
	background: #f2f2f2;
}
.image-grid figure.featured-image {
	margin: 25px 0 5px 0;
}
	.single figure img,
	figure.featured-image img,
	.container-page figure img {
		width: 100%;
		height: auto;
	}

figure.featured-image {
	padding-top: 65%;
}
figure.featured-image-page {
	padding-top: 45%;
}
	figure.featured-image img {
		display: block;
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		object-fit: cover;
	}

.content {
	margin: 90px 0 80px 0;
	padding: 1px 20px 80px 20px;
	background: #e6efff;
}
.content .wrap {
	max-width: 780px;
}

.links-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 15px;
	margin: 30px 0;
}
.continents-grid {
	grid-template-columns: repeat(3, 1fr);
}
	.links-grid a {
		display: block;
		font-size: 16px;
		font-weight: 700;
		padding: 15px 20px;
		text-decoration: none;
		border-radius: 10px;
		border: 1px solid #d3d3d4;
		transition: border .4s ease-out, background .4s ease-out;
	}
	.links-grid a:hover {
		border: 1px solid #005eff;
		background: #e6efff;
	}

.search-grid, .country-grid {
	grid-template-columns: repeat(3, 1fr);
}
	.links-grid a .parent {
		margin: 4px 0 0 0;
		color: #909293;
		font-size: 14px;
		font-weight: 500;
	}
	.search-grid a {
		display: grid;
		grid-template-columns: auto 24px;
		grid-template-rows: auto 1fr;
		column-gap: 15px;
		align-items: center;
		grid-template-areas:
			"title flag"
			"parent flag";
	}
	.search-temp-grid a {
		display: grid;
		grid-template-columns: 40px auto 24px;
		grid-template-rows: auto auto 1fr;
		column-gap: 15px;
		align-items: center;
		grid-template-areas:
			"temp title flag"
			"temp parent flag";
			padding: 15px 20px 15px 15px;
	}
	.country-grid a {
		display: grid;
		grid-template-columns: auto 24px;
		column-gap: 15px;
		align-items: center;
	}
		.search-grid a .temp {
			grid-area: temp;
			width: 40px;
			height: 40px;
			background: #FFD700;
			border-radius: 999px;
			display: grid;
			grid-template-columns: 1fr;
			align-items: center;
			justify-items: center;
			font-size: 14px;
			color: #212427;
			padding: 0 0 0 1px;
		}
		.search-grid a .title {
			grid-area: title;
		    overflow: hidden;
		    white-space: nowrap;
		    text-overflow: ellipsis;
		}
		.search-grid a .parent {
			grid-area: parent;
		    overflow: hidden;
		    white-space: nowrap;
		    text-overflow: ellipsis;
		}
		.search-grid a .flag {
			grid-area: flag;
			align-self: center;
		}

.links-weather-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 15px;
	margin: 30px 0;
}
	.links-weather-grid a {
		display: grid;
		grid-template-columns: auto min-content min-content;
		align-items: center;
		gap: 8px;
		font-size: 16px;
		font-weight: 700;
		padding: 15px 20px;
		text-decoration: none;
		border-radius: 10px;
		border: 1px solid #d3d3d4;
		transition: border .4s ease-out, background .4s ease-out;
	}
	.links-weather-grid a .temp {
		color: #212427;
	}
	.links-weather-grid a:hover {
		border: 1px solid #005eff;
		background: #e6efff;
	}

.destinations-container {
	margin: 25px 0 30px 0;
}
.destinations-grid {
	display: flex;
	gap: 15px;
	overflow-x: auto;
	scroll-behavior: smooth;
	scroll-snap-type: x mandatory;
}
.destinations-grid::-webkit-scrollbar {
 	height: 0px;
}
	.destinations-grid a {
		display: block;
		text-decoration: none;
		overflow: hidden;
		border-radius: 10px;
		overflow: hidden;
		flex-shrink: 0;
		min-width: calc((100% / 5) - 2.5%);
	}
	.destinations-grid a.featured-hotel figure::after {
		display: block;
		content: "";
		position: absolute;
		z-index: 2;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		box-shadow: inset 0 0 0 2px #ffd700;
		border-radius: 10px;
	}
	.destinations-grid a.featured-hotel .label {
		display: inline-block;
		position: absolute;
		top: 15px;
		left: 15px;
		background: #ffd700;
		color: #212427;
		padding: 4px 8px;
		font-size: 12px;
		font-weight: 700;
		border-radius: 5px;
	}
		.destinations-grid a figure {
			padding-top: 140%;
			background: #f2f2f2;
		}
			.destinations-grid a figure img {
				display: block;
				position: absolute;
				top: 0;
				left: 0;
				width: 100%;
				height: 100%;
				object-fit: cover;
				border-radius: 5px;
			}
			.destinations-grid a figure .title {
				position: absolute;
				left: 0;
				right: 0;
				bottom: 0;
				font-size: 17px;
				font-weight: 700;
				text-align: center;
				text-wrap: balance;
				padding: 75px 15px 25px 15px;
				color: #fff;
				white-space: normal;
				background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,.9) 100%);
				transition: padding .2s ease-out;
			}
			.destinations-grid.hotels-grid a figure .title {
				font-size: 15px;
			}
			.destinations-grid a:hover figure .title {
				padding: 190px 15px 35px 15px;
				background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,.95) 100%);
			}
				.destinations-grid a figure .title .subtitle {
					font-size: 14px;
					font-weight: 500;
					margin: 4px 0 0 0;
					opacity: 0.7;
				}
				.destinations-grid a figure .title .stars {
					display: inline-flex;
					flex-direction: row;
					gap: 2px;
					margin: 10px 0 0 0;
				}
					.destinations-grid a figure .title .stars img {
						position: relative;
						width: 12px;
						height: 12px;
						border-radius: 0;
					}

.scroll {
	position: absolute;
	z-index: 10;
	top: 50%;
	margin: -18px 0 0 0;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: 20px;
	opacity: 0;
	transition: opacity .4s ease-out;
}
	.scroll img {
		display: block;
	}
.scroll.left {
	left: -18px;
}
.scroll.right {
	right: -18px;
	background: #005eff;
}
.scroll.active {
	opacity: 1;
	background: #005eff;
}
.scroll.inactive {
	opacity: 0;
}

.scroll-gradient {
	position: absolute;
	z-index: 5;
	top: 0;
	bottom: 0;
	width: 25px;
	opacity: 0;
	transition: opacity .4s ease-out;
}
.scroll-gradient.left {
	left: 0;
	background: linear-gradient(to left, rgba(0,0,0,0) 0%,rgba(0,0,0,0.05) 100%);
	-webkit-border-top-left-radius: 10px;
	-webkit-border-bottom-left-radius: 10px;
	-moz-border-radius-topleft: 10px;
	-moz-border-radius-bottomleft: 10px;
	border-top-left-radius: 10px;
	border-bottom-left-radius: 10px;
}
.scroll-gradient.right {
	right: 0;
	background: linear-gradient(to right, rgba(0,0,0,0) 0%,rgba(0,0,0,0.05) 100%);
	-webkit-border-top-right-radius: 10px;
	-webkit-border-bottom-right-radius: 10px;
	-moz-border-radius-topright: 10px;
	-moz-border-radius-bottomright: 10px;
	border-top-right-radius: 10px;
	border-bottom-right-radius: 10px;
}
.destinations-container .scroll-gradient.left {
	background: linear-gradient(to left, rgba(0,0,0,0) 0%,rgba(0,0,0,0.25) 100%);
}
.destinations-container .scroll-gradient.right {
	background: linear-gradient(to right, rgba(0,0,0,0) 0%,rgba(0,0,0,0.25) 100%);
}
.scroll-gradient.active {
	opacity: 1;
}
.scroll-gradient.inactive {
	opacity: 0;
}
	.weather-scroll-grid .scroll-gradient,
	.weather-scroll-grid .scroll {
		display: none;
	}

a.link {
	display: inline-flex;
	flex-direction: row;
	align-items: center;
	font-weight: 700;
	margin: 5px 0 0 0;
}
a.link:hover {
	text-decoration: none;
}

.prevnext-grid {
	display: grid;
	grid-template-columns: 1fr 4fr 1fr;
	align-items: center;
}
	.prevnext-grid .title {
		font-size: 24px;
		font-weight: 800;
		text-align: center;
	}
	.prevnext-grid .link {
		gap: 10px;
	}
	.prevnext-grid .next {
		justify-self: end;
	}

.select-grid {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-items: center;
	gap: 20px;
	margin: 45px 0 0 0;
}
	.select-grid .h3 {
		margin: 0;
	}
	.select {
		padding: 15px 20px;
		border: 1px solid #d3d3d4;
		font-size: 17px;
		font-weight: 600;
		background: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMiIgaGVpZ2h0PSIxMiIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyLjUiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCI+PHBvbHlsaW5lIHBvaW50cz0iNiA5IDEyIDE1IDE4IDkiLz48L3N2Zz4=')
	    no-repeat right 15px center;
	    background-size: 20px;
	    padding-right: 40px;
	    border-radius: 10px;
	}

.month-details {
	margin: 80px 0;
	padding: 40px 20px;
	background: #e6efff;
}
	.month-details h2 {
		margin: 0;
		text-align: center;
	}
	.month-details-grid {
		display: grid;
		grid-template-columns: repeat(6, 1fr);
		gap: 10px;
		margin: 30px 0 0 0;
	}
		.month-details-grid .items {
			padding: 10px 0;
			border-right: 1px solid #d3d3d4;
			text-align: center;
		}
		.month-details-grid .items.last {
			border: 0;
		}
		.month-details-grid .item {
			padding: 22px 10px 20px 10px;
			background: rgba(255,255,255,0.6);
			border-radius: 10px;
			text-align: center;
		}
			.month-details-grid .item .title {
				font-size: 14px;
			}
			.month-details-grid .item .value {
				margin: 8px 0 0 0;
				font-weight: 700;
			}

.tabs {
	padding: 15px 17px;
	background: #f2f2f2;
	overflow-x: auto;
}
.tabs::-webkit-scrollbar {
 	height: 0px;
}
	.tabs-grid {
		display: flex;
		flex-direction: row;
		gap: 10px;
		white-space: nowrap;
		padding-right: 17px;
	}
		.tabs-grid .item,
		.tabs-grid .tabs-months,
		.tabs-grid .title {
			display: flex;
			flex-direction: row;
			align-items: center;
			gap: 6px;
			font-size: 16px;
			font-weight: 700;
			text-decoration: none;
			background: #fff;
			color: #212427;
			border-radius: 999px;
			padding: 13px 26px;
			cursor: pointer;
			transition: color .2s ease-out;
		}
		.tabs-grid .item:hover,
		.tabs-grid .select-container:hover .title {
			color: #0055e6;
		}
		.tabs-grid a.active {
			background: #005eff;
			color: #fff;
		}
		.tabs-grid a.active:hover {
			color: #fff;
		}
			.tabs-grid .title svg {
				margin: 1px 0 0 0;
			}
	.select-container {
		cursor: pointer;
	}
	.tabs-months {
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		opacity: 0;
		overflow: hidden;
	}
	.tabs-grid .spacer {
		width: 7px;
		height: 1px;
		background: transparent;
		flex-shrink: 0;
	}

.breadcrumbs ul {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 8px;
	font-size: 16px;
	margin: 20px 0;
	overflow-x: auto;
	white-space: nowrap;
}
.breadcrumbs ul.footer {
	margin: 90px 0 20px 0;
}
.breadcrumbs ul::-webkit-scrollbar {
 	height: 0px;
}
	.breadcrumbs ul li a {
		color: #212427;
		transition: color .2s ease-out;
	}
	.breadcrumbs ul li a:hover {
		color: #0055e6;
	}
	.breadcrumbs ul li a.last {
		text-decoration: none;
	}
	.breadcrumbs ul li.separator {
		display: flex;
		align-items: center;
		margin: 2px 0 0 0;
	}
	.breadcrumbs ul li select {
		font-size: 16px;
		padding: 0 20px 0 0;
	}
	.breadcrumbs ul li.select svg {
		position: absolute;
		top: 50%;
		right: 0;
		margin: -7px 0 0 0;
	}

.current-title {
	font-weight: 700;
	font-size: 20px;
	margin: 30px 0 0 0;
}
.current-grid {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 10px;
	margin: 15px 0 45px 0;
}
	.current-grid .temp {
		font-weight: 700;
		font-size: 28px;
	}
	.current-grid .wind {
		font-size: 15px;
		margin: 0 0 0 20px;
	}
		.current-grid .wind .item-grid {
			display: flex;
			flex-direction: row;
			align-items: center;
			gap: 5px;
		}

.weather-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 15px;
	margin: 25px 0;
}
.weather-daily-grid {
	grid-template-columns: repeat(5, 1fr);
}
.weather-forecast-grid {
	display: flex;
	gap: 15px;
	overflow-x: auto;
	scroll-behavior: smooth;
	scroll-snap-type: x mandatory;
}
.weather-grid::-webkit-scrollbar,
.weather-forecast-grid::-webkit-scrollbar {
 	height: 0px;
}
	.weather-grid .item {
		display: grid;
		grid-template-columns: 1fr;
		justify-items: center;
		gap: 5px;
		text-align: center;
		border: 1px solid #d3d3d4;
		border-radius: 10px;
		text-decoration: none;
		color: #212427;
		padding: 0 0 25px 0;
		overflow: hidden;
	}
	.weather-grid a.item {
		transition: border .4s ease-out;
	}
	.weather-forecast-grid a.item {
		flex-shrink: 0;
		min-width: calc((100% / 5) - 4%);
	}
	.weather-grid a.item:hover {
		border: 1px solid #005eff;
	}
	.weather-grid .item .title {
		width: 100%;
		padding: 15px 5px;
		font-weight: 700;
		background: #e6efff;
		border-bottom: 1px solid #d3d3d4;
	}
	.weather-grid a.item .title {
		color: #0055e6;
	}
		.weather-grid a.item:hover .title .day {
			text-decoration: underline;
		}
		.weather-grid .item .title .date {
			margin: 5px 0 0 0;
			font-size: 15px;
			font-weight: 500;
			color: #212427;
		}
	.weather-grid .item .title,
	.weather-grid .item .wind {
		font-size: 16px;
	}
	.weather-grid .item .icon {
		margin: 15px 0 0 0;
	}
	.weather-grid .item .temp {
		font-weight: 700;
	}
	.weather-grid .item .temp.min {
		margin: 5px 0 0 0;
		font-size: 15px;
		font-weight: 500;
	}
		.weather-grid .item .item-grid {
			display: inline-flex;
			flex-direction: row;
			align-items: center;
			gap: 5px;
			margin: 0 0 0 -2px;
		}
	.weather-grid .item .precip {
		margin: 15px 0 0 0;
		font-size: 15px;
		color: #0055e6;
	}
	.weather-grid .item .snow {
		margin: 10px 0 0 0;
		font-size: 15px;
		color: #9C27B0;
	}
	.weather-grid .item .wind {
		font-size: 15px;
		margin: 20px 0 0 0;
	}
		.weather-grid .item .wind .value {
			margin: 6px 0 0 0;
		}

.st0,.st1{display:none;fill:#212427}.st1,.st3{fill-rule:evenodd;clip-rule:evenodd}.st3,.st4{display:inline;fill:#212427}

.calendar-container {
	border-radius: 10px;
	border: 1px solid #d3d3d4;
	overflow: hidden;
	margin: 30px 0;
}
	.calendar-header {
		display: grid;
		grid-template-columns: auto 1fr auto;
		align-items: center;
		background: #e6efff;
		padding: 20px;
		font-weight: 700;
		text-align: center;
	}
	.calendar-header a {
		display: block;
		width: 16px;
		height: 16px;
	}
	.calendar-grid {
		display: grid;
		grid-template-columns: repeat(7, 1fr);
		gap: 1px;
		background: #d3d3d4;
		border-top: 1px solid #d3d3d4;
	}
		.calendar-grid .item {
			display: block;
			text-align: center;
			padding: 20px 10px;
			font-size: 16px;
			color: #212427;
			text-decoration: none;
			background: #fff;
		}
		.calendar-grid a.item {
			transition: background .4s ease-out;
		}
		.calendar-grid a.item:hover {
			background: #f3f7ff;
		}
		.calendar-grid .item.empty {
			background: rgba(255,255,255,0.8);
		}
			.calendar-grid a.item .day {
				margin: 0 auto 10px auto;
				display: flex;
				align-items: center;
				justify-content: center;
				width: 24px;
				height: 24px;
				border-radius: 12px;
				font-size: 11px;
				font-weight: 700;
				color: #005eff;
				background: #e6efff;
				transition: color .2s ease-out, background .2s ease-out;
			}
			.calendar-grid a.item:hover .day {
				color: #fff;
				background: #005eff;
			}
			.calendar-grid a.item .temp {
				margin: 5px 0 0 0;
				font-weight: 700;
			}

.table-container {
	border-radius: 10px;
	border: 1px solid #d3d3d4;
	margin: 30px 0;
}
.table-inner-container {
	overflow-y: auto;
	border-radius: 10px;
}
.table {
	width: 100%;
	white-space: nowrap;
	border-radius: 10px;
	overflow: hidden;
}
.table.overflow {
	overflow: auto;
}
	.table th,
	.table td {
		padding: 20px;
		vertical-align: middle;
		text-align: center;
		font-size: 16px;
	}
	.table thead th {
		background: #e6efff;
		padding: 20px;
		font-weight: 700;
	}
	.table tbody td {
		border-top: 1px solid #d3d3d4;
	}
	.table th.subject,
	.table td.subject {
		position: sticky;
		z-index: 10;
		top: 0;
		left: 0;
		text-align: left;
		font-weight: 700;
		background: #fff;
	}
	.table.scrollable th.subject::after,
	.table.scrollable td.subject::after {
		display: block;
		content: '';
		position: absolute;
		z-index: 5;
		top: 0;
		right: -25px;
		bottom: 0;
		width: 25px;
		background: linear-gradient(to left, rgba(0,0,0,0) 0%,rgba(0,0,0,0.05) 100%);
	}
	.table thead th.subject {
		background: #e6efff;
	}
	.table tbody tr.weather td {
		padding: 10px 20px;
	}
	.table tr td.temp {
		font-weight: 700;
	}
	.table tr th.wind,
	.table tr td.wind {
		text-align: left;
	}
	.table tr td .wind {
		display: flex;
		flex-direction: row;
		align-items: center;
		gap: 6px;
		text-align: left;
	}
	.table tr td .title {
		display: block;
	}
	.table tr td .date {
		display: block;
		font-weight: 500;
		padding: 4px 0 0 0;
		color: #212427;
	}
		.table tr td a {
			text-decoration: none;
		}
		.table tr td a:hover .title {
			text-decoration: underline;
		}
	.table-hourly tr th:nth-child(2),
	.table-hourly tr td:nth-child(2) {
		padding: 20px 20px 20px 35px;
	}
	.table-hourly tr td:nth-child(2) img.icon {
		margin: 0 0 0 15px;
	}
	.table-hourly .scroll-gradient.left {
		background: transparent;
	}
		.table-hourly .date {
			font-weight: 500;
			margin: 0 0 8px 0;
		}
		.table-hourly th.new-day,
		.table-hourly td.new-day {
			border-left: 2px solid #d3d3d4;
		}

.table-hourly {
	overflow-x: auto;
}

.rating {
	display: block;
	color: #fff;
	font-size: 13px;
	font-weight: 700;
	padding: 8px 10px;
	border-radius: 999px;
}
	.rating-5 {
		background: #4CBB17;
	}
	.rating-4 {
		background: #228B22;
	}
	.rating-3 {
		background: #FFAC1C;
	}
	.rating-2 {
		background: #FF2400;
	}
	.rating-1 {
		background: #A42A04;
	}

.chart-container {
    width: 100%;
    min-height: 240px;
    margin: 30px 0 0 0;
}
	canvas {
	    display: block;
	}

.faq-container {
	background: #e6efff;
	margin: 80px 0 0 0;
}
.faq-title {
	text-align: center;
	padding: 0 20px;
}
.faq {
	margin: 15px 0 10px 0;
	padding: 25px 65px 25px 25px;
	background: #fff;
	border-radius: 10px;
	cursor: pointer;
}
.faq-items .faq:first-child {
	margin: 30px 0 0 0;
}
	.faq .question {
		font-size: 18px;
		font-weight: 700;
		transition: color 0.2s ease-out;
	}
		.faq .question:hover {
			color: #0055e6;
		}
		.faq .question svg {
			position: absolute;
			top: 50%;
			right: -40px;
			margin: -11px 0 0 0;
			transform: rotate(90deg);
			transition: transform 0.3s ease-out;
		}
		.faq.active .question svg {
			transform: rotate(270deg);
		}
	.faq .answer {
		max-height: 0;
		overflow: hidden;
		line-height: 28px;
		transition: max-height 0.3s ease-out, margin 0.3s ease-out;
	}
	.faq.active .answer {
		max-height: 200px;
		margin: 20px 0 3px 0;
	}

.posts-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 40px;
	row-gap: 60px;
	margin: 40px 0 0 0;
}
	.posts-grid a {
		display: block;
		color: #212427;
		text-decoration: none;
	}
		.posts-grid figure {
			padding-top: 60%;
		}
			.posts-grid figure img {
				display: block;
				position: absolute;
				top: 0;
				left: 0;
				width: 100%;
				height: 100%;
				object-fit: cover;
				border-radius: 10px;
			}
		.posts-grid h2 {
			margin: 20px 0 0 0;
		}

.partners-content {
	margin: 70px 0 80px 0;
}
	.partners-content .h2 {
		margin: 0;
	}
	.partners-content .hotels-grid {
		margin: 0 0 40px 0;
	}
	.partners-content figure.featured-image, .container-page .partners-content figure {
		margin: 0 auto;
	}

.partners-grid {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    justify-items: center;
    gap: 10px;
    margin: 25px 0 0 0;
}
    .partners-grid a {
        width: 100%;
        display: block;
        background: #fff;
        padding: 20px;
        border-radius: 10px;
        border: 1px solid #d3d3d4;
    }
    .partners-grid a:hover {
        border: 1px solid #005eff;
    }
    .partners-grid a figure {
        width: 100%;
        max-width: 90px;
        height: 30px;
        margin: 0 auto;
        background: #fff;
    }
        .partners-grid a figure img {
            display: block;
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            object-fit: contain;
            mix-blend-mode: multiply;
        }

.spacer-footer {
	height: 60px;
}
.spacer-footer.page {
	height: 100px;
}

#vacationResults.loading {
    opacity: 0.5; /* Vervaag de content */
    transition: opacity 0.3s ease; /* Voeg een vloeiende overgang toe */
    pointer-events: none; /* Voorkom interactie tijdens het laden */
}

.filters-open {
	display: none;
    margin: 10px 0 0 0;
    padding: 18px 22px;
    background: #005eff;
    border-radius: 10px;
    color: #fff;
    font-size: 16px;
    font-weight: 700;
}
.filters-close {
    display: none;
    text-align: center;
    color: #005eff;
    font-size: 16px;
    font-weight: 700;
    text-decoration: underline;
    cursor: pointer;
}

.vacation-results {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 20px;
    row-gap: 30px;
}
	.vacation-results .results {
		grid-column: span 3;
	}
		.vacation-results .results h3 {
			line-height: 40px;
		}
	.vacation-results .results-grid {
		display: grid;
		grid-template-columns: auto auto;
		align-items: center;
	}
		.vacation-results .results .results-orderby {
			justify-self: end;
	        height: 40px;
	        padding: 0 35px 0 15px;
	        border-radius: 5px;
	        border: 1px solid #d3d3d4;
	        font-size: 15px;
	        background: #fff;
		    background: url('img/arrow_drop_down_48dp_212427_FILL1_wght700_GRAD200_opsz48.svg') calc(100% - 8px) center no-repeat #fff;
		    background-size: 20px 20px;
		}
	.vacation-results p {
		margin: 0;
		font-size: 15px;
	}
.pagination-container {
	grid-column: span 2;
}
.pagination {
    margin: 50px 0 0 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
}
    .pagination a {
        display: flex;
        align-items: center;
        justify-content: center;
        min-width: 40px;
        height: 40px;
        border-radius: 5px;
        background: #005eff;
        color: #fff;
        text-decoration: none;
        font-size: 15px;
        font-weight: 600;
        padding: 0 10px;
    }
    .pagination a:hover {
        background: #004bcc;
    }
    .pagination a.active {
        background: transparent;
        color: #212427;
    }
    .pagination a.prevnext {
        background: transparent;
        color: #005eff;
    }
    .pagination a.prevnext:hover {
        text-decoration: underline;
    }
    .pagination span {
        color: #888;
    }
a.hotel-item {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: auto 1fr;
    background: #fff;
    border-radius: 10px;
    overflow: hidden;
    text-decoration: none;
    color: #212427;
    box-shadow:
        0.3px 0.3px 1.1px rgba(0, 0, 0, 0.005),
        0.7px 0.7px 2.7px rgba(0, 0, 0, 0.008),
        1.3px 1.3px 5px rgba(0, 0, 0, 0.01),
        2.2px 2.2px 8.9px rgba(0, 0, 0, 0.012),
        4.2px 4.2px 16.7px rgba(0, 0, 0, 0.015),
        10px 10px 40px rgba(0, 0, 0, 0.02);
}
a.hotel-item:hover {
    box-shadow:
        0.3px 0.3px 1.1px rgba(0, 0, 0, 0.015),
        0.7px 0.7px 2.7px rgba(0, 0, 0, 0.024),
        1.3px 1.3px 5px rgba(0, 0, 0, 0.03),
        2.2px 2.2px 8.9px rgba(0, 0, 0, 0.036),
        4.2px 4.2px 16.7px rgba(0, 0, 0, 0.045),
        10px 10px 40px rgba(0, 0, 0, 0.06);
}
    a.hotel-item figure {
        padding-top: 60%;
        overflow: hidden;
        background: #f2f2f2;
    }
        a.hotel-item figure img {
            display: block;
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            object-fit: cover;
            background: #f2f2f2;
        }
    a.hotel-item .hotel-content {
        display: grid;
        grid-template-columns: 1fr;
        grid-template-rows: auto auto 1fr;
        padding: 20px;
    }
        a.hotel-item .hotel-content .hotel-location {
            font-size: 14px;
        }
        a.hotel-item .hotel-content .hotel-name {
        	margin: 5px 0 0 0;
            font-size: 16px;
            font-weight: 700;
        }
        a.hotel-item .hotel-content .hotel-footer {
        	align-self: end;
        	display: grid;
        	grid-template-columns: auto auto;
        	align-items: center;
        	margin: 20px 0 0 0;
        }
        a.hotel-item .hotel-content .hotel-stars {
            display: flex;
            flex-direction: row;
            gap: 2px;
            margin: 5px 0 0 0;
        }
        a.hotel-item .hotel-content .hotel-price {
        	justify-self: end;
            display: flex;
            flex-direction: row;
            align-items: end;
            gap: 5px;
            line-height: 16px;
            font-size: 14px;
        }
            a.hotel-item .hotel-content .hotel-price .price {
                font-size: 20px;
                font-weight: 800;
                line-height: 20px;
                color: rgb(255 141 0);
            }

.vacation-container {
    background: #f3f7ff;
    padding: 60px 20px 80px 20px;
}
.vacation-container h3 {
    margin: 0;
}
.vacation-grid {
    display: grid;
    grid-template-columns: 246px auto;
    gap: 30px;
    margin: 10px 0 0 0;
    align-items: start;
}

.vacation-filters {
    font-size: 15px;
}
	.vacation-filters h3 {
		line-height: 40px;
	}
    .vacation-filters .title {
        margin: 30px 0 5px 0;
        font-weight: 700;
    }
    .vacation-select {
        width: 100%;
        height: 40px;
        line-height: 100%;
        margin: 10px 0;
        padding: 10px 15px;
        border-radius: 5px;
        border: 1px solid #d3d3d4;
        font-size: 15px;
        background: #fff;
	    background: url('img/arrow_drop_down_48dp_212427_FILL1_wght700_GRAD200_opsz48.svg') calc(100% - 8px) center no-repeat #fff;
	    background-size: 20px 20px;
	}
    .vacation-checkbox {
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 10px;
        line-height: auto;
        border-bottom: 1px solid #d3d3d4;
    }
    .vacation-checkbox.last {
    	border: 0;
    }
    .vacation-checkboxes .vacation-checkbox:last-child {
        border: 0;
    }
        .vacation-checkbox input {
            width: 16px;
            height: 16px;
            border-radius: 5px;
            border: 1px solid #d3d3d4;
            -webkit-appearance: checkbox;
            -moz-appearance: checkbox;
            appearance: checkbox;
        }
    .vacation-checkbox label {
    	width: 100%;
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 8px;
        padding: 10px 0;
    }
    .vacation-checkbox label:hover {
        color: #005eff;
        cursor: pointer;
    }
        .vacation-checkbox label .stars {
            display: flex;
            flex-direction: row;
            gap: 2px;
        }

.country-container {
    height: 40px;
    margin: 10px 0 40px 0;
}
.country-selector {
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    width: 100%;
    line-height: 100%;
    border-radius: 5px;
    border: 1px solid #d3d3d4;
    font-size: 15px;
    background: #fff;
}
.country-selector::before {
	display: block;
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	width: 38px;
	height: 38px;
    background: url('img/arrow_drop_down_48dp_212427_FILL1_wght700_GRAD200_opsz48.svg') center center no-repeat;
    background-size: 20px 20px;
}
.country-selector .country-value {
    line-height: 38px;
    padding: 0 15px;
}
.country-select {
    display: none;
    max-height: 290px;
    overflow-y: auto;
    width: 100%;
    background: #fff;
    -webkit-border-bottom-right-radius: 5px;
    -webkit-border-bottom-left-radius: 5px;
    -moz-border-radius-bottomright: 5px;
    -moz-border-radius-bottomleft: 5px;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
    box-shadow:
        0.3px 0.3px 1.1px rgba(0, 0, 0, 0.011),
        0.7px 0.7px 2.7px rgba(0, 0, 0, 0.016),
        1.3px 1.3px 5px rgba(0, 0, 0, 0.02),
        2.2px 2.2px 8.9px rgba(0, 0, 0, 0.024),
        4.2px 4.2px 16.7px rgba(0, 0, 0, 0.029),
        10px 10px 40px rgba(0, 0, 0, 0.04);
}
#countrySelect.open {
    display: block;
}
    .country-clear {
        padding: 12px 15px 13px 15px;
        color: #005eff;
        text-decoration: underline;
        cursor: pointer;
    }
    .country-clear:hover {
        text-decoration: none;
        cursor: pointer;
    }
    .country-select .vacation-checkbox label:hover {
        color: #005eff;
        cursor: pointer;
    }
    .country-select .country-title {
        background: #f2f2f2;
        padding: 10px 15px;
        font-weight: 700;
        font-size: 14px;
        border-top: 1px solid #d3d3d4;
        border-bottom: 1px solid #d3d3d4;
    }
    .country-select .vacation-checkbox {
        padding: 0 15px;
        line-height: auto;
    }

.review-form {
	max-width: 870px;
	display: grid;
	grid-template-columns: 1fr 1fr;
	column-gap: 20px;
	row-gap: 30px;
	margin: 20px 0 0 0;
}
	.review-form .full {
		grid-column: span 2;
	}
	.review-form label {
		font-weight: 700;
	}
	.review-form input,
	.review-form select,
	.review-form textarea {
		margin: 10px 0 0 0;
		width: 100%;
		height: 50px;
		padding: 0 15px;
		border-radius: 10px;
		font-size: 16px;
		border: 1px solid #212427;
	}
	.review-form textarea {
		height: 120px;
		padding: 15px;
	}
	.review-form input.form-submit {
		border: 0;
		background: #005eff;
		color: #fff;
		font-weight: 700;
		font-size: 17px;
	}

.review {
	margin: 30px 0 0 0;
	background: #f2f2f2;
	padding: 30px;
	color: #212427;
	border-radius: 10px;
	max-width: 870px;
}
	.review-title {
		display: flex;
		flex-direction: row;
		gap: 10px;
		align-items: center;
	}
	.review-rating {
		display: flex;
		flex-direction: row;
		gap: 10px;
		align-items: center;
		margin: 10px 0 0 28px;
		font-size: 15px;
	}
	.review-stars {
		display: flex;
		flex-direction: row;
		gap: 2px;
		align-items: center;
	}
	.review-description {
		font-size: 15px;
		line-height: 24px;
	}

.review-message {
	border-radius: 10px;
	padding: 25px 30px;
	background: #d4edda;
	margin: 40px 0 0 0;
}
.review-message.error {
	background: #f8d7da;
}
	.review-message h2 {
		margin: 0;
	}
	.review-message p {
		margin: 10px 0 0 0;
	}

.letter-grid {
    margin: 20px 0 0 0;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 5px;
}
    .letter-grid a {
        display: flex;
        align-items: center;
        justify-content: center;
        min-width: 40px;
        height: 40px;
        border-radius: 5px;
        background: #005eff;
        color: #fff;
        text-decoration: none;
        font-size: 15px;
        font-weight: 600;
        padding: 0 10px;
    }
    .letter-grid a:hover {
        background: #004bcc;
    }

.overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10000;
    padding: 20px;
}
.promo {
    width: 100%;
    max-width: 800px;
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 0 200px rgba(0, 0, 0, 0.1);
    text-align: center;
    overflow: hidden;
}
.promo figure {
    background: #f5f5f5;
}
.promo figure img.promo-image {
    display: block;
    width: 100%;
    height: auto;
}
.promo figure .promo-close {
    display: block;
    position: absolute;
    top: 10px;
    right: 10px;
    width: 30px;
    height: 30px;
}
.promo figure .promo-close img {
    margin: 7px;
    width: 16px;
    height: 16px;
}
.promo .promo-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 30px 20px;
}
.promo .promo-content .promo-title {
    font-weight: 800;
    font-size: 22px;
    text-wrap: balance;
}
.promo .promo-content .promo-buttons {
    margin: 25px 0 0;
    display: grid;
    grid-template-columns: auto auto;
    place-items: center;
    gap: 15px;
}
.promo .promo-content .promo-buttons .button {
    margin: 1px 0 0;
    min-width: auto;
    padding: 10px 30px;
    background: #8db600;
    border-bottom: 3px solid #556d00;
    cursor: pointer;
    color: #fff;
    font-weight: 800;
    border-radius: 999px;
}
.promo .promo-content .promo-buttons .button:hover {
    background: #719200;
    border-bottom: 3px solid #384900;
}
.promo .promo-content .promo-buttons .button-no {
    color: #909293;
    cursor: pointer;
    font-size: 16px;
}
.promo .promo-content .promo-buttons .button-no:hover {
    color: #212427;
    text-decoration: underline;
}
.promo .promo-content .promo-footer-content {
    margin: 15px 0 0;
    font-size: 15px;
    font-weight: 500;
    color: #7fa400;
}

footer {
	padding: 30px 20px;
	background: #212427;
	color: #fff;
}

.footer-grid {
	display: grid;
	grid-template-columns: auto auto;
	justify-items: start;
	column-gap: 80px;
	row-gap: 40px;
	font-size: 15px;
}
	.footer-grid .copyright {
		grid-column: span 2;
	}
	.footer-grid a {
		color: #fff;
		text-decoration: underline;
	}
	.footer-grid a:hover {
		text-decoration: none;
	}
	.footer-grid  .logo {
		color: #fff;
		text-decoration: none;
	}
	.footer-grid p {
		max-width: 640px;
		line-height: 20px;
	}
	.footer-grid .copyright {
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		column-gap: 20px;
		row-gap: 10px;
		align-self: end;
	}
	.footer-grid ul.footer-menu {
		justify-self: end;
		display: flex;
		flex-direction: column;
		gap: 10px;
		white-space: nowrap;
		font-size: 15px;
	}
		.footer-grid ul.footer-menu li .footer-title {
			font-size: 19px;
			font-weight: 800;
			margin: 5px 0;
		}