volcanos/panel/header.css

fieldset.Header { font-size:1.2em; padding:0 5px; height:32px; overflow:hidden; z-index:10; }
fieldset.Header>div.output { height:32px; overflow:hidden; }
fieldset.Header>div.output>div { padding:5px; height:22px; cursor:pointer; }
fieldset.Header>div.output>div:hover { background-color:#2e515f; border-bottom:solid 2px red; }
fieldset.Header>div.output>div.title { float:left; }
fieldset.Header>div.output>div.state { float:right; }
fieldset.Header>div.output>div.state.avatar>img { height:1.4em; }
fieldset.Header>div.output>div.search { margin-left:20px; float:left; }
fieldset.Header>div.output>div.search>input { margin-top:-5px; height:25px; border-radius:0; }
fieldset.Header>div.output div.menu { padding:5px; height:21px; cursor:pointer; float:left; }
fieldset.Header>div.output div.menu:hover { background-color:#2e515f; border-bottom:solid 2px red; }

div.head {
	background-color:#404040; padding:5px; height:42px; clear:both;
}
div.left div.username div {
	color:white; text-align:center; padding:10px;
}
div.left div.username img {
	padding:0 10px; width:100px;
}
div.head div.username img {
	height:40px; float:left;
}
div.head div.username div {
	padding:12px; float:left;
}
div.head div.username {
	color:white; float:right;
	padding-right:10px;
}
div.head div.menu {
	color:white; cursor:pointer; padding:10px; float:left;
}
div.head div.menu:hover {
	background-color:#323232;
}
div.left {
	width:120px;
	background-color:#323232; overflow:auto; float:left;
}
div.left:hover {
	background-color:#323232;
}
div.left div.item {
	background-color:#323232;
	color:white; padding:5px 10px;
}
div.left div.item:hover {
	background-color:#404040;
}
div.main {
	background-color:#cccccc; height:180px; width:180px; overflow:auto; float:left;
}
div.main iframe {
	border:0;
}
div.main fieldset.plugin {
	background-color:#f8f8f8; padding:10px; margin:10px;
}
div.main fieldset.plugin form.option div.item {
 	margin:10px;
}
div.main fieldset.plugin div.action div.item {
 	margin:10px;
}
div.main fieldset.plugin legend {
	box-shadow:none;
	background-color:#e4e4e4;
	color:black;
	display:block;
	float:left;
}
div.main fieldset.plugin form.option {
	display:block;
	clear:both;
}
div.main fieldset.plugin select {
	background-color:white; color:black;
 	border:solid 1px gray; outline:none;
	box-shadow:none;
}
div.main fieldset.plugin input[type=text] {
	background-color:white; color:black; padding:2px 10px;
 	border:solid 1px gray; outline:none;
	border-radius:3px 3px;
	box-shadow:none;
}
div.main fieldset.plugin input[type=button] {
	background-color:blue; color:white; padding:4px 10px;
	border:none; border-radius:3px 3px;
}
div.main fieldset.plugin table.content {
 	border-collapse:collapse;
	display:block;
}
div.main fieldset.plugin table.content thead {
	z-index:1;
}
div.main fieldset.plugin table.content tr {
	border:solid 1px lightgray;
}
div.main fieldset.plugin table.content th {
	background-color:#fbfbfb; color:rgba(0,0,0,.45); font-weight:100; padding:10px;
}
div.main fieldset.plugin table.content td {
	background-color:white; color: #5c5c5c; padding:10px;
}
div.main fieldset.plugin div.status {
	color:black;
}
div.foot {
	background-color:#404040; height:32px; clear:both;
}

div.tabs:hover {
	background-color:#272727;
}
div.tabs div.name {
	height:46px; width:-webkit-fill-available;
	position:sticky; top:5px;
	z-index:1;
}
div.tabs div.name div.item {
	color:gray; padding:10px; float:left;
}
div.tabs div.name div.item.select {
	background-color:#404040; color:white;
 	border-bottom:solid red 2px;
}
div.tabs div.page {
	overflow:auto; clear:both;
}
div.tabs div.page>div.input {
	padding:5px; position:sticky; top:0px;
}
div.tabs div.page>div.input input {
	background-color:#212121; color:white; border:0; outline:none; width:230px;
}
div.tabs div.page>div.item {
	background-color:#404040; clear:both; display:none;
}
div.tabs div.page>div.list {
	padding-left:20px; display:none; clear:both;
}
div.tabs div.page>div.list.select {
	background-color:#323232; display:block;
}
div.left div.list {
	padding-left:20px;
}

div.tabs.left div.name {
	float:left;
}
div.tabs.left div.name div.item {
	border-bottom:none; float:none;
}
div.tabs.left div.name div.item.select {
	border-right:solid red 2px;
}
div.tabs.left div.page {
	width:-webkit-fill-available;
 	clear:none; float:left;
}
div.tabs.left div.page>div.item {
	display:block;
}

div.tabs.void div.name {
	display:none;
}
div.tabs.void div.page>div.item {
	display:block;
}