Nesting a Selector - Error

[vipers-web-design]

Simply I've tried to convert a :hover change from:
.nav-pills li a:hover {
background-color: #f546e2;
}

to:
.nav-pills {
li {
a {
&:hover {
background-color: #f546e2;
}
}
}
}

But instead, I got:
.nav-pills {
li {
a:hover {
background-color: #f546e2;
}
}
}

PS - Sorry, new to GitHub. I don't know how to style.