body {
	background-image: url("Photos/Background.jpg");
}

ul.TopGrid, ul.BottomGrid {
	list-style-type:none;
	list-style-position:initial;
	list-style-image:initial;
	width:auto;
	margin-top:20px;
}

/* "Jane's Art" heading */
div.JanesArt, 
div.EricsPhotos {
	position: relative;
	z-index: 20;
	height: 50px;
	margin-top: 10px;
} 

 div.JanesArt{
	left: 43px;
	width: 650px;
	margin-right: 400px;

	background: url('Janes Art.png');
	background-repeat: no-repeat;
	background-position: left;
	float: left;

}

 div.EricsPhotos {
 	left: 30px;
	width: 901px;
	background: url('Erics Photos.png');
	background-repeat: no-repeat;
	background-position: right;
	padding-top: 10px;
	margin-bottom: -5px;
	float: right;
}

.TopGrid li {
	float:left;
	margin:0px 2px 0px 2px;
	padding-bottom: 5px;

}

.BottomGrid li {
	float:left;
	margin:0px 2px 0px 2px;
	padding-bottom: 5px;   /* overlapping margins seem to cause problems, but not so much for padding I hope */

}

#feigenHeading {
	height: 65px;
	width: auto;
}

.bigHeading {
	position:absolute;
	top:0;
	left:50%;	/* Facilitates centering */
	margin-top:0px;
	width:775px;
	margin-left: -385px; /* Facilitates centering */
	height:auto;
	bottom:auto;
}

.portfolioTop, .portfolioBottom {
	position:absolute;
	top:0;
	left:55%;	/* Facilitates centering */
	margin-top:70px;
	width:900px;
	margin-left: -520px; /* Facilitates centering -(.5 * width), give or take due to leading space from UL/LI */
	text-align:center;
	height:auto;
	bottom:auto;
}

/* for centering the whole shebang */
#theGreaterDiv {
	left:50%;
	margin-left: -385px;
}

.portfolioTop {
	z-index: 15;
}

.portfolioBottom {
	z-index: 10;
}
 

 /* we want to make some cells wider than others */
 /* the wide ones are of class "topWide" or "bottomWide" */
 /* the "normal" ones have no class at all */
div.portfolioTop li div[class$="Wide"], div.portfolioBottom li div[class$="Wide"] {
	width: 290px;  /* 2 * 129px + 2 * 12px (img padding & border & some unknown padding)  */
}

div.portfolioTop li div[class$="Regular"], div.portfolioBottom li div[class$="Regular"] {
	width: 145px;
}

div.portfolioTop li div[id$="top"], div.portfolioBottom li div[id$="bottom"] {
	height:145px;
	margin:1px;
	padding:7px;
	border-style: groove;
	border-color: black;
	border-width: 5px;
}

div.portfolioTop li div[id$="top"] {
	background-color: lightgray;
}

div.portfolioBottom li div[id$="bottom"] {
	background-color: dimgray;
}

/* 
div.portfolioBottom li, div.portfolioTop li {

}
 */

div.portfolioTop li a {
	display:block;
}



/* 
div.portfolioBottom li  img[id$="bottom"]:hover {
  opacity:0.3;  filter:alpha(opacity=30);
  }
 */

div.portfolioBottom li a {
	display:block;
}