@charset "utf-8";

/*紅 red rgba(244, 67, 54, .85)*/ /*粉 pink rgba(255, 150, 220, .85)*/

/*紫 purple rgba(156, 39, 176, .85)*/ /*深紫 deeppurple rgba(103, 58, 183, .85)*/

/*靛青 indigo rgba(63, 81, 181, .85)*/ /*藍 blue rgba(33, 150, 243, .85)*/ /*淺藍 lightblue rgba(3, 169, 244, .85)*/

/*青色 cyan rgba(0, 188, 212, .85)*/ /*藍綠色 teal rgba(0, 150, 136, .85)*/

/*綠 green rgba(76, 175, 80, .85)*/ /*淺綠 lightgreen rgba(139, 195, 74, .85)*/ /*檸檬綠 lime rgba(205, 220, 57, .85)*/

/*黃色 yellow rgba(255, 235, 59, .85)*/ /*琥珀色 amber rgba(255, 193, 7, .85)*/ /*橙色 orange rgba(255, 152, 0, .85)*/ /*深橙 deeporange rgba(255, 87, 34, .85)*/

/*棕色 brown rgba(121, 85, 72, .85)*/ /*灰色 grey rgba(158, 158, 158, .85)*/ /*灰藍 bluegrey rgba(96, 125, 139, .85)*/

/*============================================================================*/

.pl-antcss { position: fixed; top: calc(100% / 2 - 30px) !important; left: calc(100% / 2 - 50px) !important; }

.pl-antcss .loader {
	position: absolute; top: 50%; left: 50%; margin: 0 auto; width: 100px; height: 60px; text-align: center;
	font-size: 10px;
	-webkit-transform: translateY(-50%) translateX(-50% - 50px);
	-transform: translateY(-50%) translateX(-50% - 50px);
}

.pl-antcss .loader > div {
	float: left; display: inline-block; margin-left: 2px; width: 8px; height: 100%;
	
	-webkit-animation: preloader-delay 1.1s infinite ease-in-out;
	animation: preloader-delay 1.1s infinite ease-in-out;
}

.pl-antcss .loader .bar1 { background-color: rgba(244, 67, 54, .85); box-shadow: 0 0 3px 1px rgba(244, 67, 54, .15); }
.pl-antcss .loader .bar2 { background-color: rgba(156, 39, 176, .85); box-shadow: 0 0 3px 1px rgba(156, 39, 176, .15); -webkit-animation-delay: -1s; animation-delay: -1s; }
.pl-antcss .loader .bar3 { background-color: rgba(63, 81, 181, .85); box-shadow: 0 0 3px 1px rgba(63, 81, 181, .15); -webkit-animation-delay: -0.9s; animation-delay: -0.9s; }
.pl-antcss .loader .bar4 { background-color: rgba(3, 169, 244, .85); box-shadow: 0 0 3px 1px rgba(3, 169, 244, .15); -webkit-animation-delay: -0.8s; animation-delay: -0.8s; }
.pl-antcss .loader .bar5 { background-color: rgba(0, 188, 212, .85); box-shadow: 0 0 3px 1px rgba(0, 188, 212, .15); -webkit-animation-delay: -0.7s; animation-delay: -0.7s; }
.pl-antcss .loader .bar6 { background-color: rgba(0, 150, 136, .85); box-shadow: 0 0 3px 1px rgba(0, 150, 136, .15); -webkit-animation-delay: -0.6s; animation-delay: -0.6s; }
.pl-antcss .loader .bar7 { background-color: rgba(76, 175, 80, .85); box-shadow: 0 0 3px 1px rgba(76, 175, 80, .15); -webkit-animation-delay: -0.5s; animation-delay: -0.5s; }
.pl-antcss .loader .bar8 { background-color: rgba(139, 195, 74, .85); box-shadow: 0 0 3px 1px rgba(139, 195, 74, .15); -webkit-animation-delay: -0.4s; animation-delay: -0.4s; }
.pl-antcss .loader .bar9 { background-color: rgba(255, 193, 7, .85); box-shadow: 0 0 3px 1px rgba(255, 193, 7, .15); -webkit-animation-delay: -0.3s; animation-delay: -0.3s; }

@-webkit-keyframes preloader-delay {
	0%, 40%, 100% { -webkit-transform: scaleY(0.05); }
	20% { -webkit-transform: scaleY(1); }
}

@keyframes preloader-delay {
	0%, 40%, 100% { transform: scaleY(0.05); -webkit-transform: scaleY(0.05); }
	20% { transform: scaleY(1); -webkit-transform: scaleY(1); }
}

/*----------------------------------------------------------------------------*/

/*不支援 自選顏色*/

/*----------------------------------------------------------------------------*/

/*============================================================================*/
