/*****************************/
/*** CSS positioning rules ***/
/*****************************/

/**************************************************************/
/*** HACK:                                                  ***/
/*** Creates bevel effect around menus, banners and buttons ***/ 
/**************************************************************/

/********************/
/*** inner border ***/
/********************/
DIV.level_1 {
         margin: 1px;
         padding: 0px;
         border: 1px solid rgb(255, 255, 255);
         background: rgb(180, 180, 180);
}

/********************/
/*** outer border ***/
/********************/
DIV.level_2 {
         margin: 1px;
         padding: 0px;
         border: 1px solid rgb(140, 140, 140);
         background: rgb(100, 100, 100);
}

/***************************************/
/* define the main areas of the page ***/
/***************************************/

/************************************/
/*** title bar - "REESTIT MUTTON" ***/
/*** position: top of page        ***/
/************************************/


/***********************************************************************/
/*** subtitle bar - for displaying the current section of the site   ***/
/*** position: underneath title bar                                  ***/
/***********************************************************************/
DIV.site_subheading {
                position: absolute;
                top: 75px;
                left: 0px;
                width: 970px;
                height: 25px;
                line-height: 25px;
                text-align: center;
                vertical-align: middle;
                color : #FFFFFF;
                background-color: rgb(75, 75, 135);
                font-weight: bold; 
                font-size: 14px; 
                text-decoration: none; 
                z-index: 500;
}

/****************************************************************/
/*** menubar - for navigating to major sections of the site   ***/
/*** position: underneath subtitle bar                        ***/
/****************************************************************/
DIV.menubar {
                position: absolute;
                top: 125px;
                left: 0px;
                width: 970px;
                height: 25px;
                line-height : 25px; 
                text-align: center;
                vertical-align: middle;
                color : #FFFFFF;
                background-color: rgb(203, 203, 255);
                font-weight: bold; 
                font-size: 18px; 
                text-decoration: none; 
                z-index: 500;
}

/***************************************************/
/*** footer - for displaying copyright message   ***/
/*** position: bottom of page                    ***/
/***************************************************/
DIV.footer {
                position: absolute;
                bottom: 0px;
                height: 50px;
                width: 100%;
                text-align: center;
                vertical-align: middle;
                font-weight: bold; 
                font-size: 12px; 
                color: rgb(255, 255, 255);
                background-color: rgb(100, 100, 180);
}

/*************************************************************/
/*** help console - for displaying context sensitive help  ***/
/*** position: left side of page, underneath menubar       ***/
/*************************************************************/
DIV.helpconsole {
                margin: 2px;
                padding: 0px;
                position: absolute;
                top: 141px;
                left: 6px;
                width: 230px;
                height: 130px;
                border: 2px solid rgb(0, 0, 0);
                background-color: rgb(75, 75, 135);
                text-decoration: none;
                z-index: 50;
                font-weight: normal; 
                font-size: 7pt; 
                color: rgb(255 ,255, 255);
                text-align: center;
                vertical-align: middle;
}

/******************************************************************/
/*** help_console - another attempt to implement a help console ***/
/*** area that is uniformly rendered across multiple browsers   ***/
/******************************************************************/
DIV.help_console {
                position: absolute;
                left: 0px;
                top: 134px;
                width: 250px;
                height: 130px;
		margin: 0px;
		padding: 0px;
		border: 0px solid rgb(50, 50, 50);
                background-color: rgb(203, 203, 255);
}

/******************************************************************/
/*** help console: background 1                                 ***/
/*** slightly bigger than help console                          ***/
/*** underlaying different coloured squares (using z-value)     ***/
/*** mimics the borders seen around the search banner & menubar ***/
/******************************************************************/
DIV.helpconsolebg1 {
                margin: 2px;
                padding: 0px;
                position: absolute;
                top: 139px;
                left: 4px;
                width: 234px;
                height: 134px;
                border: 2px solid rgb(140, 140, 140);
                background-color: rgb(100, 100, 100);
                z-index: 40;
}

/******************************************************************/
/*** help console: background 2                                 ***/
/*** slightly bigger than help console background 1             ***/
/*** underlaying different coloured squares (using z-value)     ***/
/*** mimics the borders seen around the search banner & menubar ***/
/******************************************************************/
DIV.helpconsolebg2 {
                margin: 2px;
                padding: 0px;
                position: absolute;
                top: 135px;
                left: 0px;
                width: 242px;
                height: 142px;
                border: 2px solid rgb(255, 255, 255);
                background-color: rgb(180, 180, 180);
                z-index: 30;
}

/******************************************************************/
/*** left side banner - for displaying section-specific options ***/
/*** position: left side of page, underneath help console       ***/
/******************************************************************/
DIV.leftsidebar {
                position: absolute;
                top: 293px;
                left: 0px;
                width: 250px;
		margin: 0px;
		padding: 0px;
		border: 0px solid rgb(50, 50, 50);
                background-color: rgb(203, 203, 255);
}

/****************************************************************/
/*** right side banner - for displaying page-specific options ***/
/*** position: right side of page, underneath menubar         ***/
/****************************************************************/
DIV.rightsidebar {
                position: absolute;
                top: 170px;
                left: 25px;
                width: 250px;
		margin: 0px;
		padding: 0px;
		border: 0px solid rgb(50, 50, 50);
                background-color: rgb(203, 203, 255);
}


/***********************************************/
/*** main area - where the page content goes ***/
/*** (full screen width version)             ***/
/*** position: somewhere in the middle       ***/
/***********************************************/
DIV.main_fullwidth {
	 position: absolute;
	 top: 80px;
         width: 970px;
	 margin: 0px;
	 padding: 0px;
	 border: 0px solid rgb(50, 50, 50);
	 background: rgb(203, 203, 255);
}

/***********************************************/
/*** main area - where the page content goes ***/
/*** position: somewhere in the middle       ***/
/***********************************************/
DIV.main {
	 position: absolute;
	 top: 160px;
	 left: 290px;
         width: 650px;
	 margin: 0px;
	 padding: 0px;
	 border: 0px solid rgb(50, 50, 50);
	 background: rgb(203, 203, 255);
}

/*******************************************************************/
/*** left side of main area: where the left portion of the page  ***/
/*** content goes when page content is split into two portions   ***/
/*** position: to the right of help console and left side banner ***/
/*******************************************************************/
DIV.main-left {
	 position: absolute;
	 top: 0px;
	 left: 0px;
         width: 400px;
	 margin: 0px;
	 padding: 0px;
	 border: 0px solid rgb(50, 50, 50);
	 background: rgb(203, 203, 255);
}

/*********************************************************************/
/*** right side of main area: where the right portion of the page  ***/
/*** content goes when page content is split into two portions     ***/
/*** position: to the right of the left half of the page content   ***/
/*** NOTE: this area is often used for right-side banners          ***/
/*********************************************************************/
DIV.main-right {
	 position: absolute;
	 top: 0px;
         left: 400px;
         width: 250px;
	 margin: 0px;
	 padding: 0px;
	 border: 0px solid rgb(50, 50, 50);
	 background: rgb(203, 203, 255);
}

/* inner white background with black border for non-tabular buttons */
/* (table cells that act as buttons have their own bg/border format) */ 
div.button{
    margin: 2px;
    padding: 4px;
    background-color: rgb(255, 255, 255);
    border: 2px solid rgb(0, 0, 0);
}

span.pagenumbering-current {
	   display: inline;
	   font-size: 10pt;
	   font-weight: bold;
           text-align: center;
	   vertical-align: middle;
	   line-height: 8pt;
}


DIV.main-pagenumbering-left {
	 position: absolute;
	 top: 0px;
	 left: 5px;
         width: 215px;
         height: 0px;
	 margin: 0px;
	 padding: 0px;
	 border: 0px solid rgb(50, 50, 50);
	 background: rgb(203, 203, 255);
	 color: rgb(0,0,0);
         font-size: 7pt;
}

DIV.main-pagenumbering-mid {
	 position: absolute;
	 top: 0px;
	 left: 220px;
         width: 215px;
         height: 0px;
	 margin: 0px;
	 padding: 0px;
	 border: 0px solid rgb(50, 50, 50);
	 background: rgb(203, 203, 255);
	 color: rgb(0,0,0);
         font-size: 7pt;
         text-align: center;
}

DIV.main-pagenumbering-right {
	 position: absolute;
	 top: 0px;
         left: 436px;
         width: 215px;
         height: 0px;
	 margin: 0px;
	 padding: 0px;
	 border: 0px solid rgb(50, 50, 50);
	 background: rgb(203, 203, 255);
	 color: rgb(0,0,0);
         font-size: 7pt;
         text-align: right;
}