/* http://css-tricks.com/margin-0-padding-0-no-longer-cool/  */
/* reset all margins and padding to 0                        */
* {margin: 0; padding: 0;}

body   {
    /* 12px is the font size, 20px is the line spacing */
     font: 12px/20px verdana, Tahoma, helvetica, sans-serif;	
    /*  centers navigation and description texts       */
    text-align: center; 
    background:	#fffcf1;               /* #eaeaea;   */
       }


div#container{
    width:750px;
    /* top & bottom margins set to zero; horizontally center the container in the browser window.  */
    margin: 0 auto;  
    background: #FFFCF1;              /*  #F5F5F5;  */
    /* 6px padding arond inside perimeter of container box   */
    padding: 6px;  
    /* shadow box does not work in IE 8   */    
    box-shadow:10px 10px 20px #696969;
    -webkit-box-shadow:10px 10px 20px #696969;
    -moz-box-shadow: 10px 10px 20px #696969;
    
    border-style: solid;
    border-color: black;
    border-width: 1px;

    margin-top: 20px;


}

div#container4pics{
    width:850px;
    /* top & bottom margins set to zero; horizontally center the container in the browser window.  */
    margin: 0 auto;  
    background: #FFFCF1;              /*  #F5F5F5;  */
    /* 6px padding arond inside perimeter of container box   */
    padding: 6px;  
    /* shadow box does not work in IE 8   */    
    box-shadow:10px 10px 20px #696969;
    -webkit-box-shadow:10px 10px 20px #696969;
    -moz-box-shadow: 10px 10px 20px #696969;
    
    border-style: solid;
    border-color: black;
    border-width: 1px;

    margin-top: 20px;
}



div#header   {
    background: #FFFCF1;          /*  #F5F5F5;  */
    margin-top: 10px;
    font: 26px Verdana, Helvetica, sans-serif; 
    font-weight:bold;
	letter-spacing: 2px;
    padding-top: 4px;
    padding-bottom: 8px;
    color: green;
	}
	

img.indexthinborder  {
    /* used for the main image on index.html   */
    border: solid 1px black;
    /* the padding is the border area between the photo and the 1px black border  */
    padding: 3px;
    /* padding has the background color of the div, margins do not   */    
    margin-top: 7px;
    margin-bottom: 25px;
    /* shadow box does not work in IE 8   */    
    box-shadow:10px 10px 20px #696969;
    -webkit-box-shadow:10px 10px 20px #696969;
    -moz-box-shadow: 10px 10px 20px #696969;
   
}


img.indexcentered {                   
    /*  used for the title in the header  */
    /*  see http://www.w3.org/Style/Examples/007/center re display:block  */
    /*  can't put margin or padding here; it is done in the #content img.thinborder  */
    display: block; 
    margin-left: auto;
    margin-right: auto;
    
    }	
    

div#description   {
    background: #FFFCF1;         /* #F5F5F5;  */
    /* padding has the background color of the div, margins do not   */
    padding-top: 5px;
    padding-bottom: 12px;
    
        }

p.smallcaps { 
    /* used for the description div on index.html       */
    font-weight:400;
    font-size:130%;
    line-height: 100%;
    font-variant: small-caps;
    color: black;           
   
    }	

p.smallcapsred { 
    /* used for the description div on index.html       */
    font-weight:400;
    font-size:130%;
    line-height: 100%;
    font-variant: small-caps;
    color: red;           
   
    }	



div#navigation   {
    background: #F5F5F5;  
    /* padding has the background color of the div, margins do not   */    
    padding-top: 0px;
    padding-bottom: 12px;
    
        }	   
		
    
    
div#content {
    background: #FFFCF1;                       /*  #F5F5F5;  */
    
    }    

#content img.tree  {
   border: solid 1px black;
   padding: 0px;
   padding-right: 0px;
   margin: 0px;

}  

#content img.treeno  {
   border: none;
   padding: 0px;
   padding-right: 0px;
   margin: 0px;

}  

#content img.bullet  {
   border: none;
   padding: 0px;
   margin: 0px;
   
   
}  

div#content p {
    text-align:left;
    padding-right: 10%;
    padding-left: 10%;
    padding-top: 5px;
    padding-bottom: 10px;
    }
    
div#content p.blocktext {
    margin-left: auto;
    margin-right: auto;
    font: 12px/20px monospace;
    width: 74%;                         /* indents left and right  */
    
}    

div#content p.center {
    text-align: center;
    padding-right: 0px;
    padding-left: 0px;
    padding-top: 5px;
    padding-bottom: 10px;
    margin-top: 0px;
    }	

	
div#content p.table {
    text-align: center;
    padding-right: 0px;
    padding-left: 2px;
    padding-top: 5px;
    margin-top: 0px;
    }	
		
             
table   { 
    /*   to center a table --> http://theodorakis.net/tablecentertest.html   */
    margin-left: auto;
    margin-right: auto;
	border-color: 6c1414;
    }	
    
td
{
text-align:left;
}    
    
 
    		
		
div#footer   {
    clear:both;
    width:100%;
    background: #FFFCF1;
    padding-top:7px; 
    padding-bottom:7px
	}

div#counter   {
    clear:both;
    width:100%;
    color: black;                              /* #a9a9a9; */
    text-align: center;
	}
	
div#counter p  {
    margin:0px;
    padding:0px;
    padding-top:20px; 
	}	


div#footer p  {
    margin:0px;
    padding:0px
	}

div#footer a   {
    display:inline;
    padding:0;
    color: #ffcc66
	}

	
span.bullet   {
    color: 6c1414;
   }

span.graytext   {
    color: #a9a9a9; 
   }
   
span.yellowhighlighttext   {
    background-color: yellow;
   }   
   
span.boldheading   {
    color: 6c1414; 
    font-weight: bold;
   }   
   
span.lightgraytext   {
    color: #FFFCF1;          /* #dcdcdc;  */
   }   
   
span.boldtext
   {
   font-weight: bold;
   }	   

span.utext
   {
   text-decoration: underline;
   }	 

a {
    font-size:12px;
    text-decoration:none;
    font-weight:normal;
    font-family:verdana, arial, helvetica, sans-serif;
            
}

/* default links   */
a         { text-decoration: none} 
a:link    { color: green } 
a:visited { color: green } 
a:hover {color: black; background-color: #ffcc66;} 

/* setting up multiple schemes for links...   http://www.yourhtmlsource.com/stylesheets/csslinks.html  */	
/* these links aren't currently set to do anything different.  I was using them to show a background   */
/* border around the thumbnail but IE7 and FF2 work differently                                        */
a.nav         { text-decoration: none} 
a.nav:link    { color: black } 
a.nav:visited { color: black } 
a.nav:hover   {color: black; background-color: #ffcc66; }          /* #ADD8E6; usual green; */

a.thumbs:link {color: black; text-decoration: none; border:0 } 	  /* color: black isn't used here   */	  
a.thumbs:visited {color: black; text-decoration: none; border:0 }		  
a.thumbs:hover {color: black; text-decoration: none; border:0}

a.email         { text-decoration: none} 
a.email:link {color: #a9a9a9;}
a.email:visited {color: #a9a9a9;}
a.email:hover {color: #a9a9a9; background-color: white;} 

a.block         {font: 12px/20px monospace; text-decoration: underline} 
a.block:link    { color: navy } 
a.block:visited { color: purple } 
a.block:hover   {color: black; background-color: #ffcc66;}  

a.normal         { text-decoration: underline} 
a.normal:link    { color: blue } 
a.normal:visited { color: purple } 
a.normal:hover   {color: black; background-color: #ffcc66; text-decoration:none; } 


#content h1 { 
    text-align: center;
    
    font-size: 130%;
    line-height: 100%;
    font-variant: small-caps;
    color: green
	;
    margin-top: 0px;	
    padding-top: 10px;
    padding-bottom: 10px;
    }		
	
#content h2 {
    font: 14px Verdana, Helvetica, sans-serif; 
    letter-spacing: 2px;
    padding-top: 4px;
    padding-bottom: 8px;
    color: firebrick;
  
  }
  
 #content h4 {
    font: 24px Verdana, Helvetica, sans-serif; 
    font-weight:bold;
	letter-spacing: 2px;
    padding-top: 4px;
    padding-bottom: 8px;
    color: firebrick;
  
  }


ul {
    /*  don't put a list in a <p></p>    A list is a block element.  */
    /*  W3C: "The P element represents a paragraph. It cannot contain block-level elements (including P itself)."   */
    margin-top: 0px;
    padding-right: 12%;
    padding-left: 15%;
    padding-top: 0px;
    padding-bottom: 20px;
    list-style-type: disc;
    list-style-position: outside;
    text-align: left;
	
	}
	
li {
color: green;            /* bullet color */
}


#boxtext {
    position: relative; 
    text-align: center;
    padding-right: 0px;
    padding-left: 0px;
    padding-top: 10px;
    padding-bottom: 1px;
    margin: 0px auto;  
    margin-top: 30px;
    margin-bottom: 30px;
    background-color: #f0efe4;         
    border:1px solid #8B4513;
    width: 51%;
    

}