body {
    font-family:'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
	padding:0; margin:0;
}
div.scrollmenu {
  background-color: #333;
  overflow: auto;
  white-space: nowrap;
}

div.scrollmenu a {
  display: inline-block;
  color: white;
  text-align: center;
  padding: 14px;
  text-decoration: none;
}

div.scrollmenu a:hover {
  background-color: #777;
}


div.scrollmenu>ul{
	position: absolute;
	right:0;
	top:0;
	width: max-content;
	overflow: hidden;
	transition: width 500ms ease-in-out;
	box-shadow: -1px 2px 4px rgba(0,0,0,.5);
	z-index:1;
	padding:0; margin:0;
	display: block;
	background-image: linear-gradient(#eee,#bbb);
}
div.scrollmenu li{
	list-style:none;
	padding:12px; margin:0;
	font-size: 14px;
	font-weight:bold;
	color:#333;
	border-bottom: 1px solid rgba(0,0,0,.5);
	cursor:pointer;
}
div.scrollmenu li:last-child{
	border-bottom:none
}
div.scrollmenu li:hover{
	text-decoration:underline;
}

label{
    float:left; margin:0 50px 0 50px;
}

button{
    float:left; clear:left;
    width:200px;
    margin-bottom:10px;
    cursor: pointer;
}
input{
    float:left;
}
hr{float:left; clear:both; margin:15px;border: 1px solid black;}
div.log{
    position: fixed;
    inset:50px 0 0 60%;
}
.log label{

}
.log textarea{
    width:100%;
    height:calc(100% - 50px);
}
#loginDlg{
   background-color: aliceblue;
    position: absolute;
    top: 150px;
    left: 350px;
    width: min-content;
	display:none;
	padding:20px;    
}
#loginDlg>label, #loginDlg>input{
	margin:0 auto;
}
#loginDlg>button{
    background-color: lightsteelblue;
    margin-top:20px;
    padding: 5px 2px;
    width:100%;
    border: outset 1px;
    float: none;
    clear: both;
    display: inline-block;
}	
div.frameShadow{
	position: fixed;
    inset: 0 0 0 0;
    background-color: #8888;
    display: flex;
    flex-direction: column;
    z-index: 1;
}
div.frameShadow>iframe{
	width:400px;
	height:500px;
	margin:auto;
}