/*!
* PT. IMAJIKU CIPTA MEDIA
* Copyright 2019-2021 IMAJIKU.
*/

/* =STYLE
------------------------------------------------------------ */

/*preloader*/
.preload-mjk {
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	background-color: #ffffff;
	z-index: 2000;
}
.preload-mjk.loading{
	display: none;
}
.preload-mjk-item{
	display: flex;
	justify-content: center;
	align-items: center;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	-webkit-transform: translate(-50%,-50%);
	-moz-transform: translate(-50%,-50%);
	justify-content: center;
	align-items: center;
	overflow:hidden;
}
.preload-mjk-item i {
	font-size: 30px;
	margin: 0 auto;
	position: relative;
	color: #f3715f;
}
.preload-mjk-item img{
	display: block;
	width: auto;
	margin: 0 auto;
}

/* =Animation - Library Epic Spinner for preload
-------------------------------------------------------------*/

/*flower spinner*/
.kflower-spinner,
.kflower-spinner * {
	box-sizing: border-box;
}
.kflower-spinner {
	height: 50px;
	width: 50px;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
}
.kflower-spinner .dots-container {
	height: calc(50px / 7);
	width: calc(50px / 7);
}
.kflower-spinner .smaller-dot {
	background: #f3715f;
	height: 100%;
	width: 100%;
	border-radius: 50%;
	animation: kflower-spinner-smaller-dot-animation 2.5s 0s infinite both;
}
.kflower-spinner .bigger-dot {
	background: #f3715f;
	height: 100%;
	width: 100%;
	padding: 10%;
	border-radius: 50%;
	animation: kflower-spinner-bigger-dot-animation 2.5s 0s infinite both;
}
@keyframes kflower-spinner-bigger-dot-animation {
	0%, 100% {
		box-shadow: rgb(243, 113, 95) 0px 0px 0px,
		rgb(243, 113, 95) 0px 0px 0px,
		rgb(243, 113, 95) 0px 0px 0px,
		rgb(243, 113, 95) 0px 0px 0px,
		rgb(243, 113, 95) 0px 0px 0px,
		rgb(243, 113, 95) 0px 0px 0px,
		rgb(243, 113, 95) 0px 0px 0px,
		rgb(243, 113, 95) 0px 0px 0px;
	}

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

	25%, 75% {
		box-shadow: rgb(243, 113, 95) 26px 0px 0px,
		rgb(243, 113, 95) -26px 0px 0px,
		rgb(243, 113, 95) 0px 26px 0px,
		rgb(243, 113, 95) 0px -26px 0px,
		rgb(243, 113, 95) 19px -19px 0px,
		rgb(243, 113, 95) 19px 19px 0px,
		rgb(243, 113, 95) -19px -19px 0px,
		rgb(243, 113, 95) -19px 19px 0px;
	}

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

@keyframes kflower-spinner-smaller-dot-animation {
	0%, 100% {
		box-shadow: rgb(243, 113, 95) 0px 0px 0px,
		rgb(243, 113, 95) 0px 0px 0px,
		rgb(243, 113, 95) 0px 0px 0px,
		rgb(243, 113, 95) 0px 0px 0px,
		rgb(243, 113, 95) 0px 0px 0px,
		rgb(243, 113, 95) 0px 0px 0px,
		rgb(243, 113, 95) 0px 0px 0px,
		rgb(243, 113, 95) 0px 0px 0px;
	}

	25%, 75% {
		box-shadow: rgb(243, 113, 95) 14px 0px 0px,
		rgb(243, 113, 95) -14px 0px 0px,
		rgb(243, 113, 95) 0px 14px 0px,
		rgb(243, 113, 95) 0px -14px 0px,
		rgb(243, 113, 95) 10px -10px 0px,
		rgb(243, 113, 95) 10px 10px 0px,
		rgb(243, 113, 95) -10px -10px 0px,
		rgb(243, 113, 95) -10px 10px 0px;
	}

	100% {
		box-shadow: rgb(243, 113, 95) 0px 0px 0px,
		rgb(243, 113, 95) 0px 0px 0px,
		rgb(243, 113, 95) 0px 0px 0px,
		rgb(243, 113, 95) 0px 0px 0px,
		rgb(243, 113, 95) 0px 0px 0px,
		rgb(243, 113, 95) 0px 0px 0px,
		rgb(243, 113, 95) 0px 0px 0px,
		rgb(243, 113, 95) 0px 0px 0px;
	}
}

/*atom spinner*/
.katom-spinner, 
.katom-spinner * {
	box-sizing: border-box;
}
.katom-spinner {
	height: 45px;
	width: 45px;
	overflow: hidden;
}
.katom-spinner .spinner-inner {
	position: relative;
	display: block;
	height: 100%;
	width: 100%;
}
.katom-spinner .spinner-circle {
	display: block;
	position: absolute;
	color: #f3715f;
	font-size: calc(45px * 0.5);
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}
.katom-spinner .spinner-line {
	position: absolute;
	width: 100%;
	height: 100%;
	border-radius: 50%;
	animation-duration: 1s;
	border-left-width: calc(50px / 25);
	border-top-width: calc(50px / 25);
	border-left-color: #f3715f;
	border-left-style: solid;
	border-top-style: solid;
	border-top-color: transparent;
}
.katom-spinner .spinner-line:nth-child(1) {
	animation: katom-spinner-animation-1 1s linear infinite;
	transform: rotateZ(120deg) rotateX(66deg) rotateZ(0deg);
}
.katom-spinner .spinner-line:nth-child(2) {
	animation: katom-spinner-animation-2 1s linear infinite;
	transform: rotateZ(240deg) rotateX(66deg) rotateZ(0deg);
}
.katom-spinner .spinner-line:nth-child(3) {
	animation: katom-spinner-animation-3 1s linear infinite;
	transform: rotateZ(360deg) rotateX(66deg) rotateZ(0deg);
}
@keyframes katom-spinner-animation-1 {
	100% {
		transform: rotateZ(120deg) rotateX(66deg) rotateZ(360deg);
	}
}
@keyframes katom-spinner-animation-2 {
	100% {
		transform: rotateZ(240deg) rotateX(66deg) rotateZ(360deg);
	}
}
@keyframes katom-spinner-animation-3 {
	100% {
		transform: rotateZ(360deg) rotateX(66deg) rotateZ(360deg);
	}
}

/*orbit spinner*/
.korbit-spinner, 
.korbit-spinner * {
	box-sizing: border-box;
}
.korbit-spinner {
	height: 45px;
	width: 45px;
	border-radius: 50%;
	perspective: 800px;
}
.korbit-spinner .orbit {
	position: absolute;
	box-sizing: border-box;
	width: 100%;
	height: 100%;
	border-radius: 50%;
}
.korbit-spinner .orbit:nth-child(1) {
	left: 0%;
	top: 0%;
	animation: korbit-spinner-orbit-one-animation 1200ms linear infinite;
	border-bottom: 3px solid #f3715f;
}
.korbit-spinner .orbit:nth-child(2) {
	right: 0%;
	top: 0%;
	animation: korbit-spinner-orbit-two-animation 1200ms linear infinite;
	border-right: 3px solid #f3715f;
}
.korbit-spinner .orbit:nth-child(3) {
	right: 0%;
	bottom: 0%;
	animation: korbit-spinner-orbit-three-animation 1200ms linear infinite;
	border-top: 3px solid #f3715f;
}

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

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

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

/*square spinner*/
.kswapping-squares-spinner, 
.kswapping-squares-spinner * {
	box-sizing: border-box;
}
.kswapping-squares-spinner {
	height: 45px;
	width: 45px;
	position: relative;
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
}
.kswapping-squares-spinner .square {
	height: calc(45px * 0.25 / 1.3);
	width: calc(45px * 0.25 / 1.3);
	animation-duration: 1000ms;
	border: calc(45px * 0.04 / 1.3) solid #f3715f;
	margin-right: auto;
	margin-left: auto;
	position: absolute;
	animation-iteration-count: infinite;
}
.kswapping-squares-spinner .square:nth-child(1) {
	animation-name: kswapping-squares-animation-child-1;
	animation-delay: 500ms;
}
.kswapping-squares-spinner .square:nth-child(2) {
	animation-name: kswapping-squares-animation-child-2;
	animation-delay: 0ms;
}
.kswapping-squares-spinner .square:nth-child(3) {
	animation-name: kswapping-squares-animation-child-3;
	animation-delay: 500ms;
}
.kswapping-squares-spinner .square:nth-child(4) {
	animation-name: kswapping-squares-animation-child-4;
	animation-delay: 0ms;
}
@keyframes kswapping-squares-animation-child-1 {
	50% {
		transform: translate(150%,150%) scale(2,2);
	}
}

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

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

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

/*circle spinner*/
.kcircles-to-rhombuses-spinner, 
.kcircles-to-rhombuses-spinner * {
	box-sizing: border-box;
}
.kcircles-to-rhombuses-spinner {
	height: 12px;
	width: calc( (12px + 12px * 1.125) * 3);
	display: flex;
	align-items: center;
	justify-content: center
}
.kcircles-to-rhombuses-spinner .circle {
	height: 12px;
	width: 12px;
	margin-left: calc(12px * 1.125);
	transform: rotate(45deg);
	border-radius: 10%;
	border: 2px solid #f3715f;
	overflow: hidden;
	background: transparent;
	animation: kcircles-to-rhombuses-animation 1200ms linear infinite;
}
.kcircles-to-rhombuses-spinner .circle:nth-child(1) {
	animation-delay: calc(150ms * 1);
	margin-left: 0
}
.kcircles-to-rhombuses-spinner .circle:nth-child(2) {
	animation-delay: calc(150ms * 2);
}
.kcircles-to-rhombuses-spinner .circle:nth-child(3) {
	animation-delay: calc(150ms * 3);
}

@keyframes kcircles-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 kcircles-to-rhombuses-background-animation {
	50% {
		opacity: 0.4;
	}
}

/*breeding spinner*/
.kbreeding-rhombus-spinner {
	height: 45px;
	width: 45px;
	position: relative;
	transform: rotate(45deg);
}
.kbreeding-rhombus-spinner, 
.kbreeding-rhombus-spinner * {
	box-sizing: border-box;
}
.kbreeding-rhombus-spinner .rhombus {
	height: calc(45px / 7.5);
	width: calc(45px / 7.5);
	animation-duration: 2000ms;
	top: calc(45px / 2.3077);
	left: calc(45px / 2.3077);
	background-color: #f3715f;
	position: absolute;
	animation-iteration-count: infinite;
}
.kbreeding-rhombus-spinner .rhombus:nth-child(2n+0) {
	margin-right: 0;
}
.kbreeding-rhombus-spinner .rhombus.child-1 {
	animation-name: kbreeding-rhombus-spinner-animation-child-1;
	animation-delay: calc(100ms * 1);
}
.kbreeding-rhombus-spinner .rhombus.child-2 {
	animation-name: kbreeding-rhombus-spinner-animation-child-2;
	animation-delay: calc(100ms * 2);
}
.kbreeding-rhombus-spinner .rhombus.child-3 {
	animation-name: kbreeding-rhombus-spinner-animation-child-3;
	animation-delay: calc(100ms * 3);
}
.kbreeding-rhombus-spinner .rhombus.child-4 {
	animation-name: kbreeding-rhombus-spinner-animation-child-4;
	animation-delay: calc(100ms * 4);
}
.kbreeding-rhombus-spinner .rhombus.child-5 {
	animation-name: kbreeding-rhombus-spinner-animation-child-5;
	animation-delay: calc(100ms * 5);
}
.kbreeding-rhombus-spinner .rhombus.child-6 {
	animation-name: kbreeding-rhombus-spinner-animation-child-6;
	animation-delay: calc(100ms * 6);
}
.kbreeding-rhombus-spinner .rhombus.child-7 {
	animation-name: kbreeding-rhombus-spinner-animation-child-7;
	animation-delay: calc(100ms * 7);
}
.kbreeding-rhombus-spinner .rhombus.child-8 {
	animation-name: kbreeding-rhombus-spinner-animation-child-8;
	animation-delay: calc(100ms * 8);
}
.kbreeding-rhombus-spinner .rhombus.big {
	height: calc(45px / 3);
	width: calc(45px / 3);
	animation-duration: 2000ms;
	top: calc(45px / 3);
	left: calc(45px / 3);
	background-color: #f3715f;
	animation: kbreeding-rhombus-spinner-animation-child-big 2s infinite;
	animation-delay: 0.5s;
}

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

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

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

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

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

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

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

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

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

/*scaling spinner*/
.kscaling-squares-spinner, 
.kscaling-squares-spinner * {
	box-sizing: border-box;
}
.kscaling-squares-spinner {
	height: 45px;
	width: 45px;
	position: relative;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	animation: kscaling-squares-animation 1250ms;
	animation-iteration-count: infinite;
	transform: rotate(0deg);
}
.kscaling-squares-spinner .square {
	height: calc(45px * 0.25 / 1.3);
	width: calc(45px * 0.25 / 1.3);
	margin-right: auto;
	margin-left: auto;
	border: calc(45px * 0.04 / 1.3) solid #f3715f;
	position: absolute;
	animation-duration: 1250ms;
	animation-iteration-count: infinite;
}
.kscaling-squares-spinner .square:nth-child(1) {
	animation-name: kscaling-squares-spinner-animation-child-1;
}
.kscaling-squares-spinner .square:nth-child(2) {
	animation-name: kscaling-squares-spinner-animation-child-2;
}
.kscaling-squares-spinner .square:nth-child(3) {
	animation-name: kscaling-squares-spinner-animation-child-3;
}
.kscaling-squares-spinner .square:nth-child(4) {
	animation-name: kscaling-squares-spinner-animation-child-4;
}

@keyframes kscaling-squares-animation {

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

	25% {
		height: 0%;
	}

	50% {
		height: 100%;
	}

	75% {
		height: 100%;
	}

	100% {
		height: 0%;
	}
}

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

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

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

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

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

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

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

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

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

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

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

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

.kbuilding-square-spinner .clear{
	clear: both;
}

@keyframes kbuilding-square-spinner {
	0% {
		opacity: 0;
	}
	5% {
		opacity: 1;
		top: 0;
	}
	50.9% {
		opacity: 1;
		top: 0;
	}
	55.9% {
		opacity: 0;
		top: inherit;
	}
}