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

@tailwind base;
@tailwind components;
@tailwind utilities;

html,
body {
	@apply text-black;
	padding: 0;
	margin: 0;
	font-family: "Roboto", sans-serif;
}

.scrolling-background {
	background-image: url(/img/background.png);
	animation-name: scrollbg;
	animation-duration: 120s;
	animation-iteration-count: infinite;
	animation-timing-function: ease;
	animation-direction: alternate;
}

.dropdown:hover .dropdown-content {
	display: block;
}

.mobile-compatible {
	display: none;
}

.line-clamp {
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 1;
	line-clamp: 1;
	-webkit-box-orient: vertical;
}

@keyframes scrollbg {
	0% {
		background-position: 0 0;
	}

	100% {
		background-position: 100% 100%;
	}
}

@media (max-width: 1024px) {
	.navbar {
		display: none !important;
	}

	.mobile-compatible {
		display: block;
	}
}