@media (min-width: 45em) {
	body {
		background-color: rgb(255, 234, 207);
		background-image: url("textured-paper-webp.webp");
	}

	@supports (backdrop-filter: blur(20px)) {
		body {
			background-image: image-set(
				url("https://arjun-menon.com/res/images/backgrounds/nature-bg/nature-bg.jxl") type("image/jxl") 1x,
				url("https://arjun-menon.com/res/images/backgrounds/nature-bg/nature-bg-2x.jxl") type("image/jxl") 2x,
				url("https://arjun-menon.com/res/images/backgrounds/nature-bg/nature-bg.avif") type("image/avif") 1x,
				url("https://arjun-menon.com/res/images/backgrounds/nature-bg/nature-bg-2x.avif") type("image/avif") 2x,
				url("https://arjun-menon.com/res/images/backgrounds/nature-bg/nature-bg.webp") type("image/webp") 1x,
				url("https://arjun-menon.com/res/images/backgrounds/nature-bg/nature-bg-2x.webp") type("image/webp") 2x,
				url("https://arjun-menon.com/res/images/backgrounds/nature-bg/nature-bg.png") type("image/png") 1x,
				url("https://arjun-menon.com/res/images/backgrounds/nature-bg/nature-bg-2x.png") type("image/png") 2x
			), url("textured-paper-webp.webp");
		}
		#main {
			background: rgba(254, 247, 239, 0.79);
			border-radius: 25px;
			box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
			backdrop-filter: blur(22px);
			border: 1px solid rgba(254, 247, 239, 0.3);
		}
	}
	@supports (backdrop-filter: blur(20px))
		and (hanging-punctuation: first)
		and (font: -apple-system-body)
		and (-webkit-appearance: none) {
		body {
			background-image: image-set(
				url("https://arjun-menon.com/res/images/backgrounds/nature-bg/nature-bg.avif") type("image/avif") 1x,
				url("https://arjun-menon.com/res/images/backgrounds/nature-bg/nature-bg-2x.avif") type("image/avif") 2x,
				url("https://arjun-menon.com/res/images/backgrounds/nature-bg/nature-bg.webp") type("image/webp") 1x,
				url("https://arjun-menon.com/res/images/backgrounds/nature-bg/nature-bg-2x.webp") type("image/webp") 2x,
				url("https://arjun-menon.com/res/images/backgrounds/nature-bg/nature-bg.jxl") type("image/jxl") 1x,
				url("https://arjun-menon.com/res/images/backgrounds/nature-bg/nature-bg-2x.jxl") type("image/jxl") 2x,
				url("https://arjun-menon.com/res/images/backgrounds/nature-bg/nature-bg.png") type("image/png") 1x,
				url("https://arjun-menon.com/res/images/backgrounds/nature-bg/nature-bg-2x.png") type("image/png") 2x
			), url("textured-paper-webp.webp");
		}
	}
}

/* Copied from https://fonts.cdnfonts.com/css/optima */
@font-face {
    font-family: 'Optima';
    font-weight: normal;
    src: local('Optima'), url('https://fonts.cdnfonts.com/s/14439/OPTIMA.woff') format('woff');
	font-display: swap;
}
@font-face {
    font-family: 'Optima';
    font-style: italic;
    src: local('Optima Italic'), url('https://fonts.cdnfonts.com/s/14439/Optima_Italic.woff') format('woff');
	font-display: swap;
}
@font-face {
    font-family: 'Optima';
    font-weight: bold;
    src: local('Optima Bold'), url('https://fonts.cdnfonts.com/s/14439/OPTIMA_B.woff') format('woff');
	font-display: swap;
}