/* Fill CSS here */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
body {
  background-color: rgb(248, 246, 246);
}

table,
td,
th {
  border: 1px solid #ddd;
  text-align: left;
}

table {
  border-collapse: collapse;
  width: 70%;
  margin: auto;
  margin-top: 50px;
}

th,
td {
  padding: 15px;
  text-align: center;
}

tr > th {
  background-color: #1d2939;
  color: white;
  border-radius: 10px;
 

}

        .flex_img{
            display: flex;
            justify-content: space-around;
            align-items: center;
        }
        tbody>tr>td>img{
            width:12%;
            
        }

tr > td:last-child>p{
  margin: 10px 10px;
  color:white;
  cursor : pointer;
  border: 1px solid red;
  border-radius: 50px;
  background-color: red;
}
tr > td>div{
    display: flex;
    justify-content: space-around;
}

#total{
    width: 70%;
    margin: 50px auto;
    padding: 10px;
    background-color: #1d2939;
    color: azure;
    display: flex;
    justify-content: space-around;
    align-items: center;
    border-radius: 10px;
}

#total > p{
    padding: 10px 20px;
    font-size: 20px;
}
#total > button{
    background-color: rgb(222, 245, 14);
    border: none;
    padding: 20px 20px;
    font-weight: 600;
    cursor: pointer;

}

#total > div >button{
    background-color: rgb(245, 14, 14);
    border: none;
    padding: 10px 20px;
    font-weight: 600;
    cursor: pointer; 
    color: white;   
  border-radius: 10px;
  
}

#total > div >input{
    border: none;
    padding: 5px 5px;
    font-weight: 600;
    cursor: pointer;    
}