/*
Copyright (c) 2007, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
http://developer.yahoo.net/yui/license.txt
version: 2.4.0
*/
/* More details: http://developer.yahoo.com/yui/reset/ */
html{color:#000;background:#FFF;}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0;}table{border-collapse:collapse;border-spacing:0;}fieldset,img{border:0;}address,caption,cite,code,dfn,em,th,var{font-style:normal;font-weight:normal;}li{list-style:none;}caption,th{text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}q:before,q:after{content:'';}abbr,acronym {border:0;font-variant:normal;}sup {vertical-align:text-top;}sub {vertical-align:text-bottom;}input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;}legend{color:#000;}



html {background: #9EDEF6;}

body {
background-image:url(../images/tap/bg_body2.jpg);
background-position:top center;
background-repeat:repeat-x;
background-color:#97DBF5;
text-align:center;
position:absolute;
top:0;
left:0;
font-family: "Trebuchet MS", verdana, sans-serif;
color: #398FAE;
font-size: .85em;
line-height: 1.6;
}



a {
  color: #00AEEF;
  font-weight: bold;
}



h3.legend,
legend {
  color: #009ECA;
  font-size: 1.2em;
  font-weight: bold;
}

fieldset {
  padding: 10px;
}

form {
  border-top: 1px solid #7EDCF8;
  padding-top: 20px;
}

form label {
  width: 10em;
  display: block;
  float: left;
  cursor: pointer;
  color: #398FAE;
  text-align: left;
}

form label.standard {
  width: auto;
  display: inline;
  float: none;
}


#container {
  margin:0pt auto;
  padding:0pt;
  width:750px;  
}



#content {
}

input, select {
  padding: 3px;
}

h1 {
  text-indent:-600em;
  cursor: pointer;
}

h3.legend {
  padding-bottom: 5px;
  margin-bottom: 20px;
  margin-left: 20px;
  border-bottom: 1px solid #7EDCF8;    
  padding-left: 0;
}

p {
  margin-bottom: 1em;
}

#head {
  text-align: center;
}

h1 {
  behavior: url('/iepngfix.htc');   
  background: url('../images/tap/logo.png') no-repeat center top;
  height: 105px;
  width: 156px;
  margin:0pt auto;  
}


ul#main_navigation {
  height: 24px; 
  position: relative; 
}

ul#main_navigation li {
  position: absolute;
/*  width: 95px;*/
  overflow: hidden;  
}

ul#main_navigation li, ul#main_navigation li a {
  display: block;
  width: 95px;  
  height: 24px;   
}

/*ul#main_navigation li#contact_button a {
  width: 92px;
}*/

#about_button,
#restaurants_button,
#volunteer_button,
#donate_button,
#cities_button,
#media_button,
#partners_button,
#contact_button {
  background-repeat: no-repeat;
  background-position: 0 0px;  
}

#about_button { background-image: url('../images/nav/about_1.gif'); left: 0;} 
#restaurants_button { background-image: url('../images/nav/restaurants_2.gif'); left: 95px; }
#volunteer_button { background-image: url('../images/nav/volunteer_3.gif'); left: 190px; width:92px; }
#donate_button { background-image: url('../images/nav/donate_4.gif'); left: 285px; width:92px;}
#cities_button { background-image: url('../images/nav/local_tap_5.gif'); left: 380px; width:92px;}
#media_button { background-image: url('../images/nav/media_6.gif'); left: 475px; }
#partners_button { background-image: url('../images/nav/partners_7.gif'); left: 570px; width: 92px;}
#contact_button { background-image: url('../images/nav/contact_8.gif'); left: 665px;width:95px; }


#about_button a:hover { background-image: url('../images/nav/about_1.gif'); background-position: 0 -24px; }
#restaurants_button a:hover { background-image: url('../images/nav/restaurants_2.gif'); background-position: 0 -24px; }
#volunteer_button a:hover { background-image: url('../images/nav/volunteer_3.gif'); background-position: 0 -24px; width:92px; }
#donate_button a:hover { background-image: url('../images/nav/donate_4.gif'); background-position: 0 -24px; width:92px; }
#cities_button a:hover { background-image: url('../images/nav/local_tap_5.gif'); background-position: 0 -24px; width:92px;}
#media_button a:hover { background-image: url('../images/nav/media_6.gif'); background-position: 0 -24px; }
#partners_button a:hover { background-image: url('../images/nav/partners_7.gif'); background-position: 0 -24px; width:92px;}
#contact_button a:hover { background-image: url('../images/nav/contact_8.gif'); background-position: 0 -24px; width: 92px; }

ul#main_navigation li a{
  text-indent:-600em;
}


/* The following highlight the correct button when it's section is active, based on the body's id. */

body#contact #contact_button,
body#volunteer #volunteer_button,
body#cities #cities_button,
body#about #about_button,
body#media #media_button,
body#donate #donate_button {
  background-position: 0 -48px;
}





/********* Sub Nav *********/
ul.subnav {
  text-align: left;
  margin-top: 14px;
  position: relative;   
  padding-bottom: 1px;
}
ul.subnav li {
  margin-right: 14px;
  position: absolute;
  overflow: hidden;  
}


ul.subnav li a {
  text-indent:-600em;
}

ul.subnav li, ul.subnav li a{
  display: block;
  height: 8px;
}

/******** About Subnav ******/
#about_subnav li#about_mission_nav {background: url('../images/subnav/about_mission.gif'); width:38px;left: 0;}
#about_subnav li#about_world_water_day_nav {background: url('../images/subnav/about_world_water_day.gif'); width:85px;left:68px;}
#about_subnav li#about_water_facts_nav {background: url('../images/subnav/about_tap_water_facts.gif'); width:79px;left:186px;}
#about_subnav li#about_who_is_drinking_tap_nav {background: url('../images/subnav/about_who_is_drinking_tap.gif'); width:97px;left:305px;}

#about_subnav li#about_mission_nav:hover,
#about_subnav li#about_world_water_day_nav:hover,
#about_subnav li#about_water_facts_nav:hover,
#about_subnav li#about_who_is_drinking_tap_nav:hover {
  background-position: 0 -11px;
}


/******** Media Subnav ************/
#media_subnav { left: 467px;width: 100px;}

#media_subnav li#media_press {background: url('../images/subnav/media_press.gif'); width:29px;left: 0;}
#media_subnav li#media_photos {background: url('../images/subnav/media_photos.gif'); width:34px;left:68px;}
#media_subnav li#media_videos {background: url('../images/subnav/media_videos.gif'); width:31px;left:146px;}


#media_subnav li#media_press:hover,
#media_subnav li#media_photos:hover,
#media_subnav li#media_videos:hover {
  background-position: 0 -11px;
}



/******** Restaurants Subnav ******/
#restaurants_subnav {left: 75px;}
#restaurants_subnav li#restaurants_the_restaurants {background: url('../images/subnav/restaurants_the_restaurants.gif'); width:83px;left: 0;}
#restaurants_subnav li#restaurants_apply {background: url('../images/subnav/restaurants_apply.gif'); width:28px;left: 113px;}

#restaurants_subnav li#restaurants_the_restaurants:hover,
#restaurants_subnav li#restaurants_apply:hover {
 background-position: 0 -11px;  
}
/******** Content ***********/


div.main {
  width: 753px;
}

div.main, div.main_narrow {
  margin-top: 35px;
}

h2 {
  color: #45cdf3;
  font-size: 1.45em;
  padding: 20px 20px 15px 20px;  
  font-weight: bold;
}

h3 {
  color: #009eca;
  font-size: 1.2em;
  padding-left: 20px;  
  font-weight: bold;  
}

h3.error {
  color: #ff0000;
  margin-left: 10px;
}


ol,
.bulleted {
  margin-bottom: 15px;
}

ul.bulleted li {
  margin-left: 45px;
  list-style: disc;  
  padding-right: 30px;
}

ol li {
  margin-left: 45px;
  list-style: decimal;
}


div.main_narrow p,
div.main p {
  padding-left: 20px;
  padding-right: 20px;  
  color: #398fae;
}


div.main {
  background: url('../images/backgrounds/wide_middle.gif') top left repeat-y;
}

.top_rounded_corners,
div.main h2.subtitle {
  background: url('../images/backgrounds/wide_top.gif') top left no-repeat;
}

.top_rounded_corners {
  margin: 0;
  padding-top: 20px;
}



div.main .column_1 {
  padding-right: 10px;
  width: 50%;
}

div.main_narrow h2.subtitle {
  background: url('../images/backgrounds/narrow_top.gif') top left no-repeat;
}



div.main_narrow {
  background: url('../images/backgrounds/narrow_middle.gif') top left repeat-y;  
  width: 502px;
}


/********* Side Bars (not to be confused with text columns) *****************/

.left {
  float: left;
  margin-right: 20px;
}

#side {
  padding-top: 35px;
}

#side a {
  color: inherit;
  text-decoration: none;
}

#side:after {
  content:".";
  display:block;
  height:0;
  clear:both;
  visibility:hidden;
}
#side {display:inline-block;}
/* Hide from IE Mac \*/
#side {display:block;}
/* End hide from IE Mac */


#side h2{
  padding-left: 0;
  padding-right: 0;
  color: #009eca;
}

#side dl dt {
  color: #00607b;
  font-weight: bold;
}

#side dl dd a {
  color: #0088ae;
  text-decoration: none;
}

#side dl dd a:hover {
  text-decoration: underline;
}


#side p {
  font-size: 1.1em;
  font-weight: bold;    
}

#side p a {
  text-decoration: underline;
}

/**************** Donate Section ************/
#donate_photo {
  float: left;
  margin: 0 20px 20px 20px;
  border: 3px solid #BAEFFF;  
}

#donate_link {
  float: left;
  margin-right: 20px;
  margin-left: 250px;
}

/*************** Restaurant Registration *****/
#self_registration_info h2 {
  color: #009ECA;
  padding-bottom: 5px;
}
#self_registration_info p {
  margin-left: 20px;
  margin-bottom: 5px;
}


/**************** Media *********************/

ul.media_links {
  padding-left: 20px;
  line-height: 1.5;
}

ul.media_links li {
  margin-bottom: 10px;
}

ul.media_links li img {
  float: left;
  margin-right: 10px;
  border: 3px solid #BAEFFF;  
}


ul.media_links li span {
  font-size: 1.3em;
}

ul.media_links li a {
  display: block;
  color: #45CDF3;
  font-size: 1.1em;
}

ul.photos {
  padding-left: 20px;
  padding-top: 10px;
}

ul.photos li {
  display: inline;
}

ul.photos li img {
  padding: 0px 10px 10px 0;  
}

/**************** Send to a Friend **********/
.send_to_friend_button {
  float: left;
  margin-right: 20px;
  padding: 0;
}

/**************** About Section Stuff *******/
ul.list_with_icons {
  margin-left: 20px;
}

ul.list_with_icons li {
/*  clear: left;*/
  margin-bottom: 30px;
  height: 60px;
  line-height: 1; /* Gets the content flush w/ the top of the li. */
}

ul.list_with_icons li img {
  float: left;
  border: 3px solid #BAEFFF;
  margin-right: 10px;
}

ul.list_with_icons li h3 {
  font-size: 1.25em;
  color: #00607B;
}

ul.list_with_icons li p {
  color: #0088AE;
  margin-top: 10px;
}


div#facts_map {
  text-align: center;
  margin-top: 35px;
}



/********* Parnters *******************/
img.partner_photo {
  float: right;
  margin: 0 20px 20px 15px;
  border: 3px solid #BAEFFF;    
}



/********* Restaurant Registration ***/
form#restaurant_form { /* Make sure the big form has rounded corners on top. */
  background: url('../images/backgrounds/wide_top.gif') top left no-repeat;  
  border: 0;
}





h3.legend span,
legend span {
  color: #67DEFF;
}


form#restaurant_form .column_1 {
  width: 45%;
}

form#restaurant_form .column_2 {
  padding-right: 20px;
}

form#restaurant_form select,
form#restaurant_form input {
  width: 130px;
}

form#restaurant_form select#restaurant_referral_id {
  width: 100%;
}

/********* Cities ***********************/


ul#restaurants,
ul#cities {
  float: left;
  width: 225px;
}

ul#restaurants li,
ul#cities li { 
  font-weight: bold;
  font-size: 1.1em;
  margin-bottom: 5px;
  border-top: 1px solid #FFFFFF;
  padding-top: 5px;
/*  line-height: 1;*/
}


ul#restaurants li.first,
ul#cities li.first {
  border: 0;
  padding-top: 0;
}

/********* Bottom Rounded Corners *******/
/* These get inserted dynamically, as to not bog down the page with non-symantic elements. */
div.bottom_wide {
  clear: both;
  background: url('../images/backgrounds/wide_bottom.gif') bottom left no-repeat;  
}

div.bottom_narrow {
  clear: both;
  background: url('../images/backgrounds/narrow_bottom.gif') bottom left no-repeat;  
}


/********* Footer **********/
#foot {
  margin: 3em 0 3em 0;
  padding-bottom: 10em;
/*  text-align: right;*/
}

#foot a {
  color: #FFF;
  font-weight: normal;
}

#foot ul {
  float: right;
}

#foot ul li.first {
  padding-top: 8px;
  border: 0;
}

#foot ul li {
  float:left;
  color: #FFFFFF;
  font-size: 90%;  
  padding: 0pt 20px;
  border-left: 1px solid #FFFFFF;
}


/********* Home Page *******/
ul#home_options {
  margin-top: 68px;
  clear: both;
}

ul#home_options li {
/*  display:inline;*/
  width: 156px;
  float: left;
  clear: none;
  margin-left: 42px;
}

ul#home_options li#calendar {
  margin-left: 0;
}

ul#home_options li {
  width: 156px;  
  text-align: center;
}

.clearfix:after {
  content:".";
  display:block;
  height:0;
  clear:both;
  visibility:hidden;
}
.clearfix {display:inline-block;}
/* Hide from IE Mac \*/
.clearfix {display:block;}
/* End hide from IE Mac */

div#home_copy {
  padding-top: 50px;
}

.fieldWithErrors {
  display: block;
}

.error_message {
  color: red;
}

.column_1 {
  float: left;
  text-align: justify;
  width: 48%;
  padding-right: 30px;
}

img.reset {
  cursor: pointer;
}

.column_2 {
  text-align: justify;
}

form p span.details {
  display:block;
  font-size:.8em;
 color: #55B7DA;
}  


form#restaurant_form input.checkbox,
input.checkbox {
  width: auto;
}
