@import url('https://fonts.googleapis.com/css2?family=Fira+Code:wght@300;400;700&display=swap')
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans:ital,wght@0,300;0,400;0,500;0,700;1,300;1,400;1,500&display=swap')

$fonts: "Noto Sans", "Fira Code", monospace
$background-color: #1e1e2e
$foreground-color: #b4befe
$complementary-color: #cba6f7

body
	background-color: $background-color
	font-family: $fonts

	padding: 10px

	p,li
		font-size: 16px

	h1
		font-size: 24px

footer
	font-size: 12px
	color: white

	display: flex
	align-items: center
	justify-content: center

.container
	background-color: $foreground-color

	display: flex
	flex: 1 1 auto
	flex-direction: column
	align-items: center
	justify-content: center

	width: fit-content
	min-width: 33%

	margin-left: auto
	margin-right: auto
	margin-top: 2%

	border-radius: 5px

.content
	display: inline-block
	text-align: center

	margin: 5px

	padding: 5px

.headerbar
	background-color: $foreground-color

	display: flex
	flex-direction: row
	align-items: center
	justify-content: center

	width: fit-content

	margin-left: auto
	margin-right: auto
	margin-top: 2%

	border-radius: 5px
	padding: 10px

#blogpost
	min-width: 50%

#commitText
	width: fix-content

	margin: 10px
	padding: 5px
	border-radius: 5px

#gifs
	background-color: $background-color
	display: inline-block
	text-align: center
	padding: 10px
	margin: 10px

#vidya
	display: flex
	justify-content: center
	padding: 5px
	margin: 5px