/******************************************************************************************
* The first part of this file contains CSS rules that are common to all pages in the site *
******************************************************************************************/

body	{
	margin:0px;
	padding:0px;
	background-color: #fbfbfb;
	background-image: url("../images/bg_body.gif");
	background-repeat: repeat-x;
	background-position: 0px 0px;
	min-width: 760px;
	color:#333;
	font-size: 65%;
}
						
img	{
	border: 0px;
}

#wrapper	{
	background-color:#fff;
	margin:0px 0px;
	width:760px;
}
		
#header	{
	background: url("../images/header/background.gif");
	display: block;
	width: 760px;
	height: 98px;
	overflow:hidden; /* makes IE work */
}
				
#header	h1, h2	{
	display: inline;
}

.experiential-learning	{
	position:absolute;
	top: 45px;
	left: 295px;
}

/*************************************
* Start code for image rollover menu *
*************************************/
ul.image-switch, ul.image-switch li {
  list-style-type: none;
  padding: 0;
  margin: 0;
  text-align: left;
  height: 38px;
}

ul.image-switch {
  width: 660px;
}

ul.image-switch li {
  float:left;
  width: 132px;
}

ul.image-switch li a {
  text-align: center;
  width: 132px;
  line-height: 38px;
  height: 38px;
  text-decoration: none;
  display: block;
}

ul#nav li a {
  position: relative;
  /* hide from IE5/Mac \*/
	overflow: hidden;
  /* end hide */
}

ul#nav li a span {
  position: absolute;
  left: 0;
  top: 0;
  display: block;
  width: 132px;
  height: 38px;
  cursor: pointer;
}

/* for IE5/Mac only
the negative top margin needs to be the same absolute value as the height of the
<a> and <span> elements. \*//*/
ul#nav li a span {
  position: static;
  margin-top: -38px;
}
/* end for IE5/Mac only */

ul#nav li a.selected:hover span, ul#nav li a.selected span:hover {
	background-position: 0 -76px;
	/* the second number should be the negative height of the link. */
}

ul#nav li a:hover span, ul#nav li a span:hover {
	background-position: 0 -38px;
	/* the second number should be the negative height of the link. */
}

ul.image-switch li.cooperative-education a, ul#nav li.cooperative-education a span {
	background-image: url("../images/cooperative-education-3.gif");
}

works ul.image-switch li.cooperative-education-on a, ul#nav li.cooperative-education-on a span {
	background-image: url("../images/nav/on_ce.gif");
}

ul.image-switch li.student-research a, ul#nav li.student-research a span {
	background-image: url("../images/nav/student-research.gif");
}

ul.image-switch li.service-learning-on a, ul#nav li.student-research-on a span {
	background-image: url("../images/nav/on_sr.gif");
}

ul.image-switch li.service-learning a, ul#nav li.service-learning a span {
	background-image: url("../images/nav/service-learning.gif");
}

ul.image-switch li.service-learning-on a, ul#nav li.service-learning-on a span {
	background-image: url("../images/nav/on_sl.gif");
}

ul.image-switch li.global-experience a, ul#nav li.global-experience a span {
  background-image: url("../images/nav/global-experience.gif");
}

ul.image-switch li.ec-requirement a, ul#nav li.ec-requirement a span {
  background-image: url("../images/nav/ec-requirement.gif");
}
/***********************************
* End code for image rollover menu *
***********************************/

/*********************************************
* Begin code for navigation bar on left side *
*********************************************/
#navigation	{
	float: left;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	/*font-size: 65%; */
	font-weight: bold;
	width: 205px;
}
					
#navigation ul#leftnav	{
	margin: 0px;
	padding: 0px;
	list-style:none;
}
						
#navigation ul#leftnav li {
	display:block;
	margin:0;
	voice-family: "\"}\"";
	voice-family:inherit;
}
						
#navigation ul#leftnav li a {
	background: url("images/css-dotted.gif") repeat-x bottom;
	background-color:#F37621;
	display: block;
	padding: 11px 5px 11px 14px;
	width: 186px; /* width + padding-right + padding-left must equal 205px */
	text-decoration: none;
	color: #FFFFFF;
}

#navigation ul#leftnav li a.selected-nosubnav {
	background: url("images/css-dotted.gif") repeat-x bottom;
	background-color:#8E5125;
	display: block;
	padding: 11px 5px 11px 14px;
	width: 186px; /* width + padding-right + padding-left must equal 205px */
	text-decoration: none;
	color: #FFFFFF;
}
		
#navigation ul#leftnav li a:link, #navigation ul#leftnav li a:visited {
	color: #ffffff;
	text-decoration: none;
}

#navigation ul#leftnav li a:hover {
	background-color: #8E5125;
	text-decoration: none;
}

#navigation ul#leftnav li.selected {
	display: block;
 	margin: 0;
	voice-family: "\"}\"";
	voice-family:inherit;
	background-color:#F2F2F2;
/*	
	padding: 11px 5px 0px 5px;
	width: 195px;
	text-decoration: none;
	text-indent: 0px;
	color: #CC0000;*/
}

#navigation ul#leftnav li.selected a.main-selected:link, #navigation ul#leftnav li.selected a.main-selected:visited, #navigation ul#leftnav li.selected a.main-selected:hover {
	background-color:#F2F2F2;
	background: none;
	display: block;
 	padding: 11px 5px 0px 14px;
	margin: 0;
	width: 186px; /* width + padding-right + padding-left must equal 205px */
	text-decoration: none;
	color: #CC0000;
}

/* This piece code is for the subnavigation in the left navbar */
#navigation ul#leftnav li.selected ul#left-subnav	{
	background-color: #F2F2F2;
	margin: 0;
	padding: 0px 0px 11px 0px;
	list-style:none;
}
		
#navigation ul#leftnav li.selected ul#left-subnav li a {
	background: none;
	display: block;
  padding: 11px 5px 0px 34px; /* width + padding-right + padding-left must equal 205px */
	margin: 0;
	width: 166px;
	text-decoration: none;
/*	text-indent: 15px; */
	font-family: Verdana, Arial, Helvetica, sans-serif;
	/*font-size: 100%; */
	font-weight: normal;
}
		
#navigation ul#leftnav li.selected ul#left-subnav li a.subnav-inactive:link, #navigation ul#leftnav li.selected ul#left-subnav li a.subnav-inactive:visited {
	color: #000000;
	text-decoration: none;
}

#navigation ul#leftnav li.selected ul#left-subnav li a.subnav-inactive:hover {
	background-color: #F2F2F2;
	color: #000000;
	text-decoration: underline;
}

#navigation ul#leftnav li.selected ul#left-subnav li a.subnav-selected:link, #navigation ul#leftnav li.selected ul#left-subnav li a.subnav-selected:visited, #navigation ul#leftnav li.selected ul#left-subnav li a.subnav-selected:hover {
	background-color: #F2F2F2;
	color: #CC0000;
	text-decoration: none;
}
/*******************************************
* End code for navigation bar on left side *
*******************************************/

/***********************************************************
* Start code for links in the top right corner of the page *
***********************************************************/
#toplinks {
	width:740px;
	text-align: right;
	vertical-align: bottom;
	top: -2px; 
	position: absolute; 
	padding:0px;
	font-size: 150%;
}

.toplinks-inside {
	padding: 3px 10px 0px 10px;
	border-style: solid;
	border-color: #FFFFFF;
	border-width: 0px 1px 0px 0px;
}

.toplinks-inside-right {
	padding-top:0px;
	padding-left: 10px;
	padding-bottom: 0px;
}

.toplinks-link {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	color: #FFFFFF;
	text-decoration: none;
	line-height: 180%;
}

a:link.toplinks-link {
	text-decoration:none;
	color:#FFFFFF;
	outline: none;
	font-weight:normal;
	font-size: 10px;
}

a:visited.toplinks-link {
	text-decoration:none;
	color:#FFFFFF;
	font-weight:normal; 
	font-size: 10px;
}

a:hover.toplinks-link {
	text-decoration:underline;
	color:#FFFFFF;
}

a:active.toplinks-link {
	text-decoration:underline;
	color:#FFFFFF;
}

/*********************************************************
* End code for links in the top right corner of the page *
*********************************************************/

/************************
* Start code for footer *
************************/
#footer	{
	clear:both;
	width: 760px;
	text-align: center;
	margin-top: 3px;
	color: #999999;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	/*font-size: 65%; */
	padding: 0px 0px;
	margin-bottom: 25px;
}
				
#footer li	{
	display: inline;
}
	
#footer a:link, #footer a:visited {
	color: #999999;
	text-decoration: none;
}

#footer a:hover {
	color: #000000;
	text-decoration: underline;
}
	
#footer p	{
	padding:5px;
	margin:0;
}
/************************
* End code for footer *
************************/

/******************************************
* PART 2: CSS rules for first-level pages *
******************************************/

#first-level #main-image {
  height: 180px;
  margin-bottom: 0px;
}

#first-level #main {
  background-color: white;
  padding: 0px 0px 0px 3px;
}

#first-level #text p	{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: normal;
	line-height: 150%;
	margin-bottom: 0px;
	margin-top: 10px;
}

#main-wrapper {
  margin: 0 0 0 205px;/*display: inline-block;*/
}

#middle-wrapper {
  position: relative;
	margin-top: 3px;
}

#first-level #header-image {
	float: right; /* if there is no float property defined for this image, IE 6 becomes messed up */
	width: 540px;
	height: 27px;
	margin: 0px 10px 20px 0px;
	padding: 0;
	position: relative; /* needed or else image disappears in IE6 */
}

#first-level #text	{
	/* need to clear right because the image above is set to float: right */
	padding: 0px 8px 4px 8px;
	margin: 0;
}

#first-level #bottom-bar {
	clear: both;
	width: 760px;
	margin-top: 0px;
	padding-bottom: 4px;
}

#first-level #box1 {
	width: 204px;
	height: 59px;
	float: left;
	display: inline;
}

#first-level .student-button {
	margin: 0px;
}

/*************************************************************
* PART 3: CSS rules for Students, Employers and Alumni pages *
*************************************************************/

#stu-emp-alu #main {
  margin-top: 5px;
	width: 760px;
	background-image: url("../images/columns/white-bg.gif");
	background-position: top right;
	background-repeat: repeat-y;
}

#stu-emp-alu #text {
  border: 1px solid white;
  background-color: #FFFFFF;
  margin: 0px 173px 0px 206px;
	padding: 0px 17px;
}
	
#stu-emp-alu #text h3 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 150%;
	font-weight: bold;
	margin:8px 0px 0px 0px;
	padding:0px;
}
	
#text p	{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	/* font-size: 10px; */
	font-weight: normal;
	line-height: 14px;
	margin-bottom: 0px;
	margin-top: 10px;
}

#text ul	{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	/* font-size: 10px; */
	font-weight: normal;
	margin-bottom: 0px;
	margin-top: 10px;
}

#stu-emp-alu #right-sidebar {
  float: right;
  width: 172px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	/* font-size: 10px; */
	font-weight: normal;
  border: 0;
}

#stu-emp-alu #right-sidebar p {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	/* font-size: 10px; */
	font-weight: normal;
	line-height: 14px;
	margin-bottom: 0px;
	margin-top: 10px;
}

#stu-emp-alu #right-sidebar h5 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 110%;
	font-weight: bold;
	line-height: 14px;
	margin-bottom: 0px;
}

#stu-emp-alu #right-sidebar img	{
	margin-bottom: 0px;
}

#stu-emp-alu #right-sidebar ul#rightnav	{
	margin: -2px 0px 0px 0px;
	padding: 0px 0px 5px 7px;
	list-style:none;
	background-color: #dddddd;
}
																		
#stu-emp-alu #right-sidebar li {
	display:block;
	padding: 3px 0px;
	margin:0;
	voice-family: "\"}\"";
	voice-family:inherit;
}
						
#stu-emp-alu #right-sidebar li a {
	text-decoration: none;
	color: #666666;
}

#stu-emp-alu #right-sidebar li.active a {
	text-decoration: none;
	color: #666666;
	font-weight: bold;
}
		
#stu-emp-alu #right-sidebar a:link, #stu-emp-alu #right-sidebar a:visited {
	color: #666666;
	text-decoration: none;
}

#stu-emp-alu #right-sidebar a:hover {
	text-decoration: underline;
}

#stu-emp-alu #right-sidebar li.active a:hover {
	text-decoration: underline;
}

#stu-emp-alu #right-sidebar-image	{
	margin-top: 3px;
}

#left-sidebar {
  float: left;
  width: 205px;
  border: 0;
  background-color: #FFFFFF;
	}
	
#topleft	{
	margin-bottom: 5px;
	width: 205px;
	height: 119px;
	}
	
#stu-emp-alu #student-box {
background-color: #CCCCCC;
background-image: url("../images/corner16.gif");
background-repeat: no-repeat;
background-position: top right;
margin-top: 4px;
width: 195px; /* width plus left and right padding must equal 205 */
padding: 5px;
clear: left;
}

#stu-emp-alu #student-box img {
width: 80px;
height: 80px;
margin: 0px 4px 8px 0px;
float: left;
}

#stu-emp-alu #profile-heading	{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 110%;
	font-weight: bold;
	line-height: 12px;
	color: #F37621;
	padding-top: 4px;
	margin-bottom: 0px;
	margin-top: 0px;
}
									
#stu-emp-alu .profile-name	{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 110%;
	font-weight: bold;
	color: #000000;
	margin-top: 4px;
	margin-bottom: 0px;
}
							
#stu-emp-alu .profile-major	{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 100%;
	font-weight: normal;
	color: #000000;
	margin-top: 4px;
	margin-bottom: 0px;
}
								
#stu-emp-alu .profile-text	{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 100%;
	font-weight: normal; 
	color: #000000;
	clear: both;
	margin: 0px;
}

#clearone	{
	clear: both;
	height: 1px;
}

/**********************************************
* PART 4: CSS rules for various section pages *
**********************************************/

#section-page #horizontal-image	{
	float: right; /* if there is no float property defined for this image, IE 6 becomes messed up */
	margin: 0px 0px 8px 0px;
	padding: 0px;
	position: relative; /* needed or else image disappears in IE6 */
	border-left: 8px solid white;  /*a border must be set to satisfy IE6. It solves the problem of extra white space being added to the right of the image. The border color blends in with the background of the page. IMPORTANT: For some reason, the sum of this border's width and the photo must equal 555 or else the extra space will be added. */	
	border-right: 0px solid black;
	width: 547px;
}

#section-page #main {
  background-color: white;
  padding: 0;
}

#main-wrapper {
  margin: 0 0 0 205px;/*display: inline-block;*/
}

#middle-wrapper {
  position: relative;
	margin-top: 5px;
}

#left-sidebar {
  float: left;
  width: 205px;
  border: 0;
  background-color: #FFFFFF;
	}

#topleft	{
	margin-bottom: 5px;
	width: 205px;
	height: 119px;
}

#section-page #text	{
	clear: right; /* need to clear right because the image above is set to float: right */
	padding: 0px 17px 4px 17px;
	margin: 0;
}

#section-page #text h3 {
font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 150%;
	font-weight: bold;
	margin:0px 0px 0px 0px;
	padding:0px;
}

#text p	{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	/* font-size: 10px; */
	font-weight: normal;
	line-height: 14px;
	margin-bottom: 0px;
	margin-top: 10px;
}

#section-page #student-box {
width: 501px; /* width plus left and right padding must equal 205 */
background-color: #CCCCCC;
background-image: url("../images/corner16.gif");
background-repeat: no-repeat;
background-position: top right;
margin: 10px 0px;
padding: 5px;
}

#section-page #student-box img {
width: 80px;
height: 80px;
margin: 0px 4px 8px 0px;
float: left;
}

#section-page #profile-heading	{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 120%;
	font-weight: bold;
	line-height: 12px;
	color: #F37621;
	padding-top: 0px;
	margin-top: 0px;
	margin-bottom: 0px;
}
									
#section-page .profile-name	{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 120%;
	font-weight: bold;
	color: #000000;
	margin-top: 4px;
	margin-bottom: 0px;
}
							
#section-page .profile-major	{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 100%;
	font-weight: normal;
	color: #000000;
	margin-top: 4px;
	margin-bottom: 0px;
}
								
#section-page .profile-text	{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 100%;
	font-weight: normal; 
	color: #000000;
	clear: both;
	margin-top: 0px;
	margin-bottom: 0px;
}

/***************************************************************************************
* PART 5: This single CSS rule is required to make the site's main navigation function *
***************************************************************************************/

<!--[if IE]><style type="text/css">
ul#nav li a span {
  cursor: hand; /* for IE5.x/Win */
}
<![endif]-->