@charset "utf-8";
div#container {
border-left: 2px solid #DDD;
border-right: 2px solid #DDD;
border-top-left-radius: 0.4em 0.4em;
border-top-right-radius: 0.4em 0.4em;
border-bottom-left-radius: 0.4em 0.4em;
border-bottom-right-radius: 0.4em 0.4em;
}
div.columns {
float: left;
width: 100%;
height: 100%;
overflow-x: auto;
overflow-y: hidden;
white-space: nowrap;
background-color: #949494;
}
ul.column {
display: inline-block;
vertical-align: top;
overflow: hidden;
margin: 0;
padding: 0;
border-right: 1px solid #666;
background-color: white;
white-space: normal;
font-size: 0.9em;
}
ul.column.collapse {
display: none;
}
ul.column > li {
list-style: none;
padding-left: 0.5em;
padding-right: 0.5em;
padding-top: 0.25em;
padding-bottom: 0.25em;
min-width: 200px;
}
ul.column > li.parent::after {
content: "›";
float: right;
font-weight: bold;
}
ul.column > li:nth-child(odd) {
background-color: #EEE;
}
ul.column > li:hover {
color: black;
background-color: #DDE4E8;
}
ul.column > li.selected {
background-color: #08C;
color: white;
}
div.breadcrumb {
margin-top: 1em;
border-top-left-radius: 0.4em 0.4em;
border-top-right-radius: 0.4em 0.4em;
border-bottom: 1px solid #666;
}
div.breadcrumb > span {
height: 1.25em;
line-height: 1.25em;
font-size: 0.7em;
font-weight: bold;
color: #666;
}
div.breadcrumb > span::after {
content: " › ";
}
div.breadcrumb > span:first-child {
padding-left: 1em;
}
div.breadcrumb > span:last-child:after {
content: "";
}
div.toolbar {
margin-bottom: 1em;
border-bottom-left-radius: 0.4em 0.4em;
border-bottom-right-radius: 0.4em 0.4em;
clear: both;
border-top: 1px solid #666;
}
div.breadcrumb, div.toolbar {
height: 1.25em;
background: linear-gradient(#f0f0f0, #d8d8d8);
}