html {
		    margin: 0;
		    padding: 0;
		}

		header {
			margin: -2% 0 0 0;
			padding: 0;
			clear: both;
			width: 100%;
		}

		footer {
			margin: 0 -2% 0 0;
			padding: 0;
			clear: both;
			width: 100%;
		}


		.headline {
			width: 60%;
			margin: auto;
			justify-content: center;
		}

		/* Responsive Code */



		.flex-container {
			display: flex;
			flex-direction: row;
			justify-content: space-around;
			flex-wrap: wrap;
			gap: 20 50;
			align-items: flex-start;
			width: 90%;
			margin: auto;
		}



		.flex-container-img {
			display: flex;
			flex-direction: row;
			justify-content: space-evenly;
			align-items: center;
			margin: auto;
			gap: 20 50;
		}


		.flex-container-nav {
			display: flex;
			flex-direction: row;
			justify-content: flex-end;
			overflow: hidden;
			background-color: #054a25;
			position: sticky;
			top: 0;
			width: 100%;
		}


		.flex-container-nav a {
			float: left;
			display: block;
			color: #f2f2f2;
			text-align: center;
			padding: 10 30 10 30;
			text-decoration: none;
			font-size: 1.1em;
			font-weight: 200;
		}

		.flex-container-nav a:hover {
			background: #ddd;
			color: black;
		}

		.flex-container-nav .icon {
			display: none;
		}

		.flexitem-2 {
			flex: 50%;
		}

		.flexitem-3 {
			flex: 33%;
		}

		.flexitem-4 {
			flex: 25%;
		}

		.flexitem-5 {
			flex: 20%;
		}

		.flexitem-6 {
			flex: 16%;
		}

		.flexitem-8 {
			flex: 12.5%;
		}

		.flexitem-10 {
			flex: 10%;
		}


		/* Ability to show or hide a block depending on mobile vs desktop */
		.hidedesk {
			display: none;
		}



		/* Mobile View */
		@media (max-width: 900px) {



			.headline {
				width: 90%;
				margin: auto;
				justify-content: center;
			}

		
			.flex-container {
				align-items: center;
				text-align: center;
				gap: 40px;
			}


			.flex-container-img {
				display: flex;
				flex-direction: column;
				justify-content: space-evenly;
				align-items: center;
				gap: 40px;
			}

			.flex-container-nav a {
				font-size: 0.6em;
				display: none;
			}

			.flex-container-nav a.icon {
				float: right;
				display: block;
			}

			.flex-container-nav.responsive {
				position: sticky;
			}

			.flex-container-nav.responsive .icon {
				position: absolute;
				right: 0;
				top: 0;
			}

			.flex-container-nav.responsive a {
				float: none;
				display: block;
				text-align: left;
			}

			.flexitem-2, .flexitem-3, .flexitem-4, .flexitem-5, .flexitem-6, .flexitem-8, .flexitem-10 {
				flex: 100%;
			}



			/* Ability to show or hide a block depending on mobile vs desktop */
			.hidemobile {
				display: none;
			}

			.hidedesk {
				display: inline;
			}



		}