.sec1 {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: #34D3A7;
    z-index: 99999;
    height: 100vh;
    width: 0%;
    transition: all 400ms;
}

.sec2:before {
    position: fixed;
    content: '';
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: #000;
    z-index: 99999;
    height: 100vh;
    width: 0%;
    transition: all 400ms;
}

.loaded-overlay .sec1 {
    transition: all 1s;
    animation-name: load_anim1;
    width: 100%;
}

.loaded-overlay1 .sec2:before {
    animation-name: load_anim2;
    width: 100%;
    transition: all 1s;
}

@-webkit-keyframes load_anim1 {
    0% {
        transform: translateX(-100%);
    }
    10% {
        transform: translateX(-50%);
    }
    80% {
        transform: translateX(100%);
    }
    85% {
        transform: translateX(100%);
    }
    100% {
        transform: translateX(100%);
    }
}

@-webkit-keyframes load_anim2 {
    0% {
        transform: translateX(-100%);
    }
    10% {
        transform: translateX(-50%);
    }
    80% {
        transform: translateX(100%);
    }
    85% {
        transform: translateX(100%);
    }
    100% {
        transform: translateX(100%);
    }
}

.sec2 svg {
    width: auto;
}

.sec2 svg {
    width: 200px;
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    transform: translateY(50px);
    opacity: 0;
    transition-delay: 20s;
    z-index: 999999;
}

.hides .sec2,
.hides .sec2:before {
    right: 0;
    left: auto;
    width: 0;
}

.loaded-overlay2 .sec1 {
    right: 0;
    left: auto;
    width: 0;
}

.loaded-overlay2 .sec2 svg {
    transform: translateY(0px);
    opacity: 1;
    transition: all 400ms;
}

.load-complete {
    position: fixed;
    z-index: 999;
}

.load-complete:before {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    content: '';
    background: #000;
}

.hides:before {
    right: 0;
    left: auto;
}

.hides .sec2 svg {
    opacity: 0;
    visibility:hidden;
}

/* Failsafe: never leave the black loader covering the page if JS fails */
@keyframes swapa-loader-failsafe {
    to {
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
    }
}

#site-loader.load-complete:not(.hides) {
    animation: swapa-loader-failsafe 0.4s ease 4.5s forwards;
}


.hero-section::before {


    animation: move 3s infinite linear;

	transform:translate(15px);

	transition:all 400ms;

}



@-webkit-keyframes move {

  0%   {transform:translate(0px); }

  50% { transform:translate(30px); }

  100% { transform:translate(0px); }

}

@-moz-keyframes move {

   0%   {transform:translate(0px); }

  50% { transform:translate(30px); }

  100% { transform:translate(0px); }

}

@-o-keyframes move {

 0%   {transform:translate(0px); }

  50% { transform:translate(30px); }

  100% { transform:translate(0px); }

}

@keyframes move {

 0%   {transform:translate(0px); }

  50% { transform:translate(30px); }

  100% { transform:translate(0px); }

}








@keyframes shine {
  0% {
    left: -100px;
  }

  60% {
    left: 100%;
  }

  to {
    left: 100%;
  }
}


@keyframes steering-advanced {
  /* 0 → 180 */
  0%   { transform: rotate(0deg); }
  12.5% { transform: rotate(180deg); }

  /* hold at 180 */
  25%  { transform: rotate(180deg); }

  /* 180 → 0 */
  37.5% { transform: rotate(0deg); }

  /* hold at 0 */
  50%  { transform: rotate(0deg); }

  /* 0 → -180 */
  62.5% { transform: rotate(-180deg); }

  /* hold at -180 */
  75%  { transform: rotate(-180deg); }

  /* -180 → 0 */
  87.5% { transform: rotate(0deg); }

  /* hold at 0 */
  100% { transform: rotate(0deg); }
}




.swapa-concepts .sticky-parent .sticky .dim .detailed-cnt .des ul li figure:hover svg {
  animation: bounceIn 750ms linear infinite alternate;
  -moz-animation: bounceIn 750ms linear infinite alternate;
  /* -webkit-animation: bounceIn 750ms linear infinite alternate; */
  -o-animation: bounceIn 750ms linear infinite alternate;
}

@-webkit-keyframes bounceIn {
    0%, 20%, 40%, 60%, 80%, 100% {
    -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
}
0% {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
    transform: scale3d(.3, .3, .3);
}
20% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
}
40% {
    -webkit-transform: scale3d(.9, .9, .9);
    transform: scale3d(.9, .9, .9);
}
60% {
    opacity: 1;
    -webkit-transform: scale3d(1.03, 1.03, 1.03);
    transform: scale3d(1.03, 1.03, 1.03);
}
80% {
    -webkit-transform: scale3d(.97, .97, .97);
    transform: scale3d(.97, .97, .97);
}
100% {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
}
}
@keyframes bounceIn {
    0%, 20%, 40%, 60%, 80%, 100% {
    -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
}
0% {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
    -ms-transform: scale3d(.3, .3, .3);
    transform: scale3d(.3, .3, .3);
}
20% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    -ms-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
}
40% {
    -webkit-transform: scale3d(.9, .9, .9);
    -ms-transform: scale3d(.9, .9, .9);
    transform: scale3d(.9, .9, .9);
}
60% {
    opacity: 1;
    -webkit-transform: scale3d(1.03, 1.03, 1.03);
    -ms-transform: scale3d(1.03, 1.03, 1.03);
    transform: scale3d(1.03, 1.03, 1.03);
}
80% {
    -webkit-transform: scale3d(.97, .97, .97);
    -ms-transform: scale3d(.97, .97, .97);
    transform: scale3d(.97, .97, .97);
}
100% {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    -ms-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
}
}