@media (orientation: portrait) {
	section IMG {
		max-width: 90%;
	}
	header {
		flex-direction: row;
		align-items: flex-start;
		padding: 30px 5%;
	}
	#menu-mobile-toggle {
		display: inline-block;
	}
	#menu-desktop-toggle {
		display: none;
	}
	#mobile_nav
	{
		display: block;
	}

	iframe
	{
		max-width: 100%;
	}

	nav ul {
		margin-top: 0px;
		flex-direction: row;
		flex-wrap: wrap;
		gap: 2px 15px;
	}
	nav ul li:first-child {
		margin-left: 0px;
	}
	nav ul:nth-child(2) {
		display: none;
		position: fixed;
		flex-direction: column;
		visibility: visible;
		opacity: 1;
		background-color: white;
		width: 100%;
		height: 100%;
		overflow: scroll;
		left: 0px;
		top: 0px;
		text-align: center;
	}
	.hero {
		padding: 10vh 5%;
	}
	.hero h1 {
		font-size: 2.5rem;
	}
	.about-grid {
		grid-template-columns: 1fr;
		gap: 40px;
	}
	footer {
		flex-direction: column;
		align-items: flex-start;
		gap: 20px;
		padding: 40px 5%;
	}
}