'Hover over class and modify another class

I have a grid layout which inside is a sidebar with (64px) width, the grid :

.container {
  display: grid;
  height: 100vh;
  width: 100vw;
  grid-template-areas:
    "sidebar header"
    "sidebar content"
    "footer footer";
  grid-template-columns: 64px auto;
  grid-template-rows: 5% 92% auto;
  background-color: #efeff1;
}

how can i go about having that change to (160px) when i hover over the class sidebar,

.sidebar:

.sidebar {
  grid-area: sidebar;
  display: flex;
  flex-direction: column;
  align-items: center;
  background-color: #1f2937;
  color: rgba(156, 163, 175);
  border-radius: 0.2rem 0.2rem 0 0;
}


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source