style.css

*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    list-style: none;
    color: #fff;
}
body{
    background-color: #111;
}
.side_bar{
    background-color: #fff;
    width: 15dvw;
    height: 50dvw;
    border-radius: 0 10px 10px 0;
    padding: 20px;
    display: flex;
    justify-content: space-between;
    transform: translateX(-80%);
    transition: all 0.3s ease-in-out;
}
.side_bar .hum_burger span{
    display: block;
    width: 20px;
    height: 3px;
    margin: 3px;
    background-color: #000;
    cursor: pointer;
}
.side_bar .content h3{
    color: #000;
    margin: 20px 0;

}
.hum_burger span:nth-child(1){
    transform: rotateX('120deg');
}