/*************************** style.css ***********************************

 This is the default style-sheet for Pathway Tools.  We recommend that you do
 not modify this file.  Many of these styles are necessary for proper
 functioning of the banner and toolbar.  When a new version of Pathway Tools 
 is installed, this file, along with any changes that you have made, will be
 overwritten.  Sites that run Pathway Tools as a web server and wish to
 customize the styles should instead modify the file
 userWebsiteCustomization.css. That file is loaded in web pages after this 
 style sheet so that any definition here can be overriden by the standard CSS
 mechanism. Keep a copy of your userWebsiteCustomization.css
 file in another location outside the Pathway Tools root before doing a new
 Pathway Tools installation.

 Last modification date of this file: $Date: 2009/03/09 18:03:09 $

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

/* ======================== The banner ========================= */

#ptbanner { 
  width: 100%;
  padding: 0;
  margin: 0;
  border: 0;
  background-color: #FFFFFF;
  background-position: 0px 2px;
  height: 60;
  padding-top: 6px;
  }

#ptbanner a.logo {
  display: block;
  height: 60;
  width: 160;
  float: left;
}

/* The temporary message is made visible by the PathwayTools JavaScript */

div.temporaryMsg {
  display: none;
  border: 0px solid black;
  float: left;
  height: 50px;
  /* The width is modified by the JavaScript */
  width: 0px;
  margin-top: 3px;
  margin-left: 20px;
  margin-bottom: 3px;
  overflow: hidden;
}

/* The color of the current database name, both in the banner and in the
   pull-down menus.
*/
span.dynDBName {
  color: white;
}

span.dynDBName.banner {
 /* color: #6fa84d; */
  color: black;
}

/* searchMenu is Quick Search form */

.searchMenu {
 font-size: 11px;
 color: black; /* #1c2243; */
 padding-bottom: 0px;

text-align: right;
 white-space: nowrap;
}

div.searchMenu {
 font-size: 11px;
 color: black; /* #1c2243; */
 padding-bottom: 0px;
 text-align: right;
 white-space: nowrap;
}

a.searchMenu {
 font-size: 11px;
 color: blue; /* #1c2243; */
 padding-right: 0px;
 padding-bottom: 0px;
 text-align: right;
 white-space: nowrap;
}

form.searchMenu {
 font-size: 11px;
 color: blue; /* #1c2243; */
 padding-bottom: 0px;
 margin: 0;
 text-align: right;
 white-space: nowrap;
}

/* Used for the input text box of the quick search */
input.inputQuickSearch {
     color: black;
     background-color: white;
     white-space: nowrap;
}

.searchButton {
  font-size: 11px;
  background-color: white;
  color: black
}

.searchMenuDatabaseName {
 font-size: 12px;
 color: #1c2243;
 text-align: left;
 white-space: nowrap;
}

span.dynDBName.banner {
  padding: 0 0px 0 0px;
  color: black;
  white-space: nowrap;
}

span.dynDBName.menu {
  padding: 0 0px 0 0px;
  color: white;  
}

div.searchGroupingExternalBox {
 position: relative;
 float:  right; 
 margin: 1px 20px 1px 0px;
 padding: 0;
 text-align: right;
 white-space: nowrap;
}

div.searchGroupingInternalBox {
  margin: 0;
  padding: 1px 3px 1px 3px;
  border: 1px solid #0000ff;
  text-align: left;
  white-space: nowrap;
}

div.searchGroupingInternalBox:hover {
  border: 1px solid #0000ff;
  background-color: #f0f0ff;
}


/* The login links and overlay */

div.logIn {
  position: relative;
  display: none;
  white-space: nowrap;
  font-size: 11px;
  color: #1c2243;
  text-align: right;
  padding-right: 20px;
  padding-left: 0px;
  padding-top: 0px;
  padding-bottom: 0px;
}

.logIn a, .logIn a:visited {
 text-decoration: none;
 color:#1c2243;
 white-space: nowrap;
}

.logIn a:hover, .logIn a:visited:hover {
 text-decoration: underline;
 color:#1c2243;
}

table.logIn {
  border: 0;
  padding: 0 0 0 0;
  margin: 0 0 0 0; 
  font-size: small;
  white-space: nowrap;
}

/* ========== The styles for the top menu bar ========== */

li.yuimenubaritem a.yuimenubaritemlabel {
 font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
 color: white;
 background-color: #181A6F;
}

/* Control such thing as the small triangle that would appear next to a command name */
.yui-skin-sam .yuimenubarnav .yuimenubaritemlabel-hassubmenu {
   background-color: #181A6F;
   background: none;
}

div.yuimenubarnav {
  padding: 0;
  margin:  0;
  color: white;
  background-color: #181A6F;
}

div.yuimenubarnav div.bd {
  color: white;
  background-color: #181A6F;
  text-indent: 0;
  margin-left: 0;
  padding: 0;
  margin: 0;
}

/* Make sure that all li inside the menu have these settings */


/* Colors should only be for menubar div.bd, not for other div.bd elts */
div.yuimenubarnav div.bd li.yuimenubaritem {
  color: white;
  background-color:  #181A6F;
}

/* The style of the selected command in the top menu bar */
div.yuimenubarnav div.bd li.yuimenubaritem-selected {
  background-image: none;
  background-color: #6c6da8;
  border-left:  4px solid #181A6F;
  margin-left: -4px;
}

div.bd li {
  text-indent: 0;
  margin-left: 0;
  padding: 0;
  margin: 0;
}

/* The menu bar */
div.bd > ul {
  color: white;
  background-color: #181A6F;
  padding: 0;
  margin:  0;
  list-style: none;
  border: 0;
}

/* The commands on a menu bar */
div.bd > ul > li {
   color:       white; 
   background-color: #6c6da8;
   font-family: verdana; 
   font-weight: bold; 
   padding: 0 0 0 0; 
   margin: 0 0 0 0;
   border: 0;
}

div.bd div.withDatabase {
   font-family: verdana; 
   padding: 0 1% 1% 3%;
   background-color: #6c6da8;
   color: white;
   border-top:    none;
   border-right:  3px solid #181A6F;
   border-left:   3px solid #181A6F;
   border-bottom: 3px solid #181A6F;
   -moz-border-radius-bottomright: 1em;
   -moz-border-radius-bottomleft: 1em;
}

div.bd div.bd > ul {
  font-family: verdana; 
  background-color: white; 
  border-top:       none; 
  border-right:  1px solid #43362c;
  border-left:   1px solid #43362c;
  border-bottom: 1px solid #43362c;
  padding: 0;
  margin: 0
}

/* The commands in a first level menu */
div.bd div.bd > ul li {
  font-family: verdana; 
  background-color: white; 
  color: #43362c;
  border-top:   none;
  border-bottom: 1px solid #43362c; 
  /* Keep top and bottom padding small to prevent menu sizing weirdness */
  padding: 1px 10px 1px 10px;
  margin: 0 0 0 0; 
}

/* IE6 ignores the > selector, so we have to try specifying the
   background-color a different way...
 */
li.yuimenuitem {
  background-color: white; 
}

/* The commands in a first level menu */
div.bd div.bd > ul li > a {
  font-family: verdana; 
  border:   none;
  padding: 0 0 0 0;
  margin:  0 0 0 0; 
}

table.menuDatabase {
   font-family: verdana; 
   text-align: left; 
   margin:  0 0 0 0; 
   padding: 0;
   color:   white; 
   border:  0  
}

/* For any anchor inside a table for the menu database name (e.g. change) */
table.menuDatabase a {
   font-family:     verdana; 
   font-size:       small;
   text-align:      left; 
   text-decoration: underline;
   margin:  0 0 0 0; 
   padding: 0 0 0 0;
   color:   white; 
   border:  0  
}

/* The highlight color when the user mouses over one of the menu items */

div.bd div.bd > ul li:hover {
   background-color: #f0f0ff;
}

/* =========  End of styles for the top menu bar ========== */

/* ============ Style for Organism Selector dialog ==================== */
/* (I can't figure out how to define these in a non-universal way, though.
    It should be ok because we don't use the YUI layout manager anywhere else)
 */


.yui-skin-sam .yui-layout .yui-layout-unit-left div.yui-layout-bd {
    border: none;
}
.yui-skin-sam .yui-layout .yui-layout-unit-right div.yui-layout-bd {
    padding-left: 10px;
    border: none;
}
.yui-skin-sam .yui-layout .yui-layout-unit-center div.yui-layout-bd {
    padding-left: 2px;
    border:1px solid #000;
}

#orgselectorAutoComplete {
    width:39em; /* set width here or else widget will expand to fit its container */
    padding-bottom:20em; /* allow enough real estate for the container */
}
.yui-skin-sam .yui-ac-content { /* set scrolling */
    max-height:18em;overflow:auto;overflow-x:hidden; /* set scrolling */
    /* _height:18em;  ie6 */
}
#orgselectorAutoComplete .yui-ac-input {
  font-weight: bold;
  font-size: 90%;
}

#orgselectorAutoComplete .yui-ac-container {
  top: 1.9em;
  left: .3em;
  width: 96%;
}

/*================ End of styles for Organism Selector dialog ============== */

/*================ Styles for side bar ============== */

a.sideBar {
  white-space: nowrap;
  font-size: 11px;
  text-decoration: none;
}

a.sideBar:hover {
  text-decoration: underline;
  color: blue;
  cursor: pointer;
}


/*================ End of Styles for side bar ============== */




/* ========== The default styles for the other web pages. =============== */

body {
 font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
 /* Note, the JavaScript in pathwayTools.js will dynamically make it visible. 
    This avoids flickering of the page.
   */

 background-color: #ffffff; /* white */

 font-size: 13px;
 color: #333333;
 line-height: 16px;

 padding: 0px 0px 0px 0px;
 margin:  0;
}

/* Use this class for pages that don't include the banner, and therefore
   shouldn't show up invisible (because they don't have the javascript to 
   make them visible).  Examples of pages like this are those that are
   internal frames of pages, such as the omics viewer or the evidence popup.
*/
body.noBanner {
 visibility: visible;
 background-color: #ffffff; /* white */
 padding: 5px;
 margin:  0;
}

/* For static pages only */
div.pageContentStatic {
  padding-left:  0.25in;
  padding-right: 0.25in;
  padding-top:    10px;
  padding-bottom: 10px;
} 

/* For dynamic pages only */
div.pageContentDynamic {
  padding-left:   15px;
  padding-right:  15px;
  padding-top:    15px;
  padding-bottom: 15px;
} 

.header {
  font-size: large;
  font-weight: bold;
}

table.footer {
  font-size: small;
}

table {
 font-size: 13px;
}

table.small {
 font-size: small;
}

pre, code {
 font-family: Courier, monospace;
}

input.orange {
  color: black;
  background-color: #ff9900;  /* orange */
}

input.plain {
 color: black;
 background-color: white;
}


/* For paragraphs generated as part of a CLIM page, indent all lines other */
/* than the first one.                                                     */
P.ecoparagraph
	{
	margin-left: 2em;
	text-indent: -2em;
	}

/* For paragraphs internal to a comment field, indent the whole thing */
P.ecocomment
	{
	margin-left: 2em;
	}

/* For "subtitles" where we don't want a linebreak afterwards */
B.embeddedSubtitle
	{
	font-weight: bold;
	font-size: large;
	text-decoration: none;
	}
/* Center the buttons that ptools produces as part of a CLIM page (as 
   opposed to the ones in the various forms)        
*/
.ecobuttons {
 text-align: center;
}

/* Quick Search Results page uses th for section names in table
   that also contains descriptions of page contents.
 */

th {
  font-weight: bold;
  font-size: larger;
  vertical-align: top;
}

/* paley:Feb-26-2008 This sets the background color for the overlib popups */
.overlibFGClass {background-color: #EEEEFF;}

/* Used to control alternating background colors for the rows of some of the tables.
   In particular for the results of Search pages, SAQP (and BioVelo).

*/

tr.trLight {background-color: white;   font-size: 100%; border: 1px solid black }
tr.trDark  {background-color: #F6F5D9; font-size: 100%; border: 1px solid black }

table.sortableSAQPoutputTable {
   border: 1px solid black;
   background-color: white;
   border-collapse: collapse;
}

table.sortableSAQPoutputTable td {
   border: 1px solid black;
   border-collapse: collapse;
   padding: 0 5px 0 5px;
}

table.sortableSAQPoutputTable a {
   text-decoration: none;
}

table.sortableSAQPoutputTable a:hover {
   text-decoration: underline;
   cursor: pointer;
}

/* This is required for IE. Dynamically changing it will not work */
span.triangleSort {
  cursor: pointer;
  color: blue;
  font-size: 100%
}


/* Latendre: Jan-23-2008 

The following styles are used in SAQP.

*/

a.BioVeloQueryOutSAQP {
  font-size: 100%;
  font-family: monospace;
  text-decoration: none; /* no underline for anchor */
} 

div.errorMsgContainer {
   background-color: white;
   color: red;
   font-size: 120%;
}

select.SAQP {
 /* possible values: dotted dashed solid double groove ridge inset outset */	
  border-style: solid; 
  border-width: 1px;
}

/* For reproducing the BioVelo query back to the user, e.g., output result of a query. */
span.BioVeloQueryOutSAQP {
  font-size: 90%;
  font-family: monospace;
  text-decoration: none;
  color: blue;
  background-color: white;
  border: 0px solid black;
  cursor: pointer;
}

span.BioVeloQueryOutSAQP:hover {
  text-decoration: underline;
}


/* For reproducing the BioVelo query back to the user, e.g., output result of a query for searches. */
span.BioVeloQueryOutSearch {
  width: 100%;
  white-space: wrap;
  font-size: 90%;
  font-family: monospace;
  text-decoration: none;
  color: blue;
  background-color: white;
  border: 0px solid black;
  cursor: pointer;
}

span.BioVeloQueryOutSearch:hover {
  text-decoration: underline;
}

/* Appearance of search components in SAQP */
div.searchComponent { 
 border:  2px solid black;
 padding: 3px;
 white-space: nowrap;
}

/* Appearance of where clause in a search component */
div.whereClause { 
   border:  1px solid black; 
   padding: 3px;
   white-space: nowrap;
}

/* Appearance of boxes to enter numbers, texts, etc. in a search component */
input.textBox { 
  background-color: white
}

/* Appearance of slots that are of type list of frames or frames. */

option.saqpSelectFrame {
  background-color: white
}

table.saqpColumnSpecification {
  border : 1px solid black;
  white-space: nowrap;
}