/*
body { margin: 0 ; }
table { border-collapse: collapse ; }
img { border: none ; }
*/

/*## handy styles library ##*/

.currency	{ text-align: right ; white-space: nowrap ; }
.nowrap  	{ white-space: nowrap ; }

.padded 	{ margin: 4px ; padding: 4px ; }

.htdbcodeoutput { display: table ; margin: auto ; }
.htdbmsg { 
	background-color: #ffff88 ;  
	margin: 4px ; padding: 4px ; 
	}
.htdbmsg.buglog, .htdbmsg.bugtrace { 
	background-color: #ffdddd ;  
	}
.htdbmsg.bugdump {
	background-color: #ffdddd ; 
	white-space: pre ; 
	}
.vlabel { text-align: right ; white-space: nowrap ; font-weight: bold ; } 


table.htdbtable thead th { text-align: center ; white-space: nowrap ; font-weight: bold ; }

/* even rows of a table body, and any header row */
table.htdbtable tbody tr:nth-child(even), 
table.htdbtable thead tr	
{ background-color: rgba(240,240,240,0.6) ; }


        
/* tab effect */
.htdbtabs 			{ text-align: center ; position: relative ; }
.htdbtabs.top 		{ border-bottom: thin solid black ; top: 1px ; }
.htdbtabs.bottom 	{ border-top: thin solid black ; bottom: 1px ; }

.htdbtabs > * {      
	border-radius: 10px 10px 0px 0px ;
	display: inline-block ; 
	padding: 4px 10px ; 
	border: thin solid black ;
  background: rgba( 0,0,0, 0.07 ) ;
	}
.htdbtabs.top > * { 
	margin: 1px 4px 0px 4px ; border-bottom: none ; 
}
.htdbtabs.bottom > * { 
	margin: 0px 4px -1px 4px ; border-top: none ; 
	border-radius: 0px 0px 10px 10px ; 
}

.htdbtabs .activetab 		{ background-color: white ; }
.htdbtabs.top .activetab 	{ position: relative ;	top: 1px ; } 
.htdbtabs.bottom .activetab	{ position: relative ;	bottom: 1px ; } 



/*## HTDB widgetry ##*/

/* hanging htdb output widget */
.htdbouthandle, .htdbhangtab { 
  border: solid 1px ;      
  background-color: #ffffee ; 
  min-width: 100px ; min-height: 10px ;
  position: absolute ; top: 0 ;  
  left: 15% ;
}
.htdboutclose { 
  text-decoration: none ; 
  font-weight: bold ; 
  margin-left: 10px ;
}
.htdboutclose:visited + .htdboutput, .htdboutclose:visited { display: none ; }
.htdbouthandle:hover .htdboutput { display: inline ; }


/* columns hanging from a ledge */
.columnledge { text-align: center ; white-space: nowrap }
.columnledge > .column { 
	white-space: normal ;
	padding: 4px ; 
	display: inline-block ; 
	vertical-align: top ; 
	text-align: left ;
}


/* grids - table emulation */

.grid,
.bigrid,
.trigrid,
.varray
{ display: table ; }

.grid > div, 
.bigrid > div, 
.trigrid > div, 
.varray > div, 
.gridrow, 
.bigridrow, 
.trigridrow,
.varrayrow,
.varrayrow ~ div 
{ display: table-row ; }

.grid > div > *, 
.bigrid > div > *, 
.trigrid > div > *, 
.varray > div > *, 
.gridrow > *, 
.bigridrow > *, 
.trigridrow > *, 
.varrayrow > *,
.varrayrow ~ * > * 
{ display: table-cell ; padding: 4px ; }



/* bigrid is a grid of two columns, aligned right and left, respectively */
.bigrid > div > 	*:first-child,
.varray > div >  	*:first-child,
.varrayrow >      	*:first-child,
.varrayrow ~ div > 	*:first-child
{ text-align: right ; }

/* varray is a vertical array, a bigrid meant for display of key/value pairs */
.varray > div > 	*:first-child, 
.varrayrow > 		*:first-child,
.varrayrow ~ div > 	*:first-child
{ white-space: nowrap ; font-weight: bold ; }
.varray > div 		> *,
.varrayrow 			> *,
.varrayrow ~ div 	> *
{ vertical-align: middle ; padding: 1px ; }



/* trigrid is a grid of three columns of equal width,
aligned left, center, and right, respectively */
.trigrid > div > *, .trigridrow > *
{ width: 33% ; }
.trigrid > div > * ~ *, .trigridrow > * ~ *
{ text-align: center ; }
.trigrid > div > * ~ * ~ *, .trigridrow > * ~ * ~ *
{ text-align: right ; } 

/* a colspanall table cell allows a block-level child element to overflow the cell, simulating a rowspan 
	you'll just have to set the child element's width arbitrarily */
.colspanall 		{ max-width: 0 ; }
.colspanall > * 	{ white-space: normal ; font-weight: normal ; text-align: left ; }