@charset "utf-8";
/* CSS Document */

/* // <weight>: Use a value from 200 to 800
// <uniquifier>: Use a unique and descriptive class name

.plus-jakarta-sans-<uniquifier> {
  font-family: "Plus Jakarta Sans", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}*/

/* .arvo-regular {
  font-family: "Arvo", serif;
  font-weight: 400;
  font-style: normal;
}

.arvo-bold {
  font-family: "Arvo", serif;
  font-weight: 700;
  font-style: normal;
}

.arvo-regular-italic {
  font-family: "Arvo", serif;
  font-weight: 400;
  font-style: italic;
}

.arvo-bold-italic {
  font-family: "Arvo", serif;
  font-weight: 700;
  font-style: italic;
} */

body {
	margin:0;
}

#splashead {
	background-color:#f3e9eb;
	padding-top:20px;
}

#splasheadcontent {
	background-color:#f3e9eb;
	height:515px;
	padding:20px;
	max-width:1200px;
	display:flex;
	margin:auto;
	flex-wrap:wrap;
}

#aroundnav {
	background-color:#f3e9eb;
}

#nav2 {
	background-color:#f3e9eb;
	padding:20px;
	display:flex;
	margin:auto;
	flex-wrap:wrap;
	justify-content:space-between;
	max-width:1200px;
}

.nav2content {
	background-color:#f3e9eb;
	margin-left:50px;
	margin-right:50px;	
	margin-top:8px;
}

.nav2content img{
	width:55%;
	height:auto;
	max-width:150px;
}

@media screen and (max-width: 800px) {
	#splashead {
		height:815px;
	}
}

.splashbox {
	width:45%;
	margin:12px;
		min-width:350px;
}

.splashbox img {
	max-width:100%;
	height:auto;
}



#biglogo{
	max-width:90%;
	height:auto;
}


h3 {
	  font-family: "Arvo", serif;
  font-weight: 400;
  font-style: normal;
}

.splashbox ul {
	color: #22476B;
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background-color: white;
	border-radius: 15px 15px 0px 0px;
}

.splashbox li {
	float:left;
}

.splashbox li a {
  display: block;
  color: #22476B;
  font-family: "Plus Jakarta Sans", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}

.splashbox li a:hover {
  background-color: #22476B;
	color:#F3E9EB;
}

.button {
  font-family: "Plus Jakarta Sans", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
	font-size:13px;
	border-radius: 9px;
	background: #FFF;
	padding:4px 16px 4px 16px;
	box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
	text-decoration:none;
	color:#22476B;
}

.blueboxcontent {
background-color:#22476b;

	padding:20px;
	margin:20px;
	max-width:1200px;
	margin:auto;
}

.bluebox {
background-color:#22476b;
	padding-top:20px;
	padding-bottom:40px;
}

.spotlight {
		display:flex;
	max-width:1200px;
	margin:auto;
	margin-top:40px;
	justify-content:space-around;
	flex-wrap:wrap;
}

.spotlightbox {
	margin:30px;
	padding-bottom:10px;
	max-width:250px;
}

.spotlightimg {
	max-width:250px;
	height:250px;
	padding-bottom:10px;
}

.spotlighttext a{
	text-decoration:none;
	padding:14px;
	display:block;
	max-width:250px;
	background-color:white;
	text-align:center;
	border-radius:12px;
	 font-family: "Plus Jakarta Sans", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
	color:#BC7845;
}


h2 {
	font-family: "Plus Jakarta Sans", sans-serif;
	font-weight:600;
  font-style: normal;
	font-size:34px;
}

footer {
	background-color:#F3E9EB;
	}

.footer {
	background-color:#F3E9EB;
	display:flex;
	padding:20px;
	padding-top:20px;
	flex-wrap:wrap;
	justify-content:center;
	gap:30px;
	max-width:1200px;
	margin:auto;
}

.footerbox {
	text-align:center;
	flex-wrap:wrap;
	min-height:150px;
	min-width:300px;
	padding:10px;
	padding-top:60px;
		  font-family: "Arvo", serif;
	  font-weight: 400;
  font-style: normal;
	color:#BC7845;
}

.footerbox ul 
{
	  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;

}

.footerbox li a {
	  display: block;
  color: #BC7845;
	  font-family: "Arvo", serif;
  font-weight: 400;
  font-style: normal;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}

.footerbox li a:hover {
	background-color:white;
	border-radius:12px;
}

.vl {
	  border-left: 3px solid white;
  height: 300px;
}

@media screen and (max-width: 750px) {
  .vl {
    display:none;
  }
}

hr.hr1 {
	border: 2px solid white;
	margin-top:60px;
}

@media screen and (min-width: 750px) {
  hr.hr1 {
    display:none;
  }
}



.nav2content ul {
	background-color:white;
	  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background-color: white;
	border-radius: 15px;
}

.nav2content li {
	float:left;
}

.nav2content li a {
	  display: block;
  color: #22476B;
  font-family: "Plus Jakarta Sans", sans-serif;
  font-optical-sizing: auto;
  font-weight: 500;
  text-align: center;
  padding: 14px 30px;
  text-decoration: none;
}

.nav2content li a:hover {
	  background-color: #22476B;
	color:#F3E9EB;
}

.textbox {
	background-color:white;
	max-width:1200px;
	margin:auto;
	padding:20px;
}

.blue {
	color:#22476B;
}

.orange {
	color:#BC7845;
}

.light {
	color:#F3E9EB;
}

.pink {
	color:#A63961;
}

.textbox p {
	max-width:900px;
		  font-family: "Arvo", serif;
  font-weight: 400;
  font-size:14px;
}





input[type=text], select, textarea {
  width: 100%;
  padding: 12px;
	  font-family: "Arvo", serif;
  font-weight: 400;
  font-style: normal;
  border: 1px solid white;
  border-radius: 4px;
  box-sizing: border-box;
  margin-top: 6px;
  margin-bottom: 16px;
  resize: vertical;
}

input[type=submit] {
	  font-family: "Arvo", serif;
  font-weight: 400;
  font-style: normal;
  background-color: #A63961;
  color: white;
  padding: 12px 20px;
  border: none;
  border-radius: 4px;
  cursor: pointer;
}

input[type=submit]:hover {
  background-color:#22476B ;
	color: #f3e9eb;
}

.container {
  border-radius: 5px;
  background-color: #F3E9EB;
  padding: 20px;
	  font-family: "Arvo", serif;
  font-weight: 400;
  font-style: normal;
}

.grocerylist {
	display:flex;
	justify-content:flex-start;
	gap:20px;
		flex-wrap:wrap;
}

.glgallery {	
	height:300px;
	padding:10px;
}

.glgallery img{
		max-width:150px;
	height:auto;
}

.recipe {
	max-width: 1200px;
	margin:auto;
	padding:20px;
}

.recipe h3 {
	color:#22476B;
}

.recipe h4 {
	color:#BC7845;
	  font-family: "Plus Jakarta Sans", sans-serif;
  font-optical-sizing: auto;
  font-weight: 300;
}

.recipetitle {
	color:#22476B;
	font-family: "Arvo", serif;
  font-weight: 500;
  font-style: normal;
	font-size:1.5rem;
}

.recipe ul{
	max-width:700px;
	
}

       .recipe ol {
            list-style: none;
            counter-reset: num;
        }

       .recipe ol li {
            counter-increment: num;
        }

      .recipe  ol li::before {
            content: counter(num) ". ";
		  font-weight:500;
		  padding-right:2px;
        }

.recipe li{
		  font-family: "Plus Jakarta Sans", sans-serif;
  font-optical-sizing: auto;
  font-weight: 300;
	font-size:15px;
	line-height:24px;
}

.recipebox {
	padding:10px;
	border: solid 4px #F3E9EB;
	border-radius:14px;
	padding-bottom:40px;
}

.recipe p {
			  font-family: "Plus Jakarta Sans", sans-serif;
  font-optical-sizing: auto;
  font-weight: 300;
	font-size:14px;
}

.recipebox img {
	max-width:300px;
	height:auto;
	float:right;
	padding:10px;
}

@media (max-width: 600px) {
  .recipebox img {
    float:none;
  }
}