body {
	background: #fff;
	margin: 0px auto;}
	
#wrapper-home { 
	width: 1080px;
	padding: 18px 0px;
	margin: 0px auto;}
	
#wrapper { 
	width: 900px;
	padding: 0px;
	margin: 0px auto;}	
		
	
#logo {
	display:block;
	height: 70px;
	width: 390px;
	background-image: url(images/signature.jpg);
	text-indent: -9999px;
	margin: 40px auto 30px auto;}

	#logo:hover {
		background-image: url(images/signature2.jpg);}

#trinlogo {
	display:block;
	height: 70px;
	width: 390px;
	background-image: url(images/trinlogo.jpg);
	text-indent: -9999px;
	margin: 40px auto 30px auto;}

	#trinlogo:hover {
		background-image: url(images/trinlogo2.jpg);}

#oxfordlogo {
	display:block;
	height: 75px;
	width: 250px;
	background-image: url(images/oxfordlogo.gif);
	text-indent: -9999px;
	margin: -110px 20px 30px auto;}

	#oxfordlogo:hover {
		background-image: url(images/oxfordlogo.gif);}

#ccfelogo {
	display:block;
	height: 84px;
	width: 250px;
	background-image: url(images/ccfelogo.gif);
	text-indent: -9999px;
	margin: -110px auto 30px 20px;}

	#ccfelogo:hover {
		background-image: url(images/ccfelogo.gif);}
	
#navigation {
	height: 50px;
	margin: 0;
	list-style-type: none;
	background-color: #000;
	color: #FFF;
	width: 100%;
	font: italic 16pt Adobe Garamond Pro, Garamond, Palatino, Palatino Linotype, Times, Times New Roman, serif;
	text-align: center;}

	#navigation li { display: inline;
		position: relative;
		top: 13px; }
	
	#navigation li a {
		text-decoration: none;
		color: #FFF;
		padding: 15px 25px;}
	
	#navigation li a:hover {
		background-color: #666;
		color: #000;
		text-decoration: underline;
		background-color: #fff;}
		
	#navigation .active {
		background-color: #fff;	
		padding: 15px 25px;
		color: #f00;}
	
h1.section {
	color: #dcd9d8;
	font: italic 36pt Adobe Garamond Pro, Garamond, Palatino, Palatino Linotype, Times, Times New Roman, serif;
	padding-left: 18px;
	letter-spacing: -.6pt;}

.box {
	background: url(../images/inset.png) no-repeat;
	font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
	margin: 0px 18px;
	margin-bottom: 36px;}
	
#project {
	width: 333px;
	color: #fff;
	margin-top: 10px;}

	#project.left{margin-left:0px;}

	#project p.link {
		background-color: #000;
		padding: 10px;
		text-align: right;
		font: italic 16pt Adobe Garamond Pro, Garamond, Palatino, Palatino Linotype, Times, Times New Roman, serif;}
		
	#project p.link:hover {
		background-color: #111;}
		
	#project p.link a {
		color: #fff;
		text-decoration: none;}
	
	#project p.link a:hover {
		text-decoration: underline;}
		
	#project > img {
		float: left;}	
		
#about {
    background-color: #eae9e7;
    width: 380px;
    margin-top: 15px}

    #about:hover { background-color: #e2e1de;}
	
    #about p.email, #about p.phone, #about p.address {
	padding: 40px;
	font-weight: 100;
	letter-spacing: .5pt;
	font-size: 16pt;
	line-height: 18pt;}
		
    #about p.email{
	padding-bottom: 0px;
	padding-top: 0px;}
			
    #about p.email a{
	color: #000000;
	text-decoration: none;}
			
    #about p.email a:hover{
	color: #000000;
	text-decoration: underline;}
		
    #about p.phone{
	padding-top: 0px;
	padding-bottom: 20px;}

    #about p.address{
	padding-top: 20px;
	padding-bottom: 20px;}
	
    #about p.email strong, #about p.phone strong, #about p.address strong {
	font-weight: bold;}
		
    #about p.link {
	background-color: #d7d5d1;
	padding: 10px;
	text-align: right;
	font: italic 16pt Adobe Garamond Pro, Garamond, Palatino, Palatino Linotype, Times, Times New Roman, serif;}
		
    #about p.link:hover {
	background-color: #d0cec9;}
		
    #about p.link a {
	color: #000000;
	text-decoration: none;}
		
    #about p.link a:hover {
	text-decoration: underline;}
	
		
#publications {
    background-color: #7ccf29;
    color: #fff;
    width: 500px;}

    #publications.left {margin-left: 0px;}

    #publications:hover { background-color: #70ba25;}

    #publications p.statement {
	padding: 40px;
	padding-top: 30px;
	font-weight: 100;
	letter-spacing: .5pt;
	font-size: 18pt;
	line-height: 32px;}
    
    #publications p.statement strong {
	font-weight: bold;}
    
    #publications p.link {
	background-color: #63a621;
	padding: 10px;
	text-align: right;
	font: italic 16pt Adobe Garamond Pro, Garamond, Palatino, Palatino Linotype, Times, Times New Roman, serif;}
    
    #publications p.link:hover {
	background-color: #57911d;}
    
    #publications p.link a {
	color: #fff;
	text-decoration: none;}
    
    #publications p.link a:hover {
	text-decoration: underline;}

#presentations {
    background-color: #ee060f;
    color: #fff;
    width: 500px;}

    #presentations.right {margin-right: 0px;}

    #presentations:hover { background-color: #d6050d;}

    #presentations p.statement {
	padding: 40px;
	padding-top: 30px;
	font-weight: 100;
	letter-spacing: .5pt;
	font-size: 18pt;
	line-height: 32px;}
    
    #presentations p.statement strong {
	font-weight: bold;}
    
    #presentations p.link {
	background-color: #be040c;
	padding: 10px;
	text-align: right;
	font: italic 16pt Adobe Garamond Pro, Garamond, Palatino, Palatino Linotype, Times, Times New Roman, serif;}
    
    #presentations p.link:hover {
	background-color: #a6040a;}
    
    #presentations p.link a {
	color: #fff;
	text-decoration: none;}
    
    #presentations p.link a:hover {
	text-decoration: underline;}

    
#teaching {
    background-color: #dfb025;
    color: #fff;
    width: 333px;
    margin-top: 60px;}

    #teaching.right{margin-right:0px;}

    #teaching:hover { background-color: #d9a51f;}

    #teaching p.date {
	padding: 30px 0px 10px 40px;
	font-size: 8pt;
	color: #fff;
	line-height: 18pt;
	text-transform: uppercase;}
    
    #teaching h1 {
	padding: 0px 40px 10px 40px;
	font: italic 20pt Adobe Garamond Pro, Garamond, Palatino, Palatino Linotype, Times, Times New Roman, serif; }
    
    #teaching p.statement {
	padding: 40px;
	padding-top: 30px;
	font-weight: 100;
	letter-spacing: .5pt;
	font-size: 18pt;
	line-height: 32px;}

    #teaching p.statement strong {
	font-weight: bold;}
    
    #teaching p.image{
	margin: 0px auto;
	text-align: center;
	padding-bottom: 40px;}
    
    #teaching p.link {
	background-color: #ce8f12;
	padding: 10px;
	text-align: right;
	font: italic 16pt Adobe Garamond Pro, Garamond, Palatino, Palatino Linotype, Times, Times New Roman, serif;}
		
    #teaching p.link:hover {
	background-color: #c6820f;}
    
    #teaching p.link a {
	color: #fff;
	text-decoration: none;}
    
    #teaching p.link a:hover {
	text-decoration: underline;}
	
.left {float: left; clear:left;}
.center {margin: auto; clear:none;}
.right {float: right;clear:right;}




	
#categories {
	margin: 0;
	margin-top: 20px;
	margin-bottom: 20px;
	padding-bottom: 20px;
	list-style-type: none;
	color: #333;
	font-family: Helvetica Neue, Helvetica, Arial, sans-serif;}

	#categories li { 
		display: inline;
		border-right: 1px solid #ccc;}
	
	#categories li a {
		text-decoration: none;
		color: #333;
		padding: 0px 18px;
		padding: 15px;} /*controls spacing of list of buttons*/
	
	#categories li a:hover {
		background-color: #666;
		color: #000;
		text-decoration: underline;
		background-color: #fff;}
		
	#categories .active {
		font-weight: bold;
		color: #f00;}
		

.thumbnail {
	background-color: #000;
	width: 188px;
	height: 306px;
	margin: 18px;
	float: left;}	
	
	.thumbnail .visited {
		/* for IE */
		filter: alpha(opacity=100);
		/* CSS3 standard */
		opacity: 1.0;}
		
	.thumbnail img{
		position: absolute; /*needed to fix jump bug*/
		float: left;}
	
	.thumbnail .description {
		background-image: url(images/black-overlay.jpg);
		position: relative;
		height: 306px; /*add top -306 to troubleshoot jump bug*/
		color: #fff;
		display: none;}
		
		.thumbnail .description h1{
			padding: 15px;
			padding-bottom: 5px;
			font: bold 14pt Helvetica Neue, Helvetica, Arial, sans-serif;}
			
		.thumbnail .description h1 a{
			color: #fff;
			text-decoration: underline;}
			
		.thumbnail .description h2{
			padding: 0px 15px;
			font: normal 9pt Helvetica Neue, Helvetica, Arial, sans-serif;}
	
		.thumbnail .description h3{
			padding: 10px 15px;
			font: normal 9pt Helvetica Neue, Helvetica, Arial, sans-serif;}
			
		.thumbnail .description h3 a{
			color: #fff;
			text-decoration: none;}
		
#next  {
	display:block;
	height: 32px;
	width: 27px;
	position: relative;
	left: 900px;
	top: -7px;}
	
#previous{
	display:block;
	height: 32px;
	width: 27px;
	position: relative;
	right: 36px;
	top: -39px;}
		
	#next a, #previous a {
		color: black;
		font-size: 25pt;
		text-decoration: none;}
		
	#next a:hover, #previous a:hover {
		color: #f00}
		
#details {
	position: relative;
	top: -75px;}
	
	#details img {
		padding: 18px;
		padding-top: 0px;
		padding-bottom: 36px;}
		
	#details .description{
		padding: 18px;
		padding-left: 0px;
		padding-top: 0px;
		width: 292px;
		float: right;}
		
	#details .description h2{
		font: bold 14pt Helvetica Neue, Helvetica, Arial, sans-serif;
		padding-bottom: 5px;}
		
	#details .description h3{
		color: #999;
		font: normal 8pt Helvetica Neue, Helvetica, Arial, sans-serif;}
		
	#details .description p{
		color: #333;
		padding-top: 30px;
		font: normal 10pt Helvetica Neue, Helvetica, Arial, sans-serif;
		line-height: 15pt;}
	
	
#bio p{
	color: #333;
	padding-top: 18px;
	font: normal 14pt Helvetica Neue, Helvetica, Arial, sans-serif;
	font-weight: 200;
	line-height: 21pt; 
	padding-left: 18px;}
	
	#bio p img {
		float: right;
		padding-left: 60px;
		margin-top: -20px;}
		
#contacts p#email, #contacts p#phone, #contacts #form label{
	color: #333;
	padding-top: 18px;
	font: normal 14pt Helvetica Neue, Helvetica, Arial, sans-serif;
	font-weight: 200;
	line-height: 21pt; 
	padding-left: 18px;}
	
	#contacts p#email a{
		color: #333;
		text-decoration: none;}
	
		#contacts p#email a:hover {
			text-decoration: underline;}
	
	#contacts img {
		float: right;}

	#contacts #form {
		background-color: #ddd;
		width: 410px;
		margin: 18px;}
		
		#contacts #form p{
			color: #333;
			padding-top: 20px;
			font: normal 11pt Helvetica Neue, Helvetica, Arial, sans-serif;
			font-weight: 200;
			line-height: 21pt; 
			padding-left: 20px;
			text-align: center;}
			
		#contacts strong {
			font-weight: bold;}
				
		#contacts #form label {
			width: 50px;
			padding-left: 0px;}
					
		input#name, input#email, #contacts #form textarea {
			width: 270px;
			padding: 2px;}
			
		#contacts #form textarea {
			width: 273px;
			height: 200px;
			padding: 2px;}
			
		#contacts #form .submit-button {
			background-color: #000;
			float: right;
			text-align: right;
			border: 1px solid #FFF;
			color: #fff;
			font: italic 16pt Adobe Garamond Pro, Garamond, Palatino, Palatino Linotype, Times, Times New Roman, serif;
			margin-top:10px;
			padding: 10px;
			margin-bottom: 20px;}
		
		#contacts #form table {
			margin: 0px auto;}
		
			#contacts #form table td {
				vertical-align: top;
				padding: 5px;
				padding-left: 0px;}
				
				p.special {display:none;}
				
				#contacts #form .message{
					display: none;
					background-color: #FF9;		
					font: normal 12px Helvetica Neue, Helvetica, Arial, sans-serif;
					padding: 20px;
					color: #333;}
	
p#footer {
	width: 100%;
	background-color: #000;
	clear: both;
	padding: 20px 0px;
	border-top: 50px solid white;
	color: #ccc;
	text-align: center;
	font: normal 9pt Helvetica Neue, Helvetica, Arial, sans-serif;}	
	
	p#footer a{
		color: #fff;
		text-decoration: none;}
		
	p#footer a:hover{
		text-decoration: underline;}
		
	
/* tells jquery.biggerlink to change the cursor from an arrow to a hand for links */
.hover { cursor: pointer;}

.thumbnail .description h1 a:visited {
	color: red;}