.loader4{
	position: relative;
	width: 150px;

	top: 50%;
	top: -webkit-calc(50% - 10px);
	top: calc(55% - 10px);
	left: 25%;
	left: -webkit-calc(50% - 75px);
	left: calc(50% - 75px);

	background-color: rgba(255,255,255,0.2);
}

.loader4:before{
	content: "";
	position: absolute;
	background-color: #fff;
	top: 0px;
	left: 0px;
	height: 20px;
	width: 0px;
	z-index: 0;
	opacity: 1;
	-webkit-transform-origin:  100% 0%;
			transform-origin:  100% 0% ;
	-webkit-animation: loader4 10s ease-in-out infinite;
			animation: loader4 10s ease-in-out infinite;
}

.loader4:after{
	content: "LOADING ...";
	color: #fff;
	font-family:  Lato,"Helvetica Neue" ;
	font-weight: 200;
	font-size: 16px;
	position: absolute;
	width: 100%;
	height: 20px;
	line-height: 20px;
	left: 0;
	top: 0;
}

@-webkit-keyframes loader4{
    0%{width: 0px;}
    70%{width: 100%; opacity: 1;}
    90%{opacity: 0; width: 100%;}
    100%{opacity: 0;width: 0px;}
}

@keyframes loader4{
    0%{width: 0px;}
    70%{width: 100%; opacity: 1;}
    90%{opacity: 0; width: 100%;}
    100%{opacity: 0;width: 0px;}
}

@keyframes spin {
	to { transform: rotate(1turn); }
}

.progress {
	position: relative;
	display: block;
	width: 5em;
	height: 5em;
	margin: 0 .5em;
  font-size: 12px;
  margin: auto;
	text-indent: 999em;
	overflow: hidden;
	animation: spin 1s infinite steps(8);
}

.small.progress {
	font-size: 6px;
}

.large.progress {
	font-size: 24px;
}

.progress:before,
.progress:after,
.progress > div:before,
.progress > div:after {
	content: '';
	position: absolute;
	top: 0;
	left: 2.25em; /* (container width - part width)/2  */
	width: .5em;
	height: 1.5em;
	border-radius: .2em;
	background: #eee;
	box-shadow: 0 3.5em #eee; /* container height - part height */
	transform-origin: 50% 2.5em; /* container height / 2 */
}

.progress:before {
	background: #555;
}

.progress:after {
	transform: rotate(-45deg);
	background: #777;
}

.progress > div:before {
	transform: rotate(-90deg);
	background: #999;
}

.progress > div:after {
	transform: rotate(-135deg);
	background: #bbb;
}