* {
	margin: 0;
	padding: 0;
	border: 0;
}

body {
	margin: 0 auto;
	width: 60em;
	font-size:100%;
}

/*layout */

#container {
	background-color:#e8e8e8e;
	overflow:hidden;
	width:60em;
}
#header {
	background: #0075AD url(../i/book.jpg) no-repeat right top;
	display: block;
	overflow: auto;
	width: 100%;
}

#content {
	background-color:#e8e8e8;
	width:45em;
	border-right:15em solid #cfcfcf; /* The width and color of the rail */
	margin-right:-15em; /* Hat tip to Ryan Brill */
	float:left;
}
#side {
	background-color:#cfcfcf;
	width:15em;
	float:left;
}
#footer {
	clear: both;
	background-color: #666;
	color: #fff;
	display: block;
	font-size: 80%;
	overflow: auto;
	width: 100%;
}

/* empty div placed after floating element to draw background to the bottom of the containing div */

.clearer {
	clear: both;
}

/* styling within #content */

#container {
	font-family: "Lucida Grande", sans-serif;
}

#content p, #content h1, #content h2, #content h3, #content h4, #content h5, #content h6, #content ul, #content ol, #content dl  {
	padding: 5px 10px;
}

/* styling within #header */

#banner {
	padding: 20px;
}


/* image replacement - places logo over ESPP text */

#header #logo {
	background-image: url(../i/espplogosolidswitch2.gif);
	height: 100px;
	width: 235px;
	float: left;
}
#header #logo span {
	background-image: url(../i/espplogosolidswitch2.gif);
	height: 100px;
	width: 235px;
	z-index: 1;
	position: absolute;
}

/* Society title within header */

#org {
	float: right;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: #FFFFFF;
	width: 60%;
	padding-bottom: 20px;
}

/* navigation within header */

#navigation ul li {
	padding: 5px 0 5px 15px;
	list-style-type: none;
	float: left;
}
#navigation ul li.first {
	border-left-style: none;
	margin-left: 11px;
}
#navigation ul li a {
	color: #CCFF33;
	text-decoration: none;
	padding-right: 15px;
	padding-top: 5px;
	}
	
#navigation ul li.current a {
	color: #0075AD;
	background: url(../i/tab-right.gif) no-repeat right top;
}
	
#navigation ul li.current {
		background: #E8E8E8 url(../i/tab-left.gif) no-repeat left top;
}
	
#navigation {
	float: left;
	clear: both;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	color: #CCFF33;
	margin-top: 5px;
}

/* search form within header */

#search {
	float: right;
	padding: 5px 20px 0 0;
}

#search input {
	padding: 2px;
	}
	
/* styling within #content */

#content {
	font-family: "Lucida Grande", sans-serif;
}

#content p, #content h1, #content h2, #content h3, #content h4, #content h5, #content h6, #content ul, #content ol, #content dl  {
	padding: 5px 10px;
}

#main {
	padding: 20px;
}

#main p {
	font-family: Georgia, serif;
}

#main ul, #main ol, #main dl {
	font-family: Georgia, serif;
	padding-left: 40px;
}
#main dt {
	float: left;
	clear: left;
	padding-right: 0.5em;
	font-style: italic;
	}
	
#main dd {
	float left;
	clear: none;
	font-weight: bold;
	}

#main ul li {
	padding: 2px 5px 3px 5px;
	}

#content #main .address p {
	font-size: 90%;
	padding: 0px 0px 0px 20px;
}

/* rounded boxes */

.sidebox {
	margin: 15px auto; 
	width: 35em;
	background: url(../i/roundboxbody-r1000x800.gif) no-repeat right bottom;
}

.sideboxtop {
	margin: 0; 
	width: 100%;
	background: url(../i/roundboxbody-r1000x800.gif) no-repeat right bottom;
	float:left;
}

.boxhead {
	background: url(../i/roundboxhead-r1000x206.gif) no-repeat top right;
	margin: 0;
	padding: 0;
}

.boxhead h2 {
	background: url(../i/roundboxhead-l15x206.gif) no-repeat top left;
	margin: 0px;
	padding: 20px 30px 5px;
	color: #FFF; 
	font-weight: bold; 
	font-size: medium; 
	line-height: 1em;

}

.boxhead h2 {
	color: #000; 
	font-weight: bold; 
	font-size: medium; 
	line-height: 1em;
	margin: 0px;

	}
.boxbody {
	background: url(../i/roundboxbody-l15x800.gif) no-repeat bottom left;
	margin: 0;
	padding: 2px 10px;
}

.boxbody p {
	font-size: 120%;
	padding: 20px;
	}
.boxbody ul {
	padding: 2px 2px 10px 20px;
	margin: 2px;
	}

/* styling for ul with class .panel */

#content #main .panels {
	margin-bottom: 15px;
}

#content #main .panels .panel {
	list-style:none;
	float: left;
	width: 10em;
	padding: 0;
	margin: 1em;
	background: #FFF url(../i/box-bottom-right.gif) no-repeat bottom right;
}
#content #main .panels .panel span {
	display: block;
	padding: 2px 10px;
	margin: 0;	
	font-size: 90%;
	font-family: Tahoma, Arial, sans-serif;
}
#content #main .panels .panel span.picture {
	text-align:center;
}
#content #main .panels .panel span.title {
	background: url(../i/box-top-right.gif) no-repeat top right;
	padding: 0 10px 2px 0;
}
#content #main  .panels .panel span.title a{
	background: url(../i/box-top-left.gif) no-repeat top left;
	padding: 5px 0 0 10px;
	color:#666666;
	text-decoration:none;
	display: block;
		font-weight: bold;
	text-align:center;

}
#content #main .panels .panel span.office {
	font-style: italic;
}
#content #main .panels .panel span.discipline, #content #main .panels .panel span.location {
}
#content #main .panels .panel span.institution, #content #main .panels .panel span.date {
	background: url(../i/box-bottom-left.gif) no-repeat bottom left;
	padding: 2px 10px 10px 10px;
}
/* styling within #side */

#side #menu {
	padding: 0;
	text-align: center;
}

#side #menu  h2{
	padding: 3px 10px;
}

#side ul li {
	list-style-type: none;
	border-bottom: solid 1px #666;
	display: block;
	padding: 0;
	}
#side ul li a {
	background: #333333;
	text-decoration: none;
	display: block;
	padding: 5px 15px;
}
#side ul li a:link, #side ul li a:visited {
	background: #333333;
	color: #FFF;
}
#side ul li a:hover, #side ul li a:active {
	background: #999999;
	color: #333333;
}
#side ul li.current a:link, #side ul li.current a:visited {
	background: #333333 url(../i/arrowFFF.gif) no-repeat left center;
}
#side ul li.current a:hover, #side ul li.current a:active {
	background: #999999 url(../i/arrow333.gif) no-repeat left center;
}
#side ul {
	border-top: solid 1px #666;
	padding: 0 0 5px 0;
	}

/* styling within #footer */

#footer a {
	color: #FFF;
	text-decoration: none;
}	

#footer a:link, #footer a:visited {
	border-bottom: dotted 1px #FFF;
	}

#footer a:hover, #footer a:active {
	border-bottom: solid 1px #FFF;
	}

#footer #contact {
	border-left: dotted 1px #FFF;
	float: right;
	width: 60%;
	padding: 10px;
}
#footer #contact p {
	display: inline;
	padding: 0;
	white-space: nowrap;
}
#footer #copyright  {
	float: left;
	width: 30%;
	padding: 10px;
}