/* Created by InterActive Systems & Consulting, Inc.
* &#169; 2004 http://www.iasc.com/
* This style provides a heading area with logo and banner,
* Top Navigation, left sidebar, center main area, right sidebar and a footing
*/

/* Color note:  The InterASC colors are
* #BED2EE - a very light blue,
* #6A98D4 - a medium greyish blue with a browser-safe equivalent of #6699CC,
* #00498A - a saphire blue with a browser-safe equivalent of #003399,
* and #003366 - a darker saphire blue for fonts. */

body {
        height: 100%;
        width: 97%;
        margin: 0;
        padding: 0;
}

html, body {
   margin: 0;
        padding: 0;
        border: 0;
        font-family: Arial, sans-serif;
   font-size: 95%;
        color: #003366;
   background-color: #BED2EE;
}
/*
* html>body {
*        font-size: 110%; /* IE6 doesn't understand child selectors - this makes the font nearly the same size in N7.x & FF0.9.x as in IE */
*}
*/

#heading {
        clear: both;
        height: 115px;
        padding: 1px;
}

/* Note from http://www.alistapart.com/articles/taminglists/ - If you want the markers to line up inside the DIV, but along its left side, set either the left padding or margin to one em.  This article also shows how to use list structures to properly create vertical and horizontal NavBars */

#topNavBar {

}

#inline-list {
        border: 1px solid #000;
        margin: 2em;
        width: 80%;
        padding: 5px;
        font-family: "Abadi MT", sans-serif;
}

#inline-list p {
        display: inline;
}

#inline-list ul, #inline-list li {
        display: inline;
        margin: 0;
        padding: 0;
        color: #FFF;
        font-weight: bold;
}

#saphhireTabs ul {
        margin-left: 0;
        padding-left: 0;
        display: inline;
}

#sapphireTabs ul li {
        margin-left: 0;
        margin-bottom: 0;
        padding: 2px 15px 5px;
        border: 1px solid #000;
        list-style: none;
        display: inline;
}


#sapphireTabs ul li.current {
        border-bottom: 1px solid #ffc;
        list-style: none;
        display: inline;
}

#crumbs {
        color: #6699cc;
        padding: 3px;
        margin-bottom: 25px;
}

#crumbs ul {
        margin-left: 0;
        padding-left: 0;
        display: inline;
        border: none;
}

#crumbs ul li {
        margin-left: 0;
        padding-left: 2px;
        border: none;
        list-style: none;
        display: inline;
}

#vertPriNavBar {

}

#vertSecNavBar {

}

.textObject {
    font-family: Arial, Helvetica, sans-serif;
    color: #003366;
}

.textNavBar {
     font-family: Arial,Helvetica,sans-serif;
     color: #003366;
     margin: 1ex 1ex 1ex 1ex;
     padding: 1ex;
     width: 99%;
     text-align: center;
}

#leftSideBar {
        float: left;
        width: 130px;
        top: 130px;
     font-size: 84%;
}

.leftSideItem {
   margin-top: 8px;
        margin-right: 5px;
        margin-bottom: 8px;
        margin-left: 1px;
        border: 1px solid #6699CC;
        padding: 6px;
}

.leftSideItem h3 {
        margin-top: 0;
        margin-right: 0;
        margin-bottom: 8px;
        margin-left: 0;
}

.leftSideItem form {
        margin: 0;
}

#rightSideBar {
        float: right;
        width: 25%; /* was 150px*/
        top: 130px;
        font-size: 96%;
}

.rightSideItem {
        margin-right: 1px;
        margin-left: 5px;
        margin-top: 8px;
        margin-bottom: 8px;
        border: 1px solid #6699CC;
        padding: 8px;
}

.rightSideItem h3 {
        margin-top: 0px;
        margin-bottom: 8px;
}

.rightSideItem form {
        margin-top: 0px;
        margin-bottom: 0px;
}

.dimmed {
        color: #6699cc;
        font-size: 84%;
}

#mainArea {
        padding: 0px 32% 5px 150px;
        margin: 0;
}

.mainTopItem {
        /* margin: 5px 0 10px 10px; */
        width: 98%;
        padding: 10px 18px 10px 8px;
        background-color: #FFFFFF;
        margin-right: 10px;
        margin-left: 30px;
        margin-top: 13px;
        margin-bottom: 18px;
        /* border: 1px solid #6699CC; */
        /* padding-right: 8px; */
        /* padding-left: 8px; */
}

.mainBodyItem {
        /* margin: 5px 0 10px 10px; */
        width: 98%;
        padding: 10px 18px 10px 8px;
        background-color: #FFFFFF;
        margin-right: 10px;
        margin-left: 30px;
        margin-top: 13px;
        margin-bottom: 18px;
        /* border: 1px solid #6699CC; */
        /* padding-right: 8px; */
        /* padding-left: 8px; */
}

.mainBottomItem {
        /* margin: 5px 0 10px 10px; */
        width: 98%;
        padding: 10px 18px 10px 8px;
        background-color: #FFFFFF;
        margin-right: 10px;
        margin-left: 30px;
        margin-top: 13px;
        margin-bottom: 18px;
        /* border: 1px solid #6699CC; */
        /* padding-right: 8px; */
        /* padding-left: 8px; */
}

#welcome {
        margin: 0;
        padding: 0;
}

#footing {
        clear: both;
     font-size: 84%;
}

/* The following is for forms */
div.row {
  clear: both;
  padding-top: 5px;
}

div.row span.label {
  float: left;
  width: 36%;
  text-align: right;
}

div.row span.formw {
  float: right;
  width: 60%;
  text-align: left;
}

/* Here is the example HTLM for the form style above...


<div style="width: 360px; background-color: #ccc;
border: 1px dotted #333; padding: 5px;
margin: 0px auto";>
  <form>
    <div class="row">
      <span class="label">Name:</span><span
class="formw"><input type="text" size="25" /></span>
    </div>
    <div class="row">
      <span class="label">Age:</span><span
class="formw"><input type="text" size="25" /></span>
    </div>
    <div class="row">
      <span class="label">Shoe size:</span><span
class="formw"><input type="text" size="25" /></span>
    </div>
    <div class="row">
      <span class="label">Comments:</span><span
class="formw">
        <textarea cols="25" rows="8">
        Go ahead - write something...
        </textarea>
      </span>
    </div>
  <div class="spacer">
  &nbsp;
  </div>
 </form>

</div>
*/

/* These are the general elements using InterASC Console 5 styles */

/* Generic style for logos or similar - see #Logo_140 example
#Logo {

}*/

#Logo_140 {
        border: none;
        height: 88px;
        width: 140px;
}

#Logo_140 a {
        border: none;
        text-decoration: none;
}

div.pageHeader {
        padding: 0;
        margin: 0;
}

#banner {
                        background: url(../images/Banner_770v6.GIF) no-repeat  145px 18px;
        position: absolute; /*  Added 2 lines */
        top: 10px;
        font-family: "Abadi MT", sans-serif;
        font-variant: normal;
        font-weight: bolder;
        font-size: 16px;
        color: #fff;
        letter-spacing: 0.2em;
        height: 27px;
        margin-top: 0; /* was 27px - JAdP */
        margin-right: 0;
        margin-bottom: 0;
        margin-left: 5px; /* was 0px 2004.o6.27 JAdP */
        padding-top: 30px;
        padding-left: 177px;
        padding-right: 0px;
        padding-bottom: 0px; /* was 10px - JAdP */
        width: 70%; /*was 100% JAdP 20040708 */
}

.pageSubTitle {
        letter-spacing: 4px;
        border: 0px;
        padding-top: 12px;
        padding-right: 0px;
        padding-bottom: 2px;
        padding-left: 0px;
        margin: 0;
        font-family: "Abadi MT", sans-serif;
        font-weight: bold;
        font-size: 14px;
        color: #FFFFFF;
}

#siteStyleLine2 {
        background-color: transparent;
        border: 0;
        height: 12px;
        width: 577px;
}

/* The following info class is for _autoacro.renerer.php */
.info {

        border-bottom: dotted #6699CC;
        font: normal normal bolder Arial sans-serif;
        color: #003366;
        cursor: help;
}

a {
        font-family: Arial, sans-serif;
        color: Blue;
}

a:active {
        font-family: Arial, sans-serif;
        color: #6699CC;
}

a:hover {
        font-family: Arial, sans-serif;
        color: #336699; /* was accidently bed2ee matching the background */
}

a:link {
        font-family: Arial, sans-serif;
        color: Blue;
}

a:visited {
        font-family: Arial, sans-serif;
        color: #990099;
}

abbr {
        font-family: Arial, sans-serif;
        font-variant: small-caps;
        cursor: help;
}

acronym {
        font-family: Arial, sans-serif;
        text-transform: uppercase;
        cursor: help;
}

address {
        font-family: "Abadi MT", sans-serif;
        font-variant: small-caps;
        text-transform: capitalize;
}

blockquote {
        font-family: Arial, sans-serif;
        color: #003366;
        font-variant: normal;
        border: 2px dotted #6699cc;
        padding: 12px 5px 10px 5px;
        background-color: White;
        margin: 5px;
        text-indent: -0.5em; /* This allows the text to line up within quotes */
}

button {
        /* For Forms only */
}

cite {
        font-family: Arial, sans-serif;
        font-style: italic;
}

code {
        /* border: 2px dotted #6699cc;*/
        padding: 1px 1px 1px 1px;
        background-color: #ddd;
        margin: 0;
}

code#tbAddress {
        padding: 0;
        margin: 0;
        font-size: 70%;
        /*width: auto;
        display: block;
        white-space: nowrap;
        overflow: hidden; */
}

del {
        color: #999999;
        text-decoration: line-through;
}

div {
        border: none;
}
ins {
        color: #6699cc;
        text-decoration: none;
}

/* Remember to remove margins from headings to correct an Opera 6 display error */

h1, h2, h3, h4, h5, h6 {
        font-family: "Abadi MT", sans-serif;
        font-weight: bold;
        color: #003366;
        margin: 0;
        padding-top: 0.2em;
}

h1 {
        font-variant: small-caps;
        font-size: 175%;
}

h2 {
        font-variant: small-caps;
        font-size: 150%;
        border-top: thick solid #6699cc;
}

h3 {
        font-variant: small-caps;
        font-size: 125%;
        border-bottom: thick solid #6699cc;
}

h4 {
        font-variant: small-caps;
        font-size: 100%;
        border-bottom: thin solid #6699cc;
}

h5 {
        font-variant: small-caps;
        font-size: 100%;
        border: none;
}

h6 {
        font-variant: normal;
        font-size: 100%;
}

h1 a {
     text-decoration: none;
}

h2 a {
     text-decoration: none;
}

h3 a {
     text-decoration: none;
}

h4  a {
     text-decoration: none;
}

h5 a {
     text-decoration: none;
}

h6 a {
     text-decoration: none;
}

/* The following takes care of where heading tags follow directly after each other */

h1 + h2 {
        margin-top: 6px
}

h2 + h3 {
        margin-top: 6px
}

h3 + h4 {
        margin-top: 6px
}

h4 + h5 {
        margin-top: 6px
}

h5 + h6 {
        margin-top: 6px
}

h1 + h1 {
        margin-top: 6px
}

h2 + h2 {
        margin-top: 6px
}

h3 + h3 {
        margin-top: 6px
}

h4 + h4 {
        margin-top: 6px
}

h5 + h5 {
        margin-top: 6px
}

h6 + h6 {
        margin-top: 6px
}

/* Note from http://www.alistapart.com/articles/taminglists/ - In lists, if you want the markers to line up inside the DIV, but along its left side, set either the left padding or margin to one em. */

li {
        font-family: Arial, sans-serif;
        color: #003366;
        padding-left: 1em;
        list-style-position: inside;
}

ol {
        font-family: Arial, sans-serif;
        color: #003366;
        list-style: decimal none;
}

ol ol {
        list-style-type: lower-roman;
}

ul {
        font-family: Arial, sans-serif;
        color: #003366;
        list-style-type: none;
        list-style-image: url(../images/BlueStar15Trans.gif);
     text-indent: -1.5em;
          /* padding-left: 0;
     list-style-position: outside; */
}

ul ul{
        margin-left: 10px;
        padding-left: 4px;
        margin-top: 0px;
        margin-bottom: 0px;
        list-style-type: circle;
}

ul#opening {
        font-size: 70%;
        text-decoration: none;
                  list-style-image: none;
}

.leftSideItem ul {
        margin-left: -0.5em;
        padding: 0;
   text-indent: -1em;
        margin-top: 8px;
        margin-bottom: 8px;
        list-style-image: none;
}

.leftSideItem ul ul{
        margin-left: 0px; /* was 10px 2004.06.27 JAdP*/
        padding-left: 4px;
        margin-top: 0px;
        margin-bottom: 0px;
     list-style-image: none;
     list-style-type: none;
}

.rightSideItem ul {
        margin-left: 1em; /* Was 8px 2004.06.27 JAdP*/
        padding-left: 0px; /* Was 8px 2004.06.27 JAdP*/
        margin-top: 8px;
        margin-bottom: 8px;
        list-style-position: inside; /* Added 2004.06.27 JAdP*/
   list-style-image: none;
   list-style-type: none;
}

.rightSideItem ul ul {
        margin-left: 0px; /* Was 4px 2004.06.27 JAdP*/
        padding-left: 4px;
        margin-top: 0px;
        margin-bottom: 0px;
     list-style-image: none;
     list-style-type: none;
}

 /* In Forms, use lists to keep buttons, checkboxes, etc with the items that they effect.  Added 2004.06.27 JAdP */

ul.formb {
        list-style-image: none;
        list-style-position: inside;
        list-style-type: none;
        padding-top: 4px;







        padding-right: 0;
        padding-bottom: 4px;
        padding-left: 0;
        margin-top: 0;
        margin-right: 0;
        margin-bottom: 0;
        margin-left: -0.5em;
   text-indent: -1em;
        /* text-indent: -1.8em;*/
}

p {
        font-family: Arial, sans-serif;
        color: #003366;
}

p.baseline {
        clear: both;
        text-align: center;
        margin: 1ex 1ex 1ex ; /* was 140px */
        padding: 1ex;
        width: 99%;
}

p.footer {
        clear: both;
        text-align: justify;
        margin: 1ex 1ex 1ex 1ex ; /* was 140px */
        padding: 1ex;
        width: 99%;
}

pre {
        font-family: Arial, Helvetica, sans-serif;
        color: #003366;
}

td {
        font-family: Arial, Helvetica, sans-serif;
}

th {
        font-family: "Abadi MT", sans-serif;
}

caption {
        font-family: "Abadi MT", sans-serif;
        font-weight: bold;
}

table.invisible
{
        margin: 1ex;
        border-collapse: collapse
}

table.invisible td
{
        padding: 0ex 1ex;
}

td.right
{
        text-align: right;
}

/* required by Mambo */
/* --------------------
 * The following are styles that are often used
 * site wide by Mambo to provide better control
 * of content's appearences.
 */

.small {
        font-size: 75%;
        color: #336699;
        font-weight: bold;
        padding-top: 10px;
        text-align: left;
}

/* Mambo General styling for Sections/Categories/Contents
 * ------------------------------------------------------
 * These styles are sometimes or often used across
 * Sections, categories and contents. They, therefore, deserve
 * to be mentioned separately from others.
 */

.createdate {
        line-height: 15px;
        font-size: 11px;
        color: #336699;
        font-weight: bold;
        vertical-align: top;
        display: block;
} /* createdate For styling the date the content/articles are created under contents title */

.modifydate {
        font-size: 11px;
        color: #336699;
        font-weight: bold;
        padding-top: 10px;
        text-align: left;
} /* modifydate styles the "Last updated on" text at the end of articles/contents */

.readon {
        margin-bottom: 10px;
} /* readon For formatting the "Read on..." link for blogs and on frontpage. */

/* Mambo Section Styles
 * ---------------------
 * Styling of section tables
 */

.sectiontableheader {
        background : #336699;
        color : #ffffff;

        font-weight : bold;
        padding: 3px;
} /* sectiontableheader This is for styling the section table headers
* on a SECTION's page. An example would be those articles lists
* when you click on "News" or something.  With a table header of "Date",
* "Item Title", "Author" and "Hits". That's the header that you will be
* controlling through this style */

.sectiontableentry1 {
        background-color : #fff;
        padding: 2px;
} /* sectiontableentry1, This is used when there's a whole list of data
* to provide and you need to create alternate colors for each row of
* data. This is the first color */

.sectiontableentry2 {
        background-color : #fff;
        padding: 2px;
}  /* sectiontableentry2 This is the second color for the row.
* So, the table generator, will alternate its style through
* sectionableentry1 and sectiontableentry2 as it cycles through and
* outputs each row of data. Similar to forum's post listings */

/* The following are from Planetfall for section id*/

div#middle_box .sectiontableentry1 {
        background-color : #fff;
        padding: 2px;
}

div#middle_box .sectiontableentry2 {
        background-color : #fff;
        padding: 2px;
}

div#right_box .sectiontableentry1 {
        background-color : #fff;
        padding: 2px;
}

div#right_box .sectiontableentry2 {
        background-color : #fff;
        padding: 2px;
}


/* Mambo Styles for Categories
 * ---------------------------
 * The following are the styling for "Category" items
 * generated from the Sections area
 */

.category {
        color: #003366;
        font-size: 11px; font-weight: bold; text-decoration: none;
} /* category This is to set the category Titles
* (found on a SECTION's page where the Category lists are) styles */

a.category:link, a.category:visited {
        color: #6699CC;
        text-decoration: none;
        font-weight: bold;
} /*  a.category:link, a.category:visited same as above,
* but to set the link format */

a.category:hover {
        color: #336699;
        text-decoration: none;
        font-weight: bold;
} /* a.category:hover same as above, but for links with mouse pointer over it */


/* Mambo Styling for Contents
 * --------------------------
 * All the styling for contents are listed below.
 */

.contentheading {
        /* Styled to match H3 of IASC_Look */
        vertical-align: middle;
        font-family: "Abadi MT";
        font-size: 125%;
        font-weight: bold;
        color: #003366;
        text-align: left;
        width: 100%;
        height: 24px;
        font-variant: small-caps;
        border-bottom: thick solid #6699cc;
} /* contentheading This is used in several places;
* the Heading of contents on the frontpage, it is also used for Section
* heading (see above for explanation) "News" or whatever heading you used */

.contentpagetitle {
        font-size: 13px;
        font-weight: bold;
        color: #003366;
        text-align:left;
} /* contentpagetitle Couldn't find where is this yet. */

/* For content item titles that are hyperlink instead of Read On */

a.contentpagetitle:link, a.contentpagetitle:visited {
        font-size: 13px;
        font-weight: bold;
        color: #6699CC;
        text-align:left;
        text-decoration: none;
}

a.contentpagetitle:hover {
        color: #ffffff;
}

.contentdescription {
        color: #003366;
        text-align: left;
} /* contentdescription When you create a link to a Section in the main menu
* and when clicked on it, it will display "News" then some description
* (with image if you selected one) and then a list of Category of News.
* This style is used for formating the "DESCRIPTION" part of that page */

.contentpane {
        background: #fff;
} /* contentpane This is used mainly for the table that holds the SECTIONS
* such as News. This is when you create a link to a Section and
* when clicked on it, it will display "News" then some description
* (with image if you selected one) and then a list of Category of News.
* Yes! That entire thing is contained in a table with this style */

#content-pane .tab-page {
        background: #fff;
} /* Used in Planetfall */

.contentpaneopen {
        text-align: left;
        width: 100%;
        padding: 0px;
} /* contentpaneopen Found this being used by Phil in his Shambo2.
* Don't know where else its used in Mambo */

table.contenttoc {
        color: #003366;
        background-color: #e0e0e0;
} /* table.contenttoc This is used to format the table of the
* Tables of Contents or "Jump to" box when it is enabled
* in a multiple paged content or article */

table.contenttoc td {
        font-size: 8pt;
        font-weight: normal;
        text-align:left;
} /* table.contenttoc td The same as above,
* but this is used to format the td or table cells */

/* Content voting */

.content_rating {
        font-weight: normal;
        font-size: 8pt;
} /* content_rating used for styling the texts used for displaying
* those "stars" for rating in an article */

.content_vote {
        font-weight: normal;
        font-size: 8pt;
} /* content_vote {} used for those voting texts
* (the one with voting RADIO buttons) */

/* Mambo Components Styles
 * -----------------------
 * These stylings are to format the way components title
 * is displayed
 */

.componentheading {

        /* background: url(../images/title_background.png) no-repeat; */
        vertical-align: top;
        padding-top: 4px;
        color: #003366;
        text-align: left;
        /* text-indent: 15px; */
        width: 100%;
        height: 24px;
        text-transform: uppercase;
        font-family: "Abadi MT";
        font-size: 125%;
        font-weight: bold;
        font-variant: small-caps;
   border-bottom: thick solid #6699cc;
} /* componentheading This is used for formatting the component's title
* when it is displayed on its own page on the frontend */

/**
 * Mambo's Built-in Component's Syling
 * -----------------------------------
 * These stylings are used for Mambo's built-in components
 * such as newsfeeds, weblinks, contact, search and polls.
 * A commented subtitle will guide you which is for which
 */


 /*  Polls  */

.poll {
        font-size: 10px;
        line-height: 14px
} /* poll polls texts */

/* the table.pollstableborder is from PlanetFall */

table.pollstableborder {
        border: 0px;
}

.pollstableborder {
        border: 1px solid;
        padding: 1px;
} /* pollstableborder set the border properties of the polls voting table */


/*  Weblinks */
.weblinks{

} /* Format the link's titles under the "Weblinks" section on the frontend */

a.weblinks:hover {

} /* same as above, but for link with mouseover */


/*  Newsfeeds */

.newsfeedheading {
        font-size: 11px;
        font-weight: bold;
        color: #003366;
        text-align:left;
} /* The newsfeed title.
* NOTE: This will not affect the newsfeed's news title! */

.newsfeeddate {
        font-size: 10px;
        color: #003366;
        font-weight: normal;
} /* The date on the newsfeed */

.fase4rdf a:link {
        color: #666633;
        text-decoration: none;
        font-weight: bold;
}

.fase4rdf a:hover {
        color: #336699;
} /* this is the body text of the newsfeed */


/* Search page */

table.searchintro {
        width: 100%;
}

table.searchintro td {
        background-color: #336699;
        color: #ffffff;
        font-weight: bold;
} /* This is for formatting the box with
* "Search Keyword: test returned 4 matches" box that appears
* after you have entered a search value.
* It appears on the mainbody with the search results  */


/*  Contact's table settings  */

table.contact {
        background-color: #fff;
} /* for table.contact Formatting the entire "Contact" table which includes
*           the name, address icons and form.
* Note this table DOES NOT enclose the dropdown list for selecting the
*           Department/person to contact */

table.contact td.icons {
        background-color: #fff;
        font-weight: bold;
} /* table.contact td.icons This formats the <td> cells
*           where the little icons sits next to the details
*           (those addresses, phone number etc) */

table.contact td.details {
        background-color: #336699;
        color: #ffffff;
        font-weight: bold;
} /* table.contact td.details Formatting the <td> cells
*        where all the details sits.
*        The details where addresses, phone number and additional info are */

/* Mambo Modules formatting
 * ------------------------
 * These stylings are to format the way modules are
 * displayed. It mainly deals with the format of its
 * table.  Module suffix styles are also shown here.
 */

table.moduletable {
        width: 100%;
        margin: 0px 0px 15px 0px;
        border-left: solid 0px #000000;
        border-right: solid 0px #000000;
        border-top: solid 0px #000000;
        border-bottom: solid 0px #000000;
} /* styling the module table */

/* Added by JAdP for botTextNavBar menuType */

table.moduletable_botTextNavBar {
     font-family: Arial,Helvetica,sans-serif;
     color: #003366;
     margin: 0; /* was 1ex 1ex 1ex 1ex; */
     padding: 0; /* was 1ex; */
     width: 99%;
     text-align: center;
}

table.moduletable th {
        /* Styled to match H3 from IASC_Look */
        text-align: left;
        text-indent: 1px;
        font-variant: small-caps;
        font-size: 125%;
        border-bottom: thick solid #6699cc;
} /* styling the module header, and the module titles */

table.moduletable td {
        font-size: 11px;
        padding: 0px;
        font-weight: normal;
} /* Formatting the table cells of the module table */

table.moduletable ul {
        color: #003366;
} /* For unordered lists within a module */

/* The following Div id=menublock is from PlanetFall */

div#menublock table.moduletable td {
        padding: 0px;
}

/* Mambo Menu Styling
 * ------------
 * You can control the way menu behave and look
 * by using the CSS settings below
 * The first two are the ones in the Mambo standard usage,
 * The others are used for mobule or menu suffixes for added menus
 */

a.mainlevel{} /* this styling is for the MAIN items in the menu */

a.sublevel{} /* this styling is for menu items that HAS A PARENT */

#mainlevel-nav {
margin: 0; padding: 0;
}
#mainlevel-nav li {
background-image: none;
list-style:none;
float: left;
margin: 0px;
padding-left: 15px;
padding-right: 15px;
font-size: 11px;
line-height:24px;
height: 26px;
white-space: nowrap;
border-right: 1px solid #9DA6B3;
}
#mainlevel-nav a {

float: right;
text-decoration: none;
color: #336699;
}
#mainlevel-nav a {
float: none;
}
#mainlevel-nav a:hover {
color: #6699CC;
}

a.mainlevel:link, a.mainlevel:visited {
        background: url(../images/menu_bullet.png) no-repeat;
        vertical-align: middle;
        font-size: 11px;
        font-weight: bold;
        color: #6699CC;
        /* text-align: left; */
        padding-left: 15px;
        height: 18px;
        margin-bottom: 1px;
}

a.mainlevel:hover {
        background-position: 0px -20px;
        text-decoration: none;
        color: #ffffff;
}

/* Added by JAdP */

.mainlevel_botTextNavBar {
        font-family: Arial,Helvetica,sans-serif;
     color: #003366;
     margin: 1ex 1ex 1ex 1ex;
     padding: 1ex;
     width: 99%;
     text-align: center;
}

a.sublevel:link, a.sublevel:visited {
        padding-left: 1px;
        vertical-align: middle;
        font-size: 11px;
        font-weight: bold;
        color: #6699CC;
        text-align: left;
}

#active_menu {
        color:#ffffff;
        font-weight: bold;
}

a.sublevel:hover {
        color: #ffffff;
        text-decoration: none;
}

a.mainmenu:link, a.mainmenu:visited {
        color: #ffffff; font-family: Arial, Helvetica, sans-serif;

        font-weight: normal;

        font-size: 11px;
        padding-left:10px;
        padding-right:10px;
}

a.mainmenu:hover {
        color: #336699;
        text-decoration: none;
}



a:link, a:visited {
        color: #6699CC; text-decoration: none;
        font-weight: bold;
}

a:hover {
        color: #336699;        text-decoration: none;
        font-weight: bold;
}

a.pagenav, a.pagenav:visited {
        font-weight: bold;
        color: #6699CC;
        text-decoration: none;
}

a.pagenav:hover {
        color: #336699;
        text-decoration: none;
}

.frontpageheader {
        color: #ffffff;
        font-size: 15px;
        font-weight: bold;
        line-height: 30px;
}

td,tr,p,div {
        font-family: Arial, sans-serif;
        /* font-size: 11px; */
        color: #003366;
}

/** Mambo Form Styles
 * -----------------
 * Here are 2 styles that Mambo uses to let users control
 * how their forms and buttons may look.
 */

.button {
        font-weight: bold;
        border:solid 1px #9DA6B3;
        background-color: #336699;
        color: #fff;
        text-align: center;
        font-size: 9px;
        margin-top: 5px;
}

.inputbox {
        font-weight: normal;
        color: #003366;
        background: #fff;
        border: 1px solid #6699cc;
}

/* ---------------- unedited below here ----------------------*/

/* Styles for dhtml tabbed-pages */
/* Mambo Tabbed Frontend Admin Interface
 * -------------------------------------
 * The CSS styles here defines how the frontend admin interface
 * will look like when editing and adding news through frontend.
 */

.ontab {
        background-color: #fff;
        border-left: outset 1px #9DA6B3;
        border-right: outset 1px #9DA6B3;
        border-top: outset 1px #9DA6B3;
        border-bottom: solid 0px #ffffff;
        text-align: center;
        cursor: pointer;
        font-weight: normal;
        color: #6699CC;
} /* For styling of the "Tab" buttons when editing contents through the frontend as admin. This .ontab is the styling for the tab when it is active or after its "clicked" */

.offtab {
        background-color: #003366;
        border-left: outset 1px #9DA6B3;
        border-right: outset 1px #9DA6B3;
        border-top: outset 1px #9DA6B3;
        border-bottom: solid 1px #9DA6B3;
        text-align: center;
        cursor: pointer;
        font-weight: normal;
        color: #fff;
} /* Same as above, used for styling of the "Tab" buttons when editing contents through the frontend. This the styling for the tab when it is NOT active or when it is NOT "clicked" */

.tabpadding {
} /* this style is used set the size of the tab in the above */

.tabheading {
        background-color: #eeeeee;
        text-align: left;
} /* Not too sure what this is used for. Couldn't find anything related to it yet at the moment */

.pagetext {
        visibility: hidden;
        display: none;
        position: relative;
        top: 0;
} /* pagetext is used to style the content of the editing form contents (where HTMLArea sits and all its forms + contents) in the frontend Administration interface */

/* Horizontal Line */
hr {
        background: #003366; height:1px; border: 1px solid;
}

hr.separator {
        background: #003366;
        height: 1px;
        width: 75px;
        border: 0px;
}



.smalldark {
        font-size: 11px;
        color: #003366;
        text-decoration: none;
        font-weight: normal;
}

.pagenav {
        font-weight: normal;
} /* as the name implies, this is for formatting texts for those "<< Start < Previous 1 Next > End >>" links */

.pagenavbar {

} /* not used in to page nav bar but used for nicknames in forum posts by Simpleboard */

/* Javascript Back button */
.back_button {
        text-align: center;
        margin-top: 40px;
}

strong {
        color: #003366;
        font-weight: bold;
}

/* Mambo Blog styling
 * ------------------
 * Not too sure where this is used yet; the blog section
 * doesn't seem to use it.
 */

.blogsection{
        background: #fff;
} /* to be updated */