用html和css点击按钮更改div背景

Question

当鼠标悬停在按钮上时，我想更改div的css样式。这是我的HTML代码：

  <div class="container">
<button aria-hidden="false"><span aria-hidden="false" style="color:#b8860b">&#9733</span> CLICK ME! <span aria-hidden="false" style="color:#b8860b">&#9733</span></button> 
  </div>

注意在第二张图片中，当用户将鼠标悬停在按钮上时，div具有边框样式。当用户将鼠标悬停在按钮上时，如何让div改变它的样式？

这是我的css文件：

.container {
    margin-left: auto;
    margin-right: auto;
    width: 160px;
    background-color: #79CEEB;
    border-radius: 10px;
    height: 50px;
}

.container:hover {
    margin-left: auto;
    margin-right: auto;
    width: 160px;
    background-color: #79CEEB;
    border-radius: 10px;
    height: 50px;
    border-style: inset;
}


button {
    font-size: 18px;
    font-color: #444;
    border: 1px;
    border-color: #777;
    margin-top: 10px;
    margin-left: 10px;
    background: linear-gradient(#ffffff, #abbaab);
}

button:hover {
    font-size: 18px;
    font-color: #444;
    border: 1px;
    border-color: #777;
    margin-top: 10px;
    margin-left: 10px;
    background: linear-gradient(#ffffff, #8D998D);
}

我只需要在css和html

中完成此操作