@charset "UTF-8";

.parallax-container {
  position: fixed;
  overflow-x: hidden;
  width: 100%;
  height: 800px;
  z-index: -200;
}
.parallax-layer {
  width: 2000px;
  position: fixed;
  left: 50%;
  top: 0;
  margin-left:-1000px;
  height: auto;
  transition: transform .8s cubic-bezier(0.23, 1, 0.32, 1) 0s; 
  transform: translateY(0px);
}

.sky {
  z-index: 5;
  top: -30px;
}
.trees {
  z-index: 30;
  top: -100px;
}
.city {
  z-index: 25;
  top: -100px;
}
.mountain-1 {
  z-index: 20;
  top: -100px;
}

.cloud-1 {
  z-index: 17;
  top: 400px;
  height: 250px;
  width: 50%;
}

.cloud-2 {
  z-index: 18;
  top: 460px;
  height: 250px;
  width: 50%;
}

.cloud-3 {
  z-index: 17;
  top: 500px;
  height: 250px;
  width: 50%;
}

.mountain-2 {
  z-index: 15;
  top: -80px;
}
.mountain-3 {
  z-index: 10;
  top: -70px;
}

.color-block {
  z-index: 14;
  background-color: #0F0D0B;
  height: 500px;
  width: 100%;
  margin:0;
  left:0;
  top: 659px;
}