﻿@font-face {
	font-family: "rauschen";
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url("/assets/fonts/Rauschen-BMedium.woff") format("woff"), url("/assets/fonts/Rauschen-BMedium.woff2") format("woff2");
}


.counter-container {
	padding: 2rem 1rem 1.5rem;
	background-image: url(/assets/images/vitrea-background.jpg);
	background-size: cover;
	border-radius: 0.8rem;
	text-align: center;
	color: #fff;
	font-family: 'rauschen';
}

	.counter-container .digit,
	.counter-container p,
	.counter-container h2,
	.counter {
		font-family: 'rauschen';
	}

	.counter-container h2 {
		margin-bottom: 0.25rem;
	}

	.counter-container p {
		font-size: 0.8rem;
		font-weight: 400;
	}

.counter {
	/*font-weight: bold;*/
	font-size: 3.5em;
	line-height: 1.1;
	color: white;
	text-align: center;
	margin: 15px 0 30px;
}

	.counter .spacer {
		width: 2rem;
	}

	.counter .digit {
		display: inline-block;
		position: relative;
		width: 1.5em;
	}

		.counter .digit .caption {
			position: absolute;
			font-size: 0.25em;
			bottom: -1.3em;
			left: 0;
			width: 100%;
		}

.counter-link {
	display: inline-block;
	background: #F9F0DF;
	border-radius: 1rem;
	color: #EE5141;
	padding: 10px 16px 8px;
	line-height: 1;
}

@media(max-width: 768px) {
	.counter {
		font-size: 3rem;
	}

		.counter .digit .caption {
		}
}

@media(max-width: 576px) {
	.counter {
		font-size: 2.5rem;
	}

		.counter .digit .caption {
		}
}

@media(max-width: 438px) {
	.counter {
		font-size: 2rem;
	}

		.counter .digit .caption {
		}
}

@media(max-width: 1199px) and (min-width: 992px) {
	.counter {
		font-size: 2.5rem;
	}

		.counter .digit .caption {
		}
}
