@import url(../common.css);
@import url(header.css);
@import url(navmenu-narrow.css);
@import url(footer.css);
@import url(decorations.css);

.header {
	/*background-image:url(img/voucher-banner.png);
	background-size: 100% auto;*/
	background-image: none;
	min-height: 165px;
}

.header-content {
	font-size: 1.3rem;
	color: white;
}

.voucher-banner {
	background-image:url(img/voucher-banner.png);
	height: calc(100vw * 295 / 1919);
    background-size: 100vw;
    background-repeat: no-repeat;
	display: flex;
    align-items: center;
	/*min-height: 295px;*/
	padding: 1rem;
}

.navmenu {margin-top:10px;}

.content {font-size:12px;}
.content .caption {font-weight:bold;color:black}

.title {
	font-weight: bold;
	font-size: 1.5rem;
	margin:	1rem 0;
}

.description-section, .voucher-scheme-section {
	margin: 3rem 5%;
}

.description-section .caption-container .caption, .voucher-scheme-section .caption-container .caption {
	margin: 1rem 0;
}

.voucher-scheme-section .voucher-scheme-logo-container {
	display: flex;
}

.voucher-scheme-section .voucher-scheme-logo-container .voucher-scheme-logo {
	margin: 2rem 1rem;
}

.voucher-scheme-section .title {
	text-transform: inherit;
}

@media screen and (max-width: 1499px) and (min-width: 1199px) {
	.voucher-banner {
		margin-top: 9rem;
	}
}

@media screen and (max-width: 899px) {
	.voucher-banner {
		background-image:url(img/mobile-voucher-banner.png);
		height: calc(100vw * 295 / 783);
	}
}

@media screen and (max-width: 599px) {
	.description-section, .voucher-scheme-section {
		margin: 2rem;
	}
	
	.voucher-scheme-section .voucher-scheme-logo-container {
		flex-wrap: wrap;
		justify-content: center;
	}
	
	.contact-us {
		width: 100%;
		margin: 2rem 0;
	}
	
	.voucher-scheme-section .voucher-scheme-logo-container .voucher-scheme-logo {
		max-width: 40%;
	}
	
	main {
		padding-top: 9rem;
	}
}