#loading_view {
	width: 100%;
	height: 100%;
	top: 0px;
	left: 0px;
	position: fixed;
	display: block;
	opacity: 1;
	background-repeat:no-repeat;
	background-position:center center;
	z-index: 99;
    transition: all .5s ease;
    background: rgba(0,0,0, 0.5) url(/images/page_loading_01.png) no-repeat center center;
    background-size: 90px;
}
.loader{
    position: absolute;
    width: 90px;
    height: 4px;
    left: calc(50% - 45px);
    bottom: calc(50% - 90px);
    background-color: transparent;
    z-index: 100;
}

.loader:before{
    content: "";
    position: absolute;
    background-color: #E6002D;
    top: 0px;
    left: 0px;
    height: 4px;
    width: 0px;
    z-index: 0;
    opacity: 1;
    -webkit-transform-origin:  100% 0%;
            transform-origin:  100% 0% ;
    -webkit-animation: loader 2s ease-in-out infinite;
            animation: loader 2s ease-in-out infinite;
}

.loader:after{
    content: "";
    position: absolute;
    width: 100%;
    height: 4px;
    left: 0;
    top: 0;
}
@-webkit-keyframes loader{
    0%{width: 0px;}
    70%{width: 100%; opacity: 1;}
    90%{opacity: 0; width: 100%;}
    100%{opacity: 0;width: 0px;}
}

@keyframes loader{
    0%{width: 0px;}
    70%{width: 100%; opacity: 1;}
    90%{opacity: 0; width: 100%;}
    100%{opacity: 0;width: 0px;}
}