/* Layout ---------- */

body { background: #FFFFFF url('/images/bg.png'); }

#wrapper { margin: 70px auto 0px auto; width: 700px; background: url('/images/wrapper.png') repeat 0px -20px; padding: 20px 40px; position: relative; }

#header { height: 60px; overflow: hidden; }
#header .left { float: left; width: 499px; color: #FFFFFF; font-size: 16px; }
#header .left h1 { margin: 0px; padding: 0px; float: left; }
#header .left h2 { float: left; margin: 12px 0px 0px 20px; padding: 0px; width: 336px; color: #666666; font-weight: normal; font-size: 14px; }
#header .left h1 a { background: url('/images/sprite.png'); display: block; padding-top: 70px; width: 143px; overflow: hidden; }
#header .left h1 a:hover { background-position: 0px -60px; }

#stamp { background: url('/images/sprite.png') 0px -121px; padding-top: 103px; height: 0px; overflow: hidden; width: 102px; overflow: hidden; position: absolute; top: -50px; right: -50px; }
#scissors { background: url('/images/sprite.png') -247px -84px; width: 24px; height: 27px; position: absolute; bottom: -16px; right: 196px; }

#content { float: left; padding: 20px 20px 20px 0px; width: 500px; }

#sidebar { float: right; padding: 20px 0px 20px 0px; width: 150px; }

#sidebar .item { background: url('/images/stars.png') no-repeat center top; padding: 30px 0px 14px; text-align: center; }
#sidebar .item a#feedback { background: url('/images/sprite.png') -280px 0px; display: inline-block; width: 137px; padding-top: 66px; height: 0px; overflow: hidden; }
#sidebar .item a:hover#feedback { background-position: -280px -67px; }
#sidebar .item a#twitter { background: url('/images/sprite.png') -144px 0px; display: inline-block; width: 136px; padding-top: 39px; height: 0px; overflow: hidden; }
#sidebar .item a:hover#twitter { background-position: -144px -39px; }

#sidebar .stars { height: 16px; background: url('/images/stars.png') no-repeat center top; padding: 0px 0px 14px; }

#sidebar .item.error { background: #ffd4d4; border: 1px solid #fe5a5a; list-style: none; margin: 0px; padding: 0px; }
#sidebar .item.error li { border-bottom: 1px dotted #fe5a5a; padding: 5px 10px; }
#sidebar .item.error li:last-child { border-bottom: 0px; }

#footer { clear: both; color: #666666; font-size: 12px; line-height: 14px; margin: 0px auto 20px auto; padding: 10px 0px; overflow: hidden; width: 730px; }

/* Typography ------ */

body { color: #333333; font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; font-size: 13px; font-style: normal; font-weight: normal; letter-spacing: normal; line-height: 1.45em; }
h1 {  }
h2 { color: #a0bd30; font-size: 16px; margin: 0px 0px 0px 0px; }
h2 + p { margin-top: 10px; }
h3 { color: #333333; font-size: 16px; margin: 0px 0px 0px 0px; clear: both; font-weight: normal; }

h3 span { font-weight: bold; font-size: 20px; }

a { text-decoration: none; color: #a0bd30; }
a:hover { color: #5e7210; }

/* Helpers --------- */

.clear { clear: both; }
.left { float: left; }
.right { float: right; }

img { border: none; }

/* Forms ----------- */

form { margin: 0px; padding: 0px; }

.form { }

.form p,
.form .p { clear: both; margin: 0px 0px 20px 0px; overflow: hidden; }
.form p:last-child { margin: 0px; }

.form label { color: #666666; float: left; margin: 5px 20px 0px 0px; width: 90px; text-align: left; font-weight: bold; }

input[type="radio"] + label,
input[type="checkbox"] + label { float: none; width: auto; font-weight: normal; color: #333333; margin-top: 0px; }

.form input[type="text"],
.form input[type="password"],
.form textarea,
.form select { background: #FFFFFF; border: 1px solid #cccccc; float: left; padding: 7px; width: 374px; font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; font-size: 13px; }

.form select { width: 390px; }

.form input[type="text"]:focus, 
.form input[type="password"]:focus,
.form textarea:focus { border: 1px solid #a0bd30; }

.form select.time { padding: 7px 7px 6px 7px; width: 75px; }
.form input[type="text"].time { margin-right: 10px; width: 76px; }

.form input[type="radio"],
.form input[type="checkbox"] { margin: 8px 5px 0px 0px; }

.form .error { border-color: #D69999 !important; background-color: #FAF2F2; }

.form p.radio { float: left; margin: -18px 0px 20px 110px; }
.form .grey { color: #666666; font-style: italic; }

.error { background: #FAF2F2; border: 1px solid #D69999; border-left: 0px; border-right: 0px; color: #C26666; margin-bottom: 10px; padding: 10px; }
.error h3 { color: #900; }
.error a { color: #900; text-decoration: underline; }

.stages { list-style: none; margin: 10px 0px 20px; padding: 0px; height: 20px; background: url('/images/stages.png'); }
.stages li { float: left; background: url('/images/stages.png') 0px -40px; width: 20px; height: 20px; font-size: 11px; color: #666666; text-align: center; line-height: 20px;  }
.stages li.selected a { display: block; background: url('/images/stages.png') 0px -60px; width: 20px; height: 20px; font-size: 11px; color: #FFFFFF; text-align: center; line-height: 20px; }
.stages li.line { width: 220px; background-position: 0px 0px; }
.stages li.line.selected { background-position: 0px -20px; }

a.btn { background: url('/images/button.png') no-repeat; height: 32px; padding-left: 12px; display: block; overflow: hidden; float: right; clear: both; }
a.btn span { background: url('/images/button.png') no-repeat right 0px; height: 32px; display: block; padding: 6px 38px 6px 0px; font-weight: bold; text-transform: uppercase; color: #FFFFFF; font-size: 12px; cursor: pointer; }
a:hover.btn { background-position: 0px -32px; }
a:hover.btn span { background-position: right -32px; }

#map { border: 5px solid #cccccc; }


#create_event { width: 138px; }

.calendar { background: url('/images/trans_90.png'); color: #FFFFFF; margin-top: 31px; padding: 10px; }
.calendar td { cursor: pointer; padding: 0px 4px; text-align: center; }
.calendar td.title { padding: 0px; text-align: left; font-weight: bold; }
.calendar td.today { background: #666666; -moz-border-radius: 3px; -webkit-border-radius: 3px; }
.calendar td.selected { background: #a0bd30; -moz-border-radius: 3px; -webkit-border-radius: 3px; }
.calendar td.otherDay { font-style: italic; color: #666666; }
.calendar .button { cursor: pointer; background: #666666; -moz-border-radius: 3px; -webkit-border-radius: 3px; }

#map_canvas { margin-bottom: 20px; }

.attending { margin: 20px 0px 10px 0px; padding: 0px; list-style: none; overflow: hidden; }
.attending li { background: url('/images/sprite.png') no-repeat -280px -143px; margin: 0px 10px 10px 0px; padding: 0px 0px 0px 30px; overflow: hidden; float: left; width: 215px; }
.attending li.last { margin-right: 0px; }
.attending li img { float: left; width: 26px; height: 26px; overflow: hidden; }
.attending li .empty_image { float: left; border: 1px solid #DCDCDC; width: 24px; height: 24px; width: 178px; }
.attending li p { float: left; margin: 2px 0px 0px 10px; }

.attending li .update_status { clear: left; overflow: hidden; }
.attending li .update_status p { margin: 5px 0px 0px 0px; }

