* {
      margin: 0;
      padding: 0;
      box-sizing: border-box;
    }
body{
		font-family: 'Nunito Sans', sans-serif;
		background-color: #F5E8D3;
}
h1{
    font-family: 'Tangerine', sans-serif;
    font-size: 300%;
		text-shadow: 4px 4px 4px #aaa;
		text-align:center;
		color:#8F6449;
} 
a{
   color:#F5E8D3;
	 font-weight:bold;
}
nav {
   background-color: #7A9D91;
   color:#F5E8D3;
   padding: 1rem;
	 position: relative;
   z-index: 10;
}
ul {
  list-style: disc;
  padding-left: 1.5rem;
}
/* Hide mobile call link on desktops */
.mobile-phone {
  display: none;
}
/* Hide desktop text on phones */
.desktop-phone {
  display: inline;
}
/* hide email link on desktops */
.mobile-email {
    display: none;
}
/* hide desktop text on phones */
  .desktop-email {
    display: inline;
}
.nav-container {
   display: flex;
   justify-content: space-between;
   align-items: center;
 }
.logo {
   font-size: 1.5rem;
   font-weight: bold;
}
.menu {
   display: flex;
   list-style: none;
   gap: 1rem;
}
.menu li a {
   color: #F5E8D3;
   text-decoration: none;
   padding: 0.5rem 1rem;
   display: block;
}
.menu li a:hover {
   background-color: #7A9D91;
   border-radius: 5px;
}
.hamburger {
   display: none;
   flex-direction: column;
   gap: 4px;
   cursor: pointer;
}
.hamburger span {
   width: 25px;
   height: 3px;
   background-color: #F5E8D3;
}
.blue-background{
   background-color:#293040;
	 color:#F5E8D3;
	 font-weight:bold;
}
.brown-background{
   background-color:#8F6449;
	 color:#F5E8D3;
	 font-weight:bold;
}
.responsive-img {
  max-width: 100%;
  height: auto;
  display: block;
}
@media (max-width: 768px) {
    .menu {
      position: absolute;
      top: 60px;
      left: 0;
      right: 0;
      background-color: #7A9D91;
      flex-direction: column;
      display: none;
   }
   .menu.show {
      display: flex;
   }
   .hamburger {
      display: flex;
   }
	 .mobile-email,
	 .mobile-phone {
      display: inline;
   }
   .desktop-email,
	 .desktop-phone {
      display: none;
   }
}