@charset "utf-8";
* {
	margin: 0;
	padding: 0;
}

body {
	background-color: #000;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 0.8em;
	line-height: 1.5em;
	color: #1a1615;
}

a:link, a:visited {
	color: #1a1615;
}

a:hover {
	color: #e31b23;
}

img {
	border: none;
}

p {
	margin: 5px 0 10px;
	text-align: justify;
}

h1 {
	margin: 10px 0 10px;
	font-size: 130%;
}

h2 {
	margin: 10px 0;
	font-size: 110%;
}

ol {
	margin-left: 20px;
}

.sup {
	font-size: 70%;
	position: relative;
	bottom: 0.5em;
}

.underlinedHeader {
	font-size: 120%;
	font-weight: bold;
	border-bottom: 1px solid black;
	clear: both;
	text-align: left;
}

.contentClearer {
	margin: 0;
	clear: both;
}

.contentList {
	margin-left: 20px;
	list-style-image: url(images/list_love.png);
}

.contentList li {
	padding: 5px 0;
}

.note {
	margin: 15px 0;
	font-size: 75%;
	line-height: 1em;
}

/* Global Structure */
#header {
	margin: 0 auto;
	width: 960px;
}

/* Header */
#header div {
	float: left;
}

#header .foundation {
	float: right;
}

/* Navigation */
#navigation {
	height: 40px;
	background: url(images/navi_bg.gif) repeat-x;
	clear: both;
}

#nav, #nav ul { /* all lists */
	padding: 0;
	margin: 0;
	list-style: none;
}

#nav {
	width: 960px;
	margin: 0 auto;
	z-index: 500;
}

#nav a {
	display: block;
	height: 40px;
	text-decoration: none;
}

#nav li { /* all list items */
	float: left;
}

#nav li ul li {
	float: none;
	background: url(images/dottedline_grey.gif) repeat-x left bottom;
}

#nav li ul { /* second-level lists */
	position: absolute;
	left: -999em; /* using left instead of display to hide menus because display: none isn't read by screen readers */
	border: 2px solid #f8981d;
	padding: 5px;
	background: white;
	z-index: 500;
}

#nav li ul ul { /* third-and-above-level lists */
	margin: -40px 0 0 190px;
}

#nav li:hover ul ul, #nav li.sfhover ul ul {
	left: -999em;
}

#nav li:hover ul, #nav li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul { /* lists nested under hovered list items */
	left: auto;
}

#nav .navMyHome a {
	width: 179px;
	background: url(images/nav_myhome.gif) no-repeat left top;
}

#nav .navMyKasih a {
	width: 271px;
	background: url(images/nav_mykasih.gif) no-repeat left top;
}

#nav .navMyProg a {
	width: 224px;
	background: url(images/nav_myprogramme.gif) no-repeat left top;
}

#nav .navMyMedia a {
	width: 182px;
	background: url(images/nav_mymedia.gif) no-repeat left top;
}

#nav .navMyContact a {
	width: 104px;
	background: url(images/nav_mycontact.gif) no-repeat left top;
}

#nav a:hover {
	background-position: 0px -80px;
}

#nav li ul li a {
	padding: 3px 12px;
	height: 20px;
}

#nav .navMyKasih ul li a, #nav .navMyProg ul li a, #nav .navMyMedia ul li a {
	width: 200px;
	background: url(images/arrow_list.png) no-repeat left 7px;
}

#nav li ul li a:hover {
	font-weight: bold;
	background-position: 0 -33px;
}

#nav li:hover, #nav li.hover {  
    position: static;  
} 

/* Left Navigation */
#leftNav {
	width: 170px;
	float: left;
}

#leftNav ul {
	list-style: none;
}

#leftNav ul li {
	background: url(images/arrow_list.png) no-repeat left 14px;
}

#leftNav ul li a {
	padding: 8px 15px 8px;
	text-decoration: none;
	display: block;
	background: url(images/dottedline_grey.gif) repeat-x left bottom;
}

#leftNav ul li:hover {
	background-position: 0 -26px;
}
/* Stage for Home */
#stage {
	height: 300px;
}

#stage .stageBase {
	padding: 10px;
	width: 960px;
	margin: 0 auto;
}

#stage .slideshow {
	float: left;
}

#stage .vision {
	float: right;
}

#stage .vision img {
	margin: 20px 0 0 10px;
}

#stage .vision .helpBtn {
	margin-top: 10px;
	float: right;
	background: #e31b23 url(images/stage_btn_right.gif) no-repeat right top;
	width: 170px;
}

#stage .vision .helpBtn a {
	padding: 10px 0 0 5px;
	display: block;
	height: 30px;
	font-size: 125%;
	color: white;
	font-weight: bold;
	background: url(images/stage_btn_left.gif) no-repeat left top;
	text-decoration: none;
}

/* Content */
#content {
	clear: both;
}

#content .contentBase {
	width: 960px;
	margin: 0 auto;
	padding: 10px;
}

#home #content {
	background: #feead2 url(images/content_bg_home.gif) repeat-x left top;
}

#home #content .donationAidFlash {
	margin-right: 15px;
	float: left;
}

#home #content .homeColumn {
	margin-right: 15px;
	width: 232px;
	float: left;
	line-height: 1.3em;
}

#content .homeColumn ul {
	list-style: none;
}

#content .homeColumn ul li, #content .homeColumn dd {
	padding: 2px 0;
	background: url(images/dottedline_grey.gif) repeat-x left bottom;
}

#content .homeColumn ul li a {
	display: block;
	background: url(images/view_gallery.gif) no-repeat 170px 0;
	text-decoration: none;
}

#content .homeColumn ul li a:hover {
	background-position: 170px -32px;
}

#content .homeColumn dt {
	font-weight: bold;
}

#content .homeColumn dd {
	margin-bottom: 5px;
	padding-bottom: 5px;
}

/* Main Content */
#main {
	margin-left: 10px;
	width: 570px;
	float: left;
}

#main dt {
	font-weight: bold;
}

/* Picture And Caption Box */
.contentBoxGroup .contentBox {
	width: 180px;
	float: left;
	margin: 0 10px 10px 0;
}

.contentBoxGroup p {
	margin: 0;
}

.contentBoxGroup .contentBox .contentBoxCaption {
	padding: 5px;
	line-height: 1.2em;
	background: #e31b23 url(images/arrow_12x12_white.png) no-repeat 165px 40px;
	height: 45px;
	text-align: left;
}

.contentBoxCaption a {
	color: white;
	text-decoration: none;
}

.contentBoxCaption a:hover {
	color: white;
	text-decoration: underline;
}

.approachBoxGroup .approachBox {
	width: 140px;
	float: left;
	margin: 0 2px 10px 0;
}

.approachBoxGroup p {
	margin: 0;
}

.approachBox .approachBoxCaption {
	padding: 5px;
	line-height: 1.2em;
	background: #e31b23;
	color: white;
	height: 60px;
	text-align: left;
}

.waysBoxGroup p {
	margin: 0;
}

.waysBoxGroup .waysBox {
	width: 180px;
	margin-right: 10px;
	float: left;
	height: 205px;
}

.waysBoxGroup .waysBoxText {
	padding: 5px;
	color: white;
	line-height: 1.2em;
	text-align: left;
}

/* Partners Page */
.charityPartners img {
	float: left;
	margin: 0 5px 10px 0;
}

.supportingPartners img, .ngos img {
	float: left;
	margin: 0 10px 5px 0;
}

/* Message Page */
.foundersMessage {
	margin: 0;
	padding: 0;
}
.foundersMessageContent {
	padding: 15px;
	background: url(images/message_bg.gif) repeat-y top left;
}

/* MyMedia Pages */
.coverageList dt {
	font-weight: bold;
}

.coverageList dd {
	padding: 2px 0;
}

.coverageList dd a {
	text-decoration: none;
}

/* Photo Gallery Pages */
.galleryFeatured div {
	margin-right: 10px;
	width: 242px;
	height: 170px;
	float: left;
	background: url(images/mymedia_gallery_feat.gif) no-repeat left top;
}

.galleryFeatured div img {
	margin: 10px;
}

.galleryFeatured p {
	padding-top: 70px;
}

.gallerySelect {
	list-style: none;
}

.gallerySelect li {
	display: inline;
}

.gallerySelect li a {
	margin-right: 5px;
	margin-bottom: 5px;
	width: 80px;
	height: 101px;
	display: block;
	background: url(images/mymedia_gallery.gif) no-repeat left top;
	padding: 10px 11px 13px 11px;
	float: left;
	text-decoration: none;
}

.gallerySelect li a img {
	margin-bottom: 4px;
}

.gallerySelect li a p {
	margin: 0;
	padding: 0;
	font-size: 70%;
	text-align: center;
	line-height: 1.1em;
}

div.photoContent {
        /* The display of content is enabled using jQuery so that the slideshow content won't display unless javascript is enabled. */
        display: none;
        float: right;
        width: 570px;
		background: #000;
		padding: 10px 0;
}
div.photoContent a, div.photoThumbsNavigation a {
        text-decoration: none;
}
div.photoContent a:focus, div.photoContent a:hover, div.photoContent a:active {
        /* text-decoration: underline; */
}
div.photoControls {
	padding: 0 10px;
        height: 30px;
}
div.photoControls a {
        padding: 5px 10px;
		color: white;
}
div.ss-controls {
        float: left;
}
div.ss-controls a.play, div.ss-controls a.pause {
	padding-left: 12px;
	background: url(images/gallery_items_slideshow.gif) no-repeat left center;
}
div.nav-controls {
        float: right;
}
div.nav-controls a.prev {
	padding-left: 12px;
	background: url(images/gallery_items_prevphoto.gif) no-repeat left center;
}
div.nav-controls a.next {
	padding-right: 12px;
	background: url(images/gallery_items_nextphoto.gif) no-repeat right center;
}
div.ss-controls a:hover, div.nav-controls a:hover {
	color: #e31b23;
	text-decoration: none;
}
div.loader {
        background-image: url('loader.gif');
        background-repeat: no-repeat;
        background-position: center;
        width: 570px;
        height: 510px; /* This should be set to be at least the height of the largest image in the slideshow */
}
div.photoSlideshow {

}
div.photoSlideshow span.image-wrapper {
        display: block;
}
div.photoSlideshow a.advance-link {
        display: block;
        width: 570px;
        height: 510px; /* This should be set to be at least the height of the largest image in the slideshow */
        line-height: 510px; /* This should be set to be at least the height of the largest image in the slideshow */
        text-align: center;
}
div.photoSlideshow a.advance-link:hover, div.photoSlideshow a.advance-link:active, div.photoSlideshow a.advance-link:visited {
        text-decoration: none;
}
div.photoSlideshow img {
        vertical-align: middle;
        border: 1px solid #ccc;
}
div.download {
        float: right;
}
div.caption-container {
       
}
span.image-caption {
        display: block;
}
div.caption {
        background-color: #000;
        padding: 12px;
        color: #ccc;
}
div.caption a {
        color: #fff;
}
div.image-title {
        font-weight: bold;
        font-size: 1.4em;
}

div.image-desc {
        line-height: 1.3em;
        padding-top: 12px;
}
div.photoThumbsNavigation {
        /* The navigation style is set using jQuery so that the javascript specific styles won't be applied unless javascript is enabled. */
}
ul.thumbs {
        clear: both;
        margin: 0;
        padding: 0;
}
ul.thumbs li {
        float: left;
        padding: 0;
        margin: 2px 4px 2px 0;
        list-style: none;
}
a.thumb {
        padding: 1px;
        display: block;
        border: 1px solid #ccc;
}
ul.thumbs li.selected a.thumb {
        background: #000;
}
a.thumb:focus {
        outline: none;
}
ul.thumbs img {
        border: none;
        display: block;
}
div.pagination {
        clear: both;
}
div.photoThumbsNavigation div.top {
        margin-bottom: 12px;
        height: 11px;
}
div.photoThumbsNavigation div.bottom {
        margin-top: 12px;
}
div.pagination a, div.pagination span.current, div.pagination span.ellipsis {
        display: block;
        float: left;
        margin-right: 2px;
        padding: 4px 7px 2px 7px;
        border: 1px solid #333;
		color: white;
}
div.pagination a:hover {
        background-color: white;
        text-decoration: none;
		color: #e31b23;
}
div.pagination span.current {
        font-weight: bold;
        background-color: white;
        border-color: #333;
        color: #e31b23;
}
div.pagination span.ellipsis {
        border: none;
        padding: 5px 0 3px 2px;
}
#captionToggle a {
        float: right;
        display: block;
        background-image: url('caption.png');
        background-repeat: no-repeat;
        background-position: right;
        margin-top: 5px;
        padding: 5px 30px 5px 5px;
}

/* Minimal Gallery Styles */
#thumbs-min ul.thumbs li {
        float: none;
        padding: 0;
        margin: 0;
        list-style: none;
}

#thumbs-min a.thumb {
        padding: 0px;
        display: inline;
        border: none;
}

#thumbs-min ul.thumbs li.selected a.thumb {
        background: inherit;
        color: #000;
        font-weight: bold;
}


/* Sidebar */
#sidebar {
	padding-top: 20px;
	width: 200px;
	float: right;
}

.sidebarQuote {
	background: #231f1d url(images/sidebar_quote.gif) no-repeat 3px 175px;
	color: white;
	line-height: 1.3em;
}

.sidebarQuote .sidebarQuoteImg {
	padding: 2px;
}

.sidebarQuote .sidebarQuoteText {
	margin: 0 0 0 2px;
	padding: 5px 5px 5px 25px;
	background: url(images/sidebar_quote_close.gif) no-repeat 170px bottom;
	font-weight: bold;
	text-align: left;
}

.sidebarQuote .sidebarQuoteCredit {
	text-align: right;
	padding: 10px 5px 10px 0;
	margin: 0 2px 0 0;
	font-size: 85%;
	line-height: 1.1em;
	/*background: url(images/sidebar_quote_close.gif) no-repeat 175px top;*/
}

ul.moreGalleries {
	list-style: none;
	color: white;
	padding-bottom: 10px;
	clear: both;
}

ul.moreGalleries li {
	padding: 2px 0;
	background: url(images/dottedline_grey.gif) repeat-x left bottom;
}

ul.moreGalleries li a {
	padding-left: 7px;
	background: url(images/sidebar_gallery_arrow.gif) no-repeat left center;
	color: white;
	text-decoration: none;
}

ul.moreGalleries li a:hover {
	color: #e31b23;
}
/* Footer */
#footer {
	background: #f8981d;
	clear: both;
}

#footer .footerLinks {
	padding: 15px 10px;
	width: 960px;
	margin: 0 auto;
}

#footer .footerLinks div, #footer .footerLinks ul {
	margin: 0 10px 20px 0;
	float: left;
}

#footer .footerLinks ul {
	list-style: none;
	width: 165px;
}

#footer .footerLinks li {
	padding: 0 0 2px 0;
	background: url(images/dottedline_black.gif) repeat-x left bottom;
}

#footer .footerLinks li a {
	text-decoration: none;
}

#footer .footerContact img {
	margin: 5px 0 0 0;
}
#footer .footerCopy {
	padding: 5px 0;
	color: #f8981d;
	background: #000;
	clear: both;
}

#footer .footerCopyBase {
	width: 960px;
	margin: 0 auto;
}

#footer .footerCopyBase .footerCopyright {
	float: left;
}

#footer .footerCopyBase .footerSupport {
	float: right;
	color: #666;
}

#footer .footerCopyBase .footerSupport img {
	padding: 0 0 10px 2px;
	float: right;
}