* { margin: 0; padding: 0; }
img { border: 0; }

/*
    Carnahan Curbside Recycling - http://carnahancurbside.com
    
    by Joshua Works,
    The Complete Works - http://thecompleteworks.org
    
    August 2009
*/

body { background: #F5F4EE url(../images/grain_tan.gif); color: #666; font: 12px/20px "Lucida Grande", Tahoma, Arial, sans-serif; }

a { color: #35434d; text-decoration: none;  }
a:hover { color: #555; text-decoration: underline;  }

h1,h2,h3,h4,h5,h6 { font-weight: normal; }
h1 { font-size: 20px; line-height: 30px; }
h2 { font-size: 32px; line-height: 30px; color: #35434d; }
h3 { font-size: 16px; line-height: 30px; color: #35434d; }
h4 { font-size: 14px; text-transform: uppercase; padding: 3px; color: #35434d; border-bottom: 1px dashed #aaa; margin-bottom: 10px; }
h5 { font-size: 13px; color: #35434d; font-weight: bold; }
h6 { font-size: 12px; }

p { margin-bottom: 10px; }
.sup { font-size: 10px; position: relative; top: -6px; color: #444; }
.footnote { font-size: 10px; color: #444; }

table { border-collapse: collapse; border: 0; width: 100%; clear: both; }
th, td { padding: 5px 10px; text-align: left; vertical-align: top; }
th { text-align: right; }
thead th { text-align: center; padding: 30px 0 0; }
tbody tr { border-top: 1px solid #ddd; }
.submit-row th, .submit-row td { padding: 0 10px; }
th a { color: #C55; line-height: 50px; text-decoration: underline; }

dl { overflow: hidden; }
dt, dd { width: 44%; float: left; border-top: 1px solid #ddd; padding: 4px 2%; }
dt { font-weight: bold; padding-right: 6%; }


/* Layout */
#userbar, #header, #content, #page_content, #page_title, .wrap { overflow: hidden; }
.wrap { width: 900px; margin: 0 auto; }

#page_content { width: 540px; float: left; margin-right: 40px; padding: 10px; background: url(../images/grain_white.gif); }
#page_sidebar { width: 300px; float: left; overflow: hidden; color: #777; }
#page_sidebar h3,
#page_sidebar strong { color: #35434d; }


/* User bar */
#userbar { background: #35434d url(../images/grain_blue_dark.gif); border-bottom: 3px solid #23292e; padding: 10px 0; color: #deddd8; overflow: hidden; }
#userbar a { padding: 4px 8px; text-transform: uppercase; font-size: 10px; margin-right: 5px; font-weight: bold; text-decoration: none; color: #b4c77e; background-color: #222c32; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; }
#userbar a:hover { background-color: #1c2328; }
#userbar span { font-weight: bold; padding-right: 15px; }

#userbar .global-links { float: left; }
#userbar .user-links { float: right; text-align: right; }
#userbar .user-links a { color: #deddd8; }
#userbar .user-links a#signout { background-color: #C22; color: #deddd8; }


/* Header */
#header { padding: 30px 0; }
#header h1 a { display: block; float: left; text-indent: -9999px; background: url(../images/logo.gif) no-repeat center center; width: 400px; height: 140px; }

#page_intro { float: right; width: 430px; padding: 25px 0 0; font: 17px/26px Georgia, serif; }
#page_intro a, #page_intro span { font-weight: bold; padding: 0 5px; }


/* Page title */
#page_title { padding: 5px 0 5px; margin-bottom: 30px; border-top: 1px dashed #c2c1bd; border-bottom: 1px dashed #c2c1bd; background: #fff url(../images/grain_white.gif); }
#page_title p { font-weight: bold; color: #C55; line-height: 60px; margin: 0; }

h2.title { float: left; width: 100%; background-position: left center; background-repeat: no-repeat; text-indent: -9999px; line-height: 60px; }
h2.thanks-welcome { background-image: url(../images/headers/thanks-and-welcome.gif); }
h2.sign-up { background-image: url(../images/headers/sign-up.gif); }
h2.confirm-details { background-image: url(../images/headers/confirm-details.gif); }
h2.account-dashboard { background-image: url(../images/headers/account-dashboard.gif); }
h2.create-your-account { background-image: url(../images/headers/create-your-account.gif); }
h2.edit-your-details { background-image: url(../images/headers/edit-your-details.gif); }
h2.happy-trails { background-image: url(../images/headers/happy-trails.gif); width: 280px; }
h2.please-sign-in { background-image: url(../images/headers/please-sign-in.gif); }
h2.contact-us { background-image: url(../images/headers/contact-us.gif); }
h2.thanks-message { background-image: url(../images/headers/thanks-message.gif); }
h2.recycling-guide { background-image: url(../images/headers/recycling-guide.gif); }
h2.reset-your-password { background-image: url(../images/headers/reset-your-password.gif); width: 440px; }
h2.page-not-found { background-image: url(../images/headers/page-not-found.gif); }
h2.whoops { background-image: url(../images/headers/whoops.gif); }

/* Messages */
#messages { text-align: center; font-weight: bold; margin-bottom: 30px; }
#messages li { list-style: none; background-color: #C55; color: #FFF; padding: 6px 8px; margin-bottom: 10px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; border: 1px dashed #DDD; }


/* Section titles */
.section-title { border-top: 2px solid #c2c1bd; position: relative; text-align: center; font-weight: normal; margin: 10px 0 -12px; text-transform: uppercase; }
.section-title a,
.section-title span { position: relative; top: -17px; background: url(../images/grain_white.gif); color: #495637; padding: 5px 15px; text-decoration: none; }
#page_sidebar .section-title a,
#page_sidebar .section-title span { background: url(../images/grain_tan.gif); }


/* INDIVIDUAL page styles */
/* Sign up page (.signup) */
#signup_form tbody th { white-space: nowrap; padding-left: 30px; }
#only_pickup_day { line-height: 30px; font-size: 13px; font-weight: bold; margin: 0; }
.signup #page_sidebar { background: url(../images/recycle.gif) no-repeat center 30px; padding-top: 250px; }


/* Confirm details page */
.confirm #page_content p { text-align: center; font-size: 13px; color: #35434d; }
.confirm #page_content p.total { color: #27A; margin: 10px 0; font-size: 14px; font-weight: bold; }
.confirm table { margin-top: 20px; }
.confirm form { margin-top: 10px; }
.confirm #page_sidebar img { width: 290px; border: 5px solid #ddd; margin: 5px 0 10px 0; }
.confirm #page_sidebar p { font-size: 11px; }


/* New success */
.success .intro { font-size: 16px; line-height: 24px; margin-bottom: 30px; }
.success #page_content { width: 400px; background-color: #CCC; }
.success #page_sidebar { width: 440px; }
.success #page_sidebar th p { margin: -25px 0 15px; color: #27A; text-align: left; }
.success #page_sidebar form { background: url(../images/grain_white.gif); padding: 20px 20px 0; }
.success #page_sidebar span { background: url(../images/grain_white.gif); }

#receipt { border: 1px dashed #35434d; background: #FFF; color: #35434d; padding: 20px; font-family: monospace; font-size: 13px; }
#receipt p { text-align: center; margin-bottom: 20px; }
#receipt .receipt-title { font-size: 14px; }
#receipt p a { font-weight: bold; }
#receipt table { margin-top: 10px; }
#receipt th { text-align: left; vertical-align: top; }


/* Sign in */
.signin #page_title h2 { float: left; width: 270px; }
.signin form li { float: left; list-style: none; }
.signin #id_username,
.signin #id_password { font-size: 28px; font-family: Georgia, serif; padding: 2px 5px; color: #555; margin: 12px 15px 0 0; width: 195px; border: 1px solid #ddd; }
.signin .image_submit { margin-top: 14px; }
.signin .errorlist { position: relative; top: 4px; left: 5px; }

/* Dashboard */
#account_status { text-align: center; background-color: #C22; color: #FFF; padding: 10px 0; margin-bottom: 30px; }
#account_status p { margin: 0; }

.header_row { border: 0; }
.header_row th { padding: 0 0 10px; }
.header_row a,
.header_row span { display: block; background-color: #35434d; color: #FFF; line-height: 30px; text-align: left; padding: 0 10px; font-weight: bold; }
.header_row a { background-color: #495637; text-align: center; text-decoration: none; }
.header_row a:hover { background-color: #35434d; }

#your_stats { margin-top: 10px; }
#transaction_history { margin: 20px 0; }
#transaction_history th { text-align: left; }
#show_more_dates { color: #c55; font-size: 11px; }

#referrals_table { margin: 20px 0 0; }
#referrals_table .header_row th { padding: 0; text-align: left; }
#referrals_table th { text-align: left; font-weight: normal; }
#referrals_earned th { background: url(../images/grain_blue.gif); font-weight: normal; color: #35434d; font-size: 11px; text-align: center; }
#referrals_earned strong { display: block; font-size: 12px; }

#cancel_your_account { color: #c22; font-weight: bold; padding-left: 10px; }



/* Contact form */
label { white-space: nowrap; }

/* Guide */
.material { padding: 0 0 0 90px; margin-bottom: 30px; background-repeat: no-repeat; }
.material div { padding: 20px 20px 1px 20px; background: #fff; }
.material p { color: #222; font-size: 11px; margin-bottom: 15px; }
.material p strong { color: #35434d; font-size: 13px; text-align: center; line-height: 18px; display: block; float: left; text-transform: uppercase; margin-right: 3px; }
.material p strong.tips { color: #C22; margin-right: 10px; }

.newspaper { background-image: url(../images/recyclables_newspaper.jpg); }
.plastic { background-image: url(../images/recyclables_plastic.jpg); }
.metal { background-image: url(../images/recyclables_metal.jpg); }
.glass { background-image: url(../images/recyclables_glass.jpg); }

.guide #page_sidebar { background: url(../images/recycle.gif) no-repeat center 20px; padding-top: 260px; }

/* Error pages */
.error_page #content ul { margin: 1em 0; }
.error_page #content ul li { margin-left: 40px; }
.error_page #content ul li a { text-decoration: underline; }
.error_page #page_sidebar { background: url(../images/recycle.gif) no-repeat center 30px; padding-top: 250px; }





/* Forms */
p.error { background: #C55; color: #FFF; padding: 5px; font-weight: bold; text-align: center; }
label { font-size: 11px; line-height: 30px; font-family: Verdana, Tahoma, sans-serif; cursor: pointer; }
input,
textarea,
select { font-size: 14px; color: #666; border: 1px solid #ccc; padding: 5px 2%; width: 96%; }
select { height: 30px; width: 100%; padding: 0 4px; background-image: url(../images/select_arrow.png); background-repeat: no-repeat; background-position: right center; -khtml-appearance: none; -webkit-border-radius: 0; }
.confirm form input { width: auto; border: 0; padding: 0; }
input.image_submit { width: auto; border: 0; padding: 0; margin: 10px 0 0; }
form li { list-style: none; }
form li label { line-height: 16px; }
form li input { width: auto; border: 0; }
.help_text { font-size: 11px; color: #999; line-height: 16px; padding: 2px 2px 0; margin: 0; }
.help_text.hello { color: #35434d; }
.errorlist { font-size: 11px; color: #C55; line-height: 16px; font-weight: bold; padding: 2px 2px 0; }


#copyright { text-align: center; font-weight: bold; clear: both; padding: 30px 0 20px; }
