/* NGP Fon 1.0.0: куски топосъёмки (бледные) на боковых полях. Только CSS.
   Фон ставится на <html> (холст страницы): он лежит под всем, включая рамку ngp-frame, и не имеет z-index.
   Колонка сайта (.wrapper, 1038 px, белая) перекрывает середину. Фон прокручивается вместе со страницей.
   Картинки заданы только внутри media: ниже 1100 px они не запрашиваются вовсе.
   Каждая картинка 760x1080 px, верх и низ растушёваны в белый (шов между кусками). Слева берётся правая часть
   куска (у колонки), справа левая. Ширина окна 1100 = полей по 31 px, 1920 = по 441 px, 2560 = по 761 px. */
@media (min-width:1100px){
  html{
    background-color:#fff;
    background-repeat:no-repeat;
    background-image:
      url("fon-l-11.webp"),url("fon-l-01.webp"),url("fon-l-07.webp"),url("fon-l-11.webp"),url("fon-l-01.webp"),
      url("fon-r-05.webp"),url("fon-r-04.webp"),url("fon-r-05.webp"),url("fon-r-04.webp");
    /* Позиции в vw, а не в %: проценты фона считаются от (ширина - ширина картинки) и сместили бы куски.
       Колонка 1038 px по центру: левый край 50vw - 519, правый 50vw + 519 (полоса прокрутки 17 px сдвигает её на 8,5 px).
       Левые куски: правый край картинки на 9 px за краем колонки (под ней), 50vw - 519 + 9 - 760 = 50vw - 1270.
       Правые куски: левый край на 9 px под колонкой, 50vw + 519 - 9 = 50vw + 510. Лишнее под колонкой скрыто белым. */
    background-position:
      calc(50vw - 1270px) 0,
      calc(50vw - 1270px) 1080px,
      calc(50vw - 1270px) 2160px,
      calc(50vw - 1270px) 3240px,
      calc(50vw - 1270px) 4320px,
      calc(50vw + 510px) 0,
      calc(50vw + 510px) 1080px,
      calc(50vw + 510px) 2160px,
      calc(50vw + 510px) 3240px;
  }
  /* свой фон body (серый #ececec и картинка темы) не должен закрывать холст */
  body,body.custom-background{background:none !important}
  /* лёгкая тень по краю колонки, чуть явнее прежней: белое на белом без неё сливается */
  .wrapper{box-shadow:0 0 12px rgba(40,60,90,.16)}
}