.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: 210vh;
  content: 'viewport-units-buggyfill; height: 230vh;'; }

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

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

#text1 {
  top: 82vh;
  width: 100%;
  z-index: 4;
  opacity: 0;
  text-shadow: 0px 0px 4px #000000, 0px 0px 6px #000000, 1px 2px 4px #000000; }

#pic1 {
  width: 100vw;
  z-index: 1;
  height: 100vh;
  top: 0;
  left: 0;
  background-color: #000;
  content: 'viewport-units-buggyfill; height: 120vh;'; }

.img1 {
  background-image: url("../images/1.jpg");
  background-position: center;
  background-size: auto 100%;
  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;
  content: 'viewport-units-buggyfill; height: 120vh;'; }

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

#parallax2 {
  width: 100%;
  height: 100vh;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 8;
  content: 'viewport-units-buggyfill; height: 120vh;'; }

#pic2a {
  width: 100%;
  height: 100vh;
  opacity: 1;
  content: 'viewport-units-buggyfill; height: 120vh;'; }

#pic2b {
  width: 100%;
  height: 100vh;
  opacity: 1;
  content: 'viewport-units-buggyfill; height: 120vh;'; }

.img2a {
  background-image: url("https://theworldintenblocks.com/interactive/mohammed/images/2a.jpg");
  background-position: center 100%;
  position: absolute;
  background-size: auto 100%;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  z-index: 1;
  opacity: 1;
  -webkit-transform: scale(1.03);
      -ms-transform: scale(1.03);
          transform: scale(1.03);
  content: 'viewport-units-buggyfill; height: 120vh;'; }

.img2b {
  width: 100%;
  height: 100%;
  top: 0;
  position: absolute;
  background-image: url("../images/2b.jpg");
  background-position: center 15%;
  background-size: auto 75%;
  z-index: 2;
  opacity: 0;
  content: 'viewport-units-buggyfill; height: 120vh;'; }

#text2a, #text2b {
  top: 84vh;
  position: absolute;
  width: 100%; }

#text2 p {
  margin: auto; }

.image-credit1 {
  z-index: 100;
  opacity: 0;
  font-size: 1.9rem;
  font-weight: 300;
  position: absolute;
  text-align: center;
  bottom: 10px;
  width: 100%;
  cursor: pointer; }

.chrome-iOS .image-credit1 {
  bottom: 50px; }

.gap2a {
  position: relative;
  height: 170vh;
  content: 'viewport-units-buggyfill; height: 198vh;'; }

#pic3 {
  width: 100%;
  height: 100vh;
  opacity: 1;
  position: absolute;
  overflow: hidden;
  content: 'viewport-units-buggyfill; height: 120vh;'; }

.img3 {
  width: 100%;
  height: 160%;
  top: 100%;
  position: absolute;
  background-image: url("../images/3.jpg");
  background-position: center;
  background-size: auto 100%;
  z-index: 2;
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
  -webkit-backface-visibility: visible; }

#text3a, #text3b {
  top: 80vh;
  width: 100%;
  position: absolute;
  z-index: 101;
  content: 'viewport-units-buggyfill; top: 84vh;'; }

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

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

#text4a {
  bottom: 18%;
  width: 100%; }

#text4b {
  bottom: 18%;
  left: 43%; }

#pic4a {
  width: 100%;
  height: 100vh;
  position: absolute;
  content: 'viewport-units-buggyfill; height: 120vh;'; }

.img4a {
  width: 100%;
  height: 100%;
  background-image: url("../images/4a.jpg");
  background-position: center;
  background-size: auto 100%;
  opacity: 0; }

#pic4b {
  width: 60vh;
  height: 63vh;
  position: relative;
  top: 30vh;
  left: 5vh; }

.img4b {
  width: 25.22vw;
  height: 31.1vw;
  position: absolute;
  background-image: url("../images/4b.jpg");
  background-position: 100% center;
  background-size: 100% auto;
  box-shadow: -1px 1px 3px 2px rgba(0, 0, 0, 0.3);
  border-radius: 3px;
  opacity: 0;
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0); }

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

.gap5 {
  height: 150vh;
  content: 'viewport-units-buggyfill; height: 180vh;'; }

#parallax3, #parallax4, #parallax5 {
  position: fixed;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  z-index: 9;
  visibility: hidden;
  background-color: transparent; }

#parallax4 {
  z-index: 10; }

#parallax5 {
  z-index: 11; }

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

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

.img5a {
  width: 56%;
  height: 100%;
  top: 0%;
  left: -56%;
  background-image: url("../images/5a.jpg");
  background-position: center 0;
  position: absolute;
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
  border: none; }

.img5b {
  width: 44%;
  height: 50.2%;
  top: -50.2%;
  left: 56%;
  background-image: url("../images/5b.jpg");
  background-position: center;
  position: absolute;
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
  z-index: 10; }

.img5c {
  width: 44%;
  height: 50%;
  top: auto;
  bottom: 0;
  left: 100%;
  background-image: url("../images/5c.jpg");
  background-position: center;
  position: absolute;
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
  z-index: 11; }

.gap6 {
  height: 140vh; }

#cutoutcontainer {
  height: 100%;
  width: 100%;
  background: transparent;
  position: fixed;
  opacity: 1;
  top: 0;
  z-index: 10;
  visibility: hidden;
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0); }

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

#cutout-bg {
  width: 100%;
  height: 100vh;
  position: absolute;
  top: 0;
  left: 0;
  background-position: center 0%;
  background-size: cover;
  background-image: url(../images/6.jpg);
  content: 'viewport-units-buggyfill; height: 120vh;'; }

#cutouttext {
  top: 35%;
  right: 10%;
  text-shadow: 0px 0px 6px #000000; }

.gap7 {
  height: 150vh; }

#parallax7 {
  position: fixed;
  height: 100vh;
  width: 100vw;
  top: 0;
  left: 0;
  z-index: 7;
  opacity: 0;
  background-color: transparent;
  content: 'viewport-units-buggyfill; height: 120vh;'; }

#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: center 0;
  background-size: auto 110%; }

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

.mobile #text7 {
  top: 46%; }

#parallax10 {
  position: relative; }

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

.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; }

@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/mohammed/images/small/1.jpg"); }
  .img2a {
    background-image: url("https://theworldintenblocks.com/interactive/mohammed/images/small/2a.jpg"); }
  .img2b {
    background-image: url("https://theworldintenblocks.com/interactive/mohammed/images/small/2b.jpg"); }
  .img3 {
    background-image: url("https://theworldintenblocks.com/interactive/mohammed/images/small/3.jpg"); }
  .img4a {
    background-image: url("https://theworldintenblocks.com/interactive/mohammed/images/small/4a.jpg"); }
  .img4b {
    background-image: url("https://theworldintenblocks.com/interactive/mohammed/images/small/4b.jpg"); }
  .img5a {
    background-image: url("https://theworldintenblocks.com/interactive/mohammed/images/small/5a.jpg"); }
  .img5b {
    background-image: url("https://theworldintenblocks.com/interactive/mohammed/images/small/5b.jpg"); }
  .img5c {
    background-image: url("https://theworldintenblocks.com/interactive/mohammed/images/small/5c.jpg"); }
  #cutout {
    background-image: url("https://theworldintenblocks.com/interactive/mohammed/images/small/cutout.png"); }
  #cutout-bg {
    background-image: url("https://theworldintenblocks.com/interactive/mohammed/images/small/6.jpg"); }
  .img7 {
    background-image: url("https://theworldintenblocks.com/interactive/mohammed/images/small/7.jpg"); }
  #question {
    background-image: url("https://theworldintenblocks.com/interactive/mohammed/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/mohammed/images/1.jpg"); }
  .img2a {
    background-image: url("https://theworldintenblocks.com/interactive/mohammed/images/2a.jpg"); }
  .img2b {
    background-image: url("https://theworldintenblocks.com/interactive/mohammed/images/2b.jpg"); }
  .img3 {
    background-image: url("https://theworldintenblocks.com/interactive/mohammed/images/3.jpg"); }
  .img4a {
    background-image: url("https://theworldintenblocks.com/interactive/mohammed/images/4a.jpg"); }
  .img4b {
    background-image: url("https://theworldintenblocks.com/interactive/mohammed/images/4b.jpg"); }
  .img5a {
    background-image: url("https://theworldintenblocks.com/interactive/mohammed/images/5a.jpg"); }
  .img5b {
    background-image: url("https://theworldintenblocks.com/interactive/mohammed/images/5b.jpg"); }
  .img5c {
    background-image: url("https://theworldintenblocks.com/interactive/mohammed/images/5c.jpg"); }
  #cutout {
    background-image: url("https://theworldintenblocks.com/interactive/mohammed/images/cutout.png"); }
  #cutout-bg {
    background-image: url("https://theworldintenblocks.com/interactive/mohammed/images/6.jpg"); }
  .img7 {
    background-image: url("https://theworldintenblocks.com/interactive/mohammed/images/7.jpg"); }
  #question {
    background-image: url("https://theworldintenblocks.com/interactive/mohammed/images/8.jpg"); } }

@media screen and (max-width: 720px), (max-height: 480px) {
  .touch #cutouttext {
    left: auto;
    right: 3%;
    top: 39%; }
  .credit-content {
    font-size: 1.6rem; }
  #text2a, #text2b {
    top: 78vh; }
  .image-credit {
    font-size: 4rem; }
  .image-credit1 {
    font-size: 1.9rem; }
  .img7 {
    background-position: 0 0; } }