@import url('https://fonts.googleapis.com/css2?family=Sour+Gummy:ital,wght@0,100..900;1,100..900&display=swap');

* {
	box-sizing: border-box;
}

.img_right {
	float:right;
}

.img_left {
	float:left;
}

main {
	display:flex;
	justify-content:center;
}

body {
	background-color: #D6DFE7;
	font-family:Sour Gummy,sans-serif;
	font-size:1.5em;
}

body #landing {
	margin:0;
}

#landnav {
    width: 980px;
    height: 535px;    
    position: absolute;
    top:0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
}

header {
	padding: 30px;
	text-align: center;
	font-size: 35px;
	color: white;
}

header img {
	max-width:100%;
}

section {
	margin-left:auto;
	margin-right:auto;
}

nav {
	float:left;
	max-width:375px;
	padding:0px 20px 40px;
	background-color:#7392AC;
	border:4px solid white;
	outline:4px solid black;
}

nav a {
	color:#fff;
	text-decoration:none;
	font-weight:bold;
}

nav img {
	display:block;
	margin:30px auto 0;
}

nav ul {
	list-style-type: none;
	padding: 0;
}

article {
	float:left;
	padding:0px 50px;
	max-width:985px;
}

article img {
	max-width:100%;
}

h1 {
	text-align:center;
	font-size:1.5em;
}

article ul {
	font-weight:bold;
	list-style-type: none;
	margin-bottom:40px;
}

article li:first-child {
	margin-top:10px;
}

article li {
	font-weight:normal;
}

section::after {
	content: "";
	display: table;
	clear: both;
}

footer {
	margin-top:50px;
	text-align: center;
	color: #B18F57;
	font-size:.8em;
}

footer img {
	vertical-align:middle;
	margin:0px;
	padding:0px;
}

footer p {
	margin-top:10px;
}

#enter-content {
	margin-bottom:50px;
}

@media (max-width: 1360px) {
	nav, article {
		float:none;
		font-size:.9em;
	}
	nav {
		margin-left:auto;
		margin-right:auto;
		margin-bottom:30px;
		width:100%;
	}
	nav img {
		width:70%;
	}
	.inline_img {
		width:25%;
	}
/*
@media (max-width: 1015px) {
	nav {
		float:none;
		background-color:red;
		margin-left:auto;
		margin-right:auto;
	}
	nav img {
		width:70%;
	}
} */

@media (max-width: 600px) {
	nav, article {
		width: 100%;
		height: auto;
		padding:0 20px;
		font-size:.75em;
	}
	nav img {
		width:40%;
		margin:20px auto;
	}

	header img {
		width:100%;
	}
	iframe {
		width:100%;
	}
	#spacer {
		width:40%;
	}
}

/* Sorry, hiding puzzle pieces in CSS isn't my style. */