@import url('https://fonts.googleapis.com/css2?family=Poppins&display=swap');

@font-face {
	font-family: ds-digi;
	src: url(assets/fonts/DS-DIGI.TTF);
}

.brasil:root {
	--background-color: #FFD200;
	--text-color: #269d2b;
	--text-active-color: #1d7722;
}

.light:root {
	--background-color: #ffffff;
	--text-color: #015FE7;
	--text-active-color: #001D6D;
}

.dark:root {
	--background-color: #272727;
	--text-color: #c8b85d;
	--text-active-color: #C89C5D;
}

* {
	margin: 0;
	padding: 0;
	outline: none;
}

body {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	height: 90vh;
	background-color: var(--background-color);
	color: var(--text-color);
	font-family: Poppins, sans-serif;
}

.container-fluid {
	justify-content: center!important;
}

.navbar-nav {
	width: 100%;
	max-width: 480px;
	flex-direction: row;
	justify-content: space-around;
}

.btnCounters, #creator a {
	color: var(--text-color);
}

.btnCounters.active {
	font-family: Poppins, sans-serif;
	color: var(--text-color);
	font-weight: 600;
}

.btnCounters:hover, #creator a:hover {
	color: var(--text-active-color);
}

#totalDays {
	font-size: calc(3.5vw + 20px);
}

#timer {
	font-size: calc(1.5vw + 20px);
}

#clock {
	font-family: ds-digi;
	font-size: calc(5vw + 50px);
}