@media (min-width: 45em) {
	@supports (backdrop-filter: blur(20px)) {
		body {
			background-color: rgb(255, 234, 207);
			background-image: -webkit-image-set(
				url('https://arjun-menon.com/res/images/backgrounds/nature-bg/nature-bg.png') 1x,
				url('https://arjun-menon.com/res/images/backgrounds/nature-bg/nature-bg-2x.png') 2x
			), url("textured-paper.png");
			background-image: image-set(
				url('https://arjun-menon.com/res/images/backgrounds/nature-bg/nature-bg.png') 1x,
				url('https://arjun-menon.com/res/images/backgrounds/nature-bg/nature-bg-2x.png') 2x
			), url("textured-paper.png");
		}

		#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);
		}
	}
}

/* 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;
}

/* From: https://www.jonoalderson.com/conjecture/its-time-for-modern-css-to-kill-the-spa/ */
@view-transition {
  navigation: auto;
}
::view-transition-old(root),
::view-transition-new(root) {
  animation: fade 0.3s ease both;
}
@keyframes fade {
  from { opacity: 0; }
  to   { opacity: 1; }
}