body { width:100%; margin:0; padding:0; color:#000; font:80% Arial, "Trebuchet MS", "Lucida Sans Unicode", Tahoma, sans-serif; background:url(../../images/join-bg.png) no-repeat bottom right; background-attachment:fixed; background-color:#FFFFFF; }
img { border:none; }
.reset { clear:both; height:1px; }
a { color: #6699cc; text-decoration:none }
a:hover { text-decoration:underline; }
.logout-msg { float: left; margin: 30px 100px 0px 150px; }
.error { color:#cc0033; }
.tooltip{ background-color:#F5F5B5; border:1px solid #DECA7E; color:#303030; font-family:sans-serif; font-size:12px; line-height:18px; padding:10px 13px; position:absolute; text-align:center; z-index:2; }
.tooltip-link { color:#6699cc; border-bottom:1px dotted #6699cc; }
.rounded2 { -moz-border-radius: 2px; -webkit-border-radius: 2px; }
.rounded3 { -moz-border-radius: 3px; -webkit-border-radius: 3px; }
.rounded5 { -moz-border-radius: 5px; -webkit-border-radius: 5px; }
.rounded6 { -moz-border-radius: 6px; -webkit-border-radius: 6px; }
.rounded8 { -moz-border-radius: 8px; -webkit-border-radius: 8px; }

#header { width:755px; height:50px; padding:8px 0; background:#FFF; margin:0 auto;}
#title { float:left; margin-left:15px; }
#footer { width:100%; max-width: 880px; font: 120% Arial; text-align:center; text-decoration:none; border-top:1px solid #DDD; margin: 0px auto 20px auto; padding: 5px 10px 5px 10px; color:#CCC;}
#footer a { text-decoration:none; color:#cc0033; font-size:12px; margin:0 5px; }
#footer a:hover { color:#777; border-bottom:1px solid #cc0033; }
#contents { width:100%; min-height:340px; margin:0px auto 0px auto; padding:0px 0 60px 0; background:url(../../images/cloud.png) no-repeat; background-position:10px 100px; background-attachment:fixed; }

.join-screens { margin:0 auto; width:755px; }
.join-left { background:url(../../images/join-bg-l.png) repeat-y left; }
.join-right { background:url(../../images/join-bg-r.png) repeat-y right; padding:0 3px; }
.join-bottom { background:url(../../images/join-bg-b.png) repeat-x bottom; padding-bottom:8px; }
.join-contents { background:#FFF; padding:5px 20px 40px 20px; text-align:left; border-top:1px solid #DDD;}
.join-contents ol { width:650px; margin:25px auto 0 auto; }
.join-contents ol li { float:left; padding:10px; text-align:left; word-wrap:break-word; border:1px solid #8EC2DF; }
.join-contents ol.two li { width:45%; }
.join-contents ol.three li { width:28%; }
.join-contents ol li.selected { font-weight:bold; background:#BBDFF4; }
.join-form { margin:0 30px; }
.join-form h1 { font-size:20px; font-family:Arial, Helvetica, sans-serif; color:#777; padding:20px 0 5px 0; font-weight:bold; text-align:center; }
.join-form h2 { font-size:16px; font-family:Arial, Helvetica, sans-serif; color:#777; padding:10px 0 20px 0; font-weight:bold; text-align:center; }
.join-form h3 { font-size:14px; font-family:Arial, Helvetica, sans-serif; color:#333; padding:10px 0 20px 0; text-align:left; }
.join-form p { padding:10px 0; }
.join-form p.focus { background:#EEE; }
.join-form p.desc { color:#6699cc; border-bottom:1px dotted #6699cc; width:88px; float:right; margin-bottom:5px; text-align:right; padding:0px; }
.join-form p.desc:hover { cursor:help; }
.desc-tip { width:300px; }
.join-form .help { float:left; display:block; width:170px; margin-top:7px; padding-left:10px; font-family:Arial, Helvetica, sans-serif; }
.join-form label.tag { font-size:13px; color:#000; font-weight:bold; }
.join-form label.instruction { font-size:12px; color:#777; }
.join-form label.note { margin-left:180px; }
.join-form p input.text { padding:5px; width:200px; font-size:16px; font-weight:bold; font-family:Arial, Helvetica, sans-serif; border:1px solid #CCC; }
.join-form p input.text:focus { border:1px solid #777; }
.join-form p textarea { padding:5px; width:200px; font-size:16px; font-weight:bold; font-family:Arial, Helvetica, sans-serif; border:1px solid #CCC; }
.join-form p textarea:focus { border:1px solid #777; }
.join-form label.msg { margin-left:10px; }
.join-form label.error { margin-left:10px; }
.join-form label.error-msg { margin-left:180px; color:#cc0033; }
.sub-button { padding:5px 10px; font-family:Arial, Helvetica, sans-serif; color:#FFF; background:#88A9E4; border:2px solid #597CB9; }
.join-form .sub-button { float:left; margin:15px 0 0 180px; font-size:20px; cursor:pointer; }
.join-form .sub-button:hover { color:#000; }
.skip-form .sub-button { float:left; margin:15px 0 0 10px; font-size:13px; background:none; border:none; color:#6699cc; padding:0; cursor:pointer; text-decoration:underline; }
.skip-form .sub-button:hover { color:#555; }

#setup-form p textarea { width:230px; }
#setup-form p input.text { width:230px; }
#connect-form { margin:0 40px; }
a.with-tw:hover { text-decoration:none; }
.tw-connect-button { width:160px; padding:5px 10px; background-color:#FFF; margin-bottom:15px; border:1px solid #DDD; }
.tw-connect-button:hover { border:1px solid #999; }
.tw-connect-button img { float:left; margin-right:10px; }
.tw-connect-button label { float:left; font-size:13px; font-weight:bold; text-decoration:none; cursor:pointer; }
#connect-skip-form .skip { margin-left:300px; }
.store-help-tip { width:200px; }
#invite-form { margin:0 50px; }
#invite-list-form { width:500px; margin:0px auto; margin-top:20px; }
#invite-box { width:500px; margin:0px auto; border:1px solid #DDD; }
#invite-list-form #list-hd { background-color:#8EC2DF; color:#000; font-weight:bold; padding:5px 0px; margin:0px auto; }
#invite-list-form #email-list { margin:0 auto; max-height:300px; overflow-y:scroll; }
#invite-list-form .entry { margin:0 auto; padding:5px 0; }
#invite-list-form .user-entry { margin:0 auto; padding:5px 0; }
#invite-list-form .thTableOddRow { background-color:#EEE; }
#invite-list-form .check { margin:0 10px 0 5px; width:10px; float:left; }
#invite-list-form .name { width:250px; float:left; font-size:11px; }
#invite-list-form .email-addr { font-size:11px; width:200px; float:right; font-family:Helvetica, sans-serif; color:#555; }

#invite-list-form #users-list { margin:0 auto; max-height:300px; overflow-y:scroll; }
#invite-list-form .user-entry { margin:0 auto; padding:5px 0; height:40px; }
#invite-list-form .user-entry .check { height:40px; margin-top:10px; }
#invite-list-form .user-entry .user-image { width:40px; height:40px; float:left; }
#invite-list-form .user-entry .name { width:200px; float:left; margin-left:10px; font-size:13px; height:15px; }
#invite-list-form .user-entry .user-from { width:200px; float:left; font-size:11px; margin-top:3px; margin-left:10px; height:12px; color:#555; }

.shadow-left { background:url('../../images/window-br-left.png') left top repeat-y; }
.shadow-right { width:806px; margin:30px auto; background:url('../../images/window-br-right.png') right top repeat-y; }
.shadow-bottom { width:800px; margin:0px 3px; padding-bottom:5px; background:url('../../images/window-br-bottom.png') left bottom repeat-x; }
#forgot { border-top:1px solid #DDD; }
#forgot-content { padding:30px 250px; }
#forgot-content h2 { font-size:18px; font-weight:bold; padding-bottom:20px; }
#forgot-content label { font-size:14px; }
#forgot-content input#email { width:250px; margin:10px 0; padding:10px; font-size:16px; font-family:Arial, Helvetica, sans-serif; font-weight:bold; }
#forgot-content input#frgt-submit { padding:5px 15px; }
#forget-success { padding:30px 50px; }
#forget-success p { font-size:14px; line-height:18px; }
#loginform { border-top:1px solid #DDD; padding:30px 50px; }
#loginform h2 { font-size:18px; font-weight:bold; padding-bottom:20px; }
#loginform input.login-input { width:200px; padding:5px 10px; font-size:13px; font-weight:bold; font-family:Arial, Helvetica, sans-serif; }
#loginform input#login-submit { padding:5px 15px; }
#loginform p { padding:10px 0; }
#login-alt { float:right; width:200px; padding:60px 50px 80px 70px; border-left:1px solid #CCC; }
#login-alt .connect-button { float:right; width:180px; padding:10px 10px; margin-bottom:20px; margin-left:80px; border:1px solid #DDD; background-color:#EEE; text-align:center; color:#555; font-size:13px; font-weight:bold; text-decoration:none; }
#login-alt .connect-button:hover { background-color:#F7F7F7; }
#login-alt #fb-connect-button label { padding-left:18px; background:url(../../images/icon-facebook.png) no-repeat top left; cursor:pointer; }
#login-alt #tw-connect-button label { padding-left:18px; background:url(../../images/twitter.png) no-repeat top left; cursor:pointer; }

#suggested-users input.sub-button { margin-left:300px; margin-top:20px; font-size:18px; cursor:pointer;  }
#suggested-users input.sub-button:hover { color:#000; }
#users-list-small { margin:30px 0; }
#users-list-small h2 { float:left; font-size:18px; font-weight:bold; padding:0 0 10px 10px; margin-bottom:20px; margin-left:10px; }
#users-list-small #refresh-button { float:right; margin-right:30px; padding:5px 10px; color:#FFF; background-color:#6685B8; }
#users-list-small #refresh-button:hover { text-decoration:none; }
#users-list-small li div.list { float:left; width:310px; padding:10px; margin:10px; border-bottom:1px solid #DDD; }
#users-list-small li div.list div.inner { width:180px; float:left; }
#users-list-small li div.list div.inner a { font-weight:bold; font-size:15px; color:#0A569E; }
#users-list-small li div.list div.inner a:hover { color:#A7C4D1; text-decoration:none; }
#users-list-small li div.list div.inner p a { font-size:12px; color:#777; }
#users-list-small li div.list:hover div.inner p a { color:#777;}
#users-list-small li div.list div.inner p a:hover { color:#cc0033; }
#users-list-small li div.list img { float:left; border:none; margin:0 10px 0 0; }
#users-list-small li div.list a:hover img { padding:0; margin:0 10px 0 0; }

.follow-button { float:right; padding:0 7px 2px 0; font-size:12px; font-weight:bold; color:#555; background:#DDD; border:1px solid #DDD; cursor:pointer; }
.follow-button label { padding:1px 5px 2px; margin-right:6px; line-height:16px; font-weight:bold; font-size:14px; border-right:1px solid #FFF; cursor:pointer; }
.follow-button:hover { border-color:#999; }
.follow-button:hover label { border-right-color:#999; }
.unfollow-button { float:right; width:18px; height:18px; color:#555; background:#DDD url(../../images/icons.png) no-repeat 0 -52px; border:1px solid #DDD;  cursor:pointer;}
.unfollow-button:hover { border-color:#999; }
.following-status { float:left; width:80px; height:16px; padding-left:22px; font-size:13px; font-weight:bold; font-family:Verdana; background:url(../../images/icons.png) no-repeat 0 -67px; }
