body { margin: 0; padding: 0; background: #6a5e14; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11px; color: #656131; text-align: center; }
img { border: 0; }
div.clear { clear: both; }
div.spacer {  height: 40px; }
p { margin: 0; padding: 1em; }

div#container { margin: 0 auto; text-align: left; width: 770px; border: 8px solid #2d2d01; }
div#container div#header { background: url(../images/header-bg.jpg) no-repeat top right; height: 170px; }
div#container div#header h1 { float: left; margin: 0; padding: 0; background: url(../images/h204k-logo.jpg) no-repeat; width: 257px; height: 170px; }
div#container div#header h1 a { display: block; width: 257px; height: 170px; text-indent: -9000em; overflow: hidden; }

div#container div#header div#progressbars { float: right; background: url(../images/progressbar-bg.gif) no-repeat; width: 513px; height: 121px; }

/* Progress Bar */
div#container div#header div#progressbars div#pledged, div#container div#header div#progressbars div#rasied { display: block; padding: 10px 10px 10px 20px; }
div#container div#header div#progressbars div#pledged ul, div#container div#header div#progressbars div#rasied ul { float: right; margin: 0 0 5px 0; padding: 0; list-style: none; }
div#container div#header div#progressbars div#pledged ul li, div#container div#header div#progressbars div#raised ul li { float: left; list-style: none; height: 39px; }
div#container div#header div#progressbars div#pledged ul li h2 { margin: 0; padding: 0; background: url(../images/pledged-title.gif) no-repeat; width: 75px; height: 39px; text-indent: -9000em; overflow: hidden; }
div#container div#header div#progressbars div#raised ul li h2 { margin: 0; padding: 0; background: url(../images/raised-title.gif) no-repeat; width: 75px; height: 39px; text-indent: -9000em; overflow: hidden; }
div#container div#header div#progressbars div#pledged li.progressbar-base, div#container div#header div#progressbars div#raised ul li.progressbar-base { margin-left: 3px; background: url(../images/progressbar-base.gif) no-repeat; width: 331px; }
div#container div#header div#progressbars div#pledged li.progressbar-base div.base, div#container div#header div#progressbars div#raised ul li.progressbar-base div.base { margin: 3px auto 4px auto; background: url(../images/bar-base.gif) no-repeat; }
div#container div#header div#progressbars div#pledged li span.totals, div#container div#header div#progressbars div#raised ul li span.totals { display: block; padding: 10px 0 10px 3px; font-size: 10px; text-align: right; font-weight: bold; color: #e7e2cf; }
div.pledged-bar-amount { margin: 3px; background: url(../images/pledged-gradient.gif) no-repeat; height: 32px; }
div.raised-bar-amount { margin: 3px; background: url(../images/raised-gradient.gif) no-repeat; height: 32px; }
div.viewprogress { text-align: center; }
a.viewprogress-btn { display: block; background: url(../images/viewprogress-btn.gif) no-repeat; width: 174px; height: 29px; }
/* end Progress Bar */

div#container div#content { padding-right: 10px; background: #e6d79f url(../images/content-bg.gif) no-repeat; height: 1%; }
div#container div#content .left { float: left; width: 49%; }
div#container div#content .right { float: right; width: 381px; }
div#container div#content div.video-box { margin-top: 25px; padding: 0 0 15px 0; background: #e6d79f url(../images/video-bg.gif) no-repeat bottom; width: 381px; text-align: center; }
div#container div#content p { line-height: 1.4em; }

div#nav { margin: 0 0 0 15px; padding: 0; list-style: none; text-align: center; }
div#nav table { margin: 0 auto; border-collapse: collapse; }
div#nav table td { padding: 0; }
div#nav a { display: block; width: 240px; text-indent: -9000em; overflow: hidden; }
div#nav a.ongoingproj-btn { background: url("../images/ongoingproj-btn.jpg") no-repeat; height: 65px; }
div#nav a.h2o4kstories-btn { background: url("../images/h2o4kstories-btn.jpg") no-repeat; height: 64px; }
div#nav a.faqs-btn { background: url("../images/faqs-btn.jpg") no-repeat; height: 64px; }
div#nav a.didyouknow-btn { background: url("../images/didyouknow-btn.jpg") no-repeat; height: 64px; }
div#nav a:hover { background-position: bottom; }

/* FAQ's */
div.faq-list { padding: 1em 0 0 1.4em; }
div.faq-list a.popuplink img { margin-right: 5px; }
div.faq-list a.popuplink { display: block; padding: 6px 5px 10px 25px; background: url(../images/faq-bg.gif) no-repeat; width: 600px; color: #656131; font-weight: bold; text-decoration: none; }
div.faq-list a.popuplink:hover { display: block; padding: 6px 5px 10px 25px; background: url(../images/faq-bg-u.gif) no-repeat; width: 600px; color: #fff; font-weight: bold; text-decoration: none; }
/* end FAQ's */

/* Order Buttons */
a.orderh20-btn { margin: 0 auto; display: block; margin: 20px 20px 10px 10px; background: url("../images/orderh20-btn.jpg") no-repeat; width: 195px; height: 70px; text-indent: -9000em; overflow: hidden; }
a.orderh20-btn:hover { background: url("../images/orderh20-btn-u.jpg") no-repeat; }
a.orderh202-btn { margin: 0 auto; display: block; margin: 20px 20px 10px 10px; background: url("../images/orderh202-btn.jpg") no-repeat; width: 195px; height: 70px; text-indent: -9000em; overflow: hidden; }
a.orderh202-btn:hover { background: url("../images/orderh202-btn-u.jpg") no-repeat; }
/* end Order Buttons */


/* Inner Header */
div#container div#inner-header { background: url(../images/inner-header-bg.jpg) no-repeat top right; height: 170px; }
div#container div#inner-header h1 { float: left; margin: 0; padding: 0; background: url(../images/h204k-logo.jpg) no-repeat; width: 257px; height: 170px; }
div#container div#inner-header h1 a { display: block; width: 257px; height: 170px; text-indent: -9000em; overflow: hidden; }

div#container div#inner-header div#progressbars { float: right; background: url(../images/progressbar-bg.gif) no-repeat; width: 513px; height: 121px; }

div#container div#inner-header div#progressbars div#pledged, 
div#container div#inner-header div#progressbars div#rasied { display: block; padding: 10px 10px 10px 20px; }
div#container div#inner-header div#progressbars div#pledged ul, 
div#container div#inner-header div#progressbars div#rasied ul { float: right; margin: 0 0 5px 0; padding: 0; list-style: none; }
div#container div#inner-header div#progressbars div#pledged ul li, 
div#container div#inner-header div#progressbars div#raised ul li { float: left; list-style: none; height: 39px; }

div#container div#inner-header div#progressbars div#pledged ul li h2 { margin: 0; padding: 0; background: url(../images/pledged-title.gif) no-repeat; width: 75px; height: 39px; text-indent: -9000em; overflow: hidden; }
div#container div#inner-header div#progressbars div#raised ul li h2 { margin: 0; padding: 0; background: url(../images/raised-title.gif) no-repeat; width: 75px; height: 39px; text-indent: -9000em; overflow: hidden; }

div#container div#inner-header div#progressbars div#pledged li.progressbar-base, 
div#container div#inner-header div#progressbars div#raised ul li.progressbar-base { margin-left: 3px; background: url(../images/progressbar-base.gif) no-repeat; width: 331px; }
div#container div#inner-header div#progressbars div#pledged li.progressbar-base div.base, 
div#container div#inner-header div#progressbars div#raised ul li.progressbar-base div.base { margin: 3px auto 4px auto; background: url(../images/bar-base.gif) no-repeat; }
div#container div#inner-header div#progressbars div#pledged li span.totals, 
div#container div#inner-header div#progressbars div#raised ul li span.totals { display: block; padding: 10px 0 10px 3px; font-size: 10px; text-align: right; font-weight: bold; color: #e7e2cf; }

div#container div#inner-content { padding-right: 10px; background: #e6d79f url(../images/inner-content-bg.gif) no-repeat; height: 1%; }
div#container div#inner-content div.video-box { float: right; margin-top: 25px; padding: 0 0 15px 0; background: #e6d79f url(../images/video-bg.gif) no-repeat bottom; width: 381px; text-align: center; }
div#container div#inner-content p { line-height: 2em; }
/* end Inner Header */

/* footer */
div#container div#footer { background: url(../images/footer-bg.gif) no-repeat bottom; height: 101px; }
/* end Footer */

/* Stories Title Bar */
.stories-titlebar { display: block; background: url("../images/stories-titlebar.gif") no-repeat; width: 662px; height: 65px; text-decoration: none; }
.stories-titlebar h2 { margin: 0; padding: 23px 10px 0 20px; font-size: 14px; font-weight: normal; color: #f4f0e1; }
.stories-titlebar:hover { background-position: bottom; color: #fff; }