Alexander

Я бы не стал извращаться, а сделал фон картинкой, сжимайте картинки и грузиться они будут нормально, ну и ехать ниче не должно при ресайзе. Можно поиграться с background-position и background-size

А почему вы средней колонке не хотите задавать размер?
Если у вас левая колонка 120px, правая 240px, то средней можно задать width: calc(100% - 360px); и все будет нормально. И не надо в "резиновый" блок вставлять блоки с жестко заданной шириной, это по крайней мере не логично, ведь он должен сжиматься при ресайзе.

Добавьте display: block; для after.
P.S. пока писал уже ответили))

Потому, что .circle не является последним ребенком, после него еще есть .nav-menu__link. Вам нужно выбрать последний пункт меню, т.е. li и в нем уже выбрать .circle
.nav-menu .nav-menu__item:last-of-type .circle:before вот так сработает.

Код бы посмотреть... В моб версии это слайдер? или куда делись остальные логотипы? А так вообще inline-block`и подчиняются правилам выравнивания строчных элементов, т.е. text-align: center; будет работать. Точно сказать что нужно делать в конкретном случае не видя код нельзя.

Можно, нужно просто создать класс со своей анимацией, например:

@keyframes myAnimation {
    from {
      -webkit-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
    }

    to {
      visibility: hidden;
      -webkit-transform: translate3d(0, -100%, 0);
      transform: translate3d(0, -100%, 0);
    }
  }
 .myAnimation {
    -webkit-animation-name: slideOutUp;
    animation-name: slideOutUp;
  }