/*
 * filename : modules.css
 * purpose  : style definitions for modularized controls
 * version  : $Rev: 304 $
 *
 */
 
/*content switcher found on local savings page*/
 .switcher { 
    overflow: hidden;    				
    margin: 20px 0;
    width: 656px;
    background: #0079c2 url(../graphics/bg_switcher-top.gif) top left no-repeat;
    }			
	.switcherNav { 			  
	    margin: 0 20px;   	    		    		    		    		    		    
	    height: 38px;	    
	    overflow: hidden;
	    }	     			    	    											
		.switcherNav li { 								
			float: left;
			margin: 10px 25px 0 0;
			padding-bottom: 15px;
			} 				
			.switcher .switcherNav li a {				    
				display: block;
				color: #fff;
				font-weight: bold;
                text-transform: uppercase;
                text-decoration: none;
				padding: 0;													
				}         
		.switcherContent {		 			
			background-color: #fff;										
			}
			.switcherTab { 		
			    border-left: 10px solid #0079c2; 
			    border-right: 10px solid #0079c2;			    		
				overflow: hidden;
				width: auto;															
				width: 616px;
				padding: 10px 10px 0 10px;
				}
				.switcherTab h3, .switcherTab p { padding: 0 10px; }				                           
				.switcherTab p.description { padding-bottom: 10px; }		
			.switcherFooter { 		    
		        background: #0079c2;
			    overflow: hidden;						
			    width: 656px;	
			    height: 50px;					
			    background: #0079c2 url(../graphics/bg_switcher-bottom.gif) bottom left no-repeat;
			    }											
			.switcherFooter { float: left; padding-right: 25px; }
			    .switcherFooter span span { 
			        display: block;
			        float: left;			        
			        margin: 5px 0 0 5px;
			        }
			    .switcherFooter a { 
			        display: block;
			        float: right;			        
			        margin: 5px 40px 0 5px;
			        _margin-right: 20px;
			        }
		
				
        .ui-tabs-hide { display: none;}
        .ui-state-active { 
            background: url(../graphics/bg_switcherTab-active.gif) center bottom no-repeat;             
            }        
        .switcher .switcherNav .ui-state-active a { color: #ffc82e; }    



/* orange bucket callouts */
.callouts { 
    background-color: #fff;
    float: left;
    }
a.local-savings,
a.save-it-forward,
a.simple-savings-ideas,
a.real-stories-and-tips {           
    float: left;
    width: 238px;
    height: 178px;
    margin-right: 1px;
    }
a.local-savings {
    background: url(../graphics/bg_callout_local-savings.png) top left no-repeat;
     margin-left: 4px; _margin-left: 2px;
     }
    a.local-savings:hover { background-position: 0 -178px; cursor: pointer; }
a.save-it-forward { 
    background: url(../graphics/bg_callout_save-it-forward.png) top left no-repeat;    
    }
    a.save-it-forward:hover { background-position: 0 -178px;}
a.simple-savings-ideas { 
    background: url(../graphics/bg_callout_simple-savings-idea.png) top left no-repeat;    
    }
    a.simple-savings-ideas:hover { background-position: 0px -178px;}
a.real-stories-and-tips { 
    background: url(../graphics/bg_callout_real-stories-and-tips.png) top left no-repeat; 
    margin-right: 0;   
    }
    a.real-stories-and-tips:hover { background-position: 0px -178px;}


/* whyJoin */
.whyJoinEntry {
    float: left;
    width: 75%;
    min-height: 48px;
    padding-left: 60px;
    margin: 0 0 25px 0;                    
    }
    .share { background: url(../graphics/icon_share.gif) top left no-repeat; }
    .help { background: url(../graphics/icon_help.gif) top left no-repeat;}
    .find { background: url(../graphics/icon_find.gif) top left no-repeat;}
    .learn { background: url(../graphics/icon_learn.gif) top left no-repeat;}
    
    .whyJoinEntry h3 {        
        margin: 0 10px 0 0;
        }     
    .whyJoinEntry p {        
        margin: 0 10px 0 0;
        }         
        
/* Join Us callout */
a.callout-join-us {
    background-image: url('../graphics/btn_joinUs.gif');
    background-position: left top;
    background-repeat: no-repeat;
    cursor: pointer;
    margin-bottom: 10px;
    margin-left: 38px;
    width: 197px;
    height: 42px;
    }
a.callout-join-us:hover {
    background-position: left bottom;
    }