// SPDX-License-Identifier: MIT
// Copyright (c) 2022 sup39

.menu-toggle
  width: 20px
  height: 20px
  display: block
  cursor: pointer
.menu-toggle:before
  top: 30%
.menu-toggle:after
  top: 70%

.menu-toggle:before,
.menu-toggle:after
  position: absolute
  content: ""
  width: 100%
  height: 2px
  transform: translate(0, -50%)
  background: var(--fg)
  transition: all .25s ease-out

.open
  .menu-toggle:before
    transform: translate(0, -50%) rotate(135deg)
  .menu-toggle:after
    transform: translate(0, -50%) rotate(-135deg)
  .menu-toggle:before,
  .menu-toggle:after
    top: 50%
    left: -10%
    width: 120%

@media only screen and (min-width: 768px)
  .menu-toggle
    display: none