*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
body{
    margin: 2rem;
    background: linear-gradient(#506266,#818274 );
}

h1{
    text-align: center;
    font-family: "Fugaz One", sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 72px;
    text-shadow: 0px 0px 10px #BDE038;
    text-decoration: underline ;
}
a{
    text-decoration: none;
    color: inherit;
}
h2{
    text-align: center;
    font-family: "Work Sans", sans-serif;
    font-size: 36px;
    font-weight: bold;
    font-style: normal;
    text-shadow: 0px 0px 10px #BDE038;
}
h3{
font-family: "Fugaz One", sans-serif;
font-weight: 100;
font-size: 22px;
text-decoration: underline 3px;
text-shadow: 0px 0px 10px white;

}
h4{
    font-family: "Work Sans", sans-serif;
  font-optical-sizing: auto;
  font-weight: 700;
  font-style: italic;
  text-align: right;
}
p{
font-family: "Work Sans", sans-serif;
  font-optical-sizing: auto;
  font-weight: bold;
  font-style: normal;
  
}
/* Grid */
.parent {
display: grid;
grid-template-columns: repeat(5, 1fr);
grid-template-rows: repeat(5, atuo);
grid-column-gap: 0px;
grid-row-gap: 0px
}
/* title */
.div1 { grid-area: 1 / 1 / 2 / 6;
     border-bottom: solid #BDE038;
    padding-bottom: 20px;
}
/* Apps */
.div2 { grid-area: 2 / 1 / 3 / 5;
    gap: 30px;
    display: grid;
    grid-template-columns: repeat(3, auto);
    grid-template-rows: repeat(2, auto);
    border-bottom: solid #BDE038;
    margin:  0px 50px 50px 50px;
    padding: 20px 50px 50px 50px;
 }   
        .div2 h2{
            text-align: center; 
            grid-area: 1 / 1 / 2 / 4;
            margin-top: 15px;}
/* Mains */
.div4 { grid-area: 3 / 2 / 4 / 5;
   display: grid;
    grid-template-columns: repeat(3, auto);
    grid-template-rows: repeat(2, auto);
    margin: 0px 50px 50px 50px;
    gap: 20px;
     }   
        .div4 h2{
            text-align: center; 
            grid-area: 1 / 1 / 2 / 4;
            }

/* deserts */
.div5 { grid-area: 4 / 1 / 5 / 5;
    gap: 30px;
    display: grid;
    grid-template-columns: repeat(3, auto);
    grid-template-rows: repeat(2, auto);
    border-top: solid #BDE038;
    margin: 50px;
    padding: 20px;}   
        .div5 h2{
            text-align: center; 
            grid-area: 1 / 1 / 2 / 4;
           }
       
 /* Drinks */
.div6 { grid-area: 2 / 5 / 5 / 6; 
text-align: center;
border-left: solid #BDE038;
padding: 20px;
} 
    .div6 p{
        margin: 25px;
    }

/* Featured */
.div3 { grid-area: 3 / 1 / 4 / 2;
  
display: flex;
flex-direction: column;
align-items: center;
padding: 20px;
gap: 10px;
border-radius: 50px;
box-shadow: 0px 0px 10px #BDE038;
}
/* Menu Item */
.item {
  width: 260px;
  border-radius: 16px;
  overflow: hidden;        
  background: #A3AB78;
  display: flex;
  flex-direction: column;  
}

.item img {
  width: 100%;             
  height: 160px;           
  object-fit: cover;       
  display: block;          
}

.item-body {
  padding: 14px 16px 16px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.pos1{
    grid-area: 2 / 1 / 3 / 2;
}
.pos2{
    grid-area: 2 / 2 / 3 / 3;
}
.pos4{
    grid-area: 2 / 3 / 3 / 4;
}
@media (max-width: 1550px){
    .parent{
        display: flex;
        flex-direction: column;
    }
    .div6{
       order: 6;
       border: none;
       gap: 20px;
    }
    .div3{
        order: 3;
        gap: 20px;
    }
    .div1{
        order: 1;
        gap: 20px;
    }
    .div2{
        order:2;
        gap: 20px;
    }
    .div4{
        order: 4;
        gap: 20px;
        border-top: solid #BDE038;
        margin: 20px;
        padding: 20px;
    }
    .div5{
        order: 5;
        gap: 20px;
    }
    .parent div{
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }

}
@media (max-width: 1550px){
    .div6{
        content: hidden;
    }
}

/* .fugaz-one-regular {
  font-family: "Fugaz One", sans-serif;
  font-weight: 400;
  font-style: normal;
}
  
.work-sans-<uniquifier> {
  font-family: "Work Sans", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}
 */