@charset "utf-8";

/* Font Choices */
body, p {
  font-family: "Instrument Serif", serif;
}

h1, h2, h3 {
  font-family: "Holtwood One SC", serif;
}
body > h1 {
  font-size: 2.2em;
  padding: 16px 0 10px 0;
  text-align: center;
  color: #5F9539;
  letter-spacing: 1px;
	  
}

body > h1 a {
  color: #5F9539;
  text-decoration: none;
}

body > h1 a:visited {
  color: #5F9539;
}

body > h1 a:hover {
  color: #5F9539;
  text-decoration: none;
}
/* Fruits and Vegetables Palette
Dark Red: #BA1A29
Lime: #E7FF7E
Avocado: #B1D94E
Burnt Orange: #FFA336
Green: #5F9539
*/

/* General page styles */
* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

body {
  width: 100%;
  text-align: center;
  background-color: #ffffff;
}

h1, h2, p {
  color: black;
}

/* Main Navigation */
#mainNav {
  overflow: hidden;
  margin: 0;
  display: flex;
  justify-content: center;
  background-color: #5F9539;
  width: 100%;
  font-family: "Holtwood One SC", serif;
  padding: 15px 0;
}

#mainNav a {
  color: #FFEEE0;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}

#mainNav a:hover {
  background-color: #E7FF7E;
  color: #000000;
  font-weight: 700;
}

/* Banner */
.home_bg {
  background: #FFA336 url("../images/home_banner.png") no-repeat center center;
  background-size: cover;
  height: 500px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.home_bg h1 {
  color: white;
  font-size: 2.8em;
  background: rgba(0, 0, 0, 0.35);
  padding: 12px 24px;
}

/* Flexbox 2-column layout */
.container {
  display: flex;
  justify-content: center;
  gap: 30px;
  padding: 30px 5%;
  flex-wrap: wrap;
}
.element {
  flex: 1;
  max-width: 420px;
  padding: 20px;
  border: 3px solid #B1D94E;
  background-color: #ffffff;
}

.element h2 {
  margin-top: 10px;
  margin-bottom: 10px;
}

.element p {
  line-height: 1.4;
}

.first_bg {
  background: #ffffff url("../images/home_recipes.png") no-repeat center center;
  background-size: cover;
  height: 260px;
  margin: 12px 0;
}

.second_bg {
  background: #ffffff url("../images/home_tips.png") no-repeat center center;
  background-size: cover;
  height: 260px;
  margin: 12px 0;
}

/* Footer */
footer {
  background-color: #ffffff;
  text-align: center;
  padding: 40px 20px 20px 20px;
  margin-top: 40px;
}

footer a {
  color: black;
  text-decoration: none;
  margin: 0 18px;
  font-size: 1.1em;
}

footer a:hover {
  text-decoration: underline;
}

footer aside {
  margin-top: 14px;
}

footer h2 {
  margin-top: 20px;
  margin-bottom: 10px;
  color: #FFA336;
  font-size: 1.8em;
}

footer p {
  margin-top: 18px;
  font-size: 0.95em;
	
	
}
	


.about_bg {
  background: #5F9539 url("../images/about us page.jpg") no-repeat center center;
  background-size: cover;
  height: 500px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.about_bg h1 {
  color: white;
  font-size: 2.8em;
  background: rgba(95, 149, 57, 0.85);
  padding: 12px 24px;
}

.about_first_bg {
  background: url("../images/Plant based about.jpg") no-repeat center center;
  background-size: cover;
  height: 260px;
  margin: 12px 0;
}

.about_second_bg {
  background: url("../images/about us recipes.jpg") no-repeat center center;
  background-size: cover;
  height: 260px;
  margin: 12px 0;
}

.contact_bg {
  background: #5F9539 url("../images/Contact us.jpg") no-repeat center center;
  background-size: cover;
  height: 500px;
  display: flex;
  justify-content: center;
  align-items: center;
}


.contact_bg h1 {
  color: white;
  font-size: 2.8em;
  background: rgba(95, 149, 57, 0.85);
  padding: 12px 24px;
}

.contact_first_bg {
  background: url("../images/Plant Based Basics questions.jpg") no-repeat center center;
  background-size: cover;
  height: 260px;
  margin: 12px 0;
}

.contact_second_bg {
  background: url("../images/healthy food contact us.jpg") no-repeat center center;
  background-size: cover;
  height: 260px;
  margin: 12px 0;
}