/* ----------------------------------------------------
color selection 
----------------------------------------------------- */
	/* body is outside the margins of the #container that has stuff on it.
h1 is not used except in the header, so markup is #header h1
h2 is the nice large width separator used e.g. in guestbook
h3 are the titles that are on the top of the page and aligned right
*/ /* navigation */
#navigation li .here,#navigation a:hover {
	background-color: rgb(47, 94, 170); /* #9191FF; */
	color: white !important;
}

#navigation a:link,#navigation a:visited {
	color: black;
}

#navigation .separator {
	border-left-color: blue;
	color: #e17009; /* orangey, same as jquery-ui */
}

#navigation .separator.noborder {
	border-left: none;
}

#navigation a {
	border-left-color: blue;
}

/* backgrounds */
body,#container,#header h1 {
	background-color: white; /* #F8F7EE; */
}

#footer {
	background-color: white;
}

input.button,.button {
	background-color: #9191FF; /* #CAD3A7; */
}

h2, fieldset,fieldset legend,fieldset.dashed legend {
	background-color: #EFEFFF;
}

input.button:hover {
	background-color: #eef;
}

/* text colors */
#container {
	color: #666;
}

h2 {
	color: #e17009;
}
a,fieldset.boxtitle {
	color: blue; /* #6A633E; */
}

p.alert {
	color: red;
}

#guestbookEntry h1,input,fieldset input,input.button,.button {
	color: black;
}

#footer p,#footer p a:hover,a:hover {
	color: black;
}

#footer p a {
	color: blue;
}

/* borders */
fieldset,fieldset legend,fieldset.dashed,fieldset.dashed legend {
	border-color: blue; /* #CAD3A7; */
}

input.button,.button {
	border-color: #242424;
}

#guestbookEntry {
	border-color: gray;
	background-color: white;
}

/*-- end of color section --*/ /* ----- CONTAINER ----- */
body { /* background-color: #F8F7EE; */ /* now moved to color section */
	/* font-size: 1em; */
	
}

#container {
	width: 59em; /*  750px; */ /* __EM__ */
	margin: 0 auto;
	font-family: "Lucida Grande", Tahoma, Arial, Helvetica, sans-serif;
	/* Lucida Grande for the Macs, Tahoma for the PCs */
	font-size: 1em;
	line-height: 1.6em;
	/* color: #666; */
	/* background-color: #F8F7EE; */ /* now moved to color section */
}

ul { list-style-type: square; }
ul ul { list-style-type: disc; }
ul ul ul { list-style-type: circle; }
ul ul ul ul { list-style-type: none; }

/* GENERAL MOJO AND MULA */
#header h1 {
	font-family: Arial, Helvetica, sans-serif;
	font-weight: normal;
	margin-bottom: 3px;
	/* color: #CC6633; */ /* now moved to color section */
	/* background-color: #F8F7EE; */ /* now moved to color section */
}

h2 {
	text-align: left;
	padding: 5px;
	font-size: 120%;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	padding: 5px;
	/* color: #6A633E; */ /* now moved to color section */
	/* background-color: #E4E1D1; */ /* now moved to color section */
}

.topOfPage {
	text-align: right;
	text-decoration: none;
	float: right;
	font-size: 75%;
	font-weight: bold;
}

.topOfPage a {
	text-decoration: none;
	font-size: 75%;
	font-weight: bold;
}

.topOfPage a.link,.topOfPage a.hover,.topOfPage a.visited,.topOfPage a.active
	{
	text-decoration: none;
	font-size: 75%;
	font-weight: bold;
	color: green;
}

h3 {
	font-size: 120%;
	/* font-family: "Courier New", Helvetica, Arial, sans-serif; */
	font-size: 140%;
	font-weight: bold;
	/* text-align: right; */
	display: block;
	font-variant: small-caps;
	/* margin-right: 20px; */
	/* border-bottom: double 3px black; */
	margin-top: 10px;
	margin-bottom: 10px;
}

/*form .lower {
	margin-top: 0px;
}*/

/* form#backToHomepage is for the form that
contains the "back to homepage" button,
typically a second form in a fieldset */
form#backToHomepage {
	margin-top: 10px;
}
form#backToHomepage input { /* button */
	width: 23em;
}

/* used e.g. on guestbook page, shows links that are
right-aligned */
.rightAlignNavLinks {
	text-align: right;
	margin:0;
	padding:0;
	}

div#recaptchaNoJavascript {
	border-style: solid;
	border-width: 1px;
	border-color: black;
	margin: 20px;
	padding: 10px;
}
input.hiddenInput {
	/* use this because the general input one sets a background color
	that's supposed to be used by text, password, etc input fields */
	background: none;
	border: none;
}
input {
	background-color: #FFF;
	color: #999999;
	border: 1px solid #CCC;
	font-size: 1em;
	padding: 3px;
	text-align: left;
}

input.button,.button {
	border-style: solid;
	border-width: 1px 3px 3px 1px;
	padding: 2px;
	margin: 2px;
}

/* HEADER ELEMENTS */
#header {
	border-bottom-width: 5px;
	border-bottom-style: solid;
	padding-top: 5px;
	clear: both;
	margin-bottom: 5px;
}

#header,#header a {
	color: black;
	text-decoration: none;
}

.otherColor {
	color: blue;
}

.dotCom {
	font-family: "Courier New";
	font-variant: normal;
}

#header.otherColor,#header a.otherColor {
	color: blue;
}

#header h1 {
	font-family: Helvetica, sans-serif;
	font-weight: bold;
	font-size: 2em;
}

/* the slogan */
#header p {
	margin-top: 5px;
	margin-left: 0px;
}

/* NAVIGATION ELEMENTS */
#navigation ul {
	margin-left: 0;
	padding-left: 0;
	list-style-type: none;
	float: left;
}

#navigation ul,navigation a {
	width: 12em;
}

#navigation .separator {
	margin-top: 15px;
	margin-bottom: 10px;
	padding-left: 5px;
	font-variant: small-caps;
	text-decoration: underline;
	font-weight: bold;
	border-left-style: solid;
	border-left-width: 10px;
}

#navigation a {
	display: block;
	padding: 5px;
	border-bottom-style: solid;
	border-bottom-width: 1px;
}

#navigation a:link,#navigation a:visited {
	text-decoration: none;
}

#navigation a:hover {
	background-image: url('graphics/arrow.gif');
	background-repeat: no-repeat;
	background-position: 96% 50%;
}

.center {
	text-align: center;
}

/* ----- CONTENTBOX ----- 
contentbox encompasses either:
1. content plus sidebar
2. secondarycontent
The navigation is to the left of the contentbox.
*/
#contentbox {
	margin-top: 20px;
	text-align: justify;
}

/* ----- CONTENT ELEMENTS ----- */ 

/*
#content {
	width: 30em; 
	margin-left: 12em;
	margin-right: 12em; 
}
*/
#content p {
	padding: 5px;
}

/* ----- CONTENT ELEMENTS FOR SECONDARY PAGES ----- */ /*
#secondarycontent {
	width: 47em;
	margin-left: 12em; 
	margin-right: 0; 
}
*/ /* ----- SIDEBAR ELEMENTS ----- */ /*
#sidebar {
	float: right;
	width: 15em; 
}
*/
#sidebar p {
	padding-bottom: 10px;
	/*
	border-bottom-style: solid;
	border-bottom-width: 1px;
	*/
	text-align: justify;
}

/* ----- GENERAL TEXT RULES ----- */
p.alert {
	font-style: italic;
}

/* ----- FOOTER ELEMENTS ----- */
#footer {
	border-top-style: solid;
	border-top-width: 1px;
	border-top-color: black;
	margin-top: 0px;
	clear: both;
	padding: 0px 5px 0px 5px;
	margin-top: 0px;
}

#footer p {
	padding: 2px;
	text-align: right;
	display: inline;
}

#footer .footNote {
	text-align: right;
	/* width: 28em; */
	float: right;
}

#footer div#footerPictures {
	text-align: left;
}

#footer div#footerPictures .footerPic {
	float: left;
	margin: 2px;
	height: 35px;
}
#footer div#footerPictures .footerPic img {
	border: none;
}

/* ----- FIELDSET DASHED ----- */
fieldset.dashed {
	font-size: 1em;
	border-style: dashed;
	border-width: 1px;
	/* width: 50em; */
	margin-left: 30px;
}

fieldset.dashed legend { /* background-color: #F8F8F8;  */
	/* now moved to color section */
	border-style: dashed;
	border-width: 1px;
	/* border-color: #BFB893; */ /* now moved to color section */
	padding-top: 0px;
	padding-right: 10px;
	padding-bottom: 0px;
	padding-left: 10px;
}

fieldset.boxtitle { /* color: #6A633E; */
	/* now moved to color section */
	text-decoration: none;
	font-weight: bold;
	font-size: 1em;
}

/* as figured out for the SF site... */
input { /* color: black; */ /* now moved to color section */
	
}

/* ----- fieldset ----- */
fieldset {
	margin: 0;
	padding: 15px;
	/* background-color: #edf2db; */ /* now moved to color section */
	font-size: 90%;
}

fieldset label {
	display: block;
	float: left;
	clear: both;
	width: 9em;
	padding-right: 1em;
	text-align: right;
}

fieldset input {
	display: block;
	width: 15em;
	padding: 4px;
	/* color: black;  */ /* now moved to color section */
}

fieldset legend {
	border-style: solid;
	border-width: 1px;
	padding-right: 15px;
	padding-left: 15px;
	font-weight: bold;
	padding-bottom: 5px;
	padding-top: 5px;
}

/* ----- GUEST BOOK POSTS ----- */
#guestbookView {
	margin-left: 40px;
}

#guestbookEntry {
	margin-top: 5px;
	border-style: dotted;
	border-width: 1px;
	/* border-color: gray; */ /* now moved to color section */
	/* background-color: white; */ /* now moved to color section */
	padding: 5px;
}

#guestbookEntry h1 {
	text-decoration: underline;
	font-size: 110%;
	/* color: black; */ /* now moved to color section */
	font-weight: bold;
}

#guestbookEntry p {
	margin: 0;
}

/* ----- Other ----- */
	/* use this for right-flush e.g. "top" links (right under <h2>) 
to refer back to the top of the page */
.rightFloat {
	margin-top: -35px;
	font-size: 100%;
	font-weight: bold;
	font-variant: small-caps;
	text-decoration: none;
	border: none;
	padding-left: 1ex;
	padding-right: 1ex;
	float: right;
	text-align: right;
	width: 50%;
}

.clear {
	clear: both;
}
