html {

	background-color: #403B38;

}

body {

	display: grid;
	margin-left: auto;
	margin-right: auto;
	margin-top: 0;
	min-width: 350px;
	width: 90%;

}

h1 {

	color: white;
	font-family: 'Pridi', serif;
	text-align: center;

}

.hero-image {

	background-image: url(images/hero.jpg);
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	height: 15rem;

}

.hero-text {

	font-size: 2em;
	padding-top: 3%;

}

#navbar-ul {

	background-color: #8C7268;
	font-family: 'Merriweather', serif;
	list-style-type: none;
	margin: 0;
	padding: 1rem;
	text-align: center;

}

#navbar-li {

	color: white;
	display: inline;
	margin: 0;
	padding:  1rem;

}

a {

	color: white;
	display: inline-block;
	text-decoration: none;

}

a:hover {

	color: #F2C791;

}

h2 {

	margin-top: 0;
	
}

section {

	background-color: #02735E;
	color: white;
	font-family: 'Merriweather', serif;
	line-height: 2rem;
	padding: 3%;
	text-align: center;

}

#content {

	text-align: justify;

}

p {

	margin-bottom: 0;

}

#link {

	color: #F2C791;
	text-decoration: underline;

}

li {

	text-align: left;

}

/*Desktop*/

@media only screen and (min-width: 950px) {

	#wc-sections {

		display: grid;
		grid-gap: 1rem;
		grid-template-columns: 1fr 1fr;

	}

	body {

		width: 60%;

	}

}