body {
	background:url(images/bkgd.jpg) center top repeat-x #FFFFFF;
	margin: 0;
	padding: 0;
	text-align:center;
}
a:link, a:visited {
	color: #11568c;
	text-decoration: none;
}
a:hover, a:active {
	color: #11568c;
	text-decoration: underline;
}
/* ----------divs-------------- */
#container {
	width:923px;
	background:url(images/container-bkgd.jpg) center top repeat-y;
	margin:29px auto 0 auto;
	padding:0;
	text-align:left;
}
#container-internal {
	width:923px;
	background:url(images/container-internal-bkgd.jpg) center top repeat-y;
	margin:29px auto 0 auto;
	padding:0;
	text-align:left;
}
#header{
	width:923px;
	height: 239px;
	background: url(images/header2.jpg) no-repeat left top;
}
#leftcol {
	float:left;
	width:183px;
	background:url(images/left-col.jpg) center top no-repeat #ffffff;
	padding:25px 0 0 0;
	text-align:right;
}
#navmenu  {
	display:inline;
	padding:0;
	margin:0;
	font: normal 11px Arial, Helvetica, sans-serif;
	text-align:right;
	color: #022c4d;
}
#navmenu a:link, #navmenu a:visited {
	color: #022c4d;
	text-decoration:none;
}
#navmenu a:hover, #navmenu a:active {
	color: #11568c;
	text-decoration:none;
}
#centercol {
	float:left;
	width:421px;
	background:url(images/center-col.jpg) center top no-repeat #e1e1e1;
	padding:33px 30px 0 30px;
}
#content {
	float:left;
	width:680px;
	background:url(images/center-col.jpg) center top repeat-x #e1e1e1;
	padding:33px 30px 0 30px;

}
#rightcol {
	float:left;
	width:259px;
}
#rightcol-top {
	padding: 33px 15px 5px 25px;
	background:url(images/right-top.jpg) center top no-repeat #e5ecf2;
}
#rightcol-center {
	background:url(images/right-center.jpg) center top no-repeat #f2f6f9;
	padding: 20px 20px 5px 25px;

}
#rightcol-bottom {
	background:url(images/right-bottom.jpg) center top no-repeat #ffffff;
	padding: 20px 20px 5px 25px;
}
#footer {
	background:url(images/footer.jpg) center top no-repeat #ffffff;
	height:42px;
	padding:0 10px;
}
.clearer {
	clear:both; 
	line-height: 0; 
	height: 0;
}
/* ----------main body-------------- */
h1 {
	font: bold 20px Verdana, Arial, sans-serif;
	color: #022c4d;
	text-transform:uppercase;
	padding:0 0 5px 0;
	margin:0;
	font-style: italic;
}
h2 {
	font: bold 12px Verdana, Arial, sans-serif;
	color: #1f6092;
	text-transform:uppercase;
	padding:0 0 15px 0;
	margin:0;
}
h3 {
	font: bold 16px Arial, sans-serif;
	color: #022c4d;
	padding:0 0 10px 0;
	margin:0;
}
h4 {
	font: bold 14px Arial, sans-serif;
	color: #022c4d;
	margin:0;
	padding:0 0 10px 0;
}
p {
	font: normal 11px Verdana, Arial, sans-serif;
	line-height: 16px;
	color: #022c4d;
	padding:0 0 18px 0;
	margin:0;
}
.white-tableheader {
	font: bold 11px Verdana, Arial, sans-serif;
	line-height: 11px;
	color: #ffffff;
	padding:2px 4px;
	margin:0;
}
table {
	font: normal 11px Verdana, Arial, sans-serif;
	color: #022c4d;
	padding:0;
	margin:0;
}
hr {border: none 0; 
	border-bottom: 1px solid #022c4d;
	width: 100%;
	margin: 0 auto 20px auto;
}
ul {
	font: normal 11px Verdana, Arial, sans-serif;
	line-height: 16px;
	color: #022c4d;
	padding:0 0 18px 35px;
	margin:0;
}
.advertisers {
	padding:0 0 5px 0;
	margin:0 0 0 15px;
}
.nopadding {
	padding:0;
	margin:0;
}
/* ----------footer-------------- */
#footer p {
	font: normal 10px Verdana, Arial, sans-serif;
	color: #022c4d;
}
#footer a:link, #footer a:visited  {
	color: #022c4d;
	text-decoration: none;
}
#footer a:hover, #footer a:active {
	color: #11568c;
	text-decoration: none;
}
/* ----------weblinx-------------- */
div.transOFF {
	width: 230px;
	background-color:#ffffff;
	border:2px solid #cccccc; 
}
div.transON {
	width: 230px; 
	background-color:#ffffff;
	border:2px solid #cccccc;
	opacity:0.10;
	filter:alpha(opacity=10);
	-moz-opacity:0.10;
}
#weblinx {
	font: normal 11px "Trebuchet MS", Arial, sans-serif;
	color: #000000;
	text-align: center;
	padding: 5px;
	margin: 10px auto 0 auto;
}
#weblinx a:link, #weblinx a:visited  {
	color: #000000;
	text-decoration: none;
}
#weblinx a:hover, #weblinx a:active {
	color: #000000;
}
/* ----------gallery-------------- */

/* this holds it all. set width for allowable space (20px wider than shown image) */
div#ps {
  padding : 0;
  width : auto; 
  margin : auto;
  width : 280px;  /* set width to allow for all the boxes in a row and adjust this when changing thumbnail sizes*/
}

/* style the unordered list (note height) */
div#ps ul {
  height : 40px;
  padding:0;
  margin:0;
}

/* make the list items show horizontally */
div#ps ul li {
  display : inline; 
}

/* set the links as blocks, size in px (must be floated) */
div#ps ul a {
  display : block;
  float : left;
  border : 1px solid #cd7000;
  text-decoration : none;
  margin : 0 5px 5px 0;
  padding:0;
  width : 60px;
  height : 40px;
  cursor : pointer;   /* this is for Opera only */
}

/* set hover state border */
div#ps ul a:hover {
  border : 1px solid #000;
}

/* but remove border from images */
div#ps a img {
  border : 0;
}

/* set backgrounds for each state */
div#ps ul a#psa1 {
  background : #000 url(images/ps_fish.jpg) no-repeat 0 0;
}
div#ps ul a#psa1:hover {
  background : #222 url(images/ps_fish_over.jpg) no-repeat 0 0;
}
div#ps ul a#psa1:focus, div#ps ul a#psa1:active {
  background : #444 url(images/ps_fish_on.jpg) no-repeat 0 0;
}

/* set backgrounds for each state */
div#ps ul a#psa2 {
  background : #000 url(images/ps_dog.jpg) no-repeat 0 0;
}
div#ps ul a#psa2:hover {
  background : #222 url(images/ps_dog_over.jpg) no-repeat 0 0;
}
div#ps ul a#psa2:focus, div#ps ul a#psa2:active {
  background : #444 url(images/ps_dog_on.jpg) no-repeat 0 0;
}

/* set backgrounds for each state */
div#ps ul a#psa3 {
  background : #000 url(images/ps_man.jpg) no-repeat 0 0;
}
div#ps ul a#psa3:hover {
  background : #222 url(images/ps_man_over.jpg) no-repeat 0 0;
}

div#ps ul a#psa3:focus, div#ps ul a#psa3:active {
  background : #444 url(images/ps_man_on.jpg) no-repeat 0 0;
}

/* set backgrounds for each state */
div#ps ul a#psa4 {
  background : #000 url(images/ps_halo.jpg) no-repeat 0 0;
}
div#ps ul a#psa4:hover {
  background : #222 url(images/ps_halo_over.jpg) no-repeat 0 0;
}
div#ps ul a#psa4:focus, div#ps ul a#psa4:active {
  background : #444 url(images/ps_halo_on.jpg) no-repeat 0 0;
}

/* set backgrounds for each state */
div#ps ul a#psa5 {
  background : #000 url(images/ps_mars.jpg) no-repeat 0 0;
}
div#ps ul a#psa5:hover {
  background : #222 url(images/ps_mars_over.jpg) no-repeat 0 0;
}
div#ps ul a#psa5:focus, div#ps ul a#psa5:active {
  background : #444 url(images/ps_mars_on.jpg) no-repeat 0 0;
}

/* set backgrounds for each state */
div#ps ul a#psa6 {
  background : #000 url(images/ps_girl.jpg) no-repeat 0 0;
}
div#ps ul a#psa6:hover {
  background : #222 url(images/ps_girl_over.jpg) no-repeat 0 0;
}
div#ps ul a#psa6:focus, div#ps ul a#psa6:active {
  background : #444 url(images/ps_girl_on.jpg) no-repeat 0 0;
}

/* set backgrounds for each state */
div#ps ul a#psa7 {
  background : #000 url(images/ps_bones.jpg) no-repeat 0 0;
}
div#ps ul a#psa7:hover {
  background : #222 url(images/ps_bones_over.jpg) no-repeat 0 0;
}
div#ps ul a#psa7:focus, div#ps ul a#psa7:active {
  background : #444 url(images/ps_bones_on.jpg) no-repeat 0 0;
}

/* set backgrounds for each state */
div#ps ul a#psa8 {
  background : #000 url(images/ps_shroom.jpg) no-repeat 0 0;
}
div#ps ul a#psa8:hover {
  background : #222 url(images/ps_shroom_over.jpg) no-repeat 0 0;
}
div#ps ul a#psa8:focus, div#ps ul a#psa8:active {
  background : #444 url(images/ps_shroom_on.jpg) no-repeat 0 0;
}

/* set fous position (width and height will match big photo size and list row width */
div#ps ul a#psa1:focus, div#ps ul a#psa1:active, div#ps ul a#psa2:focus, div#ps ul a#psa2:active, div#ps ul a#psa3:focus, div#ps ul a#psa3:active, div#ps ul a#psa4:focus, div#ps ul a#psa4:active, div#ps ul a#psa5:focus, div#ps ul a#psa5:active, div#ps ul a#psa6:focus, div#ps ul a#psa6:active, div#ps ul a#psa7:focus, div#ps ul a#psa7:active, div#ps ul a#psa8:focus, div#ps ul a#psa8:active { 
  width : 260px; /* adjust this only when changing thumbnail sizes */
  height : 200px;
  position : absolute;
}

/* this needs to be in conditional comment for IE only */
div#ps ul a#psa1:focus, div#ps ul a#psa1:active, div#ps ul a#psa2:focus, div#ps ul a#psa2:active, div#ps ul a#psa3:focus, div#ps ul a#psa3:active, div#ps ul a#psa4:focus, div#ps ul a#psa4:active, div#ps ul a#psa5:focus, div#ps ul a#psa5:active, div#ps ul a#psa6:focus, div#ps ul a#psa6:active, div#ps ul a#psa7:focus, div#ps ul a#psa7:active, div#ps ul a#psa8:focus, div#ps ul a#psa8:active {
  margin-top : 150px; /* adjust this only when changing thumbnail sizes */
  margin-left : 0; /* adjust this as rows get longer */
}
