@media only screen and (min-width: 830px) {
	header{
        font-size: 1rem;
		grid-template-columns: 1fr 2fr 1fr;
    }

	nav {
		grid-column: 3/4;
		grid-row: 1/2;
	}

	.social {grid-column: 4/5;}

	.logo {width: 100px;}

	main {
		margin: .5em auto;
		max-width: 1000px;
	}


	.event {
		grid-row: 1/2;
		grid-column: 1/2;
	}

	.weather {
		grid-row: 2/3;
		grid-column: 1/2;
	}

	.join {
		grid-row: 3/4;
		grid-column: 1/2;
	}

	.hero {
		grid-row: 1/3;
		grid-column: 2/3;
		min-width: 400px;
	}

	.hero h2 {
		padding: .5em;
		font-size: 2em;
	}

	.hero button {
		margin-bottom: 1em;
		margin-right: 1em;
	}

	.news {
		grid-row: 3/4;
		grid-column: 2/3;
	}

	.spotlight {
		grid-row: 1/4;
		grid-column: 3/4;
		grid: repeat(3, 1fr) / 1fr;
		grid-column-gap: 10px;
	}

	#spotlight3 {display: initial;}

    .navigation {
		display: flex;
		position: relative;
	}

	.navigation li {
		display: block;
		flex: 1 1 auto;
	}

	.navigation a {
		text-align: center;
        border: none;
	}

    .menu {display: none;}

	.discover-main {
		display: grid;
		grid-template-rows: minmax(min-content, max-content);
		grid-template-columns: minmax(min-content, max-content);
	}

	.description {
        display: block;
		font-size: smaller;
  }

	.join-main h2 {
        margin-top: 1rem;
        border-radius: 5px;
  }

	.thankyou-main h2 {
		font-size: xx-large;
	}

	.card-view {
        grid-template-columns: repeat(3, 1fr);
    }
		.contact-main form {
			grid-column: 1/2;
			justify-self: right;
		}
	
		.google-map {
			grid-column: 3/4;
			margin-top: 2rem;
			margin-left: 10px;
		}
	
		.information {
			grid-column: 2/3;
			grid-row: 1/2;
			margin-top: 2rem;
		}
	
}