.burger-icon{--icon-size:26px;--width-bar:18px;--thickness-bar:1px;--bar-color-active:var(--color-green);width:var(--icon-size,16px);height:var(--icon-size,16px);position:relative}.burger-icon .bar{padding:0;width:var(--width-bar,14px);height:var(--thickness-bar,1px);background-color:var(--bar-color,currentColor);display:block;transition:all .3s var(--ease-in_out_back);position:absolute}.burger-icon .bar.bar1{top:var(--top-bar-1,25%);left:var(--left-bar-1,50%);opacity:var(--opacity-bar-1,1);transform:var(--transform-bar-1,translate(-50%,0) rotate(0deg))}.burger-icon .bar.bar2{width:var(--width-bar-2,var(--width-bar));top:var(--top-bar-2,50%);left:var(--left-bar-2,50%);opacity:var(--opacity-bar-2,1);transform:var(--transform-bar-2,translate(-50%,-50%) rotate(0deg))}.burger-icon .bar.bar3{bottom:var(--bottom-bar-3,25%);left:var(--left-bar-3,50%);opacity:var(--opacity-bar-3,1);transform:var(--transform-bar-3,translate(-50%,0) rotate(0deg))}.burger-icon .bar.bar4,.burger-icon .bar.bar5{transition:all .4s ease-in-out,transform .4s ease-in-out .4s}.burger-icon .bar.bar4{top:var(--top-bar-4,50%);left:var(--left-bar-4,50%);width:var(--width-bar-4,0);opacity:var(--opacity-bar-4,0);transform:var(--transform-bar-4,translate(-50%,-50%) rotate(90deg))}.burger-icon .bar.bar5{top:var(--top-bar-5,50%);left:var(--left-bar-5,50%);width:var(--width-bar-5,0);opacity:var(--opacity-bar-5,0);transform:var(--transform-bar-5,translate(-50%,-50%) rotate(0deg))}.burger-icon.open{--bar-color:var(--bar-color-active,var(--bar-color,currentColor));--opacity-bar-1:0;--top-bar-1:50%;--transform-bar-1:translate(-50%,-50%) rotate(0deg);--opacity-bar-2:0;--width-bar-2:0px;--opacity-bar-3:0;--bottom-bar-3:50%;--transform-bar-3:translate(-50%,50%) rotate(0deg);--opacity-bar-4:1;--width-bar-4:var(--width-bar);--transform-bar-4:translate(-50%,-50%) rotate(45deg) scaleX(1);--opacity-bar-5:1;--width-bar-5:var(--width-bar);--transform-bar-5:translate(-50%,-50%) rotate(-45deg) scaleX(1)}