/*-----------------------
Site relaunched 18 Feb 2011

01. = RESET
02. = GENERIC SITEWIDE
03. = HEADER
04. = TOP NAVIGATION AREA
05. = LEFT AREA
06. = MAIN CONTENT AREA
    	06-01. = search
    	06-02. = homepage
    	06-03. = bottom nav menu
07. = FOOTER
08. = IE FIXES
-----------------------*/

/* 01. = RESET
----------------------------------------------- */
@import "reset.css";

/* 02. = GENERIC SITEWIDE
----------------------------------------------- */
body{background:#F1F2C6 url(images/cworks-bg-3.jpg) repeat-x;font-family:Arial, Helvetica, sans-serif;color:#666633;}
#sitewrapper{position:relative;width:960px;margin:0 auto;background:#fff;}
h1{font-size:1.8em;}
h2{font-size:1.4em;}
h3{font-size:1.2em;}
h4{font-size:1.0em;}
h5{font-size:0.8em;}
p{font-size:1.2em;padding-left:10px;}
h1,h2,h3,h4,h5,p,ul{padding-bottom:10px;}
table{margin-bottom:10px;float:none;}

/* 03. = HEADER
----------------------------------------------- */
#header{position:relative;width:960px;height:120px;background:#F1F2C6 url(images/cworks-bg-3.jpg) repeat-x;overflow:hidden;}
#cworkslogo{position:absolute;left:0;}
#contactdetails{position:absolute;right:0;}
#cworkslogo img, /*#contactdetails img{behavior: url(http://www.changeworks.org.uk/iepngfix.htc)}/* for IE6 non-handling of transparent png's*/


/* 04. = TOP NAVIGATION AREA
----------------------------------------------- */
#navcontainer{display:block;height:34px;list-style:none;}
#navcontainer li, #navcontainer li a, #navcontainer li a span{float:left;height:34px;}
#navcontainer li a{position:relative;text-align:center;}
#navcontainer li a span{position:absolute;top:0;left:0;background:url('images/cworks-nav-menu.jpg') no-repeat left top;}

#navcontainer li a#menu-householders, #navcontainer li a#menu-householders span{width:160px;}

#navcontainer li a#menu-businesses, #navcontainer li a#menu-businesses span{width:160px;}
#navcontainer li a#menu-localauthorities, #navcontainer li a#menu-localauthorities span{width:160px;}
#navcontainer li a#menu-community, #navcontainer li a#menu-community span{width:160px;}
#navcontainer li a#menu-schools, #navcontainer li a#menu-schools span{width:160px;}
#navcontainer li a#menu-health, #navcontainer li a#menu-health span{width:160px;}

#navcontainer li a#menu-householders span{background-position:left top;}
#navcontainer li a#menu-businesses span{background-position:-160px top;}
#navcontainer li a#menu-localauthorities span{background-position:-320px top;}
#navcontainer li a#menu-community span{background-position:-480px top;}
#navcontainer li a#menu-schools span{background-position:-640px top;}
#navcontainer li a#menu-health span{background-position:-800px top;}

#navcontainer li a#menu-householders:hover span{background-position:left bottom;}
#navcontainer li a#menu-businesses:hover span{background-position:-160px bottom;}
#navcontainer li a#menu-localauthorities:hover span{background-position:-320px bottom;}
#navcontainer li a#menu-community:hover span{background-position:-480px bottom;}
#navcontainer li a#menu-schools:hover span{background-position:-640px bottom;}
#navcontainer li a#menu-health:hover span{background-position:-800px bottom;}

#navcontainer li#active a#menu-householders span{background-position:left bottom;}
#navcontainer li#active a#menu-businesses span{background-position:-160px bottom;}
#navcontainer li#active a#menu-localauthorities span{background-position:-320px bottom;}
#navcontainer li#active a#menu-community span{background-position:-480px bottom;}
#navcontainer li#active a#menu-schools span{background-position:-640px bottom;}
#navcontainer li#active a#menu-health span{background-position:-800px bottom;}

/* 05. = LEFT AREA
----------------------------------------------- */
#leftmenu{float:left;width:240px;margin:5px;}
.roundedleftbox{margin:0px auto 5px auto;background:#666633;width:230px;height:3em;}
.roundedleftbox h2{color:#fff;}
#cworksleftbox{background:#CCCC00;margin-top:5px;}
#cworksleftbox.roundedleftbox h2{color:#666634;}
.leftboxcontent{margin:0px auto 5px auto; background:#CCCC99;width:230px;min-height:10em;}
.leftboxcontent p{padding:10px;}
.cworksboxcontent{background:#EEEEB0;}
h2{padding-left:10px;line-height:30px;}
ul#cworks-leftmenu, ul#quicklinks-leftmenu{padding:10px 10px 10px 20px;font-size:1.2em;list-style-type:square;}
li.blankli{list-style-type:none;}
li.boldli{list-style-type:none;font-weight:bold;margin-left:-10px;}
li.secondlevelli{margin-left:15px;}
#leftmenu li a{text-decoration: none;color: #666633;}
#leftmenu li a:hover{text-decoration:underline;}
ul#cworks-leftmenu li a{font-weight:bold;text-decoration:none;}

/* 06. = MAIN CONTENT AREA
----------------------------------------------- */
/* 06-01. = search */
#searcharea{width:100%;position:relative;background:#CCCC99;height:40px;}
#searcharea div { float:left; height:30px; vertical-align:middle; text-align:left;}
#search { width:230px; margin:5px 0 0 10px;}
#search form{ width:300px;}
#mailinglistarea { margin:5px 0 0 10px; }
#social a { display:inline-block; margin:3px 0 0 10px; }
#social a img { border:0px; }

/* 06-02. = homepage */
.homepagemissionstatement blockquote { background: transparent url(images/open_quote.png) no-repeat 0 2px;margin: 0.5em auto 0.5em auto;width:600px;}
.homepagemissionstatement blockquote > p:first-child { text-indent: 22px; font-style:italic; font-size: 16px; margin-bottom: 0.7em; color: #4e3114; }
.lastword { padding: 0 30px 0 0; background: transparent url(images/close_quote.png) no-repeat right top; color: #4e3114;}
.rotategallery a, .rotategallery a:hover{color:#fff;}
.thumbhomepage{float:left; width:146px;height:150px;border:2px solid #EEEEB0; margin:10px;}
.homepagecontentblock{float:left;width:510px;height:154px;background:#EEEEB0;margin:10px;}
.homepagecontentblockheading{border-bottom:5px solid #fff;background:#666633;height:30px;width:100%;color:#fff;}
.homepagecontentblock p{padding-top:2px;}
.slidecontainer{width:700px;}
.homepagemissionstatement{float:left;width:680px;margin:10px;background:#ffffcc url(images/mission-statement-transparent.png) repeat-x;-moz-border-radius: 8px;border-radius: 8px;}
#mainareaholder p{font-size:12px;line-height:18px;}
.homepagemissionstatement h1{font-size:20px;margin-left:10px;}
#maincontentcontainer h2.rotategallery a {color:#fff;text-decoration: none;}
#maincontentcontainer h2.rotategallery a:hover {text-decoration: underline;}


#maincontentcontainer{float:left;width:960px;margin:5px 0px;background:#FFFFCC url('images/cworks-maincontent-bg.gif') repeat-y;}

#maincontentcontainer a{color: #666633;text-decoration: underline;}

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

#mainareaholder{float:right;width:700px;margin:5px;}

#mainareaholder li{list-style:disc;margin-left:25px;}

#maincontentholder {
    position:relative;
    top:0px;
    margin-left:0px;
    font-family: Arial, Helvetica, sans-serif;
    color: #666633;
    font-size: 13px;
    padding-top: 5px; 
    overflow:auto; 
}

#maincontenttop {
    position: relative;
    top: 0px;
    left: 0px;
    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: 4px solid #FFFFFF;
}

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

#maincontent {
    position: relative;
    top: 0px;
    left: 0px;
    font-family: Arial, Helvetica, sans-serif;
    color: #666633;
    background-color: #FFFFCC;
    padding-top: 6px;
    padding-right: 6px;
    padding-left: 6px;
    padding-bottom: 6px;
    overflow:auto;
}

#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: 1px solid #666633;}

#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;}

#contentarea{float:left;width:960px;margin:5px 0px;background:#FFFFCC url('images/cworks-maincontent-bg.gif') repeat-y;}

/* 06-03. = bottom nav menu */
#bottomnavcontainer{border-top:5px solid white;}

#bottomnavcontainer ul{
padding:3px 0px;
margin: 0;
list-style-type: none;
background-color: #CCCC00;
color: #333300;
width: 100%;
font: 12px arial, helvetica, sans-serif;
text-align: center;
height:28px;
}

ul#bottomnavlist li { display: inline; }

ul#bottomnavlist li a {text-decoration: none;color: #333300;padding: .2em 1em;border-right: 1px solid #fff;line-height:28px;}

ul#bottomnavlist li a:hover {text-decoration:underline;}

ul#bottomnavlist li#lastli-bottommenu a{border-right:none;}


/* 07. = FOOTER
----------------------------------------------- */
#footer {
    position: relative;
    clear: both;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 10px;
    color: #666634;
    background-color: #FFFFFF;
    width:944px;
    display: block;
    letter-spacing: 0.1em;
}

#footerleft {float: left;padding-top: 5px;padding-right: 5px;padding-bottom: 5px;padding-left: 10px;width:350px;}

#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;}

#footer p{font-size:10px;}

/* 08. = IE FIXES
----------------------------------------------- */
/*unfortunately can't use conditional css due to inclusion of stylesheet in page content due to Contribute*/
.thumbhomepage{_margin:2px;}
.homepagemissionstatement blockquote {_background: none}
.homepagemissionstatement blockquote p{_text-indent: 0px;}
.lastword {_background:none;}
#mainareaholder{_margin:2px;}

/* rediculous that I have to fix this - stupid hack for IE somewhere is cocking up image size */
#cworkslogo a img { width:565px !important; height:120px !important; }