Почему не видно background?

<div class="portfolio">
        
    <div class="work1"></div>
    <div class="work2"><img src="../htmlcss/images/work1.png"></div>
    <div class="work3"><img src="../htmlcss/images/work1.png"></div>
    <div class="work4"><img src="../htmlcss/images/work1.png"></div>
    <div class="work5"><img src="../htmlcss/images/work1.png"></div>
</div>

.work1 {
    background-image: url(../images/work1.png);
    background-repeat: no-repeat;
    position: absolute;
    left: 0px;
}


.work1:hover {
    background-image: url(../images/work1hover.png);
    position: absolute;
    left: 0px;
}


.work2 {
    position: absolute;
    left: 205px;
}

.work3 {
    position: absolute;
    left: 410px;
}

.work4 {
    position: absolute;
    top: 160px;
    left: 103px;
}

.work5 {
    position: absolute;
    top: 160px;
    left: 308px;
}