.burger{cursor:pointer;display:flex;flex-direction:column;justify-content:space-between;position:relative}.burger span{background:#000;background-color:currentColor;position:relative;transform-origin:center;transition:.3s ease;width:100%}.burger--step-1 span:nth-child(2),.burger--step-2 span:nth-child(2){opacity:0}@media (max-width:767.98px){.burger{height:15px;width:16px}.burger span{height:1px}.burger--step-1 span:first-child{transform:translateY(6px)}.burger--step-1 span:nth-child(3){transform:translateY(-6px)}.burger--step-2 span:first-child{transform:translateY(7px) rotate(45deg)}.burger--step-2 span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}}@media (min-width:768px){.burger{height:24px;width:30px}.burger span{border-radius:2px;height:2px}.burger--step-1 span:first-child{transform:translateY(11px)}.burger--step-1 span:nth-child(3){transform:translateY(-11px)}.burger--step-2 span:first-child{transform:translateY(11px) rotate(45deg)}.burger--step-2 span:nth-child(3){transform:translateY(-11px) rotate(-45deg)}}