#main-loading {
    background-color: #fff;
    position: relative;
}
#main-loading #app-loading{
	position: absolute;
	background-repeat: no-repeat;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}
#main-loading #loading-gif{
	position: absolute;
	/*background-image: url('images/predefined_loading_1.gif');
	background-repeat: no-repeat;
	width:58px;
	height:29px;*/
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

/*main-loading*/
.main-loading,
.main-loading:before,
.main-loading:after {
    border-radius: 50%;
    width: 1.2em;
    height: 1.2em;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation: main-loading-anim 1.8s infinite ease-in-out;
    animation: main-loading-anim 1.8s infinite ease-in-out;
}

.main-loading {
    color: #267030;
    text-indent: -9999em;
    -webkit-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-animation-delay: -0.16s;
    animation-delay: -0.16s;
}

    .main-loading:before,
    .main-loading:after {
        content: '';
        position: absolute;
        top: 0;
    }

    .main-loading:before {
        left: -2em;
        -webkit-animation-delay: -0.32s;
        animation-delay: -0.32s;
    }

    .main-loading:after {
        left: 2em;
    }

@-webkit-keyframes main-loading-anim {
    0%, 80%, 100% {
        box-shadow: 0 2.5em 0 -1.3em;
    }

    40% {
        box-shadow: 0 2.5em 0 0;
    }
}

@keyframes main-loading-anim {
    0%, 80%, 100% {
        box-shadow: 0 2.5em 0 -1.3em;
    }

    40% {
        box-shadow: 0 2.5em 0 0;
    }
}

/**CSS for LoadingIndicator dijit***/
.main-loading-indicator {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}

    .main-loading-indicator .main-loading {
        position: absolute;
        left: 50%;
        top: 50%;
        margin-left: -6px;
        margin-top: -35px;
    }

/**CSS for LoadingShelter dijit***/
.main-loading-shelter {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    height: 100%;
    width: 100%;
    z-index: 110;
    background: no-repeat center center;
    opacity: 0.6;
    filter: alpha(opacity=60);
    font-size: 14px;
    line-height: 20px;
}

    .main-loading-shelter .loading-container {
        position: absolute;
        width: 250px;
        height: 48px;
        top: 50%;
        left: 50%;
        margin-left: -24px;
        margin-top: -48px;
        color: #000000;
        font-weight: bold;
    }

        .main-loading-shelter .loading-container .main-loading {
            position: relative;
            top: -18px;
            left: 40px;
        }

.jimu-rtl .main-loading-shelter .loading-container .main-loading {
    left: auto;
    right: 40px;
}

.main-loading-shelter .loading-container p {
    position: absolute;
    left: 113px;
    top: 0;
    display: inline-block;
    height: 48px;
    line-height: 48px;
    white-space: nowrap;
    margin: 0;
}

.jimu-rtl .main-loading-shelter .loading-container {
    left: auto;
    right: 50%;
    margin-left: auto;
    margin-right: -24px;
}

    .jimu-rtl .main-loading-shelter .loading-container p {
        left: auto;
        right: 113px;
    }
