/*
loading_indicator.css
author: Felix Harst

The loading_indicator.css contains the style definitions for the loading indicators

*/

div.loading-indicator-container {
	position: relative;
	height: 4em;
	width: 4em;
	margin: auto;

	background: url(/images/loading_icon.png) center /30% no-repeat;
}
div.loading-indicator-container-small {
	position: relative;
	height: 2em;
	width: 2em;
	margin: auto;
}
div.loading-indicator-container-tiny {
	position: relative;
	height: 1.2em;
	width: 1.2em;
	margin: auto;
}
.popover-content div.loading-indicator-container {
	background-image: url(/images/loading_icon_dark.png);
}
.checkbox-loadingindicator-container {
	width: 2rem;
}

div.loading-indicator-container.hidden, div.loading-indicator-container-small.hidden, div.loading-indicator-container-tiny.hidden {
	display: none;
}

div.loading-indicator {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	border: 0.4em solid #667b9a;
	border-top: 0.4em solid #202e53;
	border-radius: 50%;
	animation: loading-indicator-spin linear 1.5s infinite;
}
div.loading-indicator-small {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	border: 0.3em solid #667b9a;
	border-top: 0.3em solid #202e53;
	border-radius: 50%;
	animation: loading-indicator-spin linear 1.5s infinite;
}
div.loading-indicator-tiny {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	border: 0.2em solid #202e53;
	border-top: 0.2em solid transparent;
	border-radius: 50%;
	animation: loading-indicator-spin linear 1.5s infinite;
}
.popover-content div.loading-indicator {
	border: 0.4em solid #667b9a;
	border-top: 0.4em solid #8f928d;
}
@keyframes loading-indicator-spin {
	0% {
		transform: rotate(0deg);
	}
	100% {
		transform: rotate(360deg);
	}
}