/*#region Font */
@font-face {
	font-family: "Roboto";
	src: url('/fonts/roboto-thin.ttf') format('truetype');
	font-weight: 100;
	font-style: normal;
}

@font-face {
	font-family: "Roboto";
	src: url('/fonts/roboto-thinitalic.ttf') format('truetype');
	font-weight: 100;
	font-style: italic;
}

@font-face {
	font-family: "Roboto";
	src: url('/fonts/roboto-extralight.ttf') format('truetype');
	font-weight: 200;
	font-style: normal;
}

@font-face {
	font-family: "Roboto";
	src: url('/fonts/roboto-extralightitalic.ttf') format('truetype');
	font-weight: 200;
	font-style: italic;
}

@font-face {
	font-family: "Roboto";
	src: url('/fonts/roboto-light.ttf') format('truetype');
	font-weight: 300;
	font-style: normal;
}

@font-face {
	font-family: "Roboto";
	src: url('/fonts/roboto-lightitalic.ttf') format('truetype');
	font-weight: 300;
	font-style: italic;
}

@font-face {
	font-family: "Roboto";
	src: url('/fonts/roboto-regular.ttf') format('truetype');
	font-weight: 400;
	font-style: normal;
}

@font-face {
	font-family: "Roboto";
	src: url('/fonts/roboto-italic.ttf') format('truetype');
	font-weight: 400;
	font-style: italic;
}

@font-face {
	font-family: "Roboto";
	src: url('/fonts/roboto-medium.ttf') format('truetype');
	font-weight: 500;
	font-style: normal;
}

@font-face {
	font-family: "Roboto";
	src: url('/fonts/roboto-mediumitalic.ttf') format('truetype');
	font-weight: 500;
	font-style: italic;
}

@font-face {
	font-family: "Roboto";
	src: url('/fonts/roboto-semibold.ttf') format('truetype');
	font-weight: 600;
	font-style: normal;
}

@font-face {
	font-family: "Roboto";
	src: url('/fonts/roboto-semibolditalic.ttf') format('truetype');
	font-weight: 600;
	font-style: italic;
}

@font-face {
	font-family: "Roboto";
	src: url('/fonts/roboto-bold.ttf') format('truetype');
	font-weight: 700;
	font-style: normal;
}

@font-face {
	font-family: "Roboto";
	src: url('/fonts/roboto-bolditalic.ttf') format('truetype');
	font-weight: 700;
	font-style: italic;
}

@font-face {
	font-family: "Roboto";
	src: url('/fonts/roboto-extrabold.ttf') format('truetype');
	font-weight: 800;
	font-style: normal;
}

@font-face {
	font-family: "Roboto";
	src: url('/fonts/roboto-extrabolditalic.ttf') format('truetype');
	font-weight: 800;
	font-style: italic;
}

@font-face {
	font-family: "Roboto";
	src: url('/fonts/roboto-black.ttf') format('truetype');
	font-weight: 900;
	font-style: normal;
}

@font-face {
	font-family: "Roboto";
	src: url('/fonts/roboto-blackitalic.ttf') format('truetype');
	font-weight: 900;
	font-style: italic;
}
/*#endregion */

:root {
	--primary-color: #0389d7;
	--secondary-color: #181818;
	--secondary-color-dark: #121212;
}

* {
	padding: 0;
	margin: 0;
	box-sizing: border-box;
	font-family: Roboto, Calibri, sans-serif;
}

.btn-main {
	cursor: pointer;
	font-size: 14px;
	padding: 5.5px 10px;
	background: var(--primary-color);
	color: white;
	font-weight: bold;
	border: 0;
	text-decoration: none;
}

	.btn-main:hover {
		filter: brightness(1.1);
	}

/*#region .icon */
.icon {
	display: inline-flex;
	object-fit: contain;
	color: black;
	background-color: black;
	-webkit-mask: var(--src) no-repeat center / contain;
	mask: var(--src) no-repeat center / contain;
	min-height: 20px;
	min-width: 20px;
}
/*#endregion */