movie2.css

*{
    margin: 0;padding: 0;box-sizing: border-box;
    text-decoration: none;
    list-style: none;

}
body{
    height: 100vh;
    font-family: Arial, Helvetica, sans-serif;
    background: var(--bg--color);

}
:root{
  --main--color: red ;
  --bg--color: black ;
}
header{
display: flex;
justify-content: space-between;
align-items: center;
padding: 20px 60px;
color: aliceblue;
background: black;
}
header ul {
    display: flex;
    
}
header ul li{
    padding: 0 50px;
    position: relative;
} 
header a{
    color: aliceblue;
    font-size: 20px;
}
.menu a::after{
    content: '';
    background: red;
    position: absolute;
    width: 0;
    height: 2px;
    bottom: -4px;
    left:   32%;
    transition: 0.5s all linear;

}
.menu a:hover::after , .menu  .home-active::after {
    width: 40%;
    
}