/* use for the large image at the top of the page. 512 x NNN px  */

/* these next five styles allow text aligned left and right on one line.  See Resources/Index.html for an example */
/* Reference:  http://bytes.com/groups/css/98931-align-left-right-single-line
here is the html code:
<div class="caption_with_credit">
<span class="left">Left hand text</span>
<span class="centre"> Centre text </span>
<span class="right">Right hand text </span>
</div>
 */
 
span.left {                     /* used for a single image 512 wide */
	position: absolute;
	left: 5px;
	top: 2px;
}

span.left2 {                     /* used for 2 256 images side by side.  See students.html for an example */
	position: absolute;
	left: 0px;
	top: 2px;
}

span.right {
    position: absolute;
    right: 0;
	top: 2px
}

div.caption_with_credit {

    position: relative;
    text-align: center;
    padding: 0.3125em;           /* 5px */
	font-size: 0.625em;          /* 10 px */
	font-style: italic;
	font-family: verdana, arial, helvetica, sans-serif;
	margin-left: 1.50em;        /* 24px; align the caption up with the left hand edge of the picture */
    margin-right: 1.50em;       /* 24px; align the caption up with the right hand edge of the picture */
	 }

div.caption_with_credit2 {      /* used for 2 256 images side by side.  See students.html for an example */

    position: relative;
    text-align: center;
    padding: 0.3125em;           /* 5px */
	font-size: 0.625em;          /* 10 px */
	font-style: italic;
	font-family: verdana, arial, helvetica, sans-serif;
	margin-left: 0.50em;        /* 8px; align the caption up with the left hand edge of the picture */
    margin-right: 1.50em;       /* 24px; align the caption up with the right hand edge of the picture */
	 }
	 
.image1 {
	border: 0.125em ridge #000;  /* 2px */
	margin: -0.3125em 0 0 0 ;    /*-5 px; top margin of -5 pixels aligns the top of the border with the left hand column */
	padding: 0.1875em;           /*3px */
     }

.image1_caption {
	padding: 0.3125em;           /* 5px */
	font-size: 0.625em;          /* 10 px */
	line-height: normal;
	font-style: italic;
	font-family: verdana, arial, helvetica, sans-serif;
	margin-left: 1.50em;        /* 24px; align the caption up with the left hand edge of the picture */
     }

.image2 {
	border: 1px black solid;
	padding: 4px;
	float: left;
	margin-top: 3px;
	margin-right: 3px;
	margin-bottom: 20px;
	margin-left: 3px;
     }

.image3 {
     border: 1px black solid;
     padding: 4px;
	 float: left;
     margin: 3px;
     }

.image_left {
     border: 0px black solid;
     padding: 2px;
     float: left;
     margin: 3px;
     }
.image_right {
	border: 0px black solid;
	padding: 0px;
	float: right;
	margin-bottom: 8px;
	margin-left: 8px;
     }

.caption {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-style:italic;
	}