@media screen and (min-width: 601px){

  h1 {
    text-align: center;
    font-size: 1.11vw;
    font-weight: normal;
    letter-spacing: 0.5px;
    margin: 0;
    color: white;
    font-family: "Merriweather", serif; }

  h2 {
    text-align: center;
    font-size: 5.56vw;
    letter-spacing: 1px;
    line-height: 1;
    margin: 0;
    color: white;
    font-family: "Caveat", cursive; }

  p {
    margin-top: 7%;
    margin-bottom: 7%;
    margin-right: 15%;
    margin-left: 15%; }
    
.blank a:link
    {
        color: red;
    }
    
.blank a:visited
    {
        color: indianred;
    }
    
.blank a:hover
    {
        color: indianred;
    }

  .text-left {
    display: block;
    text-align: left;
    line-height: 1.5; }

  .text-center {
    display: block;
    text-align: center;
    line-height: 1.5; }

  .text-right {
    display: block;
    text-align: right;
    line-height: 1.5; }

  .text-float {
    position: absolute; }

  .a {
    color: white; }

  body {
    margin: 0;
    overflow-x: hidden;}

    html{
        margin: 0;
    }


  .blank {
    display: block;
    position: relative;
    min-height: auto;
    perspective: 1000px; }

  .empty {
    height: 6.5vw; }

  .quote-center {
    padding: 0 19% 0 19%;
    font-size: 2.43vw;
    position: relative;
    font-family: "Caveat", cursive;
    font-weight: bold; }

  .quote-left {
    padding: 0 40% 0 5%;
    font-size: 2.43vw;
    position: relative;
    font-family: "Caveat", cursive;
    font-weight: bold; }

  .quote-right {
    padding: 0 5% 0 40%;
    font-size: 2.43vw;
    position: relative;
    font-family: "Caveat", cursive;
    font-weight: bold; }

  .medium-center {
    padding: 0 15% 0 15%;
    font-size: 1.53vw;
    position: relative;
    font-family: "Slabo 27px", serif; }

  .medium-left {
    padding: 0 40% 0 5%;
    font-size: 1.53vw;
    position: relative;
    font-family: "Slabo 27px", serif; }

  .medium-right {
    padding: 0 5% 0 40%;
    font-size: 1.53vw;
    position: relative;
    font-family: "Slabo 27px", serif; }

  .small-center {
    padding: 0 30% 0 30%;
    font-size: 1.53vw;
    position: relative;
    font-family: "Slabo 27px", serif; }

  .small-right {
    padding: 0 5% 0 57%;
    font-size: 1.53vw;
    position: relative;
    font-family: "Slabo 27px", serif; }

  .small-left {
    padding: 0 57% 0 5%;
    font-size: 1.53vw;
    position: relative;
    font-family: "Slabo 27px", serif; }

  .big-left {
    padding: 0 40% 0 0;
    font-size: 1.53vw;
    position: relative;
    font-family: "Slabo 27px", serif; }

  .big-right {
    padding: 0 0 0 40%;
    font-size: 1.53vw;
    position: relative;
    font-family: "Slabo 27px", serif; }
    
/*content start*/
    
.overlay-desktop {
    /* Height & width depends on how you want to reveal the overlay (see JS below) */    
    height: 0;
    width: 100%;
    position: fixed; /* Stay in place */
    z-index: 15; /* Sit on top */
    left: 0;
    top: 0;
    background-color: rgb(0,0,0); /* Black fallback color */
    background-color: rgba(0,0,0, 0.5); /* Black w/opacity */
    overflow-x: hidden; /* Disable horizontal scroll */
    transition: 0.5s; /* 0.5 second transition effect to slide in or slide down the overlay (height or width, depending on reveal) */
}

    .overlay-mobile {display: none;}
    .mobile {display: none;}
    
/* Position the content inside the overlay */
.overlay-content {
    position: relative;
    width: 100%; /* 100% width */
    text-align: center; /* Centered text/links */
    margin-top: 8%;
}

/* Position the close button (top right corner) */
.overlay-desktop .closebtn {
    position: absolute;
    top: 3%;
    right: 10%;
    font-size: 60px;
    text-decoration: none;
    color: rgb(238, 0, 0);
}
    
.button2
    {
       background-color: rgb(238, 0, 0);
        color: white;
        text-align: center;
        font-size: 1vw;
        opacity: 0.8;
        transition: 0.3s;
        display: inline-block;
        text-decoration: none;
        cursor: pointer;
        margin: 3.5%;
        padding: 2%;
        border: none;
        border-radius: 8px;
        font-family: Arial, Helvetica, sans-serif;
        width: 20vw;
    }
    
.button2 a
    {
        color: white;
        text-align: center;
        font-size: 1vw;
        opacity: 0.8;
        text-decoration: none;
    }  

.button2:hover {opacity: 1}
    

.menu-collapsed
  {display: none;}

  #chap-scroll {
    position: fixed;
    list-style-type: none;
    padding-left: 22%;
    height: 75px;
    padding-top: 0.75%;
    top: 0;
    width: 100%;
    z-index: 10;
    margin: 0;
    box-sizing: border-box;
    float: center center;
    transition: top 0.3s;
    background-image: url(media/chapter-box.png);
    background-size: 100%;
    background-position: center center;
    background-repeat: no-repeat; }

  #chap-scroll a {
    color: white;
    text-decoration: none;
    text-align: center;
    font-family: "Caveat", cursive;
    font-size: 2.5vw;
    padding-right: 3.5%;
    padding-left: 3.5%;
    padding-top: 2%;}

  #chap-scroll a:hover {
    color: red; }

  #chap-scroll a.active { }

  #chap-scroll a .chap-name {
    display: none;
    width: 100%;
    background-color: black;
    color: #fff;
    text-align: center;
    font-family: "Caveat", cursive;
    /* Position the tooltip text - see examples below! */
    position: absolute;
    top: 70%;
    left: 0;
    padding:0 0 0.5% 0;

    }

  #chap-scroll a:hover .chap-name {
    display: block;
}
    
      .style-graphics
    {
        display: none;                  
    }
    
    .style-text
    {
        position: fixed;
        top: 3%;
        left: 92%;
        z-index: 10;  
    }

    
    .button
    {
       background-color: dimgray;
        color: white;
        text-align: center;
        font-size: 1vw;
        opacity: 0.4;
        transition: 0.3s;
        display: inline-block;
        text-decoration: none;
        cursor: pointer;
        border: none;
    }

.button:hover {opacity: 1}
    
        
.rage-float
    {
        height: 4vw;
        width: 10vw;
        position: fixed;
        top: 1.5%;
        left: 1.5%;
        z-index: 8;
        cursor: pointer;
        filter: opacity(0.3);
    }
    
    .rage-float:hover
    {
        height: 4vw;
        width: 10vw;
        position: fixed;
        top: 1.5%;
        left: 1.5%;
        z-index: 8;
        cursor: pointer;
        filter: opacity(1);
    }
    
  section {
    perspective: 1000px; }

  img {
    position: relative;
    width: 60%;
    display: block;
    margin-left: auto;
    margin-right: auto;
    filter: grayscale(100%); }

  img:hover {
    filter: grayscale(0); }

  .pics-pics figure {
    position: relative;
    opacity: 0;
    transition: 0.3s ease-in-out; }
    .pics-pics figure.is-showing {
      opacity: 1; }

  .mobile-pics {
    display: none; }

  .vids {
    padding: 0 20% 0 20%; }

  .iframe-container {
    position: relative;
    width: 100%;
    padding: 0 0 56.25% 0;
    height: 0;
    box-sizing: border-box; }

  .iframe-container iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; }

  #title {
    margin: 0 20% 0 20%;
    width: 60vw;
    height: 55vh; }

  .headline {
    position: relative;
    background-color: black;
    background-repeat: no-repeat;
    height: 100vh;
    padding-top: 7.5%; }

  .intro {
    padding: 0 20% 0 20%;
    text-align: center;
    line-height: 1.5;
    color: white;
    font-size: 1.53vw;
    position: relative;
    font-family: "Slabo 27px", serif; }

.chap-header-01
{
  display: none;
}

  .building-intro {
    position: relative;
    overflow: hidden;
    height: 45.57vw;
    min-width: 100%;
    background-color: white;
    background-image: url(media/Romuana-02.png);
    background-size: 101%;
    background-position: top center;
    background-attachment: relative;
    background-repeat: no-repeat; }

  .man-fall {
    height: 26vw;
    width: 26vw;
    background-image: url(media/Romuana-04.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 50%;
    position: absolute;
    top: 3%;
    left: 38%; }

  .fall {
    height: 26vw;
    width: 26vw;
    background-image: url(media/Romuana-05.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 50%;
    position: absolute;
    top: 3%;
    left: 39%;}

  .big-cloud {
    height: 39.3vw;
    min-width: 100%;
    padding-top: 8%;
    display: none;
    background-image: url(media/Romuana-03.png);
    background-position: top center;
    background-repeat: no-repeat;
    background-size: 105%;
    position: absolute;
    top: 50%; }

  .black-across {
    position: relative;
    height: 26vw;
    overflow: hidden;
    padding-top: 10%;
    background-image: url(media/Romuana-07.png);
    background-size: 105%;
    background-position: center center;
    background-repeat: no-repeat; }

  .mid-building-01 {
    height: 35.8vw;
    width: 35.8vw;
    background-image: url(media/Romuana-06.png);
    background-position: bottom left;
    background-repeat: no-repeat;
    background-size: 100%;
    position: absolute;
    top: -8%; }

  .mid-building-02 {
    height: 35.8vw;
    width: 16.3vw;
    background-image: url(media/Romuana-14.png);
    background-position: bottom left;
    background-repeat: no-repeat;
    background-size: 100%;
    position: absolute;
    top: -8%;
    left: 32%; }

  .mid-building-03 {
    height: 35.8vw;
    width: 16.3vw;
    background-image: url(media/Romuana-16.png);
    background-position: bottom left;
    background-repeat: no-repeat;
    background-size: 100%;
    position: absolute;
    top: -8%;
    left: 44%; }

  .dbody {
    height: 42.3vw;
    width: 42.3vw;
    background-image: url(media/Romuana-09.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 85%;
    position: absolute;
    top: 3%;
    left: 5%; }

  .guard {
    height: 29.3vw;
    width: 29.3vw;
    background-image: url(media/Romuana-10.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 55%;
    position: absolute;
    top: -23%;
    left: 75%;
    -ms-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
    opacity: 0;
    transition: 1.8s ease-in-out; }

  .fog {
    position: absolute;
    height: 35.5vw;
    width: 100%;
    top: -25%;
    transition: 1s ease-in;
    z-index: -10;
    background-image: url(media/Romuana-11.png);
    background-size: 100%;
    background-position: top center;
    background-repeat: no-repeat; }

  .footer01 {
    position: relative;
    height: 35.5vw;
    z-index: -5;
    overflow: show;
    background-image: url(media/Romuana-08.png);
    background-size: 100%;
    background-position: bottom center;
    background-attachment: scroll;
    background-repeat: no-repeat; }

  .fade-02 {
    position: relative;
    height: 75vw;
    width: 100%;
    padding-top: 10%;
    overflow: show;
    background-image: url(media/Stop-02.png);
    background-size: 100%;
    background-position: top center;
    background-attachment: relative;
    background-repeat: no-repeat; }

  .chap-header-02 {
    position: relative;
    height: auto; }

  .hand {
    height: 42.5vw;
    width: 42.5vw;
    background-image: url(media/Stop-04.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100%;
    position: absolute;
    left: -25%;
    top: 10%;
    transition: 1s ease-in-out; }

  .card {
    height: 22.8vw;
    width: 22.8vw;
    background-image: url(media/Stop-05.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100%;
    position: absolute;
    top: 25%;
    left: 70%; }

  .barb-wire {
    position: absolute;
    height: 45vw;
    width: 100%;
    padding: 27% 20% 0 20%;
    background-image: url(media/Stop-03.png);
    background-size: 105%;
    background-position: bottom left;
    background-attachment: scroll;
    background-repeat: no-repeat;
    top: 35%;
    box-sizing: border-box; }

  .protest-bg {
    position: relative;
    box-sizing: border-box;
    height: 36.5vw;
    padding-top: 10%;
    min-width: 100%;
    background-image: url(media/Stop-08.png);
    background-size: 100%;
    background-position: top center;
    background-repeat: no-repeat;
    overflow: hidden;}

  .protest-left {
    position: absolute;
    top: 3%;
    left: -6%;
    height: 36.5vw;
    min-width: 100%;
    background-image: url(media/Stop-13.png);
    background-size: 45%;
    background-position: left center;
    background-attachment: scroll;
    background-repeat: no-repeat; }

  .protest-right {
    position: absolute;
    top: 3%;
    left: 6%;
    height: 36.5vw;
    min-width: 100%;
    background-image: url(media/Stop-12.png);
    background-size: 45%;
    background-position: right center;
    background-attachment: scroll;
    background-repeat: no-repeat; }

  .footer02 {
    position: relative;
    height: 14.32vw;
    padding-top: 3%;
    padding-left: 5%;
    background-image: url(media/Stop-10.png);
    background-size: 101%;
    background-position: bottom center;
    background-repeat: no-repeat; }

  .card-footer {
    height: 35.8vw;
    width: 35.8vw;
    background-image: url(media/Stop-11.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100%;
    position: absolute;
    top: -75%;
    -ms-transform: translate(137%, 0);
    transform: translate(137%, 0); }

  .header03 {
    position: relative;
    background-color: black;
    height: 68.5vw; }

  .chap-header-03 {
    position: relative;
    height: auto;
    transition: 1.5s ease-in-out;
    transform: translate(0, -320%);
    opacity: 0; }

  .shop {
    height: 35.8vw;
    width: 100%;
    padding-top: 20%;
    background-image: url(media/Lalfaima-02.png);
    background-position: bottom center;
    background-repeat: no-repeat;
    background-size: 100%;
    position: absolute;
    top: 22%; }

  .lil-cloud-1 {
    height: 26vw;
    width: 26vw;
    background-image: url(media/Lalfaima-04.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100%;
    position: absolute;
    top: 5%;
    left: 35%; }

  .lil-cloud-2 {
    height: 26vw;
    width: 26vw;
    background-image: url(media/Lalfaima-05.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100%;
    position: absolute;
    top: 10%;
    left: -10%; }

  .lil-cloud-3 {
    height: 26vw;
    width: 26vw;
    background-image: url(media/Lalfaima-05.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100%;
    position: absolute;
    top: 27%;
    left: 70%; }

  .chin-map {
    height: 52vw;
    width: 100%;
    box-sizing: border-box;
    background-position: center;
    background-repeat: no-repeat;
    background-size: 35%;
    padding-top: 3%;
    padding-left: 5%; }

  #route {
    margin: 0 0 0 40%;
    padding-top: 5%;
    width: 60vw;
    height: 100vh;
    position: absolute;
    top: 0; }

  #route-play {
    position: absolute;
    top: 0;
    left: 25%;
    height: 5vw;
    width: 30vw;
    background-image: url(media/route-play.png);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 90%; }

  #route-play:hover {
    position: absolute;
    height: 5vw;
    width: 30vw;
    background-image: url(media/route-play.png);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 100%; }

  .shop-road {
    height: 82vw;
    position: relative;
    background-image: url(media/Lalfaima-09.png);
    background-position: bottom right;
    background-repeat: no-repeat;
    background-size: 95%; }

  .imigresen {
    height: 32.5vw;
    width: 58.6vw;
    background-image: url(media/Lalfaima-10.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 80%;
    position: absolute;
    top: 65%;
    left: -35%;
    transition: 1s ease-in-out; }

  .footer03 {
    position: relative;
    height: 31vw;
    padding-top: 0%;
    min-width: 100%;
    background-image: url(media/Lalfaima-13.png);
    background-size: 100%;
    background-position: bottom center;
    background-attachment: scroll;
    background-repeat: no-repeat; }

  .flower-footer {
    height: 30vw;
    width: 30vw;
    background-image: url(media/Lalfaima-11.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100%;
    position: absolute;
    top: -20%;
    left: 65%; }

  .flower-fall {
    height: 15vw;
    width: 15vw;
    background-image: url(media/Lalfaima-12.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100%;
    position: absolute;
    top: 12%;
    left: 58%;
    transition: 1.2s ease-in-out; }

  .fade-04 {
    position: relative;
    height: 71.6vw;
    min-width: 100%;
    overflow: show;
    background-image: url(media/Stop-02.png);
    background-size: 100%;
    background-position: top center;
    background-attachment: relative;
    background-repeat: no-repeat; }

  .chapter04 {
    padding: 40% 5% 0% 5%; }

  .chap-header-04 {
    position: relative;
    height: auto; }

  .child {
    height: 15vw;
    width: 15vw;
    background-image: url(media/Esther-04.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 90%;
    position: absolute;
    top: 6%;
    left: 45%;
    transition: 1s ease-in-out; }

  .dad {
    height: 32.5vw;
    width: 32.5vw;
    background-image: url(media/Esther-03.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100%;
    position: absolute;
    top: 5%;
    left: 33%; }


.family {
    height: 50vw;
    position: relative;
    background-image: url(photos/Esther-06.png);
    background-position: center left;
    background-repeat: no-repeat;
    background-size: 40%;
    margin-bottom: 2%;
    filter: grayscale(100%); }

.family:hover {
    height: 50vw;
    position: relative;
    background-image: url(photos/Esther-06.png);
    background-position: center left;
    background-repeat: no-repeat;
    background-size: 40%;
    margin-bottom: 2%;
    filter: grayscale(0%); }

  .hosp {
    position: absolute;
    height: 57.3vw;
    min-width: 100%;
    overflow: show;
    background-image: url(media/Esther-13.png);
    background-size: 100%;
    background-position: bottom center;
    background-attachment: scroll;
    background-repeat: no-repeat;
    z-index: 5;
    }

  .footer04 {
    position: absolute;
    height: 50vw;
    min-width: 100%;
    overflow: show;
    background-image: url(media/Esther-14.png);
    background-size: 100%;
    background-position: bottom center;
    background-attachment: relative;
    background-repeat: no-repeat; }

  .bush {
    position: absolute;
    height: 57.3vw;
    min-width: 100%;
    overflow: show;
    background-image: url(media/Esther-15.png);
    background-size: 100%;
    background-position: bottom center;
    background-attachment: relative;
    background-repeat: no-repeat; }

  .chap-header-05 {
    position: relative;
    height: auto;
    opacity: 0;
    transition: 1.5s ease-in-out;}

  .waiter {
    height: 45vw;
    width: 45vw;
    background-image: url(media/Thangte-02.png);
    background-position: center right;
    background-repeat: no-repeat;
    background-size: 90%;
    position: absolute;
    top: 39%;
    left: 55%; }

  .customer {
    height: 52vw;
    width: 52vw;
    background-image: url(media/Thangte-03.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100%;
    position: absolute;
    top: 49%;
    left: 10%; }

  .table {
    position: relative;
    height: 62vw;
    min-width: 100%;
    padding-top: 20%;
    overflow: show;
    background-color: black;
    background-image: url(media/Thangte-07.png);
    background-size: 100%;
    background-position: bottom center;
    background-attachment: relative;
    background-repeat: no-repeat;
    z-index: 0;}

  .thangte {
    height: 59vw;
    width: 95%;
    position: relative;
    left: 5%;
    background-image: url(photos/Thangte-03.png);
    background-position: top left;
    background-repeat: no-repeat;
    background-size: 35%;
    padding-top: 0;
    filter: grayscale(100%); }

  .thangte:hover {
    height: 59vw;
    width: 95%;
    position: relative;
    left: 5%;
    background-image: url(photos/Thangte-03.png);
    background-position: top left;
    background-repeat: no-repeat;
    background-size: 35%;
    padding-top: 0;
    filter: grayscale(0%); }

  .photo-frame {
    height: 26vw;
    width: 26vw;
    background-image: url(media/Thangte-05.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100%;
    position: absolute;
    top: -90%;
    left: 60%; }

  .footer05 {
    position: relative;
    height: 17.55vw;
    max-width: 100%;
    padding-top: 1px;
    padding-left: 75px;
    background-color: black;
    background-image: url(media/Stop-10.png);
    background-size: 95%;
    background-position: top center;
    background-attachment: scroll;
    background-repeat: no-repeat; }

  .header06 {
    position: relative;
    height: 65.1vw;
    width: 100%;
    padding-top: 5%;
    overflow: show;
    background-image: url(media/Bitter-pill-02.png);
    background-size: 100%;
    background-position: top center;
    background-attachment: relative;
    background-repeat: no-repeat; }

  .chap-header-06 {
    position: relative;
    height: auto;
    transition: 1.5s ease-in-out;
    opacity: 1; }

  .crowd-left {
    height: 22.7vw;
    width: 100%;
    background-image: url(media/Bitter-pill-03.png);
    background-position: right;
    background-repeat: no-repeat;
    background-size: 32%;
    position: absolute;
    transform: rotateY(180deg);
    top: 30%; }

  .crowd-right {
    height: 22.7vw;
    width: 100%;
    background-image: url(media/Bitter-pill-03.png);
    background-position: right;
    background-repeat: no-repeat;
    background-size: 32%;
    position: absolute;
    top: 30%; }

  .white-cloud {
    height: 39vw;
    min-width: 100%;
    background-image: url(media/Bitter-pill-04.png);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 100%;
    position: absolute;
    top: 50%; }

  .population-map {
    position: relative;
    height: 65.1vw;
    width: 100%;
    overflow: show;
    background-image: url(media/Bitter-pill-05.png);
    background-size: 100%;
    background-position: top center;
    background-attachment: relative;
    background-repeat: no-repeat; }

  .pill-bottle {
    position: relative;
    height: 22vw;
    max-width: 100%;
    background-image: url(media/Bitter-pill-06.png);
    background-size: 30%;
    background-position: bottom left;
    background-attachment: scroll;
    background-repeat: no-repeat; }

  .pills {
    height: 9.75vw;
    width: 9.75vw;
    background-image: url(media/Bitter-pill-07.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100%;
    position: absolute;
    top: 63%;
    left: 27%; }

  .footer06 {
    position: relative;
    height: 44vw;
    width: 100%;
    background-image: url(media/Bitter-pill-08.png);
    background-size: 100%;
    background-position: bottom center;
    background-attachment: scroll;
    background-repeat: no-repeat; }

  .header07 {
    position: relative;
    height: 50vw;
    width: 100%;
    overflow: show;
    background-color: black;
    background-size: 100%;
    background-position: top center;
    background-attachment: relative;
    background-repeat: no-repeat; }

  .chap-header-07 {
    position: relative;
    height: auto;
    transition: 1.5s ease-in-out;
    transform: translate(0, -200%);
    opacity: 0; }

  .cliff-left {
    height: 39vw;
    min-width: 100%;
    background-image: url(media/Broken-trust-02.png);
    background-position: left center;
    background-repeat: no-repeat;
    background-size: 55%;
    position: absolute;
    top: 40%;
    left: -1%; }

  .cliff-right {
    height: 39vw;
    min-width: 100%;
    background-image: url(media/Broken-trust-03.png);
    background-position: right center;
    background-repeat: no-repeat;
    background-size: 55%;
    position: absolute;
    top: 40%; }

  .rubbles {
    height: 16.27vw;
    min-width: 100%;
    background-image: url(media/Broken-trust-05.png);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 10%;
    position: absolute;
    top: 62%;
    left: -3.5%; }

  .hand-07 {
    position: relative;
    height: 42.3vw;
    max-width: 100%;
    margin-top: 7%;
    background-image: url(media/Broken-trust-07.png);
    background-size: 40%;
    background-position: bottom left;
    background-attachment: scroll;
    background-repeat: no-repeat; }

  .money-bulk {
    height: 22.78vw;
    width: 22.78vw;
    background-image: url(media/Broken-trust-08.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100%;
    position: absolute;
    top: 25%;
    left: 18%; }

  .money-single {
    height: 19.53vw;
    width: 19.53vw;
    background-image: url(media/Broken-trust-09.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100%;
    position: absolute;
    top: -15%;
    left: 18%; }

  .footer07 {
    position: relative;
    height: 35.8vw;
    max-width: 100%;
    background-image: url(media/Broken-trust-10.png);
    background-size: 100%;
    background-position: bottom center;
    background-attachment: scroll;
    background-repeat: no-repeat; }

  .burried-01 {
    height: 22.78vw;
    width: 22.78vw;
    background-image: url(media/Broken-trust-11.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100%;
    position: absolute;
    top: 20%; }

  .burried-02 {
    height: 22.78vw;
    width: 22.78vw;
    background-image: url(media/Broken-trust-12.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100%;
    position: absolute;
    top: 17%;
    left: 47%; }

  .burried-03 {
    height: 22.78vw;
    width: 22.78vw;
    background-image: url(media/Broken-trust-13.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100%;
    position: absolute;
    top: 23%;
    left: 65%; }

  .header08 {
    position: relative;
    height: 78.125vw;
    width: 100%;
    padding-top: 7%;
    overflow: show;
    background-image: url(media/No-option-02.png);
    background-size: 100%;
    background-position: top center;
    background-attachment: relative;
    background-repeat: no-repeat; }

  .chap-header-08 {
    position: relative;
    height: auto;
    transition: 1.5s ease-in-out;
    transform: translate(0, -200%);
    opacity: 0; }

  .left-sign {
    height: 19.53vw;
    width: 19.53vw;
    background-image: url(media/No-option-10.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100%;
    position: absolute;
    top: 37%;
    left: 10%; }

  .center-sign {
    height: 19.53vw;
    width: 19.53vw;
    background-image: url(media/No-option-08.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100%;
    position: absolute;
    top: 37%;
    left: 40%; }

  .right-sign {
    height: 19.53vw;
    width: 19.53vw;
    background-image: url(media/No-option-09.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100%;
    position: absolute;
    top: 37%;
    left: 70%; }

  .cross-road {
    position: relative;
    height: 42.31vw;
    width: 100%;
    border-top: 50%;
    margin-top: 7%;
    padding-top: 10%;
    top: 5%;
    overflow: show;
    background-image: url(media/No-option-03.png);
    background-size: 100%;
    background-position: top center;
    background-attachment: relative;
    background-repeat: no-repeat; }

  .resettlement-stat {
    position: relative;
    height: 22.78vw;
    max-width: 100%;
    padding: 3% 0 3% 0;
    background-image: url(media/No-option-04.png);
    background-size: 45%;
    background-position: center right;
    background-attachment: scroll;
    background-repeat: no-repeat; }

  .resettlement-stat-red {
    position: absolute;
    height: 22.78vw;
    width: 100%;
    background-image: url(media/No-option-11.png);
    background-size: 45%;
    background-position: center right;
    background-attachment: scroll;
    background-repeat: no-repeat; }

  .footer08 {
    position: relative;
    height: 35.48vw;
    max-width: 100%;
    background-image: url(media/No-option-07.png);
    background-size: 100%;
    background-position: bottom center;
    background-attachment: scroll;
    background-repeat: no-repeat; }

  .wire {
    position: relative;
    height: 25vw;
    max-width: 100%;
    background-image: url(media/No-option-05.png);
    background-size: 107%;
    background-position: top center;
    background-attachment: scroll;
    background-repeat: no-repeat; }

  .people {
    position: relative;
    height: 24.4vw;
    max-width: 100%;
    background-image: url(media/No-option-06.png);
    background-size: 100%;
    background-position: bottom center;
    background-attachment: scroll;
    background-repeat: no-repeat; }

  .header09 {
    position: relative;
    height: 61.85vw;
    width: 100%;
    overflow: show;
    background-color: black;
    background-size: 100%;
    background-position: top center;
    background-attachment: relative;
    background-repeat: no-repeat; }

  .chap-header-09 {
    position: relative;
    padding-top: 10%;
    height: auto;
    transition: 1.5s ease-in-out;
    opacity: 1; }

  .cry {
    position: absolute;
    height: 48.83vw;
    width: 100%;
    background-image: url(media/Fear-Desperation-13.png);
    background-size: 20%;
    background-position: top right;
    background-attachment: scroll;
    background-repeat: no-repeat; }

  .hill01 {
    height: 13.02vw;
    width: 100%;
    background-image: url(media/Fear-Desperation-02.png);
    background-position: bottom left;
    background-repeat: no-repeat;
    background-size: 50%;
    position: absolute; }

  .hill02 {
    height: 13.02vw;
    width: 100%;
    background-image: url(media/Fear-Desperation-03.png);
    background-position: bottom center;
    background-repeat: no-repeat;
    background-size: 50%;
    position: absolute; }

  .hill03 {
    height: 13.02vw;
    width: 100%;
    background-image: url(media/Fear-Desperation-04.png);
    background-position: bottom right;
    background-repeat: no-repeat;
    background-size: 50%;
    position: absolute; }

  .flying-papers {
    position: relative;
    height: 42.31vw;
    width: 100%;
      margin-bottom: 10%;
    background-image: url(media/Fear-Desperation-05.png);
    background-size: 90%;
    background-position: center center;
    background-attachment: scroll;
    background-repeat: no-repeat; }

  .paper01 {
    height: 16.27vw;
    width: 16.27vw;
    background-image: url(media/Fear-Desperation-06.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 40%;
    position: absolute;
    top: 25%;
    left: 15%;
    transition: 0.5s ease-in-out; }

  .paper02 {
    height: 16.27vw;
    width: 16.27vw;
    background-image: url(media/Fear-Desperation-07.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 40%;
    position: absolute;
    top: 27%;
    left: 65%;
    transition: 0.5s ease-in-out; }

  .paper03 {
    height: 16.27vw;
    width: 16.27vw;
    background-image: url(media/Fear-Desperation-08.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 40%;
    position: absolute;
    top: 35%;
    left: 70%;
    transition: 0.5s ease-in-out; }

  .back-hill {
    height: 38vw;
    width: 100%;
    background-image: url(media/Fear-Desperation-12.png);
    background-position: bottom left;
    background-repeat: no-repeat;
    background-size: 80%;
    position: absolute; }

  .front-hill {
    height: 46vw;
    width: 100%;
    background-image: url(media/Fear-Desperation-11.png);
    background-position: bottom right;
    background-repeat: no-repeat;
    background-size: 105%;
    position: relative; }

  .house {
    height: 26.04vw;
    width: 26.04vw;
    background-image: url(media/Fear-Desperation-10.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100%;
    position: absolute;
    left: 65%;
    top: 40%; }

  .final-chapter {
    position: relative;
    height: 95vw;
    width: 100%;
    overflow: show;
    background-color: black;
    background-image: url(media/Going-home-04.png);
    background-size: 45%;
    background-position: bottom left;
    background-attachment: relative;
    background-repeat: no-repeat; }

  .chap-header-10 {
    position: relative;
    height: auto;
    transition: 1.5s ease-in-out;
    opacity: 1; }

  .final-footer {
    position: relative;
    top: -13%;
    height: 27vw;
    width: 100%;
    background-image: url(media/Going-home-03.png);
    background-size: 100%;
    background-position: bottom right;
    background-attachment: scroll;
    background-repeat: no-repeat; }

  .home {
    position: absolute;
    top: 53%;
    height: 35.8vw;
    width: 100%;
    opacity: 0;
    background-image: url(media/Going-home-05.png);
    background-size: 15%;
    background-position: left bottom;
    background-attachment: scroll;
    background-repeat: no-repeat;
    transition: 1.3s ease-in-out;
    transition-delay: 1s; }

  .coffin {
    height: 26.04vw;
    width: 26.04vw;
    opacity: 0;
    background-image: url(media/Going-home-02.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 65%;
    position: absolute;
    left: 65%;
    top: -8%;
    transition: 1.3s ease-in-out; }

  .footer {
    position: relative;
    margin-top: 5%;
    height: 28vw;
    width: 100%;
    background-image: url(media/credits-web.png);
    background-size: 35%;
    background-position: top center;
    background-attachment: scroll;
    background-repeat: no-repeat; }

  .rage {
    position: absolute;
    top: 57.3%;
    left: 32.5%;
    height: 5vw;
    width: 12vw;
    background-image: url(media/rage.png);
    background-size: 99.8%;
    background-position: center center;
    background-attachment: scroll;
    background-repeat: no-repeat; }

  .socmed-fb {
    position: absolute;
    top: 60%;
    left: 59.2%;
    height: 3.675vw;
    width: 3.675vw;
    background-image: url(media/socmed-fb.png);
    background-size: 100%;
    background-position: center center;
    background-attachment: scroll;
    background-repeat: no-repeat; }

  .socmed-ig {
    position: absolute;
    top: 60%;
    left: 55.2%;
    height: 3.675vw;
    width: 3.675vw;
    background-image: url(media/socmed-ig.png);
    background-size: 100%;
    background-position: center center;
    background-attachment: scroll;
    background-repeat: no-repeat; }

  .socmed-tw {
    position: absolute;
    top: 60%;
    left: 63%;
    height: 3.675vw;
    width: 3.675vw;
    background-image: url(media/socmed-tw.png);
    background-size: 100%;
    background-position: center center;
    background-attachment: scroll;
    background-repeat: no-repeat; }

  .trademark {
    border-top: 0.5px solid grey;
    font-size: 1.11vw;
    text-align: center;
    padding: 2% 10% 2% 10%; }
    .trademark a {
      text-decoration: none;
      color: red; }
}

@media screen and (max-width: 600px) {

h1 {
    text-align: center;
    font-size: 0.5em;
    font-weight: normal;
    letter-spacing: 0.5px;
    margin: 0;
    color: white;
    font-family: "Merriweather", serif; }

  h2 {
    text-align: center;
    font-size: 2em;
    letter-spacing: 1px;
    line-height: 1;
    margin: 0;
    color: white;
    font-family: "Caveat", cursive; }

  p {
    margin-top: 5%;
    margin-bottom: 5%; }

  .b {
    color: black; }

  .text-left {
    display: block;
    text-align: center;
    line-height: 1.5; }

  .text-center {
    display: block;
    text-align: center;
    line-height: 1.5; }

  .text-right {
    display: block;
    text-align: center;
    line-height: 1.5; }

  .text-float {
    position: absolute; }

  body {
    margin: 0;
    overflow-x: hidden;}

html{
        margin: 0;
    }


  .blank {
    display: block;
    position: relative; }

  .empty {
    height: 30px; }

  .quote-center {
    padding: 0 14% 0 14%;
    font-size: 3.2vh;
    position: relative;
    font-family: "Caveat", cursive;
    font-weight: bold; }

  .quote-left {
    padding: 0 14% 0 14%;
    font-size: 3.2vh;
    position: relative;
    font-family: "Caveat", cursive;
    font-weight: bold; }

  .quote-right {
    padding: 0 14% 0 14%;
    font-size: 3.2vh;
    position: relative;
    font-family: "Caveat", cursive;
    font-weight: bold; }

  .medium-center {
    padding: 0 5% 0 5%;
    font-size: 3vh;
    position: relative;
    font-family: "Slabo 27px", serif; }

  .medium-left {
    padding: 0 5% 0 5%;
    font-size: 3vh;
    position: relative;
    font-family: "Slabo 27px", serif; }

  .medium-right {
    padding: 0 5% 0 5%;
    font-size: 3vh;
    position: relative;
    font-family: "Slabo 27px", serif; }

  .small-center {
    padding: 0 5% 0 5%;
    font-size: 3vh;
    position: relative;
    font-family: "Slabo 27px", serif; }

  .small-right {
    padding: 0 5% 0 5%;
    font-size: 3vh;
    position: relative;
    font-family: "Slabo 27px", serif; }

  .small-left {
    padding: 0 5% 0 5%;
    font-size: 3vh;
    position: relative;
    font-family: "Slabo 27px", serif; }

  /*.big-center
   * padding: 0 22.5% 0 22.5%
   * font-size: 22px
   * position: relative
   * font-family: 'PT Serif', serif */

  .big-left {
    padding: 0 5% 0 5%;
    font-size: 3vh;
    position: relative;
    font-family: "Slabo 27px", serif; }

  .big-right {
    padding: 0 5% 0 5%;
    font-size: 3vh;
    position: relative;
    font-family: "Slabo 27px", serif; }


  .vids {
    padding: 0 0 0 0; }

  .iframe-container {
    position: relative;
    width: 100%;
    padding: 0 0 56.25% 0;
    height: 0;
    box-sizing: border-box; }

  .iframe-container iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; }


  img {
    position: relative;
    width: 100%;
    display: block;
    margin-left: auto;
    margin-right: auto; }

  .pics-pics { }
    .pics-pics figure {
      position: relative;
      transition: 0.3s ease-in-out; }
      .pics-pics figure.is-showing {
        opacity: 1; }


  .mobile-pics{
    position: relative;
    width: 100%;
    display: block;
  }
    

.overlay-desktop {display: none;}
    
.overlay-mobile{
    /* Height & width depends on how you want to reveal the overlay (see JS below) */    
    height: 100vh;
    width: 100%;
    position: fixed; /* Stay in place */
    z-index: 15; /* Sit on top */
    left: 0;
    top: 0;
    background-color: rgb(0,0,0); /* Black fallback color */
    background-color: rgba(0,0,0, 0.5); /* Black w/opacity */
    overflow-x: hidden; /* Disable horizontal scroll */
    transition: 0.5s; /* 0.5 second transition effect to slide in or slide down the overlay (height or width, depending on reveal) */
}

/* Position the content inside the overlay */
.overlay-content-mobile {
    position: relative;
    width: 90%; /* 100% width */
    text-align: center; /* Centered text/links */
    margin-top: 20%;
    padding: 0 5% 0 5%;
}

/* Position the close button (top right corner) */
.overlay-mobile .closebtn {
    position: absolute;
    top: 3%;
    right: 10%;
    font-size: 50px;
    text-decoration: none;
    color: rgb(238, 0, 0);
}
    
    .desktop{display: none;}
    
.button2
    {
       background-color: rgb(238, 0, 0);
        color: white;
        text-align: center;
        font-size: 1.5vh;
        transition: 0.3s;
        display: inline-block;
        text-decoration: none;
        cursor: pointer;
        margin: 2.5vh 2vw 0.5vh 2vw;
        padding: 3%;
        border: none;
        border-radius: 8px;
        font-family: Arial, Helvetica, sans-serif;
        width: 65vw;
    }
    
.button2 a
    {
        color: white;
        text-align: center;
        font-size: 1.5vh;
        opacity: 0.8;
        text-decoration: none;
    }
    

.b-a, .bar, .bar:before, .bar:after {
    transition: all .25s;
    content: "";
    position: absolute;
    left: 0;
    height: 6px;
    width: 30px;
    border-radius: 15px;
    background-color: rgb(238, 0, 0, 0.5);
  }

  .menu-collapsed {
    transition: all .25s;
    position: fixed;
    top: 10px;
    left: 9px;
    height: 20px;
    width: 20px;
    z-index: 5;
    cursor: pointer;
  }
  .menu-collapsed ul {
    transition: all 0s;
    position: fixed;
    left: -9000px;
  }

  .bar {
    position: fixed;
    left: 12px;
    top: 24px;
  }
  .bar:before {
    top: -8px;
  }
  .bar:after {
    top: 8px;
  }

  .b-a-expanded, .menu-expanded .bar:before, .menu-expanded .bar:after {
    transition: all .25s;
    top: -0px;
  }

  .menu-expanded {
    transition: all .25s;
    text-align: center;
    height: 100%;
    width: 100%;
    border-radius: 0px;
    padding-top: 5%;
    top: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.85);
  }
  .menu-expanded ul {
    transition: all 0s;
    position: relative;
    left: 0;
    z-index: 1;
  }
  .menu-expanded a {
    transition: all .15s;
    font-family: "Caveat", cursive;
    text-decoration: none;
    font-size: 3vh;
    padding: 4.5%;
    color: #fff;
    display: block;
  }
  .menu-expanded a:hover {
    background-color: rgba(255, 255, 255, 0.8);
    transition: all .15s;
    letter-spacing: 2px;
    color: #333;
    border: 1px solid rgba(255, 255, 255, 0.15);
  }
  .menu-expanded .bar {
    background-color: transparent;
    transition: all .25s;
  }
  .menu-expanded .bar:before {
    transform: rotate(45deg);
      background-color: rgb(238, 0, 0);
  }
  .menu-expanded .bar:after {
    transform: rotate(-45deg);
      background-color: rgb(238, 0, 0);
  }
    
    .rage-float
    {
        display: none;
    }

  #chap-scroll {
    display: none;}
    
    .style-graphics
    {
       display: none;
                  
    }
    
    .button
    {
       background-color: dimgray;
        color: white;
        margin-top: 1%;
        text-align: center;
        font-size: 2vh;
        transition: 0.3s;
        display: inline-block;
        text-decoration: none;
        cursor: pointer;
        border: none;
    }

  section {
    perspective: 1000px; }


  #title {
    width: 100vw;
    height: 50vh; }

  .headline {
    position: relative;
    background-color: black;
    background-repeat: no-repeat;
    height: 100vh;
    padding-top: 20%; }

  .intro {
    padding: 0 3% 0 3%;
    text-align: center;
    line-height: 1.5;
    color: white;
    font-size: 4.27vw;
    position: relative;
    font-family: "Slabo 27px", serif; }

    .chap-header-01
    {
      display: none;
    }

  .building-intro {
    position: relative;
    content: "";
    overflow: hidden;
    height: auto;
    width: 100%;
    background-image: url(media/Romuana-02.png);
    background-size: 125%;
    background-position: bottom center;
    background-attachment: relative;
    background-repeat: no-repeat; }

  .man-fall {
    height: 26vw;
    width: 26vw;
    background-image: url(media/Romuana-04.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 50%;
    position: relative;
    top: 3%;
    left: 51%;
    -ms-transform: translate(-50%, 0);
    transform: translate(-50%, 0); }

  .fall {
    height: 26vw;
    width: 26vw;
    background-image: url(media/Romuana-05.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 50%;
    position: relative;
    top: 3%;
    left: 52%;
    -ms-transform: translate(-50%, 0);
    transform: translate(-50%, 0); }

  .big-cloud {
    height: auto;
    width: 100%;
    position: relative;
    color: black}

  .black-across {
    position: relative;
    height: auto;
    overflow: hidden; }

  .mid-building-01 {
    display: none; }

  .mid-building-02 {display: none;}

  .mid-building-03 {display: none;}

  .dbody {
    display: none; }

  .guard {
    display: none;}

  .fog {
    display: none; }

  .footer01 {
    position: relative;
    height: 25vh;
    width: 100%;
    z-index: -5;
    overflow: show;
    background-image: url(media/Romuana-footer-mobile.png);
    background-size: 100%;
    background-position: top center;
    background-attachment: scroll;
    background-repeat: no-repeat; }

  .fade-02 {
    box-sizing: border-box;
    position: relative;
    height: auto;
    width: 100%;
    padding-top: 47%;
    overflow: show;
    color: white;
    background-image: url(media/Stop-mobile-02.png);
    background-size: 100%;
    background-position: top center;
    background-attachment: relative;
    background-repeat: no-repeat; }

  .chap-header-02{
    position: relative;
    height: auto;
  }

  .hand {display: none;
     }

  .card { height: 23vh;
    width: 100%;
    background-image: url(media/Stop-mobile-03.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100%;
    position: absolute;
    top: 2%;
    transition: 1s ease-in-out; }

  .barb-wire {
    position: relative;
    box-sizing: border-box;
    height: auto;
    width: 100%; }

  .protest-bg {
    position: relative;
    box-sizing: border-box;
    height: auto;
    width: 100%; }

  .protest-left {
    position: relative;
    height: 50vh;
    width: 100%;
    background-image: url(media/protest-gfx.png);
    background-size: 100%;
    background-position: center center;
    background-attachment: scroll;
    background-repeat: no-repeat; }

  .protest-right { display: none; }

  .footer02 {
    position: relative;
    height: 20vh;
    padding-top: 3%;
    padding-left: 5%;
    background-image: url(media/Stop-being-refugee-footer.png);
    background-size: 100%;
    background-position: bottom center;
    background-repeat: no-repeat; }

  .card-footer {
   display: none; }

  .header03 {
    position: relative;
    height: auto;
    padding-top: 10%;
    padding-bottom: 70%;
    box-sizing: border-box;
    color: white;
    background-image: url(media/Lalfima-mobile-02.png);
    background-position: bottom center;
    background-repeat: no-repeat;
    background-size: 100%;
    position: relative;}

  .chap-header-03 {
    position: relative;
    height: auto; }

  .shop {
    height: auto;
    width: 100%;
    top: 20%; }

  .lil-cloud-1 {
    height: 40vw;
    width: 40vw;
    background-image: url(media/Lalfaima-04.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100%;
    position: absolute;
    top: -5%;
    left: 55%; }

  .lil-cloud-2 {
    height: 40vw;
    width: 40vw;
    background-image: url(media/Lalfaima-05.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100%;
    position: absolute;
    top: -1%;
    left: -5%; }

  .lil-cloud-3 {
      display: none;
  }

  .chin-map {
    height: auto;
    background-size: 100%; }

  #route {
    width: 100%;
    height: auto;
    position: relative;
    top: 0; }

  #route-play {
    position: relative;
    height: 20vw;
    background-image: url(media/route-play.png);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 90%; }

  #route-play:hover {
    position: relative;
    height: 20vw;
    background-image: url(media/route-play.png);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 100%; }

  .shop-road {
    height: auto;
    position: relative; }

  .imigresen {
    height: 32.5vw;
    width: 58.6vw;
    background-image: url(media/Lalfaima-10.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100%;
    position: relative;
    transition: 1s ease-in-out; }

  .footer03 {
    position: relative;
    height: auto;
    padding: 0 0 50% 0;
    min-width: 100%;
    background-image: url(media/Lalfaima-footer.png);
    background-size: 100%;
    background-position: bottom center;
    background-attachment: scroll;
    background-repeat: no-repeat;
    }

  .flower-footer {
    display: none; }

  .flower-fall {
    display: none;}

  .fade-04 {
    position: relative;
    height: auto;
    min-width: 100%;
    overflow: show;
    padding-bottom: 10%;
    color: white;
    background-image: url(media/Esther-mobile-03.png);
    background-size: 100%;
    background-position: bottom center;
    background-attachment: relative;
    background-repeat: no-repeat; }

  .chapter04 {
    padding: 35% 5% 0% 5%; }

  .child {
    height: 13vw;
    width: 13vw;
    background-image: url(media/Esther-04.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 95%;
    position: absolute;
    top: 6%;
    left: 47%;
    transition: 1s ease-in-out; }

  .dad {
    height: 32.5vw;
    width: 32.5vw;
    background-image: url(media/Esther-03.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100%;
    position: absolute;
    top: 5%;
    left: 33%; }

  .family {
    height: auto;
    position: relative;
    box-sizing: border-box}

  .hosp {
    position: relative;
    height: 62vh;
    min-width: 100%;
    overflow: show;
    background-image: url(media/Esther.png);
    background-size: 101%;
    background-position: bottom center;
    background-attachment: relative;
    background-repeat: no-repeat;
    }

  .footer04 {
      display: none;
  }

  .bush {
    display: none;}

  .waiter {
    display: none;}

  .customer {
    display: none; }

  .table {
    position: relative;
    height: auto;
    min-width: 100%;
    padding-top: 5%;
      padding-bottom: 65%;
    overflow: show;
    color: white;
    background-image: url(media/Thangte-mobile-01.png);
    background-size: 100%;
    background-position: bottom center;
    background-attachment: relative;
    background-repeat: no-repeat;
    margin-bottom: 5%;}

  .thangte {
    height: auto;
    width: 100%;
    position: relative;
    box-sizing: border-box;}

  .photo-frame {
    display: none;}

  .footer05 {
    position: relative;
    height: 25vh;
    max-width: 100%;
    background-image: url(media/Thangte-footer.png);
    background-size: 100%;
    background-position: top center;
    background-attachment: scroll;
    background-repeat: no-repeat; }

  .header06 {
    position: relative;
    box-sizing: border-box;
    height: auto;
    width: 100%;
    padding-top: 10%;
      padding-bottom: 50%;
    color: white;
    overflow: show;
    background-image: url(media/Bitter-pill-mobile-02.jpg);
    background-size: 100%;
    background-position: bottom center;
    background-attachment: relative;
    background-repeat: no-repeat; }

  .chap-header-06 {
    position: relative;
    height: auto;
    transition: 1.5s ease-in-out;
    opacity: 1;}

  .crowd-left {display: none;}

  .crowd-right {
    display: none;}

  .white-cloud {
    display: none;}

  .population-map {
    position: relative;
    height: 48vh;
    width: 100%;
    overflow: show;
    background-image: url(media/Bitter-pill-05.png);
    background-size: 100%;
    background-position: center center;
    background-attachment: relative;
    background-repeat: no-repeat; }

  .pill-bottle {
    display: none;}

  .pills {
    display: none;}

  .footer06 {
    position: relative;
    height: auto;
      padding-bottom: 43%;
    max-width: 100%;
    background-image: url(media/Bitter-pill-footer.png);
    background-size: 100%;
    background-position: bottom center;
    background-attachment: scroll;
    background-repeat: no-repeat; }

  .header07 {
    position: relative;
    height: auto;
    width: 100%;
    padding-top: 10%;
    padding-bottom: 43%;
    color: white;
    overflow: show;
    background-image: url(media/Broken-trust-mobile-02.png);
    background-size: 100%;
    background-position: bottom center;
    background-attachment: relative;
    background-repeat: no-repeat; }

  .chap-header-07 {
    position: relative;
    height: auto;
    transition: 1.5s ease-in-out;
    opacity: 1; }

  .cliff-left {display: none; }

  .cliff-right { display: none;}

  .rubbles { display: none;}

  .hand-07 {
    position: relative;
    height: auto;
    max-width: 100%;
    margin-top: 7%; }

  .money-bulk { display: none; }

  .money-single { display: none;}

  .footer07 {
    position: relative;
    height: 30vh;
    max-width: 100%;
    background-image: url(media/Broken-trust-footer.png);
    background-size: 100%;
    background-position: bottom center;
    background-attachment: scroll;
    background-repeat: no-repeat; }

  .burried-01 {
    display: none;}

  .burried-02 {
    display: none; }

  .burried-03 {
    display: none; }

  .header08 {
    position: relative;
    height: auto;
    width: 100%;
      padding-top: 10%;
    overflow: show;
      color: white;
    background-image: url(media/No-option-header.png);
    background-size: 100%;
    background-position: top center;
    background-attachment: relative;
    background-repeat: no-repeat; }

  .chap-header-08 {
    position: relative;
    height: auto;
    transition: 1.5s ease-in-out;
    opacity: 1; }

  .left-sign {
    display: none;}

  .center-sign {
    display: none;}

  .right-sign {
    display: none; }

  .cross-road {
    position: relative;
    height: auto;
    width: 100%;
    padding-top: 70%;
    overflow: show;
    box-sizing: border-box}

  .resettlement-stat {
    position: relative;
    height: 52vh;
    max-width: 100%;
    padding-bottom: 3%;
    background-image: url(media/No-option-04.png);
    background-size: 80%;
    background-position: center bottom;
    background-attachment: scroll;
    background-repeat: no-repeat; }

  .resettlement-stat-red {
    position: absolute;
    height: 52vh;
    width: 100%;
    background-image: url(media/No-option-mobile-04.png);
    background-size: 80%;
    background-position: center bottom;
    background-attachment: scroll;
    background-repeat: no-repeat;
    padding-bottom: 3%; }

  .footer08 {
    position: relative;
    height: 40vh;
    max-width: 100%;
    background-image: url(media/No-option-mobile-03.png);
    background-size: 100%;
    background-position: bottom center;
    background-attachment: scroll;
    background-repeat: no-repeat; }

  .wire {
    display: none; }

  .people {
    display: none;}

  .header09 {
    position: relative;
    height: auto;
    width: 100%;
      padding-bottom: 20%;
    overflow: show;
    color: white;
    background-image: url(media/Fear-Desperation-header.png);
    background-size: 100%;
    background-position: bottom center;
    background-attachment: relative;
    background-repeat: no-repeat; }

  .chap-header-09 {
    position: relative;
    padding-top: 40%;
    height: auto;
    transition: 1.5s ease-in-out;
    opacity: 1;}

  .cry {
    position: absolute;
    left: 35%;
    top: 2%;
    height: 35vw;
    width: 35vw;
    background-image: url(media/Fear-Desperation-13.png);
    background-size: 80%;
    background-position: center center;
    background-attachment: scroll;
    background-repeat: no-repeat; }

  .hill01 { display: none;}

  .hill02 { display: none;}

  .hill03 {display: none;}

  .flying-papers {
    position: relative;
    height: auto;
    max-width: 100%; }

  .paper01 { display: none; }

  .paper02 { display: none; }

  .paper03 { display: none; }

  .country-stat {
    position: relative;
    height: auto;
    max-width: 100%;}

  .back-hill {
    height: auto;
    width: 100%;
      margin: 0;
      padding-bottom: 50%;
    background-image: url(media/Fear-footer.png);
    background-position: bottom center;
    background-repeat: no-repeat;
    background-size: 100%;
    position: relative; }

  .front-hill {
    display: none; }

  .house {
    display: none;}

  .final-chapter {
    position: relative;
    padding-bottom: 68%;
    height: auto;
    width: 100%;
    color: white;
    overflow: show;
    background-color: black;
    background-image: url(media/Going-home-mobile-01.png);
    background-size: 100%;
    background-position: bottom left;
    background-attachment: relative;
    background-repeat: no-repeat; }

  .chap-header-10 {
    position: relative;
    height: auto;
    transition: 1.5s ease-in-out;
    opacity: 1; }

  .final-footer {
    display: none; }

  .home {
    display: none;}

  .coffin {
    display: none; }

  .footer {
    position: relative;
    height: 40vh;
    width: 100%;
    background-image: url(media/Credits-mobile.png);
    background-size: 55%;
    background-position: top center;
    background-attachment: scroll;
    background-repeat: no-repeat; }

  .socmed-fb {
    display: none;}

  .socmed-ig {
    display: none; }

  .socmed-tw {
    display: none; }

  .trademark {
    border-top: 0.5px solid grey;
    font-size: 1.75vw;
    text-align: center;
    padding: 2% 10% 2% 10%; }
    .trademark a {
      text-decoration: none;
      color: red; }

}