Черный background в android google chrome, как решить?

Верстаю шаблон, столкнулся вот с такой проблемой. Проблема появилась после того, как прикрутил к сайту навигацию codyhouse.co/gem/full-screen-pushing-navigation
Весь контент обворачивается тегом main и присваиваются такие свойства:
Если не обворачивать контент в main то, соответственно проблема исчезает.

main {
  height: 100%;
  position: relative;
  z-index: 2;
  /* fix bug on iOS */
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  background: #ffffff;
  /* Force Hardware Acceleration in WebKit */
  -webkit-transform: translateZ(0);
  -moz-transform: translateZ(0);
  -ms-transform: translateZ(0);
  -o-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transition: -webkit-transform 0.7s;
  -moz-transition: -moz-transform 0.7s;
  transition: transform 0.7s;
  -webkit-transition-timing-function: cubic-bezier(0.91, 0.01, 0.6, 0.99);
  -moz-transition-timing-function: cubic-bezier(0.91, 0.01, 0.6, 0.99);
  transition-timing-function: cubic-bezier(0.91, 0.01, 0.6, 0.99);
}

.navigation-is-open main {
  -webkit-transform: translateX(100%);
  -moz-transform: translateX(100%);
  -ms-transform: translateX(100%);
  -o-transform: translateX(100%);
  transform: translateX(100%);
}