.baseImg{width:100vw;height:30vw;}
.hero-banner{ position: relative;
   // padding-top: 35vw;
    background-image: url(../images/anim_images/BgRectangle.png);
    background-position: center;
    background-size: 100% 100%;
    background-repeat: no-repeat;background-color: #ffdd51;
}
.hero_banner_bg{
 background-image: url(../images/anim_images/BgRectangle_slider1.png); background-position: center;
    background-size: 103% 103%;
    background-repeat: no-repeat;background-color: #ffdd51;background-position:0 -8vw;
}

.about-outer-container {
    scroll-snap-type: y mandatory;
}
.about-slide-outer {
    scroll-snap-align: start;
}
.about-slide-outer {
    width: 100%;
    min-height: 100vh;
    position: -webkit-sticky;
    position: sticky;
    top: 0;
}
.about-slide-outer.slide-invisible {
    position: -webkit-sticky;
    position: sticky;
}
.slide-invisible {
    opacity: 1 !important;
}
.about-slide.about-slide2 {
    overflow: hidden;
}
.about-slide {
    z-index: 9996;
    opacity: 1;
    justify-content: center;
    width: 100%;
    min-height: 90vh;
    display: flex;
    position: relative;
    border: 1px solid #fff;
}
.slider_flex{background: #D4D0FF;
    align-items: center;
    justify-content: center;
    display: flex;}
	.homesectionText,.slider_carousel,.slider_carousel2{flex:1;}
	.homesectionText{padding:50px 0 0;}
#carouselSliderIndicators{background: linear-gradient(0deg, rgba(255,269,239,1) 0%, rgba(255,221,81,1) 100%);}
.roundTableImg {
    position: absolute;
    left: 0;
    width: 86vw;
    right: 0;
    margin: 0 auto;
    bottom: -1vw;
	transform-origin: top center;
	animation: swing 2s ease infinite;
	//-webkit-animation: spin 5s linear infinite; /* Safari browser */
 // animation: spin 5s linear infinite;
}
/* for Safari browser  */
@keyframes swing {
	20% { transform: rotate(0.2deg); }	
	40% { transform: rotate(-0.2deg); }
	60% { transform: rotate(0.2deg); }	
	80% { transform: rotate(-0.2deg); }	
	100% { transform: rotate(0deg); }
}


@keyframes spin {
  0% {transform: rotateZ(0deg); }
  100% {transform: rotateZ(360deg); }
}
.worldImg {
    position: absolute;
    left: -19vw;
    width: 7vw;
    right: 0;
    margin: 0 auto;
    bottom: 34vw;
	 animation-name: rotate;
  animation-duration: 12s;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
  -webkit-animation-name: rotate;
}
.Slider2_worldImg {
    position: absolute;
    left: -28vw;
    width: 7vw;
    right: 0;
    margin: 0 auto;
    bottom: 30vw;
	 animation-name: rotate;
  animation-duration: 12s;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
  -webkit-animation-name: rotate;
}
.thumsup1Img {
    position: absolute;
    left: 19vw;
    width: 9vw;
    right: 0;
    margin: 0 auto;
    bottom: 27vw;
    z-index: 2;
	animation: bounce2 2s ease infinite;
   //animation-name: rotate1;
  //animation-duration: 5s;
  animation-iteration-count: infinite;
  //animation-timing-function: linear;
 // -webkit-animation-name: rotate1;
}
.thumsupImg {
    position: absolute;
    left: 21vw;
    width: 9vw;
    right: 0;
    margin: 0 auto;
    bottom: 27.4vw;
    z-index: 2;
	animation: bounce2 2s ease infinite;
   animation-name: rotate1;
  animation-duration: 5s;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
 -webkit-animation-name: rotate1;
}
/*.bounce2 {
  animation: bounce2 2s ease infinite;
}*/
@keyframes bounce2 {
	0%, 20%, 50%, 80%, 100% {transform: translateY(0);}
	40% {transform: translateY(-30px);}
	60% {transform: translateY(-15px);}
}
@keyframes rotate1 {
  0% {
   transition:12s ease-out;
   transform:rotate(0deg) translate(0px, -1px);
  }
  
  25% {
    transition:12s ease-in;
  transform:rotate(-10deg) translate(0px, -2px);
  }
  50% {
    transition:12s ease-out;
   transform:rotate(0deg) translate(0px, -1px);
  }
  75% {
    transition:12s ease-in;
  transform:rotate(-10deg) translate(0px, -2px);
  }
  
  100% {
     transition:12s ease-out;
   transform:rotate(0deg) translate(0px, -1px);
  }
}


.icon3Img {
   position: absolute;
    left: -32vw;
    width: 7vw;
    right: 0;
    margin: 0 auto;
    bottom: 10vw;
    z-index: 3;
}
.Slider2_socialiconImg {
position: absolute;
    left: 0;
    width: 30vw;
    right: -61vw;
    margin: 0 auto;
    bottom: 15vw;
}
.socialiconImg {
    position: absolute;
    left: 0;
    width: 30vw;
    right: -50vw;
    margin: 0 auto;
    bottom: 13vw;
}
.icon2Img {
    position: absolute;
    left: 0;
    width: 18vw;
    right: -7vw;
    margin: 0 auto;
    bottom: 16vw;
}
.icon1Img {
   position: absolute;
    left: -14.5vw;
    width: 24vw;
    right: 0;
    margin: 0 auto;
    bottom: 8vw;
	z-index:2;
}
.Slider2_icon1Img {
   position: absolute;
    left: -35.2vw;
    width: 24vw;
    right: 0;
    margin: 0 auto;
    bottom: 8vw;
	z-index:2;
}
.potImg {
    position: absolute;
    bottom: 15vw;
    z-index: 1;
    width: 8vw;
    left: 21vw;
    right: 0;
    margin: 0 auto;
}
.loadingImg {
    position: absolute;
    left: -45vw;
    width: 8vw;
    right: 0;
    margin: 0 auto;
    bottom: 22vw;
    z-index: 3;
}
.dot-flashing {
  position: relative;
  width: 1vw;
  height: 0.9vw;
  border-radius: 1vw;
  background-color: #9880ff;
  color: #9880ff;
  animation: dotFlashing 1s infinite linear alternate;
  animation-delay: .5s;
}

.dot-flashing::before, .dot-flashing::after {
  content: '';
  display: inline-block;
  position: absolute;
  top: 0;
}

.dot-flashing::before {
 left: -1.5vw;
  width: 1vw;
  height: 0.9vw;
  border-radius: 1vw;
  background-color: #9880ff;
  color: #9880ff;
  animation: dotFlashing 1s infinite alternate;
  animation-delay: 0s;
}

.dot-flashing::after {
  left: 1.5vw;
  width: 1vw;
  height: 0.9vw;
  border-radius: 1vw;
  background-color: #9880ff;
  color: #9880ff;
  animation: dotFlashing 1s infinite alternate;
  animation-delay: 1s;
}

@keyframes dotFlashing {
  0% {
    background-color: #9880ff;
  }
  50%,
  100% {
    background-color: #ebe6ff;
  }
}
.thumsBgImg {
    position: absolute;
    width: 8.4vw;
    z-index: 1;
    bottom: 34vw;
    left: 18vw;
    right: 0;
    margin: 0 auto;
}
.stage {
    position: absolute;
    bottom: 25.5vw;
    left: -45.5vw;
    right: 0;
    margin: 0 auto;
    text-align: center;
    justify-content: center;
    display: flex;
    z-index: 5;
    rotate: -10deg;
    width: 10vw;
}
.vectorImg{position: absolute;
    bottom: 18vw;
    width: 51vw;
    left: 3vw;
    right: 0;
    margin: 0 auto;
}
@keyframes rotate {
  0% {
    -webkit-transform: rotate3d(0, 0, 1, 0deg);
    transform: rotate3d(0, 0, 1, 0deg);
  }
  25% {
    -webkit-transform: rotate3d(0, 0, 1, 90deg);
    transform: rotate3d(0, 0, 1, 90deg);
  }
  50% {
    -webkit-transform: rotate3d(0, 0, 1, 180deg);
    transform: rotate3d(0, 0, 1, 180deg);
  }
  75% {
    -webkit-transform: rotate3d(0, 0, 1, 270deg);
    transform: rotate3d(0, 0, 1, 270deg);
  }
  100% {
    -webkit-transform: rotate3d(0, 0, 1, 360deg);
    transform: rotate3d(0, 0, 1, 360deg);
  }
}
.arrowImg{
	position: absolute;
    left: 0;
    width: 1.5vw;
    right: -25.8vw;
    margin: 0 auto;
    bottom: 27.5vw;
    z-index: 2;
  -webkit-animation: switchOff 1s linear infinite alternate;
  animation: switchOff 1s linear infinite alternate;
}
.gamesImg{
	position: absolute;
    left: 0;
    width: 7.5vw;
    right: -51.7vw;
    margin: 0 auto;
    bottom: 19.2vw;
    z-index: 2;
  -webkit-animation: switchOff 1s linear infinite alternate;
  animation: switchOff 1s linear infinite alternate;
}

@keyframes switchOff {
  from {
  transition:12s ease-in;
    opacity: 0;
  }
  to {
  transition:12s ease-in;
    opacity: 1;
  }
}
.Slider2_potImg {
    position: absolute;
    bottom: 9vw;
    z-index: 11;
    width: 8vw;
    left: -56vw;
    right: 0;
    margin: 0 auto;
}
.slider2Img {
    position: absolute;
    bottom: 9vw;
    width: 57vw;
    left: 17vw;
    right: 0;
    margin: 0 auto;
}
 .playImg {
    position: absolute;
    bottom: 8.8vw;
    width: 20vw;
    left: 33vw;
    right: 0;
    margin: 0 auto;
    z-index: 1;
}
.playarrowImg {
   position: absolute;
    left: 0;
    width: 1.5vw;
	rotate:90deg;
    right: -27.5vw;
    margin: 0 auto;
    bottom: 14.3vw;
    z-index: 2;
  -webkit-animation: switchOff 1s linear infinite alternate;
  animation: switchOff 1s linear infinite alternate;
}
.Thumsdiv {
    position: relative;
    left: -8vw;
    bottom: -10vw;
}
.Slider2_gamesImg{
    right: -62.9vw;
    bottom: 21.1vw;
}
.Slider2_arrowImg{
    right: -36.8vw;
    bottom: 29.4vw;}
@media (max-width: 991px){
.about-slide{flex-direction: column;}
.slider_carousel img,.slider_carousel2 img{width: 40%;padding:3vw;}
.slider_flex{height: auto !important;}
.homesectionText, .slider_carousel, .slider_carousel2 {
    flex: auto;
}
.about-slide,.about-slide-outer{min-height:auto;}
.slider_carousel, .slider_carousel2{min-height:auto !important;}
.about-slide-outer{position:relative;}
}
@media (max-width: 590px){.slider_carousel img,.slider_carousel2 img{width: 80%;}}

