
#topbar {
	xborder:1px solid red;
	position:fixed;
	top:0;
	left:0;
	width:100vw;
	padding:0px;
	margin:0px;
	background-color:#15171a;
	box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.7);
    
	z-index: 3;
	user-select:none;
	display: flex;
	flex-direction: row;
	justify-content: center;

}	

#topbar-content {
	xborder:1px solid red;
	font-family:consolas,monospace;
	width:100%;
	xmargin:auto;
	max-width: 400px;
	display: flex;
	flex-direction: row;
	justify-content: space-evenly;
	xjustify-content: start;
	xbackground-color:black;
}

#topbar-content  > #title {
	xborder:1px solid grey;
	padding:5px;
	font-size: 2em;
	xmargin:0px 5px 0px 0px;
	height:100%;
	text-decoration:none;
	transition: all 0.1s;
	text-shadow: 
	0 0 1vw #FA1C16, 
	0 0 3vw #FA1C16, 
	0 0 10vw #FA1C16, 
	0 0 10vw #FA1C16, 
	0 0 .4vw #FED128, 
	1px 1px 0px #806914
	;
	color: #ffd748;
}	



#topbar-content  > #menu-items{
	xborder:1px solid orange;
	color:grey;
	display:flex;
}	

#topbar-content  > #menu-items > .item {
	xborder:1px solid grey;
	display:inline-block;
	vertical-align:middle;
	padding:10px 20px 10px 20px;
	text-decoration:none;
	transition: all 0.1s;
	margin:0px;
	text-align:center;
    cursor:pointer;
    display:flex;
    align-items: center;
    justify-content: center;
}

#topbar-content  > #menu-items > .item.active {
    color:#1bff8d;
	text-shadow:0px 0px 15px #44ff79, 0px 0px 90px white ; 
}

#topbar-content > #menu-items > .item:hover {
	background-color:rgba(0,0,0,0.5);
	
}

#topbar-content > #menu-items > .item:active {
    background-color:rgba(0,0,0,0.8);
    color:#76ffba;
}