/******************************************************                        
   Lab Report CSS Tables ver. 1.1                                              
   Created by Louise Dade, 03 September 2005                                   
   http://www.classical-webdesigns.co.uk                                       
                                                                               
   You may use this style sheet, but please DO NOT                             
   link to it directly (hot-link) in your own files.                           
                                                                               
   Inc. Files: graph.png; fauxalpha.png; dlarrow.png                           
******************************************************/                        
                                                                               
/* We collapse borders because we don't want cell spacing.                     
   We specify the font family here too, including a generic fall-back.         
   We specify a global table font size, using 'ems' because they are           
   resizable and take their relative value from the global stylesheet. */      
table {                                                                        
    border-collapse: collapse;                                                 
    background-color:  #fff;                          
    color: #000;                                                               
    font-family: "Verdana", "Tahoma", sans-serif;                    
    font-size: 0.85em;                                                         
}                                

td.th {
		background-color: #ccc;
		font-weight:bold;
		text-align:center;
}
td.tf {
		background-color: #ccc;
		text-decoration: underline;
		text-align:center;
}                      
td.euro, td.euro_sum {
		text-align:right;
}                  
td.euro_sum_center {
		text-align:center;
}   
td.euro_sum_left {
		text-align:left;
}   
td.euro_sum, td.euro_sum_center, td.euro_sum_left {
		border-bottom-width:1px;
		border-color:#000;
		border-style:solid;
}    
tr.grayed {       
		background-color:#eee;
}
                                                                               
/* We add letter spacing because all caps makes the letters scrunchy           
   Also, left aligned because it was favoured by my university for table       
   captions, but yours might be different. Actually for a scientific paper,    
   the caption would be more detailed, resembling a table 'summary' */         
caption {                                                                      
    padding-bottom: 5px;                                                       
    font-variant: small-caps;                                                  
    letter-spacing: 0.1em;                                                     
    text-align: left;                                                          
}                                                                              
                                                                               
/* Table headers should be clear, but concise and discreet.                    
   The double border separates the row from caption and the table body         
   without needing a different background colour. Because we've specified      
   a text colour, we also specify a background colour (even though it's the    
   same as the main table colour) to accommodate personal stylesheets. */      
thead th {                                                                     
    border-top: 3px double #ccc;                                               
    border-bottom: 3px double #ccc;                                            
    padding: 2px 10px;                                                         
    background-color: #fff;                                                    
    color: #aaa;                                                               
    text-align: left;                                                          
    font-variant: small-caps;                                                  
    letter-spacing: 0.1em;                                                     
    white-space: nowrap;                                                       
}                                                                              
                                                                               
/* We've given the table footer the same double border treatment for the       
   same reason.  It also acts as a nice "end of table" indicator. It's         
   part of the data so we leave the text black. We also treat the header       
   and data the same way. */                                                   
tfoot th, tfoot td {                                                           
    border-top: 3px double #ccc;                                               
    border-bottom: 3px double #ccc;                                            
    padding: 2px 10px;                                                         
    font-variant: small-caps;                                                  
    letter-spacing: 0.1em;                                                     
}                                                                              
                                                                               
/* We now revert to discreet single pixel horizontal borders to separate       
   each entry.  If your table content is numerical data, you might want the    
   vertical borders too, but I find it's visually more pleasing and easier to  
   read online when there is plenty of padding instead of borders.             
   NOTE: we treat the headers and data cells the same here, visually it's clear
   enough (header text is bold) and does not affect screen-reader software */  
tbody th, tbody td {                                                           
    border-bottom: 1px solid #ccc;                                             
    padding: 2px 10px;                                                         
    text-align: left;                                                          
    vertical-align: top;                                                       
}                                                                              
                                                                               
/* Faux alpha transparency.  It's just a 16px square image (a PNG, but         
   could be a GIF) filled with a colour (I chose orange because it             
   contrasts pleasingly with blue - opposite on colour wheel) and then         
   every other pixel is filled with another colour (e.g. white) which is       
   made the transparent colour (ordinary transparency) - anything behind       
   the transparent pixels shows through and our wonderful brain fills in       
   the rest, thanks to Gestalt psychology.  Only really works when a solid     
   colour is required, such as table row rollovers. NOTE: IE doesn't like      
   tr:hover anyway so "pprrffffft!" to that! */                                
#property_input_table tbody tr:hover,  #show_cost_table tbody tr:hover{                                                               
    background-color: #f80; /*url(fauxalpha.png) transparent repeat center;        */          
}                                                                              
                                                                               
/* CSS2 selectors - this just means the link in the fourth TD along            
   (the last column).  It simply adds a "download" icon and makes the          
   text all caps - will be ignored by older browsers. We also add a            
   link colour (same as all other links) for personal stylesheets. */          
tbody td+td+td+td a {                                                          
    padding-right: 16px;                                                       
    background: url(dlarrow.png) transparent no-repeat bottom right;           
    color: #00d;                                                               
    font-variant: small-caps;                                                  
    letter-spacing: 0.1em;                                                     
}                                                                              
                                                                               
/* Finally we have the link styles: background has been rendered as            
   transparent so the background image isn't blocked in an ugly way. */        
tbody a {                                                                      
    background-color: transparent;                                             
    color: #00d;                                                               
    text-decoration: none;                                                     
}                                                                              
tbody a:visited {                                                              
    background-color: transparent;                                             
    color: #00a;                                                               
}                                                                              
tbody a:hover {                                                                
    background-color: transparent;                                             
    color: #00f;                                                               
}                                                                              
tbody a:active {                                                               
    background-color: transparent;                                             
    color: #f00;                                                               
}                                                                              
                                                                               
/* EOF */