/* @CHARSET "ISO-8859-1"; */

body {
	background-color: white; 
	color: navy; 
}


hr {
	height: 3px;
	color: navy;
	margin-top: 0;
}

h1 {
	font-family: "Courier New", Serif; 
	font-size: 18pt;
	margin-bottom : 2px;
	margin-top : 2px; 
}

h1.header {
	text-align : center; 
	font-variant: small-caps; 
}


h2 {
	font-family : "Times New Roman", fantasy; 
	font-size : 14pt; 
	font-weight : bold;
	text-decoration: underline;
	margin-bottom : 2px;  
	margin-top : 2px; 
}

/* These are here so that I can have underlining on the text, but not on the 
gif images I'm going to put on either side. 

As it turns out, I didn't do it like this.  What I did was to float the images on 
either side of the h2 heading to the left and right, which got it out of the 
underlined area.  */ 

h2.termHeading {
	text-align : center;
/*	text-decoration : none; */   
}

/*
h2.termHeading span {
	text-decoration : underline; 
}
*/

h2.termHeading img {
	vertical-align : middle;  
}

h2.termHeading img.leftSide {
	float : left; 
	margin-left : 10%; 
}

h2.termHeading img.rightSide {
	float : right; 
	margin-right : 10%; 
}

h3 {
	font-family : Arial, Impact, Fantasy;
	font-variant: normal;
}

br.clear {
	clear : both; 
}

img {
	border : 0; 
}

img.logo {
	display : block; 
	margin : auto; 
}

div.railLogo {
	margin : auto; 
}

img.railLogo {
	margin : 1%;
	width : 30%;  
}

/* This is for the railroad signs at the bottom of the page */
img.railroad {
	margin : 30px; 
	vertical-align: middle;
}

.railSignLeft, .railSignRight {
	margin : 20px; 
}

.railSignLeft {
	float : left; 
	width : auto; 
}

.railSignRight {
	float : right; 
	width : auto; 
}

img.relatedLinks {
	margin-top : 0.125in; 
	margin-bottom : 0.25in;
	margin-right : 10px; 
	float : left; 
}

/*
img.memberlist {
	float : left;
	margin-bottom : .5in;
	margin-left : .5in;
	margin-right : 15px;  
}
*/
img.memberlist {
	/*float : left;*/
	margin-bottom : 0in;
	margin-left : 0in;
	margin-right : 0in;  
	/* width : 100%; */
	width : 200px;
	height: 225px;

}

/* Start of stuff for member list table */

DIV.base-layer {
  background: none; border: none; color: #000000;
  margin: 0.5em 12px 0.5em 12px; padding: 0; text-align: center; width: auto;
  
}

DIV.table-row {
  background: none; border: none; color: #000000;
  margin-top: .25in; margin-right: auto; margin-bottom: 0; margin-left: auto;
  padding: 0; text-align: center; width: 96%;
  
}

/* Style rules for the 3 x 2 table example, somewhat modified */

/* Note that the order of these three DIVS is important.  First left, then right, 
then center.  Don't put the center div in second and expect it to show up in the 
right spot, because it doesn't.  */

DIV.left-container2 {
  border: medium solid navy; float: left; margin: 0; padding: 0; width: 30%;
  overflow : hidden;
}

DIV.center-container {
	border: medium solid navy; float : none;  margin: auto; padding: 0; width: 30%;
	overflow : hidden;
}

DIV.right-container2 {
  border: medium solid navy; float: right; margin: 0; padding: 0; width: 30%;
  overflow : hidden;
}

DIV.space-line {
  clear: both; margin: 0; padding: 0; width: auto;
}


/* End of stuff for member list table */ 

/*
DIV.base-layer {
  background: none; border: none; color: #000000;
  margin: 0.5em 12px 0.5em 12px; padding: 0; text-align: center; width: auto;
}

DIV.table-row {
  background: none; border: none; color: #000000;
  margin-top: .25in; margin-right: auto; margin-bottom: 0; margin-left: auto;
  padding: 0; text-align: center; width: 96%;
}

*/

/* Style rules for the 3 x 2 table example */
/*
DIV.left-container2 {
  border: medium solid navy; float: left; margin: 0; padding: 0; width: 40%;
}

DIV.right-container2 {
  border: medium solid navy; float: right; margin: 0; padding: 0; width: 40%;
}

DIV.space-line {
  clear: both; margin: 0; padding: 0; width: auto;
}

*/

img.modulePreviewLeft {
	float: left; 
	margin-left : 0.0in;
	margin-right : 0.5in;
}

img.modulePreviewRight {
	float : right; 
	margin-left : 0.5in;
	margin-right : 0.0in;  
}

img.splashImage {
	float : right; 
}

div.funFactsImages img {
	float : right;
	border : medium solid navy; 
	width : 40%; 
	clear : right; 
	margin-bottom : 20px; 
	margin-left : 20px; 
}

div.memberlist {
	margin: auto; 
}

div.menu {
	float : left;  
	display : block;  
	width : auto; 
}


/*
div.menu {
	float : left; 
	margin-right : .125in; 
	margin : auto; 
}
*/

div.introImage { 
	float : right; 
	width : 25%; 
	margin-left : 4px; 
}

div.aboutGallery {
	clear : both; 
}

img.aboutGallery {
	float : left; 
	margin : 5px; 
	width : 35%; 
}

/*
div.aboutGallery img {
	clear : left; 
	float : left;  
	margin : 5px; 
}
*/

div.memberImage {
	background-color : #ccc; 
	text-align: center;
	width : 100%; 
	float : left;  
	font-family : Arial, Verdana, Sans-Serif; 
	font-weight : bold; 
}

/*
div.memberImage {
	margin : 2% 2% 2% 2%; 
	border-top : 1%; 
	background-color : #ccc; 
	float : left;  
	text-align: center;
	width : 100%; 	
}
*/


.captionImageLeft, .captionImageRight {
	margin : 2% 2% 0.5% 0.5%; 
	background-color : #ddd; 
	float : left; 
	text-align: center;
	width : 46%; 
	}

.captionImageLeft {
	clear : left; 
}

.captionImageRight {
}

.captionImageDiv {
	margin : 2% 2% 0.5% 0.5%; 
	background-color : #ddd; 
	float : left; 
	text-align: center;
	width : 46%; 
	}

img.captionImage {
	width : 100%;
	margin : 0; 
}

div.railFanImage {
	margin : auto;
}

img.railfanImage {
	width : 32%; 
}

ul.menu {
	list-style-type : none;
	margin-left : 0;
	padding : 5px;  
}

ul.events {
	list-style-type : none;
}

ul.events li {
	margin-bottom:10px; 
}

table.menu {
	margin-top:0; 
	margin-bottom:0;
	
}

p.intro {
	font-family : Impact, Verdana, Sans-Serif; 
	font-style : normal;
	font-size : 24pt; 
}


p.menubar {
	font-family : Arial, Verdana, Sans-Serif; 
	font-weight : bold; 
	text-align : center; 
	padding-top: 40px;
	vertical-align: middle;
	}

p.memberModules {
	text-align : center; 
	margin-bottom : 10px;
	vertical-align : middle; 
} 

table.contact {
	font-family : Arial, Serif; 
	font-size : 9pt;
	margin-top : 4em;
	margin-bottom : 4em; 
}

table.relatedLinks {
	border-spacing : 0.25in; 
}

/*--------------------------------------*/

dl.funFacts {
	color : blue; 
}

dl.funFacts dt {
	font-weight : bold;
	font-size : 120%; 
	font-variant: small-caps; 
}

dl.funFacts dd {
	color : purple; 
	margin-bottom : 5px; 
}

dl.funFacts p { 
	margin-top : 0; 
}

/*-----------------------------------------*/

dl.termDictionary {
	color : red; 
}

dl.termDictionary dt {
	font-weight : bold;
	font-size : 120%; 
	font-variant: small-caps; 
}

dl.termDictionary dd {
	color : purple; 
	margin-bottom : 5px; 
}

dl.termDictionary p {
    margin-top : 0; 
}

/*----------------------------------------*/

dl.aboutQuestion {
/*	color : FireBrick;   */
    color : #B22222;  
}

dl.aboutQuestion dt {
	font-weight : bold;
	font-size : 120%; 
	font-variant: small-caps; 
}

dl.aboutQuestion dd {
    color : #191970; 
/*	color : MidnightBlue; */ 
	margin-bottom : 5px; 
}

ul.conditionList {
	list-style-image: url(images/RailroadHistoryIcon.gif);
}



/*----------------------------------------*/

dl.valueList {
/*	color : Maroon;  */
    color : #800000;  
}

dl.valueList dt {
	font-weight : bold;
	font-size : 120%; 
	font-variant: small-caps; 
}

dl.valueList dd {
/* 	color : DarkSlateGray; */
    color : #2F4F4F;  
	margin-bottom : 5px; 
}

dl.valueList li {
	margin-bottom : 5px; 
}