@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 - 0px) !important; left: calc(100% / 2 - 0px) !important; }

.pl-antcss .circle-loader {
	zoom: 60%; display: block;  margin-left: -32px; margin-top: -32px; width: 64px; height: 64px;
	-webkit-transform-origin: 16px 16px;
	transform-origin: 16px 16px;
	-webkit-animation: preloader-rotate-animation 5s infinite;
	animation: preloader-rotate-animation 5s infinite;
	-webkit-animation-timing-function: linear;
	animation-timing-function: linear;
}

.pl-antcss .circle-loader .circle {
	position: absolute; top: 50%; left: 50%;
	-webkit-animation: preloader-move-atn 2.5s infinite;
	animation: preloader-move-atn 2.5s infinite;
	-webkit-animation-timing-function: linear;
	animation-timing-function: linear;
}

.pl-antcss .circle-loader .circle-line {
	position: absolute; top: 4px; left: 0; width: 64px; height: 24px;
	-webkit-transform-origin: 4px 4px;
	transform-origin: 4px 4px;
}

.pl-antcss .circle-loader .circle-line:nth-child(0) { -webkit-transform: rotate(0deg); transform: rotate(0deg); }
.pl-antcss .circle-loader .circle-line:nth-child(1) { -webkit-transform: rotate(90deg); transform: rotate(90deg); }
.pl-antcss .circle-loader .circle-line:nth-child(2) { -webkit-transform: rotate(180deg); transform: rotate(180deg); }
.pl-antcss .circle-loader .circle-line:nth-child(3) { -webkit-transform: rotate(270deg); transform: rotate(270deg); }

.pl-antcss .circle-loader .circle-line .circle:nth-child(1) {
	top: 50%; left: 50%; margin-top: -4px; margin-left: -4px; width: 8px; height: 8px;
	border-radius: 4px;
	-webkit-animation-delay: -0.3s;
	animation-delay: -0.3s;
}
.pl-antcss .circle-loader .circle-line .circle:nth-child(2) {
	top: 50%; left: 50%; margin-top: -8px; margin-left: -8px; width: 16px; height: 16px;
	border-radius: 8px;
	-webkit-animation-delay: -0.6s;
	animation-delay: -0.6s;
}
.pl-antcss .circle-loader .circle-line .circle:nth-child(3) {
	top: 50%; left: 50%; margin-top: -12px; margin-left: -12px; width: 24px; height: 24px;
	border-radius: 12px;
	-webkit-animation-delay: -0.9s;
	animation-delay: -0.9s;
}

.pl-antcss .circle-loader .circle-blue { background-color: rgba(3, 169, 244, .65); box-shadow: 1px 1px 5px 3px rgba(3, 169, 244, .15); }
.pl-antcss .circle-loader .circle-red { background-color: rgba(244, 67, 54, .65); box-shadow: 1px 1px 5px 3px rgba(244, 67, 54, .15); }
.pl-antcss .circle-loader .circle-yellow { background-color: rgba(255, 193, 7, .65); box-shadow: 1px 1px 5px 3px rgba(255, 193, 7, .15); }
.pl-antcss .circle-loader .circle-green { background-color: rgba(205, 220, 57, .65); box-shadow: 1px 1px 5px 3px rgba(205, 220, 57, .15); }

@-webkit-keyframes preloader-rotate-atn {
	0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); }
	100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
}

@keyframes preloader-rotate-atn {
	0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); }
	100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
}

@-webkit-keyframes preloader-move-atn {
	0% { -webkit-transform: translate(0, 0); transform: translate(0, 0); }
	25% { -webkit-transform: translate(-64px, 0); transform: translate(-64px, 0); }
	75% { -webkit-transform: translate(32px, 0); transform: translate(32px, 0); }
	100% { -webkit-transform: translate(0, 0); transform: translate(0, 0); }
}

@keyframes preloader-move-atn {
	0% { -webkit-transform: translate(0, 0); transform: translate(0, 0); }
	25% { -webkit-transform: translate(-64px, 0); transform: translate(-64px, 0); }
	75% { -webkit-transform: translate(32px, 0); transform: translate(32px, 0); }
	100% { -webkit-transform: translate(0, 0); transform: translate(0, 0); }
}

/*----------------------------------------------------------------------------*/

/*不支援 自選顏色*/

/*----------------------------------------------------------------------------*/

/*============================================================================*/