.container-hamMenu{
/* 
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
 */    
    height: 40px; /* aquí */
    width: 40px; /* aquí */
    border-radius: 0;
    background-color: var(--hamMenu-background-color);
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.15);
    display: flex;
    justify-content: center;
    align-items: center;
    transition: all 0.4s linear;
    overflow: hidden;
}

.container-hamMenu.active{
    background-color: #34bf49;
}

.container-hamMenu .menu{
    position: relative;
    height: 100%;
    width: 22px; /* aquí */
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    cursor: pointer;
}

.menu .line{
    position: absolute;
    height: 2px; /* aquí */
    width: 100%;
    border-radius: 0;
    background-color: #FFF;
    transition: all 0.4s linear;
}

.menu .line.u{
    top: 10px; /* aquí */
}

.container-hamMenu.active .line.u{
    top: 50%;
    transform: translateY(-50%) rotate(45deg);
    background-color: #FFF;
}

.menu .line.d{
    left: 0;
    opacity: 1;
}

.container-hamMenu.active .line.d{
    left: -100%;
    opacity: 0;
    background-color: #34bf49;
}

.menu .line.t{
    bottom: 10px; /* aquí */
}

.container-hamMenu.active .line.t{
    bottom: 50%;
    transform: translateY(50%) rotate(-45deg);
    background-color: #FFF;
}