body {
    background-image: url(background/flowers-background5.jpg);
    background-attachment: fixed ;
    background-size:25%;
    display:grid;
    grid-template-columns: repeat(20%);
    grid-template-rows: repeat(10%); 
    margin:0px;
}

  .home{
  grid-area:1/1/2/2;
  height:150px;
  margin-top: 25px;
  margin-left:75px;
  margin-right:auto;
  margin-bottom:0px;
  margin-right: auto;
  padding:5px;
  z-index:1;
  }
    .home img{
      height:175px;
    }
  .garden{
  grid-area:1/5/2/6;
  height:150px;
  margin-top: 30px;
  margin-left:auto;
  margin-right:90px;
  margin-bottom:0px;
  padding:5px;
  z-index:1;
  }
  .garden img{
  height:165px;
    }

#header{ grid-area:1/1/2/6;
width: 100%;
height:100px;
margin-top: 60px;
opacity:95%;
background-color:white;
text-align:center;
font-family: "sour gummy", sans-serif;
color: #402c2b;
font-size: 75px;
  }

.box1{grid-area:2/2/3/5;
width:475px;
height:75px;
margin-top:-20px;
margin-left:auto;
margin-right:auto;
border-radius:150px;
outline-width: 5px;
outline-style: dashed;
outline-color:#402c2b;
padding:15px;
padding-bottom:30px;
background:white;
font-family: "DM Sans", sans-serif;
font-size:13px;
text-align: justify;}

h2{
  text-align: center;
  font-family: "dynapuff", sans-serif;
  font-size:35px;
  color:#402c2b;}
h3{
  text-align: center;
  font-family: "sour gummy", sans-serif;
  font-size:25px;
  color:#733d40}
#dec1
{grid-area:2/1/2/6;
margin-top:-165px;
margin-left:auto;
margin-right:auto;
margin-bottom:auto;
position: relative;
rotate: 90deg;
z-index:1;}
#dec1 img{
  height:250px;
  width:auto;
  position: relative;
  z-index:1;
}
#dec2
{grid-area:4/5/5/6;
margin-top:-25px;
margin-left:5px;
margin-right:auto;
margin-bottom:auto;
position: relative;
rotate:-20deg;
z-index:1;}
#dec2 img{
  height:175px;
  width:auto;
  position: relative;
  z-index:1;
}
#ut
{grid-area:3/2/3/5;
margin-top:-55px;
margin-left:auto;
margin-right:auto;
margin-bottom:-100px;
position: relative;
rotate: 0deg;
z-index:1;}
#ut img{
  height:225px;
  width:auto;
  position: relative;
  z-index:1;
}
#pot
{grid-area:2/1/3/2;
margin-top:50px;
margin-left:15px;
margin-right:auto;
margin-bottom:-100px;
position: relative;
z-index:1;}
#pot img{
  height:130px;
  width:auto;
  position: relative;
  z-index:1;
  rotate: 5deg;
}
#mix
{grid-area:2/5/3/6;
margin-top:25px;
margin-left:auto;
margin-right:40px;
margin-bottom:-100px;
position: relative;
rotate: 0deg;
z-index:1;}
#mix img{
  height:150px;
  width:auto;
  position: relative;
  z-index:1;
  rotate:-5deg;
}

#savoury 
{grid-area:2/1/3/2;
margin-top: 50px;
margin-left:160px;
margin-right:auto;
height:40px;
width:175px;
border-width:3px;
border-radius: 150px;
border-style: solid;
border-color:#ab3c20;
padding:10px;
padding-bottom:20px;
background:white;
z-index:0;}

#sweet {grid-area:2/5/3/6;
margin-top: 50px;
margin-left:auto;
margin-right:160px;
height:40px;
width:175px;
border-width:3px;
border-radius: 150px;
border-style: solid;
border-color:#036e2b;
padding:10px;
padding-bottom:20px;
background:white;
}
ul{
list-style-image:url(images/chefhat2.png);
list-style-type: circle;
}

.recipe1{grid-area:3/1/4/2;
margin-top:-15px;
margin-left:25px;
margin-right:auto;
height:425px;
width:235px;
outline-width:3.5px;
border-radius: 15px;
outline-style: dashed;
outline-color:#ab3c20;
padding:10px;
padding-bottom:20px;
background:white;
font-family: "caveat", sans-serif;
font-size:22px;
overflow: auto;
z-index:0;}
.recipe1 p{
  font-family:"handlee", sans-serif;}
.recipe2{grid-area:3/2/4/3;
margin-top:-15px;
margin-left:-60px;
margin-right:auto;
height:425px;
width:235px;
outline-width:3.5px;
border-radius: 15px;
outline-style: dashed;
outline-color:#ab3c20;
padding:10px;
padding-bottom:20px;
background:white;
font-family: "caveat", sans-serif;
font-size:22px;
overflow: auto;
z-index:0;}
#notes{
  font-family:"handlee", sans-serif;
  font-size:17px;}
.recipe5{grid-area:4/1/5/2;
margin-top:25px;
margin-left:25px;
margin-right:auto;
height:425px;
width:235px;
outline-width:3.5px;
border-radius: 15px;
outline-style: dashed;
outline-color:#ab3c20;
padding:10px;
padding-bottom:20px;
background:white;
font-family: "caveat", sans-serif;
font-size:22px;
overflow: auto;
z-index:0;}
.recipe6{grid-area:4/2/5/3;
margin-top:25px;
margin-left:-60px;
margin-right:auto;
height:425px;
width:235px;
outline-width:3.5px;
border-radius: 15px;
outline-style: dashed;
outline-color:#ab3c20;
padding:10px;
padding-bottom:20px;
background:white;
font-family: "caveat", sans-serif;
font-size:22px;
overflow: auto;
z-index:0;}
.recipe9{grid-area:5/1/6/2;
margin-top:25px;
margin-left: 20px;
margin-right:auto;
height:425px;
width:235px;
outline-width:3.5px;
border-radius: 15px;
outline-style: dashed;
outline-color:#ab3c20;
padding:10px;
padding-bottom:20px;
background:white;
font-family: "caveat", sans-serif;
font-size:22px;
overflow: auto;
z-index:0;}
.recipe10{grid-area:5/2/6/3;
margin-top:25px;
margin-left:-60px;
margin-right:auto;
height:425px;
width:235px;
outline-width:3.5px;
border-radius: 15px;
outline-style: dashed;
outline-color:#ab3c20;
padding:10px;
padding-bottom:20px;
background:white;
font-family: "caveat", sans-serif;
font-size:22px;
overflow: auto;
z-index:0;}
.recipe13{grid-area:6/1/7/2;
margin-top:25px;
margin-left: 20px;
margin-right:auto;
height:425px;
width:235px;
outline-width:3.5px;
border-radius: 15px;
outline-style: dashed;
outline-color:#ab3c20;
padding:10px;
padding-bottom:20px;
background:white;
font-family: "caveat", sans-serif;
font-size:22px;
overflow: auto;
z-index:0;}
.recipe17{grid-area:7/1/8/2;
margin-top:25px;
margin-left: 20px;
margin-right:auto;
height:425px;
width:235px;
outline-width:3.5px;
border-radius: 15px;
outline-style: dashed;
outline-color:#ab3c20;
padding:10px;
padding-bottom:20px;
background:white;
font-family: "caveat", sans-serif;
font-size:22px;
overflow: auto;
z-index:0;}
.recipe21{grid-area:8/1/9/2;
margin-top:25px;
margin-left: 20px;
margin-right:auto;
height:425px;
width:235px;
outline-width:3.5px;
border-radius: 15px;
outline-style: dashed;
outline-color:#ab3c20;
padding:10px;
padding-bottom:20px;
background:white;
font-family: "caveat", sans-serif;
font-size:22px;
overflow: auto;
z-index:0;}

.recipe3{grid-area:3/4/4/5;
margin-top:-15px;
margin-left:auto;
margin-right:-60px;
height:425px;
width:235px;
outline-width:3.5px;
border-radius: 15px;
outline-style: dashed;
outline-color:#036e2b;
padding:10px;
padding-bottom:20px;
background:white;
font-family: "caveat", sans-serif;
font-size:22px;
overflow: auto;
z-index:0;}
.recipe4{grid-area:3/5/5/6;
margin-top:-15px;
margin-left:auto;
margin-right:25px;
height:425px;
width:235px;
outline-width:3.5px;
border-radius: 15px;
outline-style: dashed;
outline-color:#036e2b;
padding:10px;
padding-bottom:20px;
background:white;
font-family: "caveat", sans-serif;
font-size:22px;
overflow: auto;
z-index:0;}
.recipe7{grid-area:4/4/5/5;
margin-top:25px;
margin-left:auto;
margin-right:-60px;
height:425px;
width:235px;
border-width:3px;
border-radius: 15px;
border-style: dashed;
border-color:#036e2b;
padding:10px;
padding-bottom:20px;
background:white;
font-family: "caveat", sans-serif;
font-size:22px;
overflow: auto;
z-index:0;}
.recipe8{grid-area:4/5/5/6;
margin-top:25px;
margin-left:auto;
margin-right:25px;
height:425px;
width:235px;
border-width:3px;
border-radius: 15px;
border-style: dashed;
border-color:#036e2b;
padding:10px;
padding-bottom:20px;
background:white;
font-family: "caveat", sans-serif;
font-size:22px;
overflow: auto;
z-index:0;}


.updates{
  grid-area:9/1/10/4;
  margin-top:30px;
  margin-left:auto;
  margin-right:0px;
  border-radius: 10px;
  background-color:white;
  width:600px;
  height:175px;
  padding-top:0px;
  padding-left:15px;
  padding-right: 15px;
  padding-bottom: 15px;;
  font-family: "DM Sans", sans-serif;
  text-align: left;
  font-weight:bold;
  font-size:13px;
  color:#402c2b;
  overflow:auto;
  z-index:0;}

.gromit{grid-area:9/4/10/6;
  margin-top:30px;
  margin-left:auto;
  margin-right:auto;
  z-index:0}
  .gromit img{
    border-radius: 10px;
    height:200px;
    width:auto;
  }

#footer{
  grid-area:10/1/11/6;
  width: 100%;
  margin-top: 40px;
  margin-left: auto;
  margin-right: auto; 
  padding-top: 20px;
  padding-bottom:10px;
  background:white;
  text-align:center;
  font-family: "DM Sans", sans-serif;
  font-size: x-small;
}