/***********************************************/
/* stylesnew.css                              */
/* Use for RAL web site design and layout     */
/* by Lara Ziady                              */
/* June 16, 2005                              */
/***********************************************/

/***********************************************/
/* HTML tag styles                             */
/***********************************************/ 


body {
	background-color: #FFFFFF;
	font-family: Verdana, Geneva, Tahoma, Arial, Helvetica, sans-serif;
	font-size: 13px;
	margin-top: 0px;
	margin-left: 0px;
	margin-right: 0px;
    }
p {
	font-family: Verdana, Geneva, Tahoma, Arial, Helvetica, sans-serif;
	font-size: 13px;
    }
	
h1 {
	font-size: 16px;
	font-weight: normal;
	color: #3366CC;
	margin-top: 0px;
	margin-bottom: 0px;
	line-height: 16px;
	padding-top: 0px;
	padding-bottom: 0px;
	height: 18px;
	}
	
.h2 {                              
	font-size: 13px;
	font-weight: bold;
	
	}
	
h3 {
	font-size: 12px;
	font-weight: bold;
	}
	
h4 {
	font-size: 12px;
	font-style: italic;
	font-weight: bold;
	}
	
a {
    color: #0850A3;
	text-decoration: none;
	}
a:hover {
    color: #6633CC;
	text-decoration: underline;
	}
	
a:visited {
    color: #6633CC;
	text-decoration: none;
	}
	
a:visited:hover {
    color: #6633CC;
	text-decoration: underline;
	}

ul{
 list-style-type: square;
}

ul ul{
 list-style-type: disc;
}

ul ul ul{
 list-style-type: none;
}	


/***********************************************/
/* Layout Divs                                 */
/***********************************************/ 
#siteHead{
	padding: 0px 0px 0px 0px;
	width: 100%;
	height: 100px;
	background-color:#374769;
}

#spacer {
	clear: both
	}
	
#containerTitle {
    width: 95%;
	margin-left: 147px;
	text-align:left;
	padding: 3px;
	height: 35px;
}
    #containerTitle .pagetitle {
	  float: left;
	  text-align: left;
	  width: 49%;
	  }
	  
	#containerTitle .search {
	  position: absolute;
	  left: 70%;
	  top:100px;
	  width: 150px;
	  height:25px;
	  background-color:#FFCC66
	  }

#contentLeft{
	float: left;
	width: 140px;
	margin: 0px 0px 0 5px;
	padding: 0px;
	background-color: #eeeeee;
	border-right: 1px solid #cccccc;
	border-bottom: 1px solid #cccccc;
}

#contentRight{
    position: absolute;
	left: 80%;
	top: 130px;
	width: 140px;
	z-index: 3;
	color: #000;
	padding: 3px;
	}

#content {
	margin: 0px 22% 0 152px;
	padding: 0px;
	color: #000;
	text-align:justify;
}

#footer {
	clear: both;
	width: 95%;
	margin: 10px;
	text-align:center;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	padding: 3px;
	border-top: 1px solid #cccccc;
	color:#666666;
	}




/***********************************************/
/* Components                                  */
/***********************************************/ 
.sectionHeader {              /***************  Block Section Header *********/ 
	font-size: 13px;
	font-weight: bold;
	display: block;
	color: #FFFFFF;
	background-color: #7080a0;
	padding: 2px
	}
                            /***************  floating thumbnails *********/ 
div.float {
  float: left;
  width: 130px;
  padding-left: 0px;
  padding-right: 12px;
  padding-top: 0px;
  padding-bottom: 4px;
  }
  
div.float p {
   text-align: center;
   }
   
div.container {
  border: 2px dashed #333;
  background-color: #99FFCC;
  }
                           /*************** end floating thumbnails *********/ 






/***********************************************/
/* Navigation                                  */
/***********************************************/ 



/* HEADERNAV transforms an unordered list into horizontal navigation tabs */
/* change url to substitute your own image background: */

div#headernav { 
		  position: relative;
		  width: 100%;
		  height: 100px;
		  background-color: #374769; /*-- for some reason, this doesn't work to set background color; I set the color on the #siteHead div; try to figure out */
          background: url('/images/header/ral-header750.jpg') no-repeat top left ; 
          border: 0px none; 
          }

div#headernav ul#header_menu { 
          padding: 0; 
          margin: 0; 
          list-style-type: none; 
          text-align: center;
		  white-space: nowrap;
		  position: absolute;
	      bottom: -0.5px;
		  left: 15em;
		  /* A width is required for Opera, older Mozilla browsers,
	      and Konqueror browsers. */
		  width: 40em;
          }

div#headernav ul#header_menu li { 
          display: block; 
          float: left; 
          text-align: center;
		  white-space: nowrap;
	   
          }

div#headernav ul#header_menu li a { 
          color: white; 
          background: #0068ae; 
          font-size: .85em; 
          display: block; 
          height: 16px; width: 130px; 
          font-weight: bold; 
          border-right: 2px black solid; 
          border-top: 1px #6ea9d1 solid; 
          border-bottom: 1px black solid; 
          }

div#headernav ul#header_menu li a:hover { 
          color: #0068ae; 
          background: #ffffff; 
          text-decoration: none; 
          border-top: 1px white solid; 
          border-bottom: 1px black solid; 
          }

div#headernav ul#header_menu li a.selected { 
          background: #ffffff; 
          color: #0068ae; 
          border-top: 1px white solid; 
          border-bottom: 1px white solid; 
          }

div#headernav ul#header_menu li a.selectedgray { 
          background: #EDEDED; 
          color: #0068ae; 
          border-top: 1px #EDEDED solid; 
          border-bottom: 1px #EDEDED solid; 
          }

div#headernav ul#header_menu li a.selected:hover { 
          border-top: 1px white solid; 
          border-bottom: 1px white-solid; 
          }

div#headernav ul#header_menu li a.selectedgrey:hover { 
          border-top: 1px white solid; 
          border-bottom: 1px white-solid; 
          }

div#headernav_parents { 
          display: block; 
          float: left; 
          margin-left: 85px; 
          margin-right: 20px; 
          font-size: .9em; 
		  color: white;
		  position: absolute;
	      bottom: 3px;
		  left: 1px; 
          }

div#headernav_parents a { 
          color: white; 
          }
/* end HEADERNAV */


/* SIDENAV class formats unordered lists as left column navigation  */
ul.sidenav {   /* set properties of level 1 - sidenav headings */
	font-size: 10px;
	list-style-type: none;
	color: #FFFFFF;   /* font color of sidenav headings */
	font-weight: normal;
	background-color: #759DC3;   /* background color of sidenav headings */
	margin: 0;
	padding: 0;
	text-indent: 0.4em;
	width: 100%;
	}
html>body ul.rollmenu {width: 100%}  /* code for Opera browser */
ul.sidenav li {
	font-size: 10px;
	width: 100%;
	font-weight: bold;
	display: block;
	line-height: 14px;   /* space between lines */
	}
ul.sidenav ul {
	list-style-type: none;
	font-weight: normal;
	color: black;
	padding: 0;
	margin: 0;
	text-indent: 1em;
	background-color: #FFFFFF;
	}
ul.sidenav ul ul {  /* set properties of level 3  */
	list-style-type: none;
	font-weight: normal;
	color: black; /* font color of sidenav links */
	padding: 0;
	margin: 0;
	text-indent: 2em;
	}
ul.sidenav ul ul ul {  /* set properties of level 4  */
	list-style-type: none;
	font-weight: normal;
	color: black; /* font color of sidenav links */
	padding: 0;
	margin: 0;
	text-indent: 3em;
	}
ul.sidenav a {  /*  links  */
    text-decoration: none;
    display: block;
	border-bottom: 1px solid #5D8AB5;
	}
html>body ul.sidenav a {width: auto}  /* code for Opera browser */
ul.sidenav a:hover {
    background-color: #DFDEDE;
	text-decoration: none;
	}
ul.sidenav.hilite {
    background-color: #DFDEDE;
	text-decoration: none;
	}
/* end sidenav code */
 
/*  begin Dropdown menu, courtesy ofhttp://www.tanfa.co.uk/ */



#menu{
width:100%;
float:left;
}

#menu a, #menu h2{
font:bold 11px/16px arial,helvetica,sans-serif;
display:block;
border-width:1px;
border-style:solid;
border-color:#ccc #888 #555 #bbb;
white-space:nowrap;
margin:0;
padding:1px 0 1px 3px;
}

#menu h2{
color:#fff;
background:#000 url(/css/images/expand3.gif) no-repeat 100% 100%;
text-transform:uppercase
}

#menu a{
background:#eee;
text-decoration:none;
}

#menu a, #menu a:visited{
color:#000;
}

#menu a:hover{
color:#000;
background:#ddd;
}

#menu a:active{
color:#060;
background:#ccc;
}

#menu ul{
list-style:none;
margin:0;
padding:0;
float:left;
width:9em;
}

#menu li{
position:relative;
}

#menu ul ul{
position:absolute;
z-index:500;
top:auto;
display:none;
}

#menu ul ul ul{
top:0;
left:100%;
}

/* Begin non-anchor hover selectors */

/* Enter the more specific element (div) selector
on non-anchor hovers for IE5.x to comply with the
older version of csshover.htc - V1.21.041022. It
improves IE's performance speed to use the older
file and this method */

div#menu h2:hover{
background:#000 url(/css/images/expand3.gif) no-repeat -999px -9999px;
}

div#menu li:hover{
cursor:pointer;
z-index:100;
}

div#menu li:hover ul ul,
div#menu li li:hover ul ul,
div#menu li li li:hover ul ul,
div#menu li li li li:hover ul ul
{display:none;}

div#menu li:hover ul,
div#menu li li:hover ul,
div#menu li li li:hover ul,
div#menu li li li li:hover ul
{display:block;}

/* End of non-anchor hover selectors */

/* Styling for Expand */

#menu a.x, #menu a.x:visited{
font-weight:bold;
color:#000;
background:#eee url(/css/images/expand3.gif) no-repeat 100% 100%;
}

#menu a.x:hover{
color:#a00;
background:#ddd;
}

#menu a.x:active{
color:#060;
background:#ccc;
}


/*   end Dropdown menu */