html { 
overflow: hidden; 
height: 100%; 
}
 /* html>body { overflow: visible; }*/
     

body {
overflow: hidden;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: 100;
line-height: 110%;
color: #003399;
background: #CCCCCC; 
background-image: none;
padding:0 0 10px 0;

border-width: 0px;
margin:0 0 20px 0;
}

#banner {
position:absolute;
/*
border:solid;
border-color:black; */
top:2px;
left:5px;
right:5px;
width:98%;
height:90px;
padding:5px 0 0 0;
text-align:center;
font-family: arial, helvetica, sans-serif;
border-bottom:solid;
border-color:white;

}
.bannerhead {
text-align:center;
font-family: arial, helvetica, sans-serif;
line-height: 80%;
font-size: 24px;
font-weight: 300;
}

/* =-=-=-=-=-=-=-[Menu Two]-=-=-=-=-=-=-=- */
#navleft {
background:transparent;
color: #003399;
position:absolute;
top:120px;
left:0;
width:124px; 
height:446px;
border-right:solid;
border-color:white;

}

ul {
	list-style: none;
	margin-left: 5px;
    margin-top:0px;
	padding: 0;
	}
/* begin menu2 */
.menu2 {
	width: 116px;
	border-style: none none solid solid;
	border-color: #A1AEB9;
	
	border-width: 0px;
	margin: 0px;
	}
	
.menu2  a {
	height: 32px;
    vertical-align:middle;
  	voice-family: "\"}\""; 
  	voice-family: inherit;
  	height: 24px;
	text-decoration: none;
	}

.menu2  a:link, .menu2  a:visited {
	color: #003399;
	display: block;
	background: url(images/menu2a.gif);
	padding: 8px 0 0 8px;
	}
	
.menu2  a:hover {
	color: #CCCCCC;
	background: url(images/menu2a.gif) 0 -32px;
	padding: 8px 0 0 8px;
	}
	
.menu2  a:active {
	color: #283A50;
	background: url(images/menu2a.gif) 0 -64px;
	padding: 8px 0 0 8px;
	}
    
/* end Menu 2 */

/* begin menu3 */
.menu3 {
	width: 116px;
	border-style: none none solid solid;
	border-color: #A1AEB9;
	
	border-width: 0px;
	margin: 0px;
	}
	
.menu3  a {
	height: 32px;
    vertical-align:middle;
  	voice-family: "\"}\""; 
  	voice-family: inherit;
  	height: 33px;
	text-decoration: none;
	}

.menu3  a:link, .menu3  a:visited {
	color: #8000FF;
	display: block;
	background: url(images/menusub2a.gif);
	padding: 8px 0 0 18px;
	}
	
.menu3  a:hover {
	color: #D1A8FF;
	background: url(images/menusub2a.gif) 0 -41px;
	padding: 8px 0 0 18px;
	}
	
.menu3  a:active {
	color: #5200A4;
	background: url(images/menusub2a.gif) 0 -80px;
	padding: 8px 0 0 18px;
	}
    
/* end Menu 3 */

/* begin menu4 */
.menu4 {
	width: 116px;
	border-style: none none solid solid;
	border-color: #A1AEB9;
	
	border-width: 0px;
	margin: 0px;
	}
	
.menu4  a {
	height: 32px;
    vertical-align:middle;
  	voice-family: "\"}\""; 
  	voice-family: inherit;
  	height: 24px;
	text-decoration: none;
	}

.menu4  a:link, .menu4  a:visited {
	color: #003399;
	display: block;
	background: url(images/menu2a.gif);
	padding: 8px 0 0 8px;
	}
	
.menu4  a:hover {
	color: #CCCCCC;
	background: url(images/menu2a.gif) 0 -32px;
	padding: 8px 0 0 8px;
	}
	
.menu4  a:active {
	color: #283A50;
	background: url(images/menu2a.gif) 0 -64px;
	padding: 8px 0 0 8px;
	}
    
.contact {
position: absolute;
top: 300px;
width: 124px;
text-align: center;
/*border:1px solid yellow; */
}
    
    
/* end Menu 4 */


/* begin big image display area */

#rightnav {
position:absolute;
width:330px;
height:446px;
top:120px;
margin-left: auto; 
margin-right: auto;
right:0;
/* border:1px solid yellow; */
background:#CCCCCC;
background-image: none;
padding:2px;
text-align:center;
font-family: arial, helvetica, sans-serif;
font-size: 16pt;

}




.bigimagepix {
position:static;
margin-left: auto; 
margin-right: auto;
line-height:3px;
width:324px;
height:324px;
/* border:1px solid red; */
padding:0px;
text-align:center;
font-family:arial, helvetica, sans-serif;
background:#CCCCCC;
background-image: none;
vertical-align:middle;
font-size:.3px;
color:#003399;

}


.imgbig {

position: relative;

vertical-align:middle;
/* border:1px solid yellow; */
line-height:3px;
text-align:center;
}

.bigimagetext   {   
position:absolute;
top:324px;
left: 4px;
margin-left: auto; 
margin-right: auto;
/* border:1px solid green; */
width:324px;
text-align:center;
font-family: arial, helvetica, sans-serif;
font-size: 18px;
font-weight: 100;
line-height: 110%;
color: #003399;
background-color: #CCCCCC; 

}
              
.bigimagetextsm   { 
position:absolute;
top:360px;
left: 4px;
/* border:1px solid blue; */
margin-left: auto; 
margin-right: auto;
width:324px;
text-align:center;  
font-family: arial, helvetica, sans-serif;
font-size: 14px;
font-weight: 100;
line-height: 110%;
color: #003399;
background-color: #CCCCCC; 
}

/* Begin indexpg main area */        
#indexmain {
background-color: #CCCCCC ;
position:relative;
overflow-y:scroll;
height:430px;

overflow: -moz-scrollbars-vertical;
top:120px;

width:auto;

/* border:1px solid green; */
min-width:120px;
margin:0px 4px 100% 130px;
padding:0;
z-index:1;
}
#indexfrm {
position:relative;
padding:0px;
height:430px;
/*border:1px solid red; */
 
}
#indeximage {
float: left;
width:330px;
height:198px;

top:5px;
left: 5px;
margin-left: auto; 
margin-right: 10px;
margin-top: 0px;
margin-bottom: 0px;
right:0;
/*border:1px solid yellow; */
background:#CCCCCC;
background-image: url(images/lighthouse05g.jpg); 
background-repeat: no-repeat; 
background-position: center;
padding:2px;
text-align:center;
font-family: arial, helvetica, sans-serif;
font-size: 16pt;

}
.indeximagepix {
position:static;
margin-left: auto; 
margin-right: auto;
line-height:3px;
width:324px;
height:180px;
/* border:1px solid blue; */
padding:0px;
text-align:center;
font-family:arial, helvetica, sans-serif;
background:#CCCCCC;

vertical-align:middle;
font-size:.3px;
color:#003399;

}
.indeximagetext  { 
float: left;
top:186px;
left: 4px;
/* border:1px solid blue; */
height:16px;
width:324px;
margin: 0px;
padding: 0px;
text-align:center;  
font-family: arial, helvetica, sans-serif;
font-size: 14px;
font-weight: 100;
line-height: 100%;
color: #003399;
background-color: #CCCCCC; 
}
#indextext {


 /*border:1px solid blue; */
}

#indexlinks {
position: relative;

height: 130px;
width: 100%;
top: 62px;

/*border:1px solid blue;*/
}
#indexcopy {
position: absolute;
width: 780px;
top: 520px;
left: 190px;
height: 30px;
z-index: 2;
/*margin:100px 20px 0px 10px;*/
overflow: visible;
font-family: arial, helvetica, sans-serif;
font-size: 8pt;
/*border:1px solid blue;*/
}
/* begin image thumbnail area */

#thumbnails {
background-color: #CCCCCC ;
position:relative;
overflow-y:scroll;
overflow: -moz-scrollbars-vertical;
top:120px;

width:auto;
height:430px;
/* border:solid;
border-color:red; */
min-width:120px;
margin:0px 334px 100% 130px;
padding:0;
z-index:3;
}

.imgthumb {
vertical-align:middle;

}


#ifrm {
position:relative;
padding:0px;

display:inline;
/* border:solid;
border-color:red; */
}

.thumbcont {
position:static;
display:inline;
float:left;
width:89px;
height:105px;

/* border:1px solid #000000; */
background:#CCCCCC;
background-image: none;
padding:2px;

text-align:center;
font-family:arial, helvetica, sans-serif;
font-size: 14px;
color: #003399;
}

.thumbpix {
position:static;
width:87px;
height:87px;
/* border:1px solid #000000; */
padding:0px;
text-align:center;
font-family:arial, helvetica, sans-serif;
background:#CCCCCC;
background-image: none;
padding:0px;

font-size:12px;
color:#003399;

}

img {
vertical-align:middle;

}

.thumbtxt {
position:static;
bottom:auto;
width:85px;
height:12px;

/* border:1px solid #FFFFFF; */
padding: 0px;
margin: 0px;
border: 0px;
text-align:center;
background:#CCCCCC;
background-image: none;


font-family:arial, helvetica, sans-serif;
font-size: 14px;
color:#003399;

}

/* end image thumbnail area */


p {
text-align:justify;
}

/* services page */

.center {
text-align: center;
}

#servmargins {
position: absolute;
font:  14px verdana, sans-serif;
/*border:1px solid red;*/
left: 30px;
right: 30px;

padding-top: 5px;
padding-left: 8px;
padding-right: 8px;

}

.servtext {
position: relative;
font:  14px verdana, sans-serif;

}

h1.large, span.large {
font: bold 38px verdana, sans-serif;
margin-left: auto;
margin-right: auto;
width: 99%;

}
h1.large {
position: relative; /* container H1 is positioned to place the SPAN in it */
color: gray;


}
h1.large span.large {
position: absolute; /* SPAN is overlaping on the title */
top: -2px; /* SPAN is offcentered */
left: 1px;
color: #000099;

}	

h1.med, span.med {
font: bold 30px verdana, sans-serif;
margin-left: auto;
margin-right: auto;
width: 99%;
}
h1.med {
position: relative; /* container H1 is positioned to place the SPAN in it */
color: gray;


}
h1.med span.med {
position: absolute; /* SPAN is overlaping on the title */
top: -1px; /* SPAN is offcentered */
left: 2px;
color: #000099;
margin-left: auto;
margin-right: auto;
width: 99%;
}