.fws-menu {
  position: fixed;

  &.menu-left {
    bottom: 0;
    left: 0;
    top: 0;
    transform: translateX(-100%);

    .fws-menu-close {
      left: 3px;
    }

    &.fws-menu-active {
      transform: translateX(0);
    }

    .sub-menu {

      &.move-out {
        > li > a {
          transform: translateX(-100%);
        }
      }

      &.menu-hidden {
        opacity: 0;
        transform: translateX(-100%);
      }

      .back-block {
        right: -50px;
      }

      @media (min-width: $break-lg) {
        right: 50px;
      }
    }

    @media (min-width: $break-lg) {
      .move-out {
        transform: translateX(50px);
      }
    }
  }

  &.menu-right {
    bottom: 0;
    right: 0;
    top: 0;
    transform: translateX(100%);

    .fws-menu-close {
      right: 3px;
    }

    &.fws-menu-active {
      transform: translateX(0);
    }

    .sub-menu {

      &.move-out {
        > li > a {
          transform: translateX(100%);
        }
      }

      &.menu-hidden {
        opacity: 0;
        transform: translateX(100%);
      }

      .back-block {
        left: -50px;
      }

      @media (min-width: $break-lg) {
        left: 50px;
      }
    }

    @media (min-width: $break-lg) {
      .move-out {
        transform: translateX(-50px);
      }
    }
  }
}