/* Preloader */
#preloader {
	position: fixed;
	top:0;
	left:0;
	right:0;
	bottom:0;
	background-color:#fff; /* change if the mask should be a color other than white */
    z-index:99; /* makes sure it stays on top */
}

#status {
	width:300px;
    height:300px;
	position:absolute;
	left:50%; /* centers the loading animation horizontally on the screen */
	top:50%; /* centers the loading animation vertically on the screen */
	/* background-image:url("http://sparkglobaltech.ddns.net:90/pcn_hcms/dist/img/pcn_logo.jpg"); /* path to your loading animation */
	background-repeat:no-repeat;
    background-position:center;
    margin:-150px 0 0 -150px;
	/*margin:-100px 0 0 -100px; /* is width and height divided by two */
}



.loader {
    border: 24px solid #d3d3d3; /* Light grey */
    border-top: 24px solid #07069f; /* Blue */
    border-radius: 50%;
    width: 350px;
    height: 350px;
    animation: spin 2s linear infinite;
    transform-origin: 50% 50%;
    position:absolute;
	left:50%; /* centers the loading animation horizontally on the screen */
    top:50%; 
    margin:-240px 0 0 -175px;
    /* top: -100px;
    left: -20px; */
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

#preloader .loader-section.section-left {
    left: 0;
}
#preloader .loader-section.section-right {
    right: 0;
}

/* Loaded styles */
.loaded #preloader .loader-section.section-left {
    -webkit-transform: translateX(-100%);  /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: translateX(-100%);  /* IE 9 */
            transform: translateX(-100%);  /* Firefox 16+, IE 10+, Opera */

    -webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);  /* Android 2.1+, Chrome 1-25, iOS 3.2-6.1, Safari 3.2-6  */
            transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);  /* Chrome 26, Firefox 16+, iOS 7+, IE 10+, Opera, Safari 6.1+  */
}
.loaded #preloader .loader-section.section-right {
    -webkit-transform: translateX(100%);  /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: translateX(100%);  /* IE 9 */
            transform: translateX(100%);  /* Firefox 16+, IE 10+, Opera */

    -webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);  /* Android 2.1+, Chrome 1-25, iOS 3.2-6.1, Safari 3.2-6  */
            transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);  /* Chrome 26, Firefox 16+, iOS 7+, IE 10+, Opera, Safari 6.1+  */
}