:root {
	/* Color */
	--main-color: rgb(255, 188, 13);
	--altern-color: rgb(219, 0, 7);
	--first-color: rgb(15, 66, 123);
	--second-color: rgb(230, 86, 75);

	/* Gradient */
	--main-gradient: linear-gradient(-30deg, var(--first-color) 20%, var(--second-color) 100%);
}

/* Fonts */
@font-face {
	font-family: "Speedee";
	src: url("../fonts/Speedee/Speedee_W_Rg.woff2") format("woff2"),
		url("../fonts/Speedee/Speedee_W_Rg.woff") format("woff");
	font-weight: normal;
	font-display: swap;
}

@font-face {
	font-family: "Speedee";
	src: url("../fonts/Speedee/Speedee_W_Lt.woff2") format("woff2"),
		url("../fonts/Speedee/Speedee_W_Lt.woff") format("woff");
	font-weight: lighter;
	font-display: swap;
}

@font-face {
	font-family: "Speedee";
	src: url("../fonts/Speedee/Speedee_W_Bd.woff2") format("woff2"),
		url("../fonts/Speedee/Speedee_W_Bd.woff") format("woff");
	font-weight: bold;
	font-display: swap;
}

html,
body {
	font-family: "Speedee", sans-serif
}

h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: "Speedee", sans-serif;
}

h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a {
	font-weight: inherit;
}

.material-symbols-rounded {
	font-family: 'Material Symbols Rounded';
	font-weight: normal;
	font-style: normal;
	font-size: inherit;
	display: inline-block;
	line-height: inherit;
	text-transform: none;
	letter-spacing: normal;
	word-wrap: normal;
	white-space: nowrap;
	direction: ltr;
}

.glass-panel {
	/* color: var(--white-color); */
	background: linear-gradient(45deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0.05));
	border-top: 1px solid rgba(255, 255, 255, 0.5);
	border-left: 1px solid rgba(255, 255, 255, 0.5);
	box-shadow: 0px 0px 5px 1px rgba(0, 0, 0, 0.5);
	overflow: hidden;
}

.gradient-panel {
	color: var(--white-color);
	background: var(--main-gradient);
}