* {
/*			border: 1px solid #59310E;*/
			background: #BF8C6F;
			background-image: url("img/beigebrown.jpeg");
		}


		/*Fonts Here too*/
/*EB Garamond*/
		.eb-garamond-<uniquifier> {
			font-family: "EB Garamond", serif;
			font-optical-sizing: auto;
			font-weight: <weight>;
			font-style: normal;
		}


/*Averia Libre*/
		.averia-libre-light {
			font-family: "Averia Libre", system-ui;
			font-weight: 300;
			font-style: normal;
}

		.averia-libre-regular {
			font-family: "Averia Libre", system-ui;
  			font-weight: 400;
  			font-style: normal;
}

		.averia-libre-bold {
  			font-family: "Averia Libre", system-ui;
  			font-weight: 700;
  			font-style: normal;
}

		.averia-libre-light-italic {
			font-family: "Averia Libre", system-ui;
			font-weight: 300;
			font-style: italic;
}

		.averia-libre-regular-italic {
			font-family: "Averia Libre", system-ui;
  			font-weight: 400;
  			font-style: italic;
}

		.averia-libre-bold-italic {
  			font-family: "Averia Libre", system-ui;
  			font-weight: 700;
  			font-style: italic;
}



		body {
			width: 90%;
			max-width: 900px;
			margin: 3% auto;
			font-size: 18px;
			background: #BF8C6F;
		}


		header {
/*			height: 250px;*/
			font-family: EB Garamond, Georgia;
			background: #BF8C6F;
			padding: 4%;
			border: 1px solid #BF8C6F;
			border-radius: 5%;
		}


		p {
			text-align: left;
			font-size: 1.2em;
			border: 5px dotted #59310E;
			border-radius: 40%;
			margin: 0 auto;
			padding: 4%;
		}


		a {
			background: #BF8C6F;
			color: #59310E;
		}



		h1 {
			font-size: 3em;
			font-weight: bold;
			text-align: center;
			color: #F2F2F2;
			background: #BF8C6F;
		}

		h2 {
			font-family: EB Garamond, Georgia;
			font-size: 2em;
			font-weight: bold;
			color: #F2F2F2;
			text-align: center;
			background: #BF8C6F;
			padding: 2%;
		}


		header p {
			width: 60%;
			background: #BF8C6F;
		}


		img {
			/*width: 50%;
			margin: 0 auto;*/
			display: block;
			margin-left: auto;
			margin-right: auto;
			width: 50%;
			border-radius: 100%;
		}


		ul {
  			list-style-type: none;
  			background: #BF8C6F;
		}


		span {
/*			color: #591902;*/
			color: white;
			font-size: 1.3em;
			font-family: Averia Libre, Georgia;
			background: #BF8C6F;
		}


		#wrapper {
			background-image: url("img/beigebrown.jpeg");
/*			background: #BF8C6F;*/
		}

		#data {
			margin-bottom: 2%;
			font-size: .9em;
/*			display: grid;*/
			background: #BF8C6F;
		}


		#data li {
			margin-bottom: 2%;
			padding: .5em;
			padding-top: .5em;
			padding-right: 5%;
			text-align: center;
			font-size: 1.3em;
			background: #BF8C6F;
		}



		#steps {
			margin-bottom: 2%;
			font-size: .9em;
			display: grid;
			background: #BF8C6F;
		}


		#steps li {
			margin-bottom: 2%;
			padding: .5em;
			padding-right: 5%;
			text-align: center;
			font-size: 1.3em;
			display: grid;
			background: #BF8C6F;
		}


/*Mobile*/
		@media only screen and (min-width: 700px) and (max-width: 900px) {

			#data ul {
				grid-template-columns: 1fr 1fr;
				grid-gap: 10px;
			}


			#steps ul {
				grid-template-columns: 1fr 1fr;
				grid-gap: 10px;
			}

		}


/*Desktop*/
		@media only screen and (min-width: 901px) {

			#data ul {
				grid-template-columns: 1fr 1fr 1fr 1fr;
				grid-gap: 10px;
			}


			#steps ul {
				grid-template-columns: 1fr 1fr 1fr 1fr;
				grid-gap: 10px;
			}
			
		}