/* slabo-27px-regular - latin */
@font-face {
  font-display: swap;
  font-family: 'Slabo 27px';
  font-style: normal;
  font-weight: 400;
  src: url('assets/slabo-27px-v14-latin-regular.woff2') format('woff2'); 
}


:root {
	--link-color: #DE0E25;
	--background: #182423;
	--font-color: #E7E3DD;
	--font-family: 'Slabo 27px', monospace, sans-serif;
	--font-size: 27px;
	--h1-size: 	calc(var(--font-size) * 1.5);
	--h2-size: 	calc(var(--font-size) * 1.2);
}

html,
body {
	padding: 0;
	margin: 0;

	//background: var(--background);

	font-size: clamp(1rem, 4vw, 27px);
	line-height: 1.5;
	font-family: var(--font-family);
	color: var(--font-color);
	text-wrap: pretty;
}
body {
	background: url(hand-1.webp) repeat-y;
	background-size: 100vw;
	background-position: top center;
	background-attachment: fixed;
}
img, video {
	max-width: 100%;
}
h1 {
	font-size: clamp(1.5rem, 4vw ,var(--h1-size));
}
h2 {
	font-size: clamp(1.2rem, 4vw, var(--h2-size));
}
a {
	color: var(--link-color);
	transition: color 0.3s;
}
a:hover,
a:focus {
	color: var(--font-color);
}
header {
	position: relative;
}

.gift {
	width: 80vw;
	max-width: 500px;
	display: block;
	margin-inline: auto;
	padding-block: 10vh;
	max-height: 50vh;
}
.social {
	position: absolute;
	right: 1rem;
	top: 1rem;
}
.social a {
	display: inline-block;
	width: 1.5rem;
	height: 1.5rem;
	margin-bottom: 1rem;
	filter: hue-rotate(345deg) saturate(3);
	transition: filter 0.3s;
}
.social a:hover,
.social a:focus {
	filter: saturate(10%);
}
.social img {
	max-width: 100%;
}
header img {
	width: 100%;
	max-width: none;
}
main,
footer {
	margin-inline: auto;
	padding-inline: 1rem;
	max-width: 1200px;
	background: rgba(0,0,0,0.4)
}
main {
	padding-block: 1rem;
}
footer {
	text-align: center;
	padding-block: 1rem;
}
footer a {
	padding-inline-end: 1rem;
}

.center {
	text-align: center;
}
.button {
	color: var(--link-color);
	background: transparent;
	text-decoration: none;
	padding: 0.25rem 1rem;
	border: medium solid var(--link-color);
}
.button:hover,
.button:focus {
	color: #fff;
	background: var(--link-color);
}