$header-width: 1400px;

$main-width: 720px;

.visible { display: initial; }

body {
	min-height: 100vh;
	margin: 0;
	background: url(/body-bg.svg) top center no-repeat #d22d40;
	background-size:100% auto;
	color: #fff;
	font-size: 1.3em;

	a { text-decoration: none; }
}

nav {
	display: none;
}

header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	max-width: $header-width;
	margin: 0 auto;
	padding: 2em 1em;
	font-size: 1.35em;

	img { width: 250px; }
	h1 {
		font-size: inherit;
		color: #fff;
	}
	#menu {
		width: 250px;
		text-align: right;
	}
}

main {
	max-width: $main-width;
	padding: 1em;
	margin: 0 auto;

	h2 { font-size: 3em; }
}

main#index {
	max-width: $header-width;
	display: flex;
	align-items: center;
	justify-content: space-between;
	background: url(/index-bg.png) center center no-repeat;
	background-size: contain;
	padding: 2em 1em;

	section, aside { max-width: 35%; }
	section{ text-shadow: 0px 3px 8px rgba(0, 0, 0, .35); }
	aside {
		display: flex;
		flex-direction: column;
		align-items: stretch;

		a {
			text-align: center;
			border: 2px solid #fff;
			border-radius: .8em;
			margin-bottom: 1.5em;
			padding: .6em 1.5em;
			color: #fff;

			&:hover {
				background: #fff;
				color: #b52637;
			}
		}
	}
}