/* Page Loading Zoom out */
.zoom-out {
  animation: animatebottom 2s ease;
}

@keyframes animatebottom {
  0% {
    transform: scale(2, 2);
  }
  100% {
    transform: scale(1, 1);
  }
}

.moveUpAndDown {
  animation: up-down 2.5s ease-in-out infinite alternate-reverse both;
}

@keyframes up-down {
  0% {
    transform: translateY(20px);
  }

  100% {
    transform: translateY(-20px);
  }
}

/* Background - designs 1 */
@keyframes bg-pan-left {
  0% {
		background-position: 0% 50%;
	}
	50% {
		background-position: 100% 50%;
	}
	100% {
		background-position: 0% 50%;
	}
}

.BackgroundColor1 {
  background-image: url("../images/BG1.jpg");
  background-size: cover;
  background-attachment: fixed;
  background-position: center;
}

.BackgroundColor2 {
  background-image: url("../images/BG2.jpg");
  background-size: cover;
  background-attachment: fixed;
  background-position: center;
}

.BackgroundColor3 {
  background-image: url("../images/BG3.jpg");
  background-size: cover;
  background-attachment: fixed;
  background-position: center;
}

.BackgroundColor4 {
  background-image: url("../images/BG4.jpg");
  background-size: cover;
  background-attachment: fixed;
  background-position: center;
}

.BackgroundColor5 {
  background-image: url("../images/BG5.jpg");
  background-size: cover;
  background-attachment: fixed;
  background-position: center;
}

.BackgroundColor6 {
  background-image: url("../images/BG6.jpg");
  background-size: cover;
  background-attachment: fixed;
  background-position: center;
}

.BackgroundColor7 {
  background-image: url("../images/BG7.jpg");
  background-size: cover;
  background-attachment: fixed;
  background-position: center;
}

.BackgroundColor8 {
  background-image: url("../images/BG8.jpg");
  background-size: cover;
  background-attachment: fixed;
  background-position: center;
}

/* Text Animations */
.animate__TextColorAnimation
{
   text-transform: uppercase;
  background-image: linear-gradient(
    -225deg,
    #231557 0%,
    #44107a 29%,
    #ff1361 67%,
    #fff800 100%
  );
  background-size: auto auto;
  background-clip: border-box;
  background-size: 200% auto;
  color: #fff;
  background-clip: text;
  text-fill-color: transparent;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: textclip 2s linear infinite;
}

@keyframes textclip {
  to {
    background-position: 200% center;
  }
}