body {
	font-family: "Albert Sans", sans-serif;
	background: #192341
}

body,
html {
	width: 100%;
	padding: 0;
	margin: 0
}

.content {
	display: flex;
	width: 100%;
	min-height: 100vh;
	justify-content: center;
	padding-top: 80px;
	text-align: center
}

.start-btn {
	border-radius: 100px;
	display: inline-block;
	background: #8a49c7;
	background: linear-gradient(0deg, #620996ff 0%, #8a49c7ff 100%);
	cursor: pointer;
	color: #fff;
	padding: 7px 10px 8px
}

.start-btn:hover {
	background: #8a49c7;
	background: linear-gradient(0deg, #620996f5 0%, #8a49c7f5 100%);
	color: #eee
}

.speedtest-area {
	width: 500px;
	max-width: 100%
}

footer {
	position: fixed;
	text-align: left;
	bottom: 0;
	backdrop-filter: blur(10px);
	width: 100%;
	background: #00000040;
	color: #fff;
	padding: 15px 30px
}

footer a:hover,
footer a:active {
	color: #5f89a7;
	text-decoration: underline
}

.data-used {
	font-weight: 700
}

:root {
	--translate-pixels: 153px;
	--translate-y: 45px
}

@-webkit-keyframes blinkWhite {
	0% {
		fill: #999
	}

	50% {
		fill: #fff
	}

	100% {
		fill: #999
	}
}

.blinking {
	-webkit-animation: blinkWhite 2s infinite;
	animation: blinkWhite 2s infinite
}

#stick {
	perspective: 500px;
	transform-origin: center center;
	transform: rotate(-123deg) translateX(var(--translate-pixels)) translateY(var(--translate-y));
	transition: transform .5s cubic-bezier(0.25, 0.46, 0.45, 0.94)
}

#speed-0,
#speed-5,
#speed-10,
#speed-20,
#speed-50,
#speed-75,
#speed-100 {
	animation-fill-mode: forwards;
	font-family: 'Montserrat', sans-serif !important;
	font-weight: 700;
	fill: #999
}

.run #speed-0,
.run #speed-5,
.run #speed-10,
.run #speed-20,
.run #speed-50,
.run #speed-75,
.run #speed-100 {
	-webkit-animation: blinkWhite 2s;
	animation: blinkWhite 2s
}

.run #speed-0 {
	-webkit-animation-delay: .1s;
	animation-delay: .1s
}

.run #speed-5 {
	-webkit-animation-delay: .2s;
	animation-delay: .2s
}

.run #speed-10 {
	-webkit-animation-delay: .3s;
	animation-delay: .3s
}

.run #speed-20 {
	-webkit-animation-delay: .4s;
	animation-delay: .4s
}

.run #speed-50 {
	-webkit-animation-delay: .5s;
	animation-delay: .5s
}

.run #speed-75 {
	-webkit-animation-delay: .6s;
	animation-delay: .6s
}

.run #speed-100 {
	-webkit-animation-delay: .7s;
	animation-delay: .7s
}

.active-speed {
	fill: #fff !important
}

#overlayGuage {
	display: none
}