.poster {
  background-image: url(../poster.png); }

#parallax1 {
  height: 145vh;
  width: 100%;
  overflow: visible;
  background: no-repeat;
  position: relative;
  top: 0;
  background-size: cover;
  z-index: 100;
  content: 'viewport-units-buggyfill; height: 145vh;'; }

.gap1a {
  height: 130vh;
  content: 'viewport-units-buggyfill; height: 156vh;'; }

.gap2 {
  height: 110vh;
  content: 'viewport-units-buggyfill; height: 132vh;'; }

#painting {
  position: relative;
  top: 0%; }

.bg-img {
  width: 100%;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center; }

#text1, #text1a {
  bottom: 5%;
  width: 100%;
  z-index: 4;
  text-shadow: 0px 0px 4px #000000, 0px 0px 6px #000000, 1px 2px 4px #000000; }

#pic1 {
  width: 100vw;
  z-index: 1;
  height: 100%;
  top: 0;
  left: 0;
  background-color: #000; }

.img1 {
  background-image: url("../images/1.jpg");
  background-position: center 25%;
  background-size: auto 80%;
  background-color: #000;
  position: absolute;
  height: 100vh;
  left: auto;
  top: 0;
  right: 0;
  -webkit-transform: translate3d(0, 0, 0px);
          transform: translate3d(0, 0, 0px);
  z-index: 3; }

.img1a {
  background-image: url("../images/1a.jpg");
  background-position: 100% 20%;
  position: absolute;
  background-size: cover;
  top: 0;
  left: 0;
  width: 50vw;
  height: 100vh;
  z-index: 1;
  opacity: 1;
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0); }

.gap1 {
  height: 20vh;
  content: 'viewport-units-buggyfill; height: 24vh;'; }

#parallax2 {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 10; }

#pic2, #pic3 {
  width: 100%;
  height: 100%;
  top: 0%;
  opacity: 1;
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
  position: absolute;
  overflow: hidden; }

#pic3 {
  top: 100%; }

.img2 {
  background-image: url("https://theworldintenblocks.com/interactive/philippa/images/2.jpg");
  background-position: center 100%;
  position: absolute;
  background-size: auto 100%;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  opacity: 1; }

.img3 {
  width: 100%;
  height: 100%;
  top: 0;
  position: absolute;
  background-image: url("../images/3.jpg");
  background-position: center 15%;
  background-size: auto 75%;
  z-index: 2; }

.mobile .img3 {
  background-size: auto 75%; }

#text2 {
  bottom: 10%;
  position: absolute;
  width: 100%; }

#text2 p {
  margin: auto; }

.image-credit {
  z-index: 100;
  opacity: 0;
  font-size: 7rem;
  font-weight: 300;
  position: absolute;
  text-align: center;
  top: 10vmin;
  right: 10vmin;
  width: 60px;
  height: 60px;
  line-height: 63px;
  cursor: pointer; }

#text3, #text3a {
  bottom: 6%;
  width: 100%; }

.gap3 {
  height: 110vh;
  content: 'viewport-units-buggyfill; height: 132vh;'; }

#cutoutcontainer {
  height: 100%;
  width: 100%;
  background: transparent;
  position: fixed;
  opacity: 1;
  top: 0;
  z-index: 11;
  visibility: hidden;
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
  content: 'viewport-units-buggyfill; height: 120vh;'; }

#cutout {
  background-position: center 0%;
  background-size: cover;
  background-image: url(../images/cutout.png);
  background-color: transparent;
  opacity: 0; }

#cutout-bg {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-position: center 0%;
  background-size: cover;
  background-image: url(../images/4.jpg); }

#cutouttext {
  top: 50%;
  right: 5%;
  line-height: 115%;
  text-shadow: 0px 0px 6px #000000, 1px 2px 3px #000000, 2px 1px 4px #000000; }

#gsub {
  opacity: 0;
  padding-top: 10px; }

.gap4 {
  height: 160vh; }

.gap5 {
  height: 150vh; }

#parallax5 {
  position: fixed;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  z-index: 10;
  background-color: transparent; }

#pic5 {
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  position: absolute;
  background-color: transparent; }

.img5 {
  width: 100%;
  height: 100%;
  opacity: 0;
  position: absolute;
  background-image: url("https://theworldintenblocks.com/interactive/philippa/images/5.jpg");
  background-position: center;
  background-size: auto 100%; }

#text5 {
  bottom: 22%;
  width: 100%; }

#text6a {
  bottom: 22%;
  left: 10%;
  text-shadow: 0px 0px 6px #000000, 1px 2px 3px #000000, 2px 1px 4px #000000; }

.img6a {
  width: 40%;
  height: 100%;
  top: 0;
  left: -40%;
  background-image: url("../images/6a.jpg");
  background-position: 50% 80%;
  position: absolute;
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
  border: none; }

#text6b {
  bottom: 12%;
  width: 100%;
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0); }

.img6b {
  width: 60%;
  height: 50%;
  top: -50%;
  left: 40%;
  background-image: url("../images/6b.jpg");
  background-position: center;
  position: absolute;
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
  z-index: 10; }

.img6c {
  width: 60%;
  height: 50%;
  top: 100%;
  left: 40%;
  background-image: url("../images/6c.jpg");
  background-position: center;
  position: absolute;
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
  z-index: 11; }

.gap6 {
  height: 110vh;
  content: 'viewport-units-buggyfill; height: 132vh;'; }

#question {
  background-image: url(../images/8.jpg);
  background-position: center; }

.gap8 {
  height: 140vh;
  content: 'viewport-units-buggyfill; height: 168vh;'; }

#parallax7 {
  position: fixed;
  height: 100%;
  width: 100vw;
  top: 0;
  left: 0;
  z-index: 7;
  opacity: 0;
  background-color: transparent; }

#pic7 {
  height: 100%;
  width: 100%;
  left: 0;
  top: 0;
  opacity: 1;
  position: absolute; }

.img7 {
  width: 100%;
  height: 100%;
  background-image: url("../images/7.jpg");
  background-position: 80% center;
  background-size: 100% auto; }

#text7 {
  top: 26%;
  left: 10%;
  text-shadow: 0px 0px 6px #000000, 1px 2px 3px #000000, 2px 1px 4px #000000; }

#parallax10 {
  position: relative; }

.grow-exit {
  display: block; }

.tooltipster-sidetip.tooltipster-shadow.asterisk-theme .tooltipster-box {
  font-size: 1.9rem;
  box-shadow: 0px 0px 4px 4px rgba(0, 0, 0, 0.3);
  border-radius: 0;
  margin-right: 10px; }

.tooltipster-sidetip.tooltipster-shadow.asterisk-theme .tooltipster-content {
  color: #000;
  padding: 4px; }

.credit-content {
  font-size: 2rem;
  padding: 2px 3px;
  margin: auto;
  line-height: 100%;
  max-width: 22vw;
  color: #000;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none; }

.mobile #text1, .mobile #text1a, .mobile #text2, .mobile #text3 {
  bottom: 10%; }

@media only screen and (max-device-width: 1280px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 1), (max-width: 960px), (max-height: 540px) and (orientation: landscape) {
  .img1 {
    background-image: url("https://theworldintenblocks.com/interactive/philippa/images/small/1.jpg"); }
  .img1a {
    background-image: url("https://theworldintenblocks.com/interactive/philippa/images/small/1a.jpg"); }
  .img2 {
    background-image: url("https://theworldintenblocks.com/interactive/philippa/images/small/2.jpg"); }
  .img3 {
    background-image: url("https://theworldintenblocks.com/interactive/philippa/images/small/3.jpg"); }
  #cutout-bg {
    background-image: url("https://theworldintenblocks.com/interactive/philippa/images/small/4.jpg"); }
  #cutout {
    background-image: url("https://theworldintenblocks.com/interactive/philippa/images/small/cutout.png"); }
  .img5 {
    background-image: url("https://theworldintenblocks.com/interactive/philippa/images/small/5.jpg"); }
  .img6a {
    background-image: url("https://theworldintenblocks.com/interactive/philippa/images/small/6a.jpg"); }
  .img6b {
    background-image: url("https://theworldintenblocks.com/interactive/philippa/images/small/6b.jpg"); }
  .img6c {
    background-image: url("https://theworldintenblocks.com/interactive/philippa/images/small/6c.jpg"); }
  .img7 {
    background-image: url("https://theworldintenblocks.com/interactive/philippa/images/small/7.jpg"); }
  #question {
    background-image: url("https://theworldintenblocks.com/interactive/philippa/images/small/8.jpg"); } }

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  .img1 {
    background-image: url("https://theworldintenblocks.com/interactive/philippa/images/1.jpg"); }
  .img1a {
    background-image: url("https://theworldintenblocks.com/interactive/philippa/images/1a.jpg"); }
  .img2 {
    background-image: url("https://theworldintenblocks.com/interactive/philippa/images/2.jpg"); }
  .img3 {
    background-image: url("https://theworldintenblocks.com/interactive/philippa/images/3.jpg"); }
  #cutout-bg {
    background-image: url("https://theworldintenblocks.com/interactive/philippa/images/4.jpg"); }
  #cutout {
    background-image: url("https://theworldintenblocks.com/interactive/philippa/images/cutout.png"); }
  .img5 {
    background-image: url("https://theworldintenblocks.com/interactive/philippa/images/5.jpg"); }
  .img6a {
    background-image: url("https://theworldintenblocks.com/interactive/philippa/images/6a.jpg"); }
  .img6b {
    background-image: url("https://theworldintenblocks.com/interactive/philippa/images/6b.jpg"); }
  .img6c {
    background-image: url("https://theworldintenblocks.com/interactive/philippa/images/6c.jpg"); }
  .img7 {
    background-image: url("https://theworldintenblocks.com/interactive/philippa/images/7.jpg"); }
  #question {
    background-image: url("https://theworldintenblocks.com/interactive/philippa/images/8.jpg"); } }

@media screen and (max-width: 720px), (max-height: 480px) {
  .touch #cutouttext {
    left: auto;
    right: 12%;
    max-width: 24rem;
    top: 39%; }
  .credit-content {
    font-size: 1.6rem; }
  .image-credit {
    font-size: 4rem; } }