:root {
	--yellow: #f4d04e;
	--gray950: #111111;
	--gray500: #6b6b6b;
	--white: #ffffff;
}

* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	font-family: "Figtree", sans-serif;
}

.text-preset-1 {
	font-weight: 800;
	font-size: 1.5rem;
	line-height: 150%;
	letter-spacing: 0rem;
}

.text-preset-2 {
	font-weight: 500;
	font-size: 1rem;
	line-height: 150%;
	letter-spacing: 0rem;
}

.text-preset-3 {
	font-weight: 500;
	font-size: 0.875rem;
	line-height: 150%;
	letter-spacing: 0rem;
}

.text-preset-3-bold {
	font-weight: 800;
	font-size: 0.875rem;
	line-height: 150%;
	letter-spacing: 0rem;
}

body {
	height: 100vh;
	background-color: var(--yellow);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
}

.card {
	background-color: var(--white);
	width: 24rem;
	height: 32.625rem;
	padding: 1.5rem;
	border-radius: 20px;
	border: 1px solid var(--gray950);
	box-shadow: var(--gray950) 10px 10px;
}

.card > img {
	border-radius: 10px;
	margin-bottom: 1.5rem;
}

.content {
	margin-bottom: 1.5rem;
}

.learning {
	background-color: var(--yellow);
	display: inline;
	padding: 0.25rem 0.75rem;
	border-radius: 4px;
	/* margin-bottom: 2.5rem; */
}

.date {
	margin-top: 0.75rem;
	margin-bottom: 0.75rem;
}

.title {
	margin-bottom: 0.75rem;
}

.description {
	color: var(--gray500);
}

.author {
	display: flex;
	align-items: center;
}

.author > img {
	width: 2rem;
	height: 2rem;
	margin-right: 0.75rem;
}
.attribution {
	margin-top: 1rem;
}