Изменение цвета шрифта блока меню при hover

[Алеся]

Подскажите, пожалуйста, что прописать в коде для изменения цвета шрифта меню при наведении на БЛОК (не на ссылку) с черного на белый при hover. На скрине цвет меняется при наведении на ссылку. И как можно меню отодвинуть влево? Заранее спасибо!  

<div class="three navigation items">

      <nav>

<ul>

  <li>

<div class="navigation__item"></div>

<a href="#">Hot themes</a>

  </li>

  <li>

<div class="navigation__item"></div>

<a href="#">EURO-2016 Playoffs</a>

  </li>

  <li>

    <div class="navigation__item"></div>

    <a href="#">El'Classico</a>

  </li>

</ul>

      </nav>

    </div>

 

.navigation {

    background-color: rgba(31, 30, 30, 0.438);

    width: 900px;

    height: 30px;  

}

.navigation li {

    display: inline-block;

    padding: 5px 15px;

&:hover {

    content: "";

    background-color: rgb(36, 36, 36);

    cursor: pointer;

}

}

a {

    color: black;

    text-decoration: none;

    font-family: sans-serif;

&:hover {

  content: "";

  color: white;

 }

}

[npofopr]

Делаете hover на блок, потом добираетесь до ссылки. 

.block:hover a {стили}