Why is the hover effect not responding when hovering over the parent element?

Question

Sass

<div class="srv_elem">
        <div class="srv_bg"></div>
        <div class="srv_info"></div>
</div>

.srv_elem
    width: 260px
    height: 420px
.srv_bg
    width: 260px
    height: 400px
.srv_info
    width: 260px
    height: 400px
    margin: -400px 0 0 0
.srv_elem .srv_info:hover
    margin: -400px 0 0 260px

When hovering over the srv_elem block, the srv_info block does not respond.
Am I screwed up with the sass syntax? Tell me how it's right.

Answer 1

.srv_elem:hover .srv_info
it's better like this

.srv_elem
    width: 260px
    height: 420px
        &:hover
             .srv_info
                 margin: -400px 0 0 260px
.srv_bg
    width: 260px
    height: 400px
.srv_info
    width: 260px
    height: 400px
    margin: -400px 0 0 0