/**--------------------------------------
 * @package     ruxin_preloader - Ruxin Preloader
 * @copyright   Copyright (C) 2020 Open Source Matters, Inc. All rights reserved.
 * @license     GNU General Public License version 2 or later.
 * ---------------------------------------**/

#ruxin_preloader {
	width: 100% !important;
	height: 100% !important;
	z-index: 99999;
	position: fixed;
	background: #ff4949;
	text-align: center;
	top: 0;
	left: 0;
}
#ruxin_preloader img {
	padding: 0;
	margin: 0 auto 30px;
	display: table;
}
#ruxin_preloader h4 {
	color: #fff;
	font-size: 16px;
}

.loader{
	width: 140px;
	height: 50px;
	margin: 90px auto 50px;
}
.loader .loader-inner{
	display: inline-block;
	position: relative;
	z-index: 1;
}
.loader .loader-inner:not(:last-child){
	margin-right: 9px;
}
.loader .loader-inner:before,
.loader .loader-inner:after{
	content: "";
	display: inline-block;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	position: absolute;
}
.loader .loader-inner:nth-child(1):before{
	background: #ffffff;
	transform: translateY(-200%);
	animation: loading-1 1.15s linear infinite;
	animation-delay: -1.04s;
}
.loader .loader-inner:nth-child(1):after{
	background: #164f99;
	transform: translateY(200%);
	animation: loading-2 1.15s linear infinite;
	animation-delay: -1.04s;
}
.loader .loader-inner:nth-child(2):before{
	background: #ffffff;
	transform: translateY(-200%);
	animation: loading-1 1.15s linear infinite;
	animation-delay: -2.07s;
}
.loader .loader-inner:nth-child(2):after{
	background: #164f99;
	transform: translateY(200%);
	animation: loading-2 1.15s linear infinite;
	animation-delay: -2.07s;
}
.loader-inner:nth-child(3):before{
	background: #ffffff;
	transform: translateY(-200%);
	animation: loading-1 1.15s linear infinite;
	animation-delay: -3.11s;
}
.loader .loader-inner:nth-child(3):after{
	background: #164f99;
	transform: translateY(200%);
	animation: loading-2 1.15s linear infinite;
	animation-delay: -3.11s;
}
.loader .loader-inner:nth-child(4):before{
	background: #ffffff;
	transform: translateY(-200%);
	animation: loading-1 1.15s linear infinite;
	animation-delay: -4.14s;
}
.loader .loader-inner:nth-child(4):after{
	background: #164f99;
	transform: translateY(200%);
	animation: loading-2 1.15s linear infinite;
	animation-delay: -4.14s;
}
.loader .loader-inner:nth-child(5):before{
	background: #ffffff;
	transform: translateY(-200%);
	animation: loading-1 1.15s linear infinite;
	animation-delay: -5.18s;
}
.loader .loader-inner:nth-child(5):after{
	transform: translateY(200%);
	animation: loading-2 1.15s linear infinite;
	animation-delay: -5.18s;
	background-color:#164F99;
}
.loader .loader-inner:nth-child(6):before{
	background: #ffffff;
	transform: translateY(-200%);
	animation: loading-1 1.15s linear infinite;
	animation-delay: -6.21s;
}
.loader .loader-inner:nth-child(6):after{
	background: #164f99;
	transform: translateY(200%);
	animation: loading-2 1.15s linear infinite;
	animation-delay: -6.21s;
}
.loader .loader-inner:nth-child(7):before{
	background: #ffffff;
	transform: translateY(-200%);
	animation: loading-1 1.15s linear infinite;
	animation-delay: -7.25s;
}
.loader .loader-inner:nth-child(7):after{
	background: #164f99;
	transform: translateY(200%);
	animation: loading-2 1.15s linear infinite;
	animation-delay: -7.25s;
}
.loader .loader-inner:nth-child(8):before{
	background: #ffffff;
	transform: translateY(-200%);
	animation: loading-1 1.15s linear infinite;
	animation-delay: -8.28s;
}
.loader .loader-inner:nth-child(8):after{
	background: #164f99;
	transform: translateY(200%);
	animation: loading-2 1.15s linear infinite;
	animation-delay: -8.28s;
}
.loader .loader-inner:nth-child(9):before{
	background: #ffffff;
	transform: translateY(-200%);
	animation: loading-1 1.15s linear infinite;
	animation-delay: -9.32s;
}
.loader .loader-inner:nth-child(9):after{
	background: #164f99;
	transform: translateY(200%);
	animation: loading-2 1.15s linear infinite;
	animation-delay: -9.32s;
}
.loader-inner:nth-child(10):before{
	background: #ffffff;
	transform: translateY(-200%);
	animation: loading-1 1.15s linear infinite;
	animation-delay: -10.35s;
}
.loader .loader-inner:nth-child(10):after{
	background: #164f99;
	transform: translateY(200%);
	animation: loading-2 1.15s linear infinite;
	animation-delay: -10.35s;
}
@-webkit-keyframes loading-1{
	0%{
		-webkit-transform: scale(1) translateY(-200%);
		z-index: 1;
	}
	25%{
		-webkit-transform: scale(1.3) translateY(0);
		z-index: 1;
	}
	50%{
		-webkit-transform: scale(1) translateY(200%);
		z-index: -1;
	}
	75%{
		-webkit-transform: scale(0.7) translateY(0);
		z-index: -1;
	}
	100%{
		-webkit-transform: scale(1) translateY(-200%);
		z-index: -1;
	}
}
@keyframes loading-1{
	0%{
		transform: scale(1) translateY(-200%);
		z-index: 1;
	}
	25%{
		transform: scale(1.3) translateY(0);
		z-index: 1;
	}
	50%{
		transform: scale(1) translateY(200%);
		z-index: -1;
	}
	75%{
		transform: scale(0.7) translateY(0);
		z-index: -1;
	}
	100%{
		transform: scale(1) translateY(-200%);
		z-index: -1;
	}
}
@-webkit-keyframes loading-2{
	0%{
		-webkit-transform: scale(1) translateY(200%);
		z-index: -1;
	}
	25%{
		-webkit-transform: scale(0.7) translateY(0);
		z-index: -1;
	}
	50%{
		-webkit-transform: scale(1) translateY(-200%);
		z-index: 1;
	}
	75%{
		-webkit-transform: scale(1.3) translateY(0);
		z-index: 1;
	}
	100%{
		-webkit-transform: scale(1) translateY(200%);
		z-index: 1;
	}
}
@keyframes loading-2{
	0%{
		transform: scale(1) translateY(200%);
		z-index: -1;
	}
	25%{
		transform: scale(0.7) translateY(0);
		z-index: -1;
	}
	50%{
		transform: scale(1) translateY(-200%);
		z-index: 1;
	}
	75%{
		transform: scale(1.3) translateY(0);
		z-index: 1;
	}
	100%{
		transform: scale(1) translateY(200%);
		z-index: 1;
	}
}