@keyframes spin {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

@keyframes blink-animation {
    0% {
        -webkit-transform: translate(-50%, -50%) scale(0.5);
        transform: translate(-50%, -50%) scale(0.5);
        opacity: 1
    }

    100% {
        -webkit-transform: translate(-50%, -50%) scale(1.3);
        transform: translate(-50%, -50%) scale(1.3);
        opacity: 0
    }
}

@keyframes rotate-loading {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}


@keyframes zoom-fade-animation {
    0% {
        -webkit-transform: scale(0.6);
        transform: scale(0.6);
    }

    50% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }

    100% {
        -webkit-transform: scale(0.6);
        transform: scale(0.6);
    }
}

@keyframes rotate-animation {
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes move-element-animation-1 {
    0% {
        -webkit-transform: translate(0);
        transform: translate(0);
    }

    25% {
        -webkit-transform: translate(10px, 10px);
        transform: translate(10px, 10px);
    }

    50% {
        -webkit-transform: translate(5px, 5px);
        transform: translate(5px, 5px);
    }

    75% {
        -webkit-transform: translate(10px, -5px);
        transform: translate(10px, -5px);
    }

    to {
        -webkit-transform: translate(0);
        transform: translate(0);
    }
}

.move-element-animation-2 {
    -webkit-animation: move-element-animation-2 8s linear infinite;
    animation: move-element-animation-2 8s linear infinite;
}

@keyframes move-element-animation-2 {
    0% {
        -webkit-transform: translate(0);
        transform: translate(0);
    }

    25% {
        -webkit-transform: translate(15px, 15px);
        transform: translate(15px, 15px);
    }

    50% {
        -webkit-transform: translate(8px, 8px);
        transform: translate(8px, 8px);
    }

    75% {
        -webkit-transform: translate(15px, -8px);
        transform: translate(15px, -8px);
    }

    to {
        -webkit-transform: translate(0);
        transform: translate(0);
    }
}

@keyframes fadeInUp {
    0% {
        opacity: 0;
        transform: translateY(20px);
    }

    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

/* About page Starts */



@keyframes techs-spin {
	0% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg)
	}

	100% {
		-webkit-transform: rotate(359deg);
		transform: rotate(359deg)
	}
}

@keyframes techs-radius-change {
	0% {
		border-radius: 0 0 0 0
	}

	40% {
		border-radius: 50px 0 100px 0
	}

	80% {
		border-radius: 0 50px 0 100px
	}

	100% {
		border-radius: 0 0 0 0
	}
}

@-webkit-keyframes techs-radius-change2 {
	0% {
		border-radius: 0 0 0 0
	}

	25% {
		border-radius: 50px 0
	}

	50% {
		border-radius: 0 0 0 0
	}

	75% {
		border-radius: 0 50px
	}

	100% {
		border-radius: 50px 0
	}
}

@-webkit-keyframes ripple_2 {
	0% {
		-webkit-transform: scale(1);
		transform: scale(1)
	}

	75% {
		-webkit-transform: scale(3);
		transform: scale(3);
		opacity: 1
	}

	100% {
		-webkit-transform: scale(4);
		transform: scale(4);
		opacity: 0
	}
}

@keyframes ripple_2 {
	0% {
		-webkit-transform: scale(1);
		transform: scale(1)
	}

	75% {
		-webkit-transform: scale(3);
		transform: scale(3);
		opacity: 1
	}

	100% {
		-webkit-transform: scale(4);
		transform: scale(4);
		opacity: 0
	}
}

@keyframes tech-rotate-y {
	0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(-360deg);
        transform: rotate(-360deg);
    }
}

/* Arrow animation */
.tab input:not(:checked) + .tab__label:hover::after {
  animation: bounce .5s infinite;
}
@keyframes bounce {
  25% {
    transform: rotate(90deg) translate(.25rem);
  }
  75% {
    transform: rotate(90deg) translate(-.25rem);
  }
}

/* About page Ends */

@keyframes tech_jump {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }

    40% {
        -webkit-transform: translateY(-30px);
        transform: translateY(-30px);
    }

    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
}

@keyframes tech_swing {
    0% {
        -webkit-transform: rotate(20deg);
        transform: rotate(20deg);
    }

    100% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
}

@keyframes tech_float_bob_x {

    0% {
        -webkit-transform: translateX(-30px);
        transform: translateX(-30px);
    }
    50% {
        -webkit-transform: translateX(-10px);
        transform: translateX(-10px);
    }
    100% {
        -webkit-transform: translateX(-30px);
        transform: translateX(-30px);
    }
}

@keyframes tech_float_bob_y {

    0% {
        -webkit-transform: translateY(-30px);
        transform: translateY(-30px);
    }
    50% {
        -webkit-transform: translateY(-10px);
        transform: translateY(-10px);
    }
    100% {
        -webkit-transform: translateY(-30px);
        transform: translateY(-30px);
    }
}