$color_1: #0a0a0a;
$color_2: #fff;
$color_3: #363636;
$color_4: #f5f5f5;
$color_5: rgba(0, 0, 0, .7);
$background-color_1: #fff;
$background-color_2: #0a0a0a;
$background-color_3: #f5f5f5;
$background-color_4: #363636;
$background-color_5: #00d1b2;
$background-color_6: #3273dc;
$background-color_7: #209cee;
$background-color_8: #23d160;
$background-color_9: #ffdd57;
$background-color_10: #ff3860;
$border-color_1: #0a0a0a;
$border-color_2: #fff;
$border-color_3: #363636;
$border-color_4: #f5f5f5;
$border-color_5: rgba(0, 0, 0, .7);

/* node_modules/bulma-pageloader/dist/css/bulma-pageloader.min.css */
@-webkit-keyframes spinAround {
	from {
		-webkit-transform: rotate(0);
		transform: rotate(0);
	}
	to {
		-webkit-transform: rotate(359deg);
		transform: rotate(359deg);
	}
}
@keyframes spinAround {
	from {
		-webkit-transform: rotate(0);
		transform: rotate(0);
	}
	to {
		-webkit-transform: rotate(359deg);
		transform: rotate(359deg);
	}
}
@-webkit-keyframes loader-figure {
	0% {
		height: 0;
		width: 0;
		background-color: #fff;
	}
	29% {
		background-color: #fff;
	}
	30% {
		height: 2em;
		width: 2em;
		background-color: transparent;
		border-width: 1em;
		opacity: 1;
	}
	100% {
		height: 2em;
		width: 2em;
		border-width: 0;
		opacity: 0;
		background-color: transparent;
	}
}
@keyframes loader-figure {
	0% {
		height: 0;
		width: 0;
		background-color: #fff;
	}
	29% {
		background-color: #fff;
	}
	30% {
		height: 2em;
		width: 2em;
		background-color: transparent;
		border-width: 1em;
		opacity: 1;
	}
	100% {
		height: 2em;
		width: 2em;
		border-width: 0;
		opacity: 0;
		background-color: transparent;
	}
}
@-webkit-keyframes loader-figure-white {
	0% {
		height: 0;
		width: 0;
		background-color: #0a0a0a;
	}
	29% {
		background-color: #0a0a0a;
	}
	30% {
		height: 2em;
		width: 2em;
		background-color: transparent;
		border-width: 1em;
		opacity: 1;
	}
	100% {
		height: 2em;
		width: 2em;
		border-width: 0;
		opacity: 0;
		background-color: transparent;
	}
}
@keyframes loader-figure-white {
	0% {
		height: 0;
		width: 0;
		background-color: #0a0a0a;
	}
	29% {
		background-color: #0a0a0a;
	}
	30% {
		height: 2em;
		width: 2em;
		background-color: transparent;
		border-width: 1em;
		opacity: 1;
	}
	100% {
		height: 2em;
		width: 2em;
		border-width: 0;
		opacity: 0;
		background-color: transparent;
	}
}
@-webkit-keyframes loader-figure-black {
	0% {
		height: 0;
		width: 0;
		background-color: #fff;
	}
	29% {
		background-color: #fff;
	}
	30% {
		height: 2em;
		width: 2em;
		background-color: transparent;
		border-width: 1em;
		opacity: 1;
	}
	100% {
		height: 2em;
		width: 2em;
		border-width: 0;
		opacity: 0;
		background-color: transparent;
	}
}
@keyframes loader-figure-black {
	0% {
		height: 0;
		width: 0;
		background-color: #fff;
	}
	29% {
		background-color: #fff;
	}
	30% {
		height: 2em;
		width: 2em;
		background-color: transparent;
		border-width: 1em;
		opacity: 1;
	}
	100% {
		height: 2em;
		width: 2em;
		border-width: 0;
		opacity: 0;
		background-color: transparent;
	}
}
@-webkit-keyframes loader-figure-light {
	0% {
		height: 0;
		width: 0;
		background-color: #363636;
	}
	29% {
		background-color: #363636;
	}
	30% {
		height: 2em;
		width: 2em;
		background-color: transparent;
		border-width: 1em;
		opacity: 1;
	}
	100% {
		height: 2em;
		width: 2em;
		border-width: 0;
		opacity: 0;
		background-color: transparent;
	}
}
@keyframes loader-figure-light {
	0% {
		height: 0;
		width: 0;
		background-color: #363636;
	}
	29% {
		background-color: #363636;
	}
	30% {
		height: 2em;
		width: 2em;
		background-color: transparent;
		border-width: 1em;
		opacity: 1;
	}
	100% {
		height: 2em;
		width: 2em;
		border-width: 0;
		opacity: 0;
		background-color: transparent;
	}
}
@-webkit-keyframes loader-figure-dark {
	0% {
		height: 0;
		width: 0;
		background-color: #f5f5f5;
	}
	29% {
		background-color: #f5f5f5;
	}
	30% {
		height: 2em;
		width: 2em;
		background-color: transparent;
		border-width: 1em;
		opacity: 1;
	}
	100% {
		height: 2em;
		width: 2em;
		border-width: 0;
		opacity: 0;
		background-color: transparent;
	}
}
@keyframes loader-figure-dark {
	0% {
		height: 0;
		width: 0;
		background-color: #f5f5f5;
	}
	29% {
		background-color: #f5f5f5;
	}
	30% {
		height: 2em;
		width: 2em;
		background-color: transparent;
		border-width: 1em;
		opacity: 1;
	}
	100% {
		height: 2em;
		width: 2em;
		border-width: 0;
		opacity: 0;
		background-color: transparent;
	}
}
@-webkit-keyframes loader-figure-primary {
	0% {
		height: 0;
		width: 0;
		background-color: #fff;
	}
	29% {
		background-color: #fff;
	}
	30% {
		height: 2em;
		width: 2em;
		background-color: transparent;
		border-width: 1em;
		opacity: 1;
	}
	100% {
		height: 2em;
		width: 2em;
		border-width: 0;
		opacity: 0;
		background-color: transparent;
	}
}
@keyframes loader-figure-primary {
	0% {
		height: 0;
		width: 0;
		background-color: #fff;
	}
	29% {
		background-color: #fff;
	}
	30% {
		height: 2em;
		width: 2em;
		background-color: transparent;
		border-width: 1em;
		opacity: 1;
	}
	100% {
		height: 2em;
		width: 2em;
		border-width: 0;
		opacity: 0;
		background-color: transparent;
	}
}
@-webkit-keyframes loader-figure-link {
	0% {
		height: 0;
		width: 0;
		background-color: #fff;
	}
	29% {
		background-color: #fff;
	}
	30% {
		height: 2em;
		width: 2em;
		background-color: transparent;
		border-width: 1em;
		opacity: 1;
	}
	100% {
		height: 2em;
		width: 2em;
		border-width: 0;
		opacity: 0;
		background-color: transparent;
	}
}
@keyframes loader-figure-link {
	0% {
		height: 0;
		width: 0;
		background-color: #fff;
	}
	29% {
		background-color: #fff;
	}
	30% {
		height: 2em;
		width: 2em;
		background-color: transparent;
		border-width: 1em;
		opacity: 1;
	}
	100% {
		height: 2em;
		width: 2em;
		border-width: 0;
		opacity: 0;
		background-color: transparent;
	}
}
@-webkit-keyframes loader-figure-info {
	0% {
		height: 0;
		width: 0;
		background-color: #fff;
	}
	29% {
		background-color: #fff;
	}
	30% {
		height: 2em;
		width: 2em;
		background-color: transparent;
		border-width: 1em;
		opacity: 1;
	}
	100% {
		height: 2em;
		width: 2em;
		border-width: 0;
		opacity: 0;
		background-color: transparent;
	}
}
@keyframes loader-figure-info {
	0% {
		height: 0;
		width: 0;
		background-color: #fff;
	}
	29% {
		background-color: #fff;
	}
	30% {
		height: 2em;
		width: 2em;
		background-color: transparent;
		border-width: 1em;
		opacity: 1;
	}
	100% {
		height: 2em;
		width: 2em;
		border-width: 0;
		opacity: 0;
		background-color: transparent;
	}
}
@-webkit-keyframes loader-figure-success {
	0% {
		height: 0;
		width: 0;
		background-color: #fff;
	}
	29% {
		background-color: #fff;
	}
	30% {
		height: 2em;
		width: 2em;
		background-color: transparent;
		border-width: 1em;
		opacity: 1;
	}
	100% {
		height: 2em;
		width: 2em;
		border-width: 0;
		opacity: 0;
		background-color: transparent;
	}
}
@keyframes loader-figure-success {
	0% {
		height: 0;
		width: 0;
		background-color: #fff;
	}
	29% {
		background-color: #fff;
	}
	30% {
		height: 2em;
		width: 2em;
		background-color: transparent;
		border-width: 1em;
		opacity: 1;
	}
	100% {
		height: 2em;
		width: 2em;
		border-width: 0;
		opacity: 0;
		background-color: transparent;
	}
}
@-webkit-keyframes loader-figure-warning {
	0% {
		height: 0;
		width: 0;
		background-color: rgba(0, 0, 0, .7);
	}
	29% {
		background-color: rgba(0, 0, 0, .7);
	}
	30% {
		height: 2em;
		width: 2em;
		background-color: transparent;
		border-width: 1em;
		opacity: 1;
	}
	100% {
		height: 2em;
		width: 2em;
		border-width: 0;
		opacity: 0;
		background-color: transparent;
	}
}
@keyframes loader-figure-warning {
	0% {
		height: 0;
		width: 0;
		background-color: rgba(0, 0, 0, .7);
	}
	29% {
		background-color: rgba(0, 0, 0, .7);
	}
	30% {
		height: 2em;
		width: 2em;
		background-color: transparent;
		border-width: 1em;
		opacity: 1;
	}
	100% {
		height: 2em;
		width: 2em;
		border-width: 0;
		opacity: 0;
		background-color: transparent;
	}
}
@-webkit-keyframes loader-figure-danger {
	0% {
		height: 0;
		width: 0;
		background-color: #fff;
	}
	29% {
		background-color: #fff;
	}
	30% {
		height: 2em;
		width: 2em;
		background-color: transparent;
		border-width: 1em;
		opacity: 1;
	}
	100% {
		height: 2em;
		width: 2em;
		border-width: 0;
		opacity: 0;
		background-color: transparent;
	}
}
@keyframes loader-figure-danger {
	0% {
		height: 0;
		width: 0;
		background-color: #fff;
	}
	29% {
		background-color: #fff;
	}
	30% {
		height: 2em;
		width: 2em;
		background-color: transparent;
		border-width: 1em;
		opacity: 1;
	}
	100% {
		height: 2em;
		width: 2em;
		border-width: 0;
		opacity: 0;
		background-color: transparent;
	}
}
.pageloader {
	bottom: 0;
	left: 0;
	position: absolute;
	right: 0;
	top: 0;
	position: fixed;
	padding-top: 2em;
	background: #00d1b2;
	background: #00d1b2;
	z-index: 999998;
	transition: transform .35s ease-out, -webkit-transform .35s ease-out;
	will-change: transform;
	&:not(.is-bottom-to-top) {
		-webkit-transform: translateY(-100%);
		transform: translateY(-100%);
	}
	&::after {
		position: absolute;
		top: 50%;
		left: 50%;
		display: block;
		border-radius: 100%;
		content: "";
		z-index: 9999;
		-webkit-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		width: 0;
		height: 0;
		box-sizing: border-box;
		border: 0 solid #fff;
		-webkit-animation: loader-figure 1.15s infinite cubic-bezier(.215, .61, .355, 1);
		animation: loader-figure 1.15s infinite cubic-bezier(.215, .61, .355, 1);
	}
	.title {
		position: absolute;
		top: 50%;
		left: 50%;
		-webkit-transform: translateX(-50%);
		transform: translateX(-50%);
		margin: 2em 0 0 0;
		font-size: .875em;
		letter-spacing: .1em;
		line-height: 1.5em;
		color: $color_2;
		white-space: nowrap;
	}
}
.pageloader.is-white {
	background-color: $background-color_1;
	background: #fff;
	&::after {
		border-color: $border-color_1;
		-webkit-animation: loader-figure-white 1.15s infinite cubic-bezier(.215, .61, .355, 1);
		animation: loader-figure-white 1.15s infinite cubic-bezier(.215, .61, .355, 1);
	}
	.title {
		color: $color_1;
	}
}
.pageloader.is-black {
	background-color: $background-color_2;
	background: #0a0a0a;
	&::after {
		border-color: $border-color_2;
		-webkit-animation: loader-figure-black 1.15s infinite cubic-bezier(.215, .61, .355, 1);
		animation: loader-figure-black 1.15s infinite cubic-bezier(.215, .61, .355, 1);
	}
	.title {
		color: $color_2;
	}
}
.pageloader.is-light {
	background-color: $background-color_3;
	background: #f5f5f5;
	&::after {
		border-color: $border-color_3;
		-webkit-animation: loader-figure-light 1.15s infinite cubic-bezier(.215, .61, .355, 1);
		animation: loader-figure-light 1.15s infinite cubic-bezier(.215, .61, .355, 1);
	}
	.title {
		color: $color_3;
	}
}
.pageloader.is-dark {
	background-color: $background-color_4;
	background: #363636;
	&::after {
		border-color: $border-color_4;
		-webkit-animation: loader-figure-dark 1.15s infinite cubic-bezier(.215, .61, .355, 1);
		animation: loader-figure-dark 1.15s infinite cubic-bezier(.215, .61, .355, 1);
	}
	.title {
		color: $color_4;
	}
}
.pageloader.is-primary {
	background-color: $background-color_5;
	background: #00d1b2;
	&::after {
		border-color: $border-color_2;
		-webkit-animation: loader-figure-primary 1.15s infinite cubic-bezier(.215, .61, .355, 1);
		animation: loader-figure-primary 1.15s infinite cubic-bezier(.215, .61, .355, 1);
	}
	.title {
		color: $color_2;
	}
}
.pageloader.is-link {
	background-color: $background-color_6;
	background: #3273dc;
	&::after {
		border-color: $border-color_2;
		-webkit-animation: loader-figure-link 1.15s infinite cubic-bezier(.215, .61, .355, 1);
		animation: loader-figure-link 1.15s infinite cubic-bezier(.215, .61, .355, 1);
	}
	.title {
		color: $color_2;
	}
}
.pageloader.is-info {
	background-color: $background-color_7;
	background: #209cee;
	&::after {
		border-color: $border-color_2;
		-webkit-animation: loader-figure-info 1.15s infinite cubic-bezier(.215, .61, .355, 1);
		animation: loader-figure-info 1.15s infinite cubic-bezier(.215, .61, .355, 1);
	}
	.title {
		color: $color_2;
	}
}
.pageloader.is-success {
	background-color: $background-color_8;
	background: #23d160;
	&::after {
		border-color: $border-color_2;
		-webkit-animation: loader-figure-success 1.15s infinite cubic-bezier(.215, .61, .355, 1);
		animation: loader-figure-success 1.15s infinite cubic-bezier(.215, .61, .355, 1);
	}
	.title {
		color: $color_2;
	}
}
.pageloader.is-warning {
	background-color: $background-color_9;
	background: #ffdd57;
	&::after {
		border-color: $border-color_5;
		-webkit-animation: loader-figure-warning 1.15s infinite cubic-bezier(.215, .61, .355, 1);
		animation: loader-figure-warning 1.15s infinite cubic-bezier(.215, .61, .355, 1);
	}
	.title {
		color: $color_5;
	}
}
.pageloader.is-danger {
	background-color: $background-color_10;
	background: #ff3860;
	&::after {
		border-color: $border-color_2;
		-webkit-animation: loader-figure-danger 1.15s infinite cubic-bezier(.215, .61, .355, 1);
		animation: loader-figure-danger 1.15s infinite cubic-bezier(.215, .61, .355, 1);
	}
	.title {
		color: $color_2;
	}
}
.pageloader.is-bottom-to-top {
	-webkit-transform: translateY(100%);
	transform: translateY(100%);
}
.pageloader.is-left-to-right {
	-webkit-transform: translateX(-100%);
	transform: translateX(-100%);
}
.pageloader.is-right-to-left {
	-webkit-transform: translateX(100%);
	transform: translateX(100%);
}
.pageloader.is-active {
	&:not(.is-left-to-right) {
		-webkit-transform: translateY(0);
		transform: translateY(0);
	}
	&:not(.is-right-to-left) {
		-webkit-transform: translateY(0);
		transform: translateY(0);
	}
}
.pageloader.is-active.is-left-to-right {
	-webkit-transform: translateX(0);
	transform: translateX(0);
}
.pageloader.is-active.is-right-to-left {
	-webkit-transform: translateX(0);
	transform: translateX(0);
}
