body {
margin:10px;
margin-top: 10px;
margin-bottom: 10px;
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size: 11px;
background: #F5F5F5;
/*line-height: 130%;*/
}

#container {
margin: auto;
background: #000000;
border: 1px solid #DCDCDC;
padding: 4px;
width:90%;
min-width:754px;
max-width:920px;
/* hack per IE 754<90%<920 */
width:expression(document.body.clientWidth < 838? "754px" : document.body.clientWidth > 1024? "920px" : "90%" );
background-image: url(../images/grm_roadbook.gif);
background-repeat: repeat-y;
/* background-image: url(../images/sorsl_watermark.gif); 
background-attachment:fixed; 
background-position: 50% 90%; 
background-repeat: no-repeat; */
}

#subnav {
border-top: 1px solid white;
float: left;
width: 25%;
height: 292px;
}

#subnav p {text-align: justify; margin-left: 10px; margin-right: 10px; color:#FFFFFF}
#subnav h1 {font-size: 16px; font-weight: bold; color: red}
#subnav h2 {font: bold 14px Georgia; color: #FFFFFF}

#container {

/* background-image: url(../images/sorsl_watermark.gif); 
background-attachment:fixed; 
background-position: 50% 50%; 
background-repeat: no-repeat; */

}

#content {
border-top: 1px solid white;

float: left;
width: 50%;

}
#content p {text-align: justify; margin-left: 10px; margin-right: 10px; color: #FFFFFF;}
p.article:first-letter {color:#FF0000; font-size:18px;}

#sidebar {
border-top: 1px solid white;
float: left;
width: 25%;
}
#sidebar p {text-align: margin-left: 10px; margin-right: 10px; justify; color:#FFFFFF}
#sidebar h1 {font-size: 16px; font-weight: bold; color: red;}
#sidebar h2 {font: bold 14px Georgia; color: #FFFFFF;}

#IframeScroller {
margin-left: 10px;
float: right;
}

#videoframe {
margin-left: 10px;
float: right;
}

.nofloat {
clear: both;
}

.boxtext{
text-align: justify; color:#333333;
margin-left: 10px;
margin-right: 10px;
}


.box {
padding: 2px;
}

.box2 {
border: 1px solid black;
background: #DDDDDD;
/* width: 182px; */
}

.box3 {
margin-left: 10px;
margin-right: 10px;
border: 1px solid black;
background:#DDDDDD;
margin-bottom: 2px;
height: 68px;
}

.box4 {
border: 1px solid black;
background: #DDDDDD;
margin-bottom: 10px;
}

.box5 {
border: 1px solid black;
background: #DDDDDD;
width: 182px;
margin-bottom: 10px;
}

.box6 {
border: 1px solid black;
padding:10px;
color: black;
margin-bottom: 10px;
background-image: url(../images/checker_plate.jpg); 
/* background-attachment:fixed; */
/* background-position: 0 300; */
background-repeat: auto;
}

.boxsidebar {
float: right;
margin-bottom: 2px;
width: 182px;
}

.boxsubnav {
float: left;
margin-bottom: 2px;
width: 182px;
}

#masthead {
text-align:center;
background-color: #000000;
border-bottom: 1px solid white;	
}

#navmain {

}

#footer {
text-align:center;
border-top: 1px solid white;
height: 35px;
margin-top: 10px; 
text-align: center;
background-color: #000000;
}
#footer p {color: #FFFFFF;}

#sectioned {
margin-left: 10px;
margin-right: 10px;
border-bottom: 1px solid black;
margin-bottom: 10px; 
}

.pagenum
{
	float: right;
	padding: 10px;
	text-align: right;
	font-weight: bold;
}

.imgleft
 {
 float:left;
 margin-top:0px;
 margin-bottom:0px;
 padding:0px;
 }
 
 .imgright
 {
 float:right;
 margin-top:0px;
 margin-bottom:0px;
 padding:0px;
 }
 
 .imgtext
 {
 float:left;
 margin-top:0px;
 /* margin-bottom:10px; */
 padding:0px;
 margin-right:10px;
 }

/*Credits: Dynamic Drive CSS Library */
/*URL: http://www.dynamicdrive.com/style/ */
/*Modified for use here*/

.imagezoom{
position: relative;
float: right;
/*Add a height attribute and set to largest image's height to prevent overlaying*/
}

.thumbnail img{
border: 1px solid black;
margin: 0px;
}

.thumbnail:hover{
background-color: transparent;
}

.thumbnail:hover img{
border: 1px solid black;
}

.thumbnail span{ /*CSS for enlarged image*/
position: absolute;
background-color: black;
padding: 0px;
left: -1000px;
/* border: 1px solid black; */
white-space: nowrap;
visibility: hidden;
color: white;
text-decoration: none;
}

.thumbnail span img{ /*CSS for enlarged image*/
border-width: 0;
padding: 0px;
}

.thumbnail:hover span{ /*CSS for enlarged image*/
visibility: visible;
top: 0;
left: -410px; /*position where enlarged image should offset horizontally */
z-index: 50;
}

/* End of ImageZoom */
 
h1 {font-size: 16px; font-weight: bold; color: red;}
h2 {font: bold 14px Georgia; color: #FFFFFF;} 

a {color: brown; text-decoration: none;}
a:link {color: brown;}
a:visited {color: brown;}
a:hover {color: brown; }
a:active {color: brown;}