/* CSS Document */

body {
	background-color: #BAA483;
}
#navBarContainer{
	position: absolute;
	height: 26px;
	width: 100%;
	left: 0px;
	top: 0px;
	z-index: 100;
	border: 2px solid #663300;
}
#navBarBkg{
	position: absolute;
	height: 24px;
	width: 100%;
	left: 0px;
	top: 1px;
}
#navBar{ 
	position: absolute;
	height: 24px;
	width: 650px;
	left: 0px;
	top: 0px;	
}

/* mainContentContainer is just "as is" -- it can't be positioned because if
it is, the textContainer ignores it.  It doesn't need to be floated, because
it is right where it is supposed to be, right under the navBar. */
#mainContentContainer{
	height: 100%;
	width: 100%;
	left: 0px;
	top: 30px;
	padding-top: 30px;
	z-index: 10;
}
/* mainContent is nested inside of mainContentContainer -- it is floated left 
-- it needs to be 565 pixels in height to extend down and cover words to keep
textContainer from flowing up and covering words in some brower positions*/
#mainContent {
	float: left;
	height: 565px;
	width: 390px;
}
/* Auggie_talk is nested inside of mainContent*/

#Auggie_talk {
	height: 403px;
	width: 396px;
	/*border: 3px solid #FF0000;*/
}
/* Auggie_talk p is nested inside of Auggie_talk */
#Auggie_talk p {
	font: bold 0.6em Verdana, Arial, Helvetica, sans-serif;
	color: #663300;
	width: 390px;
	margin-top: 5px;
}
/* gallery is nested inside of mainContentContainer -- it flows 
to the right of mainContent inside mainContentContainer -- it needs
a 420 pixel left margin to keep it from flowing under mainContent*/
#gallery {
	margin-left: 420px;	
}
/* figure is nested inside of gallery -- it is floated left, thus
all the figures float left in turn inside of gallery -- this what
makes the gallery work, adjust the the browser */
.figure {
	float: left;
	margin: 0px 10px 30px 10px;
}
/* photo is nested inside of figure --  
could be used for bkgr image */
.photo {
	width: 150px;
	height: 150px;
	border: solid 2px #663300;
}
/* photo img is inside of photo -- can use background-color, 
padding thing and/or border (above) */
.photo img {
	/*background-color: #660000;
	padding: 2px;*/
}
/* figure p is inside of figure */
#gallery .figure p{
	position: absolute;
	text-align: center;
	font: bold 0.6em Verdana, Arial, Helvetica, sans-serif;
	color: #663300;
	width: 150px;
	margin-top: 0px;
}

.figure p a:link, a:visited  {
text-decoration: none;
color: #663300;
}
.figure p a:hover {
text-decoration: none;
color:#875100;
}
.figure p a:active {
text-decoration: none;
color: #663300;
}

/* textContainer is seperate, not nested with mainContentContainer or 
anything in it -- the clear: both; command keeps it from floating
up, keeps it at the bottom where it belongs */
#textContainer{
	clear: both;
	padding-top: 10px;
	height: 100%;
	width: 100%;
	
}
#textFloatSpacerLt {
	float: left;
	background-color: #BAA483;
	height: 400px;
	width: 15%;
	margin-right: 10px;
}
#textFloatSpacerRt {
	float: right;
	background-color: #BAA483;
	height: 400px;
	width: 15%;
	margin-left: 10px;
}

#text {
	border: 2px solid #663300;
	background-color: #D8CCBA;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-style: normal;
	color: #663300;
	line-height: 16px;
	padding: 10px;
	margin-top: 10px;
	margin-bottom: 10px;
}

#notice{
	border: 2px solid #663300;
	background-color: #D8CCBA;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: normal;
	color: #663300;
	line-height: 6px;
	padding: 2px;
}