@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;700&display=swap");

:root {

	--border-size: 2px;
	--button-hover: 1.03;

	--accent-primary: #a89632;

	--background-primary: #403f3f;
	--background-secondary: #7b7b7b;
	--background-tertiary: #262626;

	--radius-avatar: 50%;
	--size-sm-avatar: 50px;
	--size-med-avatar: calc(var(--size-sm-avatar) * 2);
	--size-xl-avatar: calc(var(--size-sm-avatar) * 4);

	--text-primary: #fff;
	--font-primary: 'Poppins', sans-serif;
	--size-sm-font: 10px;
	--size-med-font: calc(var(--size-sm-font) * 2);
	--size-xl-font: calc(var(--size-sm-font) * 4);

	--radius-none: 0;
	--radius-primary: 5px;
	--radius-secondary: calc(var(--radius-primary) * 2);
	--radius-tertiary: calc(var(--radius-primary) * 4);

	--spacing-none: 0;
	--spacing-primary: 10px;
	--spacing-secondary: calc(var(--spacing-primary) * 2);
	--spacing-tertiary: calc(var(--spacing-primary) * 4);

}

/* Mobile */
@media only screen and (max-width: 784px) {

	body {
		overflow-y: auto;
	}

	body::-webkit-scrollbar {
		display: none;
	}

}

/* Desktop */
@media only screen and (min-width: 784px) {

	body {
		overflow: hidden;
	}

}