lychee/src/styles/_loading.scss

/**
 * @copyright   2015 by Tobias Reich
 */

#loading {

	position: fixed;
	width: 100%;
	height: 3px;
	background-size: 100px 3px;
	background-repeat: repeat-x;
	border-bottom: 1px solid black(.3);
	display: none;
	animation-name: moveBackground;
	animation-duration: .3s;
	animation-iteration-count: infinite;
	animation-timing-function: linear;

	/* Modes ------------------------------------------------*/
	&.loading {
		height: 3px;
		background-image: linear-gradient(to right, #153674 0%, #153674 47%, #2651AE 53%, #2651AE 100%);
		z-index: 2;
	}
	&.error {
		height: 40px;
		background-color: #2f0d0e;
		background-image: linear-gradient(to right, #451317 0%, #451317 47%, #AA3039 53%, #AA3039 100%);
		z-index: 1;
	}

	/* Content ------------------------------------------------*/
	h1 {
		margin: 13px 13px 0 13px;
		color: #ddd;
		font-size: 14px;
		font-weight: bold;
		text-shadow: 0 1px 0 black(1);
		text-transform: capitalize;

		span {
			margin-left: 10px;
			font-weight: normal;
			text-transform: none;
		}
	}

}