@CHARSET "UTF-8";

html {
height: 100%;
padding: 0;
}

/* img { behavior: url(../js/iepngfix/iepngfix.htc) } */

body {
height: 100%;
background:#cccccc url(../images/gradientBG.jpg) no-repeat scroll center top;
color:#333333;
font-family:helvetica,arial,sans-serif;
font-size:13px;
margin:0;
text-align:center;
padding: 0;
}
a {
color:#336699;
text-decoration:none;
font-weight: bold;
}

a:hover {
text-decoration: underline;
}

/* mycharity water progress bar */
#progress_box li {
float:left;
width:54px;
}


#campaign, #stats, #progress_box {
text-align:left;
width:310px;
}

#campaign, #stats, div.light_gray_white_box {
float:left;
height:61px;
text-align:center;
}

.light_gray_white_box {
background-color:#E3E3E3;
position:relative;
}

#campaign, #stats, #progress_box, #bar {
background:transparent url(http://mycharitywater.org/images/progress_empty.jpg) no-repeat scroll 0 0;
height:28px;
margin-bottom:5px;
width: 290px;
}

#campaign, #stats, #progress_box, #bar_progress {
background:transparent url(http://mycharitywater.org/images/progress-filler.jpg) no-repeat scroll 0 0;
display:inline-block;
height:60px;
width: 330px;
}

#progress_box ul {
list-style-image:none;
list-style-position:outside;
list-style-type:none;
margin-left: -39px;
}

#top_story, .credits, #campaign, #stats, li.label, #campaign, #stats, #progress_box p, #campaign, #stats, #progress_box ul {
font-size:7pt;
text-transform:uppercase;
}

/*-------------*/


#badge{
position: relative;
left: 59px;
width: 132px;
height: 132px;
}
* html #badge{
left: 0px;
}


#leaveNote{
display: none;
position: absolute;
    filter: alpha(opacity = 90);
    opacity:.90;
    width: 150px;
    background: #FFFFFF;
    left: -170px;
    top: 30px;
	padding: 10px;
	border: solid 1px;
	color: #222222;	
}



#dim
{
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 1000;
    display: none;
    background-color: #000000;
    filter: alpha(opacity = 70);
    opacity:.70;
    margin: 0px;
    overflow: hidden;

    }



/* sitemap themes */
.sitemap{
display:table;
font-size:14px;
table-layout:auto;
}

.sitemapCell {
border:medium none;
padding:7px;
border:0.5px solid #999999;
}

.sitemapRow{
background: #EAF0F2;
}

.sitemapRow1{
}


/* --------------- ALERT BOXES -------------------*/

#alertBox{
display: none;
width: 100%;
height: 100%;
position: absolute;
z-index: 2000;
vertical-align: middle;
overflow: hidden;
left: -20px;
}

* html #alertBox {
left: -40px;

}


#alertText{
border:medium solid;
background: #ffffff;
color:#333333;
font-family:inherit;
font-size:11px;
margin-left:auto;
margin-right:auto;
padding: 20px;
position: relative;
top:25%;
width:400px;
z-index: 2200;
}

* html #alertText{
margin-left: 25px;
}

.alertErrorMessages{
}

.alertErrorMessages ul{
color: red;
list-style:disc;
margin-left:-25px;
font-size:11px;
font-weight:bold;
text-align:left;
}

.alertErrorMessages li{
color: red;
list-style:disc;
margin-left:-25px;
font-size:11px;
font-weight:bold;
text-align:left;
}


/* ---------------- sidebar ------------------- */
.charitywater {
font-family: serif;
font-size:15px;
text-transform: lowercase;
}

.sidebarText {
left:35px;
margin-bottom:7px;
position:relative;
text-align:left;
width:190px;
font-size: 13px;
line-height: 15px;
}

* html .sidebarText{
left: 10px;
width: 190px;
}

.sidebarText a{
color: #3399cc;
}

.giveLeft{
float:left;
width: 320px;
}

.giveRight{
float:right;
width: 320px;
}

.giveText {
margin-left:18px;
margin-right:41px;
}

.pledgeButton{
}

.donationButton{
}

.giveButtons{
border: none;
}

/* ----------------------- BLOG POSTS ---------------------------   */


#blogReply{
width: 575px;
background: #ffffff;
margin-left:50px;
padding: 10px;
font-size: 13px;
margin-bottom: -10px;
}

* html #blogReply{
width: 565px;
}

#blogReply h3{
color: #336699;
font-size: 11px;
margin-top: 0px;
}
.dateBox{
background: url(../images/dateBox.png);
width:85px;
height:85px;
position:relative;
text-align: center;
float: left;
margin-right: 10px;
}

* html .dateBox{
padding-top: 10px;
}

.dateBox h1 {
color:#FFFFFF;
font-size:30px;
margin-left:-3px;
}


.dateBox h2 {
color:#FFFFFF;
font-size:18px;
margin-top:-22px;
}

#recentUpdate{
width: 650px
}

#recentUpdate h3 {
color:#336699;
font-size:20px;
margin-bottom:7px;
margin-top:6px;
width: 465px;
}

#recentUpdate h4 {
color:#336699;
font-size:10px;
font-weight:normal;
margin-top:10px;
text-align:left;
}

#recentUpdate h5 {
color:#336699;
font-size:13px;
font-weight:normal;
margin-top:-27px;
text-align:right;
}

#recentUpdateText {
width: 650px;
padding-top: 1px;
}
.updatesBottomRight {
float: right;
}

.updatesBottomLeft {
float: left;
}

/* ----------------------- SOCIAL MEDIA...IT'A BEAUTIFUL THING...---------------------------   */

.twitterHeader{
}

.fbShare{
position: relative;
top: -15px;
}

.fbBadge{
border: none;
margin-right: 5px;
width: 38px;
height: 38px;
}

.twitterBadge{
border: none;
margin-right: 5px;
width: 38px;
height: 38px;
}

#twitter_update_list{
font-size:13px;
list-style-image:none;
list-style-position:outside;
list-style-type:none;
margin-bottom:3px;
text-align:left;
width:180px;
}

* html #twitter_update_list {
width: 175px;
}

#twitter_update_list li {
list-style-image:none;
list-style-position:outside;
padding-bottom:12px;
margin-top: -2px;
}

* html #twitter_update_list li {
margin-left: -0px;
margin-top: -5px;
}

#twitter_update_list a {
color: #3399cc;
}


/* ----------------------- MAIN DIV CONTAINERS ---------------------------   */

#centerContent {
margin-left:auto;
margin-right:auto;
width:966px;
min-height: 825px;
height: 100%;
position: relative;
left: 5px;
}

* html #centerContent {
position: relative;
left: 5px;
}

#topContainerLeft {
height:185px;
width: 426px;
float: left;
}

#topContainer {
height: 190px;
}

#bottomContainer{
position:relative;
}

/* ---------------------- NAV HOVERS ----------------------------   */
#dropMenuInner{
background:#333333 none repeat scroll 0 0;
font-size:13px;
padding-top:5px;
padding-left:10px;
padding-right:10px;
padding-bottom:10px;
}

.dropMenuItem {
text-decoration: none;
z-index: 1000;
}

.dropMenuItem hover{
color:#33ccff;
text-decoration:none;
}

.dropMenuItem a:link{
color:#FFFFFF;
display:inline;
text-decoration:none;
}

.dropMenuItem a:visited{
text-decoration: none;
color: #ffffff;
}

.dropMenuItem a:hover{
color:#33ccff;
text-decoration:none;
}

.dropMenuItem a:active{
color:#33ccff;
text-decoration:none;
}



.dropMenuItem{

}

#navHoverAbout {
background:transparent none repeat scroll 0 0;
display:none;
left:30px;
line-height:25px;
padding-top:8px;
position:relative;
text-align:left;
top:-2px;
vertical-align:bottom;
width:155px;
z-index:1000;
}

#navHoverHelp {
background:transparent none repeat scroll 0 0;
display:none;
left:100px;
line-height:25px;
padding-top:8px;
position:relative;
text-align:left;
top:-2px;
vertical-align:bottom;
width:155px;
z-index:1000;
}

#navHoverFollow{
background:transparent none repeat scroll 0 0;
display:none;
left:156px;
line-height:25px;
padding-top:8px;
position:relative;
text-align:left;
top:-2px;
vertical-align:bottom;
width:155px;
z-index:1000;
}

#navHoverQuestions{
background:transparent none repeat scroll 0 0;
display:none;
left:260px;
line-height:25px;
padding-top:8px;
position:relative;
text-align:left;
top:-2px;
vertical-align:bottom;
width:155px;
z-index:1000;
}

#navHoverStore{
background:transparent none repeat scroll 0 0;
display:none;
left:363px;
line-height:25px;
padding-top:8px;
position:relative;
text-align:left;
top:-2px;
vertical-align:bottom;
width:155px;
z-index:1000;
}


/* ----------------------- TOP NAV CLASSES AND IDS---------------------------   */

.navDivider {
color:#3399CC;
margin-left:2px;
margin-right:2px;
font-weight: bold;
}

.navBarBG {
background:#333 none repeat scroll 0 0;
height:26px;
position:absolute;
top:163px;
width:100%;
}

#topNav {
color:#FFFFFF;
font-family: arial, sans-serif;
font-size:14px;
height:20px;
text-align:left;
position: absolute;
top: 167px;
left: -42px;
width: 620px;
z-index: 1000;
}

#topNav ul{
display:inline;
text-decoration: none;
z-index: 1000;
}

#topNav li{
color:#FFFFFF;
display:inline;
text-decoration:none;
z-index: 1000;
}

#topNav li:hover{
color:#33ccff;
text-decoration:none;
}

#topNav a:link{
color:#FFFFFF;
display:inline;
text-decoration:none;
}

#topNav a:visited{
text-decoration: none;
color: #ffffff;
}

#topNav a:hover{
color:#33ccff;
text-decoration:none;
}

#topNav a:active{
color:#33ccff;
text-decoration:none;
}

/* ----------------------- GENERAL PAGE DIVS ---------------------------   */


#addPledge{
}

.blue-title {
color:#336699;
font-family:helvetica,arial,sans-serif;
font-size:20px;
font-weight:bold;
margin-bottom: 15px

}
.dark-title {
color:#333333;
font-family:helvetica,arial,sans-serif;
font-size:20px;
font-weight:bold;
margin-bottom: 15px;
border-bottom: 1px dotted #eeccee;

}

.centertext {
color:#FFFFFF;
font-family:helvetica,arial,verdana,sans-serif;
font-size:15px;
font-weight:normal;
text-align:left;
width:440px;
}

.text-container {
text-align:center;
}

.logo{
border: none;
}

#leftLogo {
height:71px;
width:426px;
float: left;
position:relative;
top: 15px;
left: -10px;
display: block;
z-index: 50;
margin-left: -30px;
}

#rightBottles {
background:transparent url(../images/topright_img_2.png) no-repeat scroll 0 0;
float:right;
height:243px;
width:540px;;
position: relative;
z-index: 50;
}

#mainContent {
font-size:14px;
text-align:left;
width:665px;
float: left;
position: relative;
top: -35px;
left: 10px;
background: url(../images/40perwhitesquare.png);
padding: 10px;
}

* html #mainContent{
min-height: 825px;
}

.sideButtons {
overflow:hidden;
position:relative;
width:258px;
text-align: center;
}

* html .sideButtons {
left: 2px;
}

.sidebarBG {
background:transparent url(../images/sidebar_bg.png) repeat-y scroll center center;
}

.sidebarBottom {
width: 258px;
height: 50px;
left: 7px;
}

.sidebar {
float:right;
left: 7px;
width:258px;
position: relative;
text-align: center;
color: #ffffff;
}

* html .sidebar{
left: 0px;
width: 250px;
}

.topbar {
background: url(../images/topbar_bg.png) repeat-x scroll 0 0;
height:215px;
text-align:center;
width: 100%;
position: absolute;
}

* html .topbar {
left: -1px;
}

.buttons {
border: none;
height:51px;
width:158px;
margin-bottom: 4px;
}


.footerImage{
position: relative;
left: -12px;
height: 196px;
}

#darkFooter{
background:transparent url(../images/footerBG.png) repeat-x 0 0;
bottom:0;
height:180px;
margin-bottom:0;
margin-top:-180px;
overflow:hidden;
width:100%;
}

#footer{
margin-left: auto;
margin-right: auto;
float: left;
width: 100%;
height: 196px;
margin-top: -196px;
z-index: 5;
overflow: hidden;
position: relative;
}

#footerSpacerHack{
height:196px;
width: 100%;
float: left;
position: relative;
}


/* ----------------------- FORMS ---------------------------   */
#signupform-main {
font-family:helvetica,arial,verdana,sans-serif;
font-size:11px;
width: 500px;
}

#signupform-error {
color:red;
font-family:helvetica,arial,verdana,sans-serif;
font-size:10px;
margin-top:-11px;
position:absolute;
right:-26px;
text-align:left;
width:225px;
}

* html #signupform-error {
padding-top: 8px;
right: -35px;
}


.signupform-left {
float:left;
font-family:Helvetica,Arial,Verdana,Sans-serif;
font-size:14px;
font-weight:bold;
height:25px;
text-align:left;
vertical-align:text-bottom;
width:180px;
padding-top: 5px;
}

.signupform-right {
float:right;
font-family:Helvetica,Arial,Verdana,Sans-serif;
font-size:18px;
height:25px;
text-align:left;
top:0;
vertical-align:top;
width:259px;
}

.signupform-fields {
font-family:Helvetica,Arial,Verdana,Sans-serif;
font-size:17px;
height:25px;
width:260px;
}

.pledgeField {
font-family:Helvetica,Arial,Verdana,Sans-serif;
font-size:17px;
height:27px;
text-align:left;
width: 50px;
}

.signupform-select {
font-family:Helvetica,Arial,Verdana,Sans-serif;
font-size:17px;
height:115px;
text-align:left;
width:148px;
}

#signupform-help {
color:#666666;
float:right;
font-size:9px;
font-weight:lighter;
height:73px;
overflow:hidden;
width:180px;
}

#signupform-buttons {
font-family:inherit;
font-size:9px;
height:92px;
left:90px;
overflow:hidden;
position:relative;
text-align:center;
top:15px;
width:325px;
}

#title {
color:#336699;
font-family:Helvetica,Arial,Verdana,Sans-Serif;
font-size:18px;
font-weight:bold;
height:23px;
text-align:left;
padding-top: 5px;
width: 500px
}
.spacer-row {
height:15px;
}

/*----hack for SPOT tracking */

#maptracker{
left:-475px;
margin-left:50%;
margin-top:5px;
position:absolute;
z-index:2000;
background: #333333;
}
#barcover{
background:#111111 none repeat scroll 0 0;
height:25px;
position:absolute;
top:162px;
width:100%;
z-index:1001;
}
* html #barcover{
position: fixed;
}