Ajude-me no CSS, Bípedes!

Front-end
#1

Tenho esse :hover aqui…

.novidades{ background-color: #F5dcdc; background-color: #f5dcdc; background: linear-gradient(#f5dcdc, #bebef4); position: relative; bottom: 0; } .novidades:hover{ bottom: 20px; transition: bottom 0.4s ease; }

como eu faço pro block .novidades voltar em animação ease pro mesmo lugar, ao invés de ser “teletransportado” pro lugar original ?

#2

Boa noite, amigo.
Com “teletransportado pro lugar original” você quis dizer fazer transição de volta pro estado original? Se for isso, basta repetir o código da transição na classe que não possui a pseudo-classe “:hover”.

.novidades{
background-color: #F5dcdc;
background-color: #f5dcdc;
background: linear-gradient(#f5dcdc, #bebef4);
position: relative;
bottom: 0;
transition: bottom 0.4s ease;
}
.novidades:hover{
bottom: 20px;
transition: bottom 0.4s ease;
}

Você pode alterar o efeito pra ser o inverso (top), ou o que preferir.
Abraço.