:root{
	--anim-top:  -100px;
	--anim-left: -100px;
	--hide: 0;
}

#dot-animation, #animation-placeholder{
	position: fixed;
	height: 9px;
	width:  9px;
	background-color: #a78848;
	/*border: 1px solid black;*/
	border-radius:  50%;
	z-index: 99999;
	top: var(--anim-top);
	left: var(--anim-left);
	transform-origin: center;
}

#animation-placeholder{
	opacity: 0;
	pointer-events: none;
	visiblility: hidden;
}

.topbar::before{
	content: "";
	position: fixed;
	left: var(--anim-left);
	top: var(--anim-top);
	background-color: black;
	width:  9px;
	height: 9px;
	z-index: 999999999;
	opacity: var(--hide);
}

.topbar::after{
	content: "";
	position: fixed;
	left: 0;
	top: calc(var(--anim-top) + 5px);
	height: 5px;
	background-color: red;
	width:  1958px;
	z-index: 999999999;
	opacity: var(--hide);
}

#range-animation{
	position: fixed;
	width: 1500px;
	bottom: 0;
	left: 0;
	max-width: 100%;
	z-index: 9999;
	display: none;
}

#state{
	width: 100%;
}

.navbar-area a.navbar-brand{
	position: relative;
}