/*********************************************************************/
/* The page is contained in the "vw_dendra_window" div               */
/* which in turn contains 6 major divs, first 3 stacked vertically:  */
/*   - vw3_hd_div: header, on top, to remain constant                */
/*   - vw3_ls_div: list selector div, next, for list selection       */
/*   - vw3_tt_div: title of the virtual table                        */
/* then immediately underneath, three divs side by side forming      */
/* the columns of a virtual table                                    */
/*   - vw3_rl_div: left, containing record list; this in turn can    */
/*                 be displayed with one or three columns            */
/*   - vw3_sc_div: center, containing selector boxes; hidden when    */
/*                 not in selection mode                             */
/*   - vw3_cr_div: right, where tree details are displayed,          */
/*                 itself split into 2 vertical divs                 */
/*                                                                   */
/* 'vw_dendra' is the actual mysql view name that provides           */
/* the records; 3 in vw3 refers to vw_dendra's index in the          */
/* lg_user_activities table                                          */
/* the acronyms can be understood as follows:                        */
/*     vw: view, when 1 record at a time is displayed                */
/*     rl: record list, when a list of records is displayed          */
/*     cr: current record                                            */
/*     fi: refers to the ith field in vw_dendra                      */
/*********************************************************************/

/* from dendra_new.css */

.enSy > li, .spSy > li, .scSy > li {
    list-style-type:none;
    padding-left: 10px;
}
.trWk {
    display: block;
}
div.alt {
    position: absolute;
    top: 138px; /* initial position; "left" will be set in code and recalculated upon window resize */
    width: 633px;
    font-size: 9pt;
    color:#D37936;
    z-index: 0;
    border: 1px solid #D37936;
    padding: 5px 10px 5px 10px;
    display: none;
}

#vw3rlf9div > a:hover, a:focus  {
font-weight: normal;
}


/* copied from #center */
#vw_dendra_window {
float:left;
margin-left:5px;
color: #126212;
/*width:625px;*/
width:825px;
}

/*********************************************************************/
/* styles relating to top three divs and all buttons                 */
/*********************************************************************/
#vw3_hd_div, #vw3_ls_div, #vw3_tt_div {
display:block;
}
#vw3_tt_div {
    min-height:30px;
    border:none;
    border-bottom: 8px solid #126212; /* dark green */
}
#list_selector_div {
}

/* title */
#vw3_title_div {
display: block;
text-align:left;
height: 35px;
}
#vw3_list_title_span {
font: small-caps bold 16pt arial,sans-serif;
}


/* buttons */
#vw3_criter_slct
{
padding: 0px 0px 0px 10px;
}
#vw3_criter_clr
{
padding: 0px 0px 5px 0px;;
}
#vw3_tbl_rstr {
padding: 0px 0px 0px 10px;
}

#vw3_criter_clr, #vw3_tbl_rstr {
    display: none; 
}
#vw3_subtitle_div {
display: none;
clear: both;
text-align:left;
font-size: 8pt;
color: #7DB853; /*light green*/
width: 825px;
padding: 8px 0px 10px 0px;
}



#list_selector { /* no longer used - delete in final version */
display:block;
color:#126212;
font-size:12pt;
font-weight:bold;
font-variant:small-caps;
width:625px;
text-align:center;
}



/* top nav bar */
div ul#vw3lists
{
  width: 800px;
  padding: 0px 12px 0px 13px;
  height: 137px;
  background:  #ffffff url('http://74.127.47.240/~canopyo/templates/library/images/library_top_nav.gif') top left no-repeat;
}

div ul#vw3lists li
{
  float: left;
  list-style-type: none;
  position: relative;
  height: 52px;
}

div ul#vw3lists li a
{
  text-align: center;
  text-decoration: none;
  color: #ffffff;
  display: block;
  width: 90px;
  padding: 8px 5px 0px;
  height: 52px;
  font-weight: bold;
  font-size: 9pt;
}

div ul#vw3lists li.lst_selected a
{
  font-weight: bold;
  background: #ffffff url('http://74.127.47.240/~canopyo/templates/library/images/library_top_nav_selected.gif') top left no-repeat;
}

div ul#vw3lists li.lst_unselected a
{
  background: transparent;
}

div ul#vw3lists li.lst_unselected a:hover
{
  font-weight: bold;
  background: #ffffff url('http://74.127.47.240/~canopyo/templates/library/images/library_top_nav_selected.gif') top left no-repeat;
}


div ul#vw3lists li a:hover, div ul#vw3lists li a:focus {
  font-weight: bold;
}

div ul#vw3lists li div.element_description a
{
  display: inline;
  width: auto;
  height: auto;
  padding: 0px;
  font-size: 9pt;
  color:  #7DB853; /*light green*/
  background: transparent;
}

div ul#vw3lists li div.element_description a:hover
{
  background: transparent;
}


li img {
display: none;
}



div#lst_elt_14
{
position: absolute;
top: 52px;
left: 0px;
}


div#lst_elt_29
{
position: absolute;
top: 52px;
left: -100px;
}

div#lst_elt_9
{
position: absolute;
top: 52px;
left: -200px;
}

div#lst_elt_30
{
position: absolute;
top: 52px;
left: -300px;
}

div#lst_elt_11
{
position: absolute;
top: 52px;
left: -400px;
}

div#lst_elt_12
{
position: absolute;
top: 52px;
left: -500px;
}

div#lst_elt_10
{
position: absolute;
top: 52px;
left: -600px;
}

div#lst_elt_13
{
position: absolute;
top: 52px;
left: -700px;
}


/*********************************************************************/
/* styles relating to record lists and tables (within vw3_rl_div)    */
/*********************************************************************/

/* style of table that lists  records */

/* styles when 'table' is expanded */
.vw3_rl_normal {
    display:inline;
    float:left;
    max-height:340px;
    overflow-y:auto;
    /*width:625px;*/
    width:825px;
    font-size: 10pt;
}
/* this captures heading and list items in the table */
div.vw3_rl_normal > div > a {
display:block;
height:25px;
padding-top: 5px;
overflow-y:hidden;
text-decoration:none;
}
div.vw3_rl_normal > div > a:hover, a:focus  {
font-weight: bold;
}
/* styles when 'table' is folded */
.vw3_rl_shrunk {
    display:inline;
    float:left;
    max-height:1000px;
    overflow-y:auto;
    width:200px;
    font-size:10pt;
}
div.vw3_rl_shrunk > div > a {
display:block;
width:200px;
text-decoration:none;
height: 25px;
padding: 5px 0px 0px 8px;
}
div.vw3_rl_shrunk > div > a:hover, a:focus {
font-weight: bold;
}


/* column-specific styles */
/* common names column */
.vw3rlf4div {
    float:left;
    /*max-width:190px;*/
    width:250px;
}

.vw3rlf4div a
{
  padding: 0px 0px 0px 8px;
}

/* scientific names column */
/*.vw3rlf5div {*/
.vw3rlf7div {
    float:left;
    /*max-width:230px;*/
    width:350px;
    font-style: normal;
}
/* family names column */
/*.vw3rlf6div {*/
.vw3rlf9div {
    float:left;
    /*max-width:175px;*/
    width:200px;
}

/* column headers */
/*#vw3f4hd, #vw3f5hd, #vw3f6hd {*/
#vw3f4hd, #vw3f7hd, #vw3f9hd {
    clear:both;
    background-color: #7DB853; /*light green*/
    color:#FFFFFF;
    font-size: 11pt;
    /*font-variant: small-caps; */
    font-weight:bold;
    padding: 10px 8px;
    height:20px;
}

#vw3f7hd, #vw3f9hd {
    padding-left: 0px;
}
/* column headers subtitles */
.vw3_rl_subheader {
    display: none;
    font-variant:normal;
    font-style:italic;
    font-size: 9pt;
}
div.vw3_rl_shrunk span.vw3_rl_subheader {
    font-size: 8pt;
}



/*********************************************************************/
/* styles relating to vw3_cr_div in which tree details are displayed */
/*********************************************************************/

/* style of main div */
.vw3_cr_hidden { 
display:none;
float:left;
max-width:325px;
}
.vw3_cr {
display:inline;
float:left;
/*max-width:325px;*/
max-width:625px;
}
/* left and right 'panes' */
#vw3_cr_div_lft
{
display:inline;
float:left;
width:312px;
margin: 0px 0px 0px 10px;
font-size: 10pt;
}

#vw3_cr_div_rgt
{
display:inline;
float:left;
width:293px;
margin: 0px 0px 0px 4px;
font-size: 10pt;
}

#vw3_cr_div_rgt img {
    width: 288px;
}



/* style of 'record_title' field */
.record_title { 
display:block;
font-size:14pt;
/*font-variant:small-caps;*/
font-weight: bold;
text-align:left;
padding: 8px 0px 8px 0px;
}


/* style of 'section_header' and 'selectable_section_header' fields */
.section_header {
display:block;
color:#FFFFFF;
font-weight: bold;
font-size: 10pt;
padding: 8px 0px 8px 5px;
background-color: #7DB853; /*light green*/
}

.selectable_section_header {
display:block;
color:#FFFFFF;
font-weight: bold;
font-size: 10pt;
padding: 0px 0px 0px 5px;
background-color: #7DB853; /*light green*/
}

div#vw3_cr_div_lft .selectable_section_header
{
padding: 8px 0px 8px 5px;
}




 /* labeled fields of current record */
.crf {
display:block;
padding: 5px 0px 5px 11px;
}

#crf45:before {
content: "An example in Palo Alto:";
color: #126212;
font-weight: bold;
}

.crf_off + .comma {
    display: none;
}

/* to hide empty fields */
.crf_off {
display:none;
}
/* field label */
.crf_lbl { 
font-weight: bold;
padding-right: 10px;
/*min-width:50px;*/}


.crfVal { /* this class name should be added to the crf_val definition in the main style sheet;
this style is created  to allow js to recognize values that have control tip behavior */
float:none;
padding-left:10px;
}

/*field value */
.crf_val {
float:none;
}
a.crf_val  {
float:none;
font-style: italic;
color: #126212;
}
/* images */
.crf_img {
}
/*********************************************************************/
/* styles relating to selection criteria form within vw3_sc_div      */
/*********************************************************************/

/* style of main div */
.vw3_sc_hidden { 
display:none;
/*float:left;
max-width:325px;*/
}
.vw3_sc {
display:inline;
float:left;
/*max-width:325px;*/
width:625px;
}
table {
table-layout: auto;
}
/* column headers: hide first, display second */
#vw3_sc_tblhdr0 {
display:none;
}
#vw3_sc_tblhdr1 {
}
.panel_item {
clear: both;
width:475px;
}
.float_label {
float: left;
}
.lv_blk_hidden {
display: none;
}
.lv_blk_visible {
display: inline;
float: left;
}
#vw3_sc_tbl {
/*border-width: 1px;*/
/*border-collapse: collapse;*/
}

tr#vw3_sc_tblrSize, tr#vw3_sc_tblrAppearance, tr#vw3_sc_tblrCare, tr#vw3_sc_tblrLocal_use_recommendation
{
  background: #7DB853; /*light green*/
}

#vw3_sc_tbl th {
  font-size: 8pt;
}
#vw3_sc_tbl td {
  font-size: 9pt;
  padding: 5px 5px;
}

#vw3_sc_tbl td.selectable_section_header_cell
{
color:#FFFFFF;
font-weight: bold;
font-size: 10pt;
padding: 11px 0px 11px 5px;
background-color: #7DB853; /*light green*/
}



#vw3_sc_tbl td input, #vw3_sc_tbl td select
{
  font-size: 9pt;
  margin: 0px 3px 0px 5px;
}

/* for top paragraph */

div#vw_dendra_usr_dir p#beta
{
  color: #d37936; /* orange */
}

div#beta_alt
{
  display: none;
}


/* for top nav, needs to be down here to overwrite other generic styles */

ul#vw3lists li div.element_description {
display:none;
width: 800px;
height: 72px;
font-size: 10pt;
padding-top: 10px;
color: #126212; /* dark green */
}

ul#vw3lists li div.element_description a
{
  text-decoration: none;
  color: #7DB853; /*light green*/
  font-weight: bold;
}

ul#vw3lists li div.element_description a:hover
{
  color: #126212; /* dark green */
  font-weight: bold;
}



/*********************************************************************/
/* other generic or obsolete styles                                  */
/*********************************************************************/

a {
color: #126212;
}

/* to terminate a list of floating divs or spans */
.no_fl {
display:block;
clear:both;
}

/* to hide or show classless elements */
.on {
display:inline;
}
.off {
display:none;
}

/* obsolete */
.lst3_hd_r {
font-weight: bold;}
.lst3_tdf4, .lst3_hd_tdf4 {}
.lst3_tdf5, .lst3_hd_tdf5 {
display:none;}
.lst3_tdf6, .lst3_hd_tdf6 {
display:none;}


/*********************************************************************/
/* styling for the tabs on the bottom section                        */
/*********************************************************************/

.vw3_tab_div_ttl
{
  width: 200px;
  height: 35px;
  line-height: 35px;
  font-size: 11pt;
  color: #ffffff;
  text-align: center;
  float: left;
  margin-right: 2px;
  background: #ffffff url('images/bottomtab_ltgreen.gif') top left no-repeat;
}

.vw3_tab_div_ttl_sel
{
  width: 200px;
  height: 35px;
  line-height: 35px;
  font-size: 11pt;
  color: #ffffff;
  text-align: center;
  float: left;
  margin-right: 2px;
  background: #ffffff url('images/bottomtab_dkgreen.gif') top left no-repeat;
}

#vw3_rl_tab_div, #vw3_sc_tab_div, #vw3_cr_tab_div
{
  position: relative;
}


#vw3_rl_tab_div_txt
{
  position: absolute;
  top: 35px;
  left: 0px;
}

#vw3_sc_tab_div_txt
{
  position: absolute;
  top: 35px;
  left: 0px;
}

#vw3_cr_tab_div_txt
{
  position: absolute;
  top: 35px;
  left: 0px;
}


.vw3_tab_div_txt
{
  height: 35px;
  width: 825px;
  background: #7DB853; /*light green*/
  color: #ffffff;
  font-size: 10pt;
  padding-left: 15px;
  line-height: 35px;
}


.vw3_tab_div_txt_hidden
{
  display: none;
}



div.popup {
background-color:#ffffff;
border:3px solid #7DB853; /*light green*/
padding: 10px;
color:#126212;
font-size:9pt;
left:1040px;
max-width:300px;
min-width:280px;
position:absolute;
top:345px;
z-index:1000;
}



#close_window, #close_popup {
background-color:#7DB853; /*light green*/
float:left;
padding:5px 8px;
margin-right: 5px;
font-size: 10pt;
}

#close_window a, #close_popup a {
text-decoration: none;
color:#FFFFFF;
font-size: 8pt;
font-weight: bold;
}


.small_text {
color:#7DB853; /*light green*/
font-weight: bold;
font-size:10pt;
font-style: normal;
line-height: 24px;
}

a#vw3_criter_clr
{
  display: block;
  width: 52px;
  height: 16px;
  line-height: 13px;
  text-align: center;
  background: #ffffff url('images/clear_btn_dk_on_white.gif') top left no-repeat;
  padding: 5px 4px 4px 4px;
  margin: 10px 0px 3px;
  color: #ffffff;
  text-decoration: none;
  float: left;
}

span#vw3_rl_tab_div_ttl_cnt
{
  margin-left: 5px;
}



.vw3_tab_div_ttl #filter_clr {
  font-size: 10pt;
  display: block;
  float: right;
  width: 52px;
  height: 16px;
  text-align: center;
  background: #7DB853 url('images/clear_btn_dk.gif') top left no-repeat;
  /*border: 3px solid #126212; /* dark green */
  padding: 4px;
  margin: 6px 6px 0px 0px;
  color: #ffffff;
  text-decoration: none;
  line-height: 13px;
}

.vw3_tab_div_ttl_sel #filter_clr {
  font-size: 10pt;
  display: block;
  float: right;
  width: 52px;
  height: 16px;
  text-align: center;
  /*border: 3px solid #7DB853; /*light green*/
  background: #126212 url('images/clear_btn_lt.gif') top left no-repeat;
  padding: 4px;
  margin: 6px 6px 0px 0px;
  color: #ffffff;
  text-decoration: none;
  line-height: 13px;
}



#tooltip {
background-color:#ffffff;
border:1px solid #126212;
color:#126212;
font-size:9pt;
padding:5px;
text-align: left;
opacity:1;
position:absolute;
z-index:3000;
max-width: 500px;
}

#tooltip_clone {
background-color:#ffffff;
border:1px solid #126212;
text-align: left;
clear:both;
color:#126212;
font-size:9pt;
padding:0;
position:absolute;
z-index:4000;
max-width: 500px;
}

#tooltip_clone div.body {
    padding: 5px;
}