body
{
  margin:0 0 20px 14px;
  padding:0;
  background-color:#E7EDF8;
  font-family: "Lucida Grande", "Lucida Sans", "Lucida", arial, helvetica, sans-serif;
  color:333;
  font-size: 0.9em;
  text-align: left;
}
#firefly
{
	position:absolute;
	top:10px;
	left:500px;
}
input, textarea
{
  font-family: "Lucida Grande", "Lucida Sans", "Lucida", arial, helvetica, sans-serif;
  font-size: 1em;
}
a {
    color: #242424;
}

a.important
{
  color: #DD4245 !important;
  margin-right:2em !important;
}
.min_height {
    float:right;
    height:250px;
    width:1px;
}
form {
    margin:0;
    padding:0;
}

#loading {
    z-index:1;
    position:absolute;
    left:253px;
    top:25px;
}

.sign_up
{
  padding-top:1em;
}
.sign_up td
{
  padding:0 10px 10px 0;
}
.sign_up input
{
  width:250px;
}
#header h1, #header_login h1 {
    width:470px;
    height:95px;
    text-indent: -9999px;
    background-image: url(../images/i_logo.png);
    background-repeat: no-repeat;
    margin:0;
    padding:0;
}

#header_login h1 {
    background-image: url(../images/i_logo_tell_me_more.png);
    margin:0 0 9px 0;
}

#first_ad_block
{
  margin-bottom:9px;
  margin-left: -3px;
  width:470px;
}

#amazon_results_container
{
  width:200px;
  float:right;
}

#amazon_results_logo
{
  background-image:url(../images/advert.gif);
  height:11px;
  width:200px;
  margin-right:-1px;
  padding:0;
  margin:0;
}

#amazon_results
{
  background-color:#F9F3F8;
  background-repeat: no-repeat;
  background-position: bottom right;
  width: 198px;
  border-collapse: collapse;
  border:1px solid white;
  border-style: solid solid none solid;
}
#amazon_results .product
{
  font-size: 10px;
  padding: 3px;
  width: 220px;
}
#amazon_results td
{
  padding:1px;
}

#amazon_results .product img
{
  padding-right: 2px;
}
#amazon_results a
{
  text-decoration:none;
  color: #828682;
}
#amazon_results a:hover
{
  color:#000;
}


#last_ad_block
{
  margin-top:9px;
  margin-left: -3px;
}

a#b_loginout {
    position:absolute;
    display: block;
    left:400px;
    top:45px;
    width:68px;
    height:26px;
    text-indent: -9999px;
}

a#b_tell_me_more
{
  position:absolute;
  display: block;
  left:310px;
  top:43px;
  width:155px;
  height:26px;
  color:#fff;
  text-indent: -9999px;
}

#bg_t_content, #bg_t_menu_content {
    width:470px;
    background-image: url(../images/bg_t_content.png);
    background-repeat: no-repeat;
    background-position: left top;
    height:17px;
}
#bg_t_menu_content {height:35px}
#bg_b_content {
    width:470px;
    background-image: url(../images/bg_b_content.png);
    background-repeat: no-repeat;
    background-position: left bottom;
    margin-top:15px;
    height:17px;
}
#bg_m_content {
    width:470px;
    background-image: url(../images/bg_m_content.png);
    background-repeat: repeat-y;
    background-color:#FFF;
}
#content
{
  margin:8px 26px 9px 26px;
  clear:both;
  padding-top:1px;
}

#tip_of_the_day
{
  margin-top: 15px;
  padding: 6px 6px 6px 120px;
  font-size: .75em;
  background-color:#FFFFCC;
  border: 2px solid #FFCC00;
}

#tip_of_the_day span
{
  background-image: url(../images/i_tip_info.png);
  background-repeat: no-repeat;
  padding-left: 23px;
  margin-left: -114px;
  color:#DFB84E;
  font-weight: bold;
  padding-bottom:4px;
}

#tip_of_the_day a
{
  float:right;
  padding-left: 2em;
}

/*****************************************
VERIFY
*****************************************/

small {
    font-size:.75em;
    color:#666;
}

.light {
    color:#CCCCCE;
}

table#login {
    border:none;
}

table#login a {
    color: #03C;
}
table#login td {
    padding:0 0 9px 0;
    border:none;
}

table#login .label {
    font-size:1em;
    width:80px;
    display:block;
}

.error {
    margin-bottom: 20px;
}

.error h2 {
    color: #CC3333 !important;
}

.error p, div.formError {
    background-color: #CC3333;
    padding: 6px 9px 6px 9px;
    line-height:170%;
    color: #fff;
    font-size:.75em;
    font-weight: bold;
}



/************************************************
DROP DOWN MENUS

in IE when you define some block to be
position:relative this will not set the
coordinate system for its child elements,
so z-index has to be set manually

menu_1 is the left dropdown
menu 2 is the right dropdown
menu 3 is the tooldrawer dropdown

************************************************/


ul.menu {
  margin:0;
  padding:0;
  list-style:none;
}
li#menu_1,
li#menu_2
{
    position: relative;
    z-index:400;
}
li#menu_3
{
  position: relative;
  z-index:500;
  background-image: url(../images/h_bg_menu_3.png);
  background-repeat: no-repeat;
  width: 281px;
  height: 49px;
  line-height:0;
}

li#menu_1,
li#menu_2
{
  float: left;
}

li#menu_1 ul,
li#menu_2 ul,
li#menu_3 ul
{
    display:none;
    margin:0;
    padding:0;
    left:0;
    position:absolute;
    list-style:none;
    z-index:400;
}

li#menu_1 ul
{
    background-color:#EAEAEA;
    background-image: url(../images/bg_menu_1.png);
    background-repeat: repeat-y;
    top:33px;
    width:230px;
}

li#menu_2 ul
{
    background-color:#EAEAEA;
    background-image: url(../images/bg_menu_2.png);
    background-repeat: repeat-y;
    top:33px;
    width:240px;
}

li#menu_3 ul
{
  background-color:#242424;
  background-image: url(../images/bg_menu_3.png);
  background-repeat: repeat-x;
  background-position: left bottom;
  width:279px;
  top:49px;
  padding-top:1em;
  opacity: .95;
  filter: alpha(opacity=95);
}

li#menu_1.over ul,
li#menu_2.over ul,
li#menu_3.over ul
{
  display:block;
  z-index:400;
}

li#menu_1 ul li,
li#menu_2 ul li,
li#menu_3 ul li
{
  padding:0;
  margin:0;
  display:inline;
  z-index:400;
}

li#menu_1 ul li.divider,
li#menu_2 ul li.divider,
li#menu_3 ul li.divider,
li#menu_3 ul li.divider_last
{
  display:block;
  z-index:400;
}

li#menu_1 ul li.divider,
li#menu_2 ul li.divider
{
  background-image: url(../images/bg_m_1_dvdr.png);
  background-repeat: no-repeat;
  background-position: left bottom;
  height:9px;
}
li#menu_2 ul li.divider
{
  background-image: url(../images/bg_m_2_dvdr.png) !important;
}
li#menu_3 ul li.divider,
li#menu_3 ul li.divider_last
{
  background-image: url(../images/bg_td_dvdr.png);
  background-repeat: repeat-x;
  background-position: left bottom;
  height:2px;
}

li#menu_3 ul li.divider
{
  padding: 1em 0 0 0;
  margin: 0 0 1em 0;
}

li#menu_3 ul li.divider_last
{
  padding: 1em 0 0 0;
  margin: 0;
}

#menu_1 a,
#menu_2 a,
#menu_3 a
{
  font-family: "Lucida Sans", "Lucida", arial, helvetica, sans-serif;
  text-decoration:none;
  background-repeat: no-repeat;
  background-position: left center;
  padding: 8px 0 8px 33px;
  margin: 0 0 0 21px;
  display: block;
  z-index:400;
}
#h_menu_3
{
  font-family: "Lucida Sans", "Lucida", arial, helvetica, sans-serif;
  text-decoration:none;
  padding: 18px 0 18px 33px;
  margin: 0 0 0 21px;
  z-index:400;
  background-repeat: no-repeat;
  background-position: left center;
  font-size:1.2em;
  cursor: default;
  line-height: 100%;
}
#menu_1 a,
#menu_2 a
{
  font-size:.8em;
}
#menu_3 a
{
  color:#FFF;
  font-size:1.2em;
  line-height:150%;
}

#menu_1 a:hover,
#menu_2 a:hover,
#menu_3 a:hover
{
  text-decoration:underline;
}

#menu_1_add      a {background-image: url(../images/i_add.png)}
#menu_1_delete   a {background-image: url(../images/i_delete.png)}
#menu_1_print    a {background-image: url(../images/i_print.png)}
#menu_1_import   a {background-image: url(../images/i_import.png)}
#menu_1_export   a {background-image: url(../images/i_export.png)}

#menu_2_categories       a {background-image: url(../images/i_categories.png)}
#menu_2_priority         a {background-image: url(../images/i_priority.png)}
#menu_2_interestingness  a {background-image: url(../images/i_interestingness.png)}
#menu_2_due_by           a {background-image: url(../images/i_due_by.png)}
#menu_2_completed        a {background-image: url(../images/i_completed.png)}

#menu_3_prefs  a,
.h_menu_prefs
{background-image: url(../images/i_td_prefs.gif)}

#menu_3_invite a,
.h_menu_invite
{background-image: url(../images/i_td_invite.gif)}

#menu_3_cat a,
.h_menu_cat
{background-image: url(../images/i_td_cat.gif)}





/***************************************************
INLINE ADD
***************************************************/

.inline_form select,
.inline_form input
{
  margin: 0 !important;
  padding: 0 !important;
  font-size: 10px;
}
.inline_form input
{
  width: 60px;
}
.inline_form label
{
  margin: 0 !important;
  padding: 0 !important;
  font-size: 9px;
  font-weight: bold;
}

#b_add_task
{
  background-color: #F9F9F9;
  border: 2px solid #DFDFDF;
  background-image: url(../images/b_add_task_inline.png);
  background-repeat: no-repeat;
  padding: 8px 10px 8px 30px;
  font-size: 12px;
  text-decoration: none;
}

#inline_add_anchor
{
  /* position: absolute; */
  clear:both;
  z-index:30;
  background:#fff;
  margin: 0 5px 0 5px;
  width: 460px;
}

#inline_add
{
  /* position:relative; */
  padding: 1em;
  background-repeat: repeat-x;
  background-position: left bottom;
  background-image: url(../images/bg_inline_add.png);
  z-index:30;
}
#inline_add form
{
  padding-bottom:0.5em;
}

#inline_add label
{
  font-size: 10px;
  padding-right: 1.5em;
}

hr
{
  border:0;
  color: #E0E0E0;
  background-color: #E0E0E0;
  height: 1px;
  margin: 1.5em 0 1.5em 0;
}

#inline_add a
{
  color: #DD4245;
}


#inline_edit_anchor
{
  position: absolute;
  z-index:30;
  background:#fff;
  margin: 33px 5px 0 5px;
  width: 460px;
}

.inline_edit
{
  font-weight: normal !important;
  position:relative;
  padding: 1em;
  background-color: #F9F9F9;
  z-index:30;
}
.inline_edit form
{
  padding-bottom:0.5em;
}

.inline_edit textarea
{
  width: 374px;
}

.inline_edit hr
{
  border:0;
  color: #E0E0E0;
  background-color: #E0E0E0;
  height: 1px;
  margin: 0.5em 0 0.5em 0;
}

.inline_edit a
{
  color: #DD4245;
}




/***************************************************
TASKS
***************************************************/
#task_list_heading {
    padding: 1em 0 1em 0;
}

#task_list_heading h1 {
    display: inline;
}

ul#task_list {
    padding:0;
    margin:1em -10px 0 0;
    list-style-type:none;
    border-top:1px solid #DDD;
    width:400px;
}

ul#task_list li {
    margin:0;
    padding:0;
    background:#FFF;
    z-index:10;
    font-weight: bold;
    font-size:.75em;
    border-bottom:1px solid #DDD;
    width:400px;
    clear:left;
}
div.handle_t {
    cursor: move;
    margin-right: 4px;
    background-repeat: no-repeat;
    background-position: left top;
    background-image: url(../images/i_t_handle.gif);
    float:left;
}
div.handle_b {
    background-repeat: no-repeat;
    background-position: left bottom;
    background-image: url(../images/i_b_handle.gif);
    width:16px;
    height:20px;
}
div.v_stretch {
    padding:3px 4px 3px 0px;
    float:left;
    width:376px;
}
li.task_sub_heading
{
  font-size:13px !important;
  padding: 30px 0 10px 0 !important;
}
.task_text {
    margin-top:3px;
    cursor: hand;
    cursor: pointer;
    width:322px;
    overflow-x:auto;
}
* html .task_text {
    margin-top:6px;
}
ul#task_list .task_button {
    float:right;
    cursor: hand;
    cursor: pointer;
}
ul#task_list .task_button_dvdr {
    float:right;
    border-left:1px solid #DEDEDE;
    width:4px;
    margin-left:6px;
    margin-top:2px;
    height:16px;

}
 ul#task_list input, ul#task_list .in_place_editor_field {
    cursor: hand;
    cursor: pointer;
}

.complete {
    color: #ADADAD !important;
    font-weight: normal !important;
}

a.b_trash {
    background-repeat: no-repeat;
    background-position: center center;
    background-image: url(../images/i_trash.png);
    color:#FFF;
    font-size:1px;
    width:20px;
    height:20px;
    display:block;
}

a.b_trash:hover {background-image: url(../images/i_trash_over.png)}


/**********************************
IN PLACE EDITOR
**********************************/

span.in_place_editor_field {
    cursor: hand;
    cursor: pointer;
}
.editor_field, .editor_ok_button, .editor_cancel {
    font-size: 11px;
    border: 1px solid #D1D4DA;
    background:#E3E5E9;
    margin:0 2px 0 2px;
    color:#000;
    text-decoration:none;
}

.editor_field {
    width:200px;
}

.editor_cancel {
    padding: 1px 1em 1px 1em;
}

.editor_cancel:hover {
    background: #E3E5E9;
    cursor: default;
}






/***************************************************
HEADING TEXT ELEMENTS
***************************************************/

h1 {
    margin: 0;
    padding: 15px 0 0 0;
    font-size: 1.25em;
    font-weight: bold;
    color: #242424;
}

h2 {
    color:#00ABCD;
    font-weight:normal;
    font-size:1.1em;
    margin: 0 0 16px 0;
}

h3 {
    margin: 0px 0px 7px 0px;
    padding: 0px 0px 9px 0px;
    font-size: 100%;
    font-weight: bold;
    line-height:1.3em;
    color: #5A5A5A;


}

h4,h5,h6 {
    margin: 0px 0px 5px 0px;
    padding: 0px 0px 5px 0px;
    font-size: 90%;
    font-weight: bold;
    line-height:1.3em;
    color: #8B8A8A;
}

.red    {color: #DD4245}
.blue   {color: #00ABCD}
.orange {color: #CD8200}
.green  {color: #4EC400}
.yellow {color: #E4D317}
.purple {color: #8200CD}
.violet {color: #CD00B7}

.access_key
{
  text-decoration: underline;
}

/****************************************
   TOOL DRAWER
****************************************/

#tooldrawer_anchor
{
  position: absolute;
  z-index: 500;
}


#tooldrawer
{
  position:absolute;
  left:480px;
  top:100px;
  width:282px;
  background-image: url(../images/bg_m_toold.png);
  background-repeat: repeat-y;
  color:#fff;
  font-size:.75em;
}

#tooldrawer h2
{
  font-weight: bold;
}
#tooldrawer h3
{
  color: #FFF;
  margin-bottom: 0;
}
#tooldrawer .dvdr
{
  border-bottom: 1px solid #333;
  margin: 1.5em 0 1.5em 0;
}
#tooldrawer input, #tooldrawer textarea
{
  width:226px;
  display:block;
  margin:1em 0 1em 0;
}
#tooldrawer input.password
{
  width: 150px;
}
#tooldrawer input.submit
{
  width: auto;
}

#tooldrawer div.formError
{
  margin: -1em 0 1em 0;
  padding: 3px;
  font-size: 1em;
  width: 226px;
}
#tooldrawer_result
{
  background-color: #EEE;
  border: 4px solid #CCC;
  color: #666;
  margin: 1.5em 0 1.5em 0;
  padding: 10px 5px 10px 5px;
}
#tooldrawer_result h3
{
  border-bottom: 1px solid #CCC;
  color: #666 !important;
  margin: 0 0 .5em 0;
  padding: 0 0 .5em 0;
}

#bg_t_tooldrawer
{
  background-image: url(../images/bg_t_toold.png);
  background-repeat: no-repeat;
  background-position: left top;

}

#bg_b_tooldrawer
{
  clear:right;
  background-image: url(../images/bg_b_toold.png);
  background-repeat: no-repeat;
  background-position: left bottom;
  height: 34px;
}
#tooldrawer_opener
{
  position:absolute;
  z-index:888;
  left:480px;
  top:250px;
}
#tooldrawer_closer
{
  position:absolute;
  z-index:888;
  left:760px;
  top:206px;
}

/****************************************
   INVITE A FRIEND
****************************************/

#invite_a_friend
{
  padding: 15px 22px 0 22px;
}

input#submit_invite {width:auto}

/*************************************************
   PREFERENCES
*************************************************/

#prefs_form
{
  margin: 2em 22px 0 22px
}

input#submit_prefs {width:auto}

/*************************************************
   CATEGORIES & TASKOMATIC
*************************************************/


#categories
{
  padding-top:15px;
  margin: 0 0 0 30px;
  height:280px;
/*  overflow:auto !important; */
  overflow:auto;
}
.taskomatic_container
{
  height:380px !important;
  overflow: hidden !important;
  padding: 0 !important;
}
* html #categories
{
  width:248px;
  overflow-x:hidden;
  position:relative;
}

.folder
{
  margin-bottom:20px;
  margin-right:20px;
  margin-left:-5px;
  width: 200px;
  float:left;
  background-repeat: no-repeat;
  cursor: hand;
  cursor: pointer;
  overflow:hidden;
}
div.taskomatic_container .folder
{
  cursor: default !important;
}
div.folder div.loading
{
  margin-left:5px;
}

.folder_label
{
  text-align:center;
  font-size:1.25em;
  margin:0;
  padding:0;
  white-space: nowrap;
}

.folder_label_active
{
  background: #EEE;
  color: #000;
}

.folder_label_count
{
  border: 1px solid #575757;
  font-weight: bold;
  float:right;
  background:#000;
  padding:2px;
  position:relative;
  z-index:1000;
  margin-top:-20px;
  margin-left:-10px;
}


#add_category
{
  padding: 20px 19px 20px 22px;
  margin-right: 3px; /* Margin allows for parents bg image which has 3px worth of drop shadow */
  background: #242424;
}

#edit_category_container
{
  position:relative;
}

#edit_category
{
  position:absolute;
  top:-250px;
  left: 1px;
  padding: 5px 0 0 15px;
  background-image: url(../images/bg_cat_edit.gif);
  width:244px;
  height:164px;
  z-index:5000;
}

#edit_category .dvdr
{
  border-color:#575757;
  margin: 0px 0 10px 0;
}

#add_category a, #categories a, #edit_category a
{
  color:#DC4245;
}

.tag
{
  background-repeat: no-repeat;
  background-position:bottom right;
  padding-bottom: 16px;
  width:20px !important;
  float:left;
}

.blue_tag   { background-image: url(../images/tag_blue.png) }
.red_tag    { background-image: url(../images/tag_red.png) }
.purple_tag { background-image: url(../images/tag_purple.png) }
.green_tag  { background-image: url(../images/tag_green.png) }
.orange_tag { background-image: url(../images/tag_orange.png) }
.violet_tag { background-image: url(../images/tag_violet.png) }
.yellow_tag { background-image: url(../images/tag_yellow.png) }
/* In IE, the last one cannot have float:left or IE has a tanty */
* html .yellow_tag { float:none }

.tag input { width:20px !important }


input#submit_add_folder,input#submit_edit_folder
{
  width:auto;
  display:inline;
  margin:0 0.5em 0 0;
}

.clickable
{
  cursor: hand;
  cursor: pointer;
}

#cat_controls
{
  clear:both;
}

#cat_controls img
{
  float:left;
}

#cat_track
{
  width: 183px;
  height:45px;
  background-image: url(../images/cat_track.png);
  float:left;
}

#cat_handle
{
  width: 15px;
  height: 45px;
  background-image: url(../images/cat_handle.png);
}

form#cat_delete
{
  display:inline;
  float:left;
}
form#cat_delete input
{
  width:auto;
  margin:0;
  padding:0;
}

div.loading
{
  padding: 4px !important;
  width: 6em;
  z-index:9999;
  position: absolute;
}