/*			  COLOR PALETTE:
#E9E9E9      light neutral gray, for screen
#FFFF99      light yellow
#FFFFCC     very light yellow, for larger areas
#CCCCCC    medium gray matte
#333366       medium "CRONA blue"
#336699       medium-dark "CRONA blue"
#00339B       dark "CRONA blue"
#FFCC33      "gold"
				FONTS:
Fonts:          "Trebuchet MS", Tahoma, Sans-Serif;
(other possibilities:         Trebuchet, Verdana, Geneva, Arial, Helvetica)
                            BOX MODEL:
 width: n;     Affects all browsers
 \width: n;    Apparently determines only Opera's behavior
 w\idth: n;    Who knows
*/

/*			DOCUMENT BOX MODEL:
*/

body {
	font-size: 75%;                   /* Resets 1em to 12px instead of 16px */
	font-family: "Trebuchet MS", Tahoma, Sans-Serif;
	background-color: #cccccc;            /* gray "matte" behind the page */
        }

#container {
	background-color: white;
	width: 770px; /** \width: 780px; w\idth: 770px;  /* \width 780 works for Opera */
	margin: 10px;
	margin-left: auto;
	margin-right: auto;
	padding: 10px;
        }

#head {
	height: 150px; /* was 120px */
        /** color: #333366; **/
        background: url("/images/crona-logo-header.gif") no-repeat;
        clear: both;
        }

#breadcrumbs {   /* holds the breadcrumb trail, same loc as frontpage's tagline */
	font-style:  italic;
	font-size: 11px/12px;
        text-align: left;
        padding: 0px;
        margin: 0px;
        margin-left: 165px;   /* 130px aligns with right edge of N in CRONA */
        position: relative;
 /***       top: -5px; ***/
        clear: both;
        color: #336699;     /* CRONA medium-dark blue */
}
#breadcrumbs a:hover {text-decoration: underline; }



/* TOP NAV:  Position special nav buttons & pix across the top of 'container'.
   We produce a top navigation button row by creating a box, 'topnav',
   that spans the area across the center (content) + right columns, and
   floating the buttons in it to the left side of that box. Most buttons will
   be rendered as 'navbutton', but a distinguished 'keynavnbutton' will be visually
   emphasized e.g. to draw reader attention to a more important choice.
   The HTML in the TXP form for these buttons places them in an anchor
   within a list, complicating the color assignments here.
*/

#topnav {
 
 /***	width: 630px; /** \width: 650px; w\idth: 630px; **/
   /***     clear: right; ***/
        padding: 2px;
        text-decoration: none;
        }
#topnavbar { /* Places a few special nav buttons across the top of topnav */
        float: left;
        }
.keynavbutton     {  background-color: #ffcc33;      /*  "gold"  */
                            text-decoration: none; 
                            width: 7em; 
                            }
.keynavbutton a  {  color: #336699;                      /* medium-dark blue */
                            text-decoration: none; }

.navbutton          { background-color: #336699;     /* CRONA medium-dark blue */
                            padding: 0px 2px;                  /* space apart on L&R */
                            width: 7em; }
.navbutton a       { color: white; }

#topnav a           { text-decoration: none; }
#topnav a:hover  { text-decoration: underline; }

#topnav ul {   margin: 0px; padding: 2px; }

#topnav li  {
  /** border-left: solid white 3px;  border-right: solid white 3px;  **/
    float: left;               /* Makes buttons show as horiz row, instead of vert stack */
    text-align: center;
	display: block;
	padding: 2px;
	margin: 3px;
	font-size: 1.0em;
        color: #336699;                      /* medium-dark blue NON-button text */
	-moz-border-radius:5px;
	}



	/* PAGE1PIX: Container for pictures appearing on website frontpage
	   This requires an ugly hack: MSIE will render the contained
	pictures happily, but Firefox produced a mess unless the pictures are floated
	to the right. So we create a containing box the size of the left plus center
	columns, and then float the pictures to the right side of that box:  */

#page1pix {
       float: left;
/**	width: 100%; **/
/**        width: 660px; /**  \width: 660px;  w\idth: 630px;  **/
        overflow: visible;
        margin: 0px;
/*        clear: both;    /* DO NOT CLEAR BOTH - breaks MSIE. */
        }


/*		 SIDEBARS: Used for left and right menus 
*/

#sidebar-1 {
	float: left;
	width: 150px;   /* /asc  was 150 */
	\width: 150px;
	w\idth: 150px;
	margin-right: 5px;
	padding-top: 5px;  /* /asc  was 100px */
        }

#sidebar-2 {
	float: right;
	width: 140px;  /* /asc  was 150 */
	\width: 140px;
	w\idth: 140px;
	margin-left: 5px;
	padding-top: 0px;  /* /asc  was 6px */
        }

#sidebar-1 .frontpage_vertadjust {
	width: 100%; 
        height: 0px; float: left;  /* floating it prevents vert margin from collapsing */
	line-height: 1em;
	padding: 25px 0px 0px 0px;  /* Provides spacing above label text */
        }

fieldset {
        border: solid 0 transparent;  /* Eliminates visible border, even for Opera */
        padding: 0; margin: 0;
        }
legend {
        padding: 0; margin: 0; text-align: left;
        }

/*		CONTENT AREA: Main center text region 
*/

#content {
	margin-left: 155px;                                   /* /asc  was 155px */
	margin-right: 155px;
        margin-top: 33px;       /* Space down to align content & sidebar-2 hrules*/
	padding-top: 0px;                                     /*  /asc  was 30px  */
	font-size: 1.2em;
        text-align: left;                 /* or use "justify" to left+right justify */
        }


/* 'foot' contains the footer reproduced on every page  */

#foot {
	clear: both;
	margin-top: 5px;
	text-align: center;
        }

#accessibility  {
	position: absolute;
	top: -10000px;
}

#searchblock {              /* Formatting & positioning for the search box */
        margin-top: 55px;
        }

/* Styling for various page entities:   */

.screentext {                                 /* Dropped in behind text for contrast */
        background-color: #ffffcc;      /* Light yellow screen in background */
        }
.noscreentext {                            /* Eliminate in behind text for contrast */
        background-color: white;      /* Light yellow screen in background */
        }

.emph { color: #c00; font-variant: small-caps; }  /* Used to emphasize text */
.excerpt li:after { content: "-> " }         /* put "arrow" before "READ MORE" */

blockquote, li {
	padding-left: 10px;
	padding-right: 10px;
}

blockquote
{
	margin-left: 20px;
	margin-right: 0px;
}

hr {
/**    color: #ffcc33;  /* "gold" */
    color: #336699;   /*   medium-dark "CRONA blue" */

/**    float: left;
    clear: left; **/
    text-align: left;
    padding: 0em;
    margin: 0em;
    width: 100%;
    }

#sidebar-2 p, #sidebar-1 p
{
	line-height: 15px;
	font-size: 10px;
}

#sidebar-1 p   { text-align: right;  }
#sidebar-1 hr  { width: 85%;        }
a, #content a  {
        text-decoration: none;
        color: #00339B;                /* CRONA dark blue */
        }
#content a:hover {text-decoration: underline; }

#sidebar-2 a, #sidebar-1 a {
	border: 0px;
	color: #ffcc33;        /* "gold" */
        }

h1    {
	font-weight: normal;
	text-decoration:none;
	font-family: Verdana, Geneva, Arial, Helvetica, Sans-Serif;
	font-size: 3em;
        text-align: left;
        padding: 0; margin: 0;
        }

h2 { 
	font-size: 1.2em/1.2em;
        font-weight: bold;

        font-style: italic;
        text-align: left;
        padding-left: 3em;
        margin: 0;
        margin-left: 65px;    /*  /asc   */
/*        clear: both;             /*  /asc   */
/*        position: absolute;   /*  /asc   */
        margin-top: 90px;    /*  /asc   */
        }

h3, h3 a {
	border: 0px;
	font-size: 1.2em/1.2em;
	font-variant: small-caps;
/**        text-transform: capitalize; **/
        padding-top: 1em;
        padding-bottom: 0px;  margin-bottom: 0px;
        }
h3:after {
    position:absolute; 
    margin:0;width:1px;
    padding:0;
    font-size:1px;
    line-height:1px;
    left:0px; top: 10px; 
    border-left:1px solid #ffcc33; 
    background-color:#ffcc33; 
    border-right:1px solid #ffcc33;
    clear:both; 

    height:1px;
        }
h4, h4 a {
	border: 0px;
	font-size: 1em/1.2em;
/**	font-variant: small-caps; **/
/**        text-transform: capitalize; **/
        padding-top: 1em;
        padding-bottom: 0px;  margin-bottom: 0px;
        }
h1 a, h2 a, h3 a, h4 a {
	border: 0px;
        color: #00339B;                /* CRONA dark blue */
        }
.caps {
	letter-spacing: 0.1em;
	font-size: 10px;
        }


#content p {
/**	width: 90%; float: right;  **/
	margin: 0.5em 1em;           /* Set text in from edges of background */
        }

#content hr {
	color: #ffcc33;                                                                /* "gold" */
	width: 100%;
	margin-top: 0px;
	margin-bottom: 0px;
        }

img {
    float:left;
    padding:5px;
    clear: none;
    border: 0px;
    }

img.divider {
	align: center;
	margin-top: 1em;         /*   /asc  was 2em  */
	margin-bottom: 1em;   /*   /asc  was 2em  */
}


/* Add Section and Article menu support:  /asc 20050831 */

  #articles, #sections {
        /* /asc 20050831:  Tune up the font: */
	font-size: 0.9em;
	line-height: 1.6em;
	text-align: left;
	padding-left: 10px;
	padding-right: 10px;
	color: blue;
	background-color: white;
        text-transform:uppercase;
        /* /asc 20050926:  Now define baseline visual format:  */
        clear:both;
        margin: 0;  padding: 0;  
        list-style: none;
        }

  #articles li {
   /** text-indent: -1.25em;
    padding-left: 1.25em; **/
  }
  #articles li.active {
 /**   border: 1px solid; **/
  }

  #sections li {
    float:left;
    padding:0;

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

#sections li {
	display: block;
	background-color:  #FAF9E8;                              /* light bluegray */
	border: 1px solid #dddddd;
	-moz-border-radius:5px;
	padding: 3px 2px 3px 3px;
	margin: 0px 0px 6px 0px;
	color: #93425A;
	font-size: 1.0em;
	text-transform: uppercase;
	font-weight: lighter;
	}
#articles li {
/**	display: block; **/
/**	background-color:  #FAF9E8;                              /* light bluegray */
/**	border: 1px solid #dddddd; **/
/**	-moz-border-radius:5px; **/
	padding: 3px 2px 3px 3px;

	margin: 0px 0px 6px 0px;
	color: #93425A;
	font-size: 1.0em;
	text-transform: uppercase;
/**	font-weight: lighter; **/
	}
  #sections a, #articles a {
    width: 11em;  
    display:block;
    color: #336699;                                                 /* medium-dark blue */
    white-space: normal;
  }
  #sections a:hover, #articles a:hover {
     text-decoration: underline;
     background-color: #ffff99;                                           /* light yellow */
  }


  #sections .active a, #sections .active a:hover  {
    cursor: default;
    border: 0px;                                                            /* turn off border */
    margin: 0px;
    background-color: #ffff99;                                            /* light yellow */
    text-decoration: none;
    }
  #articles .active a, #articles .active a:hover  {

    cursor: default;
    border: 0px;                                                            /* turn off border */
    margin: 0px;
    /** background-color: #ffff99;                                            /* light yellow */
    text-decoration: none;
    }
#articles .active a:hover  {
     text-decoration: underline;
     background-color: #ffff99;                                           /* light yellow */
  }


/* ***********  Holding tank: Spare etnries and leftover stuff:  *********** */


. sans-serif {
        font-family: "Trebuchet MS", Tahoma, Sans-Serif;
        }

     /**   background-color: red;  /* TEST */

.f1 {font: 16px/18px Verdana;}
.f2 {font:  16px/18px Geneva;}
.f3 {font:  16px/18px Arial;}
.f4 {font:  16px/18px Helvetica;}
.f5 {font:  16px/18px Sans-Serif;}
.f6 {font:  16px/18px "Lucida Grande";}
.f7 {font:  16px/18px tahoma;}
.f8 {font:  16px/18px "Trebuchet MS";}
.f9 {font:  16px/18px Trebuchet;}


#zzzarticles ul:before { /* Not yet working as CSS */
        content: "In this section:";
        border-bottom: solid #ffcc33 3px;
        background-color: red;
        }
zzzh3:after {
        border-bottom: solid #ffcc33;                           /* "gold" */
        width: 80%;
        float: left;
        }
#tagline        /* CURRENTLY UNUSED, since tagline is now built into logo */
{                                                  /* Places the TXP tagline on frontpage */ 
	font-style: italic;
        font-size:  11px/12px;
        text-align: left;
        padding: 0px;
        margin: 0px;
        margin-left: 130px;
        position: relative;
        top: -40px;
        clear: both;
}