
.update{
    display: flex;
    gap: 4%;
 width:90%;
    margin: auto; 
  
display: flex;
}

*{
    color: black;
}
.update>div{
height:80%;
width:30%;
display: flex;
flex-direction: column;
padding: 2%;
margin: auto;
border-radius: 10px;
box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
gap: 20px
}
.update>div:nth-child(2)>form input{
 padding-left: 25px;
margin-left: 25px;
}
form input{
height:30px;
border-radius: 5px;
margin-top:15px;
width:80%;
background-color: rgb(255, 255, 255);
border: 1px solid #ff6f61;

}
.hadd{
 font-family: sans-serif;
 font-size: 17px;
padding-left: 36px;

}
.hea{
 color: black;
text-align: center;
 
}
#add{
 height: 30px;
 background-color: #ff6f61;
 color: white;
margin-bottom: 60px;
margin-top: 20px;
}
#delete{
 height: 30px;
 background-color: #ff6f61;
 color: white;
 margin-bottom: 70px;
 margin-left: 36px;
 margin-top: 20px;
}

.main{
 display: grid;
 grid-template-columns: repeat(5,1fr);
 grid-template-rows: repeat(auto,1fr);
 width: 90%;
 margin: auto;
 gap:4%;
 margin-top :50px;


}
.main>div{
box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 2px 6px 2px;
padding: 4%;
border-radius: 10px;
}
.main>div>div{
    height: 155px;
    width: 135px;
margin-top: 15px;
text-align: center;
margin: auto;
}
.main>div>div>img{
height: 90%;
width: 90%;

}
.main>div>h3{
color:#122121;
font-size: 14px;
font-family: Arial, Helvetica, sans-serif;
}
.main>div>p{
 color:#757575;
font-size: 12px;
font-family: Arial, Helvetica, sans-serif;
}
#mh{
 color: #ff6f61;
padding-bottom: 50px;

text-align: center;
}
.mdlt{
 height: 20px;
 width: 70px;
 background-color: #ff6f61;
 border: 0px;
margin-bottom:15px ;
font-size: 12px;
font-family: Arial, Helvetica, sans-serif;
border-radius: 7px;
border: 2px solid  #ff6f61;
color: white;
}
/*-nav-*/
#navBar{
    display: flex;
    /* border: 2px solid blue; */
    justify-content: space-around;
    margin: 0%;
    padding: 0%;
    height: 70px;
    margin-bottom: 30px;
    box-shadow: rgba(33, 35, 38, 0.1) 0px 10px 10px -10px;
}
#left_section{
    display: flex;
    height: 50%;
   
    width: 40%;
    justify-content: space-between;
    /* margin-top: 5px; */
    padding-top: 8px;
}

#left_section>div h3:hover{
    color: #ff6f61;
    cursor: pointer;
}
#left_section>div>a{
   text-decoration: none;
}
#right_section{
    display: flex;
    font-size: medium;
    height: 20%;

    margin-top: 27px;
    width: 35%;
    justify-content: space-around;
}

#right_section .right:nth-child(3){

  /* margin-top: auto; */
  margin-top: -6px;
}
.image{
    height: 35px;
    width:130px;
    /* background-color: #ff6f61; */
    color: #f7fafa;
    text-align: center;
    margin-top: 10px;
    padding-bottom:13px;
    border-radius: 5px;
}
.image>p{
    font-size: 16px;
    font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
}