body{
  margin: 0;
  padding:0;
  overeflow-x: hidden;
  overflow-y:auto;
  backface-visibility: hidden;
}
#overlay{
  background-color: #000;
  position:fixed;
  width: 100%;
  height:100%;
  z-index: 99;
  opacity:0.08;
}

main{
  width:100%;
  height:100vh;
  overflow:hidden;
}

#scene{
  padding: 0;
  margin: 0;
  width: 115%;
  height: 120vh;
  overflow:hidden;
  top:-5%;
  left:-5%;
  transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
}

.wrapper{
  position: absolute;
  top:50%;
  left:50%;
  z-index:101;
  transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
  text-align: center;
}
.wrapper img{
  width: 500px;
  height: auto;
}
.layer{
  width: 110%;
  height: 120vh;
  overflow:hidden;
}
.layer2{
  background-image:url(../../images/layer2.png)
  background-position: center;
  background-size: cover;
  position: absolute;
  width:100%;
  height:100%;
  left:-5%;
  top:-5%;
}
.layer1{
  background-image:url(../../images/layer1.png);
  background-size:cover;
  background-position:center;
  position:absolute;
  width: 100%;
  height: 100%;
  left: -5%;
  top: -5%;
}

@media (max-width:700px) {
    .layer2 {
        background-size: cover;
        background-position: center;
        width: 167%;
        height: 77vh;
        left: -69%;
        top: 27%;
    }
    
    .layer1 {
        background-position: center;
        background-size: cover;
        width: 100%;
        height: 115%;
        left: -5%;
        top: -1%;
    }    
    
    .wrapper img {
        width: 180px;
        height: auto;
    }
}