body:before,
body:after {
-webkit-transition:opacity .4s ease-in-out;
-moz-transition:opacity .4s ease-in-out;
-o-transition:opacity .4s ease-in-out;
-ms-transition:opacity .4s ease-in-out;
transition:opacity .4s ease-in-out;
}
body:not(.pace-done):not(.pace-not-active) > :not(.pace):not(.pace-not-active),
body:not(.pace-done):not(.pace-not-active):before,
body:not(.pace-done):not(.pace-not-active):after {
opacity:0
}
.pace {
position: fixed;
z-index: 2000;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: #000;
pointer-events: none;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
opacity: 0;
transition: opacity 0.5s
}
.pace.pace-active {
opacity: 1
}
.pace .pace-progress {
display: block;
position: fixed;
z-index: 2000;
top: 50%;
right: 100%;
width: 100%;
height: 2px;
background: #998067;
pointer-events: none;
transition: transform .1s
}