/* body {
	margin-left: 100px;
} */
.recipe-container-menu {
	display: grid;
	margin-top: -30px;
	grid-template-columns: 1fr 2fr;
}
.dusia-img {
	width: 172px;

}

.recipe-body-top {
	grid-column: 1/2;
	margin-top: 4rem;
	margin-left: 1rem;
	/* 	width: 172px;
		width: auto; */
}

/* .over-menu-recipe{
	font-family: "Atma", system-ui;
	font-weight: 600;
	font-style: normal;
	font-size: 4rem;
	font-style: italic;
	font-weight: normal;
	word-wrap: wrap;
	line-height: 4.2rem;
	display: flex;
	display: inline-flex;
	align-content: center;
	align-items: center;
	flex-shrink: 0;
	margin-top: 5.3rem;
	margin-left: 1rem;
	color: #793737;
} */

.recipe-grid-container {
	display: grid;
	gap: 20px;
	grid-template-columns: repeat(3, 1fr);
	/* grid-auto-rows:2fr ; */
	grid-template-areas:
		"image image hero-side"
		"title title ."
		"recipe recipe sidebar";
}

.hero-image {
	grid-area: image;
	/* background-color: #f0f0f0; */
	/* padding: 20px; */
	margin-top: 30px;
}

.hero-side {
	grid-area: hero-side;
	margin-top: 30px;
	background-color: #cee9ec;
display: flex;
flex-direction: column;
	justify-content: center;
		/* Center the content vertically */
		align-items: center;
	padding: 5px;
	/* border: 1px solid #ddd; */
}

/* .sidebar {
	grid-area: sidebar;
	background-color: #f0f0f0;
	padding: 20px;
	border: 1px solid #ddd;
} */




.title {
	grid-area: title;
	/* background-color: #f0f0f0; */
	padding: 20px;
	/* border: 1px solid #ddd; */
}

.recipe {
	grid-area: recipe;
	/* background-color: #f0f0f0; */
	padding: 20px;
	/* border: 1px solid #ddd; */
}

/* .sidebar {
	grid-area: sidebar;
	display: flex;
	justify-content: center;
	align-items: center;
} */

.sidebar {
	grid-area: sidebar;
	/* background-color: #f0f0f0; */
	padding: 20px;
	/* border: 1px solid #ddd; */
	display: flex;
	/* Use flexbox to center the content */
	flex-direction: column;
	/* Stack the content vertically */
	justify-content: center;
	/* Center the content vertically */
	align-items: center;
	/* Center the content horizontally */
}

.sidebar > .grid-container {
	display: grid;
	/* Enable grid layout for the container */
	grid-template-rows: repeat(2, 1fr);
	/* Create 3 rows with equal height */
	gap: 110px;

	/* Add some gap between the rows */
}

.grid-container > .grid-row1 {
	/* background-color: #ccc; */
	padding: 10px;
	/* border: 1px solid #aaa; */
	display: flex;
	/* Use flexbox to center the content within each row */
	justify-content: center;
	/* Center the content horizontally within each row */
	align-items: center;
	/* margin-bottom: -300px; */
	margin-top: -200px;
	/* Center the content vertically within each row */
}

.short-grid-container > .grid-row {
	padding: 10px;
	/* border: 1px solid #aaa; */
	display: flex;
	justify-content: center;
	align-items: center;

}

.short-grid-row{
	margin-top: 50px ;
}

/* MAYBE WE CAN PUT SOME COPY HERE LATER */
.over-menu-recipe {
	display: grid;
	grid-column: 3/5;
}
	/* 	font-family: "Atma", system-ui;
	font-weight: 200;
	font-size: 50px;
	font-style: italic;
margin-top: 3.5rem; */


/* * =============================
END OF TOp/* */

.image-container {
		display: grid;
		grid-template-columns: 2fr 1fr;
		gap: 10px;

}

.image-2fr {
		grid-column: 1/3;

}

.image-1fr {
		grid-column: 3/4;
}

/* .image-2fr, .image-1fr {
		width: 100%;
		height: auto;
		object-fit: cover;
} */
	/* 	/* word-wrap: wrap; */
	/* 	line-height:3;
	display: flex;
	display: inline-flex;
	align-content: center;
	align-items: center;
	flex-shrink: 0; */

	/* 	margin-top: 125px;
	margin-left: 50px; */



 /* .image-container {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 10px;

} */

/* .grid-item {
			display: flex;
				justify-content: center;
				align-items: center; */


/* .recipe-img {
display: grid;
width: 100%;

} */

/* .recipe-img {
 width: 75%;
 height: auto;
	margin: auto;
}

.sidebar1 {
	display: flex;
	justify-content: center;
	align-items: center;
	/* center horizontally */

/* .sidebar1 {
	width: 100%;
	height: auto;
	margin: auto;
	/* Optional: add some basic styling */









/* THE TITLE OF Recipe IS HERE
===================== */

.recipe-title-container {
	/* grid-area: title; */
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	grid-gap: 2.2rem;
	font-size: 1.5rem;
	line-height: 3.5rem;
	letter-spacing: 5px;
	font-weight: bold;
	text-align: center;
	/* margin-top: 20px; */
}


.better-large-title {
	grid-column: 1 / 3;

}

.better-large-title{
	/* font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif; */
	font-size: 1.875rem;
	text-align: center;
	line-height: 1;
	margin-top: -1.5625rem;
	/* margin-top: -30px; */
}

.better-smaller-title {
	/* font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif; */
	font-size: 20px;
	text-align: center;
	line-height: 1.2;
	/* margin-top: -30px; */
}


/* .empty {
	grid-column: 3/5;
background-color: #dd7d23;
	/* border-radius: ;
		border-color: blue; */




.recipe-container {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	grid-gap: 2.2rem;
}



.recipe-text {
	grid-column: 1 / 3;

}

.sidebar2 {
	grid-column: 3;
	/* background-color: #9cdd23; */

}


.sidebar2 {
	display: flex;
	flex-direction: column;
	gap: 2.2rem;
	justify-content: space-around;
	/* center horizontally */
}

.recipe-dropcap {
	float: left;
	font-size: 3rem;
	/* line-height: -4; */
	font-weight: bold;
	margin-right: 8px;
	margin-top: -2px;
	/* margin-bottom:-4px ; */
	margin-left: -.8rem;
	padding-left: 1rem;
	/* padding: -10px; */
	color: red;
	font-family: 'Noto Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
	/* text-shadow: gray 0.05em 0.05em; */
}

.indented-recipe-intro {
	text-indent: 1.25rem;
	font-size: 1.1rem;
	font-weight: normal;
	line-height: 1.5rem;
	text-align: left;
	margin-bottom: .6rem;
}




ol {
	list-style-type: none;
}

.recipe-text {
	font-size: 1.3rem;
	font-weight: normal;
	line-height: 1.6rem;
	text-align: left;
	margin-top: .5rem;
	margin-left: -.8rem;
	padding: 10px 1.3rem;
	font-weight: normal;
	line-height: 1.6rem;
	text-align: left;
	margin-top: -2.5rem;
	margin-left: -.8rem;
	padding: 10px
}

/* .preptime {
	margin-top: 1rem;

} */



.recipe-headings {
	font-family: 'Noto Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
	font-size: 1.5rem;
	line-height: 1.3rem;
	margin-top: 1rem;
	margin-bottom: .375rem;
}

/*  .padding-recipe
	 padding-left: 20px; */


.bullet-recipe {
	padding-left: 20px;
}

.bullet-recipe-none {
	list-style: none;
}

.spacer {
	visibility: hidden;
	margin: -.3rem;
}

.spacer-ad {
	visibility: hidden;
	margin-top: 100px;
}
/* .better-large-title

	font-size: 1.5rem;
	line-height: 3rem;
	font-weight: bold;
	text-align: center;
 */
/* margin-top: 1.3rem;
	margin-bottom: -2rem;
	padding-right:140px ;


		/* <!-- THE Recipe GRID IS HERE */
/* ============================= --> */





/* .item1 { */
/* width: 20px;  */
/* height: auto; */
/* adjust the width as needed */
/* background-color: blue; */
/* border: 3px solid black; */

/* margin-left: 100px; */
/* add some padding around each item */
/* text-align: center; */
/* center the text inside each item */


/* .item2 { */

/* adjust the width as needed */
/* background-color: blue; */
/* border: 3px solid black; */

/* add some padding around each item */
/* text-align: center; */
/* center the text inside each item */



/* border-radius: ;
		border-color: blue; */


/* <!-- THE Recipe TEXT IS HERE */
/* ============================= --> */



.note {
	font-family: 'Noto Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
	font-size: 1.5rem;
	line-height: 1.3rem;
	margin-top: 1rem;
	margin-bottom: -1rem;
	color: green;
}


.note-headings {
	font-family: 'Noto Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
	font-size: 1.5rem;
	line-height: 1.3rem;
	margin-top: 1rem;
	margin-bottom: -3px;

	color: green;
}

.note-text {
	grid-area: story;
	font-size: 1.3rem;
	font-style: italic;
	font-weight: normal;
	line-height: 1.6rem;
	text-align: left;
	margin-top: .5rem;

}


.bon-appetite {
	font-family: "Nothing You Could Do", cursive;
	font-weight: 400;
	font-size: 3rem;
	font-style: italic;
	font-weight: normal;
	text-align: center;

	margin-top: 2rem;
	/* display: flex;
	display: inline-flex;
	align-content: center;
	align-items: center; */

}