/*******************************************
COLOURS
#025689
#5E7387
#D0D0D0
#F5F5F5
#ddd
#a5a5a5
#dbdbdb
#FFA266
#FE6E17
*******************************************/

html {/* Stops flickering of background images in IE6*/
  filter: expression(document.execCommand("BackgroundImageCache", false, true));}

html, body, ul, ol, li, p, h1, h2, h3, h4, h5, h6, form, fieldset, a {
    margin: 0;
    padding: 0;
    border: 0;} 

body {
	text-align: center;
	background: url(../designs/bg.gif) top left repeat-x #000;
    width: 100%;}    
    
body, p, div, td {
    font: 12px/18px Verdana, Arial, Helvetica, sans-serif;}

h1, h2, h3, h4, h5, h6 {
    font-weight: bold;
    margin-bottom: 18px;
    color: #FE6E17;}

h1 {font-size: 160%;}
h2 {font-size: 150%;}
h3 {font-size: 140%;}
h4 {font-size: 130%;}
h5 {font-size: 120%;}
h6 {font-size: 110%;}

ol, ul {margin: 0 0 18px 36px;}

ol ol,
ul ul,
ol ul,
ul ol {margin-bottom: 0;}

p, 
#content table {margin-bottom: 18px;}

a:link,
a:visited {color: #025689;}

a:focus,
a:hover,
a:active {
    color: #025689;
    text-decoration: underline;}


/*******************************************
LAYOUT
*******************************************/

#layout {
    background-color: #fff;
    margin: 30px auto;
    text-align: left;
    width: 90%;}

#container {
    width: 100%;
	line-height: 150%;
	background: url(../designs/container-bg.gif) bottom left repeat-y;
	text-align:left;}

#ie6only #container {
    height:100%;} 
    
    #header {
    	background: url(../designs/nib.jpg) top left no-repeat #fff;
    	height:103px;}
    
    #ie6only #header {margin-top:-3px;}

   
    
        #headerbg {
        	background:url(../designs/header-bg.jpg) bottom right no-repeat;
        	height:103px;}

            #steadfast {
            	background: url(../designs/steadfast-logo.gif) top left no-repeat;
            	height: 50px;
            	width: 135px;
            	float: left;
                margin: 29px 0 0 296px;}
                   
            #ie6only #steadfast	{
            	margin-left: 165px;}

            #search {
                margin: 39px 8px 0 0;
            	padding-top: 27px;
                width: 193px;
            	float: right;
            	font-size: 10px;
            	background: url(../designs/search-text.gif) top right no-repeat;}
                
             #ie6only #search { 
                margin: 36px 8px 0 0;
                padding: 0;}
                
                #search form { float:left;}
                
                #searchval {
                	border: 1px solid #5E7387;
                	width: 130px;}
                	
                .searchField {
                	margin-top: 3px;
                	border: 1px solid #D0D0D0;
                	width: 149px;
                	height: 27px;
                	vertical-align: middle;
                	float: right;}
                
                #ie6only .searchField {
                    position: relative;
                    top: 30px;}
                
                .searchButton {
                    background: url(../designs/search.gif) top left no-repeat transparent;
                	height: 36px;
                	width: 40px;
                	border: 0;
                	font-size: 1px;
                	color: #000;
                	cursor: pointer;}
                    
                #ie7only .searchButton {height: 33px;}
                
                .searchResultHeader {
                    font-size: 14px;
                    font-weight: bold;}
                
                .searchResultInfo {padding-bottom: 20px;}
                
                .searchResultAbstract {
                	font-style : italic;
                	padding-bottom: 15px;
                	width: 95%;} 

    #subHeader {
    	background:url(../designs/subheader-bg.gif) top left repeat-x;
    	height:180px;}

    #subcontainer {
    	margin:0;
    	background-color:#fff;}

        #sidebar {
            width:250px;
            float:left;
            line-height:1.75em;
        	background-color:#fff;
        	padding-top:10px;}

        #ie6only #sidebar,
        #ie7only #sidebar	{
            margin-right:-3px;}
            
            .tabImg	{
                padding:0;
                margin:0;
                width:247px;}
            
            .tabImg:hover {
                filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50);
                -moz-opacity: 0.5;}
            

        #content {
            padding: 36px;
            line-height: 1.75em;
        	background-color:#F5F5F5;
        	min-height:325px;}

        #paperFold {
            padding:0 20px;
            font-size:80%;
            line-height:1.75em;
        	background: url(../designs/content-bg.gif) bottom right no-repeat #f5f5f5;
        	height:35px;}
        
        #sfInfo {
        	clear:none;
        	/*margin-left:246px;*/
            padding:40px;
            line-height:1.75em;
        	background: url(../designs/content-bg.gif) bottom right no-repeat #DDD;
        	padding-bottom:35px;
        	height: auto !important;
        	height: 1%; /*For IE*/}

    #footer {
        xclear:both;
        xfont-size:75%;
        color:#fff;
    	height:32px;
    	background: url(../designs/footer.gif) bottom right no-repeat #a5a5a5;}
        
        #footer span.emphasised {
            left-margin:1em;
            font-weight:bold;
            color:#fff;}

        #util {}

    #copyright {
        display: none;
    	clear: both;
    	color: #fff;
    	font-size: 11px;
        padding: 5px 0 0 10px;
    	vertical-align: middle;
    	text-align: center;}

/*******************************************
FIXES
*******************************************/        

#ie7only .imgFix {margin-bottom: -3px;}     
        
/*******************************************
MINIGEN
*******************************************/


/*******************************************
ARTICLES
*******************************************/
#articleContainer {}

.primaryArticleCategory {}
.primaryArticleCategory h1 {}
.primaryArticleCategory h2 {}

.secondaryArticleCategory {margin-left: 30px;}
.secondaryArticleCategory h1 {}
.secondaryArticleCategory h2 {}

.articleItem {margin-left: 10px;}
.articleBody {margin-left: 10px;}

/*******************************************
NEWS
*******************************************/
/*******************************************

#rightBar	{
    margin: 0;
    padding: 0;
    width: 223px;
    float: right;
	background-color: #5E7275;
	margin-top: 20px;
	color: #ffffff;}

#rightBar h4	{
    color: #ffffff;}

#generalNews	{
    margin-top: 20px;
    min-height: 200px;
    color: #ffffff;
    padding-bottom: 61px;
    background-image: url(../images/hoed-members.gif);
    background-position: bottom left;
    background-repeat: no-repeat;}

*html #generalNews	{
height: 200px;}

#newsPanel {
    font-size: 12px;
    font-family: Arial, Helvetica, sans-serif;}

#newsPanel h2 {
    font-size: 140%;
    padding: 0;
    margin: 0;
	color: #ffffff;}
#newsPanel ul {
    padding: 0;
    margin: 0;
    list-style-type: none;}
    
#newsPanel ul li ul li {
    padding-bottom: 10px;
	padding-left: 40px;}
    
#newsPanel .primaryNewsCategoryTitle {
    font-weight: bold;
    font-size: 120%;
    color: #ffffff;
	display: block;
	padding-top: 10px;
    padding-bottom: 10px;
	padding-left: 40px;
	background-color: #B2C900;
	margin-bottom: 20px;}
    
#newsPanel .secondaryNewsCategoryTitle {
    font-weight: bold;
    font-size: 120%;
    color: #ffffff;
    padding-top: 10px;
    padding-bottom: 10px;
	padding-left: 40px;
	background-color: #B2C900;
	margin-bottom: 20px;}
    
#newsPanel .newsItemTitle {
    font-weight: bold;
	color: #ffffff;}
    
#newsPanel .newsItemDate {}

#newsPanel .newsItemDescription {
    padding-bottom: 10px;}
    
#newsPanel .newsItemSummary {
    color: #ffffff;}
    
#newsPanel .newsItemLink a{
    color: #ffffff;}
    
#courseCalendar	{
	background-image: url(../designs/right-sec-bot.jpg);
	background-repeat: no-repeat;
	background-position: top left;
	margin: 0;
	padding: 0;
	min-width: 170px;
	background-color: #ffffff;
	padding: 20px;}
	
*html #courseCalendar	{width: 210px;}

#courseCalendar img	{
    margin: 0;
    padding: 0;}

#courseCalendar h3	{
    margin: 0;
    padding: 0;
    padding-top: 40px;
    padding-bottom: 10px;
    font-size: 80%;
    font-weight: bold;}
#logos	{
    margin: 0;
    padding: 0;
    width: 223px;
    float: right;
	color: #ffffff;
	background-color: #ffffff;}


*******************************************/
/*******************************************
FORMS LIBRARY
*******************************************/

#forms #content {padding-top: 20px;}

    #forms #formHeaderDetails {width: 100%;}

    #forms #flashyTable {
        width: 600px;} 
        
        #forms #flashyTable .buttonCell {
            border: 2px outset #dbdbdb;
            height: 87px;
            background: url(http://202.40.163.206/networkib/designs/header-bg.jpg) top right no-repeat #fff;
            width: 500px;}    
            
        #forms #employmentCell {display: none;}
        
            #forms #flashyTable .heightSpacer {height: 100px;}    
            
            #forms #flashyTable .buttonCell .popopen {
                width: 500px;
                margin-left: 20px;}

.generalForm {
    clear: both;}

#footerText {clear: both;}

#footerText p {margin-bottom: 18px;}

@media print 
{
    html, body, ul, ol, li, p, h1, h2, h3, h4, h5, h6, form, fieldset, a {
        margin: 0;
        padding: 0;
        border: 0;} 

        #subHeader,
        #sidebar {display: none;}
}


/*******************************************
Vertical Menu
*******************************************/

/* Root = Vertical, Secondary = Vertical */

ul#primary,
ul#primary li,
ul#primary ul {
  margin: 0;
  padding: 0;
  width: 246px; /*For KHTML*/
  list-style: none; }
  
*html ul#primary,
*html ul#primary li,
*html ul#primary ul {
width:246px;}

ul#primary li	{
border:0;
padding:0px;
margin:0px;
width:246px;}

ul#primary:after /*From IE 7 lack of compliance*/{
  clear: both;
  display: block;
  font: 1px/0px serif;
  content: ".";
  height: 0;
  visibility: hidden;}

/* Root Menu a */
ul#primary a {
  margin:0;
  padding:0;
  display: block;
  height: auto !important;
  height: 1%; /*For IE*/
  xheight:45px;}


/* Root Menu li (none ahref) */
ul#primary li,
ul#primary li li {
  float: left; /*For IE 7 lack of compliance*/
  position: relative;
  display: block !important; /*For GOOD browsers*/
  height: auto !important;
  height: 1%; /*For IE*/
}

/* Root Menu Hover Persistence */
ul#primary a:hover,
ul#primary li:hover,
ul#primary li.iehover {
    background: #FFA266;
    color: #000;}

#ie7only ul#primary a:hover {
    filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50);
    -moz-opacity: 0.5;
    opacity: 0.5;}

/* 2nd Menu */
ul#primary li:hover li,
ul#primary li.iehover li {
    height: 45px;
    width: 235px;}

#ie7only ul#primary li:hover li,
#ie7only ul#primary li.iehover li,
#ie6only ul#primary li:hover li,
#ie6only ul#primary li.iehover li {
    height: 45px;
    width: 246px;}

ul#primary li:hover li a,
ul#primary li:hover li,
ul#primary li.iehover li a,
ul#primary li.iehover li {
    background: #FFA266;
    color: #000000;
    font-size:11px;
    text-decoration:none;}

ul#primary li:hover li a,
ul#primary li.iehover li a	{
    font-weight:bold;
    text-shadow: 3px 3px 5px red ;}

ul#primary li:hover li,
ul#primary li.iehover li	{
    border-left: 1px solid #fff;
    padding: 3px 0 0 10px;
    border-bottom: 1px dotted #000;}
    
/* 2nd Menu Hover Persistence */
ul#primary li:hover li a:hover,
ul#primary li:hover li:hover,
ul#primary li.iehover li a:hover,
ul#primary li.iehover li.iehover {
    color: #000;}

/* 3rd Menu */
ul#primary li:hover li:hover li,
ul#primary li.iehover li.iehover li {
    height: 45px;
    width: 235px;}
  
#ie7only ul#primary li:hover li:hover li,
#ie7only ul#primary li.iehover li.iehover li,
#ie6only ul#primary li:hover li:hover li,
#ie6only ul#primary li.iehover li.iehover li {
    height: 45px;
    width: 246px;}
  
ul#primary li:hover li:hover li a,
ul#primary li:hover li:hover li,
ul#primary li.iehover li.iehover li a,
ul#primary li.iehover li.iehover li {
    background: #FFA266;
    color: #000;
    font-size: 11px;}

ul#primary li:hover li:hover li,
ul#primary li.iehover li.iehover li	{
    background: #FFA266;
    color: #000;
    border-left: 1px solid #fff;
    border-bottom: 1px dotted #000;
    padding: 3px 0 0 10px;}
  
/* 3rd Menu Hover Persistence */
ul#primary li:hover li:hover li a:hover,
ul#primary li:hover li:hover li:hover,
ul#primary li.iehover li.iehover li a:hover,
ul#primary li.iehover li.iehover li.iehover {
    background: #FFA266;
    color: #000;}

/* 4th Menu */
ul#primary li:hover li:hover li:hover li,
ul#primary li.iehover li.iehover li.iehover li {
    background: #FFA266;
    color: #000;
    border-left: 1px solid #fff;
    padding: 3px 0 0 10px;
    height: 45px;
    width: 246px;}

/* 4th Menu Hover */
ul#primary li:hover li:hover li:hover li a:hover,
ul#primary li.iehover li.iehover li.iehover li a:hover {
    background: #FFA266;
    color: #000;}

ul#primary ul,
ul#primary ul ul,
ul#primary ul ul ul {
    display: none;
    position: absolute;
    top: 0;
    left: 245px;}

/* Do Not Move - Must Come Before display:block for Gecko */
ul#primary li:hover ul ul,
ul#primary li:hover ul ul ul,
ul#primary li.iehover ul ul,
ul#primary li.iehover ul ul ul {
    display: none;}

ul#primary li:hover ul,
ul#primary ul li:hover ul,
ul#primary ul ul li:hover ul,
ul#primary li.iehover ul,
ul#primary ul li.iehover ul,
ul#primary ul ul li.iehover ul {
    display: block;}

ul#primary li#navSelected {}

/* Primary style end  */    
    
/*******************************************
UTIL NAV
*******************************************/

ul#utility { 
	float:left;
    text-align: center;
	vertical-align:middle;
	padding:2px 12px;}

ul#utility li {
	font-size: 11px;
    display: inline;
    list-style: none;
    padding: 0 8px;
  	color: #09C;
    background:url(../designs/utilDivider.gif) top right no-repeat;}

ul#utility li.lastLi {
	border-right: 0 none;
	background:none;
	padding-right:20px;}

ul#utility a {
    color: #000;
    text-decoration: none;
    background: none;
    padding: 0px 8px;}

ul#utility li a:hover {
    color: #fff;
	text-decoration: none;}