/***********************************************************
*** CUSTOMIZE THE LOADING SCREEN BACKGROUND + ICON COLORS
************************************************************/
/* loading screen background color */
#bonfire-pageloader {
	background-color:#fff;
}
/* loading icon color */
#bonfire-pageloader svg {
	fill:#fff;
}


/***********************************************************
*** THE NITTY-GRITTY
************************************************************/
/* the pageloader */
#bonfire-pageloader {
	position:fixed;
	background:#fff;
	z-index:99999999999999;
	width:100%;
	height:100%;
	left:0;
	right:0;
	top:0;
	bottom:0;
	/*margin-top:-50px;
	-webkit-transform: translateY(-50px);
	-moz-transform: translateY(-50px);
	-ms-transform: translateY(-50px);
	-o-transform: translateY(-50px);
	transform: translateY(-50px);*/
}
.bonfire-pageloader-fade {
	opacity:0 !important;
	
	-webkit-transition: all .75s ease;
	-moz-transition: all .75s ease;
	-o-transition: all .75s ease;
	-ms-transition: all .75s ease;
	transition: all .75s ease;
}
.bonfire-pageloader-hide {
	display:none;
}

/* the loading icon */
.bonfire-pageloader-icon {
	position:absolute;
/*	margin:100px 0 0 0;*/
	text-align:center;
	opacity:1;
	top:50%;
	left:50%;
	-webkit-transform: translate3D(-50%,-50%,0);
	-moz-transform: translate3D(-50%,-50%,0);
	-ms-transform: translate3D(-50%,-50%,0);
	-o-transform: translate3D(-50%,-50%,0);
	transform: translate3D(-50%,-50%,0);
}

.bonfire-pageloader-icon img{width:100%; margin:auto;}
.bonfire-pageloader-icon .load_txt{color:#666; display:block; text-align:center; font-size:12px; margin-top:20%;}

.bonfire-pageloader-icon-hide {
	opacity:0 !important;
	-webkit-transition: all .25s ease;
	-moz-transition: all .25s ease;
	-o-transition: all .25s ease;
	-ms-transition: all .25s ease;
	transition: all .25s ease;
}
#bonfire-pageloader svg {
    -webkit-animation:spin 2s linear infinite;
    -moz-animation:spin 2s linear infinite;
    animation:spin 2s linear infinite;
/*	width:100px;
	height:100px;*/
}
@-webkit-keyframes spin { 100% { -webkit-transform: rotate(-360deg); } }
@-moz-keyframes spin { 100% { -moz-transform: rotate(-360deg); } }
@keyframes spin { 100% { -webkit-transform: rotate(-360deg); transform:rotate(-360deg); } }

/* lets give the page body that subtle slide-in animation */
html {
	height:100%;
	-webkit-backface-visibility: hidden;
	-webkit-transform-origin:top;
	-moz-transform-origin:top;
	-ms-transform-origin:top;
	-o-transform-origin:top;
	transform-origin:top;
}
.bonfire-html-onload {	
	/*-webkit-transform: translateY(-50px);
	-moz-transform: translateY(-50px);
	-ms-transform: translateY(-50px);
	-o-transform: translateY(-50px);
	transform: translateY(-50px);*/

	-webkit-transition: all 0s ease;
	-moz-transition: all 0s ease;
	-o-transition: all 0s ease;
	-ms-transition: all 0s ease;
	transition: all 0s ease;
}