@charset "utf-8";
body  {
	font: 12px helvetica, verdana;
	margin: 0 auto; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
	padding: 0;
	text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
	color: #1c252a;
	 background-color: #2e3e47;
}
.twoColFixLtHdr #container { 
	width: 900px;  /* using 20px less than a full 800px width allows for browser chrome and avoids a horizontal scroll bar */
	 background-color: #486e84;
	margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
	padding: 0;
	border: 1px solid #000000;
	text-align: left; /* this overrides the text-align: center on the body element. */
} 


.twoColFixLtHdr #sidebar2 {
	float: left; /* since this element is floated, a width must be given */
	width: 250px; /* the actual width of this div, in standards-compliant browsers, or standards mode in Internet Explorer will include the padding and border in addition to the width */
	background: #aac6f6; /* the background color will be displayed for the length of the content in the column, but no further */
	padding: 0px 0px 10px 10px;
	margin: 10px 0 10px 5px;
	text-align: left;
}
.twoColFixLtHdr #mainContent { 
	margin: 10px 10px 10px 275px; /* the left margin on this div element creates the column down the left side of the page - no matter how much content the sidebar1 div contains, the column space will remain. You can remove this margin if you want the #mainContent div's text to fill the #sidebar1 space when the content in #sidebar1 ends. */
	padding: 10px 10px 10px 10px; /* remember that padding is the space inside the div box and margin is the space outside the div box */
	background: #aac6f6;
	
} 


.twoColFixLtHdr #buttons {
position: absolute;
	top: 0px;
	left: 0px;
	 
	margin: 10px 10px 10px 280px; /* the left margin on this div element creates the column down the left side of the page - no matter how much content the sidebar1 div contains, the column space will remain. You can remove this margin if you want the #mainContent div's text to fill the #sidebar1 space when the content in #sidebar1 ends. */
	padding: 10px 10px 10px 10px; /* remember that padding is the space inside the div box and margin is the space outside the div box */
	background: #cccccc;
	
} 




.twoColFixLtHdr #content1 {
	
	
	float: left; /* since this element is floated, a width must be given */
	width: 200px; /* the actual width of this div, in standards-compliant browsers, or standards mode in Internet Explorer will include the padding and border in addition to the width */
	background: #cccccc; /* the background color will be displayed for the length of the content in the column, but no further */
	padding: 0px 0px 0px 0px;
	margin: 0px 0 0px 0px;
	text-align: center;
}


.twoColFixLtHdr #content2 {
	float: left; /* since this element is floated, a width must be given */
	width: 212px; /* the actual width of this div, in standards-compliant browsers, or standards mode in Internet Explorer will include the padding and border in addition to the width */
	background: #486E84; /* the background color will be displayed for the length of the content in the column, but no further */
	padding: 0px 0px 0px 0px;
	margin: 0px 0 0px 0px;
	text-align: left;
}



.twoColFixLtHdr #footer { 

	padding: 5px 0 5px 0; /* this padding matches the left alignment of the elements in the divs that appear above it. */
	text-align: center;
	background-image:  url("http://www.peterelbling.com/images/titles/PeterElblingFooter.jpg");
background-repeat: no-repeat;
	 
} 
.twoColFixLtHdr #footer p {
	margin: 0; /* zeroing the margins of the first element in the footer will avoid the possibility of margin collapse - a space between divs */
	padding: 10px 0; /* padding on this element will create space, just as the the margin would have, without the margin collapse issue */
}




.fltrt { /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
	float: right;
	margin-left: 8px;
}
.fltlft { /* this class can be used to float an element left in your page */
	float: left;
	margin-right: 8px;
}
.clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}
img {
	/*border-style: solid;
	border-color: #2e3e47;*/
	border-width:0px;
	margin: 0px 0px 0px 0px 
	}
	
	#photo img { 
	border-style: solid;
	border-color: #000000;
	border-width:1px;
	
} 
	
	.hidden {
display: none;}

.headline {
font-family: Verdana, Helvetica, sans-serif; 
font-size: 18px; 
font-style: normal; 
font-weight: bold;
text-decoration:underline;
color:#AAC6F6;
background-color: #2E3E47; 
}


<style type="text/css">

/*Credits: Dynamic Drive CSS Library */
/*URL: http://www.dynamicdrive.com/style/ */


.spacer {
position: absolute;
top: 72px;
left:  1px;

}

.spacer :hover{
position: absolute;
top: 72px;
left:  1px;
background-color: transparent;

}

.spacer span{ /*CSS for enlarged image*/
position: absolute;
top:0px;
left:  0px;
background-color: #2e3e47;
padding: 0px;

border: 0px ;
visibility: hidden;
color: black;
text-decoration: none;
}

.spacer span img{ /*CSS for enlarged image*/
position: absolute;
border-width: 0;
}

.spacer :hover span{ /*CSS for enlarged image on hover*/
position: absolute;
visibility: visible;
top: -72px;
left: -1px; /*position where enlarged image should offset horizontally */

}









.home{
position: absolute;
top: 72px;
left:  1px;

}

.home:hover{
position: absolute;
top: 72px;
left:  1px;
background-color: transparent;

}

.home span{ /*CSS for enlarged image*/
position: absolute;
top:0px;
left:  0px;
background-color: #2e3e47;
padding: 0px;

border: 0px ;
visibility: hidden;
color: black;
text-decoration: none;
}

.home span img{ /*CSS for enlarged image*/
position: absolute;
border-width: 0;
}

.home:hover span{ /*CSS for enlarged image on hover*/
position: absolute;
visibility: visible;
top: -72px;
left: -1px; /*position where enlarged image should offset horizontally */

}








.writer{
position: absolute;
top: 72px;
left:  72px;

}

.writer:hover{
position:absolute;
background-color: transparent;

}

.writer span{ /*CSS for enlarged image*/
position:absolute;
top:0px;
left:  0px;
background-color: #2e3e47;
padding: 0px;

border: 0px ;
visibility: hidden;
color: black;
text-decoration: none;
}

.writer span img{ /*CSS for enlarged image*/
position: absolute;
border-width: 0;
}

.writer:hover span{ /*CSS for enlarged image on hover*/
position: absolute;
visibility: visible;
top: -72px;
left: -72px; /*position where enlarged image should offset horizontally */

}


.performer{
position: absolute;
top: 72px;
left:  134px;

}

.performer:hover{
position: absolute;
background-color: transparent;

}

.performer span{ /*CSS for enlarged image*/
position:absolute;
top:0px;
left:  0px;
background-color: #2e3e47;
padding: 0px;

border: 0px ;
visibility: hidden;
color: black;
text-decoration: none;
}

.performer span img{ /*CSS for enlarged image*/
position: absolute;
border-width: 0;
}

.performer:hover span{ /*CSS for enlarged image on hover*/
position: absolute;
visibility: visible;
top: -72px;
left: -134px; /*position where enlarged image should offset horizontally */

}



.actor{
position: absolute;
top: 72px;
left:  233px;

}

.actor:hover{
position:absolute;
background-color: transparent;

}

.actor span{ /*CSS for enlarged image*/
position:absolute;
top:0px;
left:  0px;
background-color: #2e3e47;
padding: 0px;

border: 0px ;
visibility: hidden;
color: black;
text-decoration: none;
}

.actor span img{ /*CSS for enlarged image*/
position: absolute;
border-width: 0;
}

.actor:hover span{ /*CSS for enlarged image on hover*/
position: absolute;
visibility: visible;
top: -72px;
left: -233px; /*position where enlarged image should offset horizontally */

}


.director {
position: absolute;
top: 72px;
left:  294px;

}

.director :hover{
position:absolute;
background-color: transparent;

}

.director span{ /*CSS for enlarged image*/
position:absolute;
top:0px;
left:  0px;
background-color: #2e3e47;
padding: 0px;

border: 0px ;
visibility: hidden;
color: black;
text-decoration: none;
}

.director span img{ /*CSS for enlarged image*/
position: absolute;
border-width: 0;
}

.director:hover span{ /*CSS for enlarged image on hover*/
position: absolute;
visibility: visible;
top: -72px;
left: -294px; /*position where enlarged image should offset horizontally */

}



.songwriter{
position: absolute;
top: 72px;
left:  377px;

}

.songwriter:hover{
position:absolute;
background-color: transparent;

}

.songwriter span{ /*CSS for enlarged image*/
position:absolute;
top:0px;
left:  0px;
background-color: #2e3e47;
padding: 0px;

border: 0px ;
visibility: hidden;
color: black;
text-decoration: none;
}

.songwriter span img{ /*CSS for enlarged image*/
position: absolute;
border-width: 0;
}

.songwriter:hover span{ /*CSS for enlarged image on hover*/
position: absolute;
visibility: visible;
top: -72px;
left: -377px; /*position where enlarged image should offset horizontally */

}


.forchildren{
position: absolute;
top: 72px;
left:  476px;

}

.forchildren:hover{
position:absolute;
background-color: transparent;





}

.forchildren span{ /*CSS for enlarged image*/
position:absolute;
top:0px;
left:  0px;
background-color: #2e3e47;
padding: 0px;

border: 0px ;
visibility: hidden;
color: black;
text-decoration: none;
}

.forchildren span img{ /*CSS for enlarged image*/
position: absolute;
border-width: 0;
}

.forchildren:hover span{ /*CSS for enlarged image on hover*/
position: absolute;
visibility: visible;
top: -72px;
left: -476px; /*position where enlarged image should offset horizontally */

}




.mrvinegar{
position: absolute;
top: 72px;
left:  590px;

}

.mrvinegar:hover{
position:absolute;
background-color: transparent;

}

.mrvinegar span{ /*CSS for enlarged image*/
position:absolute;

top:0px;
left:  0px;
background-color: #2e3e47;
padding: 0px;

border: 0px ;
visibility: hidden;
color: black;
text-decoration: none;
}

.mrvinegar span img{ /*CSS for enlarged image*/
position: absolute;
border-width: 0;
}

.mrvinegar:hover span{ /*CSS for enlarged image on hover*/
position: absolute;
visibility: visible;
top: -72px;
left: -590px; /*position where enlarged image should offset horizontally */

}





.obituaries{
position: absolute;
top: 72px;
left:  690px;

}

.obituaries:hover{
position:absolute;
background-color: transparent;

}

.obituaries span{ /*CSS for enlarged image*/
position:absolute;
top:0px;
left:  0px;
background-color: #2e3e47;
padding: 0px;

border: 0px ;
visibility: hidden;
color: black;
text-decoration: none;
}

.obituaries span img{ /*CSS for enlarged image*/
position: absolute;
border-width: 0;
}

.obituaries:hover span{ /*CSS for enlarged image on hover*/
position: absolute;
visibility: visible;
top: -72px;
left: -690px; /*position where enlarged image should offset horizontally */

}





.bio{
position: absolute;
top: 72px;
left:  787px;

}

.bio:hover{
position:absolute;
background-color: transparent;

}

.bio span{ /*CSS for enlarged image*/
position:absolute;
top:0px;
left:  0px;
background-color: #2e3e47;
padding: 0px;

border: 0px ;
visibility: hidden;
color: black;
text-decoration: none;
}

.bio span img{ /*CSS for enlarged image*/
position: absolute;
border-width: 0;
}

.bio:hover span{ /*CSS for enlarged image on hover*/
position: absolute;
visibility: visible;
top: -72px;
left: -787px; /*position where enlarged image should offset horizontally */

}







.store{
position: absolute;
top: 72px;
left:  828px;

}

.store:hover{
position:absolute;
background-color: transparent;

}

.store span{ /*CSS for enlarged image*/
position:absolute;
top:0px;
left:  0px;
background-color: #2e3e47;
padding: 0px;

border: 0px ;
visibility: hidden;
color: black;
text-decoration: none;
}

.store span img{ /*CSS for enlarged image*/
position: absolute;
border-width: 0;
}

.store:hover span{ /*CSS for enlarged image on hover*/
position: absolute;
visibility: visible;
top: -72px;
left: -828px; /*position where enlarged image should offset horizontally */

}

</style>