/* Railfanning.org 2008 */

a:link {color:Black; text-decoration:underline;}
a:visited {color:Black; text-decoration:underline;}
a:active {color:Black; text-decoration:underline;}
a:hover {color:Red; text-decoration:underline;}

body {
 margin: 20px;
 padding: 0;
 background: #222222 url(http://railfanning.org/design/11111.gif);
 font: "Trebuchet MS", Arial, Helvetica, sans-serif;
 color: #000000;
 }

/* Menu */

#menu {
 font-size: 9pt;
 font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
 width: 780px;
 height: 25px;
 margin: 0 auto;
 padding: 0;
 border: 5px solid #FFFFFF;
 border-top: 0px solid #FFFFFF;
 border-bottom: 0px solid #FFFFFF;
 background: #38ACEC;
 }

#menu h2 {
 display: none;
 }

#menu ul {
 margin: 0;
 padding: 0;
 list-style: none;
 }

#menu li {
 display:block;
 float:left;
 margin:0 0px 0 0;
 }

#menu a {
 display: block;
 float: left;
 width: 85px;
 height: 21px;
 padding-top: 4px;
 text-align: center;
 text-decoration: none;
 color: #FFFFFF;
 background: #38ACEC;
 }

#menu a:hover {
 background: #295c7d;
 color: #FFFFFF;
 }

#menu .active a {
 color: #FFFFFF;
 background: #295c7d;
 }

/* Body */

h1, h2, h3, h4, h5, h6 {
 margin: 0;
 padding: 0;
 color: #FFFFFF;
 }

p, ul, ol, blockquote {
 margin-top: 0;
 }

img {
 border: none;
 }

.front {
 font-size: 10pt;
 color: #000000;
 font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
 padding:5px;
 }

.credit {
 font-size: 10pt;
 color: #000000;
 font-family: centaur;
 }

.caption {
 font-size: 12pt;
 font-style: italic;
 color: #000000;
 font-family: times;
 }

#header {
 width: 780px;
 height: 150px;
 margin: 0 auto;
 padding: 0px 0 0 0;
 background: #FFFFFF url(http://railfanning.org/graphics/header_main.jpg) no-repeat;
 border: 5px solid #FFFFFF;
 border-bottom: none;
 }

#image {
 width: 780px;
 margin: 0 auto;
 background: #FFFFFF;
 border-left: 5px solid #FFFFFF;
 border-right: 5px solid #FFFFFF;
 }

#contentwrapper {
 float: left;
 width: 100%;
 }

#contentcolumn {
 margin-right: 180px; /*Set right margin to RightColumnWidth*/
 }

.innertube {
 margin: 10px; /*Margins for inner DIV inside each column (to provide padding)*/
 margin-top: 0;
}

#column-right {
 float: left;
 width: 180px; /*Width of right column*/
 margin-left: -180px; /*Set left margin to -(RightColumnWidth) */
 background: #FFFFFF;
 }

.promoborder {
 border: 1px solid #295c7d;
 margin-left: 1px;
 margin-top: 1px;
 margin-right: 1px;
 }

.promoheader {
 background-color: #295c7d;
 color: #FFFFFF;
 font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
 font-size: 10pt;
 font-weight: bold;
 text-align: left;
 margin-left: 1px;
 margin-top: 1px;
 margin-right: 1px;
 padding-left: 5px;
 padding-top: 2px;
 padding-bottom: 5px;
 }

.promo-text {
 font-size: 12pt;
 color: #000000;
 font-family: georgia;
 margin:0;
 padding:15px;
 text-align:left;
 margin-top:0;
 margin-bottom:0;
 }

.navigation {
 font-size: 10pt;
 color: #000000;
 font-family: times;
 padding:0px;
 padding-top: 5px;
 }

.headline {
 font-weight: bold;
 font-size: 14pt;
 color: #000000;
 font-family: georgia;
 margin:0;
 padding-bottom: 5px;
 }

.byline {
 font-style: bold;
 font-size: 9pt;
 color: #808080; 
 font-family: arial;
 }

.archive {
 font-family: "Georgia", Times New Roman, Serif;
 font-size: 2.2em;
 color: #900;
 }

.entry {
 padding: 0;
 margin: 0;
 text-align: left;
 background: #FFFFFF;
 font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
 font-size: 12px;
 border-top: 0px solid #666;
 padding-bottom: 25px;
 padding:5px;
 }


/* Main Content */

#main {
 width: 780px;
 margin: 0 auto;
 background: #FFFFFF;
 border: 5px solid #FFFFFF;
 }

#main .title {
 padding: 10px 20px;
 background: #000000;
 font-size: 0.80em;
 text-align: left;
 }

#main .story {
 padding: 10px;
 border: 1px solid #000000;
 }


/* Footer */

#footer {
 width: 760px;
 margin: 0 auto;
 padding: 10px 10px;
 background: #295c7d;
 border: 5px solid #FFFFFF;
 border-top: none;
 font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
 font-size: 12px;
 }

#footer p {
 margin: 0;
 padding: 0;
 text-align: center;
 font-size: x-small;
 font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
 font-size: 10px;
 color: #FFFFFF;
 }

#footer a {
 color: #FFFFFF;
 text-decoration: none;
 }


/*Credits: Dynamic Drive CSS Library */
/*URL: http://www.dynamicdrive.com/style/ */

.gallerycontainer {
 position: relative; /*Add a height attribute and set to largest image's height to prevent overlaying*/
 padding: 5px;
}

.thumbnail img {
 border: 1px solid white;
 margin: 0 5px 5px 0;
 }

.thumbnail:hover {
 background-color: transparent;
 }

.thumbnail:hover img {
 border: 1px solid black;
 }

.thumbnail span { /*CSS for enlarged image*/
 position: absolute;
 background-color: lightyellow;
 padding: 5px;
 left: -1000px;
 border: 1px dashed gray;
 visibility: hidden;
 color: black;
 text-decoration: none;
 }

.thumbnail span img { /*CSS for enlarged image*/
 border-width: 0;
 padding: 2px;
 }

.thumbnail:hover span { /*CSS for enlarged image*/
 visibility: visible;
 top: 0;
 left: 230px; /*position where enlarged image should offset horizontally */
 z-index: 50;
 }
