/* CSS Document for The Children's Society website */
@import url(forms.css);
@import url(tabs.css);
body {font: 76%/1.4 Arial, Helvetica, sans-serif; background: url(../assets/bg.gif) repeat-x #CAC8CB; padding:0 0 20px 0; color:#191919; text-align:center;}
body.gallery {background:none; padding:0; color:#191919; text-align:left;}

/* Kill all browser defaults */
* {margin:0; padding:0;}
/* end */

/* links */
a, a:visited {color:#511A77; text-decoration:none;}
a:hover {color:#511A77; text-decoration:underline;}
a {outline:none;}
a.pdf {background:url(../assets/pdf-icon.png) no-repeat left bottom; padding:10px 0 0 35px; float:left;}
/* end links */

/* page containers */
div#wrapper {margin:0 auto; text-align:left;  background-color:#826493; padding:20px; padding-bottom:5px; width:950px; w\idth:910px;}
div#wrapper {border-left: 8px solid #dad8db; border-right: 8px solid #dad8db; border-bottom: 16px solid #dad8db;}  
p.skip {display:none;}
div#container {width:910px; background:url(../assets/container-bg.png) repeat-y left #fff;}
* html div#container {float:left;}
.home div#container {background:url(../assets/home-bg.png) repeat-y right #EDE9EF;}
div#contentholder {min-height:500px; height:auto !important; height:500px;}
.clearfix:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;}

div#left {float:left; width:190px;}
div#contentblock {float:left; padding:18px 18px 18px 18px; width:720px; w\idth:684px;}
div#inlinebanner {float:left; width:684px; margin:0 0 18px 0;}
div#content {float:left; width:454px; overflow:visible;}
div#content.wide {float:left; width:684px;}
.gallery div#content {float:left; width:684px; text-align:center;}
div#right {float:left; padding:0 0 0 18px; width:230px; w\idth:212px;}
/* end general layout rules */

/* page header */
div#header {float:left; width:910px; background:#826493;}
div#header img {display:none;}
div#header h1 {float:left; margin:0;}
div#header h2 {float:left; margin:0 0 0 520px; display:inline; background-color:#511A77; padding: 14px 18px 24px 18px; width:248px; w\idth:212px;}
div#header h1 a {background:url(../assets/tcs-logo.png) no-repeat; text-indent:-9999em; width:142px; height:70px; display:block;}
div#header h2 a {background-image:url(../assets/donate-now.png); background-repeat:no-repeat; background-position: 0 0; text-indent:-9999em; width:210px; height:55px; display:block;}
div#header h2 a:hover {background-position: 0 -55px;}
/* page header */

/* primary navigaton */
div#navbar {float:left; background-color:#511A77;}
div#nav {float:left; width:662px; background: #3F4348; font-size:1.1em; font-weight:bold;}
div#nav ul {float:left; list-style-type:none;}
div#nav ul li {float:left; white-space:nowrap; background: #3F4348;}
div#nav ul li a {padding:12px 0 8px 0; border-bottom:1px solid #3F4348; border-right:1px solid #957AA4; text-align:center; text-decoration:none; display:block; color:#fff; min-height:22px; height:auto !important; height:42px; he\ight:22px;}
div#nav ul li a:hover {text-decoration:none; background: #DED7E4; color:#191919;}

div#nav ul li#home {width:68px;}
div#nav ul li#about {width:110px;}
div#nav ul li#what_you_can_do {width:144px;}
div#nav ul li#news {width:148px;}
div#nav ul li#contact {width:98px;}
div#nav ul li#children {width:94px;}
div#nav ul li#children a {border-right:1px solid #3F4348;}

.home div#nav ul li#home a,
.about div#nav ul li#about a,
.how div#nav ul li#what_you_can_do a,
.news div#nav ul li#news a,
.contact div#nav ul li#contact a,
.children div#nav ul li#children a {border-bottom:1px solid #fff; background: #fff; color:#511A77;}
/* end primary navigaton */

/* secondary navigation */
div#subnav {width:190px; padding:10px 0 18px 0; font-weight:bold;}
div#subnav a {}
div#subnav ul {list-style-type:none;}
div#subnav ul li {line-height:1; padding:0;}
div#subnav ul li a {padding:8px 18px 8px 18px; color:#414C53; text-decoration:none; display:block; background-repeat:no-repeat; background-position:6px 7px; width:190px; w\idth:154px;}

div#subnav ul ul {font-size:.92em; background:#ECEBEF; padding:0 0 0 0;}
div#subnav ul ul {border-top: 1px solid #CBBCD5; border-bottom: 1px solid #CBBCD5;}
div#subnav ul ul ul {border-top: 1px solid #CBBCD5; border-bottom: 1px solid #CBBCD5; padding:4px 0 4px 0;}
div#subnav ul ul li a {padding:6px 28px 6px 28px; background-repeat:no-repeat; width:190px; w\idth:134px;} 
div#subnav ul ul ul {font-size:1em; background-color:#fff; margin:0px 0 -1px 0;}
div#subnav ul ul ul li a {padding:4px 28px 4px 34px; background-repeat:no-repeat; width:190px; w\idth:128px;}

div#subnav ul li a:hover {background-image:url(../assets/triangle-grey.png);}
div#subnav ul li.active a {background-image:url(../assets/triangle-purple.png); background-position:0px 7px;}
div#subnav ul li.active ul li a {background-image:none;}
div#subnav ul li.active ul li a:hover {background-image:url(../assets/triangle-grey.png); background-position:18px 6px;} 
div#subnav ul li.active ul li.active ul li a:hover {background-image:url(../assets/triangle-grey.png); background-position:24px 4px;}

div#subnav ul li.active a {color:#511A77; font-weight:bold;}
div#subnav ul li.active ul li a {color:#414C53; font-weight:normal;}
div#subnav ul li.active ul li.active a {color:#511A77; font-weight:bold;}
div#subnav ul li.active ul li.active ul li a {color:#414C53; font-weight:normal;}
div#subnav ul li.active ul li.active ul li.active a {color:#511A77; font-weight:bold;}
/* end secondary navigation */

/* LHS quick links*/
div#quicklinks {float:left; padding:18px 18px 18px 18px; display:inline; width:190px; w\idth:154px;}
div#quicklinks {border-top:1px solid #CBBCD5;}
div#quicklinks h3 {font-size:1em; padding:4px 8px; background:#CBBCD5; margin:0;}
div#quicklinks ul {list-style-type:none; font-size:.92em; border:1px solid #CBBCD5; background:#ECEBEF; margin:0;}
div#quicklinks ul li {background:url(../assets/dash-light.png) repeat-x left top;}
div#quicklinks ul li a {padding:8px 4px 2px 40px; color:#414C53; text-decoration:none; display:block; background-repeat:no-repeat; background-position:5% 50%; width:150px; w\idth:108px; min-height:26px; height:auto !important; height:26px;}
div#quicklinks ul li a:hover {color:#000;}

div#quicklinks ul li#register {background:none;}
div#quicklinks ul li#register a {background-image:url(../assets/ql-sign.png); padding-bottom:6px;}
div#quicklinks ul li#find a {background-image:url(../assets/ql-find.png);}
div#quicklinks ul li#join a {background-image:url(../assets/ql-join.png);}
/* end LHS quick links*/

/* footer quick links*/
div#footerlinks {float:left; margin:20px 0 0 0; width:454px; border-top:1px solid #CBBCD5; display:inline;}
div#content div#footerlinks ul {float:left; list-style-type:none; font-size:.92em; margin:10px 0 0 0; padding:0;}
div#content div#footerlinks ul li {float:left; list-style-type:none;}
div#footerlinks ul li a {padding:2px 20px 0px 25px; color:#414C53; text-decoration:none; display:block; background-repeat:no-repeat; background-position:left bottom; }
div#footerlinks ul li a:hover {color:#000;}

div#footerlinks ul li#send a {background-image:url(../assets/article-send.png);}
div#footerlinks ul li#print a {background-image:url(../assets/article-print.png);}
div#footerlinks ul li#feedback a {background-image:url(../assets/article-feedback.png);}
/* end footer quick links*/

/* homepage */
div#homeleft {float:left; background:#E8E3EB; width:662px;}
div#toptabs {float:left; background:#fff; padding:20px 16px 20px 16px; width:662px; w\idth:630px;}
div#bottomtabs {float:left; padding:20px 16px 0 16px; width:662px; w\idth:630px;}
div#homeright {float:left; padding:10px 18px 0 18px; width:248px; w\idth:212px; }
/* end homepage */

/* inline banners */
div#inlinebanner {background:url("../assets/grey-cobbles.jpg") no-repeat left top #2E2E2E; min-height: 167px; height:auto !important; height:167px;}
div#inlinebanner img {float:right; margin:0 0 0 10px; border-left: 1px solid #fff;}
div#inlinebanner object {float:right; margin:0 0 0 10px; border-left: 1px solid #fff;}
div#inlinebanner #flashalt {float:right; margin:0 10px 0 10px;}
div#inlinebanner h2 {margin:12px 0 0 16px; color:#fff;}
div#inlinebanner h3 {margin:20px 0 0 16px; font-size:1.1em; font-weight:bold; color:#fff; line-height:1.6;}
div#inlinebanner.fullwidth {background:none;}
div#inlinebanner.fullwidth img {float:left; margin:0 0 0 0; border-left:none;}
/* end inline banners */

/* central column panels */
div.mainpanel {float:left; background:#DED7E4; width:454px; margin:0 0 12px 0;}
div.mainpanel img {float:left; margin:0 10px 0 0;}
div.mainpanel h3 {margin:8px 4px 10px 0;}
div.mainpanel p {font-size:1.1em; margin:4px 4px 0 0;}
/* end central column panels */

/* RH column */
div.placeholder {float:left; background:#fff; margin:0 0 10px 0; width:212px;}

div.panelimg {float:left; background:#fff; margin:0 0 10px 0; width:212px;background-color:#ECEBEF; }
div.panelimg p {margin:0; padding: 4px;  font-size:1em; text-align:center;}

div.panel {float:left; background:#fff; margin:0 0 10px 0; width:212px;}
div.panel h3 {font-size:1.2em; margin:0 0 0 0; font-weight:bold; background:#714291;}
div#homeright div.panel h3 {background:#511A77;}
div.panel h3 a {display:block; line-height:1.2; margin:0 0 0 0; padding:6px 8px 0px 8px; color:#fff; width:212px; w\idth:196px;}
div.panel h3 a:visited {color:#fff;}
div.panel h3 img {border:none; margin:6px -8px -6px -8px; }
div.panel h3 a:hover {text-decoration:none;color:#fff;}

div.panel h4 {font-size:1.2em; line-height:1.2; margin:0 0 0 0; background:#B8A1C7;}
div#homeright div.panel h4 {background:#fff;}
div.panel h4 span {font-size:.84em; font-weight:normal; display:block; line-height:1.2; margin:6px 0 0 0;}
div.panel h4 a {display:block; padding:8px 6px 0 6px; min-height: 69px; height:auto !important; height:69px;}
div.panel h4 a img {border:none; float:left; margin:-8px 10px 0 -6px;}
div.panel h4 a:hover {background-color:#DED7E4; text-decoration:none;}
div#homeright div.panel h4 a:hover {background-color:#A890B7;}

div.panel div.text {float:left; margin:0 0 10px 0; color:#fff; padding:12px 12px 6px 12px; width:212px; w\idth:188px; background:#3F4348;}
div.panel div.text a {text-decoration:underline; color:#fff;}
div.panel div.text a:hover {text-decoration:none; color:#fff;}
div.panel blockquote {float:left; margin:0 0 0px 0; color:#fff; padding:6px 0 0 14px; background:url(../assets/left-quote.png) no-repeat 0px 0px;}
div.panel blockquote p {background:url(../assets/right-quote.png) no-repeat right bottom; margin:0; padding:0 12px 6px 4px; width:auto;}
div.panel cite {float:right; margin:0; color:#fff; padding:6px 0px 6px 0; background: #3F4348; text-align:right;}
/* end RH column */

/* RH side link panel */
div.rhlinks {float:left; width:212px; margin:0 0 10px 0; background:#DED7E4; word-wrap: break-word;}
div.rhlinks h3 {padding:4px 8px; margin:0; background:#714291; color:#fff; width:212px; w\idth:196px;}
div.rhlinks h4 {padding:4px 8px; font-size:1.1em; margin:0 0 0 0; background:#714291; color:#fff; width:212px; w\idth:196px;}
div.rhlinks h5 {padding:6px 12px 0 12px; margin:0 0 -4px 0; font-size:.92em; background:url(../assets/dash-dark.png) repeat-x left top;}
div.rhlinks p {padding:0 12px; margin:4px 0 6px 0; font-size:.92em; line-height:1.2; }

div.rhlinks ul {font-size:.92em; margin:6px 0 6px 24px;}
div.rhlinks ul li {padding:0; text-decoration:none; line-height:1.2; margin:8px 0 8px 0;}
div.rhlinks ul li a {}
div.rhlinks ul li a:hover {}
div.rhlinks img.leftborder {float:left; margin:4px 10px 4px 0;}
/* end RH side link panel */

/* content page listitems */
div.listitem {float:left; padding:6px 0 6px 0; border-bottom: 1px solid #D5C9DD; border-top: 1px solid #D5C9DD; margin:-1px 0 0 0; width:454px;}
div.tabBody div.listitem {float:left; padding:6px 0 6px 0; border-bottom: 1px solid #D5C9DD; border-top:none; margin:0 0 0 0; width:684px;}
div.listitem img {float: left; margin: 0 12px 0 0;}
div.listitem h5 {margin:0 0 6px 0; line-height:1.2;}
div.listitem h5 strong {color: #511A77;}
div.listitem p {margin:0 0 2px 0;}
div.listitem p strong {}
/* end content page listitems */

/* find my nearest page */
div#findbyregion {float:left; width:454px; margin:0; background:#E3D9EA;}
div#findbyregion h3 {font-size:1.2em; margin:0 0 0 0; font-weight:bold; background:#714291; padding:4px 8px 4px 8px; color:#fff; width:454px; w\idth:438px;}
div#findbyregion img {float:left; margin:40px 10px 0 10px;}
div#findbyregion ul {float:left; padding:10px 0;}
div#content div#findbyregion ul li {list-style-type:none;}
/* end find my nearest page */

/* breadcrumb trail */
div#crumbs {float:left; font-size:0.92em; width:910px; background: #fff; border-bottom:1px solid #D5C9DD;}
div#crumbs ul {float:left; list-style-type:none; padding:6px 9px;}
div#crumbs ul li {float:left; padding:0 0 0 4px; white-space:nowrap;}
div#crumbs ul li a {padding:0; text-decoration:none;}
div#crumbs ul li a:hover {text-decoration:underline;}
/* end breadcrumb trail */

/* footer */
div#footer {float:left; font-size:.92em; color:#fff; background: #3F4348; padding:8px 16px 8px 12px; width:910px; w\idth:882px; }
div#footer ul {float:left; clear:left; list-style-type:none; white-space:nowrap; margin: 0 0 0 0;}
div#footer ul li {float:left; padding:0 0 0 4px;}
div#footer ul li a {color:#fff;}
div#footer p {float:right; text-align:right; margin:0;}
/* end footer */

/* general typography */
h2 {font-size:1.5em; margin:0 0 1em 0;}
h3 {font-size:1.3em; margin:1em 0 .4em 0;}
h4 {font-size:1.2em; margin:1em 0 0 0;}
h5 {font-size:1.1em; margin:1em 0 .5em 0;}
h2 strong,
h5 strong {color:#B8A1C7;}
h5 span {font-size:.92em; margin:0 0 0 20px;}
h5.subtitle {font-size:1.1em; margin:-1.4em 0 1.2em 0;}
h5.showall {text-align:right;}
h6 {font-size:1.1em; margin:0 0 1em 0;}
p {margin:0 0 1em 0;}
acronym {border-bottom: 1px dashed #ccc; cursor: help;}
hr {height:1px; color:#CBBCD5; border: 0; background-color: #CBBCD5; margin: 10px 0;}
div#content div.line {border-bottom:1px solid #CBBCD5; margin:10px 0 10px 0; height:2px; clear:both;}
div#content div.line hr {display:none;}
/* end general typography */

/* image floats */
img.left, img.leftborder {float:left; margin:4px 12px 4px 0;}
img.left, img.right {border:none;}
img.right, img.rightborder {float:right; margin:0 0 12px 12px;}
img.leftborder, img.rightborder {border: 1px solid #CBBCD5;}
img.border {border: 1px solid #CBBCD5; margin:4px 0 12px 0;}
/* end image floats */

/* thumbnail image gallery */
div#content ul.thumbnails {float:left; margin: 0 0 0 0; padding:0;}
div#content ul.thumbnails li {float:left; list-style-type: none; line-height:normal; margin:0; padding:0;}
div#content ul.thumbnails li a img {border: 1px solid #fff; float:none; margin:0 11px 11px 0; padding:0;}
div#content ul.thumbnails li a:hover img {border-color: #511A77;}
.gallery h3 {margin:0 0 6px 0;}
div#content p.gallerylinks {}
div#content p.gallerylinks a {padding:2px 6px; font-weight:bold;}
div#content p.gallerylinks a:hover,
div#content p.gallerylinks a.active {background: #511A77; color:#fff; text-decoration:none;}
/* end thumbnail image gallery */

/* image captions */
.captionleft {float:left; margin:4px 12px 4px 0; width:188px; background-color:#ECEBEF; }
.captionleft p, .captionright p {margin:0; padding: 6px; font-size:1em; text-align:center;}
.captionright {float:right; clear:right; margin:4px 0 4px 12px; width:188px; background-color:#ECEBEF;}
.captionleftborder {float:left; margin:0 18px 8px 0; width:188px; border: 1px solid #CBBCD5; background-color:#ECEBEF; }
.captionleftborder p, .captionrightborder p {margin:0; padding: 4px;  font-size:1em; text-align:center;}
.captionrightborder {float:right; margin:4px 0 4px 12px; width:188px; border: 1px solid #CBBCD5; background-color:#ECEBEF;}
/* end image captions */

/* lists */
div#content ul {margin:0 0 10px 30px;}
div#content ul li {padding: 2px 0; list-style-type:disc;list-style-position: inside;}
div#content ul ul {margin:.3em 0 .3em 3em;}
div#content ul ul li {list-style-type:disc;}
div#content ul ul ul li {list-style-type:disc;}
div#content ol {padding:0 0 0 0; margin:.5em 0 1em 3em;}

div#content dl {margin: 0 0 1em 0;}
div#content dt {margin: 1em 0 0 0; font-weight:bold;}
div#content dd {margin: 0 0 0 1em;}
/* end lists */

/* address */
div#content address {font-style:normal; font-weight:normal; margin: 0 0 .7em 0;}
div#content address p {margin:0;}
/* end address */

/* tables */
table, th, tr, td {font-size:1em;}
table {margin: .5em 0 1em 0; padding:0; border-right:1px solid #ECEBEF; border-top:1px solid #ECEBEF;}
th {padding: .2em .4em; background:#ECEBEF; text-align:left; color:#000;}
td {padding: .4em; border-bottom:1px solid #ECEBEF; border-left:1px solid #ECEBEF;}
table caption {text-align:left; font-size:1em; font-weight:bold;}
/* end tables */

/*style options*/
div#styles {text-align:right; color:#fff; display:block; padding-top: 5px; font-size:0.92em}
div#styles a {color:#fff;}
/*end style options*/

/* amends for low-graphics version */
img {display:none;}
div.mainpanel {background:#fff;}
div.mainpanel h3 {margin-bottom:0;}
/* amends for low-graphics version */