.top-bar {
	 position:relative;
	 display:flex;
	 height:5rem;
	 background-color:#0664aa;
	 background-color:rgba(6,100,170,var(--bg-opacity));
	 padding:.5rem 1.5rem;
	 align-items:center;
	 justify-content:space-between;
	 color:#ebf8ff;
	 color:rgba(235,248,255,var(--text-opacity));
	 border-color:#d51111;
	 border-color:rgba(213,17,17,var(--border-opacity));
	 border-bottom-width:4px;
}
.bar-btn {
	 border-width:1px;
	 border-color:#fafafa;
	 border-color:rgba(250,250,250,var(--border-opacity));
}

.cover-panel { position:fixed; width:100%; left:0;right:0;top:0;bottom:0; background-color: rgba(0,0,0,0.7); z-index:9999; display:none; }
.cover-spin::after { content:''; display:block; position:absolute; left:48%;top:40%; width:40px;height:40px; border-style:solid; border-color:black; border-top-color:transparent; border-width: 4px; border-radius:50%; -webkit-animation: spin .8s linear infinite; animation: spin .8s linear infinite; }