/*Animation Css Start*/
.x-icon,.setting-icon {
    animation-name: spin;
    animation-duration: 5000ms;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}
@keyframes spin {
    0% {
        transform: rotateZ(0);
    }
    100% {
        transform: rotateZ(360deg);
    }
}
.equal-icon {
    animation-name: bounce;
    animation-duration: 2000ms;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}
@keyframes bounce {
    0%   { transform: translateY(0); }
    50%  { transform: translateY(-30px); }
    100% { transform: translateY(0); }
}
.plus-icon {
    animation-name: heartbeat;
    animation-duration: 1000ms;
    animation-iteration-count: infinite;
    animation-timing-function:linear ;
}
@keyframes heartbeat {
    0% {
        transform: scale(1);
    }
    25% {
        transform: scale(1.3);
    }
    40% {
        transform: scale(1.1);
    }
    60% {
        transform: scale(1.5);
    }
    100% {
        transform: scale(1);
    }
}
.down-wave-icon,.wave-icon {
    animation-name: wave;
    animation-duration: 3000ms;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
}
@-webkit-keyframes wave {
    0% { -webkit-transform: translate(2px, 1px) rotate(0deg); }
    10% { -webkit-transform: translate(-1px, -2px) rotate(-1deg); }
    20% { -webkit-transform: translate(-3px, 0px) rotate(1deg); }
    30% { -webkit-transform: translate(0px, 2px) rotate(0deg); }
    40% { -webkit-transform: translate(1px, -1px) rotate(1deg); }
    50% { -webkit-transform: translate(-1px, 2px) rotate(-1deg); }
    60% { -webkit-transform: translate(-3px, 1px) rotate(0deg); }
    70% { -webkit-transform: translate(2px, 1px) rotate(-1deg); }
    80% { -webkit-transform: translate(-1px, -1px) rotate(1deg); }
    90% { -webkit-transform: translate(2px, 2px) rotate(0deg); }
    100% { -webkit-transform: translate(1px, -2px) rotate(-1deg); }
}
.perspective-btn {
    animation: blobby-wiggle 6s ease-in-out infinite;
}
.input-border {
    animation-name:input-move;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    animation-duration: 3000ms;
}
.box-shake-animate,.slick-dots li {
    animation: blobby-wiggle 8s ease-in-out infinite;
 }
.clock-hand-animation {
    animation: clock-hand 4s linear infinite alternate;
    transform-origin: left center;
}

@keyframes button-move {
    0% { transform: translate(2px, 1px) rotate(0deg); }
    10% { transform: translate(5px, 1px) rotate(1deg); }
    30% { transform: translate(1px, 1px) rotate(-4deg); }
    60% { transform: translate(5px, 1px) rotate(6deg); }
    100% { transform: translate(3px, 1px) rotate(4deg); }
}
@-webkit-keyframes button-move {
    0% { -webkit-transform: translate(2px, 1px) rotate(0deg); }
    10% { -webkit-transform: translate(5px, 1px) rotate(1deg); }
    30% { -webkit-transform: translate(1px, 1px) rotate(-4deg); }
    60% { -webkit-transform: translate(5px, 1px) rotate(6deg); }
    100% { -webkit-transform: translate(3px, 1px) rotate(4deg); }
}
@keyframes input-move {
    0%,
    100% {
        -webkit-transform: scale(1, 1) rotate(0deg) translateZ(0);
        transform: scale(1, 1) rotate(0deg) translateZ(0)
    }
    21% {
        -webkit-transform: scale(1.76, 0.46) rotate(-9deg) translateZ(0);
        transform: scale(1.76, 0.46) rotate(-9deg) translateZ(0)
    }
    50% {
        -webkit-transform: scale(0.82, 1.21) rotate(13deg) translateZ(0);
        transform: scale(0.82, 1.21) rotate(13deg) translateZ(0)
    }
}
@-webkit-keyframes input-move {
    0%,
    100% {
        -webkit-transform: scale(1, 1) rotate(0deg) translateZ(0);
        transform: scale(1, 1) rotate(0deg) translateZ(0)
    }
    21% {
        -webkit-transform: scale(1.76, 0.46) rotate(-9deg) translateZ(0);
        transform: scale(1.76, 0.46) rotate(-9deg) translateZ(0)
    }
    50% {
        -webkit-transform: scale(0.82, 1.21) rotate(13deg) translateZ(0);
        transform: scale(0.82, 1.21) rotate(13deg) translateZ(0)
    }
}
.button-area:hover .perspective-btn {
    -webkit-animation: button-hover .4s ease-in-out 0s normal !important;
    animation: button-hover .4s ease-in-out 0s normal !important
}
.button-area:hover .perspective-btn-enq {
    background-position: 0px 17px;
    -webkit-animation: button-hover .4s ease-in-out 0s normal !important;
    animation: button-hover .4s ease-in-out 0s normal !important
}

.input-border {
    -webkit-animation: input-move .4s ease-in-out 0s normal !important;
    animation: input-move .4s ease-in-out 0s normal !important;
}
@-webkit-keyframes button-hover {
    0%,
    100% {
        -webkit-transform: scale(1, 1) rotate(0deg) translateZ(0);
        transform: scale(1, 1) rotate(0deg) translateZ(0)
    }
    21% {
        -webkit-transform: scale(1.76, 0.46) rotate(-9deg) translateZ(0);
        transform: scale(1.76, 0.46) rotate(-9deg) translateZ(0)
    }
    50% {
        -webkit-transform: scale(0.82, 1.21) rotate(13deg) translateZ(0);
        transform: scale(0.82, 1.21) rotate(13deg) translateZ(0)
    }
}
@keyframes button-hover {
    0%,
    100% {
        -webkit-transform: scale(1, 1) rotate(0deg) translateZ(0);
        transform: scale(1, 1) rotate(0deg) translateZ(0)
    }
    21% {
        -webkit-transform: scale(1.76, 0.46) rotate(-9deg) translateZ(0);
        transform: scale(1.76, 0.46) rotate(-9deg) translateZ(0)
    }
    50% {
        -webkit-transform: scale(0.82, 1.21) rotate(13deg) translateZ(0);
        transform: scale(0.82, 1.21) rotate(13deg) translateZ(0)
    }
}
@keyframes dot-zoom {
    0% { transform: scale(0); }
    50% { transform: scale(1); }
    100% { transform: scale(0); }

}
@-webkit-keyframes dot-zoom {
    0% { transform: scale(0); }
    50% { transform: scale(1); }
    100% { transform: scale(0); }
}
.n-animate-container {
    width: 100%;
    position: relative;
}
.n-animate-element {
    width: 100%;
}
.n-animate-element > img {
    width: 100%;
    transform-origin: center;
    backface-visibility: hidden;
    opacity: 0;
    transform: scale(0) rotate(90deg);
    transition: opacity 1.2s ease, transform 1.2s ease;
}
.n-animate-element:nth-child(odd) > img {
    transform: scale(0) rotate(90deg);
}
.n-animate-element:nth-child(even) > img {
    transform: scale(0) rotate(270deg);
}
.n-animate-element:last-child > img {
    transform: scale(1) rotate(0);
}
.framework-section.in-view .n-animate-element.visible > img {
    opacity: 1;
    transform: scale(1) rotate(0);
}

.fundamentals-box-container {
     perspective: 1200px;
 }
.fundamental-animation {
    transform-style: preserve-3d;
    perspective: 1200px;
}
.fundamentals-section .fundamental-animation > div {
    width: 400px;
    backface-visibility: hidden;
    opacity: 0;
    transform-origin: center center;
    transition: opacity 1.2s ease, transform 1.2s ease;
}
.fundamental-animation:nth-child(1) > div {
    transform: rotateX(-90deg) translate3d(-120%, 120%, 100px) scale(0);
}
.fundamental-animation:nth-child(2) > div {
    transform: rotateX(-90deg) translate3d(-150%, -120%, 100px) scale(0);
}
.fundamental-animation:nth-child(3) > div {
    transform: rotateY(90deg) translate3d(-150%, 80%, -200px) scale(0);
}
.fundamental-animation:nth-child(4) > div {
    transform: rotateZ(-180deg) translate3d(-70%, 80%, 200px) scale(0);
}
.fundamental-animation.visible > div {
    opacity: 1;
    transform: rotateY(0) translate3d(0,0, 0) scale(1);
}

/* Sections Animation Starts*/
/*.scrollblock {
    opacity: 0;
    transition: opacity 1.2s ease;
}
.scrollblock.visible {
    opacity: 1;
}*/
/* Sections Animation Ends */

/* About Animation Starts*/
.vision-animate > div.animate-child {
    opacity: 0;
    transform: translate3d(200%, -200%, 0) rotate3d(1, 1, 1, 90deg) scale(0);
    transition: opacity 1.2s ease-out, transform 1.2s ease-out;
}
.mission-animate > div.animate-child {
    opacity: 0;
    transform: translate3d(-200%, 0, 0) rotate3d(1, 1, 1, 180deg) scale(0);
    transition: opacity 1.2s ease-out, transform 1.2s ease-out;
}
.vision-animate.in-view > div.animate-child,
.mission-animate.in-view > div.animate-child {
    opacity: 1;
    transform: translate3d(0, 0, 0) rotate3d(1, 1, 1, 0) scale(1);
}
/* About Animation Ends*/

/* Yellow Sections Animation Starts*/
.obj-animate.rotate-scale,
.framework-obj-animate.rotate-scale,
.fundamental-obj-animate.rotate-scale {
    opacity: 0;
    transition: transform 0.8s ease-in-out, opacity 0.8s ease-in-out;
}
.rotate-scale-left {
    transform: rotateZ(45deg) translateY(-100px) scale(0);
}
.rotate-scale-right {
    transform: rotateZ(-45deg) translateY(100px) scale(0);
}
.box-shake-animate.in-view .obj-animate.rotate-scale,
.box-shake-animate.in-view .framework-obj-animate.rotate-scale,
.box-shake-animate.in-view .fundamental-obj-animate.rotate-scale {
    opacity: 1;
    transform:rotateZ(0) translateY(0) scale(1);
}
/* Yellow Sections Animation Ends*/

/*Course Section animation Starts*/
.circle-inner.hovering {
    animation: course-circle-scale 0.5s ease;
}
@keyframes course-circle-scale {
    0% {
        transform: scale(1) rotate(-90deg);
    }
    50% {
        transform: scale(1.25) rotate(-90deg);
    }
    100% {
        transform: scale(1) rotate(-90deg);
    }
}
.courses-section .n-animate-block.in-view .courses-circle-left {
    transform: translate(0, 0) rotate(90deg);
}
.courses-section .n-animate-block.in-view .courses-circle {
    width: 400rem;
    height: 400rem;
}
.courses-section .n-animate-block.in-view .courses-desc {
    opacity: 1;
    transform: translateX(0) scale3d(1, 1, 1);
    transition: transform 1.2s 2.6s ease-out, opacity 1.2s 2.6s ease-out;
}
/*Course Section animation Ends*/

/*Enquiry Section animation Starts*/
.enquire-section .animate-ltr > div {
    opacity: 0;
    transform: translate3d(-100%, -100%, 100px);
    transition: transform 1s ease-in-out, opacity 1s ease-in-out;
}
.enquire-section .animate-rtl > div {
    opacity: 0;
    transform: translate3d(100%, -100%, 100px);
    transition: transform 1s ease-in-out, opacity 1s ease-in-out;
}
.enquire-section .animate-ttb > div {
    opacity: 0;
    transform: translate3d(0, -300%, 400px);
    transition: transform 1s ease-in-out, opacity 1s ease-in-out;
}
.enquire-section .animate-btt > div {
    opacity: 0;
    transform: translate3d(0, 200%, 200px);
    transition: transform 1s ease-in-out, opacity 1s ease-in-out;
}
.enquire-section .animate-field.in-view > div,
.enquire-section .animate-field.in-view > div,
.enquire-section .animate-field.in-view > div {
    opacity: 1;
    transform: translate3d(0, 0, 0);
}
/*Enquiry Section animation Ends*/

@keyframes blobby-wiggle {
    0%,
    25%,
    50%,
    75%,
    100% {
        -webkit-transform: none;
        transform: none
    }
    12.5% {
        -webkit-transform: scale(1.02, 0.98) rotate(2deg) translate3d(2px, -2px, 0);
        transform: scale(1.02, 0.98) rotate(2deg) translate3d(2px, -2px, 0)
    }
    37.5% {
        -webkit-transform: scale(0.995, 1.01) rotate(1deg) translate3d(-1px, 2px, 0);
        transform: scale(0.995, 1.01) rotate(1deg) translate3d(-1px, 2px, 0)
    }
    62.5% {
        -webkit-transform: scale(1.01, 0.99) rotate(3deg) translate3d(1px, 1px, 0);
        transform: scale(1.01, 0.99) rotate(3deg) translate3d(1px, 1px, 0)
    }
    87.5% {
        -webkit-transform: scale(0.99, 1.02) rotate(4deg) translate3d(-2px, -1px, 0);
        transform: scale(0.99, 1.02) rotate(4deg) translate3d(-2px, -1px, 0)
    }
}

@keyframes clock-hand {
    0% {
        -webkit-transform: rotate3d(1, 1, 1, -5deg);
        transform: rotate3d(1, 1, 1, -5deg)
    }
    100% {
        -webkit-transform: rotate3d(1, 1, 1, 5deg);
        transform: rotate3d(1, 1, 1, 5deg)
    }
}


/* Text Animation */
.splitting.in-view .word {
    animation: word-slide-in 0.6s cubic-bezier(.5, 0, .5, 1) both;
    animation-delay: calc(40ms * var(--word-index));
}
@keyframes word-slide-in {
    from {
        transform: translateY(1em);
        opacity: 0;
    }
}

/*Footer ants animation*/
@keyframes walkingAntOne {
    0% {
        right: -30px;
    }
    100% {
        right: 100%;
    }
}
@keyframes walkingAntTwo {
    0% {
        right: -30px;
    }
    100% {
        right: 100%;
    }
}
@keyframes walkingAntThree {
    0% {
        right: -30px;
    }
    100% {
        right: 100%;
    }
}
@keyframes walkingAntFour {
    0% {
        right: -30px;
    }
    100% {
        right: 100%;
    }
}
@keyframes walkingAntFive {
    0% {
        right: -30px!important;
    }
    100% {
        right: 100%;
    }
}