.js body.loading,
.js body.init {
	overflow: hidden;
}

body.loaded,
body.init.loaded {
	overflow: auto;
}

body.scrollable {
	overflow: auto;
}

/*
.scrollable #maurerLoader .progress-indicator {
	display: none;
}
*/

#maurerLoader {
  display: table;
  height: 100%;
  width: 100%;
}

.loading #maurerLoader,
.init #maurerLoader,
.menu-open #maurerLoader {
	position: fixed;
	opacity: 1;
	visibility: visible;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 100;
}

.menu-open #maurerLoader {
	z-index: 200;
}

#maurerLoader .loader-background {
	position: fixed;
	opacity: 1;
	visibility: visible;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 1;
	background: rgba(0,0,0,.9);
}

#maurerLoader.link .loader-background {
	cursor: pointer;
}

.init #maurerLoader {
	opacity: 1;
	visibility: visible;
}

#maurerLoader .progress-indicator {
	z-index: 2;
	height: 50px;
	width: 50px;
	left: 50%;
	top: 50%;
	margin: 0;
	margin-top: -25px;
	margin-left: -25px;
	border: 0px solid #FFF;
	opacity: 0;
	border-radius: 50%;
	position: absolute;
	overflow: hidden;
	background: url(../../img/house.png) no-repeat center center;
	box-shadow: inset 0 0 20px rgba(0,0,0,.3);
	background-position: center 30px;
	background-color: transparent;
	background: none;
	background-color: #FFF;
}

#maurerLoader .progress-indicator .image {
	background: url(../../img/windows.jpg) no-repeat center center;
	background-size: cover;
	background-position: center center;
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	opacity: 1;
}

#maurerLoader .progress-indicator.reveal {

}

#maurerLoader .progress-indicator.revealed {
	height: 100px;
	width: 100px;
	margin-top: -50px;
	margin-left: -50px;
	opacity: 1;
	background-size: auto auto;
	background-position: center 30px;
	background-color: #89b9e6;

	background-color: #FFF;
}


.transitions #maurerLoader .progress-indicator.reveal {
	transition: all 1000ms;
	-webkit-transition: all 1000ms;

	transition-timing-function: cubic-bezier(0.895, 0.030, 0.685, 0.220);
	transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
	-webkit-transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
}

#maurerLoader svg {
	left: 50%;
	top: 50%;
	height: 160px;
	width: 160px;
	margin-top: -80px;
	margin-left: -80px;
	position: absolute;
	opacity: 0;
	visibility: hidden;
	z-index: 3;
}

#maurerLoader.revealed svg {
	opacity: 1;
	visibility: visible;
}

#maurerLoader.hidden,
.loaded #maurerLoader.hidden {
	top: 100%;
}

#maurerLoader.hidden .loader-background {
	visibility: hidden;
}


#maurerLoader > span {
  display: table-cell;
  height: 100%;
  width: 100%;
  position: relative;
  vertical-align: middle;
  z-index: 1;
}

#maurerLoader > span > span {
    background: rgba(255,255,255,0);
    position: absolute;
    top: 33%;
    left: 33%;
    right: 33%;
    bottom: 33%;
    width: 33%;
    height: 24%;
    margin: 0 auto;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0), 0 0 0 10px rgba(255,255,255,0) inset, 0 0 0 11px rgba(69, 111, 150, 0) inset, 0 0 0 12px rgba(255,255,255,0) inset, 0 0 0 13px rgba(69, 111, 150, 0) inset;
}

#maurerLoader > span h2 {
  color: #FFF;
  text-align: center;
  margin-top: -1em;
  font-size: 1.67em;
  opacity: 0;
  visibility: "hidden";
  position: absolute;
  bottom: 50%;
  margin: 0 auto;
  margin-bottom: 0;
  width: 100%;
}

#maurerLoader h2 {
  position: absolute;
  bottom: 50%;
  width: 100%;
  top: auto;
  margin-bottom: 0;
	transform: translateY(10px);
}

#maurerLoader .progress-indicator {
  margin-top: 4px;
  height: 152px;
  width: 152px;
  margin-left: -76px;
  margin-top: -30px;
  z-index: 1;
}

#maurerLoader svg {
    margin-top: 10px;
}


/*	Inline Loader 	*/

.inline-loader {
}

#inlineLoader {
	left: 0;
	position: absolute;
	line-height: 108px;
	font-size: .5rem;
	text-align: center;
	width: 100%;
	height: 100%;
}

.inline-loader span {
	padding: 0 4px;
	opacity: .1;
}

.inline-loader span:first-child {
	/*opacity: 1;*/
}

.inline-loader span.flash {
	-webkit-animation: flash ease-in-out 1s infinite;
	animation: flash ease-in-out 1s infinite;
}

.inline-loader.hide {
	opacity: 0;
	margin-top: -1rem;
}

.transitions .inline-loader.hide {
	transition: opacity .5s ease-in, margin-top 1s ease-in;
}

.inline-loader.hide span.flash {
	opacity: 1;
}

.transitions inline-loader.hide span.flash {
	transition: opacity: 1s ease-in;
	-webkit-animation: none;
	animation: none;
}

@-webkit-keyframes flash {
	0% { opacity: .1; }
	50% { opacity: 1; }
	100% { opacity: .1; }
}

@keyframes flash {
	0% { opacity: .1; }
	50% { opacity: 1; }
	100% { opacity: .1; }
}
