/* -------------------------------------------------------------------
 *  CSS for HTML pages with CurlySMILES encoding examples            |
 *                                                                   |
 *  ----------------------------------------------------------------*/
h1#h1_title {background: #FFFFFF; font-family: arial; font-size: x-large; 
             font-weight: bold;}

table#menu-bar {border-collapse: collapse; border: 1px outset #FFFFFF;}
table#menu-bar td.td-navigat {border: 3px solid lavender; padding: 0.3em; background: lightcyan;}
table#menu-bar td.td-navigat a.a-navigat:link {font: menu; color: navy;}
table#menu-bar td.td-navigat a.a-navigat:visited {font: menu;}



/* ===================================================================
 * TABLE at head
 * ================================================================ */
table#top-banner {border-collapse: collapse; 
                      border: 0px outset #FFFFFF;}
table#top-banner td {border: 0px solid gray; padding: 0.3em;}
td#logo {width: 200px; }
td#top-title {width: 500px;}

table#tbl-axeleratio {border-collapse: collapse; 
                      border: 0px outset #FFFFFF;}
table#tbl-axeleratio td {border: 0px solid gray; padding: 0.1em;}

table#tbl-axeleratio td.td-axeleratio {align: center; color: olive; font-family: arial;
      font-size: 36px; font-weight: bold;}
table#tbl-axeleratio td.td-digchem {align: center; color: olive; font-family: arial; 
      font-style: italic; font-weight: bold; font-size: 16px;}


/* ===================================================================
 * TABLE 
 * ================================================================ */
table#tbl_main-table {border-collapse: collapse; 
                      border: 0px outset #FFFFFF;}
table#tbl_main-table td {border: 0px solid gray;}
td#td_col-left {padding: 0.3em; width: 200px; valign: top;}
td#td_col-center {padding: 0.3em; width: 500px; valign: top;}
td#td_col-right {padding: 0.3em; valign: top;}


/* ===================================================================
 * LEFT COLUMN
 * ================================================================ */
p#leftcol-links {font-family: arial; font-size: 10px;}

p#leftcol-fieldtrip {border: 1px solid gray; width: 175px; padding: 0.1em; 
                  font-family: arial; font-size: 10px;}
span#title-fieldtrip {color: darkgreen; font-family: arial; font-size: 12px; 
                     font-weight: bold;}
span#text-fieldtrip {color: olive; font-family: arial; font-weight: bold; font-size: 11px;}


p#leftcol-termnomen {border: 1px solid gray; width: 175px; padding: 0.1em; 
                  font-family: arial; font-size: 10px;}
span#title-termnomen {color: darkgreen; font-family: arial; font-size: 12px; 
                     font-weight: bold;}
span#text-termnomen {color: olive; font-family: arial; font-weight: bold; font-size: 11px;}






/* ===================================================================
 * SPAN for chemical names and codes
 * ================================================================ */
span.emph {color: olive; font-family: arial; font-size: 14px; 
               font-weight: bold;}
span.chemname {color: maroon; font-family: arial; font-size: 14px; 
                     font-weight: bold;}
span.curly {color: purple; font-family: monospace; font-size: 16px;
            font-weight: bold;}
span.code {color: black; font-family: monospace; font-size: 16px; 
           font-weight: bold;}
span.hint {color: maroon; font-family: arial; font-size: 14px; 
                     font-weight: bold;}


em.section-title {color: darkgreen; font-family: arial; font-size: 14px; 
               font-weight: bold; font-style: normal;}

/* ===================================================================
 * TABLE with explaining text and encoding examples
 * ================================================================ */
table#text-and-examples {border-collapse: collapse; border: 1px outset #FFFFFF;}
table#text-and-examples td {padding-left: 1.5em; padding-right: 1.5em; 
          background: #FFFFFF;}
table#text-and-examples td.text {font-family: arial; font-size: 14px;}
table#text-and-examples td.example {align: center;}

table#text-and-examples > td.example > table.tbl-example {border-collapse: collapse;
                             border: 1px outset #FFFFFF;}

/* ===================================================================
 * REFERENCES
 * ================================================================ */
p#bibliography {padding-left: 1.5em; padding-right: 3.0em; background: #FFFFFF; 
          font-family: arial; font-size: 14px;}
p.hdline-ref {font-size: 16px; font-family: arial; font-weight: bold;}
table.references {border-collapse: collapse; border: 1px outset #FFFFFF;
                  background: #FFFFFF;}

table.references td.tdRefKey {width: 5%; vertical-align: top; text-align: left;
                              font-family: arial; font-size: 12px;}

table.references td.tdRefArticle {width: 95%; text-align: left; font-family: arial;
                                font-size: 12px;}
table.references td.tdRefArticle em.refArticleAuth {font-style: normal;}
table.references td.tdRefArticle b.refArticleTitle {font-weight: bold;}
table.references td.tdRefArticle em.refArticleJrn {font-style: italic;}
table.references td.tdRefArticle em.refArticleVol {font-style: italic;}
table.references td.tdRefArticle em.refArticlePages {font-style: normal;}
table.references td.tdRefArticle b.refArticleYear {font-weight: bold;}
table.references td.tdRefArticle span.doi {color: darkblue; font-size: 10px; font-weight: bold;}
table.references td.tdRefArticle span.pdf {color: darkblue; font-size: 10px; font-weight: bold;}

table.references td.tdRefBook{width: 95%; text-align: left; font-family: arial;
                                font-size: 12px;}
table.references td.tdRefBook em.refBookAuth {font-style: normal;}
table.references td.tdRefBook b.refBookTitle {font-weight: bold;}
table.references td.tdRefBook b.refBookSubtitle {font-style: normal; font-weight: bold;}
table.references td.tdRefBook em.refBookPublisher {font-style: normal;}
table.references td.tdRefBook em.refBookPublAddr {font-style: normal;}
table.references td.tdRefBook b.refBookYear {font-weight: bold;}

table.references td.tdRefWWW{width: 95%; text-align: left; font-family: arial;
                                font-size: 12px;}
table.references td.tdRefWWW b.refWWWTitle {font-weight: bold;}


/* ===================================================================
 * COPYRIGHT and CONTACT
 * ================================================================ */
td#copyright  {background: #FFFFFF; font-family: sans-serif;
                                font-size: 11px;}
td#contact  {background: #FFFFFF; color: olive; 
                              font-family: sans-serif; font-size: 11px;}

/* ===================================================================
 * TABLE at right side: RELEVANT LINKS
 * ================================================================ */
table#relevant-links {border-collapse: collapse; border: 1px outset #9cc7c2; }
table#relevant-links td.link-group {text-align: left; color: gray; font-family: arial; 
                                    font-size: 12px; font-weight: bold;}
table#relevant-links td.pre-bullet-tab {width: 3%; text-align: left; color: white; 
                                        font-family: arial; font-size: 12px;}
table#relevant-links td.pre-link-bullet {width: 2%; text-align: center; color: gray; 
                                         font-family: arial; font-size: 12px;}
table#relevant-links td.href-link {width: 95%; text-align: left; font-family: arial; 
                                   font-size: 12px;}