/* Default.aspx page styles.
  
    This CSSheet is applied to just the Default.aspx page by using the 
    [@Page StylesheetTheme="HomeTheme"] method, at the top of the Default.aspx pages source code.

TIP on understanding Cascading Style Sheets (CSS)

Each CSS style rule has two main parts — a selector (such as h1) and a declaration (such as color:red). The declaration includes a property (color) and its value (red).

You can define styles to apply to tags by tag name, such as h1. To allow you to create different styles for the same element, 
    or the same style for different elements, you can create CSS classes. 

A '#' before a word means the style information pertains to everything on the page with that ID
    (ie. 
        Code in .aspx page:
                <td id="tdExtraction">

        Code in CSS: 
                #tdExtraction
                {
                    background-image:url(images/T4Phage50perHt380px.gif);
                    background-repeat:no-repeat;
                    background-position: center center;
                    height: 380px;
                    width:30%;
                    border:solid 1px #0099ff;
                }
     )

A '.' before a word means the style information pertains to everything on the page with that class.

    (ie. 
        Code in .aspx page:
                <div id="div13" class="divContainerHeader_Default">

        Code in CSS: 
                .divContainerHeader_Default
                {
                    background-color:#0099ff;
                    text-transform:uppercase;
                    text-align:center;
                    font-size:12px;
                    font-weight:bold;
                }
     )

Specifying :visited, :link, :hover attributes
       Code in CSS: 
            .menuNavigationSite :visited, :link
            {
	             color: #000000; 
            }


Precedence of CSS Style Rules
CSS style rules cascade in the sense that global style rules continue to apply to HTML elements unless local style rules override them. In general, local style rules take precedence over general style rules. This means, for example, that a style defined in a style block in a Web page overrides a style defined in an external style sheet. Similarly, an inline style that is defined within a single HTML element on the page overrides any styles that are defined for that same element elsewhere. 

Portions of global style rules not overridden by local CSS style rules continue to apply to elements even after local styles are applied. In the code example in the previous section, the local CSS styles governing text in the h1 element replace some of the Web browser's global style rules for h1 text (center h1 text and make it red), but they do not change all of the available styles, such as font characteristics. Both global and local style rules are applied, in that order, making all the h1 text on this page display in a larger font that is formatted as bold, centered, and colored red.

CSS Styles and ASP.NET Themes
ASP.NET allows you to define themes, which are a combination of property settings for Web server controls, style sheet rules, and images. By applying a theme to a Web site, you can specify a consistent look across all of the pages in the site.

Themes are similar to styles in that they define a global set of characteristics for elements on a page. However, unlike styles in a style block or style sheet, you can control the precedence of settings. By default, when you apply a theme to a page or a Web site, the styles and other properties in the theme take precedence over the locally defined styles. This is the opposite behavior from the way styles are normally applied. This behavior was designed to allow themes to be applied to existing pages (including those with locally defined styles) and establish the same look for different pages.

You can also apply a theme as a style sheet theme. In that case, the styles and properties defined in the theme are applied in the same way that CSS styles are — local styles take precedence over styles that are defined in the theme. For more information, see ASP.NET Themes and Skins Overview.

*/

/*
  --Start-- General Styles
*/
A
{
   text-decoration:none; 
   font-weight:bold;  
   color:#0000ff;
}

a:hover
{
    color:#ff0000;
}
a:visited
{
     font-weight:normal;
}

/*
  --End-- General Styles
*/
/*
  --Start-- Styles for Products Pages
*/
.tableProducts
{
    border:solid 1px #0099ff;
    text-align:left;
    font-size:12px;
    font-weight:bold;
    }
.tbody_Header_tableProducts
{
     background-color:#0099ff;
     text-transform:uppercase;
     text-align:center;
     color:#ffffff;
     text-decoration:underline;
}

.tbody_shaded_tableProducts
{
     background-color:#0099ff;
}
.tbody_white_tableProducts
{
     background-color:#ffffff;
}

.tbody_sectionDivider_tableProducts
{
    background-color:#990000;
    text-align:center;
    font-weight:bold;
    color:#ffffff;
    
}
.div_Content_Products
{
    width:90%;
    margin-left:50px;
}
.divFootnote
{
    font-size:10px;
}

/*
  --EDN-- Styles for Products Pages
*/


/*
Only the Default page has different informative container formating from the 
 rest of the site.

*/
.divContainer_Universal
{
    background-color:Transparent;
    text-align:left;    

}

.MouseOver_divContainer_Universal
{
    background-color:#ff0000;
    text-align:left;    

}
.divContainerHeader_Universal
{
    background-color:#507cd1;
    text-align:center;
    font-size:16px;
    font-weight:bold;
    color:#ffffff;
    border:solid 2px #507cd1;
}

.MouseOver_divContainerHeader_Universal
{
    background-color:#ff0000;
    text-align:center;
    font-size:16px;
    font-weight:bold;
    color:#ffffff;
    border:solid 2px #ff0000;
} 


/*
    --Start-- Styles for the Contact Us page
previous border color #0099ff
    background-color:#f5f5f5;
    border-bottom:solid 2px #507cd1;

*/

#divContainer_ContactUs
{
    width:30%;
    background-color:#eff3fb;
    border:solid 1px #507cd1;
}

#divBodyContent_ContactUs
{
     text-align:center;
}

/*
    --End-- Styles for the Contact Us Page.
*/

.menuNavigationSite
{
     width:auto;
	 color: #0000ff; 
}

.menuNavigationSite :hover
{
	 color: #ff0000; 
}

menuStaticNavigationSite
{
    background-color:#b9b9b9;
}

.menuItemStaticNavigationSite 
{
    width:100px;
    border-color: #dcdcdc;
    border-style:solid;
    border-width:1px;
    text-align:center;    
}

.menuStaticHoverNavigationSite
{
    background-color:#b9b9b9; 
    border-color: #898989;
    border-style:solid;
    border-width:1px;
}

.menuDynamicNavigationSite 
{
    background-color:#dcdcdc;
    border-color: #898989;
    border-style:solid;
    border-width:1px;

}

.menuItemDynamicNavigationSite :hover
{
    color: #ff0000;   
}

.menuItemDynamicNavigationSite
{
    width:inherit;
    background-color:#dcdcdc; 
    border-color: #dcdcdc;
    border-style:solid;
    border-width:1px;
    color: #0000ff;   
}

.menuDynamicHoverNavigationSite
{
    background-color:#b9b9b9; 
    border-color: #898989;
    border-style:solid;
    border-width:1px;
}

/*
Styles for the UserControl Table of Contents
**Currently not used**
*/
.menuStaticTOC
{
    color: #0000ff;   
    background-color:Transparent; 
    width:100%;
    height:198;
}

.menuStaticTOC :hover
{
    color: #ff0000;   
}
.menuItemStaticTOC
{
    width:100px;
    text-align:center;    
}

.menuStaticHoverTOC
{
    width:100%;
    color: #ff0000;   
    background-color:#99ccff; 
    border-color: #4682b4;
    border-style:solid;
    border-width:1px;
}

/*
The following are for the Microbes.master Treeview menu

The TreeView control is made up of nodes. Each entry in the tree is called a node and is represented by a TreeNode object. 
    Node types are defined as follows:

-A node that contains other nodes is called a parent node. 
-The node that is contained by another node is called a child node. 
-A node that has no children is called a leaf node. 
-The node that is not contained by any other node but is the ancestor to all the other nodes is the root node. 

A node can be both a parent and a child, but root, parent, and leaf nodes are mutually exclusive. 
    Several visual and behavioral properties of nodes are determined by whether a node is a root, parent, or leaf node.

Although a typical tree structure has only one root node, the TreeView control allows you to add
    multiple root nodes to your tree structure. This is useful when you want to display item listings without displaying a single root node, as in a list of product categories.

Each node has a Text property and a Value property. The value of the Text property is displayed in 
    the TreeView, while the Value property is used to store any additional data about the node, such as data that is passed to the postback event that is associated with the node. 


*/

.treeMicrobes
{
    background-color:#d9d9d9;
    width:auto;
     color:#0000ff;
}

.treeMicrobes :hover
{
     color:#ff0000;
}

.HoverNodeStyle_treeMicrobes
{
    background-color:#b9b9b9; 
    border-color: #898989;
    border-style:solid;
    border-width:1px;
}

.NodeStyle_treeMicrobes
{
    border-color:#d9d9d9;
    border-style:solid;
    border-width:1px;
}

.RootNodeStyle_treeMicrobes
{   background-color:#d9d9d9;
    border-width:0px;
}

.tdIntro
{
    background-color:#add8e6;
    width:98%;
    border:solid 2px #507cd1;
    text-align:center;
    font-weight:bold;
    font-size:16px;
   
}

/*
Header for the sections
*/
.tdHeader
{
    background-color:#507cd1;
    text-align:center;
    font-size:16px;
    font-weight:bold;
    color:#ffffff;
    border:solid 2px #507cd1;
}

.MouseOver_tdHeader
{
    background-color:#ff0000;
    text-align:center;
    font-size:16px;
    font-weight:bold;
    color:#ffffff;
    border:solid 2px #ff0000;
}

.MouseOver_divContainerHeader_Universal
{
    background-color:#ff0000;
    text-align:center;
    font-size:16px;
    font-weight:bold;
    color:#ffffff;
    border:solid 2px #ff0000;
} 
.tdExtraction
{
    background-image:url(images/T4Phage50perHt380px.gif);
    background-repeat:no-repeat;
    background-position: center center;
    height:350px;
    width:40%;
    border:solid 1px #507cd1;
    cursor:pointer;
}

.MouseOver_tdExtraction
{
    background-color:#ff6666;
    height:350px;
    width:40%;
    border:solid 1px #ff0000;
    cursor:pointer;
}

.tdMasterMix
{
      background-image:url(images/Beacon-artistic20perHt380px.gif);
      background-repeat:no-repeat;    
      background-position:center center;
      height:350px;
      width:40%;
      border:solid 1px #507cd1;
      cursor:pointer;
}
.MouseOver_tdMasterMix
{
      background-color:#ff6666;
      height:350px;
      width:40%;
      border:solid 1px #ff0000;
      cursor:pointer;
}
.tdIDSequencing
{
      background-image:url(images/dblHelix20perHt380.gif);
      background-repeat:no-repeat;    
      background-position:center center;
      height:350px;      
      width:20%;
      border:solid 1px #507cd1;
      cursor:pointer;
}

.MouseOver_tdIDSequencing
{
      background-color:#ff6666;
      width:20%;
      border:solid 1px #ff0000;
      cursor:pointer;
}

#trAttostarInfo
{
    text-align:center;
    font-size:16px;
    font-weight:bold;
    color:#000000;
   
}

#tdAttostarInfo
{
    width:50%;
}

#divAttotstarInfoContainer_Default
{
    background-color:#f5f5f5;
    border:solid 1px #ff9900;
    width:50%;
    position:relative;
}

#divAttotstarInfoContainerHeader_Default
{
    background-color:#ff9900;
    text-transform:uppercase;
    text-align:center;
    font-size:12px;
    font-weight:bold;
    border:solid 2px #ff9900;
}

.contentStriking
{
    font-size:18px;
    color:#ff0000;
    font-weight:bold;   
}

.backToTop
{
    font-size:14px;
    font-variant:small-caps;
    font-weight:bolder;
}

.labelQuickAdd
{
  color:#ff0000;   
}