/* =========================================================
   AppVortex Responsive Helpers
========================================================= */

@media (max-width: 800px) {

	.av-grid {
		grid-template-columns: 1fr;
	}

	.av-content-layout {
		grid-template-columns: 1fr;
	}

	/*
	 * The mobile menu toggle is controlled by header.css.
	 * Do not override its display mode here, otherwise the
	 * three-line hamburger loses its flex layout.
	 */

	.main-navigation {
		display: none;
		width: 100%;
	}

	.main-navigation.is-open {
		display: block;
	}

	.main-navigation ul {
		flex-direction: column;
	}

	.av-header-row {
		flex-wrap: wrap;
	}
}