#sidebar { position: absolute; top: 0; bottom: 0; left: 0; width: 290px; height: 100%; padding-left: 10px; border-right: 1px solid #000; } #sidebar a, #sidebar a:visited { color: #000; } #sidebar a { text-decoration: none; } #sidebar a:hover { text-decoration: underline; } #keys { position: absolute; top: 18.5em; left: 0; bottom: 0; width: 290px; padding-left: 10px; overflow: auto; } #keys ul { list-style-type: none; margin: 0; padding: 0; } #keys li { font-weight: normal; } #keys li.folder { font-weight: bold; margin-top: .05em; } #keys li.current a { background-color: #eee; } #keys li.hidden { display: none; } #keys .icon { padding: 1px 0 1px 20px; background: url(../images/folder-open.png) left center no-repeat; white-space: nowrap; } #keys li.collapsed ul { display: none; } #keys ul ul { margin-left: 6px; background: url(../images/tree-vline.gif) repeat-y; } #keys ul ul li { padding-left: 16px; background: url(../images/tree-node.gif) no-repeat; } #keys ul ul li.folder { background-image: url(../images/tree-folder-expanded.gif); } #keys ul ul li.folder.collapsed { background-image: url(../images/tree-folder-collapsed.gif); } #keys ul ul li.last { /* Hard-coded substitute for :last-child */ margin-bottom: .3em; background: #fff url(../images/tree-lastnode.gif) no-repeat; } #keys ul ul li.last.folder { background-image: url(../images/tree-lastnode-expanded.gif); } #keys ul ul li.last.folder.collapsed { background-image: url(../images/tree-lastnode-collapsed.gif); } #keys .deltree { display: none; } #keys .icon:hover .deltree { display: inline; } #resize { position: fixed; top: 0; left: 300px; bottom: 0; width: 5px; background-color: #aaa; cursor: col-resize; padding: 0; margin: 0; } #resize-layover { position: fixed; top: 0; left: 305px; right: 0; bottom: 0; width: 100%; z-index: 1000; } #frame { position: fixed; top: 0; left: 305px; right: 0; bottom: 0; padding-left: 2em; } #frame iframe { width: 100%; height: 100%; }