
/* ----------------------------------------------------------------
	Parallax Effect
-----------------------------------------------------------------*/

.parallax {
  -webkit-perspective: 100px;
          perspective: 100px;
  height: 100vh;
  overflow-x: hidden;
  overflow-y: auto;
  position: absolute;
  top: 0;
  left: 1000px;
  right: 0px;
  bottom: 0;
  margin-left: -1500px;
}

.parallax__layer {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.parallax__layer img {
  display: block;
  position: absolute;
  bottom: 0;
}

.parallax__cover {
  background: #000820;
  display: block;
  position: absolute;
  top: 100%;
  left: 500px;
  right: 0;
  height: 2550px;
  z-index: 2;
}

.parallax__layer__0 {
  -webkit-transform: translateZ(-300px) scale(4);
          transform: translateZ(-300px) scale(4);
}

.parallax__layer__1 {
  -webkit-transform: translateZ(-250px) scale(3.5);
          transform: translateZ(-250px) scale(3.5);
}

.parallax__layer__2 {
  -webkit-transform: translateZ(-200px) scale(3);
          transform: translateZ(-200px) scale(3);
}

.parallax__layer__3 {
  -webkit-transform: translateZ(-150px) scale(2.5);
          transform: translateZ(-150px) scale(2.5);
}

.parallax__layer__4 {
  -webkit-transform: translateZ(-100px) scale(2);
          transform: translateZ(-100px) scale(2);
}

.parallax__layer__5 {
  -webkit-transform: translateZ(-50px) scale(1.5);
          transform: translateZ(-50px) scale(1.5);
}

.parallax__layer__6 {
  -webkit-transform: translateZ(0px) scale(1);
          transform: translateZ(0px) scale(1);
}



@media screen and (max-width: 1366px) {
    
.parallax {
  -webkit-perspective: 100px;
          perspective: 100px;
  height: 100vh;
  overflow-x: hidden;
  overflow-y: auto;
  position: absolute;
  top: 0;
  left: 50%;
  right: 0;
  bottom: 0;
  margin-left: -1500px;
}

.parallax__layer {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.parallax__layer img {
  display: block;
  position: absolute;
  bottom: 0;
}

.parallax__cover {
  background: #000820;
  display: block;
  position: absolute;
  top: 100%;
  left: 800px;
  right: 0;
  height: 335%;
  z-index: 2;
}
    .page-content {
        margin-left: -30px;
    }

.parallax__layer__0 {
  -webkit-transform: translateZ(-300px) scale(4);
          transform: translateZ(-300px) scale(4);
}

.parallax__layer__1 {
  -webkit-transform: translateZ(-250px) scale(3.5);
          transform: translateZ(-250px) scale(3.5);
}

.parallax__layer__2 {
  -webkit-transform: translateZ(-200px) scale(3);
          transform: translateZ(-200px) scale(3);
}

.parallax__layer__3 {
  -webkit-transform: translateZ(-150px) scale(2.5);
          transform: translateZ(-150px) scale(2.5);
}

.parallax__layer__4 {
  -webkit-transform: translateZ(-100px) scale(2);
          transform: translateZ(-100px) scale(2);
}

.parallax__layer__5 {
  -webkit-transform: translateZ(-50px) scale(1.5);
          transform: translateZ(-50px) scale(1.5);
}

.parallax__layer__6 {
  -webkit-transform: translateZ(0px) scale(1);
          transform: translateZ(0px) scale(1);
}

	
}  


@media screen and (max-width: 1200px) {
    
.parallax {
  -webkit-perspective: 100px;
          perspective: 100px;
  height: 100vh;
  overflow-x: hidden;
  overflow-y: auto;
  position: absolute;
  top: 0;
  left: 50%;
  right: 0;
  bottom: 0;
  margin-left: -1500px;
}

.parallax__layer {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.parallax__layer img {
  display: block;
  position: absolute;
  bottom: 0;
}

.parallax__cover {
  background: #000820;
  display: block;
  position: absolute;
  top: 100%;
  left: 930px;
  right: 0;
  height: 220%;
  z-index: 2;
}

.parallax__layer__0 {
  -webkit-transform: translateZ(-300px) scale(4);
          transform: translateZ(-300px) scale(4);
}

.parallax__layer__1 {
  -webkit-transform: translateZ(-250px) scale(3.5);
          transform: translateZ(-250px) scale(3.5);
}

.parallax__layer__2 {
  -webkit-transform: translateZ(-200px) scale(3);
          transform: translateZ(-200px) scale(3);
}

.parallax__layer__3 {
  -webkit-transform: translateZ(-150px) scale(2.5);
          transform: translateZ(-150px) scale(2.5);
}

.parallax__layer__4 {
  -webkit-transform: translateZ(-100px) scale(2);
          transform: translateZ(-100px) scale(2);
}

.parallax__layer__5 {
  -webkit-transform: translateZ(-50px) scale(1.5);
          transform: translateZ(-50px) scale(1.5);
}

.parallax__layer__6 {
  -webkit-transform: translateZ(0px) scale(1);
          transform: translateZ(0px) scale(1);
}

	

    
}



@media screen and (max-width: 1024px) {
    
.parallax {
  -webkit-perspective: 100px;
          perspective: 100px;
  height: 100vh;
  overflow-x: hidden;
  overflow-y: auto;
  position: absolute;
  top: 0;
  left: 50%;
  right: 0;
  bottom: 0;
  margin-left: -1500px;
}

.parallax__layer {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.parallax__layer img {
  display: block;
  position: absolute;
  bottom: 0;
}

.parallax__cover {
  background: #000820;
  display: block;
  position: absolute;
  top: 100%;
  left: 1010px;
  right: 0;
  height: 316%;
  z-index: 2;
}

.parallax__layer__0 {
  -webkit-transform: translateZ(-300px) scale(4);
          transform: translateZ(-300px) scale(4);
}

.parallax__layer__1 {
  -webkit-transform: translateZ(-250px) scale(3.5);
          transform: translateZ(-250px) scale(3.5);
}

.parallax__layer__2 {
  -webkit-transform: translateZ(-200px) scale(3);
          transform: translateZ(-200px) scale(3);
}

.parallax__layer__3 {
  -webkit-transform: translateZ(-150px) scale(2.5);
          transform: translateZ(-150px) scale(2.5);
}

.parallax__layer__4 {
  -webkit-transform: translateZ(-100px) scale(2);
          transform: translateZ(-100px) scale(2);
}

.parallax__layer__5 {
  -webkit-transform: translateZ(-50px) scale(1.5);
          transform: translateZ(-50px) scale(1.5);
}

.parallax__layer__6 {
  -webkit-transform: translateZ(0px) scale(1);
          transform: translateZ(0px) scale(1);
}

	
}


@media screen and (max-width: 1024px)and (orientation: landscape) {
.parallax__cover {
        background: #000820;
        display: block;
        position: absolute;
        top: 100%;
        left: 988px;
        right: 0;
        height: 325%;
        z-index: 2;
    }

}

@media only screen and (min-device-width: 768px)and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 1) {

.parallax__cover {
        background: #000820;
        display: block;
        position: absolute;
        top: 100%;
        left: 1004px;
        right: 0;
        height: 165%;
        z-index: 2;
    }

}


@media screen and (max-width: 767px) {
    
.parallax {
  -webkit-perspective: 100px;
          perspective: 100px;
  height: 100vh;
  overflow-x: hidden;
  overflow-y: auto;
  position: absolute;
  top: 0;
  left: 50%;
  right: 0;
  bottom: 0;
  margin-left: -1500px;
}

.parallax__layer {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.parallax__layer img {
  display: block;
  position: absolute;
  bottom: 0;
}

.parallax__cover {
  background: #000820;
  display: block;
  position: absolute;
  top: 100%;
  left: 1250px;
  right: 0;
  height: 50%;
  z-index: 2;
}

.parallax__layer__0 {
  -webkit-transform: translateZ(-300px) scale(4);
          transform: translateZ(-300px) scale(4);
}

.parallax__layer__1 {
  -webkit-transform: translateZ(-250px) scale(3.5);
          transform: translateZ(-250px) scale(3.5);
}

.parallax__layer__2 {
  -webkit-transform: translateZ(-200px) scale(3);
          transform: translateZ(-200px) scale(3);
}

.parallax__layer__3 {
  -webkit-transform: translateZ(-150px) scale(2.5);
          transform: translateZ(-150px) scale(2.5);
}

.parallax__layer__4 {
  -webkit-transform: translateZ(-100px) scale(2);
          transform: translateZ(-100px) scale(2);
}

.parallax__layer__5 {
  -webkit-transform: translateZ(-50px) scale(1.5);
          transform: translateZ(-50px) scale(1.5);
}

.parallax__layer__6 {
  -webkit-transform: translateZ(0px) scale(1);
          transform: translateZ(0px) scale(1);
}

}



/* -------------------------------
   Phone
   ------------------------------- */


@media screen and (max-width: 480px) {
    
    
.parallax {
  -webkit-perspective: 100px;
          perspective: 100px;
  height: 100vh;
  overflow-x: hidden;
  overflow-y: auto;
  position: absolute;
  top: 0;
  left: 50%;
  right: 0;
  bottom: 0;
  margin-left: -1500px;
}

.parallax__layer {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.parallax__layer img {
  display: block;
  position: absolute;
  bottom: 0;
}

.parallax__cover {
  background: #000820;
  display: block;
  position: absolute;
  top: 100%;
  left: 1450px;
  right: 0;
  height: 735%;
  z-index: 2;
}

	
.parallax__layer__0,
.parallax__layer__1,
.parallax__layer__2,
.parallax__layer__3,
.parallax__layer__4,
.parallax__layer__5,
.parallax__layer__6 {
        -webkit-transform: none;
        transform: none;
    }
    
}


/* -------------------------------
   Small Phone
   ------------------------------- */


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



    .parallax {
        -webkit-perspective: 100px;
        perspective: 100px;
        height: 100vh;
        overflow-x: hidden;
        overflow-y: auto;
        position: absolute;
        top: 0;
        left: 60%;
        right: 0;
        bottom: 0;
        margin-left: -1500px;
    }

    .parallax__layer {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
    }

    .parallax__layer img {
        display: block;
        position: absolute;
        bottom: 0;
    }

    .parallax__cover {
        background: #000820;
        display: block;
        position: absolute;
        top: 100%;
        left: 1250px;
        right: 0;
        height: 723%;
        z-index: 2;
    }
	
	
	.parallax__layer__0,
	.parallax__layer__1,
	.parallax__layer__2,
	.parallax__layer__3,
	.parallax__layer__4,
	.parallax__layer__5,
	.parallax__layer__6 {
        -webkit-transform: none;
        transform: none;
    }
    
}


/* Portrait */
@media only screen
and (min-device-width: 375px) and (max-device-width: 667px) and (-webkit-min-device-pixel-ratio: 2)and (orientation: portrait) {

    .parallax__cover {
        background: #000820;
        display: block;
        position: absolute;
        top: 100%;
        left: 1294px;
        right: 0;
        height: 650%;
        z-index: 2;
    }
}

/* Landscape */
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (-webkit-min-device-pixel-ratio: 2)and (orientation: landscape) {

    .parallax__cover {
        background: #000820;
        display: block;
        position: absolute;
        top: 100%;
        margin-left: -28px;
        height: 670%;
        z-index: 2;
    }
    
}



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

.parallax__layer__0,
.parallax__layer__1,
.parallax__layer__2,
.parallax__layer__3,
.parallax__layer__4,
.parallax__layer__5,
.parallax__layer__6 {
        -webkit-transform: none;
        transform: none;
    }

}
