/* GENERATED by split-scenes.ps1 - do not edit by hand. */
/* Two compositions. The one that does not match is display:none, and a
   background-image on a hidden element is never fetched - so each visitor
   downloads one set, not both. */

.scene-set { position: absolute; left: 50%; top: 54%; transform: translate(-50%,-50%); }
.scene-layer { position: absolute; background-repeat: no-repeat; background-size: 100% 100%; will-change: transform; }

/* portrait is the default; wide takes over once the viewport is landscape */
.scene-set.is-wide { display: none; }
@media (min-aspect-ratio: 1/1) {
  .scene-set.is-portrait { display: none; }
  .scene-set.is-wide { display: block; }
}

/* scene - 17 layers, 840 x 1052.999952 */
.scene-set.is-portrait { aspect-ratio: 840 / 1052.999952; }
.scene-set.is-portrait .l1 { background-image: url('../Resources/scene/layer-01.png'); left: 0%; top: 0%; width: 100%; height: 100%; --d: 0; }
.scene-set.is-portrait .l2 { background-image: url('../Resources/scene/layer-02.png'); left: 0%; top: 0%; width: 100%; height: 21.2963%; --d: -2; }
.scene-set.is-portrait .l3 { background-image: url('../Resources/scene/layer-03.png'); left: 0%; top: 19.943%; width: 100%; height: 41.3105%; --d: -6; }
.scene-set.is-portrait .l4 { background-image: url('../Resources/scene/layer-04.png'); left: 57.6786%; top: 12.4644%; width: 42.3214%; height: 15.0997%; --d: -10; }
.scene-set.is-portrait .l5 { background-image: url('../Resources/scene/layer-05.png'); left: 55.7143%; top: 39.9573%; width: 11.6071%; height: 7.5499%; --d: -15; }
.scene-set.is-portrait .l6 { background-image: url('../Resources/scene/layer-06.png'); left: 0%; top: 0%; width: 19.2857%; height: 51.2821%; --d: -21; }
.scene-set.is-portrait .l7 { background-image: url('../Resources/scene/layer-07.png'); left: 84.5536%; top: 0%; width: 15.4464%; height: 51.2821%; --d: -27; }
.scene-set.is-portrait .l8 { background-image: url('../Resources/scene/layer-08.png'); left: 11.5179%; top: 38.7464%; width: 78.9286%; height: 23.7892%; --d: -33; }
.scene-set.is-portrait .l9 { background-image: url('../Resources/scene/layer-09.png'); left: 0%; top: 54.9858%; width: 30.8036%; height: 40.0285%; --d: -39; }
.scene-set.is-portrait .l10 { background-image: url('../Resources/scene/layer-10.png'); left: 73.0357%; top: 56.1966%; width: 26.9643%; height: 35.114%; --d: -46; }
.scene-set.is-portrait .l11 { background-image: url('../Resources/scene/layer-11.png'); left: 28.8393%; top: 61.1823%; width: 46.25%; height: 30.1282%; --d: -53; }
.scene-set.is-portrait .l12 { background-image: url('../Resources/scene/layer-12.png'); left: 0%; top: 37.4644%; width: 9.6429%; height: 20.0855%; --d: -60; }
.scene-set.is-portrait .l13 { background-image: url('../Resources/scene/layer-13.png'); left: 90.3571%; top: 37.4644%; width: 9.6429%; height: 20.0855%; --d: -68; }
.scene-set.is-portrait .l14 { background-image: url('../Resources/scene/layer-14.png'); left: 0%; top: 76.2108%; width: 19.2857%; height: 23.7892%; --d: -76; }
.scene-set.is-portrait .l15 { background-image: url('../Resources/scene/layer-15.png'); left: 17.2321%; top: 73.7179%; width: 25.0893%; height: 26.2821%; --d: -84; }
.scene-set.is-portrait .l16 { background-image: url('../Resources/scene/layer-16.png'); left: 61.5179%; top: 75%; width: 23.125%; height: 25%; --d: -92; }
.scene-set.is-portrait .l17 { background-image: url('../Resources/scene/layer-17.png'); left: 80.7143%; top: 82.4786%; width: 19.2857%; height: 17.5214%; --d: -100; }

/* scene-wide - 18 layers, 1254 x 705.750001 */
.scene-set.is-wide { aspect-ratio: 1254 / 705.750001; }
.scene-set.is-wide .l1 { background-image: url('../Resources/scene-wide/layer-01.png'); left: 0.0177%; top: 0%; width: 99.9645%; height: 99.9645%; --d: 0; }
.scene-set.is-wide .l2 { background-image: url('../Resources/scene-wide/layer-02.png'); left: 0.0177%; top: 0%; width: 99.9645%; height: 31.3385%; --d: -2; }
.scene-set.is-wide .l3 { background-image: url('../Resources/scene-wide/layer-03.png'); left: 0.0177%; top: 31.2323%; width: 99.9645%; height: 39.6246%; --d: -6; }
.scene-set.is-wide .l4 { background-image: url('../Resources/scene-wide/layer-04.png'); left: 55.919%; top: 16.5722%; width: 26.2467%; height: 23.0524%; --d: -10; }
.scene-set.is-wide .l5 { background-image: url('../Resources/scene-wide/layer-05.png'); left: 53.5275%; top: 47.8045%; width: 7.2343%; height: 8.4986%; --d: -14; }
.scene-set.is-wide .l6 { background-image: url('../Resources/scene-wide/layer-06.png'); left: 0.0177%; top: 0%; width: 24.9911%; height: 54.1784%; --d: -19; }
.scene-set.is-wide .l7 { background-image: url('../Resources/scene-wide/layer-07.png'); left: 74.9911%; top: 0%; width: 24.9911%; height: 60.4461%; --d: -25; }
.scene-set.is-wide .l8 { background-image: url('../Resources/scene-wide/layer-08.png'); left: 0.0177%; top: 39.5184%; width: 35.7529%; height: 60.4461%; --d: -30; }
.scene-set.is-wide .l9 { background-image: url('../Resources/scene-wide/layer-09.png'); left: 64.2294%; top: 39.5184%; width: 35.7529%; height: 60.4461%; --d: -36; }
.scene-set.is-wide .l10 { background-image: url('../Resources/scene-wide/layer-10.png'); left: 32.1236%; top: 54.0722%; width: 15.5447%; height: 27.1955%; --d: -42; }
.scene-set.is-wide .l11 { background-image: url('../Resources/scene-wide/layer-11.png'); left: 52.3317%; top: 54.0722%; width: 14.349%; height: 25.0708%; --d: -49; }
.scene-set.is-wide .l12 { background-image: url('../Resources/scene-wide/layer-12.png'); left: 34.5151%; top: 62.4646%; width: 27.4424%; height: 37.5%; --d: -56; }
.scene-set.is-wide .l13 { background-image: url('../Resources/scene-wide/layer-13.png'); left: 21.4216%; top: 70.7507%; width: 19.0722%; height: 29.2139%; --d: -62; }
.scene-set.is-wide .l14 { background-image: url('../Resources/scene-wide/layer-14.png'); left: 59.5062%; top: 70.7507%; width: 19.0722%; height: 29.2139%; --d: -70; }
.scene-set.is-wide .l15 { background-image: url('../Resources/scene-wide/layer-15.png'); left: 0.0177%; top: 22.8399%; width: 13.0934%; height: 35.4816%; --d: -77; }
.scene-set.is-wide .l16 { background-image: url('../Resources/scene-wide/layer-16.png'); left: 83.3016%; top: 8.2861%; width: 16.6807%; height: 56.3031%; --d: -84; }
.scene-set.is-wide .l17 { background-image: url('../Resources/scene-wide/layer-17.png'); left: 0.0177%; top: 72.8754%; width: 15.4849%; height: 27.0892%; --d: -92; }
.scene-set.is-wide .l18 { background-image: url('../Resources/scene-wide/layer-18.png'); left: 84.4973%; top: 72.8754%; width: 15.4849%; height: 27.0892%; --d: -100; }