@charset "UTF-8";
/* CSS Document */


/* simple reset 
body,div,ul,ol,li,h1,h2,h3,h4,h5,h6,form,fieldset,input,textarea,p,th,td 
{margin:0;padding:0;} */

/* even simpler reset 
* {
	margin:0;
	padding:0;
}
*/
   
#rj_headerWrapper {
position: relative; /* set to relative so that #caIcon can be positioned absolute */
width: 950px;
margin: 0 auto;
vertical-align: top;
font: small/1.4 Arial,Helvetica,sans-serif bold;
}

/* this styles the gloabal nav ul */
#rj_nav {
float: left; /* Contain floated list items */
width: 950px;
height: 23px;
padding: 0;
background: #003366;
list-style-type: none;
/*margin: -3px 0 0 0;*/
margin:0;
}

#caIcon {
	/*float: left;*/
	position: absolute;
	background-image:url(https://www.employeradvice.com/public/images/ca_state_icon101x128.png);
	background-repeat:no-repeat;
	width:101px;
	height: 128px;
	border: none;
	/*top: -24px; original position when icon was placed in siteID section of code*/ 
	top: 8px;
	left: 10px;
	z-index:4;
}

#caIcon a {
	border:none;
}

#ie6only #caIcon {
	/*float: left;*/
	position: absolute;
	background-image:url(https://www.employeradvice.com/public/images/ca_state_icon_ie_60x76.gif);
	background-repeat:no-repeat;
	width:101px;
	height: 128px;
	border: none;
	/*top: -24px; original position when icon was placed in siteID section of code*/ 
	top: 40px;
	left: 25px;
	z-index:5;
}

#ie6only #caIcon a {
	border:none;
}
	

/* removes the default margin and padding form the list items */
#rj_nav li {
margin: 0;
padding: 0;
float: left; /* this corrects the ie6 li spacing issue. I can remove this is I don't target ie6 */
position:relative; /* this postions the li away from the left side to make room for the CA logo */
left: 70px; /* this is the left position */
height:23px;
}

#rj_nav a {
float: left;
width: 200px;
font-size: 100%;
text-align: center;
color: #c2c2c2;
text-decoration: none;
line-height: 23px; /* this adjust the height between each a element
and is similar to what you might think you can do with padding
you can use pixels or just a generic number, but the latter creates
height differently. I can also use padding above and set line-height to
0, but I wonder if that causes problems in IE*/
border-right:1px solid #707070;
height:23px;
}

#rj_nav #nav_coca a {
border-right: none; /* no border since this is the last nav item */
}

#rj_nav li:hover a {
line-height: 23px;
width: 200px;
height:23px;
/*background: #336699;*/
color:#e1e1e1;
}

/* this creates the 'you are here' effect for each page the nav links
too. Of course, this example only effects the home page since I'm
not creating the other pages for this excercise. I put the id "body_hom"
in the body tag. This technique allows you to use a server side include
for the navigation html or a library in dreamweaver */
#body_eri #nav_eri a,
#body_ced #nav_ced a,
#body_cea #nav_cea a,
#body_coca #nav_coca a {
background: #003366;
color: #e1e1e1;
font-weight: bold;
}

/* middle section of header */
#rj_siteID {
	overflow:hidden; /* this fixed the extra space that appeared between the siteID and CEA nav
	in Opera, all ie versions and chrome. I didn't need to use this when I previewed the header 
	by itself, but when I placed in within all of the home page code this break occured*/
	display: block;
	float: left;
	background-image:url(https://www.employeradvice.com/public/images/header_site_id_graphic950x86.gif);
	background-repeat: no-repeat;
	width:950px;
	height:86px;
	border-top: 1px solid #003366;
	margin-top:2px;
	border-bottom: 1px solid #003366;
	margin-bottom:2px;
}

/* positioin sign in and join btns and contact # section */
#rj_login {
	float: right;
	position: relative;
	top: 20px;
	right: 10px;
	/*top: -114px; if standalone header this is correct. In context of entire home page
	use top: 20px; and right: 4px; */
	z-index:2;
}

#rj_logout {
	float: right;
	position: relative;
	top: 10px;
	right: 10px;
	/*top: -114px; if standalone header this is correct. In context of entire home page
	use top: 20px; and right: 4px; */
	z-index:2;
}

/* sign in button */
#rj_btnSignIn {
	margin-right:0px;
	border: none;
}

/* join button */
#rj_btnJoin {
	position:relative;
	border:none;
	top: -1px; /* makes minor tweak to position */
}

/* logout button */
#rj_btnLogout {
	position:relative;
	border:none;
	top: -1px; /* makes minor tweak to position */
}

/*contact us phone number */
p.rj_contactUs {
	font-size: 14px;
	color: #cc6600;
	text-align: right;
	margin-right: 8px;
	margin-top: -2px;
	}
	
	
/* ============= this styles the cea nav section =========== */
#rj_ceaNavContainer {
float: left; /* Contain floated list items */
background-image:url(https://www.employeradvice.com/public/images/nav_bg_yellow_orange10x33.gif);
background-repeat:repeat-x;
list-style-type: none;
width: 950px;
height: 33px;
letter-spacing:.4px;
margin: 0;
}

#rj_ceaNav {
	margin:0;
}

/*this adds the pipe between each menu list */
#rj_ceaNav li.pipe {
	padding-left: 8px;
	padding-right: 8px;
	color: #3d5268;
}

/* removes the default margin and padding form the list items */
#rj_ceaNav li {
display: inline; /* need ? */
float: left; /* this corrects the ie6 li spacing issue as well as step-down effect in other browsers*/
position:relative; /*this postions the li away from the left side to make room for the CA logo */
/*top:-7px;*/
margin-top:5px;
left: 172px; /* this is the left position */
}

/* removes the default margin and padding form the list items for IE6 */
#ie6only #rj_ceaNav li {
position:relative; /* this postions the li away from the left side to make room for the CA logo */
/*top:5px;*/
left: 210px; /* this is the left position */
}

/* removes the default margin and padding form the list items for IE7 and up */
#ie7andup #rj_ceaNav li {
position:relative; /* this postions the li away from the left side to make room for the CA logo */
/*top:5px;*/
left: 214px; /* this is the left position */
}

#rj_ceaNav a {
float: left;
font-size: 116%;
text-align: center;
color: #003366;
text-decoration: none;
font-weight: bold;
/*line-height: 31px; /* this adjust the height between each a element
and is similar to what you might think you can do with padding
you can use pixels or just a generic number, but the latter creates
height differently. I can also use padding above and set line-height to
0, but I wonder if that causes problems in IE*/
}
	
#rj_ceaNav a:hover { /* instead of a:hover allow for more hot area rollover */
/*line-height: 30px;*/
/*width: 90px; *//* increased width to compensate for border*/
/*background: #336699;*/
text-decoration:underline;
font-weight: bold;
margin-bottom: 2px;
color: #003366;
}

/* old search css
#rj_search a {
	float: right;
	padding-right: 20px;
	padding-top: 0px;
	margin-top:3px;
	font-size: 116%;
	color:#003366;
	text-decoration: underline;
	font-weight: normal;
}

#rj_search a:hover {
text-decoration:underline;
font-weight: normal;
margin-bottom: 2px;
color: #336699;
}
*/

/* --------	 GOOGLE SEARCH CONTAINER ------------ 
#rj_google_search_container {
	float: right;
	width: 300px;
	padding-right: 0px;
	padding-top: 0px;
	margin-top:-8px;
}

#ie6only #rj_google_search_container {
	float: right;
	width: 300px;
	padding-right: 0px;
	margin-top: 2px;
}

#ie7andup #rj_google_search_container {
	float: right;
	width: 300px;
	padding-right: 0px;
	margin-top: 2px;
}
*/

/* this class is part of CEA's main body left nav css code. I'm duplicating to give it priority. Prior to this the header css was causing this section's background color to change. */
.leftnavbar {
	background:none repeat scroll 0 0 #336699;
}