/* Epic spinners by epicmax */

/* Version 1.1.0 */

/* https://github.com/epicmaxco/epic-spinners */

/* Flower spinner */

.flower-spinner,
.flower-spinner * {
	box-sizing: border-box;
}

.flower-spinner {
	height: 70px;
	width: 70px;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
}

.flower-spinner .dots-container {
	height: calc(70px / 7);
	width: calc(70px / 7);
}

.flower-spinner .smaller-dot {
	background: #ff1d5e;
	height: 100%;
	width: 100%;
	border-radius: 50%;
	animation: flower-spinner-smaller-dot-animation 2.5s 0s infinite both;
}

.flower-spinner .bigger-dot {
	background: #ff1d5e;
	height: 100%;
	width: 100%;
	padding: 10%;
	border-radius: 50%;
	animation: flower-spinner-bigger-dot-animation 2.5s 0s infinite both;
}

@keyframes flower-spinner-bigger-dot-animation {
	0%, 100% {
		box-shadow: 0px 0px 0px, 0px 0px 0px, 0px 0px 0px, 0px 0px 0px, 0px 0px 0px, 0px 0px 0px, 0px 0px 0px, 0px 0px 0px;
	}

	50% {
		transform: rotate(180deg);
	}

	25%,
	75% {
		box-shadow: 26px 0px 0px, -26px 0px 0px, 0px 26px 0px, 0px -26px 0px, 19px -19px 0px, 19px 19px 0px, -19px -19px 0px, -19px 19px 0px;
	}

	100% {
		transform: rotate(360deg);
		box-shadow: 0px 0px 0px, 0px 0px 0px, 0px 0px 0px, 0px 0px 0px, 0px 0px 0px, 0px 0px 0px, 0px 0px 0px, 0px 0px 0px;
	}
}

@keyframes flower-spinner-smaller-dot-animation {
	0%, 100% {
		box-shadow: 0px 0px 0px, 0px 0px 0px, 0px 0px 0px, 0px 0px 0px, 0px 0px 0px, 0px 0px 0px, 0px 0px 0px, 0px 0px 0px;
	}

	25%,
	75% {
		box-shadow: 14px 0px 0px, -14px 0px 0px, 0px 14px 0px, 0px -14px 0px, 10px -10px 0px, 10px 10px 0px, -10px -10px 0px, -10px 10px 0px;
	}

	100% {
		box-shadow: 0px 0px 0px, 0px 0px 0px, 0px 0px 0px, 0px 0px 0px, 0px 0px 0px, 0px 0px 0px, 0px 0px 0px, 0px 0px 0px;
	}
}
/* pixel spinner */

.pixel-spinner,
.pixel-spinner * {
	box-sizing: border-box;
}

.pixel-spinner {
	height: 70px;
	width: 70px;
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
}

.pixel-spinner .pixel-spinner-inner {
	width: calc(70px / 7);
	height: calc(70px / 7);
	background-color: #ff1d5e;
	color: #ff1d5e;
	box-shadow: 15px 15px 0 0, -15px -15px 0 0, 15px -15px 0 0, -15px 15px 0 0, 0 15px 0 0, 15px 0 0 0, -15px 0 0 0, 0 -15px 0 0;
	animation: pixel-spinner-animation 2000ms linear infinite;
}

@keyframes pixel-spinner-animation {
	50% {
		box-shadow: 20px 20px 0px 0px, -20px -20px 0px 0px, 20px -20px 0px 0px, -20px 20px 0px 0px, 0px 10px 0px 0px, 10px 0px 0px 0px, -10px 0px 0px 0px, 0px -10px 0px 0px;
	}

	75% {
		box-shadow: 20px 20px 0px 0px, -20px -20px 0px 0px, 20px -20px 0px 0px, -20px 20px 0px 0px, 0px 10px 0px 0px, 10px 0px 0px 0px, -10px 0px 0px 0px, 0px -10px 0px 0px;
	}

	100% {
		transform: rotate(360deg);
	}
}
/* Hollow-dots */

.hollow-dots-spinner,
.hollow-dots-spinner * {
	box-sizing: border-box;
}

.hollow-dots-spinner {
	height: 15px;
	width: calc(30px * 3);
}

.hollow-dots-spinner .dot {
	width: 15px;
	height: 15px;
	margin: 0 calc(15px / 2);
	border: calc(15px / 5) solid #ff1d5e;
	border-radius: 50%;
	float: left;
	transform: scale(0);
	animation: hollow-dots-spinner-animation 1000ms ease infinite 0ms;
}

.hollow-dots-spinner .dot:nth-child(1) {
	animation-delay: calc(300ms * 1);
}

.hollow-dots-spinner .dot:nth-child(2) {
	animation-delay: calc(300ms * 2);
}

.hollow-dots-spinner .dot:nth-child(3) {
	animation-delay: calc(300ms * 3);
}

@keyframes hollow-dots-spinner-animation {
	50% {
		transform: scale(1);
		opacity: 1;
	}

	100% {
		opacity: 0;
	}
}
/* intersecting-circles */

.intersecting-circles-spinner,
.intersecting-circles-spinner * {
	box-sizing: border-box;
}

.intersecting-circles-spinner {
	height: 70px;
	width: 70px;
	position: relative;
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
}

.intersecting-circles-spinner .spinnerBlock {
	animation: intersecting-circles-spinners-animation 1200ms linear infinite;
	transform-origin: center;
	display: block;
	height: 35px;
	width: 35px;
}

.intersecting-circles-spinner .circle {
	display: block;
	border: 2px solid #ff1d5e;
	border-radius: 50%;
	height: 100%;
	width: 100%;
	position: absolute;
	left: 0;
	top: 0;
}

.intersecting-circles-spinner .circle:nth-child(1) {
	left: 0;
	top: 0;
}

.intersecting-circles-spinner .circle:nth-child(2) {
	left: calc(35px * -0.36);
	top: calc(35px * 0.2);
}

.intersecting-circles-spinner .circle:nth-child(3) {
	left: calc(35px * -0.36);
	top: calc(35px * -0.2);
}

.intersecting-circles-spinner .circle:nth-child(4) {
	left: 0;
	top: calc(35px * -0.36);
}

.intersecting-circles-spinner .circle:nth-child(5) {
	left: calc(35px * 0.36);
	top: calc(35px * -0.2);
}

.intersecting-circles-spinner .circle:nth-child(6) {
	left: calc(35px * 0.36);
	top: calc(35px * 0.2);
}

.intersecting-circles-spinner .circle:nth-child(7) {
	left: 0;
	top: calc(35px * 0.36);
}

@keyframes intersecting-circles-spinners-animation {
	from {
		transform: rotate(0deg);
	}

	to {
		transform: rotate(360deg);
	}
}
/* orbit */

.orbit-spinner,
.orbit-spinner * {
	box-sizing: border-box;
}

.orbit-spinner {
	height: 55px;
	width: 55px;
	border-radius: 50%;
	perspective: 800px;
}

.orbit-spinner .orbit {
	position: absolute;
	box-sizing: border-box;
	width: 100%;
	height: 100%;
	border-radius: 50%;
}

.orbit-spinner .orbit:nth-child(1) {
	left: 0%;
	top: 0%;
	animation: orbit-spinner-orbit-one-animation 1200ms linear infinite;
	border-bottom: 3px solid #ff1d5e;
}

.orbit-spinner .orbit:nth-child(2) {
	right: 0%;
	top: 0%;
	animation: orbit-spinner-orbit-two-animation 1200ms linear infinite;
	border-right: 3px solid #ff1d5e;
}

.orbit-spinner .orbit:nth-child(3) {
	right: 0%;
	bottom: 0%;
	animation: orbit-spinner-orbit-three-animation 1200ms linear infinite;
	border-top: 3px solid #ff1d5e;
}

@keyframes orbit-spinner-orbit-one-animation {
	0% {
		transform: rotateX(35deg) rotateY(-45deg) rotateZ(0deg);
	}

	100% {
		transform: rotateX(35deg) rotateY(-45deg) rotateZ(360deg);
	}
}

@keyframes orbit-spinner-orbit-two-animation {
	0% {
		transform: rotateX(50deg) rotateY(10deg) rotateZ(0deg);
	}

	100% {
		transform: rotateX(50deg) rotateY(10deg) rotateZ(360deg);
	}
}

@keyframes orbit-spinner-orbit-three-animation {
	0% {
		transform: rotateX(35deg) rotateY(55deg) rotateZ(0deg);
	}

	100% {
		transform: rotateX(35deg) rotateY(55deg) rotateZ(360deg);
	}
}


/* radar */

.radar-spinner, .radar-spinner * {
	box-sizing: border-box;
}

.radar-spinner {
	height: 60px;
	width: 60px;
	position: relative;
}

.radar-spinner .circle {
	position: absolute;
	height: 100%;
	width: 100%;
	top: 0;
	left: 0;
	animation: radar-spinner-animation 2s infinite;
}

.radar-spinner .circle:nth-child(1) {
	padding: calc(60px * 5 * 2 * 0 / 110);
	animation-delay: 300ms;
}

.radar-spinner .circle:nth-child(2) {
	padding: calc(60px * 5 * 2 * 1 / 110);
	animation-delay: 300ms;
}

.radar-spinner .circle:nth-child(3) {
	padding: calc(60px * 5 * 2 * 2 / 110);
	animation-delay: 300ms;
}

.radar-spinner .circle:nth-child(4) {
	padding: calc(60px * 5 * 2 * 3 / 110);
	animation-delay: 0ms;
}

.radar-spinner .circle-inner, .radar-spinner .circle-inner-container {
	height: 100%;
	width: 100%;
	border-radius: 50%;
	border: calc(60px * 5 / 110) solid transparent;
}

.radar-spinner .circle-inner {
	border-left-color: #ff1d5e;
	border-right-color: #ff1d5e;
}

@keyframes radar-spinner-animation {
	50% {
		transform: rotate(180deg);
	}

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


/* scaling-squares */

.scaling-squares-spinner, .scaling-squares-spinner * {
	box-sizing: border-box;
}

.scaling-squares-spinner {
	height: 65px;
	width: 65px;
	position: relative;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	animation: scaling-squares-animation 1250ms;
	animation-iteration-count: infinite;
	transform: rotate(0deg);
}

.scaling-squares-spinner .square {
	height: calc(65px * 0.25 / 1.3);
	width: calc(65px * 0.25 / 1.3);
	margin-right: auto;
	margin-left: auto;
	border: calc(65px * 0.04 / 1.3) solid #ff1d5e;
	position: absolute;
	animation-duration: 1250ms;
	animation-iteration-count: infinite;
}

.scaling-squares-spinner .square:nth-child(1) {
	animation-name: scaling-squares-spinner-animation-child-1;
}

.scaling-squares-spinner .square:nth-child(2) {
	animation-name: scaling-squares-spinner-animation-child-2;
}

.scaling-squares-spinner .square:nth-child(3) {
	animation-name: scaling-squares-spinner-animation-child-3;
}

.scaling-squares-spinner .square:nth-child(4) {
	animation-name: scaling-squares-spinner-animation-child-4;
}

@keyframes scaling-squares-animation {

	50% {
		transform: rotate(90deg);
	}

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

@keyframes scaling-squares-spinner-animation-child-1 {
	50% {
		transform: translate(150%,150%) scale(2,2);
	}
}

@keyframes scaling-squares-spinner-animation-child-2 {
	50% {
		transform: translate(-150%,150%) scale(2,2);
	}
}

@keyframes scaling-squares-spinner-animation-child-3 {
	50% {
		transform: translate(-150%,-150%) scale(2,2);
	}
}

@keyframes scaling-squares-spinner-animation-child-4 {
	50% {
		transform: translate(150%,-150%) scale(2,2);
	}
}


/* half-circle */

.half-circle-spinner, .half-circle-spinner * {
	box-sizing: border-box;
}

.half-circle-spinner {
	width: 60px;
	height: 60px;
	border-radius: 100%;
	position: relative;
}

.half-circle-spinner .circle {
	content: "";
	position: absolute;
	width: 100%;
	height: 100%;
	border-radius: 100%;
	border: calc(60px / 10) solid transparent;
}

.half-circle-spinner .circle.circle-1 {
	border-top-color: #ff1d5e;
	animation: half-circle-spinner-animation 1s infinite;
}

.half-circle-spinner .circle.circle-2 {
	border-bottom-color: #ff1d5e;
	animation: half-circle-spinner-animation 1s infinite alternate;
}

@keyframes half-circle-spinner-animation {
	0% {
		transform: rotate(0deg);
	}

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




/* trinity-rings */
.trinity-rings-spinner, .trinity-rings-spinner * {
	box-sizing: border-box;
}

.trinity-rings-spinner {
	height: 66px;
	width: 66px;
	padding: 3px;
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: row;
	overflow: hidden;
	box-sizing: border-box;
}

.trinity-rings-spinner .circle {
	position: absolute;
	display: block;
	border-radius: 50%;
	border: 3px solid #ff1d5e;
	opacity: 1;
}

.trinity-rings-spinner .circle:nth-child(1) {
	height: 60px;
	width: 60px;
	animation: trinity-rings-spinner-circle1-animation 1.5s infinite linear;
	border-width: 3px;
}

.trinity-rings-spinner .circle:nth-child(2) {
	height: calc(60px * 0.65);
	width: calc(60px * 0.65);
	animation: trinity-rings-spinner-circle2-animation 1.5s infinite linear;
	border-width: 2px;
}

.trinity-rings-spinner .circle:nth-child(3) {
	height: calc(60px * 0.1);
	width: calc(60px * 0.1);
	animation: trinity-rings-spinner-circle3-animation 1.5s infinite linear;
	border-width: 1px;
}

@keyframes trinity-rings-spinner-circle1-animation {
	0% {
		transform: rotateZ(20deg) rotateY(0deg);
	}

	100% {
		transform: rotateZ(100deg) rotateY(360deg);
	}
}

@keyframes trinity-rings-spinner-circle2-animation {
	0% {
		transform: rotateZ(100deg) rotateX(0deg);
	}

	100% {
		transform: rotateZ(0deg) rotateX(360deg);
	}
}

@keyframes trinity-rings-spinner-circle3-animation {
	0% {
		transform: rotateZ(100deg) rotateX(-360deg);
	}

	100% {
		transform: rotateZ(-360deg) rotateX(360deg);
	}
}



/* fulfilling-square */
.fulfilling-square-spinner , .fulfilling-square-spinner * {
	box-sizing: border-box;
}

.fulfilling-square-spinner {
	height: 50px;
	width: 50px;
	position: relative;
	border: 4px solid #ff1d5e;
	animation: fulfilling-square-spinner-animation 4s infinite ease;
}

.fulfilling-square-spinner .spinner-inner {
	vertical-align: top;
	display: inline-block;
	background-color: #ff1d5e;
	width: 100%;
	opacity: 1;
	animation: fulfilling-square-spinner-inner-animation 4s infinite ease-in;
}

@keyframes fulfilling-square-spinner-animation {
	0% {
		transform: rotate(0deg);
	}

	25% {
		transform: rotate(180deg);
	}

	50% {
		transform: rotate(180deg);
	}

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

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

@keyframes fulfilling-square-spinner-inner-animation {
	0% {
		height: 0%;
	}

	25% {
		height: 0%;
	}

	50% {
		height: 100%;
	}

	75% {
		height: 100%;
	}

	100% {
		height: 0%;
	}
}




/* circles-to-rhombuses */

.circles-to-rhombuses-spinner, .circles-to-rhombuses-spinner * {
	box-sizing: border-box;
}

.circles-to-rhombuses-spinner {
	height: 15px;
	width: calc( (15px + 15px * 1.125) * 3);
	display: flex;
	align-items: center;
	justify-content: center;
}

.circles-to-rhombuses-spinner .circle {
	height: 15px;
	width: 15px;
	margin-left: calc(15px * 1.125);
	transform: rotate(45deg);
	border-radius: 10%;
	border: 3px solid #ff1d5e;
	overflow: hidden;
	background: transparent;
	animation: circles-to-rhombuses-animation 1200ms linear infinite;
}

.circles-to-rhombuses-spinner .circle:nth-child(1) {
	animation-delay: calc(150ms * 1);
	margin-left: 0;
}

.circles-to-rhombuses-spinner .circle:nth-child(2) {
	animation-delay: calc(150ms * 2);
}

.circles-to-rhombuses-spinner .circle:nth-child(3) {
	animation-delay: calc(150ms * 3);
}

@keyframes circles-to-rhombuses-animation {
	0% {
		border-radius: 10%;
	}

	17.5% {
		border-radius: 10%;
	}

	50% {
		border-radius: 100%;
	}

	93.5% {
		border-radius: 10%;
	}

	100% {
		border-radius: 10%;
	}
}

@keyframes circles-to-rhombuses-background-animation {
	50% {
		opacity: 0.4;
	}
}




/* semipolar */
.semipolar-spinner, .semipolar-spinner * {
	box-sizing: border-box;
}

.semipolar-spinner {
	height: 65px;
	width: 65px;
	position: relative;
}

.semipolar-spinner .ring {
	border-radius: 50%;
	position: absolute;
	border: calc(65px * 0.05) solid transparent;
	border-top-color: #ff1d5e;
	border-left-color: #ff1d5e;
	animation: semipolar-spinner-animation 2s infinite;
}

.semipolar-spinner .ring:nth-child(1) {
	height: calc(65px - 65px * 0.2 * 0);
	width: calc(65px - 65px * 0.2 * 0);
	top: calc(65px * 0.1 * 0);
	left: calc(65px * 0.1 * 0);
	animation-delay: calc(2000ms * 0.1 * 4);
	z-index: 5;
}

.semipolar-spinner .ring:nth-child(2) {
	height: calc(65px - 65px * 0.2 * 1);
	width: calc(65px - 65px * 0.2 * 1);
	top: calc(65px * 0.1 * 1);
	left: calc(65px * 0.1 * 1);
	animation-delay: calc(2000ms * 0.1 * 3);
	z-index: 4;
}

.semipolar-spinner .ring:nth-child(3) {
	height: calc(65px - 65px * 0.2 * 2);
	width: calc(65px - 65px * 0.2 * 2);
	top: calc(65px * 0.1 * 2);
	left: calc(65px * 0.1 * 2);
	animation-delay: calc(2000ms * 0.1 * 2);
	z-index: 3;
}

.semipolar-spinner .ring:nth-child(4) {
	height: calc(65px - 65px * 0.2 * 3);
	width: calc(65px - 65px * 0.2 * 3);
	top: calc(65px * 0.1 * 3);
	left: calc(65px * 0.1 * 3);
	animation-delay: calc(2000ms * 0.1 * 1);
	z-index: 2;
}

.semipolar-spinner .ring:nth-child(5) {
	height: calc(65px - 65px * 0.2 * 4);
	width: calc(65px - 65px * 0.2 * 4);
	top: calc(65px * 0.1 * 4);
	left: calc(65px * 0.1 * 4);
	animation-delay: calc(2000ms * 0.1 * 0);
	z-index: 1;
}

@keyframes semipolar-spinner-animation {
	50% {
		transform: rotate(360deg) scale(0.7);
	}
}



/* self-building-square */
.self-building-square-spinner, .self-building-square-spinner * {
	box-sizing: border-box;
}

.self-building-square-spinner {
	height: 40px;
	width: 40px;
	top: calc( -10px * 2 / 3);
}

.self-building-square-spinner .square {
	height: 10px;
	width: 10px;
	top: calc( -10px * 2 / 3);
	margin-right: calc(10px / 3);
	margin-top: calc(10px / 3);
	background: #ff1d5e;
	float: left;
	position: relative;
	opacity: 0;
	animation: self-building-square-spinner 6s infinite;
}

.self-building-square-spinner .square:nth-child(1) {
	animation-delay: calc(300ms * 6);
}

.self-building-square-spinner .square:nth-child(2) {
	animation-delay: calc(300ms * 7);
}

.self-building-square-spinner .square:nth-child(3) {
	animation-delay: calc(300ms * 8);
}

.self-building-square-spinner .square:nth-child(4) {
	animation-delay: calc(300ms * 3);
}

.self-building-square-spinner .square:nth-child(5) {
	animation-delay: calc(300ms * 4);
}

.self-building-square-spinner .square:nth-child(6) {
	animation-delay: calc(300ms * 5);
}

.self-building-square-spinner .square:nth-child(7) {
	animation-delay: calc(300ms * 0);
}

.self-building-square-spinner .square:nth-child(8) {
	animation-delay: calc(300ms * 1);
}

.self-building-square-spinner .square:nth-child(9) {
	animation-delay: calc(300ms * 2);
}

.self-building-square-spinner .clear {
	clear: both;
}

@keyframes self-building-square-spinner {
	0% {
		opacity: 0;
	}

	5% {
		opacity: 1;
		top: 0;
	}

	50.9% {
		opacity: 1;
		top: 0;
	}

	55.9% {
		opacity: 0;
		top: inherit;
	}
}


/* swapping-squares */

.swapping-squares-spinner, .swapping-squares-spinner * {
	box-sizing: border-box;
}

.swapping-squares-spinner {
	height: 65px;
	width: 65px;
	position: relative;
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
}

.swapping-squares-spinner .square {
	height: calc(65px * 0.25 / 1.3);
	width: calc(65px * 0.25 / 1.3);
	animation-duration: 1000ms;
	border: calc(65px * 0.04 / 1.3) solid #ff1d5e;
	margin-right: auto;
	margin-left: auto;
	position: absolute;
	animation-iteration-count: infinite;
}

.swapping-squares-spinner .square:nth-child(1) {
	animation-name: swapping-squares-animation-child-1;
	animation-delay: 500ms;
}

.swapping-squares-spinner .square:nth-child(2) {
	animation-name: swapping-squares-animation-child-2;
	animation-delay: 0ms;
}

.swapping-squares-spinner .square:nth-child(3) {
	animation-name: swapping-squares-animation-child-3;
	animation-delay: 500ms;
}

.swapping-squares-spinner .square:nth-child(4) {
	animation-name: swapping-squares-animation-child-4;
	animation-delay: 0ms;
}

@keyframes swapping-squares-animation-child-1 {
	50% {
		transform: translate(150%,150%) scale(2,2);
	}
}

@keyframes swapping-squares-animation-child-2 {
	50% {
		transform: translate(-150%,150%) scale(2,2);
	}
}

@keyframes swapping-squares-animation-child-3 {
	50% {
		transform: translate(-150%,-150%) scale(2,2);
	}
}

@keyframes swapping-squares-animation-child-4 {
	50% {
		transform: translate(150%,-150%) scale(2,2);
	}
}








/* fulfilling-bouncing-circle */

.fulfilling-bouncing-circle-spinner, .fulfilling-bouncing-circle-spinner * {
	box-sizing: border-box;
}

.fulfilling-bouncing-circle-spinner {
	height: 60px;
	width: 60px;
	position: relative;
	animation: fulfilling-bouncing-circle-spinner-animation infinite 4000ms ease;
}

.fulfilling-bouncing-circle-spinner .orbit {
	height: 60px;
	width: 60px;
	position: absolute;
	top: 0;
	left: 0;
	border-radius: 50%;
	border: calc(60px * 0.03) solid #ff1d5e;
	animation: fulfilling-bouncing-circle-spinner-orbit-animation infinite 4000ms ease;
}

.fulfilling-bouncing-circle-spinner .circle {
	height: 60px;
	width: 60px;
	color: #ff1d5e;
	display: block;
	border-radius: 50%;
	position: relative;
	border: calc(60px * 0.1) solid #ff1d5e;
	animation: fulfilling-bouncing-circle-spinner-circle-animation infinite 4000ms ease;
	transform: rotate(0deg) scale(1);
}

@keyframes fulfilling-bouncing-circle-spinner-animation {
	0% {
		transform: rotate(0deg);
	}

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

@keyframes fulfilling-bouncing-circle-spinner-orbit-animation {
	0% {
		transform: scale(1);
	}

	50% {
		transform: scale(1);
	}

	62.5% {
		transform: scale(0.8);
	}

	75% {
		transform: scale(1);
	}

	87.5% {
		transform: scale(0.8);
	}

	100% {
		transform: scale(1);
	}
}

@keyframes fulfilling-bouncing-circle-spinner-circle-animation {
	0% {
		transform: scale(1);
		border-color: transparent;
		border-top-color: inherit;
	}

	16.7% {
		border-color: transparent;
		border-top-color: initial;
		border-right-color: initial;
	}

	33.4% {
		border-color: transparent;
		border-top-color: inherit;
		border-right-color: inherit;
		border-bottom-color: inherit;
	}

	50% {
		border-color: inherit;
		transform: scale(1);
	}

	62.5% {
		border-color: inherit;
		transform: scale(1.4);
	}

	75% {
		border-color: inherit;
		transform: scale(1);
		opacity: 1;
	}

	87.5% {
		border-color: inherit;
		transform: scale(1.4);
	}

	100% {
		border-color: transparent;
		border-top-color: inherit;
		transform: scale(1);
	}
}








/* fingerprint */

.fingerprint-spinner, .fingerprint-spinner * {
	box-sizing: border-box;
}

.fingerprint-spinner {
	height: 64px;
	width: 64px;
	padding: 2px;
	overflow: hidden;
	position: relative;
}

.fingerprint-spinner .spinner-ring {
	position: absolute;
	border-radius: 50%;
	border: 2px solid transparent;
	border-top-color: #ff1d5e;
	animation: fingerprint-spinner-animation 1500ms cubic-bezier(0.680, -0.750, 0.265, 1.750) infinite forwards;
	margin: auto;
	bottom: 0;
	left: 0;
	right: 0;
	top: 0;
}

.fingerprint-spinner .spinner-ring:nth-child(1) {
	height: calc(60px / 9 + 0 * 60px / 9);
	width: calc(60px / 9 + 0 * 60px / 9);
	animation-delay: calc(50ms * 1);
}

.fingerprint-spinner .spinner-ring:nth-child(2) {
	height: calc(60px / 9 + 1 * 60px / 9);
	width: calc(60px / 9 + 1 * 60px / 9);
	animation-delay: calc(50ms * 2);
}

.fingerprint-spinner .spinner-ring:nth-child(3) {
	height: calc(60px / 9 + 2 * 60px / 9);
	width: calc(60px / 9 + 2 * 60px / 9);
	animation-delay: calc(50ms * 3);
}

.fingerprint-spinner .spinner-ring:nth-child(4) {
	height: calc(60px / 9 + 3 * 60px / 9);
	width: calc(60px / 9 + 3 * 60px / 9);
	animation-delay: calc(50ms * 4);
}

.fingerprint-spinner .spinner-ring:nth-child(5) {
	height: calc(60px / 9 + 4 * 60px / 9);
	width: calc(60px / 9 + 4 * 60px / 9);
	animation-delay: calc(50ms * 5);
}

.fingerprint-spinner .spinner-ring:nth-child(6) {
	height: calc(60px / 9 + 5 * 60px / 9);
	width: calc(60px / 9 + 5 * 60px / 9);
	animation-delay: calc(50ms * 6);
}

.fingerprint-spinner .spinner-ring:nth-child(7) {
	height: calc(60px / 9 + 6 * 60px / 9);
	width: calc(60px / 9 + 6 * 60px / 9);
	animation-delay: calc(50ms * 7);
}

.fingerprint-spinner .spinner-ring:nth-child(8) {
	height: calc(60px / 9 + 7 * 60px / 9);
	width: calc(60px / 9 + 7 * 60px / 9);
	animation-delay: calc(50ms * 8);
}

.fingerprint-spinner .spinner-ring:nth-child(9) {
	height: calc(60px / 9 + 8 * 60px / 9);
	width: calc(60px / 9 + 8 * 60px / 9);
	animation-delay: calc(50ms * 9);
}

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






/* spring */


.spring-spinner, .spring-spinner * {
	box-sizing: border-box;
}

.spring-spinner {
	height: 60px;
	width: 60px;
}

.spring-spinner .spring-spinner-part {
	overflow: hidden;
	height: calc(60px / 2);
	width: 60px;
}

.spring-spinner  .spring-spinner-part.bottom {
	transform: rotate(180deg) scale(-1, 1);
}

.spring-spinner .spring-spinner-rotator {
	width: 60px;
	height: 60px;
	border: calc(60px / 7) solid transparent;
	border-right-color: #ff1d5e;
	border-top-color: #ff1d5e;
	border-radius: 50%;
	box-sizing: border-box;
	animation: spring-spinner-animation 3s ease-in-out infinite;
	transform: rotate(-200deg);
}

@keyframes spring-spinner-animation {
	0% {
		border-width: calc(60px / 7);
	}

	25% {
		border-width: calc(60px / 23.33);
	}

	50% {
		transform: rotate(115deg);
		border-width: calc(60px / 7);
	}

	75% {
		border-width: calc(60px / 23.33);
	}

	100% {
		border-width: calc(60px / 7);
	}
}






/* atom */


.atom-spinner, .atom-spinner * {
	box-sizing: border-box;
}

.atom-spinner {
	height: 60px;
	width: 60px;
	overflow: hidden;
}

.atom-spinner .spinner-inner {
	position: relative;
	display: block;
	height: 100%;
	width: 100%;
}

.atom-spinner .spinner-circle {
	display: block;
	position: absolute;
	color: #ff1d5e;
	font-size: calc(60px * 0.24);
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.atom-spinner .spinner-line {
	position: absolute;
	width: 100%;
	height: 100%;
	border-radius: 50%;
	animation-duration: 1s;
	border-left-width: calc(60px / 25);
	border-top-width: calc(60px / 25);
	border-left-color: #ff1d5e;
	border-left-style: solid;
	border-top-style: solid;
	border-top-color: transparent;
}

.atom-spinner .spinner-line:nth-child(1) {
	animation: atom-spinner-animation-1 1s linear infinite;
	transform: rotateZ(120deg) rotateX(66deg) rotateZ(0deg);
}

.atom-spinner .spinner-line:nth-child(2) {
	animation: atom-spinner-animation-2 1s linear infinite;
	transform: rotateZ(240deg) rotateX(66deg) rotateZ(0deg);
}

.atom-spinner .spinner-line:nth-child(3) {
	animation: atom-spinner-animation-3 1s linear infinite;
	transform: rotateZ(360deg) rotateX(66deg) rotateZ(0deg);
}

@keyframes atom-spinner-animation-1 {
	100% {
		transform: rotateZ(120deg) rotateX(66deg) rotateZ(360deg);
	}
}

@keyframes atom-spinner-animation-2 {
	100% {
		transform: rotateZ(240deg) rotateX(66deg) rotateZ(360deg);
	}
}

@keyframes atom-spinner-animation-3 {
	100% {
		transform: rotateZ(360deg) rotateX(66deg) rotateZ(360deg);
	}
}


/* looping-rhombuses */
.looping-rhombuses-spinner, .looping-rhombuses-spinner * {
	box-sizing: border-box;
}

.looping-rhombuses-spinner {
	width: calc(15px * 4);
	height: 15px;
	position: relative;
}

.looping-rhombuses-spinner .rhombus {
	height: 15px;
	width: 15px;
	background-color: #ff1d5e;
	left: calc(15px * 4);
	position: absolute;
	margin: 0 auto;
	border-radius: 2px;
	transform: translateY(0) rotate(45deg) scale(0);
	animation: looping-rhombuses-spinner-animation 2500ms linear infinite;
}

.looping-rhombuses-spinner .rhombus:nth-child(1) {
	animation-delay: calc(2500ms * 1 / -1.5);
}

.looping-rhombuses-spinner .rhombus:nth-child(2) {
	animation-delay: calc(2500ms * 2 / -1.5);
}

.looping-rhombuses-spinner .rhombus:nth-child(3) {
	animation-delay: calc(2500ms * 3 / -1.5);
}

@keyframes looping-rhombuses-spinner-animation {
	0% {
		transform: translateX(0) rotate(45deg) scale(0);
	}

	50% {
		transform: translateX(-233%) rotate(45deg) scale(1);
	}

	100% {
		transform: translateX(-466%) rotate(45deg) scale(0);
	}
}





/* breeding-rhombus */

.breeding-rhombus-spinner {
	height: 65px;
	width: 65px;
	position: relative;
	transform: rotate(45deg);
}

.breeding-rhombus-spinner, .breeding-rhombus-spinner * {
	box-sizing: border-box;
}

.breeding-rhombus-spinner .rhombus {
	height: calc(65px / 7.5);
	width: calc(65px / 7.5);
	animation-duration: 2000ms;
	top: calc(65px / 2.3077);
	left: calc(65px / 2.3077);
	background-color: #ff1d5e;
	position: absolute;
	animation-iteration-count: infinite;
}

.breeding-rhombus-spinner .rhombus:nth-child(2n+0) {
	margin-right: 0;
}

.breeding-rhombus-spinner .rhombus.child-1 {
	animation-name: breeding-rhombus-spinner-animation-child-1;
	animation-delay: calc(100ms * 1);
}

.breeding-rhombus-spinner .rhombus.child-2 {
	animation-name: breeding-rhombus-spinner-animation-child-2;
	animation-delay: calc(100ms * 2);
}

.breeding-rhombus-spinner .rhombus.child-3 {
	animation-name: breeding-rhombus-spinner-animation-child-3;
	animation-delay: calc(100ms * 3);
}

.breeding-rhombus-spinner .rhombus.child-4 {
	animation-name: breeding-rhombus-spinner-animation-child-4;
	animation-delay: calc(100ms * 4);
}

.breeding-rhombus-spinner .rhombus.child-5 {
	animation-name: breeding-rhombus-spinner-animation-child-5;
	animation-delay: calc(100ms * 5);
}

.breeding-rhombus-spinner .rhombus.child-6 {
	animation-name: breeding-rhombus-spinner-animation-child-6;
	animation-delay: calc(100ms * 6);
}

.breeding-rhombus-spinner .rhombus.child-7 {
	animation-name: breeding-rhombus-spinner-animation-child-7;
	animation-delay: calc(100ms * 7);
}

.breeding-rhombus-spinner .rhombus.child-8 {
	animation-name: breeding-rhombus-spinner-animation-child-8;
	animation-delay: calc(100ms * 8);
}

.breeding-rhombus-spinner .rhombus.big {
	height: calc(65px / 3);
	width: calc(65px / 3);
	animation-duration: 2000ms;
	top: calc(65px / 3);
	left: calc(65px / 3);
	background-color: #ff1d5e;
	animation: breeding-rhombus-spinner-animation-child-big 2s infinite;
	animation-delay: 0.5s;
}

@keyframes breeding-rhombus-spinner-animation-child-1 {
	50% {
		transform: translate(-325%, -325%);
	}
}

@keyframes breeding-rhombus-spinner-animation-child-2 {
	50% {
		transform: translate(0, -325%);
	}
}

@keyframes breeding-rhombus-spinner-animation-child-3 {
	50% {
		transform: translate(325%, -325%);
	}
}

@keyframes breeding-rhombus-spinner-animation-child-4 {
	50% {
		transform: translate(325%, 0);
	}
}

@keyframes breeding-rhombus-spinner-animation-child-5 {
	50% {
		transform: translate(325%, 325%);
	}
}

@keyframes breeding-rhombus-spinner-animation-child-6 {
	50% {
		transform: translate(0, 325%);
	}
}

@keyframes breeding-rhombus-spinner-animation-child-7 {
	50% {
		transform: translate(-325%, 325%);
	}
}

@keyframes breeding-rhombus-spinner-animation-child-8 {
	50% {
		transform: translate(-325%, 0);
	}
}

@keyframes breeding-rhombus-spinner-animation-child-big {
	50% {
		transform: scale(0.5);
	}
}