/* CSS Document - Changeworks*/

/* CSS validated 05/07/06 - GJS - see http://jigsaw.w3.org/css-validator/validator */

/*html {background:url(images/snowflakes_bg.jpg) top left repeat-y;}*/
/* top of page holder and links*/
#topholder {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 784px;
    height: 33px;
    background-color: #CCCC00;
    color: #000000;
}

#toplinks {
    position: absolute;
    top: 5px;
    left: 18px;
    }

#toplinks a, #toplinks a:visited {
    color: #333300;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    padding-left: 8px;
    padding-right: 8px;
    text-decoration: none;
    background-color: #CCCC00;
}

#toplinks a:hover {
    color: #333333;
    text-decoration: underline;
    background-color: #CCCC00;
}



/* dividers at the top between links*/
#break01 {
    position: absolute;
    top:7px;
    left: 71px;
    height: 19px;
    width: 2px;
    
    }
    
#break02 {
    position: absolute;
    top:7px;
    left: 126px;
    height: 19px;
    width: 2px;
    
    }
    
#break03 {
    position: absolute;
    top:7px;
    left: 216px;
    height: 19px;
    width: 2px;
    
    }
    
#break04 {
    position: absolute;
    top:7px;
    left: 314px;
    height: 19px;
    width: 2px;
    
    }
    
#break05 {
    position: absolute;
    top:7px;
    left: 441px;
    height: 19px;
    width: 2px;
    
    }
    
#break06 {
    position: absolute;
    top:7px;
    left: 493px;
    height: 19px;
    width: 2px;
    
    }
    
#break07 {
    position: absolute;
    top:7px;
    left: 558px;
    height: 19px;
    width: 2px;
    
    }
    
#break08 {
    position: absolute;
    top:7px;
    left: 645px;
    height: 19px;
    width: 2px;
    
    }

#break09 {
    position: absolute;
    top:7px;
    left: 697px;
    height: 19px;
    width: 2px;
    
    }


/* holder for logo and icon*/

#holdertwo {
    position: absolute;
    top: 33px;
    left: 0px;
    width: 783px;
    border-right: #CCCC00 1px solid;
    height: 99px;
    background:#FFFFFF;
}

#lefticon {
    position: absolute;
    top: 31px;
    /*left: 27px;*/
	left: 720px;
}
    
#logoarea {
    position: absolute;
    top: 12px;
    /*left: 627px;*/
	left:27px;
}

/* Rollover buttons to link to main areas of website*/

#buttonholder {
    position: absolute;
    top: 132px;
    left: 0px;
    width: 783px;
    height: 28px;
    border-right: #CCCC00 1px solid;  
    background:#FFFFFF;
}

#householders {
    position: absolute;
    top: 0px;
    left: 8px;
}
    
#businesses {
    position: absolute;
    top: 0px;
    left: 104px;
}   

#voluntary {
    position: absolute;
    top: 0px;
    left: 200px;
}   

#localhousing {
    position: absolute;
    top: 0px;
    left: 296px;
}

#schools {
    position: absolute;
    top: 0px;
    left: 392px;
}

#community {
    position: absolute;
    top: 0px;
    left: 488px;
}

#healthpros {
    position: absolute;
    top: 0px;
    left: 584px;
}

#nationalorgs {
    position: absolute;
    top: 0px;
    left: 680px;
}


/* top image area*/

#topimageholder {
    position: absolute;
    top: 160px;
    left: 0px;
    width: 783px;
    height: 133px;
    border-right: #CCCC00 1px solid;  
    background:#FFFFFF;
}

#topimage {
    position: absolute;
    background-color: #CCCC00;
    top: 0px;
    left: 8px;
    width: 767px;
    height: 132px;
    border-right: #666633 1px solid;
    border-left: #666633 1px solid;
    border-bottom: #666633 1px solid;
    color: #000000;
}

#topmaintext {
    position: absolute;
    top: 18px;
    left: 30px;
    font-family: Arial, Helvetica, sans-serif;
    color: #FFFFFF; /*No background colour - text floats over main image*/
}

#topmaintext h1 {
    font-size: 22px;
}

#search {
    position: absolute;
    top: 75px;
    left: 30px;
}

/* browse area on left*/

#browsearea {
    position: relative;
    background-color: #FFFFCC;
    padding: 0px 8px 8px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #666633;
    float: left;
}

#browsearea a, #browsearea a:visited {
    text-decoration: none;
    color: #666633;
}

#browsearea a:hover {
    text-decoration: underline;
    color: #333333;
}

#browsearea h1 {
    font-size: 14px;
    margin-bottom: 5px;
}
#browsearea h3 {
    font-size: 12px;
    margin-bottom: 1px;
}


/* Main Home Area*/

#mainareaholder {
    position: relative;
    font-family: Arial, Helvetica, sans-serif;
    margin-bottom: 8px;
    float: right;
    width: 506px;    
    background:#FFFFFF;
}

#latestnewsholder {
    position: relative;
    top: 0px;
    margin-left: 0px;
    width: 495px;
    font-family: Arial, Helvetica, sans-serif;
/*  color: #666633; */
    font-size: 13px;
    padding-top: 8px;
}

#latestnewstop {
    position: relative;
    top: 0px;
    left: 0px;
    width: 494px;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    color: #FFFFFF;
    background-color: #666633;
    padding-top: 6px;
    padding-right: 0px;
    padding-left: 6px;
    padding-bottom: 6px;
    border-bottom: #FFFFFF 4px solid;
}

#latestnewsmain {
    position: relative;
    top: 0px;
    left: 0px;
    width: 490px; /*GJS - was 494*/
    /* height: 94px; */ /*GJS */
    font-family: Arial, Helvetica, sans-serif;
    color: #666633;
    background-color: #CCCC99;
    padding-top: 6px; /*GJS - was 0*/
    padding-right: 4px; /*GJS - was 0*/
    padding-left: 6px;
    padding-bottom: 6px; /*GJS - was 0*/
    border-bottom: #FFFFFF 4px solid; /*GJS - was #FFFFFF 8px solid */
}

#latestnewsmain img {
    float: right;
    clear: inherit;
    padding-left: 4px;
    padding-top: 0px;
    padding-bottom: 0px;
}

#latestnewspicture {
    position: relative;
    float: right;
    padding: 0px;
}

#leftlinks, #rightlinks {
    float: left;
    width: 150px;
    margin-top:17px;
}

#leftsublinks {
    float: left;
    width: 300px;
    margin-top: 17px;
}

#leftlinks a, #leftlinks a:visited, #rightlinks a, #rightlinks a:visited, #householdershm a, #householdershm a:visited, #leftsublinks a, #leftsublinks a:visited, #latestnewsmain a, #latestnewsmain a:visited, #energymain a, #energymain a:visited {
    color: #666633;
    text-decoration: underline;
}

#leftlinks a:hover, #rightlinks a:hover, #householdershm a:hover, #leftsublinks a:hover, #latestnewsmain a:hover, #energymain a:hover {
    color: #333333;
    text-decoration: underline;
}



#energyholder {
    position: relative;
    top: 0px;
    margin-left: 0px;
    width: 495px;
    font-family: Arial, Helvetica, sans-serif;
/*  color: #666633; */
    font-size: 13px;
    padding-top: 8px; /*GJS - was 0 */
}

#energytop {
    position: relative;
    top: 0px;
    left: 0px;
    width: 494px;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    color: #FFFFFF;
    background-color: #666633;
    padding-top: 6px;
    padding-right: 0px;
    padding-left: 6px;
    padding-bottom: 6px;
    border-bottom: #FFFFFF 4px solid;
}

#energymain {
    position: relative;
    top: 0px;
    left: 0px;
    width: 490px; /*GJS - was 494*/
    height: 94px;
    font-family: Arial, Helvetica, sans-serif;
    color: #666633;
    background-color: #CCCC99;
    padding-top: 6px; /*GJS - was 0*/
    padding-right: 4px; /*GJS - was 0*/
    padding-left: 6px;
    padding-bottom: 6px; /*GJS - was 0*/
    border-bottom: #FFFFFF 4px solid; /*GJS - was #FFFFFF 8px solid */
}

#energymain img {
    float: right;
    clear: inherit;
    padding-left: 4px;
    padding-top: 0px;
    padding-bottom: 0px;
}

#energypicture {
    position: relative;
    float: right;
    padding: 0px;
}



/* Main Home Area - Large tabs to main areas*/

#mainareatabs {
    position: relative;
    margin-left: 0px;
}

#tab1, #tab2, #tab3, #tab4, #tab5, #tab6, #tab7, #tab8 {
    position: relative;
    float: left;
    border-left: #FFFFFF 0px solid;
    border-bottom: #FFFFFF 4px solid;
    width: 246px;
    height: 50px;
}

#tab2, #tab4, #tab6, #tab8 {
    position: relative;
    float: left;
    border-left: #FFFFFF 4px solid;
}

#tab1 {
    background-color: #666634;
    color: #FFFFFF;
}

#tab2 {
    background-color: #CDCC00;
    color: #666634;
}

#tab3 {
    background-color: #83845C;
    color: #FFFFFF;
}

#tab4 {
    background-color: #DFDF65;
    color: #666634;
}

#tab5 {
    background-color: #A3A284;
    color: #FFFFFF;
}

#tab6 {
    background-color: #E3E47E;
    color: #666634;
}

#tab7 {
    background-color: #C1C0AB;
    color: #666634;
}

#tab8 {
    background-color: #EEEEB0;
    color: #666634;
}

#tablinks {
    position: relative;
    float: left;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    padding-left: 6px;
    padding-top: 1em;
    font-weight: bold;
}

#tab2 a, #tab2 a:visited, #tab4 a, #tab4 a:visited, #tab6 a, #tab6 a:visited, #tab7 a, #tab7 a:visited, #tab8 a, #tab8 a:visited  {
    color: #666633;
    text-decoration: none;
}
#tab1 a, #tab1 a:visited, #tab3 a, #tab3 a:visited, #tab5 a, #tab5 a:visited  {
    color: #FFFFFF;
    text-decoration: none;
}

#tab1 a:hover, #tab2 a:hover, #tab3 a:hover, #tab4 a:hover, #tab5 a:hover, #tab6 a:hover, #tab7 a:hover, #tab8 a:hover  {
    color: #333333;
    text-decoration: underline;
}

#tabimage {
    position: relative;
    float: right;
    height: 50px;
    width: 50px;
    margin: 0px;
    padding: 0px;
    border: none;
}

#tabimage img {
    border: none;
}

/* Content area for content pages */

#maincontentholder {
    position: relative;
    top: 0px;
    margin-left: 0px;
    width: 495px;
    font-family: Arial, Helvetica, sans-serif;
    color: #666633;
    font-size: 13px;
    padding-top: 8px;  
    background:#FFFFFF;
}

#maincontenttop {
    position: relative;
    top: 0px;
    left: 0px;
    width: 494px;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    color: #FFFFFF;
    background-color: #666633;
    padding-top: 6px;
    padding-right: 0px;
    padding-left: 6px;
    padding-bottom: 6px;
    border-bottom: #FFFFFF 4px solid;
}

#maincontenttop h1 {
    padding: 0px;
    font-size: 16px;
    margin: 0px;
    text-transform: uppercase;
}

#maincontent {
    position: relative;
    top: 0px;
    left: 0px;
    width: 488px;
    font-family: Arial, Helvetica, sans-serif;
    color: #666633;
    background-color: #FFFFCC;
    padding-top: 6px;
    padding-right: 6px;
    padding-left: 6px;
    padding-bottom: 6px;
    border-bottom: #FFFFFF 8px solid;
}

#maincontent h1 {
    font-size: 15px;
    font-weight: bold;
    margin-bottom: 0px;
    padding-bottom: 4px;
}

#maincontent img {
    float: right;
    clear: inherit;
    margin-left: 2px;
    margin-top: 4px;
    margin-bottom: 2px;
    border: #666633 solid 1px;
}

#maincontent a, #maincontent a:visited {
    color: #666633;
    text-decoration: underline;
    font-weight: bold;
}

#maincontent a:hover {
    color: #999900;
    text-decoration: underline;
    font-weight: bold;
}

#contentpictures {
    position: relative;
    float: right;
    margin-right: 0px;

}
#memberlogos {
    height: 50px;
}

#lhboxholder {
    position: relative;
    top: 0px;
    width: 244px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    padding-top: 8px;
    left: 0px;
    margin: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
}

#lhboxtop {
    position: relative;
    width: 232px;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    color: #FFFFFF;
    border-bottom: #FFFFCC 4px solid;
    padding: 6px;
    background-image: url(images/lhboxtop_bg.gif);
    background-repeat: no-repeat;
    background-position: 0px 0px;
}

#menutop {
    position: relative;
    width: 232px;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    color: #666634;
    border-bottom: #FFFFCC 4px solid;
    padding: 6px;
    background-image: url(images/menutop_bg.gif);
    background-repeat: no-repeat;
    background-position: 0px 0px;
}

#lhboxmain {
    position: relative;
    top: 0px;
    left: 0px;
    width: 232px;
    font-family: Arial, Helvetica, sans-serif;
    color: #666633;
    background-color: #CCCC99;
    padding: 6px;
}

#menumain {
    position: relative;
    top: 0px;
    left: 0px;
    width: 232px;
    font-family: Arial, Helvetica, sans-serif;
    color: #666633;
    background-color: #EEEEB0;
    padding: 6px;
    line-height: 1.5em;
}

#contentarea {
    margin: 0px;
    padding: 0px;
    border-right: #CCCC00 1px solid;
    border-bottom: #CCCC00 1px solid;
    position: absolute;
    left: 9px;
    top: 294px;
    width: 774px;      
    background-color: #FFFFFF;
}
#footer {
    position: relative;
    clear: both;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 10px;
    color: #666634;
    background-color: #FFFFFF; /* was #CCCC00*/
    width: 774px;
    display: block;
    letter-spacing: 0.1em;
/*  height: 100px; */
}
#footerleft {
    float: left;
    padding-top: 5px;
    padding-right: 5px;
    padding-bottom: 5px;
    padding-left: 10px;
}
#footerright {
    float: right;
    padding-top: 5px;
    padding-right: 10px;
    padding-bottom: 5px;
    padding-left: 5px;
}
#footer a, #footer a:visited {
    color: #333300;
    text-decoration: none;
}
#footer a:hover {
    color: #333333;
    text-decoration: underline;
}
.fi_orange {
    color: #FA9006;
    display: inline;
}
.fi_grey {
    color: #8A8A88;
    display: inline;
}