body 
{
	font-family: Calibri, Arial, Century, Verdana; 
    border-top-width: 0; 
    border-bottom-width:0; 
    border-left-width: 0; 
    border-right-width: 0; 
    background-color: #E0E0E0; 
    background-image: url(graphics/xws_bkgrnd.png); 
    background-repeat: repeat;
}

.main_width
{
    width: 980px;    
    height: 100%; 
    padding: 0 0 0 0;
    margin: 0 auto;     /* centres main square on browser page */ 
    position: relative; 
}


.main_width .indent80 
{
    padding: 0px 0px 0px 80px;
}

.main_width .indent40 
{
    padding: 0px 0px 0px 40px;
}


.main_width .align_centre
{
/*    text-align: center;   */
    padding-left: 240px;
}

.logo .indent
{
    padding:  8px 0px 4px 20px;
    overflow: visible;    
}

/*** title-name on header ***/
.xws-name
{
    color: #5D95BA;
    font-family: Catriel, Calibri, Arial, Tahoma; 
    font-size: 48pt;
    font-weight: bold;
}
.xws-sub-name
{
    color: #5D95BA;
    font-family: Catriel, Calibri, Arial, Tahoma; 
    font-size: 10pt;
    font-weight: normal;
    text-align: right;
}


.title-name
{
    color: #5D95BA;
    font-family: Catriel; 
    font-size: 48pt;
    font-weight: bold;
    width: 301px;
    position: absolute;
    top: -1px;
    left: 372px;
}
.title-sub-name
{
    color: #5D95BA;
    font-family: Catriel; 
    font-size: 10pt;
    font-weight: normal;
    text-align: right;
    width: 101px;
    position: absolute;
    top: 61px;
    left: 542px;
}

/*** Content  ***/

.column-left
{
    float: left; 
    height: auto; 
    width: 280px;
    padding: 10px 10px 10px 0px;
}

.column-center
{
    float:left; 
    height: 100%;
    width: 91%;    /* 720px; */
    padding: 10px 10px 10px 0px; 
    vertical-align: text-top;   
}

/*** ( CORNERS ) ***/
	.column-center .corner-TL { background:url( graphics/corners/TL_green.gif ) no-repeat 0 0; height:100%;}
	.column-center .corner-TR { background:url( graphics/corners/TR_green.gif ) no-repeat right 0;}
	.column-center .corner-BL { background:url( graphics/corners/BL_green.gif ) no-repeat 0 bottom;}
	.column-center .corner-BR { background:url( graphics/corners/BR_green.gif ) no-repeat right bottom; height:100%;}
/*** ( end of CORNERS ) ***/

.column-right
{
    float: right; 
    height: auto; 
    width: 520px;
    padding: 10px 80px 10px 0px;
}

.column-small-center
{
/*    float:left; loses background! */
    height: 100%; 
    width: 220px;    
    padding: 10px 10px 10px 0px; 
    vertical-align: text-top;   
}


/*** for links page - two equal columns left and right ***/
.column-links-left
{
    float: left; 
    height: auto; 
    width: 400px;
    padding: 0px 0px 0px 0px;    /* 10px 10px 10px 10px; */
    /* margin: 10px 10px 10px 10px; */
    height: 100%;
    line-height: 1.35;
    background-color: White;
}
/*** ( CORNERS ) ***/
	.column-links-left .corner-TL { background:url( graphics/corners/TL_green.gif ) no-repeat 0 0; height:100%;}
	.column-links-left .corner-TR { background:url( graphics/corners/TR_green.gif ) no-repeat right 0;}
	.column-links-left .corner-BL { background:url( graphics/corners/BL_green.gif ) no-repeat 0 bottom;}
	.column-links-left .corner-BR { background:url( graphics/corners/BR_green.gif ) no-repeat right bottom; height:100%;}
/*** ( end of CORNERS ) ***/

.column-links-right
{
    float: right; 
    height: auto; 
    width: 400px;
    padding: 0px 0px 0px 0px;    /* 10px 10px 10px 10px; */
    height: 100%;
    line-height: 1.35;
    background-color: White;
}
/*** ( CORNERS ) ***/
	.column-links-right .corner-TL { background:url( graphics/corners/TL_green.gif ) no-repeat 0 0; height:100%;}
	.column-links-right .corner-TR { background:url( graphics/corners/TR_green.gif ) no-repeat right 0;}
	.column-links-right .corner-BL { background:url( graphics/corners/BL_green.gif ) no-repeat 0 bottom;}
	.column-links-right .corner-BR { background:url( graphics/corners/BR_green.gif ) no-repeat right bottom; height:100%;}
/*** ( end of CORNERS ) ***/

.column-links-left .mini-para
{
    width: 90%;
    vertical-align: text-top;
    font-size: small; /*1.3em;*/
    color: #444444;
}
.column-links-right .mini-para
{
    width: 90%;
    vertical-align: text-top;
    font-size: small; /*1.3em;*/
    color: #444444;
}

/*** spacing around images ***/
.column-links-left .imgBorder
{
    margin: 0px 20px 0px 20px;
    float: left;
}
.column-links-right .imgBorder
{
    margin: 0px 20px 0px 20px;
    float: left;
}





.headerMenu
{
    padding: 5px 0px 5px 10px;
    width: 790px;
    font-size: medium;
    color: White;
}


/*** central background - white ***/ 
.white-background
{
    background: White; 
    height: 100%;
}

/*** ( CORNERS ) ***/
	.white-background .corner-TL { background:url( graphics/corners/TL_green.gif ) no-repeat 0 0; height:100%;}
	.white-background .corner-TR { background:url( graphics/corners/TR_green.gif ) no-repeat right 0;}
	.white-background .corner-BL { background:url( graphics/corners/BL_green.gif ) no-repeat 0 bottom;}
	.white-background .corner-BR { background:url( graphics/corners/BR_green.gif ) no-repeat right bottom; height:100%;}
/*** ( end of CORNERS ) ***/


/*** white text ***/ 
.white-text
{
    color: White; 
}

/*** text box ***/
.text-box
{
    clear: both;
    font-size: small; /*1.3em;*/
    line-height: 1.35em;
    padding: 5px 20px 0px 20px;
    color: #444444;
    height: 100%;   /* added 26/05/2009 to cure float losing background color setting... no effect */ 
}
.text-box p
{
    padding: 5px 5px 5px 5px;
    width: 100%;
/*    background: white; */
}
.text-box p span
{
    color: #b75601;
    font-size: 1.1em;
}

.textbox .mini-para
{
    width: 80%;
    vertical-align: text-top;
}



/*** spacing around images ***/
.imgBorder
{
    margin: 0px 20px 0px 0px;
    float: left;
}

.imgNoBorder
{
    margin: 0px 0px 0px 0px;
    float: left;
}

a:link { color: White; text-decoration: none; }
a:visited { color: #CECECE; text-decoration: none; } 
a:hover { color: Orange; } 
a:active { color: Red; } 


hr
{
    color: #C0C0C0;
    background-color: #C0C0C0;
    height: 1px;
    border: none;
}


td
{ font-family: Calibri, Arial; 
	font-size: small; 
    color: #333333; 
} 


HeaderText
{
	font-family: Calibri, Arial;
	font-size: larger;
	font-weight: bold
}

/* classes - start with a dot! */ 
.smallGrey
{
    font-size: 8pt; 
    font-family: Calibri,Arial; 
    color: Gray
}

img.floatLeft 
{ 
    float: left; 
    margin: 5px; 
}

img.floatRight 
{ 
    float: right; 
    margin: 5px; 
}


.footer
{
    clear: both;
    overflow: visible;    
    line-height: 1.5em;
    font-size: 1.2em;
    font-weight: bold;
    color: #f8f1d9;
    text-align: center;
    padding: 30px 0px 0px 0px;
}


/*** menu items ***/ 

.MenuItem
{
    background: url(graphics/menu/mnu_bkgrnd_3.png) repeat-x 0 0;
    padding: 30px 20px 30px 20px;
    font-size: small;
}

/* for search button - but doesn't place it on same line. 
.MenuItemRight
{
    background: url(graphics/menu/mnu_bkgrnd_3.png) repeat-x 0 0;
    padding: 30px 20px 30px 20px;
    font-size: small;
    float: right;
    vertical-align: top;
}
*/



/********************************************************************************/
/*** panels ***/ 
/********************************************************************************/
.panel
{
    background: url(graphics/panels/panel-bg1.gif) repeat-y 0 0;
    margin: 0px 0px 10px 0px;
}

.panel .title
{
    height: 100%;
    padding: 0px 19px 0px 19px;
}

.panel h5
{
    padding: 0 0 10px 0;
}

.panel h2
{
    font-size: large;
    color: #ffec87;
    font-weight: bold;
    background: url(graphics/panels/panel-line1.gif) repeat-x 0 bottom;
    padding: 8px 0px 6px 4px;
    width: 237px;
}

.panel .indent
{
    clear: both;
    overflow: visible;    
    font-size: 1.2em;
    color: #f8f1d9;
    height: 100%;
    background: url(graphics/panels/panel-bot1.gif) no-repeat 0 bottom;
}
.panel .indent
{
    padding: 12px 10px 12px 12px;
}
.panel a
{
    color: #ffec87; 
    font-size: 1.1em;
    padding: 4px 0px 0px 20px;
}


/********************************************************************************/
/*  panel_orange                                                           */
/********************************************************************************/
.panel_orange
{
    background: url(graphics/panels/panel-bg1.gif) repeat-y 0 0;
}
/*** ( CORNERS ) ***/
	.panel_orange .corner-TL { background:url( graphics/corners/TL_orange.gif ) no-repeat 0 0; height:100%;}
	.panel_orange .corner-TR { background:url( graphics/corners/TR_orange.gif ) no-repeat right 0;}
	.panel_orange .corner-BL { background:url( graphics/corners/BL_orange.gif ) no-repeat 0 bottom;}
	.panel_orange .corner-BR { background:url( graphics/corners/BR_orange.gif ) no-repeat right bottom; height:100%;}
/*** ( end of CORNERS ) ***/
.panel_orange .panel-bg
{
    background: url(graphics/panels/panel-top1.jpg) no-repeat 0 0;
    width: 280px;
}
.panel_orange h2
{
    background: url(graphics/panels/panel-line1.gif) repeat-x 0 bottom;
}
.panel_orange .indent
{
    background: url(graphics/panels/panel-bot1.gif) no-repeat 0 bottom;
}
.panel_orange .panel_my_li
{
    background: url(graphics/panels/panel-marker1.gif) no-repeat  5px 3px;
    padding: 0px 0px 8px 25px;
    width: 220px;
}
.panel_orange li
{
    background: url(graphics/panels/panel-marker1.gif) no-repeat 0 3px;
}

/********************************************************************************/
/*  panel_red                                                              */
/********************************************************************************/

.panel_red
{
    background: url(graphics/panels/panel-bg2.gif) repeat-y 0 0;
}
/*** ( CORNERS ) ***/
	.panel_red .corner-TL { background:url( graphics/corners/TL_red.gif ) no-repeat 0 0; height:100%;}
	.panel_red .corner-TR { background:url( graphics/corners/TR_red.gif ) no-repeat right 0;}
	.panel_red .corner-BL { background:url( graphics/corners/BL_red.gif ) no-repeat 0 bottom;}
	.panel_red .corner-BR { background:url( graphics/corners/BR_red.gif ) no-repeat right bottom; height:100%;}
/*** ( end of CORNERS ) ***/
.panel_red .panel-bg
{
    background: url(graphics/panels/panel-top2.jpg) no-repeat 0 0;
    width: 280px;
}


.panel_red h2
{
    background: url(graphics/panels/panel-line2.gif) repeat-x 0 bottom;
}
.panel_red .indent
{
    background: url(graphics/panels/panel-bot2.gif) no-repeat 0 bottom;
}
.panel_red .panel_my_li
{
    background: url(graphics/panels/panel-marker2.gif) no-repeat  5px 3px;
    padding: 0px 0px 8px 25px;
    width: 220px;
}
.panel_red li
{
    background: url(graphics/panels/panel-marker2.gif) no-repeat 0 3px;
}


/********************************************************************************/
/*  panel_ltgreen                                                                 */
/********************************************************************************/

.panel_ltgreen 
{ 
    background:url(graphics/panels/panel-bg3.gif) repeat-y 0 0;
    width: 224px;
    float: right;
/*    position: absolute;
    top: 510px;
    left: 650px;    */
}

.panel_ltgreen .panel-bg 
{ 
    background:url(graphics/panels/panel-top3.jpg) no-repeat 0 0;
    padding: 10px 20px 10px 20px;
    width: 224px;  
}
.panel_ltgreen p
{
    width: 80%;
}

.panel_ltgreen .indent 
{ 
    background:url(graphics/panels/panel-bot3.gif) no-repeat 0 bottom; padding-bottom:30px;
}
.panel_ltgreen .panel_my_li
{
    background: url(graphics/panels/panel-marker3.gif) no-repeat  5px 3px;
    padding: 0px 0px 8px 25px;
    width: 140px;
}

/********************************************************************************/

/*** for InTime ajax MV view indentations ***/ 
.ViewIndent160 
{
    padding: 0px 0px 0px 160px;
}


/********************************************************************************/

/*** for floating right box ***/ 
.box-right
{
    float: right; 
    height: 100%; 
    width: 360px;   /* was 270 */ 
    padding: 10px 10px 10px 10px;
    border: solid 1px #5D95BA; 
    color: #888888;
    overflow: auto; 
    clear: none; 
    line-height: 22px; 
    /* word-spacing: 30px; has no effect */ 
}


/* ------------------- for pre-loading images in page before... ---------------- */ 

.hiddenPic {display:none;}

/* --------------------- */ 
.styleRed
{
    color: Red;
    font-size: x-small;
}