/* Removed unused YUI references to reduce 404 errors in logs */
/* ===================================================================
   The particular style for BioCyc, MetaCyc, EcoCyc, and 
   HumanCyc dynamic and static pages.
   The following overrides or extends whatever is in style.css
   =================================================================== */

h1 {
 font-size: 18px;
 text-transform: uppercase;
 /* bannerStyle will change the color for organism specific colors */
 color: #70880;
 font-weight: normal;
 margin-top: 25px;
}

h2 {
 font-size: 16px;
 font-weight: bold; 
 color: #333333;
 margin-top: 20px;
}

h3 {
 font-size: 14px;
 font-weight: bold;
 color: #333333;
 margin-top: 20px;
}

body.MainPage {
 font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
 margin: 0;
 padding: 0;
 font-size: 13px;
 color: #333333;
 line-height: 16px;
}

body.MainPage div.pageContent {
  padding-left:  0px;
  padding-right: 0px;
} 

body.MainPage hr {
 color:#ffffff;
 border-top-width: 1px;
 border-top-style: solid;
 border-top-color: #999999;
}

body.MainPage a {
 color:#003399
}

body.MainPage tr {
  vertical-align:top;
}

.newsText {
 font-size: 11px;
 line-height: 17px;
 margin-top: 10px;
 margin-bottom: 10px;
}

.mainMenu {
 font-size: 12px;
 font-weight: bold;
 text-transform: uppercase;
 color: #FF9900;
 text-align: center;
 padding-top:    5px;
 padding-right: 18px;
 padding-bottom: 5px;
 padding-left:   5px;
 letter-spacing: 1px;
}

.mainMenu a, .mainMenu a:visited {
 text-decoration: none;
 color:#FF9900;
}

.mainMenu a:hover, .mainMenu a:visited:hover {
 text-decoration: underline;
 color:#FFFFFF;
}

.bodyText {
 font-size: 13px;
 color: #333333;
 line-height: 16px;
 margin-top: 10px;
 margin-bottom: 10px;
}

.footer {
 font-size: 10px;
 text-align: center;
}

.caption {
 font-size: 11px;
 color: #333333;
 line-height: 14px;
 margin-top: 10px;
 margin-bottom: 10px;
}

/********  LIST  ********/
/* CSS style bug
Mario and I determined that there is some suboptimal arrangement of
styles here. In particular, when there is a list element with a
paragraph element (i.e., "<li><p>"), the resulting combination does
not display correctly. The visual glitch is that there is a bullet
point, and the text shows up underneath (and sometimes underneath and
to the right) the bullet on the next line. This combination of HTML
elements was found in the auto-generated HTML from TeX2Page, which we
are using for our web-based guides. We traced the glitch down to this
section of the CSS specification. We believe that there is no need for
the "list-style-position: inside" directive below. It is used in
conjunction with the "text-indent: -16px;" directive below it to
simulate a normal layout for an unordered list. My experiments have
shown that overriding both of these values to their defaults (outside
and 0 px, respectively) in the guide pages leads to a normal-looking
layout. Further work should be done to solve this difinitively and
validate that the change doesn't mess up any other layout on the site.
taltman:Jul-22-2010 
*/


ul {
 padding: 0;
 margin: 0;
 list-style-position: inside;
}

ul li {
 list-style-type: disc;
 text-indent: -16px;
 margin-left: 30px;
} 

.bullet1 {
 font-size: 13px;
 color: #333333;
}

.bullet2 {
 font-size: 12px;
}

.bullet3 {
 font-size: 11px;
 line-height: 18px;
 margin-top: 10px;
 margin-bottom: 10px;
}

/********  TABLE  ********/
/* adds margin around the table */
table.one {
 margin-bottom: 10px;
 margin-top: 10px;
}

/* need some slight style for the upper-left corner of the table.
See ecocyc/release-notes.shtml for an example. taltman:Feb-10-2009 */
td.corner {
 border-bottom-width: 1px;
 border-right-width: 1px;
 border-bottom-style: solid;
 border-right-style: solid;
 border-bottom-color: #999999;
 border-right-color: #999999;
}

/* Row one - Header table cell in blue color */
/* taltman:Feb-10-2009 Structurally, this should be the style for <th>, not <td>! */
td.spec1 {
 color: #FFFFFF;
 text-align: center;
 padding: 6px 6px 6px 12px;
 background-color: #4C4E97;
 text-transform: uppercase;
 font-size: 14px;
 border-top-width: 1px;
 border-right-width: 1px;
 border-bottom-width: 1px;
 border-top-style: solid;
 border-right-style: solid;
 border-bottom-style: solid;
 border-top-color: #999999;
 border-right-color: #999999;
 border-bottom-color: #999999;
}

/* Use EcoCyc background color */
.ECOLI td.spec1 {
 background-color: #336699;
}

/* Column 1 - First column on the left in orange color */
td.spec2 {
 color: #000000;
 font-size: 14px;
 font-weight: bold;
 background-color: #F6BE86;
 padding: 6px 6px 6px 12px;
 border-top-width: 0;
 border-right-width: 1px;
 border-bottom-width: 1px;
 border-left-width: 1px;
 border-right-style: solid;
 border-bottom-style: solid;
 border-left-style: solid;
 border-right-color: #999999;
 border-bottom-color: #999999;
 border-left-color: #999999;
}

/*Table: For the top row*/
td.spec2Top {
 color: #000000;
 font-size: 14px;
 font-weight: bold;
 background-color: #F6BE86;
 text-align: center;
 padding: 6px 6px 6px 12px;
 border: 1px solid #999999;
}

/* Center table cell in white color. Borders only on right side and bottom */
td.text1 {
 padding: 6px 6px 6px 12px;
 font-size: 12px;
 border-right-width: 1px;
 border-bottom-width: 1px;
 border-right-style: solid;
 border-bottom-style: solid;
 border-right-color: #999999;
 border-bottom-color: #999999;
 color: #333333;
}

/* Same as text1, but add the left border and yellow background -- used for 
   EcoCyc pages. */
td.text2 {
 padding: 6px 6px 6px 12px;
 font-size: 12px;
 border-right-width: 1px;
 border-bottom-width: 1px;
 border-right-style: solid;
 border-bottom-style: solid;
 border-right-color: #999999;
 border-bottom-color: #999999;
 color: #333333;
 border-left-width: 1px;
 border-left-style: solid;
 border-left-color: #999999;
 background-color: #FFFbAf;
}

/* Footer table cell in white color. Borders only on right, left and bottom */
td.footer1 {
	font-size: 12px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-right-style: solid;
	border-bottom-style: solid;
	border-right-color: #999999;
	border-bottom-color: #999999;
	color: #333333;
	border-left-width: 1px;
	border-left-style: solid;
	border-left-color: #999999;
	padding-right: 6px;
	padding-left: 12px;
}

/*Table: For the top row*/
td.text1Top {
 padding: 6px 6px 6px 12px;
 font-size: 12px;
 border-right-width: 1px;
 border-bottom-width: 1px;
 border-right-style: solid;
 border-bottom-style: solid;
 border-right-color: #999999;
 border-bottom-color: #999999;
 color: #333333;
 border-top-width: 1px;
 border-top-style: solid;
 border-top-color: #999999;
}

tr.top1 {
 border-top-width: 1px;
 border-top-style: solid;
 border-top-color: #A6C4E1;
}


/* ======= End of styles for the index page of Pathway Tools ====== */
table.footer {
  font-size: small;
  background-color: #708f80;
}

.ECOLI table.footer, .META table.footer, .HUMAN table.footer {
  background-color: #FFFFFF;
}

/* For pages that have the species in the header, we don't want it all
   uppercased.
 */
div.pageContentDynamic h1, h1.wspecies {
  text-transform: none;
}

/* ************************************************************************
   Default banner styling, for all organisms (or any that don't have more
   specific styles defined below).  More default styling can be found in
   style.css.
   ************************************************************************
*/
#ptbanner { 
  width: 100%;
  padding: 0;
  margin: 0;
  border: 0;
  background-color: #708f80;
  background-position: 0px 2px;
  height: 70px;
  padding-top: 6px;
}

#ptbanner a.logo {
  background-image: url("ptools.png");
  background-repeat: no-repeat;
  display: block;
  height: 60px;
  width: 220px;
  float: left;
}

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


/* Overrides of colors in generic banner */
div.searchGroupingInternalBox {
  border: 1px solid rgb(251,203,154);
}

div.searchGroupingInternalBox:hover {
  background-color: rgb(226,113,0);
}

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

/* For ptools-xml guide */
div.codebox {
  background-color: #F6BE86;
  border-width: 1px;
  border-style: solid;
  font-size: 12px;
  padding: 6px 6px 6px 12px;
  font-family: "Lucida Console", Monaco, monospace;
  margin: 0px 100px 0px 50px;
  white-space: pre;
}

/* Tab styling for organism selector */
.yui-skin-sam .yui-navset .yui-nav,
.yui-skin-sam .yui-navset .yui-navset-top .yui-nav { /* protect nested tabviews from other orientations */
    border:solid #e27100; /* color between tab list and content */
    border-width:0 0 5px;
    Xposition:relative;
    zoom:1;
}

.yui-skin-sam .yui-navset .yui-nav .selected a, 
.yui-skin-sam .yui-navset .yui-nav .selected a:focus, /* no focus effect for selected */ 
.yui-skin-sam .yui-navset .yui-nav .selected a:hover { /* no hover effect for selected */ 
  background:#e27100 url("/orangegradient.png") repeat-x left; /* selected tab background */ 
  color:#000000; 
} 

.yui-skin-sam .yui-navset .yui-nav a:hover,
.yui-skin-sam .yui-navset .yui-nav a:focus {
    background:#fbcb9a url("/lightorangegradient.png") repeat-x left; /* selected tab background */
    outline:0;
}

.yui-skin-sam .yui-navset .yui-content {
    background:#fafafa; /* content background color */
}

/* ************************************************************************
   PGDB-specific banner styling -- specify the orgid as the class 
   ************************************************************************
*/

/* For ECOLI */
.ECOLI body.MainPage {
  background-color: white;
}

.ECOLI #ptbanner { 
  background-color: #FFFFFF;
}

.ECOLI #ptbanner a.logo {
  background-image: url("/EcoCyc.gif");
  background-repeat: no-repeat;
  background-position: 0px -6px;
  display: block;
  width: 220px;
  float: left;
}

.ECOLI h1 {
   color: #336699;
}

.ECOLI table.footer {
  background-color: white;
}

/*  For META */
.META body.MainPage  {
 background-color: white;
}

.META #ptbanner { 
  background-color: #FFFFFF;
}

.META #ptbanner a.logo {
  background-image: url("/MetaCyc.gif");
  background-repeat: no-repeat;
  background-position: 0px -6px;
  display: block;
  width: 220px;
  float: left;
}

.META h1 {
   color: #6fa84d;
}

.META table.footer {
  background-color: white;
}

/* For HUMAN */
.HUMAN body.MainPage {
 background-color: white;
}

.HUMAN #ptbanner { 
  background-color: #FFFFFF;
}

.HUMAN #ptbanner a.logo {
  background-image: url("/HumanCyc.gif");
  background-repeat: no-repeat;
  background-position: 0px -6px;
  display: block;
  width: 220px;
  float: left;
}

.HUMAN table.footer {
  background-color: white;
}

.HUMAN h1 {
   color: #ca3827;
}

/* For BSUB */
.BSUB body.MainPage {
  background-color: white;
}

.BSUB #ptbanner { 
  background-color: #FFFFFF;
}

.BSUB #ptbanner a.logo {
  background-image: url("/bsubcyc/BsubCyc.gif");
  background-repeat: no-repeat;
  background-position: 0px -6px;
  display: block;
  width: 220px;
  float: left;
}

.BSUB h1 {
   color: #530093;
}

.BSUB table.footer {
  background-color: white;
}

/* PortEco logos */
.ECOL316407 #ptbanner a.logo {
  background-image: url("/BioCyc_PortEco.gif");
  background-repeat: no-repeat;
  background-position: 0px -2px;
  display: block;
  width: 369px;
  float: left;
}

/* The color of the current database name only in the banner.
*/
.ECOLI span.dynDBName.banner {
  /* color: #336699; */
  color: black;
}

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

.HUMAN span.dynDBName.banner {
 /* color: #ca3827; */
  color: black;
}

.BSUB span.dynDBName.banner {
  /* color: #530093; */
  color: black;
}

/* Toolbar color */
.ECOLI div.yuimenubarnav div.bd li.yuimenubaritem, .ECOLI div.bd ul.toolbar {
  background-color:  #336699;
}

.META div.yuimenubarnav div.bd li.yuimenubaritem, .META div.bd ul.toolbar {
  background-color:  #6fa84d;
}

.HUMAN div.yuimenubarnav div.bd li.yuimenubaritem, .HUMAN div.bd ul.toolbar {
  background-color:  #ca3827;
}

.BSUB div.yuimenubarnav div.bd li.yuimenubaritem, .BSUB div.bd ul.toolbar {
  background-color:  #530093;
}

/* Use a slightly different background color for the object-specific menus */
.ECOLI div.yuimenubarnav .bd ul.toolbar li.objMenu {
    background-color: #5C85AD;
}

.META div.yuimenubarnav .bd ul.toolbar li.objMenu {
    background-color: #59863e;
}

.HUMAN div.yuimenubarnav .bd ul.toolbar li.objMenu {
    background-color: #da7468;
}

.BSUB div.yuimenubarnav .bd ul.toolbar li.objMenu {
    background-color: #874db3;
}

/* The box around the pull-down menu that lists the current database, and
   the color of the selected item on the menubar */
.ECOLI div.bd div.withDatabase, .ECOLI div.yuimenubarnav div.bd ul.toolbar li.yuimenubaritem-selected {
   background-color: #8DA6BF;
   border-left:  4px solid #336699;
}

.ECOLI div.bd div.withDatabase {
   border-right:  3px solid #336699;
   border-left:   3px solid #336699;
   border-bottom: 3px solid #336699;
}

.META div.bd div.withDatabase, .META div.yuimenubarnav div.bd ul.toolbar li.yuimenubaritem-selected  {
   background-color: #CAE5BB;
   border-left:  4px solid #6fa84d;
}

.META div.bd div.withDatabase {
   border-right:  3px solid #6fa84d;
   border-left:   3px solid #6fa84d;
   border-bottom: 3px solid #6fa84d;
}

.META table.menuDatabase, .META table.menuDatabase a, .META div.yuimenubarnav div.bd .yuimenubaritemlabel-selected {
   color:   black; 
}

.HUMAN div.bd div.withDatabase, .HUMAN div.yuimenubarnav div.bd ul.toolbar li.yuimenubaritem-selected  {
   background-color: #DCA8A2;
   border-left:  4px solid #ca3827;
}

.HUMAN div.bd div.withDatabase {
   border-right:  3px solid #ca3827;
   border-left:   3px solid #ca3827;
   border-bottom: 3px solid #ca3827;
}

.BSUB div.bd div.withDatabase, .BSUB div.yuimenubarnav div.bd ul.toolbar li.yuimenubaritem-selected {
   background-color: #761BBF;
   border-left:  4px solid #530093;
}

.BSUB div.bd div.withDatabase {
   border-right:  3px solid #530093;
   border-left:   3px solid #530093;
   border-bottom: 3px solid #530093;
}


/* The highlight color when the user mouses over one of the menu items.
   These won't work for IE6, which doesn't support the > selector.
 */
.ECOLI div.bd div.bd > ul li:hover {
   background-color: #FFFbAf;
}

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

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

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

/* The search field header bars for the search pages */
.ECOLI .open { 
   background-color: #A0B6CB; 
}

.META .open { 
   background-color: #A3B998; 
}

.HUMAN .open { 
   background-color: #CA9D97; 
}

.BSUB .open { 
   background-color: #9F78EF; 
}

/* The box surrounding the Quick Search form */
.ECOLI div.searchGroupingInternalBox {
  border-color: #181A6F;
}

.ECOLI div.searchGroupingInternalBox:hover {
  background-color: #FFFbAf;
}

.META div.searchGroupingInternalBox {
  border-color: #181A6F;
}

.META div.searchGroupingInternalBox:hover {
  background-color: #CAE5BB;
}

.HUMAN div.searchGroupingInternalBox {
  border-color: #181A6F;
}

.HUMAN div.searchGroupingInternalBox:hover {
  background-color: #FFF5C3;
}

.BSUB div.searchGroupingInternalBox {
  border-color: #530093;
}

.BSUB div.searchGroupingInternalBox:hover {
  background-color: #BFBFBF;
}

.PortEcoButton {
  background-color: #adc5ef;
}

table .download { border-collapse:collapse; border:0px solid black }
.download {text-align:center}
.download th {padding:5px; vertical-align:bottom}
.download td {padding:5px 10px;}

