/* 	
	CSS document for Plan International Tsunami: 5 years after website
 	Author: 9web.co.uk - v0.2 - 25/10/09
*/
@import url(content.css);
body {font: 76%/1.5 Arial, Helvetica, sans-serif; background: #C6D0D3; color:#484848; text-align:center;}
html {overflow-y:scroll;}

/* some global rules */
* {margin:0; padding:0;}
img {border:none;}
.clearfix:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;}
/* end */

/* links */
a, a:visited {color:#007CC3; text-decoration:none;}
a:hover {color:#007CC3; text-decoration:underline;}
a {outline:none;}
/* end links */

/* page containers */
div#wrapper {margin:0 auto; text-align:left; width:996px; background:#fff;}
p.skip {display:none;}
/* end page container */

/* general layout rules */
div#contentholder {clear:left;}
div#contentblock {float:left; padding:20px 20px; width:996px; w\idth:956px; }
div#content {float:left; width:706px; min-height:380px; height:auto !important; height:380px;}
.home div#content {width:956px;}
div#right {float:right; width:230px;}
/* end general layout rules */

/* header */
div#header {min-height:142px; height:auto !important; height:142px; background:url(../assets/header-bg.png) no-repeat #6DB2D9;}
.home div#header, .resources div#header, .contact div#header, .asia-stats div#header, .utility div#header {border-bottom:5px solid #007CC3;}
div#headerinner {min-height:112px; height:auto !important; height:112px;}
div#headerinner h1 {float:left; margin:25px 0 0 20px; display:inline; background-image:url(../assets/tsunami-5-years-after.png); background-repeat:no-repeat; width:457px; height:56px;}
div#headerinner h1 a {display:block; width:457px; height:56px; text-indent:-9999px; cursor:pointer;}
.home div#headerinner h1 a {width:1px; height:1px;}
div#headerinner p {float:right; margin:22px 32px 0 0; display:inline; background-image:url(../assets/logo.png); background-repeat:no-repeat; width:78px; height:90px;}
div#headerinner p a {display:block; width:78px; height:90px; text-indent:-9999px; cursor:pointer;}
div#headerinner ul {float:right; margin:4px 20px 0 0; list-style-type:none; color:#fff; font-weight:bold; font-size:.92em; display:inline;}
div#headerinner ul li {float:left; line-height:2; margin:0 0 0 4px;}
div#headerinner ul li a {padding:0 0 0 0; color:#fff;}
/* end header */

/* primary navigation */
div#nav {float:left; width:100%;}
div#nav ul {margin:0; padding:0 14px 0 20px; list-style:none;}
div#nav li {float:left; display:inline; background:url(../assets/nav/right.png) no-repeat 100% 3px; margin:0 6px 0 9px; padding:0;}
div#nav li a {float:left; display:block; position:relative; left:-9px; margin-right:-9px; width:.1em; background:url(../assets/nav/left.png) no-repeat 0 3px; padding:6px 12px 0 12px; text-decoration:none; white-space:nowrap; font-weight:bold; color:#fff; min-height:24px; height:auto !important; height:30px; he\ight:24px;}
div#nav > ul a {width:auto;}
/* hover */
div#nav a:hover {color:#F4911E;}
div#nav li:hover {background-position:100% 0px;}
div#nav li:hover a {background-position:0 0px;}
* html div#nav ul li a:hover {background-position:0 3px;}
/* end primary navigation */

/* active states for primary nav */
.home div#nav li.homelink, .home div#nav li.homelink:hover,
.india div#nav li.indialink, .india div#nav li.indialink:hover,
.indonesia div#nav li.indonesialink, .indonesia div#nav li.indonesialink:hover,
.srilanka div#nav li.srilankalink, .srilanka div#nav li.srilankalink:hover,
.thailand div#nav li.thailandlink, .thailand div#nav li.thailandlink:hover,
.resources div#nav li.resourceslink, .resources div#nav li.resourceslink:hover,
.contact div#nav li.contactlink, .contact div#nav li.contactlink:hover
{background-position:100% -150px;}
 
.home div#nav li.homelink a, .home div#nav li.homelink a:hover,
.india div#nav li.indialink a, .india div#nav li.indialink a:hover,
.indonesia div#nav li.indonesialink a, .indonesia div#nav li.indonesialink a:hover, 
.srilanka div#nav li.srilankalink a, .srilanka div#nav li.srilankalink a:hover,
.thailand div#nav li.thailandlink a, .thailand div#nav li.thailandlink a:hover,
.resources div#nav li.resourceslink a, .resources div#nav li.resourceslink a:hover,
.contact div#nav li.contactlink a, .contact div#nav li.contactlink a:hover
{background-position:0 -150px; color:#fff;}
/* end active states for primary nav */

/* subnav */
div#subnav {float:left; font-size:.92em; font-weight:bold; background: #007CC3; width:996px;}
div#subnav ul {float:left; list-style-type:none; white-space:nowrap; padding: 4px 0; margin-left:8px;}
div#subnav ul li {float:left; padding:0;}
div#subnav ul li a {color:#6DB2D9; padding:0 12px; border-right:1px solid #6DB2D9;}
div#subnav ul li.active a {color:#fff;}
div#subnav ul li.last a {border-right:none;}
/* end subnav */

/* plan link */
div#planlink {float:left; clear:left; background-color:#92c5e3; padding:8px 0 8px 20px; width:996px; w\idth:976px;}
div#planlink p {margin:0; font-size:1.5em; color:#fff; line-height:1; padding:5px 0;}
div#planlink p a {}
/* end plan link */

/* footer */
div#footer {float:left; font-size:.92em; color:#007CC3; background: #C6D0D3; width:996px;}
div#footer ul {float:left; list-style-type:none; white-space:nowrap; padding: 4px 0; margin-left:-2px;}
div#footer ul li {float:left; padding:0 0 0 4px;}
div#footer ul li a {}
div#footer p {float:right; text-align:right; margin:0; padding: 4px 0;}
div#footer p a {}
/* end footer */

/* home page rotator */
div#homeblock {width:956px; margin:0; position:relative; background:#ECECEC; min-height:442px; height:auto !important; height:442px;}
/* tabbed menus */
div#content div#homeblock span.navbg {background:#fff; position:absolute; top:0; right:0; width:167px; height:30px; z-index:9;}
div#content div#homeblock span.navbg {opacity: 0.4; filter:alpha(opacity=40)}

div#content div#homeblock ul {width:160px; position:absolute; right:0; top:0; z-index:10; margin:0; float:left;}
div#content div#homeblock li {list-style-type:none; width:29px; float:left;}
div#content div#homeblock li.sri-lanka {width:37px;}
div#content div#homeblock li a {color:#fff; display:block; width:29px; height:30px; width:auto; margin:0; text-indent:-9999em; background-repeat:no-repeat; background-position:center center;}
div#homeblock li a:hover {}
div#content div#homeblock li.active {background:url(../assets/flags/flags-active.png) no-repeat top center;}
div#homeblock li.active a:hover {cursor:pointer;}
div#content div#homeblock li.intro a {background-image:url(../assets/flags/plan.png);}
div#content div#homeblock li.india a {background-image:url(../assets/flags/india.png);}
div#content div#homeblock li.indonesia a {background-image:url(../assets/flags/indonesia.png);}
div#content div#homeblock li.sri-lanka a {background-image:url(../assets/flags/sri-lanka.png); width:36px;}
div#content div#homeblock li.thailand a {background-image:url(../assets/flags/thailand.png);}
/* action panels */
div.action {width:956px; position:absolute; left:0; top:0;}
div.action img {display:block;}
div.action h3 {font-size:3em; font-weight:bold; position:absolute; left:30px; top:30px; margin:0; line-height:1; color:#fff;}
div.action h3 a {color:#fff;}

/* intro text 2 */
div.action div.introtext {width:360px; position:absolute; left:560px; top:216px; padding:42px 0 0 3px;}
div.action div.introtext h3 {left:0px; top:0px; font-size:2.6em;}
div.action div.introtext p {font-size:1.5em; color:#101010;}

/* story links */
div.action div.storylinks {width:310px; position:absolute; left:30px; top:90px;}
div.action div.storylinks p {margin:0 0 4px 0; font-size:1.1em;}
div.action div.storylinks div.storylink {margin:0 0 16px 0; position:relative;}
div.action div.storylinks div.storylink h4 {margin:0; line-height:1; font-size:2.2em; font-weight:normal; }
div.action div.storylinks div.storylink h4 a {position:absolute; top:0; left:0; display:block; width:170px; padding:9px 9px 9px 131px; background-repeat:no-repeat; background-position:9px 9px; min-height:68px; height:auto !important; height:68px;}
div.action div.storylinks div.storylink h4 a:hover {background-color:#fff;}
div.action div.storylinks div.storylink.one h4 a {position:absolute; top:0; left:0;}
div.action div.storylinks div.storylink.two h4 a {top:90px;}
div.action div.storylinks div.storylink.two span.linkbg {top:90px;}
div.action div.storylinks div.storylink span.linkbg {position:absolute; top:0; left:0; display:block; background-color:#fff; opacity:0.6; filter:alpha(opacity=60); width:310px; height:86px;}
/* adjustments for each country */
div.action div.storylinks.india {left:30px; top:90px;}
div.action div.storylinks.india div.storylink.one h4 a {background-image:url(../images/home/india-feature1.jpg);}
div.action div.storylinks.india div.storylink.two h4 a {background-image:url(../images/home/india-feature2.jpg);}

div.action div.storylinks.indonesia {left:30px; top:90px;}
div.action div.storylinks.indonesia p {color:#fff;}
div.action div.storylinks.indonesia div.storylink.one h4 a {background-image:url(../images/home/indonesia-feature1.jpg);}
div.action div.storylinks.indonesia div.storylink.two h4 a {background-image:url(../images/home/indonesia-feature2.jpg);}
div.action div.storylinks.indonesia div.storylink span.linkbg {opacity:0.7; filter:alpha(opacity=70);}

div.action div.storylinks.srilanka {left:620px; top:90px;}
div.action div.storylinks.srilanka p {color:#fff;}
div.action div.storylinks.srilanka div.storylink.one h4 a {background-image:url(../images/home/sri-lanka-feature1.jpg);}
div.action div.storylinks.srilanka div.storylink.two h4 a {background-image:url(../images/home/sri-lanka-feature2.jpg);}

div.action div.storylinks.thailand {left:620px; top:90px;}
div.action div.storylinks.thailand p {color:#fff;}
div.action div.storylinks.thailand div.storylink.one h4 a {background-image:url(../images/home/thailand-feature1.jpg);}
div.action div.storylinks.thailand div.storylink.two h4 a {background-image:url(../images/home/thailand-feature2.jpg);}

/* action layer visibility controls */
div.ontop {z-index:3;}
div.ontwo {z-index:2;}
/* end home page elements */

/******* country landing pages ********/
/* intro */
div.countryintro {float:left; background:#F9F2E1; width:100%; margin:0 0 22px 0;}
div.countryintro img {float:right; margin:0 0 0 12px;}
div.countryintro h2 {float:left; border-bottom:none; margin:12px 0 6px 0; padding:0 0 0 16px; font-size:2.4em;}
* html div.countryintro h2 {float:none;}
div.countryintro p {float:left; clear:left; margin:10px 0 6px 0; padding:0 0 0 16px; font-size:1.1em; font-weight:bold; white-space:nowrap;}
div.countryintro p a {display:block; background:url(../assets/link-chevron.png) no-repeat 0 6px; padding:0 0 0 16px;}
/* stats */
div#content div.countryintro dl {float:left; clear:left; margin:0 0 0 0; padding:0 0 0 16px; font-size:1.1em; width:420px;}
div#content div.countryintro dt {float:left; width:220px; margin:0 0 1px 0;}
div#content div.countryintro dd {float:left; width:200px; margin:0 0 1px 0;}


/* story intros */
div.story {float:left; clear:left; margin:0 0 22px 0; width:100%;}
div.story h3 {margin:0 0 10px 0; font-size:1.7em; font-weight:normal; line-height:1;}
div.story img {float:left; margin:0 20px 0 0;}
div.story p {margin:0;}

/* RHS */
div#right div.rhblock {float:left; margin:0 0 22px 0; background-color:#E0E6EA; width:230px;}
div#right h3 {background:#007CC3; color:#fff; padding:3px 4px 3px 10px; width:216px; margin:0; font-weight:bold; line-height:1.1; font-size:1.3em;}
div#right h3 a {color:#fff;}
div#right div.rhblock img {float:left; margin:0 0 6px 0;}
div#right div.rhblock p {padding:0 10px; line-height:1.3; margin-bottom:8px; width:210px;}
div#right div.rhblock p.link a {font-weight:bold; background:url(../assets/link-chevron.png) no-repeat 0 3px; padding:0 0 0 16px;}
* html div#right div.rhblock p.link a {display:block; background-position: 0 5px;}
div#right div.rhblock.factblock {margin-bottom:0;}
.facts div#right div.rhblock.factblock {display:none;}

/******* story pages ********/
div.slideshow {float:left; margin:0 0 22px 0;}
div.slideshow + p, div.anythingSlider + p {font-weight:bold; font-size:1.2em;}

div#content div.storyintro ul {margin:6px 0 0 0; float:right;}
div#content div.storyintro ul li {list-style-type:none; float:left; margin:0 0 0 16px;}
div#content div.storyintro ul li a {padding:2px 0 2px 20px; background-repeat:no-repeat; background-position:0 2px;}
div#content div.storyintro ul li.read a {background-image:url(../assets/story-jumplink.png);}
div#content div.storyintro ul li.print a {background-image:url(../assets/print-page.png);}
div#content div.storyintro ul li a.stico_default {background-position:0 2px !important;}
.facts div#content div.storyintro ul li.read {display:none;}

/* facts and figures */
div.factsummary {font-size:1.1em;}
div#content div.factsummary dl {float:left; margin:0 0 22px 0;}
div#content div.factsummary dt {float:left; width:220px; margin:0 0 2px 0;}
div#content div.factsummary dd {float:left; width:486px; margin:0 0 2px 0;}

/* in page stat */
div.inpagestat {width:224px; float:right; clear:right; margin:0 0 12px 20px; background:#e1e1e1;}
div.inpagestat p {margin:0; font-style:italic; padding:6px 10px;}
div.inpagestat p.link {font-style:normal;}
div.inpagestat p.link a {background:url(../assets/link-chevron.png) no-repeat 0 3px; padding:0 0 0 14px;}

/* resources section */
div.newsindex div.story {}
div.newsindex div.story img {margin:0 10px 0 0; padding:0 10px 0 0; border-right:1px solid #DEDEDE;}
div.newsindex div.story h3 {margin:-2px 0 0 0; float:left;}
div.newsindex div.story h3 a {}
div.newsindex div.story h4 {width:450px; float:left; margin:-2px 0 0px 0; font-size:1em; border:none; color:#484848;}
div.newsindex div.story p {width:586px; float:left; margin:6px 0 0 0;}

div#content div.story ul.downloads, div#content ul.downloads {float:left; margin:6px 0 10px 0; width:586px;}
div#content ul.downloads li {list-style-type:none; background-image:url(../assets/pdf.png); background-repeat:no-repeat; background-position:left center; padding:5px 0 5px 28px;}


/* asia stats */
div.stats {float:left; width:100%; padding:0 0 10px 0; margin:0 0 22px 0; border-bottom:1px solid #e1e1e1;}
div.stats img {}
div.stats h2 {float:left; border-bottom:none; margin:0 0 6px 0; padding:0 0 0 0; font-size:1.6em;}
* html div.stats h2 {float:none;}
/* stats */
div#content div.stats dl {float:left; clear:left; margin:0 0 10px 0; padding:0 0 0 0; font-size:1.1em; width:300px;}
div#content div.stats dt {float:left; width:100px; margin:0 0 1px 0;}
div#content div.stats dd {float:left; width:200px; margin:0 0 1px 0;}

div#content div.stats dl.variant {width:300px;}
div#content div.stats dl.variant dt {width:150px;}
div#content div.stats dl.variant dd {width:150px;}

div#content div.stats dl.variant2 {width:350px;}
div#content div.stats dl.variant2 dt {width:150px;}
div#content div.stats dl.variant2 dd {width:100px;}

div#content div.stats dl.variant3 {width:430px;}
div#content div.stats dl.variant3 dt {width:260px;}
div#content div.stats dl.variant3 dd {width:85px;}
/* thumbnail link */
div.statsthumb {float:right; margin:0; text-align:center; width:200px; font-size:.92em;}
div.statsthumb.wide {width:265px;}
div.statsthumb img {margin:0;}
div.statsthumb a:hover {text-decoration:none;}

/* video */
div.videoholder {float:right; width:320px; margin:4px 0 10px 20px;}
div.videoholder p {margin:10px 20px; background:#E1E1E1; padding:10px;}

/* sitemap */
div#content ul#sitemap {margin:0; font-size:1.2em; font-weight:bold;}
div#content ul#sitemap li {list-style-type:none;}
div#content ul#sitemap ul {margin:0 0 1em 2em; font-size:.92em; font-weight:normal;}
div#content ul#sitemap ul ul {margin:0 0 0 2em; font-size:1em; font-weight:normal;}
div#content ul#sitemap ul li {background:url(../assets/sitemap-arrow.png) no-repeat 0 4px; padding:0 0 0 20px;}
/* end sitemap */

/* accessibilty page */
div.textsize {display:none;}
.hasjs div.textsize {display:block;}