body                        {}

#page-name                  { padding: 40px 0 0 40px;}
#page-ext-links img         { margin: 20px 5px 0 0;}
#gallery-popup-image        { display:none;}


/*
FRAME BOX
*/
.frame-box                  { border: 2px solid #888; border-radius: 10px; box-shadow: 2px 2px 1px #bbb;}
                          
.frame-box-header           { left: 30px; top: 10px; position:relative; z-index:100;}
.frame-box-header span      { border: 2px solid #ddd; padding: 1px 5px; background: #fff;}

.red-button                 { background-color: Red; border-radius: 3px;}
.green-button               { background-color: Green; border-radius: 3px;}
.back-yellow                { background-color: yellow;}

/*
NEW TAXON LISTS
*/
#request-panel              { overflow:hidden;}
#request-frame              { position: absolute; top: 20px; bottom: 10px; left: 10px; right: 10px; padding: 20px /*30px #174*/ 0 5px 0;}
#request-box-header         { top: 2px;}   
                          
.box-link                   { margin:2px 0 0 0; right:20px; top: 2px; position:absolute; text-align:right; font-size:11pt;
                              z-index:100;}
.box-link a                 { font-size: 10pt;}

.taxon-panel-top            { position: absolute; top: 0; height: 165px; left: 5px; right: 5px; overflow: hidden;}

.taxon-panel-title          { font-size: x-large; font-weight: bold; margin: 0 0 5px 0;}

.taxon-panel-description    { font-size: small;}
.taxon-panel-description span
                            { font-weight: bold;}
                        
#family-hierarchy-panel     { width:100%; position:absolute; bottom: 25px;}
#family-hierarchy-panel select 
                            { font-size:small; width:100%;}

.taxon-panel-filter         { left: 0; right: 0; bottom: 0; position: absolute;}

.taxon-panel-filter input   { width:100%; border: 1px solid #000;
                              box-sizing: border-box; -moz-box-sizing:border-box; -webkit-box-sizing: border-box;}
                                                
.taxon-panel-filter input::-webkit-input-placeholder
                            { color: #33c; font-style:italic;}
                        
.taxon-panel-filter input:-ms-input-placeholder
                            { color: #33c; font-style:italic;}
                        
.taxon-panel-filter input:-moz-placeholder
                            { color: #33c; font-style:italic;}
.taxon-panel-filter input::-moz-placeholder
                            { color: #33c; font-style:italic;}
                        
.taxon-panel-list           { position: absolute; top: 167px; bottom: 0px; left: 5px; right: 5px; overflow: auto;
                              border: 1px solid #000;}

.taxon-panel-list ul        { font-size: medium; list-style-type: none; 
                              padding-left: 5px; margin-top: 2px; 
                              white-space: nowrap;
                              float: left; /*need this to make all li's the same max width*/}

.taxon-panel-list li        { border: 1px solid transparent; cursor: pointer; padding-left: 2px;
                            /*width: 100%;*/}

.taxon-panel-list li:hover  { background-color: #DDECFE; /*#F3F7FD;*/ border: 1px solid #83AADA; /*#BBD8FB;*/ 
                              opacity: 0.7;}
                            

/*.taxon-panel-list ul li a
                        { text-decoration: none;}
*/
.taxon-panel-list li.taxon-selected
                            { background-color: #99CCFF; /*#DDECFE;*/ border: 1px solid #446688; /*#83AADA;*/}


li.tl-s                     { font-weight: lighter; color: Gray;}
li.tl-a                     { font-weight: bold;}
li.tl-i                     {}
li.tl-r                     {}
span.t-p                    { padding-left: 20px;}
span.t-n                    {}
span.t-a                    {}
span.t-i                    { width: 16px; display:inline-block;}
span.t-i img                { vertical-align:middle; margin-bottom: 2px;}
span.t-cn                   { font-size: smaller; font-weight: normal;}

#family-panel               {}
#family-filter              {}
#family-list                {}

.taxon-panel-paging         {font-size:0.8em; font-weight:bolder;}

/*
FILTERS COMMON
*/
.query-box                  { min-width: 790px; max-width: 790px; margin: 10px 0; position:relative; padding-right: 15px;}
/*
STATE QUERY MAP
*/
#state-query-map-panel      { margin-top: -7px;}

#state-query-map-frame      { top:20px; padding:0 5px 10px 5px;}
.state-map area             { cursor: pointer;}

/*
ZIP CODE SEARCH
*/
#location-search-panel .frame-box,
#zipcode-search-panel .frame-box
                            { padding: 10px 5px;}

/*
FAMILY KEY
*/
#fa-panel                   {}
#fa-panel .frame-box        { padding: 5px 5px 10px 5px;}
.fa-selected                { background-color: #cfc; border: 1px solid #484;}
.fa-attribute a             { padding: 0 5px;}

/*
BIO ATTRIBUTES
*/
#ba-query-panel             {}
#ba-query-panel .frame-box  { padding: 5px 5px 10px 5px;}
.ba-selected                { background-color: #cfc; border: 1px solid #484;} 
.ba-att a                   { padding: 0 5px;}

/*
SELECTED FILTERS
*/
#query-selection-panel      {}
#query-selection-panel .frame-box  
                            { padding: 5px 5px 10px 5px;}

.query-selected-title       { width: 120px;}
/*
TAXON DETAILS
*/
#taxon-details-panel        { max-width: 910px;}
#external-search-menu       {display: none; position:absolute; border: 1px solid #000; background-color:#FFF; width:auto;
                             padding:0; margin:0; /*right:5px; z-index:999;*/}
#external-search-menu a     {text-decoration:none; color:#000; width:100%; display:inline-block;}
#external-search-menu ul    {list-style-type: none; padding:0; margin:0;}
#external-search-menu li    {padding:0px 5px; /*cursor:pointer;*/ white-space:nowrap; width:auto;}
#external-search-menu li:hover      
                            {background-color: #9CF;}

#speciesHeader              { font-size: 1.1em; margin-bottom:10px;}

#state-refs-panel
.frame-box                  { padding: 10px 5px;}

/*
GALLERY
*/
#galleryPanel               { margin-top:5px;}
#taxonGallery img           { /*width: 92px;*/ max-width: 92px;}
.picturePagingPanel         { display: inline; font-size: small; font-family: Sans-Serif;}

/*
CUSTOM LAYOUTS (TODO:review)
*/
#view-frame                 { border: 0;}

#header-tool-bar            { overflow: hidden; width: 1920px;}
/*
#header-tool-bar div        { overflow: hidden;}
*/
#select-query-panel         { float: left; height: 60px; /*min-width: 600px; vertical-align: middle;*/ margin-left: 5px; padding-left: 2px;
                              background: #99CCFF;}
#select-query-panel div     { float: left;}
#select-query-panel button  { background: #FFF; margin-top: 2px; margin-left: 2px; width: 100%; 
                              /*vertical-align: middle; height: 16px; margin: 22px 2px 0 2px; width: auto;*/}
                              
#q-options, #q-hint         { float: left; /*width: 48%;*/ padding: 0; margin: 0 0px 0 0px; height: 60px; 
                              vertical-align: middle; line-height: 60px;}

#q-options                  { line-height: normal; font-size: 10pt;}
#q-options label            { padding: 1px; line-height: normal; color: #fff; font-weight: bold;}
#q-options select           { width: 170px;}

#select-synonym-panel, 
#select-author-panel, 
#select-cname-panel, 
#select-pagesize-panel      { float: left; /*width: 200px;*/ padding: 5px 8px 20px 10px; margin: 0; background: #99CCFF; /*#008000;*/}

#select-pagesize-panel select
                            { width: 80px;}

#opt-image                  { float: left; padding: 0; margin: 0;}

#q-hint div                 { background: #99CCFF; text-align: center; vertical-align: middle; height: 60px;}

#related-links              { float: left; text-align: left; margin: 0 5px 0 5px;}

#map-color-key              { display: none;}