.progress {
	position: relative;
	height: 4px;
	display: block;
	width: 100%;
	background-color: white;
	border-radius: 2px;
	margin: .5rem 0 1rem 0;
	overflow: hidden
}

.progress .determinate {
	position: absolute;
	background-color: inherit;
	top: 0;
	left: 0;
	bottom: 0;
	background-color: #42a5f5;
	transition: width .3s linear
}

.progress .indeterminate {
	background-color: #42a5f5
}

.progress .indeterminate:before {
	content: '';
	position: absolute;
	background-color: inherit;
	top: 0;
	left: 0;
	bottom: 0;
	will-change: left, right;
	animation: indeterminate 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite
}

.progress .indeterminate:after {
	content: '';
	position: absolute;
	background-color: inherit;
	top: 0;
	left: 0;
	bottom: 0;
	will-change: left, right;
	animation: indeterminate-short 2.1s cubic-bezier(0.165, 0.84, 0.44, 1) infinite;
	animation-delay: 1.15s
}

@keyframes indeterminate { 
	0%{
		left: -35%;
		right: 100%
	}
	60%{
		left: 100%;
		right:-90%
	}
	100%{
		left: 100%;
		right:-90%
	}
}
@keyframes indeterminate-short { 
	0%{
		left: -200%;
		right: 100%
	}
	60%{
		left:107%;
		right:-8%
	}
	100%{
		left:107%;
		right:-8%
	}
}

#splashscreen {
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    position: fixed;
    background: #fff !important;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
    color: #000;
    z-index: 9999;
    font-display: swap;
    font-family: monospace, monospace;
}

#splashscreen div {
    display: block;
    text-align: center;
    width: 100%;
}

#splashscreen .progress {
    margin: 0px;
    position: absolute;
    bottom: 2px;
    height: 6px;
}

#splashscreen span.title {
    font-size: 2em;
    display: block;
}

#splashscreen span.descripton {
    font-weight: 200;
}