/*Page Setup*/

body {
      background-color: #003333;
      color: black;
			text-align: center;
			position: relative;
					z-index: 0;
					width: 1010px;
					margin: auto;
					text-align: center;
			}
							
#masthead {
          width: 990px;
					height: 110px;
					background: url("../graphics/storyheader.jpg") no-repeat bottom;
					text-align: center;
					margin: auto;
					position: relative;
					z-index: 1;
          }		
					

 						 
#container {
            width: 850px;
						margin: 0 auto;
						border-left: solid 20px #663300;
						border-right: solid 20px #663300;
						background: #330000;
						text-align: center;
						position: relative;
					  z-index: 0;
						}
						
.shelf {
        height: 230px;
				border-bottom: solid 12px #663300;
				border-left: solid 1px black;
				border-right: solid 1px black;
				position: relative;
				z-index: 0;
				padding: 0;
				background: url("../graphics/shelf.jpg") no-repeat bottom;
				}
			
/*Books*/	
.bookOutline {
              border: solid 1px gray;
							}
					
#dddspine,
#goldspine,
#venusspine,
#tallspine,
#barryspine,
#boardspine {
        position: relative;
				z-index: 0;
				bottom: -7px;
				padding-bottom: 0;
				}
				
#dddBox {
position: absolute;
left: 180px;
}

#barryBox {
position: absolute;
left: 400px;
}

#venusBox {
position: absolute;
left: 440px;
}

#tallBox {
position: absolute;
left: 100px;
}
#goldBox {
position: absolute;
left: 230px;
bottom: 4px;
}

#boardBox {
position: absolute;
left: 550px;
bottom: 4px;
}

#frog,
#mug,
#fats,
#sheep,
#poot,
#bing,
#butterfly,
#brick,
#yeti,
#maisy,
#bongo,
#clanger {
display: none;
}

				
.spineLink {
text-decoration: none;
margin-right: 10px;
}
				
.bookText {
            font: bold 12px arial, sans-serif;
            color: white;
            margin: auto;
            text-align: center;
						background: black;
						margin: 0;
            }					



				

/*Death Doom*/
#dddcover,
#dddback,
#dddframe
        {
        position: absolute;
				z-index: 3;
				left: 220px;
				top: 80px;
				display: none;
        }

  #dddBackFrame {
                 height: 300px;
                 width: 208px;
                 background: url("../graphics/dddback.jpg") no-repeat right;
                 }

  #ddd {
        height: 300px;
        width: 208px;
        background: #336600 url(../graphics/dddheader.jpg) no-repeat top;
        }

  .dddLink {
            color: white;
            font: bold 12px arial, sans-serif;
            }
		
  #dddlinks1 {
              width: 100px;
              float: left;
              clear: left;
							text-align: right;
							margin-right: 4px;
							margin-top: 4px
              }

  #dddlinks2 {
              width: 100px;
              float: left;
							text-align: left;
							margin-left: 4px;
							margin-top: 4px
              }	

/*Goldilocks*/
  #goldcover,
	#goldback,
	#goldframe 
        {
        position: absolute;
				z-index: 3;
				left: 220px;
				top: 280px;
				display: none;
        }
				
	#goldBackFrame {
                 height: 300px;
                 width: 208px;
                 background: black;
                 }				

	#goldilocks {
               height: 300px;
               width: 208px;
               background: gray;
               }

	.goldLink:link,
	.goldLink:visited {
            font: bold 12px arial, sans-serif;
						color: black;
						}
												 

  .goldLink:link:hover, .goldLink:visited:hover {color: white;}

  #goldlinks1 {
               width: 100px;
               float: left;
               clear: left;
							 text-align: right;
							 margin-right: 4px;
							 }
  
	#goldlinks2 {
               width: 100px;
               float: left;
							 text-align: left;
							 margin-left: 4px;
							 }						 
							 
/*Venus*/		
  #venuscover,
	#venusback,
	#venusframe 
        {
        position: absolute;
				z-index: 3;
				left: 430px;
				top: 80px;
				display: none;
        } 
				
	#venusBackFrame {
                 height: 300px;
                 width: 208px;
                 background: black url(../graphics/venusback.jpg) no-repeat top;
                 }		
								 
	#venus {
          background-color: black;
          color: white;
					 height: 300px;
           width: 208px;
					 border: solid 1px gray;
					}					 
				
	.venusLink:link {
	          color: white;
            font: italic 14px 'Times New Roman', serif;
						}
	

	
	
/*Tall Story*/
   #tallcover,
   #tallback,
   #tallframe
        {
        position: absolute;
				z-index: 3;
				left: 120px;
				top: 280px;
				display: none;
        }
				
				
		#tallBackFrame {
                 height: 300px;
                 width: 208px;
                 background: url(../graphics/tallback.jpg) no-repeat top;
                 }	
				
					
/*Barry*/
   #barrycover,
   #barryback,
   #barryframe
        {
        position: absolute;
				z-index: 3;
				left: 355px;
				top: 80px;
				display: none;
        }			
					
	#barryBackFrame {
                 height: 300px;
                 width: 208px;
                 background: url(../graphics/barryback.jpg) no-repeat top;
                 }	
								 
/*Board*/
   #boardcover,
   #boardback,
   #boardframe
        {
        position: absolute;
				z-index: 3;
				left: 560px;
				top: 280px;
				display: none;
        }			
					
	#boardBackFrame {
                 height: 300px;
                 width: 208px;
                 background: red;
                 }						 
		
/*Text*/
			
					 
h1 {font: 35px "Times New Roman", serif; 
	 color: #330000; 
	 text-align: center;
	 margin-top: 39px;
	}
		
#url {font: 35px "Times New Roman", serif; 
	 color: #330000; 
	 text-align: center;
	 margin-top: 0;
	 	}
				
h3 {font: italic 18px Times New Roman, serif; 
	 color: #663399; 
	 text-align: center;
    }				
		
h4 {font: bold 12px verdana, sans-serif; 
	 text-align: left;
	 padding: 0 18px;
	 margin-bottom: 0;
    }			

p {
   font: small verdana, sans-serif; 
	 color: black; 
	 text-align: justify;
	 padding: 0 18px;
	 margin-top: 0;
	 }
	 
	 
#copyright {
           font: 10px verdana, sans-serif; 
	         color: silver; 
	         text-align: center;
					 margin: auto;
					 }


/*---------------------------------------------------------------*/
/*Graphics*/
#articleLogo {
              position: absolute;
					    z-index: 1;
							left: 0;
							}

#articleUrl {
             clear: both;
						 width: 870px;
					   height: 110px;
					   background: url("../graphics/storyheader.jpg") no-repeat bottom;
					   text-align: center;
					   margin: 0 auto;
						 position: relative;
					   z-index: 0;
						 border-left: solid 5px #330000;
						 border-right: solid 5px #330000;
						 }



/*---------------------------------------------------------------*/
/*Navigation*/

a:link {color: white;}
a:link:visited {color: white;}
a:active {color: red;}
a:link:hover, a:visited:hover {color: silver;}
a img {border: none;}

.navLink:link, .navLink:visited {
          color: #330000;
					padding: 0.3em 0.8em;
					
					text-decoration: none;
					display: block;
					float: left;
					margin-right: 4px;
					border: solid 1px #330000;
				 }

.navLink2:link, .navLink2:visited {
          color: #663300;
					padding: 0.3em 0.8em;
					background: #330000;
					text-decoration: none;
					display: block;
					float: left;
					margin-right: 4px;
				 }
				  
.navLink:link:hover,
.navLink:visited:hover,  
.navLink:link:focus,
.navLink:visited:focus   {
                                                  color: white; 
                                                  border: solid 1px white;
																									
																									}                                                

.navLink2:link:hover,
.navLink2:visited:hover,
.navLink2:link:focus,
.navLink2:visited:focus  {
                                                  color: white;
																									
																									
																									 }
			
#navLev1 {
          position: absolute;
          z-index: 2;
					top: 1.2em;
					left: 270px;
					width: 52em;
					text-align: left;
          }
	
#navLev2 {
          position: absolute;
          z-index: 3;
					top: 2.8em;
					left: 295px;
					width: 52em;
					text-align: left;					
					}
				 
		
#navBar {
					font: bold small verdana, sans-serif;
				}				
				

#guestbook {
border: none;
float: left;
background-color: #990000;
margin-right: 4px;
display: none;
width: 7.5em;
overflow: hidden;
text-align: center;
padding: 0;
          }

#votebongo {position: absolute; top: 10px; right: 40px; z-index: 4;}