让父div更改并在悬停时激活下拉列表

Question

几乎有我的菜单，但我悬停在上面的菜单激活我的下拉菜单不会改变颜色。需要匹配contact-tele以匹配激活时的下拉列表。

此外，有没有办法让下拉菜单“粘滞”，所以它会保持打开状态，直到点击下拉关闭按钮

<li class="contact-tele">
  <i class="icon icon-phone" aria-hidden="true"></i>
  <span class="contact-text">Call Us</span>
</li>

<div class="dropdown-content">
  <div id="btn-close">
    <img class="popuprd" src="https://s29.postimg.org/627q2j3nr/closewhite.png">
  </div>
  <span style="color:#FBF7E5; padding :1em 0 1em 1em;">London</span>
  <a href="tel:+440200000000">020 000 0000</a>
  <span style="color:#FBF7E5; padding :1em 0 1em 1em;">Manchester</span>
  <a href="tel:+441610000000">0161 000 0000</a>
</div>

这是JSFiddle：http://jsfiddle.net/24fxcp7y/