@font-face {
  font-family: "Volte Rounded";
  src: url("./volte-rounded-font-family/VolteRounded-Light-BF65bc55d32e0ba.otf") format("opentype");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Volte Rounded";
  src: url("./volte-rounded-font-family/VolteRounded-Regular-BF65bc55d32ca1a.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Volte Rounded";
  src: url("./volte-rounded-font-family/VolteRounded-Medium-BF65bc55d3265d3.otf") format("opentype");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Volte Rounded";
  src: url("./volte-rounded-font-family/VolteRounded-Semibold-BF65bc55d27d175.otf") format("opentype");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Volte Rounded";
  src: url("./volte-rounded-font-family/VolteRounded-Bold-BF65bc55d33dd1f.otf") format("opentype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

/* Font Face Declarations */
@font-face {
  font-family: "Volte Rounded";
  src: url("./volte-rounded-font-family/VolteRounded-Light-BF65bc55d32e0ba.otf") format("opentype");
  font-weight: 300;
  font-style: normal;
}

.adventures-unlimited {
  font-family: "adventures-unlimited", sans-serif;
  font-weight: 400;
  font-style: normal;
  color: #e2935d;
  line-height: 100%;
  letter-spacing: 0%;
}

.accent {
  font-family: "adventures-unlimited", sans-serif;
  color: #e2935d;
  font-weight: 400;
  font-style: normal;
  font-size: 160px;
  line-height: 100%;
  letter-spacing: 0;
  text-align: center;
}

/* Google Fonts */
@import url("https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;500&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Gotham:wght@400&display=swap");

body { margin: 0; padding: 0; height: 100%; background-image: url('./images/background_3000.jpg'); background-repeat: no-repeat; background-size: cover; }
	body img { max-width: 100%; }

.countdown-container { text-align: center; width: 800px; margin: 0 auto; display: flex; flex-direction: column; gap: 60px 0; justify-content: space-around; height: calc(100vh - 100px); }
	.countdown-container .countdown-logo { text-align: center; margin-top: 50px; }
		.countdown-container .countdown-logo img { margin: 0 auto;  width: 35%;  }
	.countdown-container .countdown-title { font-family: "Volte Rounded", sans-serif; font-weight: 300; color: white; font-size: 80px; line-height: 0.6; }
		.countdown-container .countdown-title span { display: block; color: #e2935d; font-family: "adventures-unlimited", sans-serif; font-weight: 400; font-size: 190px; }	
	.countdown-container .countdown-madeby { font-family: "Volte Rounded", sans-serif; font-weight: 300; color: white; font-size: 40px; }
		.countdown-container .countdown-madeby span { color: #e2935d; }	
	.countdown-container .countdown-timer { display: flex; gap: 0 50px; justify-content: center; font-family: "Volte Rounded", sans-serif; font-weight: 300; color: white; }
		.countdown-container .countdown-timer div { font-size: 90px; width: 100px; }
			.countdown-container .countdown-timer div span { color: #e2935d; display: block; font-size: 20px; }		
			
@media (max-width: 780px) {
	
	body { min-height: 100vh; }

	.countdown-container { padding-top: 30px; width: 100%; gap: 20px 0; height: calc(100vh - 50px); }
		.countdown-container > div { flex: 1; }	
		.countdown-container .countdown-logo { margin-top: 0; }
			.countdown-container .countdown-logo img { width: 60%; }		
		.countdown-container .countdown-title	{ font-size: 50px; }
			.countdown-container .countdown-title	span { font-size: 100px; }		
		.countdown-container .countdown-madeby	{ font-size: 25px; }		
		.countdown-container .countdown-timer	{ gap: 0 10px; }
			.countdown-container .countdown-timer div { width: 80px; font-size: 40px; }
				.countdown-container .countdown-timer div span { font-size: 18px; }		
		
}