.menu__buttons {
  display: flex;
  width: 100%;
}
.menu {
  display: flex;
  width: calc(1130 / 720 * 100vh);
  height: calc(56 / 720 * 100vh);
}

.menu__button {
  background: none;
  text-decoration: none;
  color: #0169e2;
  border: calc(3 / 720 * 100vh) solid #0169e2;
  font-size: calc(20 / 720 * 100vh);
  font-weight: 600;
  width: 100%;
  height: 100%;
  padding: 0;
  cursor: pointer;
  border-radius: calc(20 / 720 * 100vh);
  outline: none;
  margin-right: calc(20 / 720 * 100vh);
  transition: all 0.2s ease-in-out;
}
.menu__button_active {
  background-color: #d8e9fc;
  font-weight: 700;
}

.menu__button:hover {
  background-color: #d8e9fc;
  font-weight: 700;
}

@supports (-webkit-touch-callout: none) {
  .menu__button {
    font-weight: 400;
  }
  .menu__button_active {
    font-weight: 500;
  }

  .menu__button:hover {
    font-weight: 500;
  }
}

.menu__arrow {
  min-width: calc(56 / 720 * 100vh);
  max-width: calc(56 / 720 * 100vh);
  padding: 0;
  background-color: transparent;
  height: 100%;
  cursor: pointer;
  border: calc(3 / 720 * 100vh) solid #0169e2;
  border-radius: calc(20 / 720 * 100vh);
}

.menu__arrow-path {
  stroke: #0169e2;
  stroke-width: 0;
  transition: all 0.2s ease-in-out;
}

.menu__home {
  min-width: calc(56 / 720 * 100vh);
  max-width: calc(56 / 720 * 100vh);
  background-color: transparent;
  padding: 0;
  height: 100%;
  padding-left: calc(7 / 720 * 100vh);
  margin-right: calc(15 / 720 * 100vh);
  cursor: pointer;
  border: calc(3 / 720 * 100vh) solid #0169e2;
  border-radius: calc(20 / 720 * 100vh);
}

.menu__home-path {
  transition: all 0.2s ease-in-out;
}

.menu__home:hover .menu__home-path {
  stroke-width: 3;
  transform: scale(1, 1.05);
}

.menu__home:hover {
  background-color: #d8e9fc;
}

.menu__arrow:hover {
  background-color: #d8e9fc;
}

.menu__arrow:hover .menu__arrow-path {
  stroke-width: 0.5;
  transform: scale(1.05);
}

.menu__arrow-right {
  margin-left: calc(20 / 720 * 100vh);
}

.menu__arrow-left {
  padding-left: calc(2 / 720 * 100vh);
  padding-top: calc(2 / 720 * 100vh);
}

.menu__layer {
  left: calc(75 / 720 * 100vh);
  top: calc(625 / 720 * 100vh);
}

.menu_padding .menu__button,
.menu__home,
.menu__arrow-left {
  margin-right: calc(20 / 720 * 100vh);
}

.menu_padding .menu__arrow-right {
  margin-left: calc(20 / 720 * 100vh);
}

.menu__arrow-right {
  padding-left: calc(2 / 720 * 100vh);
}

.menu__arrow-left {
  padding-left: calc(4 / 720 * 100vh);
}

.menu__button:last-child {
  margin-right: 0;
}

.menu__svg-arrow {
  width: calc(31 / 720 * 100vh);
  height: calc(26 / 720 * 100vh);
}

.menu__svg-home {
  width: calc(40 / 720 * 100vh);
  height: calc(28 / 720 * 100vh);
}