#content            { position: static;  width: 100%; min-height: 400px; margin-top:-1px; border-top: 1px solid #ccc }
#side               { position: absolute; width: 240px }
#tools              { position: absolute; width: 308px }
#main               { position: absolute; left: 240px; right: 0; border-left: 1px solid #ccc }
#main, #side, #tools{ top: 140px; bottom: 20px }
#mainbar            { position: absolute; top: -20px; left: 0; right: 0; padding: 0 20px; font-size: 90%; color: #666 }
#container,
#images             { position: absolute; top: 0; right: 0; bottom: 0; left: 0; padding: 10px; overflow-x: hidden; overflow-y: auto; text-align: justify;}
#toolbar            { position: absolute; left: 0; right: 0; height: 20px; padding-left: 20px; background-color: #EEEEEE; border-bottom: 1px solid #CCCCCC; line-height :19px;}
#toolbar span       { padding: 0 5px; font-size: 90% }


#content.full #main { left: 16px }
#content.full #side { width: 16px }
#content.full #context-tabs
                    { display: none }
#content.mid #main  { left: 366px }
#content.mid #side  { width: 366px }

.tabs           { float: left; margin: -20px 0px 0 16px; width: 100%; }
.tabs li.selected
                { background-color: #2A85B6; border-left: 1px solid #2A85B6; border-right: 1px solid #2A85B6; border-top: 1px solid #2A85B6; }
.tabs li.selected:hover
                { background-color: #2A85B6; }
.tabs li.selected a { color: #fff; }
.tabs li:hover  { background-color: #eee; }
/* .tabs li.switch { width: 18px; -moz-border-radius-topleft: 0px; } */
.tabs li        { -moz-border-radius-topleft:3px; -moz-border-radius-topright:3px; border-left:1px solid #ddd; border-right:1px solid #ddd; border-top:1px solid #ddd; float: left; font-size: 9px; font-weight:bold; line-height: 15px; margin-right: 2px; padding: 2px 0; text-align: center; text-transform: uppercase; }
.tabs li a      { color: #666; padding: 0 5px; text-align: center; text-decoration: none; }

.switch         { float: left; height: 100%; width: 16px; overflow-y: auto; background: #ddd url(/images/famfamfam/bullet_arrow_left.png) no-repeat scroll -2px 50%; }
.switch:hover   { background-color: #ccc }
#content.full #side .switch
                { background: #ddd url(/images/famfamfam/bullet_arrow_right.png) no-repeat scroll 2px 50% }

.tab-contents   { height: 100%; overflow-x: hidden; overflow-y: auto }
.tab-contents span,
.tab-contents .actions
                { /*padding: 5px; */text-align: center; font-size: 90% }
.tab-contents .actions a
                { padding-right: 10px;}
.tab-content    { float: left; /*height: 100%; */padding: 5px/*width: 190px; *//*margin-left: 16px;*/ }
.tab-content .batch { display: block; width: 100%; text-align: center }
.tab-content .im { margin: 0 }

/* #selection      { text-align: center } */
/* #selection .im  { display: block } */

#categories         { background-image: url('/images/root.gif'); background-position: top left; background-repeat: no-repeat; background-color: #FFF; padding-top: 9px; }
.categories ul      { list-style-type: none; font-size: 11px; padding: 0; margin: 0; }
.categories a,
.categories span    { padding: 0; margin: 0; }
.categories a.marker,
.categories span.marker { width: 15px; height: 16px; display:block; float:left; background-repeat: no-repeat; }
.categories li div  { clear: both; height: 1px }

.categories li li                           { background-image: url('/images/vert_line.gif'); background-repeat: repeat-y; padding-left: 16px }
.categories li:last-child > ul > li         { background-image: none; background-repeat: repeat-y }
.categories span.marker                     { background-image: url('/images/x_middle.gif') }
.categories li:last-child > span.marker     { background-image: url('/images/x_last.gif') }
.categories a.cat-collapse                  { background-image: url('/images/minus_middle.gif') }
.categories li:last-child > a.cat-expand    { background-image: url('/images/plus_last.gif') }
.categories a.cat-expand                    { background-image: url('/images/plus_middle.gif') }
.categories li:last-child > a.cat-collapse  { background-image: url('/images/minus_last.gif') }
.categories .cat-loading                    { background-image: url('/images/cat-loading.gif') }
.categories .cat-name                       { padding-left: 1px }

div ul.tree         { background-image: url('/images/root.gif'); background-position: top left; background-repeat: no-repeat; background-color: #FFF; padding-top: 9px; }
ul.tree             { list-style-type: none; font-size: 11px; padding: 0; margin: 0; }
.tree a,
.tree span    { padding: 0; margin: 0; }
.tree a.marker,
.tree span.marker { width: 15px; height: 16px; display:block; float:left; background-repeat: no-repeat; }
.tree li div  { clear: both; height: 1px }

.tree li li                       { background-image: url('/images/vert_line.gif'); background-repeat: repeat-y; padding-left: 16px }
.tree li:last-child > ul > li     { background-image: none; background-repeat: repeat-y }
.tree span.marker                 { background-image: url('/images/x_middle.gif') }
.tree li:last-child > span.marker { background-image: url('/images/x_last.gif') }
.tree a.collapse                  { background-image: url('/images/minus_middle.gif') }
.tree li:last-child > a.expand    { background-image: url('/images/plus_last.gif') }
.tree a.expand                    { background-image: url('/images/plus_middle.gif') }
.tree li:last-child > a.collapse  { background-image: url('/images/minus_last.gif') }
.tree .loading                    { background-image: url('/images/cat-loading.gif') }
.tree .name                       { padding-left: 1px }