.recipe{
    box-sizing: border-box;
    width: 100%;
    height: 68px;
    padding: 10px;
    margin-bottom: 10px;
    background-color:var(--slg-gray);
    border: 1px solid var(--slg-teal);
    border-left: 10px solid var(--slg-gray);
    border-right: 10px solid var(--slg-gray);
    position:relative;
    display:flex;
    align-items:center;
    font-size: 22px;
    font-weight: 300;
    transition: border 0.5s, background-color 0.5s;
}
.recipe:hover{
    background-color:var(--slg-teal);
    cursor:pointer;
    border-left: 1px solid var(--slg-teal);
    border-right: 1px solid var(--slg-teal);
}
.recipe > span{
    padding-left: 0.5em;
}
.recipe > .delete_button{
    right: 10px;
}
.recipe > .delete_button.edit{
    right: 57px;
}