@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');

* {
	--white: #fff;
	--black: #000;
	--blue: #14B1E7;
}

body {
	width: 100vw;
	height: 100vh;
	background-image: url('../images/main_background.jpg');
	background-repeat: no-repeat;
	background-size: cover;
	background-position: bottom;
	font-family: "Inter", sans-serif;
}
p {
	font-size: 14px;
	line-height: 28px;
	letter-spacing: 32%;
	text-transform: uppercase;
	color: var(--white);
}
.content {
	height: 100vh;
}
.title p {
	border: 1px solid var(--white);
	border-radius: 25px;
	padding: 10px;
	width: 250px;
	margin: 2rem auto;	
}
.arrows {
	position: absolute;
	bottom: 18%;
	right: 10%;
	z-index: 1;
}
.arrows img {
	margin-bottom: 1rem;
}
footer {
	position: absolute;
	bottom: 0;
	width: 100%;
	background-color: var(--black);
	padding: 3rem 0;
}
footer li {
	display: inline-block;
	list-style: none;
}
footer li:after {
	content: " | ";
	padding: 0 5px;
	color: var(--white);
}
footer li:last-child:after {
	content: "";
}
footer li a {
	font-size: 20px;
	font-weight: 100;
	line-height: 28px;
	color: var(--white);
	text-decoration: none;
	transition: 1s;
}
footer li a:hover {
	color: var(--blue);
}

@media (max-width: 1200px) {
	body { 
		background-position: 0 -100px;
	}
	.arrows {
		bottom: 24%;
	}
	.arrows img {
		max-height: 60px;
	}
}

@media (max-width: 768px) {
	body {
		background-position: -525px -100px;
	}
	footer {
		padding: 1rem 0;
	}
	footer li:after {
		content: "";
	}

}