@import url('https://fonts.googleapis.com/css2?family=Ubuntu:ital,wght@0,300;0,700;1,300;1,700&display=swap');

* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

html {
	font-family: 'Ubuntu', sans-serif;
}

body {
	background-image: url('../img/bg0.png');
	background-repeat: repeat;
	width: 100vw;
	height: 100vh;
}

main {
	display: flex;
	flex-direction: column;
	justify-content: center;
	height: 100%;
}

main > section {
	height: 100%;
	display: flex;
	justify-content: center;
	position: relative;
}

img.main-image {
	align-self: flex-end;
	filter: drop-shadow(-24px -24px 12px rgba(0, 0, 0, 0.5));
	height: 624px;
}

.card {
	padding: 24px 48px;
	background-color: rgb(160, 0, 224);
	color: white;
	width: 50%;
	margin: auto;
	box-shadow: 12px 12px 8px rgba(0, 0, 0, 0.5);
	border-radius: 8px;
}

footer {
	background-color: rgb(160, 0, 224);
	padding: 48px;
	color: white;
}

footer > p {
	text-align: right;
}

.heart {
	color: red;
	font-size: 1.25em;
}

@media (max-width: 600px) {
	.card {
		width: 90%;
	}

	img.main-image {
		display: none;
	}
}