/* ===================================*/
/* Copyright (c) 2006-2007 Pluron, Inc.
/* Acunote
/* Main stylesheet
/* ===================================*/

/**************************************/
/*    Common Rules
/**************************************/

body, h1, h2, h3, p, ul, ol, li, dl, dt, dd, form, img { margin: 0;    border: 0; padding: 0; }

/* adding persistent scrollbar for Gleb's joy */
html {
    overflow-x: auto;
    overflow-y: scroll;
}

body {
    background-color: #FFF;
    color: #333;
    min-width: 940px;
}

a, a:link, a:visited { color: #06c; }

/* Force background and text color for text inputs and textareas
 * to prevent desktop themes (on Linux) redefining them.
 * Note, we can't set only foreground color because if your desktop
 * uses dark theme, text will become unreadable on a dark background.
*/
input[type=text], input[type=password], textarea {
    background-color: #fff;
    color: #333;
}

h2 { padding: 0 0 0.4em; }
h3 { padding: 0.8em 0 0.2em; }

p {
    line-height: 1.3;
    padding: 0.2em 0 0.6em;
    }

ul, ol {list-style: none;}

.clear { clear: both; display: block; font-size: 0;}
br.clear { height: 0; }

.hidden { display: none; }
.displayed_block { display: block !important; }
.displayed_inline { display: inline !important; }


/*------------------------------------*/
/*    Header
/*------------------------------------*/

#header {
    position: relative;
    float: left;
    width: 100%;
    height: 60px;
    background-color: #5c6c7e;
    color: #FFF;
    }
    #header a { color: #FFF; }
    #header a:hover { color: #D9EFFF; }

body.no-title #header { border-bottom: 10px solid #4998d0; }
body.no-title #main {padding-top: 14px;}

#logo_link {
    position: absolute;
    top: 5px;
    left: 15px;
    width: 112px;
    height: 22px;
    text-indent: -32768px;
    outline: none;
    overflow: hidden;
}

/*------------------------------------*/
/*    Small Top Right Navigation
/*------------------------------------*/
ul.projectnav, ul.rightnav {
    position: absolute;
}
    ul.projectnav li, ul.rightnav li {
        float: left;
        padding: 0 5px;
        border-left: 1px solid #98A5B3;
        line-height: 1.4;
    }
    ul.projectnav li.first, ul.rightnav li.first {
        border-left: 0;
    }
    ul li.upgrade  {
        border-right: 1px solid #98A5B3;
    }
    /*for rightmost advanced links navigation*/
    ul.rightnav {
        right: 10px;
        top: 5px;
        height: 15px;
    }
    #metanav li.prominent a, #metanav a.prominent { color: #ebeb00; font-weight: bold; }

    /*for leftmost project navigation*/
    ul.projectnav {
        left: 10px;
        top: 30px;
        height: 30px;
        padding-top: 2px;
        }
        ul.projectnav li {
            line-height: 2.0;
        }
        ul.projectnav li.selector_container {
            margin-left: -5px;
        }
        ul.projectnav li div#project_selector_form {
            margin-top:2px;
        }
        ul.projectnav li select {
            width: 100px;
        }
        ul.projectnav li a#project_selector_link {
            display: block;
            white-space: nowrap;
            width: 95px;
            height: 2em;
            overflow: hidden;
        }

form.project_select_form {
    display: inline;
}

/*------------------------------------*/
/*    Main Tabbed Navigation
/*------------------------------------*/

#mainnav {
    clear: right;
    float: left;
    height: 31px;
    margin-top: 30px;
    margin-left: 250px;
    }
    #mainnav strong a {
        background: none;
    }
    #mainnav li {
        float: left;
        height: 31px;
        margin: 0 1px;
        background-color: #3A7FB2;
    }
        #mainnav li.active {
            background-color: #3695D9;
        }
    #mainnav a,
    #mainnav strong {
        float: left;
        height: 23px;
        padding: 7px 15px 0;
        font-weight: normal;
    }
    #mainnav a {
        text-decoration: none;
    }
    #mainnav strong a {
        float: none;
        height: auto;
        padding: 0;
    }

/*------------------------------------*/
/*    Breadcrumbs / Toolbar
/*------------------------------------*/

div.breadcrumbs {
    position: relative;
    margin: 0 -15px 15px;
    padding: 1px 17px;
    height: 23px;
    line-height: 23px; /* vertical centering for inline children */
    background: #4998d0;
    color: #FFF;
    }
    div.breadcrumbs h1 {
        font-family: "Trebuchet MS", sans-serif;
        line-height: 23px;
    }
    div.breadcrumbs small {
        padding-left: 5px;
        font-family: Arial, sans-serif;
    }
    div.breadcrumbs .toolset {
            font-family:Verdana,Arial,sans-serif;
            font-size: 10px;
            font-weight: bold;
            position: absolute;
            top: 0; 
            right: 0;
        }
        div.breadcrumbs .toolset a,  
        div.breadcrumbs .toolset strong {
            display: block; float: left;
            height: 23px;
            color: #FFF;
            padding: 0 10px;
        }
        div.breadcrumbs .toolset a:hover { background-color: #68a5d0; }
        div.breadcrumbs .toolset a:visited {color: #FFF;}
        div.breadcrumbs .toolset strong { color: #ddd; text-decoration: underline;}
    /* Prev/Next Task */
    div.breadcrumbs a img {position: relative; top: 1px;}
    div.breadcrumbs a { color: #FFF !important; }
    div.breadcrumbs span.next {color: #ddd}
    div.breadcrumbs div {
        margin-right: 5px;
    }
    div.breadcrumbs a.arrow {
        width: 9px;
        height: 13px;
        text-decoration: none;
        margin-top: 1px;
        display: inline-block;
        * vertical-align: top; /* IE9 valign fix*/
        font-size: 0; /* IE */
    }
    div.breadcrumbs span.alpha {
        color: #ff0;
    }
    div.breadcrumbs .chain {
        }
        div.breadcrumbs .chain .sprite-left-arrow-grey {
            display: inline-block;
            font-size: 0;
            vertical-align: baseline;
            width: 7px;
            height: 11px;
            margin-right: .25em;
        }

/*------------------------------------*/
/*    You are Root or Admin
/*------------------------------------*/

#root_notice {
    color: #FFF;
    background: red;
    margin-right: 5px;
    }
    #root_notice a { color: #ff0; }

/*------------------------------------*/
/*    Footer
/*------------------------------------*/

html, body {
    height: 100%;
}
#the_all {
    position: relative;
    min-height: 100%;
}

#main {
    clear: both;
    background: #FFF ;
    padding: 0 15px 50px 15px;
}

#footer {
    position: absolute;
    bottom: 0;
    width: 100%;
    
    border-top: 1px solid #B1BAC2;
    background-color: #E6ECF2;
    color:#919FAC;
    clear: both;
    padding: 6px 0 8px;
    }
    #footer .reduce {
        padding: 0 14px 0;
    }
    #footer a { 
        padding: 6px 0 8px; /* same as footer paddings to extend links vertically */
        color: #5c7a99;
        text-decoration: none;
    }
    #footer a:hover { 
        text-decoration: underline;
    }
    #footer a.footer_right {
        position: absolute;
        top: 0;
        right: 1px;
        padding: 6px 14px 7px 14px;
        text-align: right;
    }

table.listing.listing_projects tr.toggler_row:hover a.underlined_on_hover,
table.listing.listing_projects  a.underlined_on_hover:hover {
    text-decoration: underline;
}
table.listing.listing_projects .toggler_row td,
table.listing.listing_projects .fullrow_handler.caption {
    overflow: hidden;
}
table.listing.listing_projects .small_btn,
.fullrow_handler {
    position: relative;
}
.fullrow_handler {
    width: 100%;
}
table.listing.listing_projects .fullrow_handler.caption {
    padding-top: 25px;
}
.fullrow_handler a.fullsize.fullrow {
    position: absolute;
    top: 0;
    left: 0;
    /* This hack sets element's height to 100% of parent td */
    height: 5000px;
}
table.listing.listing_projects small.project_active_sprints {
    color: gray;
    position: relative;
}
table.listing.listing_projects .name {
    width: 70%;
}
table.listing.listing_projects .buttons {
    width: 30%;
}
table.listing.listing_projects form.button-to, table.listing.listing_projects form.button-to div {
    display: inline;
}

/*------------------------------------*/
/*    Sprints list
/*------------------------------------*/
#sprintlist .new_sprint_button {
    margin-right: 10px;
}

#sprintlist_header th {
    font-weight: bold;
    color: #333333;
}

#sprintlist_header th.handle {
    padding-top: 5px;
    width: 13px;
}
#sprintlist_header th.name {
    width: 350px;
}
#sprintlist_header th.start_date {
    width: 150px;
}
#sprintlist_header th.end_date {
    width: 150px;
}

#sprintlist_table td, #sprintlist_table th {
    vertical-align: middle;
}

#sprintlist_table .cursor {
    padding-left: 5px;
    padding-right: 0;
    width: 11px;
    text-align:center;
}

#sprintlist_table .small_btn {
    margin: 0 0 2px 0;
}

#sprintlist_table .group_heading td {
    font-size: 14px;
    font-weight: bold;
}
#sprintlist_table .group_heading:hover td{
    background-color: #fff;
}

#sprintlist_table .sprint_checkbox {
    margin: 0;
}

#sprintlist_table form.button-to, #sprintlist_table form.button-to div {
    display: inline;
}

#sprintlist_table tr.toggler_row:hover a, #sprintlist_table a.sprint_name:hover {
    text-decoration: underline;
}

/*------------------------------------*/
/*    Rounding elements
/*------------------------------------*/
.rounded_caption {
    position: relative;
    background: #E1EFF9;
    padding: 10px;
}
    .rounded_caption_right {
        float: right;
    }
    /* add this class when there is only buttons in the header right part, buttons are taller than text, so should be aligned */
    .rounded_caption_right_buttons {
        margin-top: -.35em;
    }
    .rounded_caption_tl,
    .rounded_caption_tr,
    .rounded_caption_bl,
    .rounded_caption_br {
        position: absolute;
        width: 5px;
        height: 5px;
        font-size: 0;
    }
        .rounded_caption_tl {
            top: 0;
            left: 0;
        }
        .rounded_caption_tr {
            top: 0;
            left: -5px;
            margin-left: 100%;
        }
        .rounded_caption_bl {
            left: 0;
            bottom: 0;
        }
        .rounded_caption_br {
            bottom: 0;
            left: -5px;
            margin-left: 100%;
        }

/*------------------------------------*/
/*    Flash and Spinner (same Flash but with loading_small.gif)
/*------------------------------------*/
.flash { 
    position: fixed;
    left: 50%;
    bottom: 10px;
    text-align: center; 
    margin-left: -170px;
    z-index: 3;
    width: 340px;
    opacity: 0.90;
    
    display: none;
}
    .flash_shown {
        display: block;
    }
    .flash .spinner_message,
    .flash .round_t,
    .flash .round_b {
        display: block;
        background-color: #FAD163 !important;
    }
    .flash .spinner_message {
        padding: 0 20px;
        line-height: 15px;
    }
    .flash .round_t,
    .flash .round_b {
        position: relative;
        margin: 0 5px;
        height: 5px;
        font-size: 0;
    }
    
    .flash .round_tl,
    .flash .round_tr,
    .flash .round_bl,
    .flash .round_br {
        position: absolute;
        top: 0;
        left: 0;
        width: 5px;
        height: 5px;
        font-size: 0;
    }
        .flash .round_tl,
        .flash .round_bl {
            left: -5px;
        }
        .flash .round_tr,
        .flash .round_br {
            margin-left: 100%;
        }
        /* add ajax spinner to the spinner node */
        #spinner_message {
            padding-left: 17px;
            margin-left: -17px;
            background: url(/images/loading_small.gif?1780489631) no-repeat 0 50%;
        }

body.popup_dialog #flash { 
    position: absolute; 
    top: 84px; left: 12px; width: 150px;
    text-align: center;
}


/*------------------------------------*/
/*    Login Form
/*------------------------------------*/
div.first_login_column {
    float: left;
    margin: 35px 25px 0px 15px;
    border-right: 1px solid #ccc;
    padding: 0px 25px 0px 0px;
}

div.second_login_column {
    margin: 35px 25px;
}


/* flash with login error */
/* IE6 gives .foo.bar the same priority as .foo, so here #id.baz to increase rule weight */
#flash.login {
    position: absolute; 
    top: auto;
    bottom: auto;
    margin-top: .25em; /* align flash with username input */
    left: 480px;
    width: 280px;
}

#flash.flash_for_two_columns {
    top: 80px;
    left: 200px;
}



/*------------------------------------*/
/*    New Task Popup
/*------------------------------------*/

.popup_dialog {
    position: fixed;
    margin: 0px;
    padding: 0px;
    z-index: 6;
    background: #FFF;
    border: 1px solid #000;
    }
    .popup_dialog h3 {
        margin: 0px;
        height: 18px;
        background-color: #4998d0;
        color: #fff;
        vertical-align: middle;
        padding: 2px 0px 0px 5px;
        z-index:3;
        border-bottom: #b1bac2;
        position: relative;
        font-size: 12px;
        }
        .popup_dialog h3 a { 
            position: absolute; 
            right: 5px;
            color: #FFF !important;
            }
            
body.popup_dialog { 
    border: none; 
    }
            
#new_task_dialog {
    right: 10px;
    bottom: 10px;
    width: 340px;
}
#new_task_dialog table{
    width: 100%;
    border-collapse: collapse; 
    padding: 0px; 
    margin: 0px;
}
#new_task_dialog_more_controls {
    width: 305px;
    padding: 5px 0 5px 15px;
}
#new_task_dialog_more_controls {
    width: 305px;
    padding: 5px 0 5px 15px;
}
#new_task_dialog label,
body.popup_dialog label {
    display: block;
}


.more_arrow {
    text-decoration: none;
    width: 16px;
    height: 16px;
    position: absolute;
    margin-left: -16px;
    cursor: pointer;
}


#feedback_dialog {
    left: 10px;
    bottom: 10px;
    width: 340px;
    height: 250px;
    }

#shortcuts_help_dialog {
    top: 32%;
    left: 50%;
    margin: -190px;
    width: 380px;
    }
    #shortcuts_help_dialog.two_column_shortcuts_help{
        margin: -190px -300px -300px -300px;
        width: 600px;
    }
    #shortcuts_help_dialog #shortcuts_list {
        padding: 10px 20px 5px 20px;
        }
        #shortcuts_help_dialog #shortcuts_list .shortcut {
            width: 40px;
            padding-left: 20px;
            float: left;
        }
        #shortcuts_help_dialog #shortcuts_list .accesskey_shortcut {
            width: 110px;
            float: left;
        }
    #shortcuts_help_dialog .close_button {
        text-align: center;
        padding: 5px 5px 10px 5px;
    }

#nav_dialog {
    top: 50%;
    left: 50%;
    margin-left: -270px;
    margin-top: -170px;
    width: 540px;
    z-index: 2;
    }
#nav_dialog #nav_sprint_list {
    padding: 10px 20px 20px 20px;
    }
#nav_dialog #nav_sprint_list span {
    font: bold 15px "Trebuchet MS", Arial, sans-serif;
    padding-left: 5px;
    padding-right: 5px;
    }
#nav_dialog #nav_sprint_list span.selected {
    background-color: #ffa;
}
#nav_dialog #nav_dialog_load_archived {
    height: 22px;
    text-align: right;
}
#nav_dialog #nav_dialog_load_archived #load_archived_sprints_link {
    margin-right: 8px;
}

#nav_project_dialog {
    top: 50%;
    left: 50%;
    margin-left: -270px;
    margin-top: -170px;
    width: 540px;
    }
#nav_project_dialog #nav_project_list {
    padding: 10px 20px 20px 20px;
}
#nav_project_dialog #nav_project_list span {
font: bold 15px "Trebuchet MS", Arial, sans-serif;
    padding-left: 5px;
    padding-right: 5px;
}
#nav_project_dialog #nav_project_list span.selected {
    background-color: #ffa;
}

#apply_tag_dialog {
    top: 50%;
    left: 50%;
    margin-left: -270px;
    margin-top: -170px;
    width: 540px;
    }
    #apply_tag_dialog #apply_tag_list {
        padding: 10px 20px 20px 20px;
        }
        #apply_tag_dialog #apply_tag_list span {
            font: bold 15px "Trebuchet MS", Arial, sans-serif;
                padding-left: 5px;
                padding-right: 5px;               
            }
            #apply_tag_dialog #apply_tag_list span.selected {
                background-color: #ffa;
            }

#remove_tag_dialog {
    top: 50%;
    left: 50%;
    margin-left: -270px;
    margin-top: -170px;
    width: 540px;
    }
    #remove_tag_dialog #remove_tag_list {
        padding: 10px 20px 20px 20px;
        }
        #remove_tag_dialog #remove_tag_list span {
            font: bold 15px "Trebuchet MS", Arial, sans-serif;
                padding-left: 5px;
                padding-right: 5px;               
            }
            #remove_tag_dialog #remove_tag_list span.selected {
                background-color: #ffa;
            }

#spinner_dialog {
    top: 50%;
    left: 50%;
    margin-left: -270px;
    margin-top: -170px;
    width: 540px;
    }
    #spinner_dialog #spinner_dialog_content {
        padding: 10px 20px 20px 20px;
        }
        #nav_dialog #spinner_dialog_text {
                padding-left: 5px;
                padding-right: 5px;               
            }

.popup_dialog form {padding: 10px;}
.popup_dialog form textarea { width: 310px; height: 150px; }
.popup_dialog form table { width: 310px;}
.popup_dialog form select { width: 130px;}
.popup_dialog form .estimate, .popup_dialog form .due_date { width: 120px;}
.popup_dialog form table.three_column select { width: 100px; }
.popup_dialog form table.three_column .estimate { width: 90px; }

#analytics_form_dialog_container {
    padding: 10px;
}

/*    Welcome blurb, derivative of popup_dialog
/*------------------------------------*/
.welcome {
    left: 50%; margin-left: -200px; width: 400px; height: 262px; top: 140px;
    z-index: 20; 
    text-align: center;
    }
    .welcome h3 {padding: 2px 0px 4px;}            
    .welcome p {margin: 5px 20px; }
.overlay_dialog {
    opacity: 0.6;
    position: fixed; 
    top: 0px; 
    left: 0px; 
    background: #666; 
    z-index: 19; 
    width: 100%; 
    height: 100%;
}

/*------------------------------------*/
/*    Error Display, Scaffolded
/*------------------------------------*/

.fieldWithErrors { padding: 2px; display: inline; }
.fieldWithErrors input {border: 2px solid red !important; }

#errorExplanation {
    width: 400px;
    border: 1px solid red;
    padding: 7px;
    margin-bottom: 20px;
    padding-bottom: 12px;
    background: url(/images/dialog-warning.png?1780489631) #f0f0f0 10px 30px no-repeat;
    }
    #errorExplanation h2 {
        text-align: left;
        padding: 5px 5px 5px 15px;
        margin: -7px;
        background-color: #c00;
        color: #fff;
        }
    #errorExplanation p {
        margin: 10px 0px 0px 50px;
        padding: 5px;
        }
    #errorExplanation ul li {
        margin-left: 60px;
        list-style: disc;
    }
    /* This allows to have checkboxes in error messages 
       like the error message about bouncing email */
    #errorExplanation input {
        float: none !important;
    }
    /* Error message box without red header 
       Used to show bouncing email message on Edit Profile page  */
#errorExplanation.no-header {
        background: url(/images/dialog-warning.png?1780489631) #f0f0f0 10px 10px no-repeat;
    }
    #errorExplanation.no-header p {
        margin-top: 0px;    
    }


/*------------------------------------*/
/*    Sprint List
/*------------------------------------*/

table.listing tr.active_sprint td,
table.listing tr.active_sprint td a {font-weight: bold;}
table.listing tr.active_sprint td .btn {font-weight: normal;}

#active_sprint {margin-top:35px; }

/**************************************/
/*    Table for Listing Something
/**************************************/

table.listing, table.listing .sub table {
    clear:both;
    width: 100%;
    margin: 0;
    border-collapse: collapse;
    padding: 0;
    }
    /* cells and rows to incluse sub-tables */
    table.listing .sub  {border: 0; padding: 0;}
    table.listing .sub tr {border: none;}
    table.listing th, table.listing td {
        padding: 5px;
        text-align: left;
        vertical-align: top;
    }
    table.listing th {
        background-color: #e1eff9;
        border-bottom: 2px solid #d0e6f6;
        color: #738999;
        font-weight: normal;
    }
    table.listing tr.selected td {
        background-color: #FFC;
    }
    table.listing td { border-bottom: 1px solid #b2bbbb; }
    table.listing td.noborder { border-bottom: 0; }
    table.listing td.cell, table.listing th.cell {
        border-left: 1px solid #e1e8ed;
        text-align: center;
        vertical-align: middle;
    }
    table.listing td.light { border-bottom: 1px solid #e8eef4 ; }
    table.listing tr.separator {  background-color: #efefef; }

/*    table.listing tr.level_0 {  background-color: #f7f7f7; }*/
    table.listing tr.even {  background-color: #f7f7f7; }
    table.listing tr.odd {  background-color: #fcfcfc; }
    table.listing tr.level_0 {  background-color: #fcfcfc; }
    table.listing tr.level_1 {  background-color: #fcfcfc; }
    table.listing tfoot th {
        color: #333;
        font-weight: bold;
        text-transform: uppercase;
    }
    table.listing .r { text-align: right; }

    /* here live controls that are shown only on hover */
    table.listing td .toggler {visibility:hidden;}
    table.listing tr:hover td .toggler,
    table.listing tr td .toggler_shown {visibility:visible;}

    table.listing a.fullsize {
        display: block;
        width: 100%;
        margin: -5px;
        padding: 5px;
    }
    table.listing a.plain { color: #000; /*  text-decoration: none; */ }
    table.listing a.nodecor { text-decoration: none; }

    table.listing img { vertical-align: middle; }
    table.listing textarea {
        display: block;
        width: 100%;
        margin: 0;
        height: 70px;
    }
    table.listing span.comments {
        font-size: 80%;
        color: #999;
    }
    table.listing span.newline {
        display: block;
    }
    table.listing tfoot#sprint_totals {
        height: 30px;
    }
    /* hide for editors */
    table.listing td .wrapper { position: relative; }
    table.listing .wrapper .hidden {
        display: block;
        visibility: hidden;
    }

table.highlight_row tr:hover td {
    background-color: #fff5d9;
}
table.highlight_row tr.nohover:hover td {
    background-color: transparent;
}

#shortcut_status {
    position: fixed;
    bottom: 10px;
    right: 10px;
    padding: 5px;
    background: #f00;
    color: #fff;
}

/*------------------------------------*/
/*    Tools page
/*------------------------------------*/
.blurb {
    width: 800px; 
    margin-left: 40px ;
    }  
    .blurb p {    line-height: 17px;}
    .blurb ol, .blurb ul {list-style: circle; margin: 5px 0 5px 15px;}
    .blurb li {margin-top: 5px;}
  

#idle_filter_link a {
    text-decoration: none;
}


table#org_list th,  table#org_list td {
    font-size: 90%;
    padding: 2px 5px 2px 2px;
}

table#org_list th {
    vertical-align: middle;
}

table#org_list th.link_container {
    white-space: nowrap;
}

table#org_list td.clickable a {
    margin: -1px -1px -7px -1px;
    padding: 1px 1px 7px 1px;
    display: block;
    width: 100%;
    height: 100%;
}


#org_list div.misc_details {
    width: 100%;
    overflow: hidden;
}
#org_list div.misc {
    position: absolute;
    width: 300px;
    margin-left: -330px;
    border: 1px solid #000;
    padding: 5px;
    background-color: #ffe;
}

#billing_timeline.listing td {
    font-size: 11px;
}
#billing_timeline.listing td .misc {
    visibility: hidden; /* opera doesn't repaint document when using display none */
    position: fixed;
    border: 1px solid #000;
    width: 400px;
    padding: 5px;
    background-color: #FFE;
    z-index: 2;
    margin-left: 15px;
    margin-top: 15px;
}
#billing_timeline.listing td .misc_shown {
    visibility: visible;
}
#billing_timeline.listing .month_totals th {
    padding: 0 5px 0 5px;
    border-bottom: none;
}


a.org_link {
        color: #000;
        text-decoration: none;
    }
    a.org_link:hover {
         text-decoration: underline;
    }

#org_list .small_btn {
    padding: 0px;
}

/* simple tabs styles */
ul.tabs {
    list-style: none;
    margin: 0;
    padding: 2px 0;
}
    ul.tabs li {
        display: inline;
        margin: 0;
    }
        ul.tabs li a {
            text-decoration: none;
            padding: 2px 1em;
            color: #666;
            border: 1px solid #B1BAC2;
            background-color: #FFF;
        }
        ul.tabs li a:hover {
            color: #000;
            background-color: #EEE;
        }
        ul.tabs li a.active {
            background-color: #CED4D9;
            color: #000;
        }
        ul.tabs li a.active:hover {
            background-color: #CED4D9;
            color: #000;
        }


/*------------------------------------*/
/* Search form and page
/*------------------------------------*/

#search_form {
    position: absolute;
    right: 10px;
    top: 30px;
}
#search_form input {
    margin: 0;
}

#search_results {
    width: 100%;
    /*
    width: 700px;
    height: 200px;
    overflow: auto;
    */
}

a.search_in_all_projects {
    margin-left: 10px;
}

#search_table {
    width: 100%;
}

#search_table tr {
}

#search_table td {
    border: 1px solid #e1e8ed;
    padding: 5px;
    width: 100%;
}

#search_table td a {
    text-decoration: none;
    color: #333;
    display: block;
    margin: -5px;
    padding: 5px;
}

#search_table td a.sprint_link {
    display: inline;
    margin-right: 2px;
}

#search_table small {
    color: #808080;
}

#search_table tr:hover {
    background: #FFF7DF;
    text-decoration: none;
}

.issue_number_link {
    color: #888 !important;
    text-decoration: none !important;
}
a.issue_number_link:hover {
    text-decoration: underline !important;
    color: #888 !important;
}

/*------------------------------------*/
/* Payment and Account pages
/*------------------------------------*/

acronym.validation {cursor: help; background-color: inherit; border-bottom:none; font-weight: normal;}

#cvv_help {
    position: absolute;
    border: 1px solid #777;
    width: 300px;
    padding: 5px 10px;
    background-color: #fff9d9;
    }
    #cvv_help p {
        font-size: 90%;
    }

#cards_help {
    position: absolute;
    border: 1px solid #777;
    padding: 5px;
    background-color: #fff9d9;
    font-size: 90%;
    z-index: 2;
}

.payment-form .form_item {
    padding-left: 11em;
    height: 24px;
    margin: 6px 0;
}
    .payment-form .form_item_noindent {
        padding-left: 0;
    }
    .payment-form .form_item label {
        display: inline;
        float: left;
        width: 11em;
        margin-left: -11em;
        height: 24px;
        line-height: 24px;
    }
    .payment-form .credit_cards {
        position: relative;
        left: 6px;
        cursor: default;
    }
        .payment-form #cvv_help {
            margin-top: 2px;
            margin-left: 6px;
        }

        .payment-form .credit_cards #cards_help {
            margin-top: 14px;
            top: 100%;
            left: 0;
            white-space: nowrap;
        }
        .payment-form .cc_icon {
            display: inline-block;
            width: 37px;
            height: 23px;
            vertical-align: middle;
            font-size: 0;
            margin-right: 5px;
            background-position: 0 0;
            background-repeat: no-repeat;
        }
            .payment-form .cc_icon_visa {
                background-image: url(/images/cc-visa.png?1780489631);
            }
            .payment-form .cc_icon_mastercard {
                background-image: url(/images/cc-mastercard.png?1780489631);
            }
            .payment-form .cc_icon_amex {
                background-image: url(/images/cc-amex.png?1780489631);
            }

table.plans td.r, table.plans th.r {
    text-align: right;
}

table.plans td.c, table.plans th.c {
    text-align: center;
}

div.account {
    margin-bottom: 20px;
    }
    div.account h3 {
        border-bottom: 1px solid #ccc; 
        margin-top: 20px; 
        font: bold 16px "Trebuchet MS", Arial, sans-serif; 
        margin-left: -30px;
        }
        div.account h3 .toolset {
            font: normal 12px Arial, Helvetica, Geneva, sans-serif;
        }
    div.account p {
        margin-top: 10px;
    }
    div.stat {
        margin-top: 10px;
        margin-bottom: 14px;
    }
    div.stat-label {
        width: 200px;
        overflow: hidden;
        float: left;
        color: #999;
    }
    div.stat p.stat-label{
        margin: 0;
        padding: 0;
    }

#manual_charge_form {
    position: absolute;
    right: 10px;
    top: 35px;
}
#commit_manual_charge_form h3 {
    margin-bottom: 20px;
    border: none;
}


#trial_reminder_form {
    position: absolute;
    right: 115px;
    top: 35px;
}


/*
in some cases Firefox 2 on linux renders SELECT's OPTIONs with width 
not equal to width of original SELECT.
This is especially annoying when we have given SELECT yellow backgrouns, 
and OPTIONs have white background.

the bug goes away with page reload, making it hard to track 

to prevent it, we specify OPTION's width explicitly.
*/

select option {width: 100%;}


h2.billing_timeline {
    margin-top: 15px;
    margin-bottom: -5px;
}

table.billing_timeline a.org_link {
        color: #000;
        text-decoration: none;
    }
    table.billing_timeline a.org_link:hover {
         text-decoration: underline;
    }
    table.billing_timeline tr span {
        color: #06c;
        text-decoration:underline;
    }
table.billing_timeline tr.not-paid {
        color: #ccc;
    }
    table.billing_timeline tr.not-paid span {
        color: #f00;
        text-decoration:underline;
    }
    table.billing_timeline tr.not-paid a.org_link {
        color: #ccc;
    }

table.billing_timeline tr.forecast {
        color: #777;
    }
    table.billing_timeline tr.forecast a {
        color: #777;
    }
    table.billing_timeline tr.forecast span {
        color: #777;
    }

table.listing tfoot th {
    text-transform: none;
}


#billing_timeline_form {
        position: absolute;
        padding-top: 5px;
        right: 10px;
    }
    #billing_timeline_form input#months {
        width: 30px;
    }

#billing_timeline div.misc table {
    border-collapse: collapse;
}
#billing_timeline div.misc table td {
    padding: 0px;
    border: none;
    background: none;
}

#org_analytics_marketing_form {
    margin-left: 25px;
    margin-bottom: 10px;
}

div.disabled label, div.disabled span {
    color: #ccc;
}

table.roles {
        border-collapse: collapse;
    }
    table.roles th {
        width: 90px;
    }
    table.roles tr.first_header th {
        padding: 5px 5px 8px 5px;
        border: 1px solid #000;
        border-bottom: none;
    }
    table.roles tr.middle_header th {
        padding: 0 5px 1px 5px;
        border-left: 1px solid #000;
        border-right: 1px solid #000;
        font-weight: normal;
    }
    table.roles tr.last_header th {
        padding: 0 5px 1px 5px;
        border: 1px solid #000;
        border-top: none;
        font-weight: normal;
    }
    table.roles th.permission { width: 150px; }
    table.roles td {
        padding: 5px;
        text-align: center;
        vertical-align: middle;
        border: 1px solid #000;
    }
    table.roles td.permission { text-align: left; }
    table.roles td.group_column {
        text-align: left;
        width: 40px;
    }
    table.roles span.builtin { color: #999; font-weight: normal; }

div#users_in_role_form select#users_for_role { width: 250px; }
div#users_in_role_form select#users_in_role { width: 250px; }
div#users_in_role_form input#users_for_role_button { width: 120px; }
div#users_in_role_form input#users_in_role_button { width: 120px; }


.by_role h3 {
    display: inline;
    padding: 0;
}
.by_role h3 small {
    margin-left: 5px;
    font: normal 12px/1 Arial, Helvetica, sans-serif;
    color: #738999;
}
.by_role table.listing td, .by_role table.listing th {
    padding-left: 7px;
    padding-right: 7px;
}
.by_role br.next_role {
    margin-bottom: 30px;
}

/*user selector widget*/
table.user_selector_table {
    border-collapse: collapse;
    padding: 0px;
    margin: 0px;
}
select.user_filter,
select#users_for_project, select#project_users, 
select#users_for_project_watch_list, select#project_watch_list { width: 250px; }
input.mover_button { width: 170px; }

.user_selector_arrow {
    text-decoration: none;
    color: black;
    width: 16px;
    height: 16px;
    position: absolute;
    cursor: pointer;
}
span.grayed { color: #aaa; }

table.pricing_plans th span {
    width: 30px;
    overflow: hidden;
    display: block;
}

table.pricing_plans th,  table.pricing_plans td {
    font-size: 90%;
    padding: 2px 5px 2px 2px;
}

.sidebar .revenue_chart {
    margin-top: 30px;
}

#feed_troubleshooting {
    background-color: #FFE;
    padding: 5px;
    border: 1px solid #000;
    width: 390px;
    position: absolute;
    margin-left: 26em;
}
#feed_troubleshooting a.close_link {
    float: right;
}

div#users_in_team_form select#users_for_team,
div#users_in_team_form select#users_in_team {
    width: 250px;
}
div#users_in_team_form input#users_for_team_button,
div#users_in_team_form input#users_in_team_button {
    width: 120px;
}

div.org-analytics {
    padding-top: 20px;
}

table.user_form_additional_data td.teams_column {
    padding-left: 40px;
}
table.user_form_additional_data label {
    padding-left: 5px;
}
table.user_form_additional_data select {
    width: 200px !important;
}

table#testlog {
    border-collapse: collapse;
    margin: 10px auto;
}
    table#testlog th, table#testlog td {
        padding: 5px;
        font-size: 11px;
        vertical-align: top;
        border: 1px solid #CCC;
    }
        table#testlog .error td {
            background-color: #ff7878;
        }
    table#testlog .source {
        width: 500px;
    }
        table#testlog .source .scroll_wraper {
            width: 500px;
            white-space: pre;
            white-space: pre-wrap;
            overflow-y: auto;
        }
    table#testlog .selectors {
        width: 200px;
    }
    table#testlog .time {
        width: 200px;
    }
    table#testlog tbody td.time, table#testlog tfoot td {
        text-align: right;
    }
    table#testlog tfoot td {
        vertical-align: bottom;
        background-color: #FFA;
    }
    table#testlog tbody td.time, table#testlog th {
        font-weight: bold;
    }
        table#testlog table#timings {
            border-collapse: collapse;
            width: 100%;
        }
            table#testlog table#timings td {
                border: none;
                padding: 0;
                line-height: 1.5;
            }
            table#testlog table#timings td.total_time {
                width: 25%;
            }

.experiment {
    margin-left: 20px;
}

td#analytics_multisprint_form select#sprints_to_analyze.updated option.sprint {
    padding-left: 35px;
}
input.analytics_analyze_button {
    margin-left: 3px;
}

input#show_hide_new_issue {
    margin-right: 20px;
}

input#remove_from_sprint {
    margin-left: 15px;
}

a.project_name_link, a.sprint_name_link {
    text-decoration: underline !important;
}

div#more_actions_container.issues_more_actions {
    position: absolute;
    top: 10px;
    right: 10px;
}

div#more_actions_container.issues_more_actions select {
    width: 150px;
}

div#issuelist_toolbox.rounded_caption {
    padding-right: 170px;
}

div#issuelist_toolbox.rounded_caption div.issues_collection_info {
    margin-top: 10px;
    margin-left: 100px;
}
div#issuelist_toolbox.rounded_caption div.issues_collection_info.inline_mode {
    margin-left: 2px !important;
    margin-top: 0 !important;
    display: inline;
}

select#sprint_type {
    width: 210px;
}

h2#archived_sprint {
    margin-top: 15px;
}

input.sprint_form_radio {
    margin-right: 4px !important;
}

#settings_back_link {
    position: absolute;
    display: block;
    left: 15px;
    top: 36px;
    font-size: 13px;
    font-weight: bold;
    color: #fff60a !important;
    text-decoration: none;
}

#settings_back_link:hover {
    text-decoration: underline;
}

iframe.upgrade {
    width: 830px;
    height: 1450px;
    border: none;
    margin-left: -30px;
}
body.iframe {
        width: 790px;
        min-width: 700px;
    }
    body.iframe div.account_upgrade {
        width: 790px;
    }
    body.iframe div.account_upgrade_wrap {
        width: 790px;
    }
    body.iframe div.breadcrumbs {
        display:none;
    }

.google_apps_login_button {
    font-size: 18px;
    line-height: 1.5;
    font-weight: bold;
}

.google_apps_users_warning {
        background: url("/images/dialog-warning.png") no-repeat scroll 10px 10px;
        padding:7px 7px 12px 55px;
        width: 450px;
    }
    .google_apps_users_warning p {
        font-size: 12px !important;
    }
    .google_apps_users_warning ol,
    .google_apps_openid_deprecated_help ol {
        list-style:decimal outside none;
        margin: 0px 0 15px 25px;
        padding-left:10px;
    }


div.listing_small { 
        margin-top: 6px;
        color: #888; 
        font-size: 80%; 
    }
    .listing_small .label {
        color: #000;
    }
    .listing_small a.org_link {
        color: #888;
    }

span.old-price {
        color: #f00;
        text-decoration: line-through;
    }
    span.old-price span {
        color: #000;
    }

#discounts_table .group_heading td {
    padding-top: 20px;
    font-size: 14px;
    font-weight: bold;
}

div.github_hook {
        margin-top: 20px;
    }
    .github_hook .token {
        font-size: 18px;
        font-weight: bold;
        color: #999;
    }
    .github_hook p {
        font-size: 13px;
    }
    .github_hook h3 {
        font-size: 14px;
        margin-top: 20px;
    }
    .github_hook ul {
        margin-top: 0;
    }
    .github_hook ul li {
        list-style: circle; margin: 0px 0 5px 15px;
        font-size: 13px;
    }

div.diff_load_error {
    }
    .diff_load_error p {
        font-size: 13px;
    }
    .diff_load_error ul li {
        list-style: disc;
        margin: 0px 0 5px 15px;
        font-size: 13px;
    }

table.report {
        border-collapse: collapse;
    }
    .report tr:hover {
        background: #FFF7DF;
    }
    .report td {
        padding-right: 10px;
    }
    .report th {
        text-align: left;
        padding-top: 20px;
        padding-bottom: 5px;
    }
    .report th h2 {
        border-bottom: 1px solid #ccc;
    }
    .report span.positive {
        color: #070;
    }
    .report span.negative {
        color: #e00;
    }