@import url(reset.css);

/*=LAYOUT==========================================================*/
.clear {clear:both;}
.hidden {display:none;}
.replaced {text-indent:-10000px;}
span.larger {font-size:larger;}
img.right {float:right;}
body {text-align:center; background:#fff url('../images/bodybg.jpg') repeat-x;} /*IE workaround to centre webpage*/
body#contact {background-position: 0 -185px;} /*to position background image correctly on xcontact page without sub-nav*/
#wrapper {position:relative; width:960px; margin:0 auto; text-align:left; background:transparent;}

/*=HEADER==========================================================*/
#header {height:347px; width:960px; background:#fff url('../images/headerbg.png') no-repeat;}
#header h1 {text-indent:-10000px;}
#header a.logo {display:block; width:216px; height:62px; position:absolute; top:36px; left:0;}
body#contact #header, body#privacy #header, body#terms #header {height:162px;} /*smaller header because no sub-nav on these pages*/

/*=MAIN NAVIGATION=================================================*/
#main_nav {position:absolute; top:126px; width:960px; height:30px; border-bottom:4px solid #f93; z-index:10;}
ul.dropdown {position:absolute; bottom:0; margin:0 0 -4px 0; padding:0; letter-spacing:-0.1em;}
ul.dropdown li {float:left;}
ul.dropdown li a {display:block; margin-right:68px; font-family:sans-serif; color:#666; font-weight:bold; font-size:1.35em; text-decoration:none; border-bottom:4px solid #f93;}
ul.dropdown li a:hover {border-bottom:4px solid #666;}

/* first sub-menu - visibility initially hidden and shown using javascript (ie. drop-down menu)
** so no javascript means no drop-down menu but main menu items still available
** and sub-menus are shown on each page */
ul.dropdown ul {position:absolute; visibility:hidden; width:auto; top:21px; padding-top:5px; background:#666; letter-spacing:normal; opacity:0.8;}
ul.dropdown li.hover, ul.dropdown li:hover {position:relative;}
ul.dropdown ul li {font-size:0.7em; background:#666; float:none; border-bottom:1px solid #999;}
ul.dropdown ul li a {display:block; padding:5px 10px; border:none; margin-right:0; color:#e5e5e5; opacity:1;}
ul.dropdown ul li a:hover {border:none; color:#f93;}

/* identifying current page */
body#informed li.informed a,
body#support li.support a,
body#involved li.involved a,
body#contact li.contact a {border-bottom:4px solid #666;}

/* preventing drop-down from appearing for current section. Sub-menu is shown anyway */
body#informed li.informed ul,
body#support li.support ul,
body#involved li.involved ul,
body#conntact li.contact ul {display:none;}

/*=BRANDING========================================================*/
#branding {position:absolute; top:161px; height:186px; width:960px; background:url('../images/brandingbg.jpg') no-repeat;}
#branding h3 {font-family:arial,helvetica,sans-serif; color:#ff9933; padding:20px; font-weight:bold; font-size:2.4em;}
#branding p {padding:0 20px; width:430px; font-family:georgia,serif; color:#222;}

/*=SUB NAVIGATION==================================================*/
#sub_nav {position:absolute; top:161px; height:186px; width:960px;  background:url('../images/subnavbg-involved.jpg') no-repeat;}
#sub_nav ul {width:450px; padding:10px 10px 20px 15px;}
#sub_nav ul li {font-family:arial,helvetica,sans-serif; border-bottom:1px dotted #ccc; padding:2px 0 2px 5px;}
#sub_nav ul li.current {background:#eee; color:#ff9933;}
#sub_nav ul li a {text-decoration:none; display:block; width:auto; height:auto;}
#sub_nav ul li a:hover {background:#eee;}
/*setting sub-nav background image according to page*/
body#informed .sub_nav_about {background:url('../images/subnavbg-about.jpg');}
body#informed .sub_nav_news {background:url('../images/subnavbg-news.jpg');}
body#informed .sub_nav_professionals {background:url('../images/subnavbg-professionals.jpg');}
body#support .sub_nav_talkdontwalk {background:url('../images/subnavbg-tdw.jpg');}
body#support .sub_nav_halton {background:url('../images/subnavbg-halton.jpg');}
body#support .sub_nav_warrington {background:url('../images/subnavbg-warrington.jpg');}
body#support .sub_nav_sthelens {background:url('../images/subnavbg-sthelens.jpg');}
body#support .sub_nav_whatsup {background:url('../images/subnavbg-whatsup.jpg');}
body#involved .sub_nav_events {background:url('../images/subnavbg-events.jpg');}
body#involved .sub_nav_donate {background:url('../images/subnavbg-donate.jpg');}
body#involved .sub_nav_work {background:url('../images/subnavbg-work.jpg');}
body#involved .sub_nav_patrons {background:url('../images/subnavbg-patrons.jpg');}
body#involved .sub_nav_fundraising {background:url('../images/subnavbg-fundraising.jpg');}
body#involved .sub_nav_corporate {background:url('../images/subnavbg-corporate.jpg');}

/*indicating current page in sub nav*/
div.about ul li.about a, div.who ul li.who a, div.what ul li.what a, div.news ul li.news a, div.professionals ul li.professionals a,
div.halton ul li.halton a, div.warrington ul li.warrington a, div.talkdontwalk ul li.talkdontwalk a, div.sthelens ul li.sthelens a, div.whatsup ul li.whatsup a,
div.events ul li.events a, div.donate ul li.donate a, div.fundraising ul li.fundraising a, div.work ul li.work a,
div.patrons ul li.patrons a, div.corporate ul li.corporate a {background:#eee; color:#ff9933;}

/*=FOOTER==========================================================*/
#footer {height:105px; width:960px; margin-top:15px; background:transparent url('../images/footerbg.jpg') no-repeat; clear:both;}
p.footer_text {padding-top:70px; font-size:1em;}

/*=CONTENT=========================================================*/
#content {width:938px; background:#fcfcfc; border:1px solid #e5e5e5; margin-top:15px; padding:10px;}

/* Primary content */
#primary {float:left; width:600px; padding:0 10px;}
#primary h2 {font-family:arial, helvetica,sans-serif; font-size:2.5em; font-weight:bold; color:#666; border-bottom:2px double #e5e5e5; padding:12px 0 15px 0;}
#primary h3 {font-family:arial, helvetica,sans-serif; font-size:2em; font-weight:bold; color:#666;}

#index #tdw {padding-top:8px; padding-bottom:8px;}
#index #tdw img {float:left; margin-right:10px;}

#primary .story {clear:both; padding:10px 0;}
#primary .story div {padding:5px 0; position:relative;}
#primary .story h4 {color:#444;}
#primary .story p {font-size:1.1em; line-height:1.5em;}
/*#primary .story a {position:absolute; bottom:0; right:10px;}*/
.newsimage {border:2px solid #ffcc33; float:left; margin-right:10px;}

#primary #about h3 {color:#ff9933; font-variant:small-caps; font-weight:bold;}
#primary #about div.left {float:left; width:290px;}
#primary #about div.right {float:right; width:290px;}

/* Events primary content */
#primary .event {clear:both; margin-top:10px; border-bottom:2px double #e5e5e5;}
#primary .event h3 {padding-left:240px; color:#ff9933; font-family: "Franklin Gothic Bold", Charcoal, "Helvetica Inserat", "Bitstream Vera Sans Bold", "Arial Black", sans-serif;}
#primary .event .meta {float:left; width:220px; overflow:hidden;}
#primary .event .descrip {float:right; width:360px;}
#primary .event .meta table {padding:5px; margin-top:10px; background:#f9f6ed; border:1px solid #e5e5e5; font-family:arial,helvetica,sans-serif;}
#primary .event .meta table td {padding:5px 2px; font-weight:bold;}
#primary .event .meta table td.head {text-transform:uppercase;}

/* News primary content */
#primary .newsitem {clear:both; margin-top:10px; border-bottom:2px double #e5e5e5;}
#primary .newsitem h3 {color:#ff9933; font-family: "Franklin Gothic Bold", Charcoal, "Helvetica Inserat", "Bitstream Vera Sans Bold", "Arial Black", sans-serif;}
#primary .newsitem img {float:left; margin-right:10px; border:3px solid #ffcc33;}
#primary .newsitem img.right {float:right;}
#primary .newsitem p {line-height:1.5em;}

/* Patrons primary content */
#primary .patron {margin-top:10px;}
#primary .patron img {float:left; margin-right:10px; border:3px solid #ffcc33;}
#primary .patron blockquote {padding:5px 20px 5px 35px; background:#f9f6ed url('../images/quote.png') no-repeat 0 0; border:5px solid #e5e5e5;}
#primary .patron blockquote p {font-style:italic; font-size:larger; font-weight:bold;}

/* Sponsors listing section */
#primary .sponsor {margin-top:10px;}
#primary .sponsor img {float:left; margin-right:10px; border:3px solid #ffcc33;}
#primary .sponsor blockquote {padding:5px 20px 5px 35px; background:#f9f6ed url('../images/quote.png') no-repeat 0 0; border:5px solid #e5e5e5;}
#primary .sponsor blockquote p {font-style:italic; font-size:larger; font-weight:bold;}

/* Support service primary content */
body#support #primary #halton_services ul li {float:left; width:104px; height:150px; margin-right:10px; text-align:center; font-weight:bold;}
body#support #primary #halton_services {padding:25px 0;}
body#support #primary #halton_services h3 {padding-bottom:10px;}
body#support #primary #halton_services ul li img {border:2px solid #f93;}
body#support #primary #case_study {border:1px solid #ff9933; padding:15px;}
body#support #primary #case_study h3 {color:#ff9933; font-family: "Franklin Gothic Bold", Charcoal, "Helvetica Inserat", "Bitstream Vera Sans Bold", "Arial Black", sans-serif;}
body#support #primary img {float:left; margin-right:5px;}
body#support #primary #case_study p.left {float:left; width:270px;}
body#support #primary #case_study p.right {float:right; width:270px;}
body#support #primary #halton_contact, body#support #primary #sthelens_contact {position:relative; margin-top:20px;}
body#support #primary #partners {position:absolute; bottom:0; right:0; width:150px; height:150px;}

/* body#support ul.warrington_services li {display:block; height:79px; padding-left:80px; background:transparent url('../images/ist1_9329571-family-playing-ballgames.jpg') no-repeat;} */

#primary p.intro {font-size:1.8em; margin-top:10px; line-height:1.4em; font-family:georgia,times,serif; color:#f93; border-bottom:2px double #e5e5e5; padding-top:10px; padding-bottom:25px;}
#primary ul.bullets {list-style-type:disc; list-style-position:outside; padding-left:15px;}

p.tdw_help_link {margin-top:25px; margin-bottom:20px;}
p.tdw_help_link a {background:#666; border:1px solid #fc3; padding:5px; color:#fc3; font-size:1.3em; text-decoration:none; -moz-border-radius:8px; -webkit-border-radius:8px;}
p.tdw_help_link a:hover {color:#fff;}
div.tdw-help {background:transparent url('../images/tdw-help.jpg') no-repeat top right;}

div.tdw p.narrow, div.tdw-help p.narrow, div.tdw-help h2.narrow {width:295px;}
div.tdw-help h3 {margin-top:20px; margin-bottom:20px;}
div.tdw-help div.left {float:left; width:290px;}
div.tdw-help div.right {float:right; width:290px;}
div.tdw-help p.caps {text-transform:uppercase;}

/* fundraising primary content */
#content .fundraising blockquote.right {float:right; width:243px; margin-left:5px;}
#content .fundraising blockquote {padding:15px 20px 5px 37px; background:#f9f6ed/*url('../images/quote.png') no-repeat 0 0*/; border:2px solid #e5e5e5; margin-bottom:10px;}
#content .fundraising blockquote p {font-size:1.3em; font-style:italic; line-height:1.5em; font-family:arial;}
#content .fundraising blockquote p.name {font-size:1.5em; text-align:right; color:#f93;}
#content .fundraising ul.donations {font-family:arial,sans-serif; padding:15px; background:#f93; border:solid 2px #555; color:#444;}
ul.donations h3 {padding-bottom:15px; font-variant:small-caps; font-weight:bold;}
ul.donations li {font-size:1.6em;}

#content .fundraising table.donations {font-family:arial,sans-serif; padding:15px; background:#f93 url('../images/donationsbg.jpg') repeat-x bottom left; border:solid 2px #666; color:#444;}
table.donations h3 {padding-bottom:15px; font-variant:small-caps; font-weight:bold; font-size:1.5em;}
table.donations td {font-size:1.4em; line-height:1.3em; padding:5px 3px;}
table.donations td.strong {font-weight:bold; font-size:1.8em; padding-right:6px; vertical-align:middle;}

/* Work with us primary content */
#primary .opportunity {padding:15px;}
.opportunity h5 {color:#f93; font-weight:bold; font-family:arial,sans-serif; margin-left:-15px; border-bottom:2px solid #f93;}
.opportunity a.top {position:relative; left:500px;}

/* contact us primary content */
body#contact #primary .details p.left {float:left; width:290px;}
body#contact #primary .details p.right {float:right; width:290px;}

/* terms primary content */
body#terms #primary ul li ul {list-style-type:circle; list-style-position:outside; padding-left:15px; padding-bottom:0;}
body#terms #primary ul li ul li {font-size:1em;}

/* whatsup page downloadable section */
table.whatsup {padding:20px 0;}
table.whatsup td {padding-right:10px; padding-bottom:15px;}
table.whatsup th {padding:10px 20px 0 10px;}
.whatsup td.top {vertical-align:top;}
.whatsup td span {text-transform:uppercase; border-bottom:2px solid #444; font-weight:bold; color:#efad1f;}
.whatsup td a.download {padding:0 5px; background:#efad1f; border:1px solid #444; text-decoration:none; color:#222;}
.whatsup td a.download:hover {color:#fff;}

/*=SIDEBAR========================================================================*/
#sidebar {float:right; width:300px;}
.sidebarimage {border:3px solid #ffcc33;}
#sidebar h3 {font-family:arial,helvetica,sans-serif; font-weight:bold; color:#666;}

#donate, #next_event, #talkdontwalk {position:relative; padding:10px; margin-bottom:20px; background:#f9f6ed; border:1px solid #e5e5e5;}
/*make the donate panel stand out more by increasing contrast with rest of pages*/
#donate {position:relative; padding:10px; margin-bottom:20px; background:#666; color:#fff;}
#donate p a {color:#fff;}
#donate h3 {color:#e5e5e5;}
#donate .sidebarimage {border-color:#373737;}
#donate div.caption {background:#fc3;}
/*end of changes to the donate panel*/
#donate p, #next_event p, #talkdontwalk p, .real_life_story p {line-height:1.2em;}
#donate div.caption, #next_event div.caption, #talkdontwalk div.caption {padding:5px 5px 2px 5px;}
#donate p.donatetext a {position:absolute; font-size:1.8em; font-weight:bold; top:187px; right:20px; display:block; padding:5px 7px; color:#ff9933; background:#eaeaea; text-decoration:none; text-transform:uppercase; border-width:1px; border-style:solid; border-color:#fff #bbb #bbb #fff;} /*link positioned bottom right of para box*/
#donate p.donatetext a:hover {color:#FF4B33;}
#donate p.donatetext a:active {border-color:#bbb #ddd #ddd #bbb; top:188px; right:19px;}

#next_event a {position:absolute; bottom:5px; right:10px;}

#news_archive h3 {text-transform:uppercase; border-bottom:1px solid #e5e5e5;}
#news_archive h4 {padding-left:10px; background:#f9f6ed;}
ul.dates {padding-left:20px; padding-top:5px; padding-bottom:20px;}
ul.recent {padding-left:40px; padding-top:5px; padding-bottom:20px; text-indent:-20px;}
ul.dates li a, ul.recent li a {font-variant:small-caps;}

#sidebar .real_life_story {position:relative; padding:10px; margin-bottom:20px; background:#666; color:#fff; clear:both;}
#sidebar .real_life_story h3 {color:#f4e005;}
#sidebar .real_life_story p {font-family:arial,helvetica,sans-serif;}
#sidebar .real_life_story img {float:left; margin-right:8px; margin-bottom:3px; border:2px solid #373737;}
#sidebar .real_life_story ul.bullets {list-style-type:disc; list-style-position:outside; padding-left:15px;}

ul#story_menu {width:300px;}
ul#story_menu li {float:left;}
ul#story_menu li a {display:block; width:140px; height:30px; padding-top:3px; margin-right:20px; background:#888; color:#e5e5e5; text-align:center; text-decoration:none;}
ul#story_menu li a:hover {background:#777;}
ul#story_menu li a.active {background:#666; color:#fc3;}
ul#story_menu li a.end {margin-right:0;}