:root {
	--underline-color: rgb(255, 111, 0);
}

.glassy {
	background: rgba(255, 255, 255, 0.3);
	border-radius: 16px;
	box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
	backdrop-filter: blur(2.6px);
	-webkit-backdrop-filter: blur(2.6px);
}

.underline-big {
	text-decoration: underline;
	text-decoration-color: var(--underline-color);
	text-decoration-thickness: 4px;
}

.underline-small {
	text-decoration: underline;
	text-decoration-color: var(--underline-color);
	text-decoration-thickness: 2px;
}

.bg-pattern {
	--color: rgba(114, 114, 114, 0.3);
	background-color: #191a1a;
	background-image: linear-gradient(0deg,
			transparent 24%,
			var(--color) 25%,
			var(--color) 26%,
			transparent 27%,
			transparent 74%,
			var(--color) 75%,
			var(--color) 76%,
			transparent 77%,
			transparent),
		linear-gradient(90deg,
			transparent 24%,
			var(--color) 25%,
			var(--color) 26%,
			transparent 27%,
			transparent 74%,
			var(--color) 75%,
			var(--color) 76%,
			transparent 77%,
			transparent);
	background-size: 55px 55px;
}

/* Small devices (landscape phones, 400px and up) */
@media (min-width: 320px) {
	.profile-image {
		width: 150px;
	}
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
	.profile-image {
		width: 230px;
	}
}

@media (min-width: 1000px) {
	.custom-container {
		max-width: 1000px;
		margin: 0 auto;
	}
}

.title-font {
	font-family: "Michroma", sans-serif;
	font-weight: 800;
	word-spacing: 4px;
	letter-spacing: 2px;
}

.sub-title-font {
	font-family: "Michroma", sans-serif;
	font-weight: 600;
}

.paragraph-font {
	font-family: 'Roboto', Arial, Helvetica, sans-serif;
}