#przyklad1{
    align-items: center;
    justify-content: center;
    display: flex;
    background-color: rgb(255, 130, 130);
}
#przyklad1 > p{
    margin:50px;
    background-color: rgb(130, 130, 255);
    transition: all 1s;
}
#playground > p:nth-child(3){
    color:red;
}
#playground > p:nth-child(4){
    color: blue;
}
#przyklad1 > p:hover{
    padding:50px;
    margin:0px;
    transition: all 1s;
}
#wrap{
    width:100%;
    justify-content: left;
}
#przyklad2{
    width: 20%;
    border: 1px solid black;
    margin: 5px 0 5px 0;
}
p{
    text-align: center;
}
/*
tu pod tym czarna magia, szczerze nie wiem czemu tylko tak dziala ale działa,
#przykład2:hover nie działało, i transition nie działa, więc załadnie nie jest, ale jest.
*/
#wrap:hover  div{
    margin: 5px auto  ;
}