﻿/** 
* Nalco Corporate Widget Styles 
*
* Purpose - Style the elements that make up the widgets / accordions
*
* @created: 3/10/09
* @modified: 3/13/09
* @author: Cummings Group
**/

#content #content_right div#widget_ctn {
    display:block;
    float:right;
    width: 210px;
}

#content #content_right div#widget_ctn .icons {
    float: right;
    clear: none;
    margin: 0;
}
    
    /* 
        ******************    
        *
        * tabbed widget styles
        *
        ******************
    */    
#content #content_right div.widget_tabbed    {
    width:200px;
    margin:0px 0px 20px 10px;
    }
    
    
    #content #content_right div.widget_tabbed ul    {
        display:none;
        list-style:none;
        margin:0;
        padding:0;
        }
        
        #content #content_right div.widget_tabbed ul li    {
            float:left;
            margin:0px;
            padding:0px;
            border-bottom:2px solid #ffb30d;
            height: 25px;
            background: url(/static/structural_images/widget_tab_off.gif) no-repeat bottom;
            display:block;
            text-align:center;
            }
            
            #content #content_right div.widget_tabbed ul li a    {
                display:block;
                padding:5px;
                text-decoration:none;
                font-weight: bold;
                color: #6d6e70;
                }
                
            #content #content_right div.widget_tabbed ul li a:hover    {
                background: none;
            }
                
                #content #content_right div.widget_tabbed ul li.on    {
                    background:url(/static/structural_images/widget_tab_on.gif) no-repeat bottom;
                }
                    
                #content #content_right div.widget_tabbed ul li.on a {
                    color: #083580;
                }
        
    
        #content #content_right div.widget_tabbed div    {
        clear:both;
        }
        
        #content #content_right div.widget_tabbed div    {
            padding:0;
            margin:0;
            border:none;
            background: url(/static/structural_images/widget_bottom.gif) bottom no-repeat;
            position:relative;
            }
        #content #content_right div.widget_tabbed div a.widget_more    {
            display: block;
            text-align: right;
            padding: 0 10px 10px 5px;
        }
        
        #content #content_right div.widget_tabbed div a.widget_more:hover    {
            background:none;
        }
        
            #content #content_right div.widget_tabbed div ul    {
                padding:0 5px 5px 5px;
                border: 1px solid #eee;
                border-bottom: none;
                list-style:none;
                display:block;
            }
            
            #content #content_right div.widget_tabbed div ul li    {
                background: none;
                text-align:left;
                height: auto;
                margin:0px 0px 0px 0px;
                float:none;
                border-bottom: 1px dashed #ccc;
                clear:both; display:block;padding:0 0 5px 0;
                }
                
            #content #content_right div.widget_tabbed div ul li a    {
                font-weight: normal;
                color: #083580;                
                display:block;                
            }

            #content #content_right div.widget_tabbed div ul li a img    {
                float:left;
                clear: both;
                margin: 5px 5px 0 0 ;
                display:block !important;
                display:none;
            }
            
            #content #content_right div.widget_tabbed div ul li a:hover    {
                background-color: #f5f5f5;
            }            
            
            #content #content_right div.widget_tabbed div ul li strong    {            
                color: #aaa;
                font-weight: normal;
            }
            
    /*
    ***********
    *
    *Standard widget styles
    *
    ***********
    */
#content #content_right div.widget    {
    width:200px;
    margin:0px 0px 20px 10px;
    }
    
    #content #content_right div.widget ul    {
        display:none;
        list-style:none;
        margin:0;
        padding:0;
        }
        
        #content #content_right div.widget span    {
            margin:0;
            padding:0 ;
            border-bottom:2px solid #083580;
            height: 25px;
            background: url(/static/structural_images/widget_single_tab.gif) no-repeat bottom;
            display:block;
            width: 100%;
            text-align: center;
            }
        #content #content_right div.widget span a    {
            display: block;
            padding: 5px;
            color: white;
            font-weight: bold;
            text-decoration: none;
        }
        
        #content #content_right div.widget span a    {
            background: url(/static/structural_images/widget_single_tab.gif) no-repeat bottom;            
        }
            #content #content_right div.widget ul li a    {
                display:block;
                padding:5px;
                text-decoration:none;
                font-weight: bold;
                color: #6d6e70;
                }
                
            #content #content_right div.widget ul li a:hover    {
                background: none;
            }
                
    
#content #content_right div.widget div    {
        clear:both;        }
        
        #content #content_right div.widget div    {
            padding:0;
            margin:0;
            border:none;
            background: url(/static/structural_images/widget_bottom.gif) bottom no-repeat;
            position:relative;
            }
        #content #content_right div.widget div a.widget_more    {
            display: block;
            text-align: right;
            padding: 0 10px 10px 5px;
        }
        
        #content #content_right div.widget div a.widget_more:hover    {
            background:none;
        }
        
            #content #content_right div.widget div ul    {
                padding:0 5px 5px 5px;
                border: 1px solid #eee;
                border-bottom: none;
                list-style:none;
                display:block;
            }
            
            #content #content_right div.widget div ul li    {
                background: none;
                text-align:left;
                height: auto;
                margin:0px 0px 0px 0px;
                float:none;
                border-bottom: 1px dashed #ccc;
                clear:both; display:block;padding:0 0 5px 0;
                }
                
            #content #content_right div.widget div ul li a    {
                font-weight: normal;
                height: auto;
                color: #083580;                
                display:block;                
            }
            
            #content #content_right div.widget div ul li a img    {
                float:left;
                clear: both;
                margin: 5px 5px 0 0 ;
                display:block !important;
                display:none;
            }      
      
            #content #content_right div.widget div ul li a:hover    {
                background-color: #f5f5f5;
            }            
            
            #content #content_right div.widget div ul li strong    {            
                color: #aaa;
                font-weight: normal;
            }    
            
/* Yellow Accordion */
    #content #content_right ul.accordion_yellow    {
        margin:0 0 10px 0;
        padding:0px;
        display:block;
        border:1px solid #6d6e70;
        }
        
        #content #content_right ul.accordion_yellow li    {
            list-style:none;
            margin:0px;
            padding:0px;
            line-height:normal;
            display:block;
            border-bottom:1px solid #6d6e70;
            }
            
            #content #content_right ul.accordion_yellow li h3 a    {
                color:#6d6e70;
                display:block;
                text-decoration:none;
                padding:5px 5px 5px 20px;
                font-size:16px;
                font-weight:bold;            
                background:url('/static/structural_images/accordion_yellow_plus.jpg') no-repeat 1% 50% #fee678;
                }    
                
                #content #content_right ul.accordion_yellow li h3 a:hover    {
                    background:url('/static/structural_images/accordion_yellow_plus.jpg') no-repeat 1% 50% #fee678;
                    }
        
            #content #content_right ul.accordion_yellow li ul    {
                margin:0px;
                padding:0px;
                display:block;
                border-top:1px solid #6d6e70;
                }
                
                #content #content_right ul.accordion_yellow li ul li    {
                    margin:0px;
                    padding:10px;
                    width:97%;
                    background:#efefef;
                    display:block;
                    border-bottom:1px dashed #6d6e70;
                    clear:both;        
                    }                                        
                    
                    #content #content_right ul.accordion_yellow li ul li span.date    {
                        float:left;
                        width:15%;
                        display:block;
                        }
                    
                    #content #content_right ul.accordion_yellow li ul li span.link    {
                        float:right;
                        width:80%;
                        }
                        
                        #content #content_right ul.accordion_yellow li ul li span.link a    {
                            display:block;
                            }
